/* =====================================================================
   BERTOLI v3 "NOTTE E GRANO"
   Strato grafico sopra styles.css. Riferimenti cliente: Felicetti
   (avorio, respiro, sabbia), Filotea (nero, condensato, prodotto eroe),
   Arcenni (video a tutto schermo, mosaico foto + campiture piene).
   Per tornare a Luce v2 basta non caricare questo file.
   ===================================================================== */
:root{
  --notte:#14120E; --notte-2:#1E1B16;
  --avorio:#FBF8F3; --lino:#F2ECE1;
  --sabbia-3:#D6BF9E; --sabbia-scura:#8F7650;
  --bosco:#1F3A2B; --bosco-2:#2B4C39;
  --grano-3:#E0B252; --grano-scuro:#A97B22;
  /* rimappa i token Luce */
  --panna:var(--avorio); --carta:#fff; --crema:var(--lino); --sabbia:var(--lino);
  --verde:var(--bosco); --verde-scuro:#162B20; --salvia:#E4E8DD;
  --oro:var(--sabbia-scura); --oro-chiaro:var(--grano-3);
  --inchiostro:#24211C; --ink:#24211C; --grigio:#6A645A; --hair:#E3DACB;
  --lago:var(--bosco); --lago-chiaro:var(--lino);
  --r:0px; --maxw:1320px; --ease:cubic-bezier(.22,.61,.24,1);
  --display:"League Gothic","Oswald","Arial Narrow",Impact,sans-serif;
}
body{background:var(--avorio);font-size:17px;line-height:1.7}
::selection{background:var(--grano-3);color:var(--notte)}
:focus-visible{outline:2px solid var(--grano-3);outline-offset:3px;border-radius:0}

/* ---------- tipografia ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.012em;
  line-height:.94;font-variation-settings:normal}
h1{font-size:clamp(3.4rem,9.4vw,8.6rem)}
h2{font-size:clamp(2.7rem,6.4vw,5.4rem)}
h3{font-size:clamp(1.55rem,2.6vw,2.05rem);line-height:1;letter-spacing:.02em}
h1 em,h2 em,h3 em,.sec-head h2 em,.phero h1 em,.hero h1 em,.claim em{
  font-family:"Fraunces",Georgia,serif;font-style:italic;font-weight:400;text-transform:none;
  font-size:.7em;letter-spacing:-.015em;color:var(--grano-scuro);font-variation-settings:"opsz" 144,"WONK" 1}
.eyebrow{font-size:.7rem;letter-spacing:.3em;color:var(--sabbia-scura);font-weight:600;gap:0}
.eyebrow::before{display:none}
.lead{font-size:clamp(1.04rem,1.45vw,1.2rem);line-height:1.75;max-width:62ch}
section{padding:clamp(4.5rem,9vw,8.5rem) 0}
.sec-head{max-width:none;text-align:center;margin-bottom:clamp(2.4rem,5vw,4rem)}
.sec-head .eyebrow{justify-content:center}
.sec-head h2{margin:1.1rem auto 1.4rem;max-width:20ch}
.sec-head .lead{margin-inline:auto}
.sec-head::after{content:"";display:block;width:1px;height:clamp(2.6rem,5vw,4.2rem);background:var(--sabbia-3);margin:clamp(1.6rem,3vw,2.4rem) auto 0}

/* ---------- bottoni: rettangolo sottile, maiuscoletto ---------- */
.btn{border-radius:0;padding:1.05rem 1.9rem;font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid currentColor;box-shadow:none;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.btn::after{display:none}
.btn:hover{transform:none}
.btn-p{background:var(--notte);color:var(--avorio);border-color:var(--notte);box-shadow:none}
.btn-p:hover{background:var(--grano-3);border-color:var(--grano-3);color:var(--notte)}
.btn-s{background:transparent;color:var(--inchiostro);border-color:var(--inchiostro)}
.btn-s:hover{background:var(--inchiostro);color:var(--avorio);border-color:var(--inchiostro)}
.on-dark .btn-p,.hero3 .btn-p,.annata .btn-p,.cal .btn-p,.club .btn-p,footer .btn-p,.phero .btn-p,header .btn-p,.drawer .btn-p{
  background:var(--sabbia-3);border-color:var(--sabbia-3);color:var(--notte)}
.hero3 .btn-p:hover,.annata .btn-p:hover,.cal .btn-p:hover,.club .btn-p:hover,header .btn-p:hover,.drawer .btn-p:hover{
  background:var(--avorio);border-color:var(--avorio);color:var(--notte)}
.hero3 .btn-s,.annata .btn-s,.cal .btn-s,.club .btn-s,.phero .btn-s{color:var(--avorio);border-color:rgba(251,248,243,.55)}
.hero3 .btn-s:hover,.annata .btn-s:hover,.cal .btn-s:hover,.club .btn-s:hover,.phero .btn-s:hover{background:var(--avorio);color:var(--notte);border-color:var(--avorio)}
main p a:not(.btn),main li a:not(.btn){background:none;padding-bottom:0;text-decoration:underline;text-decoration-color:var(--sabbia-3);text-underline-offset:.28em;text-decoration-thickness:1px}
main p a:not(.btn):hover,main li a:not(.btn):hover{animation:none;text-decoration-color:currentColor}

/* ---------- topbar + header: sempre notte ---------- */
.topbar{background:var(--notte);color:rgba(251,248,243,.72);font-size:.64rem;letter-spacing:.24em;padding:.6rem 0;border-bottom:1px solid rgba(251,248,243,.1)}
.topbar b{color:var(--sabbia-3);font-weight:600}
.dot{background:var(--sabbia-3);width:3px;height:3px;opacity:.7}
header{background:var(--notte);color:var(--avorio);backdrop-filter:none;border-bottom:1px solid rgba(251,248,243,.08)}
header.stuck{background:rgba(20,18,14,.94);backdrop-filter:blur(12px);border-color:rgba(251,248,243,.1);box-shadow:none}
.nav{padding:1rem 0}
.brand,.brand .wm b{color:var(--avorio)}
.brand .wm b{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:1.62rem;letter-spacing:.05em;line-height:1}
.wm-b i{color:var(--sabbia-3);font-size:.9rem}
.wm-ear{color:var(--grano-3)}
.wm-rule{background:var(--sabbia-3)}
.wm-dal{color:rgba(251,248,243,.55)}
.menu{gap:2rem}
.menu a{font-size:.7rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,248,243,.86);padding:.4rem 0}
.menu a::after{background:var(--sabbia-3);height:1px;bottom:0}
.menu a:hover,.menu a[aria-current]{color:var(--sabbia-3)}
header .btn{padding:.8rem 1.3rem;font-size:.66rem}
.burger{border-radius:0;border-color:rgba(251,248,243,.45);color:var(--avorio);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;padding:.7rem 1rem}
.drawer{background:var(--notte);color:var(--avorio)}
.drawer a{font-family:var(--display);text-transform:uppercase;font-size:2.5rem;letter-spacing:.03em;line-height:1;border-color:rgba(251,248,243,.14);padding:.75rem 0;font-variation-settings:normal}
.drawer a.btn{font-family:inherit;font-size:.72rem;display:inline-flex;padding:1.05rem 1.9rem;border:1px solid var(--sabbia-3)}
.drawer .close{border-radius:0;border-color:rgba(251,248,243,.45);color:var(--avorio);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase}
@media(max-width:1080px){.brand .wm b{font-size:1.35rem}}
/* in home l'header galleggia sul video */
body.home header{background:transparent;border-color:transparent}
body.home header.stuck{background:rgba(20,18,14,.94);border-color:rgba(251,248,243,.1)}
body.home .topbar{background:transparent;position:relative;z-index:81;border-color:rgba(251,248,243,.16)}

/* ---------- HERO: video a tutto schermo ---------- */
.hero3{position:relative;isolation:isolate;color:var(--avorio);background:var(--notte);
  min-height:100svh;margin-top:calc(-1 * var(--hdr-h,118px));padding:calc(var(--hdr-h,118px) + 2rem) 0 0;
  display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.hero3-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;animation:h3zoom 22s ease-out both}
@keyframes h3zoom{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero3::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to bottom,rgba(20,18,14,.72) 0,rgba(20,18,14,.18) 34%,rgba(20,18,14,.35) 58%,rgba(20,18,14,.93) 100%)}
.hero3-in{text-align:center;padding-bottom:clamp(2.2rem,5vw,4rem)}
.hero3-kick{font-size:.7rem;letter-spacing:.34em;text-transform:uppercase;color:var(--sabbia-3);margin:0 0 1.6rem}
.hero3 h1{font-size:clamp(3.6rem,11.4vw,11rem);line-height:.86;margin:0 auto;text-shadow:0 2px 40px rgba(0,0,0,.35)}
.hero3 h1 em{color:var(--grano-3);font-size:.62em;display:inline-block;transform:translateY(-.04em)}
.hero3 .lead{color:rgba(251,248,243,.86);margin:1.8rem auto 0;max-width:52ch}
.hero3 .hero-cta{justify-content:center;margin-top:2.2rem}
.hero3-foot{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;
  border-top:1px solid rgba(251,248,243,.2);padding:1.3rem 0 1.5rem}
.hero3-trust{display:flex;flex-wrap:wrap;gap:.5rem 2rem;list-style:none;margin:0;padding:0;
  font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(251,248,243,.8)}
.hero3-trust li{display:flex;align-items:center;gap:.7rem}
.hero3-trust li::before{content:"";width:5px;height:5px;background:var(--grano-3);transform:rotate(45deg)}
.hero3-annata{text-align:right;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,248,243,.7);line-height:1.7}
.hero3-annata b{display:block;font-family:var(--display);font-weight:400;font-size:2.6rem;letter-spacing:.04em;color:var(--sabbia-3);line-height:.9}
.hero3 h1,.hero3-kick,.hero3 .lead,.hero3 .hero-cta,.hero3-foot{animation:h3in 1.1s var(--ease) both}
.hero3 h1{animation-delay:.15s}.hero3 .lead{animation-delay:.4s}.hero3 .hero-cta{animation-delay:.55s}.hero3-foot{animation-delay:.8s}
@keyframes h3in{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@media(max-width:760px){
  .hero3-foot{grid-template-columns:1fr;gap:1rem}.hero3-annata{text-align:left}
  .hero3-trust{gap:.45rem 1.2rem;font-size:.6rem}.hero3-annata b{font-size:2rem}
}

/* ---------- manifesto (respiro alla Felicetti) ---------- */
.manifesto{text-align:center;padding:clamp(5rem,10vw,9rem) 0 clamp(3rem,6vw,5rem)}
.manifesto p{font-family:"Fraunces",Georgia,serif;font-weight:300;font-size:clamp(1.5rem,3.1vw,2.55rem);line-height:1.32;
  color:var(--sabbia-scura);max-width:26ch;margin:0 auto;letter-spacing:-.01em;font-variation-settings:"opsz" 144}
.manifesto p i{color:var(--inchiostro)}
.manifesto::after{content:"";display:block;width:1px;height:clamp(4rem,8vw,7rem);background:var(--sabbia-3);margin:clamp(2.5rem,5vw,4rem) auto 0}
.pano{margin:0}
.pano img{height:clamp(260px,44vw,640px)}
.pano figcaption{font-size:.66rem;letter-spacing:.3em;padding:1.6rem;background:linear-gradient(to top,rgba(20,18,14,.6),transparent)}

/* ---------- marquee ---------- */
.mq{background:var(--notte);color:var(--avorio);border:0;padding:1.1rem 0}
.mq+.mq{background:var(--sabbia-3);color:var(--notte)}
.mq span{font-family:var(--display);font-style:normal;text-transform:uppercase;letter-spacing:.06em;font-size:clamp(1.5rem,3vw,2.3rem);gap:2.2rem}
.mq .row{gap:2.2rem;animation-duration:38s}
.mq svg{color:var(--grano-3);width:.85em;height:.85em}
.mq+.mq svg{color:var(--notte)}

/* ---------- filiera ---------- */
.filiera{background:var(--avorio)}
.vs{gap:0;grid-template-columns:1fr 1fr;border:1px solid var(--hair)}
.vs .divider{display:none}
.vs-col{border:0;border-radius:0;padding:clamp(1.8rem,4vw,3.4rem);background:#fff}
.vs-col h3{font-size:clamp(1.9rem,3.2vw,2.7rem);margin:.7rem 0 .4rem}
.vs-col:not(.ours){color:var(--grigio)}
.vs-col:not(.ours) h3{color:#A39C8F}
.vs-col.ours{background:var(--notte);color:var(--avorio);border:0;box-shadow:none}
.vs-col.ours .tagline{color:var(--sabbia-3)}
.vs-col.ours .steps li{border-color:rgba(251,248,243,.16)}
.vs-col.ours .steps .n{color:var(--grano-3)}
.tagline{letter-spacing:.26em;font-size:.64rem}
.steps li{padding:1rem 0;font-size:.98rem}
.steps li .n{font-family:var(--display);font-size:1.25rem;width:2rem;letter-spacing:.04em;padding-top:0;line-height:1.35}
@media(max-width:880px){.vs{grid-template-columns:1fr}}
.claim{font-family:var(--display);text-transform:uppercase;font-size:clamp(2.2rem,5.4vw,4.4rem);line-height:.96;max-width:18ch;margin-top:clamp(3rem,6vw,5rem);letter-spacing:.015em}

/* ---------- passaporto ---------- */
.pass-form input,.nl input,input,textarea,select{border-radius:0;background:#fff;border-color:var(--hair)}
.pass-form input{padding:1.05rem 1.3rem;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem}
input:focus,textarea:focus,select:focus,.pass-form input:focus{border-color:var(--notte);box-shadow:none}
.pass-card{box-shadow:none;border-color:var(--notte)}
.pass-top{background:var(--notte);color:var(--avorio);padding:1.4rem 1.6rem}
.pass-top .lbl{letter-spacing:.26em;color:var(--sabbia-3);opacity:1}
.pass-top .code{font-family:var(--display);font-size:2.2rem;letter-spacing:.06em;text-transform:uppercase;line-height:1}
.pass-body{padding:1rem 1.6rem 1.5rem}
.prow .v,.podere-meta .v{font-family:"Instrument Sans",sans-serif;font-weight:600;font-size:1rem}
.prow .k,.podere-meta .k{letter-spacing:.22em;font-size:.6rem}
.pass-note::before{color:var(--grano-scuro)}
.hint b{color:var(--inchiostro);border-bottom:1px solid var(--sabbia-3)}
.pass-media img{width:100%;aspect-ratio:4/5;object-fit:cover}

/* ---------- annata: campitura bosco ---------- */
.annata{background:var(--bosco);color:var(--avorio)}
.annata h2 em{color:var(--grano-3)}
.annata .eyebrow{color:var(--sabbia-3)}
.annata .lead{color:rgba(251,248,243,.8)}
.nums{background:transparent;border:0;border-top:1px solid rgba(251,248,243,.2);gap:0;border-radius:0;margin-top:2.4rem}
.num{background:transparent;padding:1.5rem 1rem 1.5rem 0;border-bottom:1px solid rgba(251,248,243,.2)}
.num .v{font-family:var(--display);font-size:clamp(2.6rem,5vw,4rem);color:var(--sabbia-3);letter-spacing:.02em;text-transform:uppercase}
.num .k{letter-spacing:.2em;font-size:.6rem;opacity:.75}
.ann-quote{border-left:1px solid var(--sabbia-3);font-weight:300;padding-left:1.6rem;font-size:clamp(1.1rem,1.9vw,1.4rem)}
.ann-media img{width:100%;aspect-ratio:4/5;object-fit:cover}

/* ---------- campi ---------- */
.mapwrap{border:0;width:100vw;margin-left:calc(50% - 50vw)}
.mapwrap img{height:clamp(340px,52vw,720px)}
.pin{border-radius:0;background:var(--notte);color:var(--avorio);border:1px solid rgba(251,248,243,.35);font-size:.64rem;
  letter-spacing:.18em;text-transform:uppercase;padding:.6rem .95rem;box-shadow:none;font-weight:600}
.pin::before{background:var(--grano-3);border-radius:0;transform:rotate(45deg);width:6px;height:6px}
.pin:hover,.pin[aria-expanded="true"]{background:var(--sabbia-3);color:var(--notte);border-color:var(--sabbia-3);transform:translate(-50%,-50%)}
.pin:hover::before,.pin[aria-expanded="true"]::before{background:var(--notte)}
.podere-info{border:0;border-bottom:1px solid var(--hair);background:transparent;padding:2.2rem 0;margin-top:0}
.podere-info h3{font-size:clamp(2rem,3.6vw,3rem)}

/* ---------- calendario: banda notte ---------- */
.cal{background:var(--notte);color:var(--avorio)}
.cal .lead{color:rgba(251,248,243,.72)}
.cal h2 em{color:var(--grano-3)}
.cal .eyebrow{color:var(--sabbia-3)}
.cal .sec-head::after{background:rgba(214,191,158,.5)}
.rail{gap:0;padding:0 0 1.4rem;border-top:1px solid rgba(251,248,243,.18)}
.rail>*,.rail>*:nth-child(2n),.rail>*:hover{transform:none}
.rail>*{flex-basis:clamp(250px,25vw,320px);scroll-snap-align:start}
.mese{background:transparent;border:0;border-right:1px solid rgba(251,248,243,.18);border-radius:0;padding:2rem 1.8rem 2.2rem;transition:background .4s var(--ease)}
.mese:hover{background:var(--notte-2)}
.mese .m{color:var(--sabbia-3);letter-spacing:.24em;font-size:.62rem;font-weight:600}
.mese h3{font-size:2rem;margin:.8rem 0 .8rem}
.mese p{color:rgba(251,248,243,.68);font-size:.92rem}
.ico{stroke:var(--grano-3);width:34px;height:34px;margin-bottom:1.6rem;stroke-width:1.1}
.rail-nav{top:-4.2rem}
.rail-nav button{border-radius:0;border:1px solid rgba(251,248,243,.45);background:transparent;color:var(--avorio);width:52px;height:52px;transition:background .3s,color .3s}
.rail-nav button:hover{background:var(--sabbia-3);color:var(--notte);border-color:var(--sabbia-3);transform:none}

/* ---------- le paste: il prodotto eroe (alla Filotea) ---------- */
#paste{background:#fff}
.pack-hero{background:transparent;border:0;padding:0;grid-template-columns:1fr 1fr;gap:0;margin-bottom:0;align-items:stretch}
.pack-hero>img{background:var(--lino);max-width:none;width:100%;height:100%;max-height:640px;object-fit:contain;padding:clamp(2rem,5vw,4rem);filter:none;mix-blend-mode:multiply}
.pack-hero>div{background:var(--notte);color:var(--avorio);padding:clamp(2rem,5vw,4.5rem);display:flex;flex-direction:column;justify-content:center}
.pack-hero>div .eyebrow{color:var(--sabbia-3)}
.pack-hero>div h3{font-size:clamp(2.2rem,4.2vw,3.8rem)!important;margin:1.1rem 0 1.1rem!important}
.pack-hero>div p[style]{color:rgba(251,248,243,.74)!important}
.pack-hero .podere-meta{border-color:rgba(251,248,243,.2);gap:2.2rem;margin-top:1.4rem;padding-top:1.4rem}
.pack-hero .podere-meta .k{color:var(--sabbia-3)}
.pack-hero .btn-p{background:var(--sabbia-3);border-color:var(--sabbia-3);color:var(--notte)}
.pack-hero .btn-p:hover{background:var(--avorio);border-color:var(--avorio)}
.pack-hero .btn-s{color:var(--avorio);border-color:rgba(251,248,243,.55)}
.pack-hero .btn-s:hover{background:var(--avorio);color:var(--notte)}
@media(max-width:760px){.pack-hero{grid-template-columns:1fr}.pack-hero>img{max-height:420px}}
.paste-grid{gap:0;grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.paste-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.paste-grid{grid-template-columns:1fr}}
.pasta{border:0;border-radius:0;padding:clamp(1.8rem,3vw,2.6rem);min-height:340px;background:var(--lino);transition:filter .4s var(--ease)}
.pasta:nth-child(2){background:var(--sabbia-3)}
.pasta:nth-child(3){background:var(--bosco);color:var(--avorio)}
.pasta:nth-child(4){background:var(--grano-3)}
.pasta:hover{transform:none;box-shadow:none;filter:brightness(1.06)}
.pasta h3{font-size:clamp(1.9rem,2.6vw,2.4rem);margin:1.4rem 0 .8rem}
.pasta p{color:inherit;opacity:.8;font-size:.93rem}
.badge{border-radius:0;background:transparent;color:inherit;padding:0;letter-spacing:.26em;font-size:.6rem;opacity:.75}
.formati{border-color:currentColor;color:inherit;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;border-top:1px solid;opacity:.85;padding-top:1.1rem}
.fmt,.tier,.pdp-media,.diario-box,.qty{border-radius:0}
.fmt:hover{transform:none;box-shadow:none;border-color:var(--notte)}
.fmt .n,.price-row .p,.tier .price{font-family:var(--display);text-transform:uppercase;letter-spacing:.03em}
.fmt .n{font-size:1.5rem}.price-row .p{font-size:3.2rem}.tier .price{font-size:3rem}
.fmt .p{color:var(--inchiostro)}
.pdp-media{background:var(--lino);border:0}
table.nut td:last-child,table.nut th:last-child{font-family:inherit;font-weight:600}
.acc summary{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;padding:1.3rem 0}
.acc summary::after{color:var(--inchiostro)}

/* ---------- club: banda fotografica ---------- */
.club{position:relative;isolation:isolate;background:var(--notte) url(../../../uploads/2026/09/bertoli-campo-tramonto.jpg) center 60%/cover no-repeat;color:var(--avorio);
  padding:clamp(6rem,13vw,12rem) 0}
.club::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(20,18,14,.62),rgba(20,18,14,.78))}
.club h2 em{color:var(--grano-3)}
.club .eyebrow{color:var(--sabbia-3)}
.club .lead{color:rgba(251,248,243,.86)}
.club .sec-head{margin-bottom:0}
.club .sec-head::after{display:none}
.club .tiers{margin-top:4rem}
.tier{color:var(--inchiostro);border:0;padding:2.4rem}
.tier.mid{box-shadow:none;outline:1px solid var(--sabbia-3);outline-offset:-10px}
.tier.mid::after{border-radius:0;background:var(--notte);top:0;left:0;letter-spacing:.22em;padding:.5rem 1rem}
.tier .tagline{color:var(--sabbia-scura)}
.tier li::before{color:var(--grano-scuro)}

/* ---------- visite: mosaico a filo (alla Arcenni) ---------- */
.exp-grid{gap:0;grid-template-columns:repeat(4,1fr);width:100vw;margin-left:calc(50% - 50vw)}
@media(max-width:1100px){.exp-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.exp-grid{grid-template-columns:1fr}}
.exp{border:0;border-radius:0;min-height:clamp(380px,38vw,560px)}
.exp::after{background:linear-gradient(to top,rgba(20,18,14,.88) 4%,rgba(20,18,14,.1) 60%,transparent)}
.exp .in{padding:clamp(1.6rem,2.6vw,2.4rem)}
.exp .when{color:var(--sabbia-3);letter-spacing:.24em;font-size:.6rem;font-weight:600}
.exp h3{font-size:clamp(1.9rem,2.6vw,2.5rem);margin:.8rem 0 .6rem}
.exp.plain{background:var(--bosco)}
.exp.plain .in,.exp.plain h3{color:var(--avorio)}
.exp.plain p{color:rgba(251,248,243,.78)}
.exp.plain .btn{color:var(--avorio);border-color:rgba(251,248,243,.55)}
.exp.plain .btn:hover{background:var(--avorio);color:var(--notte)}
#visite{padding-bottom:0}

/* ---------- famiglia ---------- */
#famiglia{background:var(--avorio)!important}
.fam-media{gap:0}
.fam-media img{aspect-ratio:3/4;width:100%}
.fam-media img:first-child{margin-top:4rem}
.bigquote{font-weight:300;font-size:clamp(1.4rem,2.6vw,2.15rem);line-height:1.36;color:var(--inchiostro)}
.sign{letter-spacing:.24em;font-size:.64rem;color:var(--sabbia-scura)}

/* ---------- numeri ---------- */
.numeri{background:var(--notte);color:var(--avorio);padding:clamp(3.5rem,7vw,6rem) 0}
.numeri .grid{gap:0}
.numeri .grid>div{padding:1rem;border-left:1px solid rgba(251,248,243,.16)}
.numeri .grid>div:first-child{border-left:0}
.numeri .v{font-family:var(--display);font-size:clamp(3.4rem,7vw,6rem);color:var(--sabbia-3);letter-spacing:.02em}
.numeri .k{color:rgba(251,248,243,.65);letter-spacing:.24em;font-size:.6rem;margin-top:.9rem}
@media(max-width:760px){.numeri .grid{grid-template-columns:repeat(2,1fr)}.numeri .grid>div{border-left:0;border-top:1px solid rgba(251,248,243,.16);padding:1.6rem 1rem}}

/* ---------- diario ---------- */
#diario{background:var(--sabbia-3);padding:clamp(4rem,8vw,7rem) 0}
.diario-box{background:transparent;border:0;padding:0}
.diario-box h2{font-size:clamp(2.6rem,5.4vw,4.6rem)!important}
.diario-box .eyebrow{color:var(--notte)}
.diario-box p[style]{color:#4A4336!important}
.nl input{border-color:var(--notte);background:transparent;padding:1.05rem 1.2rem}
.nl input::placeholder{color:#5A5243}
#diario .hint{color:#4A4336}

/* ---------- testata pagine interne ---------- */
.phero{background:var(--notte);color:var(--avorio);border:0;padding:clamp(4rem,9vw,8rem) 0 clamp(3rem,6vw,5rem)}
.phero h1{max-width:14ch;margin:1.4rem 0 1.4rem}
.phero h1 em{color:var(--grano-3)}
.phero .lead{color:rgba(251,248,243,.78)}
.phero .eyebrow{color:var(--sabbia-3)}
.crumb{letter-spacing:.24em;font-size:.62rem;color:rgba(251,248,243,.55)}
.crumb a{color:var(--sabbia-3)}
.vwin,.vwin.wide{border-radius:0;border:0;box-shadow:none}
.vwin figcaption{border-radius:0;border:0;background:var(--notte);color:var(--avorio);letter-spacing:.2em;font-size:.6rem;padding:.55rem .9rem;left:0;bottom:0}
.seal,.sun{display:none}
.chip{border-radius:0;background:transparent;letter-spacing:.18em;font-size:.62rem}

/* ---------- footer notte ---------- */
footer{background:var(--notte);color:rgba(251,248,243,.78);padding:clamp(4rem,8vw,6.5rem) 0 2rem;border-top:1px solid rgba(251,248,243,.1)}
footer h4{font-family:var(--display);font-weight:400;font-size:1.35rem;letter-spacing:.08em;color:var(--avorio);margin-bottom:1.2rem}
footer li{padding:.34rem 0;font-size:.9rem}
footer a:hover{color:var(--sabbia-3)}
.f-logo .wm-b i{color:var(--sabbia-3)}.f-logo .wm-ear{color:var(--grano-3)}.f-logo .wm-rule{background:var(--sabbia-3)}
.f-bot{border-color:rgba(251,248,243,.14);letter-spacing:.12em;font-size:.66rem;text-transform:uppercase;margin-top:3.5rem}

/* ---------- movimento: una sola entrata sobria ---------- */
.rv{clip-path:none;opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0ms)}
.rv.in{opacity:1;transform:none;clip-path:none}
h1 .w,h2 .w{transform:translateY(.5em);animation:wpop3 .9s var(--ease) forwards;animation-delay:var(--d,0ms)}
@keyframes wpop3{to{transform:none;opacity:1}}
.tilt:hover{box-shadow:none}
.grain-pop{display:none}
.exp img{transition:transform 1.4s var(--ease)}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.hero3-bg{animation:none}}

/* ---------- rifiniture ---------- */
/* logo reale */
.brand{gap:0}
.logo-img{display:block;height:74px;width:auto}
.logo-img-f{height:96px;margin-bottom:.4rem}
@media(max-width:1080px){.logo-img{height:58px}}
@media(max-width:640px){.logo-img{height:50px}}
/* hero: foto drone su desktop, video cliente su mobile */
.hero3-bg-d{object-position:center 45%}
.hero3-bg-m{display:none}
@media(max-width:760px){.hero3-bg-d{display:none}.hero3-bg-m{display:block}}
/* famiglia: ritratto largo + due verticali */
.fam-media .fam-wide{grid-column:1/-1;aspect-ratio:16/9;margin-top:0!important}
.fam-media img:nth-child(2){margin-top:0}
h1,h2,h3,.claim,.manifesto p{text-wrap:balance}
.sec-head h2{max-width:24ch}
.claim{max-width:24ch}
.pano img{object-position:center 80%}
@media(max-width:640px){
  .eyebrow{letter-spacing:.22em;white-space:normal}
  .hero3 h1{font-size:clamp(3.4rem,17vw,5.2rem);line-height:.9}
  .hero3 .btn{width:100%;justify-content:center}
  .fam-media img:first-child{margin-top:2rem}
  .rail-nav{margin:0 0 1rem}
  .mese{padding:1.6rem 1.3rem}
}
