/*
 * Wiki pubblica Sellrapido — il foglio di stile UNICO: lo usano le pagine pubbliche (api/wiki/pubblica.ts) e l'editor
 * in contesto dell'area admin. Tutto vive sotto la classe `.wk` (il <body> delle pagine pubbliche, il riquadro della
 * pagina nell'editor): nell'app non tocca nient'altro. Valori misurati sulla wiki di HubSpot il 04/10/2026 (piano 11):
 * Hubot Sans 16px, testo #05213F, blu #0042A3, contenuto 1000px (menu 235px + articolo 704px), riquadri di HubSpot.
 */
@font-face { font-family: 'Hubot Sans'; font-style: normal; font-weight: 200 900; font-stretch: 75% 125%; font-display: swap;
  src: url('hubot-sans-latin-wght-normal.woff2') format('woff2-variations');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Hubot Sans'; font-style: normal; font-weight: 200 900; font-stretch: 75% 125%; font-display: swap;
  src: url('hubot-sans-latin-ext-wght-normal.woff2') format('woff2-variations');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

.wk {
  --wk-testo: #05213f;
  --wk-testo-2: #33475b;
  --wk-blu: #0042a3;
  --wk-fondo: #f9fdff;
  --wk-bordo: #e6e6e6;
  --wk-attivo: color-mix(in srgb, var(--wk-blu) 10%, transparent);
  --wk-larghezza: 1000px;
}
.wk, .wk *, .wk *::before, .wk *::after { box-sizing: border-box; }
.wk { margin: 0; font-family: 'Hubot Sans', system-ui, sans-serif; font-size: 16px; line-height: 1.4; color: var(--wk-testo); background: #fff; -webkit-text-size-adjust: 100%; }
.wk a { color: var(--wk-blu); }
.wk img { max-width: 100%; height: auto; }
.wk [hidden] { display: none !important; }   /* «hidden» deve vincere sui display dei componenti (riga del voto) */
.wk-nascosto-vista { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wk .wk-salta { position: absolute; left: -999px; top: 0; background: #fff; padding: .5rem 1rem; z-index: 10; }
.wk .wk-salta:focus { left: 0; }
.wk svg { fill: currentColor; }

/* ── intestazione ── */
.wk-testata { background: var(--wk-fondo); }
.wk-testata__alto { padding: .56rem 1.5rem; }
.wk-testata__basso { display: flex; align-items: center; gap: 40px; padding: 20px 24px 30px; }
.wk-logo { flex: 0 0 auto; }
.wk-logo img { display: block; width: 200px; height: 36px; }
.wk-testata__menu { flex: 1; }
.wk .wk-testata__menu a { color: var(--wk-testo-2); text-decoration: none; }
.wk .wk-testata__menu a:hover { text-decoration: underline; }
.wk .wk-bottone { display: inline-block; background: var(--wk-blu); color: #fff; border-radius: 20px; padding: 10px 20px; line-height: 16px; text-decoration: none; white-space: nowrap; }
.wk .wk-bottone:hover { filter: brightness(1.1); }
.wk-lingua { position: relative; display: inline-block; }
.wk-lingua summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .5rem; color: var(--wk-testo-2); }
.wk-lingua[open] summary span, .wk-lingua summary:hover span { text-decoration: underline; }
.wk-lingua summary::-webkit-details-marker { display: none; }
.wk-lingua summary { height: 22px; }
.wk-lingua summary svg { width: 20px; height: 20px; }
/* triangolo pieno come HubSpot */
.wk-lingua summary::after { content: ''; border: 5px solid transparent; border-top-color: currentColor; border-bottom: 0; margin-left: 2px; }
.wk-lingua__elenco { position: absolute; z-index: 20; left: 0; top: 24px; margin: 0; padding: 0; list-style: none; background: #fff; border: 1px solid var(--wk-testo-2); }
.wk .wk-lingua__voce { display: block; padding: .5rem 1rem; color: var(--wk-testo-2); text-decoration: none; white-space: nowrap; }
.wk .wk-lingua__voce:hover { background: var(--wk-attivo); }
.wk-hamburger { display: none; }

/* ── banner di ricerca ── */
.wk-banner { background: var(--wk-blu); padding: 100px 24px; }
.wk-cerca { max-width: var(--wk-larghezza); margin: 0 auto; }
.wk-cerca__titolo { display: block; color: #fff; font-size: 32px; line-height: 1.5; margin-bottom: .35rem; }
.wk-cerca__barra { position: relative; display: flex; }
.wk-cerca__input { flex: 1; min-width: 0; height: 38px; border: 0; border-radius: 0; padding: 10px; font: inherit; line-height: 1.15; color: var(--wk-testo-2); background: #fff; box-shadow: 0 1px 24px 0 rgba(0, 0, 0, .08); -webkit-appearance: none; appearance: none; }
.wk-cerca__input:focus { outline: 2px solid #fff; outline-offset: 0; }
.wk-cerca__bottone { width: 38px; height: 38px; border: 0; background: var(--wk-fondo); color: #000; font-size: 16px; cursor: pointer; display: grid; place-items: center; }
.wk-cerca__bottone svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 1.2px; }
.wk-suggerimenti { position: absolute; z-index: 15; top: 100%; left: 0; right: 0; margin: 0; padding: 0; list-style: none; background: #fff; border: 1px solid #cdcdcd; box-shadow: 1px 10px 16px -9px hsla(0, 0%, 48%, .75); }
.wk-suggerimenti li { display: block; margin: 0; padding: 0; }
.wk-suggerimenti a { display: flex; flex-direction: column; gap: .5rem; padding: 1rem; color: #000; }   /* sottolineati come su HubSpot */
.wk-suggerimenti a:hover, .wk-suggerimenti a:focus, .wk-suggerimenti a[aria-selected="true"] { background: rgba(0, 0, 0, .1); outline: none; }
.wk-suggerimenti__intestazione { background: color-mix(in srgb, var(--wk-blu) 20%, transparent); font-weight: 700; padding: .5rem 1rem !important; }
.wk-suggerimenti__categoria { color: #666; font-size: .875rem; }

/* ── corpo pagina ── */
.wk-principale { max-width: calc(var(--wk-larghezza) + 48px); margin: 0 auto; padding: 0 24px 2.3rem; }
.wk-briciole ol { display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0; padding: 0; }
.wk-briciole li { margin: 0; }
.wk-briciole a, .wk-briciole span { display: inline-block; padding: .7rem 0; text-decoration: none; color: var(--wk-blu); }
.wk-briciole li:not(:last-child)::after { content: '>'; display: inline-block; padding: .7rem; }
/* colonne come HubSpot: menu 27% (al massimo 266px), testo il resto con 30px di stacco (misurate a 1440 e 800px) */
.wk-colonne { display: flex; flex-direction: row-reverse; gap: 0; margin-top: 46px; }
.wk-contenuto { flex: 1 1 0; min-width: 0; max-width: 734px; padding-left: 30px; margin-top: -12px; }
.wk-laterale { flex: 0 0 27%; max-width: 266px; border-right: 1px solid var(--wk-bordo); padding-right: 30px; align-self: stretch; }
.wk-titolo { color: var(--wk-blu); font-size: 32px; font-weight: 700; line-height: 1.5; margin: 0 0 1.4rem; }
.wk-titolo--piccolo { font-size: 24px; font-weight: 400; }
/* sempre presente, anche vuoto: HubSpot ha un h2 del sottotitolo vuoto che aggiunge lo stesso spazio sotto il titolo */
.wk-sottotitolo { font-size: 24px; color: var(--wk-testo-2); margin: 0 0 1.4rem; padding-top: .1px; }   /* il padding impedisce ai margini di fondersi */

/* menu a fisarmonica delle categorie */
.wk-menu__elenco { list-style: none; margin: 0; padding: 0; }
.wk-menu__voce { margin: 0; }
.wk-menu__link { display: block; width: 100%; padding: 10px; text-decoration: none; color: var(--wk-blu); }
.wk-menu__link:hover { text-decoration: underline; }
.wk-menu__voce--attiva > .wk-menu__link, .wk-menu__voce--attiva > details > .wk-menu__riga { background: var(--wk-attivo); }
/* categoria aperta (come HubSpot): tutto il gruppo sul fondo chiaro, la riga madre più scura */
.wk-menu__voce--figli.wk-menu__voce--attiva > details[open] { background: var(--wk-attivo); }
.wk-menu__voce--figli.wk-menu__voce--attiva > details[open] > .wk-menu__riga { background: color-mix(in srgb, var(--wk-blu) 18%, transparent); }
.wk-menu__voce--attiva > .wk-menu__link, .wk-menu__voce--attiva > details > .wk-menu__riga > .wk-menu__link { font-weight: 400; }
.wk-menu__voce details > summary { list-style: none; cursor: pointer; }
.wk-menu__voce details > summary::-webkit-details-marker { display: none; }
.wk-menu__riga { display: flex; align-items: center; justify-content: space-between; }
.wk-menu__freccia { flex: 0 0 2rem; align-self: stretch; display: flex; align-items: center; justify-content: center; color: var(--wk-testo-2); }
.wk-menu__freccia::after { content: '❯'; font-size: .9rem; transition: transform .15s; }
details[open] > .wk-menu__riga .wk-menu__freccia::after { transform: rotate(90deg); }
.wk-menu__elenco--figli .wk-menu__link { padding-inline-start: 2rem; }
.wk-menu__elenco--figli .wk-menu__voce--attiva > .wk-menu__link { background: var(--wk-attivo); font-weight: 700; }   /* come HubSpot: la sottocategoria corrente in grassetto */

/* elenchi di articoli (categoria) */
.wk-elenco { list-style: none; margin: 0 0 .4rem; padding: 0; }
.wk-elenco li { margin: 0 0 .6rem; }
.wk-elenco__link { color: var(--wk-blu); }
.wk-nascosto { display: none; }
.wk-elenco--tutti .wk-nascosto { display: list-item; }
.wk-elenco__altro { border: 0; background: none; padding: 6px 0; margin: 0 0 1.4rem; font: inherit; color: var(--wk-testo); cursor: pointer; display: inline-flex; align-items: center; gap: .4rem; }
.wk-elenco__altro::after { content: '▼'; font-size: 11px; }
.wk-elenco__altro[aria-expanded="true"]::after { content: '▲'; }
/* la linea sotto l'elenco della categoria è a tutta larghezza, sotto «Visualizza altro» (come HubSpot) */
.wk-blocco-articoli { border-bottom: 1px solid var(--wk-bordo); padding-bottom: 1.4rem; }
.wk-blocco-articoli .wk-elenco__altro { margin-bottom: 0; }
.wk-sottocategoria { border-bottom: 1px solid var(--wk-bordo); padding: 48px 0 30px; }
.wk-sottocategoria .wk-elenco__altro { margin-bottom: 0; }
.wk-sottocategoria__titolo { color: var(--wk-blu); font-size: 24px; font-weight: 400; margin: 0 0 30px; }
.wk-separatore { border: 0; border-top: 1px solid var(--wk-bordo); margin: 0; }

/* home: schede delle categorie */
/* come HubSpot: la fascia delle schede è grigia #f5f8fa da bordo a bordo */
.wk-pagina-home { background: #f5f8fa; }
.wk-pagina-home .wk-testata, .wk-pagina-home .wk-piede { background: var(--wk-fondo); }
.wk-pagina-home .wk-principale { max-width: calc(964px + 48px); }
.wk-schede { list-style: none; margin: 75px 0 75px; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 32px; }
.wk-scheda { flex: 0 0 300px; background: #fff; border-radius: 3px; min-height: 294px; box-shadow: 4px 4px 4px 1px rgba(45, 62, 80, 0); transition: box-shadow .2s; }
.wk-scheda:hover { box-shadow: 4px 4px 4px 1px rgba(45, 62, 80, .12); }
.wk .wk-scheda__link { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; height: 100%; padding: 70px 16px 16px; text-align: center; text-decoration: none; color: var(--wk-testo); }
.wk-scheda__icona { color: var(--wk-blu); height: 50px; margin-bottom: 16px; }
.wk-scheda__icona svg { height: 50px; width: 50px; }
.wk-scheda__nome { align-self: stretch; font-size: 22px; font-weight: 400; color: var(--wk-testo-2); margin: 0 0 16px; line-height: 1.5; }
.wk-scheda__descrizione { margin: .8rem 0 0; }

/* risultati di ricerca */
.wk-risultati { list-style: none; margin: 0; padding: 0; }
.wk-risultato { margin: 0 0 1.4rem; }
.wk-risultato__titolo { color: var(--wk-blu); }
.wk-risultato__estratto { margin: 0; }
.wk-paginazione { display: flex; justify-content: space-between; margin-top: 1.4rem; }

/* feedback e articoli collegati */
.wk-feedback { margin-top: 60px; }
.wk-feedback__riga, .wk-feedback__grazie { border-top: 1px solid var(--wk-bordo); border-bottom: 1px solid var(--wk-bordo); padding: 38px 0; margin: 0; }
.wk-feedback__riga { display: flex; align-items: center; flex-wrap: wrap; }
.wk-feedback__bottoni { display: inline-flex; gap: 16px; margin-left: 16px; }
.wk-feedback__bottone { width: 90px; height: 32px; background: #eaf0f6; border: 1px solid #cbd6e2; border-radius: 3px; color: #425b76; font: 500 12px/12px 'Hubot Sans', system-ui, sans-serif; cursor: pointer; }
.wk-feedback__bottone:hover { background: #f5f8fa; color: #506e91; }
.wk-feedback__bottone:disabled { cursor: default; opacity: .6; }
.wk-collegati { margin: 0; padding-top: 32px; }
.wk-collegati__titolo { font-size: 22px; font-weight: 400; color: var(--wk-testo-2); margin: 50px 0 12px; }
.wk-collegati ul { list-style: none; margin: 0; padding: 0; }
.wk-collegati li { margin: 0 0 15px; }   /* righe a 51px come HubSpot */
.wk-collegati a { display: inline-block; font-size: 14px; padding: .5rem 0; }

/* piede */
/* piede come HubSpot: linea sopra, logo e «Centro di Assistenza» a sinistra, copyright a destra; i due testi sono bianchi
   su HubSpot (quasi invisibili) e si tengono così (misurato il 05/10) */
.wk-piede { background: var(--wk-fondo); border-top: 1px solid #e0e0e0; padding: 48px 24px; min-height: 197px; display: flex; justify-content: space-between; }
.wk-piede__testo { margin: 5px 0 0; color: #fff; }
.wk-piede__dx { padding-top: 49px; }
.wk-piede img { display: block; width: 150px; height: 27px; }

/* ── contenuto dell'articolo (stesse classi del renderer della wiki) ── */
.wiki-html { overflow-wrap: anywhere; }
.wiki-html::after { content: ''; display: block; clear: both; }
.wiki-html p { margin: 0 0 1.4rem; }
.wiki-html :is(h2, h3, h4, h5, h6) { color: var(--wk-testo-2); font-weight: 400; line-height: 1.5; margin: 0 0 1.4rem; clear: both; }
.wiki-html h2 { font-size: 26px; }
.wiki-html h3 { font-size: 22px; }
.wiki-html h4 { font-size: 18px; }
.wiki-html h5 { font-size: 17px; }
.wiki-html h6 { font-size: 16px; font-weight: 600; }
/* elenchi come HubSpot (misurati il 04/10): rientro 8+16px, voci a 17px, secondo livello numerato con le lettere */
.wiki-html :is(ul, ol) { margin: 20px 0 20px 8px; padding-left: 16px; }
.wiki-html ul { list-style: disc outside; }
.wiki-html ol { list-style: decimal outside; }
.wiki-html li { margin: .7rem .7rem .7rem 17px; padding-left: 8px; }
/* sotto-liste numerate a lettere come HubSpot. Lo stile scelto nell'editor vale solo per la lista esterna (il dialetto
   non dà classi alle sotto-liste: renderer.ts, «valgono per la lista esterna»), quindi qui non si toglie nessuna scelta */
.wiki-html ol ol { list-style-type: lower-alpha; }
.wiki-html li > :is(ul, ol) { margin: 20px 0 20px 8px; }
.wiki-html a { color: var(--wk-blu); }
.wiki-html img { max-width: 100%; }
.wiki-html img:not([height]) { height: auto; }
.wiki-html img[height] { object-fit: contain; }
.wiki-html img.img-centro { display: block; margin-left: auto; margin-right: auto; }
/* cornice degli screenshot come HubSpot (tabella di una cella: bordo 1px #99acc2, 4px dentro), larga quanto l'immagine */
.wiki-html img.img-cornice { border: 1px solid #99acc2; padding: 4px; box-sizing: content-box; max-width: calc(100% - 10px); }   /* cornice FUORI dall'immagine, come HubSpot: lo screenshot resta alla sua larghezza */
.wiki-html img.img-sinistra { float: left; margin: .2rem 1rem .5rem 0; }
.wiki-html img.img-destra { float: right; margin: .2rem 0 .5rem 1rem; }
.wiki-html blockquote { margin: 0 0 1.4rem; padding: .2rem 0 .2rem 1.4rem; border-left: 2px solid #99acc2; }
.wiki-html code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9em; background: #f5f8fa; padding: 0 .25rem; }
.wiki-html pre { background: #f5f8fa; border: 1px solid #cbd6e2; padding: .9375rem; overflow: auto; margin: 0 0 1.4rem; }
.wiki-html pre code { background: none; padding: 0; }
.wiki-html hr { border: 0; border-top: 1px solid #99acc2; margin: 1.4rem 0; clear: both; }
.wiki-html .tabella { overflow-x: auto; margin: 0 0 1.4rem; }
/* tabelle come HubSpot: solo il bordo esterno, celle senza linee, 4px di margine interno */
.wiki-html table { border-collapse: collapse; width: 100%; table-layout: fixed; border: 1px solid #99acc2; }
.wiki-html :is(th, td) { border: 0; padding: 4px; vertical-align: top; text-align: left; }
.wiki-html th { background: none; font-weight: 400; }   /* come HubSpot: il grassetto lo dà il testo, se c'è */
/* video come HubSpot: 560×315, centrati */
.wiki-html .video { position: relative; width: 100%; max-width: 560px; aspect-ratio: 16 / 9; margin: 0 auto 1.4rem; }
.wiki-html .video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.wiki-html .riquadro { --rq-fondo: #e5f5f8; --rq-bordo: #7fd1de; clear: both; width: 100%; margin: 0 0 1.4rem; padding: 20px 30px; border-left: 5px solid var(--rq-bordo); background: var(--rq-fondo); color: #000; }
.wiki-html .riquadro-note { --rq-fondo: #e5f8f6; --rq-bordo: #7fded2; }
.wiki-html .riquadro-caution { --rq-fondo: #fdedee; --rq-bordo: #f8a9ad; }
.wiki-html .riquadro-warning { --rq-fondo: #ffebe6; --rq-bordo: #e68250; }
.wiki-html .riquadro > :last-child { margin-bottom: 0; }
.wiki-html .allinea-sinistra { text-align: left; }
.wiki-html .allinea-centro { text-align: center; }
.wiki-html .allinea-destra { text-align: right; }
.wiki-html .allinea-giustifica { text-align: justify; }
.wiki-html .rientro-1 { margin-left: 40px; }
.wiki-html .rientro-2 { margin-left: 80px; }
.wiki-html .rientro-3 { margin-left: 120px; }
.wiki-html ol.lista-lettere { list-style-type: lower-alpha; }
.wiki-html ol.lista-lettere-maiuscole { list-style-type: upper-alpha; }
.wiki-html ol.lista-romani { list-style-type: lower-roman; }
.wiki-html ol.lista-romani-maiuscoli { list-style-type: upper-roman; }
.wiki-html ol.lista-greco { list-style-type: lower-greek; }
.wiki-html .ancora { display: block; position: relative; top: -1rem; }

/* ── telefono (come HubSpot: sotto i 767px niente riga della lingua, menu dietro l'hamburger, categorie in fondo) ── */
@media (max-width: 767px) {
  .wk-testata__alto, .wk-testata__menu, .wk .wk-testata__torna { display: none; }
  .wk-testata__basso { justify-content: space-between; padding: 34px 20px 39px; }
  /* menu come HubSpot: pannello a tutta larghezza sul fondo dell'intestazione, Blog / lingua / bottone largo, icona ✕ */
  .wk-testata { position: relative; }
  .wk-hamburger { display: block; }
  .wk-hamburger > summary { list-style: none; cursor: pointer; width: 30px; height: 35px; display: grid; place-items: center; }
  .wk-hamburger > summary::-webkit-details-marker { display: none; }
  .wk-hamburger > summary svg { width: 30px; height: 30px; stroke: currentColor; stroke-width: 1.2px; }
  .wk-hamburger__chiudi, .wk-hamburger[open] .wk-hamburger__apri { display: none; }
  .wk-hamburger[open] .wk-hamburger__chiudi { display: block; }
  .wk-hamburger__pannello { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; background: var(--wk-fondo); padding: 17px 16px 18px; display: flex; flex-direction: column; align-items: stretch; gap: 30px; }
  .wk .wk-hamburger__blog { color: var(--wk-testo-2); text-decoration: none; }
  .wk-hamburger__pannello .wk-lingua summary { width: 230px; justify-content: flex-start; }
  .wk-hamburger__pannello .wk-lingua summary::after { margin-left: auto; }
  .wk-hamburger__pannello .wk-lingua__elenco { position: static; border: 0; background: none; }
  .wk-hamburger__pannello .wk-bottone { display: block; text-align: left; margin-top: -10px; }
  .wk-schede { margin: 24px 0; }
  .wk-scheda { flex: 0 1 300px; }   /* sotto i 348px la scheda si stringe invece di far scorrere la pagina */
  .wk-banner { padding: 100px 24px; }
  .wk-principale { padding: 0 24px 2rem; }
  .wk-colonne { flex-direction: column; margin-top: 23px; gap: 2rem; }
  .wk-contenuto { max-width: none; padding-left: 0; }
  .wk-laterale { flex: none; max-width: none; border-right: 0; padding-right: 0; }
  .wk-feedback__riga { flex-direction: column; align-items: flex-start; gap: 10px; }
  .wk-feedback__bottoni { margin-left: 0; }
  .wiki-html .rientro-1, .wiki-html .rientro-2, .wiki-html .rientro-3 { margin-left: 20px; }
}