/* ALV · fondamenta condivise (negozio + sito del progetto)
   Colori, caratteri e componenti presi dal Brand Book, bozza 01 · settembre 2026. */

:root{
  /* Colori del brand */
  --carta:#F4EFE6;      /* Carta */
  --inchiostro:#1E1C1A; /* Inchiostro */
  --salvia:#94AFA8;     /* Salvia · la prima agenda */
  --bosco:#2F4A46;      /* Bosco */
  --senape:#D2AE3E;     /* Senape · puntini degli occhiali */
  --celeste:#9CC0CF;    /* Celeste · puntini degli occhiali */

  /* Toni di supporto usati nei layout */
  --sabbia:#EDE6DA;     /* fondo delle schede prodotto */
  --tela:#E7E0D4;       /* fondo esterno */
  --linea:#DDD3C4;      /* filetti e bordi */
  --foglio:#FBF8F2;     /* pagina interna dell'agenda */
  --testo:#4A443D;      /* testo corrente */
  --tenue:#6E665C;      /* etichette, didascalie */
  --menta:#C9D6D2;      /* etichette su Bosco */
  --nebbia:#DCE5E2;     /* testo su Bosco */
  --piede:#CFC6B8;      /* testo nel footer scuro */

  --serif:'Libre Caslon Text',Georgia,'Times New Roman',serif;
  --sans:'Karla',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --script:'Sacramento',cursive;
  --firma:'Amatic SC',var(--sans);

  --max:1440px;
  --gutter:clamp(24px,3.9vw,56px);
  --ombra:0 20px 60px rgba(60,45,30,.12);
}

/* ---------- Reset essenziale ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body{margin:0;background:var(--carta);color:var(--inchiostro);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,video,canvas{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd{margin:0}
:where(ul[role=list],ol[role=list]){list-style:none;padding:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--bosco);text-decoration:none}
a:hover{color:var(--inchiostro)}
:focus-visible{outline:2px solid var(--bosco);outline-offset:3px}
::selection{background:var(--salvia);color:var(--inchiostro)}
[hidden]{display:none!important}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:1000;background:var(--inchiostro);color:var(--carta);padding:10px 16px;font-size:14px}
.skip:focus{top:12px;color:var(--carta)}

/* ---------- Tipografia ---------- */
.serif{font-family:var(--serif);font-weight:400}
.script{font-family:var(--script);font-weight:400}
.eyebrow{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue);line-height:1.4}
.display{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5.3vw,76px);line-height:1.03;letter-spacing:-.015em;text-wrap:balance}
.h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.8vw,40px);line-height:1.12;text-wrap:balance}
.h2-lg{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.4vw,48px);line-height:1.08;text-wrap:balance}
.h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,32px);line-height:1.15}
.lead{font-size:clamp(17px,1.35vw,19px);line-height:1.6;color:var(--testo);text-wrap:pretty}
.body{font-size:17px;line-height:1.7;color:var(--testo);text-wrap:pretty}
.small{font-size:14px;line-height:1.6}
.muted{color:var(--tenue)}
.link-u{border-bottom:1px solid currentColor;padding-bottom:1px;font-size:15px;color:var(--inchiostro)}
.link-u:hover{color:var(--bosco)}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}

/* ---------- Pulsanti ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 30px;border:1px solid var(--inchiostro);background:var(--inchiostro);color:var(--carta);font-size:15px;letter-spacing:.04em;line-height:1.2;text-align:center;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--bosco);border-color:var(--bosco);color:var(--carta)}
.btn--ghost{background:transparent;color:var(--inchiostro)}
.btn--ghost:hover{background:var(--inchiostro);border-color:var(--inchiostro);color:var(--carta)}
.btn--light{background:var(--carta);border-color:var(--carta);color:var(--inchiostro)}
.btn--light:hover{background:transparent;color:var(--carta);border-color:var(--carta)}
.btn--block{width:100%}
.btn[disabled],.btn[aria-disabled=true]{opacity:.5;pointer-events:none}

/* ---------- Copertina (componente) ----------
   Riproduce "Copertina.dc": A5 148×210, spigoli arrotondati, dorso ombreggiato,
   luogo in maiuscoletto, frase in Sacramento, disegno, firma in Amatic SC. */
.cover{container-type:inline-size;width:100%;aspect-ratio:148/210;position:relative;display:block}
.cover__img,.cover__face{position:absolute;inset:0;border-radius:1.2cqw 2cqw 2cqw 1.2cqw;box-shadow:0 1.5cqw 4cqw rgba(40,30,20,.18)}
.cover__img{width:100%;height:100%;object-fit:cover}
.cover picture{display:contents}
.cover__face{background:var(--c,#94AFA8);overflow:hidden;display:flex;flex-direction:column;align-items:center}
.cover__spine{position:absolute;left:0;top:0;bottom:0;width:6cqw;background:linear-gradient(90deg,rgba(0,0,0,.10),rgba(255,255,255,.12) 45%,rgba(0,0,0,.05))}
.cover__place{margin-top:6cqw;font-family:var(--sans);font-weight:600;font-size:3.4cqw;letter-spacing:.3em;text-transform:uppercase;color:#1E1C1A;line-height:normal}
.cover__phrase{margin-top:9cqw;padding:0 12cqw;text-align:center;font-family:var(--script);font-size:10.5cqw;line-height:1.05;color:#fff;text-wrap:balance}
.cover__place + .cover__phrase{margin-top:3cqw}
.cover__art{flex:1;width:100%;display:flex;align-items:center;justify-content:center;padding:4cqw 14cqw 2cqw;min-height:0}
.cover__art img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.cover__sig{margin-bottom:6cqw;font-family:var(--firma);font-size:5.4cqw;letter-spacing:.06em;color:#2A2622;line-height:normal}

/* ---------- Fogli interni (formati) ---------- */
.sheet{aspect-ratio:148/210;background-color:var(--foglio)}
.sheet--righe{background-image:repeating-linear-gradient(var(--foglio) 0 17px,#CFC5B5 17px 18px);background-position:0 28px}
.sheet--bianca{background-image:none}
.sheet--puntini{background-image:radial-gradient(#BDB2A0 1.1px,transparent 1.3px);background-size:14px 14px}
.sheet--datata{background-image:linear-gradient(var(--foglio) 0 64px,#1E1C1A 64px 65px,transparent 65px),repeating-linear-gradient(var(--foglio) 0 17px,#DDD3C4 17px 18px)}

/* ---------- Etichette ---------- */
.tag{display:inline-block;background:var(--inchiostro);color:var(--carta);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;line-height:1.3}
.chip{display:inline-block;padding:4px 12px;border:1px solid var(--linea);border-radius:999px;font-size:14px;color:var(--testo);line-height:1.4}

/* ---------- Varie ---------- */
.rule{border:0;border-top:1px solid var(--linea);margin:0}
.signature{font-family:var(--script);font-size:44px;line-height:1}