/* Tema condiviso: tutte le superfici derivano dalla stessa palette. */
/* 22/10: Archivo largo sostituito: titoli in Fraunces come il nome del sito, testi in Source Sans 3. */
html[data-tema] { --tema-font:"Source Sans 3",system-ui,sans-serif; --tema-titoli:"Fraunces",Georgia,serif; --font:var(--tema-font); --font-testo:var(--tema-font); --font-titoli:var(--tema-titoli); --tema-raggio:6px; --tema-ombra:0 10px 32px rgb(35 55 75 / .06); --ritmo:1; --contenitore-raggio:24px; --contenitore-altezza:54px; --contenitore-laterale:39px; --contenitore-piccolo:44px; --contenitore-mobile:58px; }
html[data-tema] body:is(.nv,.interna) { --beige:var(--fondo-pagina); --beige-luce:var(--superficie); --tinta:var(--tinta-tema); --tinta-luce:var(--superficie-tinta); --ink:var(--testo-tema); --tenue:color-mix(in srgb,var(--testo-tema) 90%,var(--fondo-pagina)); --acc:var(--dettaglio-tema); --acc-scuro:var(--testo-tema); --font-color:var(--testo-tema); --su-tinta:var(--su-tinta-tema); --ocra:var(--dettaglio-tema); --linea:color-mix(in srgb,var(--testo-tema) 24%,transparent); --font:var(--tema-font); --font-testo:var(--tema-font); --font-titoli:var(--tema-titoli); --bosco:var(--dettaglio-tema); --accento:var(--dettaglio-tema); --testo:var(--testo-tema); --sfondo:var(--fondo-pagina); --sfondo-2:var(--superficie-tinta); --carta-scheda:var(--superficie); --sfondo-menu:var(--superficie-tinta); background:var(--fondo-pagina); color:var(--testo-tema); font-family:var(--tema-font); }
html[data-tema] .logo { background:var(--titolo-color); }
html[data-tema] .nome,html[data-tema] .marchio { font-family:var(--tema-titoli); font-weight:780; font-stretch:110%; letter-spacing:.005em; color:var(--titolo-color); }
html[data-tema] .nome { font-size:clamp(1.55rem,3.2vw,2.4rem); line-height:1.12; text-transform:uppercase; }
html[data-tema] .nome::after { display:none; }
html[data-tema] :is(.cosa__titolo,.pagina__titolo,.archivio-cat h2,.testo .t-xl) { font-family:var(--tema-titoli); color:var(--testo-tema); }
html[data-tema] :is(.cosa__descr,.testo,.presentazione) { color:var(--testo-tema); font-family:var(--tema-font); }
html[data-tema] :is(.cosa__link a,.sponsor__titolo,.sotto,.ruoli,.piede,.briciole,.testo a) { color:var(--testo-tema); }
html[data-tema] :is(.sponsor__box,.c__sub,.archivio-cat,.pagina__testa-testo,.scheda-pag,.archivio-menu__box) { background-color:var(--superficie); border-color:var(--linea); border-radius:var(--tema-raggio); }
html[data-tema] :is(.scheda-pag,.archivio-cat,.sponsor__box) { box-shadow:var(--tema-ombra); }
html[data-tema] .piede { background:var(--fondo-pagina); }
html[data-tema] .pagina--nuova .pagina__corpo--schede { background:none; }
html[data-tema] .pagina--nuova .pagina__corpo--schede .scheda-pag { background:var(--superficie); box-shadow:var(--tema-ombra); }
html[data-tema] .pagina__corpo { background:var(--superficie); border-radius:var(--tema-raggio); }
html[data-tema] .pagina--nuova.p-ultimenews .scheda-pag:first-child,html[data-tema] .contatti__voce { background:var(--superficie-tinta); color:var(--testo-tema); }
html[data-tema] .testata,html[data-tema] .testata .nav__sub>ul { background:var(--superficie); color:var(--testo-tema); box-shadow:0 1px 0 var(--linea); }
html[data-tema] .testata { top:var(--prova-altezza,52px); }
html[data-tema] .testata__marchio::before { background:var(--titolo-color); }
html[data-tema] .pagina__testa:not(.pagina__testa--foto) { background:var(--superficie-tinta); }
html[data-tema] .pagina--nuova .pagina__testa--foto::before { background:linear-gradient(0deg,color-mix(in srgb,var(--testo-tema) 80%,transparent),transparent 85%); }

/* Base uniforme; texture leggere disponibili soltanto come prove facoltative. */
html[data-tema][data-trama] body:is(.nv,.interna)::after { content:""; display:block; position:absolute; inset:0; z-index:-2; pointer-events:none; opacity:var(--texture-alpha); -webkit-mask:none; mask:none; }
html[data-tema][data-trama="nessuna"] body:is(.nv,.interna)::after { display:none; }
html[data-tema][data-trama="carta"] body:is(.nv,.interna)::after { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); background-color:transparent; background-size:180px; -webkit-mask:none; mask:none; opacity:calc(var(--texture-alpha) * .8); }
html[data-tema][data-trama="puntini"] body:is(.nv,.interna)::after { background:radial-gradient(circle,var(--testo-tema) 1px,transparent 1.2px) 0 0 / 19px 19px; -webkit-mask:none; mask:none; }
html[data-tema][data-trama="righe"] body:is(.nv,.interna)::after { background:repeating-linear-gradient(0deg,transparent 0 31px,var(--testo-tema) 31px 32px); -webkit-mask:none; mask:none; }
html[data-tema] body.nv::before { content:none; }
html[data-tema] :is(.testa,.testata) { position:relative; isolation:isolate; }
html[data-tema] .testa { background-color:var(--fondo-pagina); }
html[data-tema] .testata { position:sticky; }
html[data-tema] :is(.testa,.testata)::before { content:none; display:none; }
html[data-tema] .pagina__testa::after,html[data-tema] .pagina--nuova .pagina__testa--foto::after { content:none; display:none; }
html[data-tema] .pagina__testa:not(.pagina__testa--foto)::before { display:none; }

/* Stile della pagina, indipendente dalle forme della navigazione. */
html[data-stile="essenziale"] { --tema-raggio:5px; }
html[data-stile="editoriale"] { --tema-titoli:"Fraunces",Georgia,serif; --tema-raggio:1px; }
html[data-stile="editoriale"] .nome { text-transform:none; font-weight:600; letter-spacing:-.02em; }
html[data-stile="editoriale"] .cosa__titolo { text-transform:none; font-weight:600; }
html[data-stile="alpino"] .nome,html[data-stile="alpino"] .pagina__titolo { font-stretch:120%; letter-spacing:.035em; }
html[data-stile="alpino"] .nome::after { content:""; display:block; width:64px; height:2px; margin:10px auto 0; background:currentColor; border:0; transform:none; -webkit-mask:none; mask:none; }
html[data-stile="alpino"] .cosa__testo { border-top:2px solid var(--linea); }
html[data-stile="morbido"] { --tema-raggio:16px; }
html[data-stile="morbido"] .nome { letter-spacing:-.02em; }
html[data-carattere="archivo"] { --tema-font:"Archivo",system-ui,sans-serif; --tema-titoli:var(--tema-font); }
html[data-carattere="fraunces"] { --tema-font:"Fraunces",Georgia,serif; --tema-titoli:var(--tema-font); }
html[data-carattere="sistema"] { --tema-font:system-ui,sans-serif; --tema-titoli:var(--tema-font); }
html[data-spaziatura="compatta"] { --ritmo:.78; }
html[data-spaziatura="ariosa"] { --ritmo:1.25; }
html[data-tema] .tre { padding-top:calc(clamp(48px,7vw,90px) * var(--ritmo)); }
html[data-tema] .sponsor { margin-top:calc(clamp(48px,6vw,76px) * var(--ritmo)); }
html[data-tema] .scheda-pag + .scheda-pag { margin-top:calc(24px * var(--ritmo)); }
html[data-rilievo="piatto"] { --tema-ombra:none; }
html[data-tema] .cosa,html[data-tema] .cosa + .cosa { border:0; padding:0; }

/* Forma e dimensione dei contenitori: non dipendono dallo stile. */
html[data-forma="rettangoli"] { --contenitore-raggio:2px; }
html[data-forma="arrotondati"] { --contenitore-raggio:10px; }
html[data-forma="pillole"] { --contenitore-raggio:28px; }
html[data-forma="filetti"] { --contenitore-raggio:0px; }
html[data-dimensione="medi"] { --contenitore-altezza:64px; --contenitore-laterale:48px; --contenitore-piccolo:52px; --contenitore-mobile:64px; }
html[data-tema] .nv .apertura :is(.c__btn,.c--link) { border-radius:var(--contenitore-raggio); background:var(--superficie); border:1px solid var(--linea); box-shadow:none; }
html[data-forma="filetti"] .nv .apertura :is(.c__btn,.c--link) { background:transparent; border:0; border-bottom:1px solid var(--linea); }
html[data-tema] .nv .apertura .c__nome { font-family:var(--tema-font); }
html[data-dimensione="medi"] .nv .apertura .c__nome { font-size:.82rem; }
html[data-icone="nascoste"] .c__icona { display:none; }
html[data-tema] .nv .apertura .c__btn[aria-expanded="true"] { background:var(--testo-tema); color:var(--fondo-pagina); }
html[data-tema] .testata .nav>ul>li>a,html[data-tema] .testata .nav>ul>li>button { border-radius:var(--contenitore-raggio); }

/* Stampa delle fotografie: terzo asse, distinto dai contenitori. */
html[data-tema] .foto { gap:clamp(12px,3vw,40px); }
html[data-tema] .foto .foto__f { position:relative; width:min(28%,clamp(220px,18vw,480px)); order:initial; aspect-ratio:4/3; border-radius:2px; transform:none; box-shadow:var(--tema-ombra); outline:0; -webkit-mask:none; mask:none; filter:none; }
html[data-tema] .foto .foto__f img { filter:none; }
html[data-foto="pulite"] .foto .foto__f { padding:0; border:0; background:none; box-shadow:none; }
html[data-foto="cornice"] .foto .foto__f { padding:5px; border:1px solid var(--linea); background:var(--superficie); }
html[data-foto="stampe"] .foto .foto__f { padding:6px; border:1px solid var(--linea); background:var(--superficie); overflow:visible; }
html[data-foto="stampe"] .foto .foto__f:nth-child(1) { transform:rotate(-1.4deg); }
html[data-foto="stampe"] .foto .foto__f:nth-child(3) { transform:rotate(1deg); }
html[data-tema]:not([data-foto="stampe"]) .foto__f::before { display:none; }
html[data-foto="stampe"] .foto .foto__f::before { content:""; display:block; position:absolute; z-index:1; top:-10px; left:50%; width:64px; height:20px; margin-left:-32px; background:color-mix(in srgb,var(--fondo-pagina) 70%,transparent); transform:rotate(-3deg); }

/* Pannelli di configurazione identici in tutto il sito. */
html[data-tema] .prova { flex-wrap:wrap; min-height:52px; position:sticky; z-index:100; font:600 12px/1.4 system-ui,sans-serif; }
html[data-tema] .prova details>summary { display:flex; align-items:center; gap:5px; min-height:32px; padding-inline:6px; cursor:pointer; list-style:none; }
html[data-tema] .prova details>summary::-webkit-details-marker { display:none; }
.scegli-stile summary::after { content:"⌄"; }
.stile-attuale { font-weight:400; }
html[data-tema] :is(.tema-pannello,.scegli-colori__pannello) { position:fixed; top:calc(var(--prova-altezza,52px) + 8px); left:50%; right:auto; transform:translateX(-50%); width:min(460px,calc(100vw - 32px)); max-height:calc(100svh - var(--prova-altezza,52px) - 24px); overflow-y:auto; overscroll-behavior:contain; z-index:2; padding:20px; background:#fffefa; color:#242834; border:1px solid #cbd8e5; border-radius:12px; box-shadow:0 8px 30px rgb(48 72 98 / .16); text-align:left; }
html[data-tema] .prova .aspetto-opzioni { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
html[data-tema] .prova .aspetto-opzioni button { display:flex; justify-content:flex-start; align-items:center; width:auto; min-height:44px; height:auto; margin:0; padding:9px; font:500 12px/1.35 system-ui,sans-serif; background:none; color:#242834; border:1px solid #cbd8e5; border-radius:6px; text-align:left; box-shadow:none; }
html[data-tema] .prova .aspetto-opzioni [aria-pressed="true"] { background:#edf5fd; border-color:#304862; box-shadow:inset 0 0 0 1px #304862; }
html[data-tema] .prova .aspetto-prove button { align-items:flex-start; flex-direction:column; }
.tema-nota { margin:14px 0 0; font:400 12px/1.5 system-ui,sans-serif; color:#46536a; }
html[data-tema] .prova :focus-visible { outline:2px solid #304862; outline-offset:3px; }
@media (max-width:1000px) { .stile-attuale,.aspetto-attuale,.posizione-attuale { display:none; } }
@media (max-width:760px) {
  html[data-tema] .nome { font-size:clamp(1.35rem,6.2vw,1.9rem); }
  html[data-tema] .nav { background:var(--superficie); color:var(--testo-tema); }
  html[data-tema] .testata__marchio { white-space:normal; }
  html[data-tema] .marchio { font-size:clamp(.95rem,3.7vw,1.25rem); }
  html[data-tema] .foto .foto__f { width:28%; }
}
/* 22/10: titoli di pagina in Fraunces come il nome del sito, più leggeri e non in maiuscolo. */
html[data-tema] .pagina__titolo { font-weight:600; font-stretch:100%; text-transform:none; letter-spacing:-.01em; }
