/* ============================================================
   STEFANO SCARPA · Private Banker — design system condiviso
   Verde bosco + oro, eleganza sobria "private banking mediterraneo".
   Font: Poppins (Google Fonts). Mobile-first.
   ============================================================ */
:root{
  --verde-scuro:#1A3A2E;
  --verde-scuro-2:#142E24;      /* per gradienti/superfici più profonde */
  --verde-medio:#2D5A45;
  --oro:#C9A84C;
  --oro-chiaro:#DDBE6A;
  --avorio:#F8F6F0;
  --avorio-2:#F1EDE2;           /* superfici chiare alternate */
  --testo-scuro:#22332C;        /* testo su fondi chiari */
  --testo-muted:#5C6B63;        /* testo secondario su fondi chiari */
  --ink:#F4F1E8;                /* testo su fondi scuri */
  --ink-muted:rgba(244,241,232,.68);
  --line-dark:rgba(201,168,76,.22);      /* hairline oro su scuro */
  --line-light:rgba(34,51,44,.12);       /* hairline su chiaro */
  --rosso:#B23A3A;
  --rosso-soft:#F3E4E2;
  --ease:cubic-bezier(.22,.61,.36,1);
  --px:clamp(1.1rem,4vw,2.5rem);
  --radius:14px;
  --shadow-soft:0 14px 40px rgba(26,58,46,.10);
  --shadow-deep:0 22px 60px rgba(20,46,36,.28);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{
  font-family:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  background:var(--avorio);color:var(--testo-scuro);
  line-height:1.75;font-size:16px;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
::selection{background:var(--oro);color:var(--verde-scuro)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--oro);outline-offset:3px;border-radius:4px;
}

h1,h2,h3,h4{font-weight:600;line-height:1.2;color:var(--verde-scuro);letter-spacing:-.01em}
.sez-scura h1,.sez-scura h2,.sez-scura h3,.sez-scura h4{color:var(--ink)}

/* ---------- utilità layout ---------- */
.wrap{max-width:1120px;margin:0 auto;padding-left:var(--px);padding-right:var(--px)}
.wrap-stretto{max-width:820px;margin:0 auto;padding-left:var(--px);padding-right:var(--px)}
.sez{padding:clamp(3.4rem,8vw,6.5rem) 0}
.sez-scura{background:linear-gradient(180deg,var(--verde-scuro) 0%,var(--verde-scuro-2) 100%);color:var(--ink)}
.sez-scura p{color:var(--ink-muted)}
.sez-avorio-2{background:var(--avorio-2)}

.eyebrow{
  display:inline-flex;align-items:center;gap:.7rem;
  font-size:.74rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
  color:var(--verde-medio);margin-bottom:1rem;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--oro)}
.sez-scura .eyebrow{color:var(--oro)}
.titolo-sez{font-size:clamp(1.65rem,3.6vw,2.5rem);max-width:22ch;text-wrap:balance;margin-bottom:1.1rem}
.centro{text-align:center}
.centro .titolo-sez{margin-left:auto;margin-right:auto}
.centro .eyebrow{justify-content:center}
.centro .eyebrow::before{display:none}
.centro .eyebrow::after{display:none}
.sotto-sez{max-width:62ch;color:var(--testo-muted);font-size:1.02rem}
.sez-scura .sotto-sez{color:var(--ink-muted)}
.centro .sotto-sez{margin-left:auto;margin-right:auto}

/* ---------- bottoni ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  text-align:center;
  font-weight:600;font-size:.95rem;letter-spacing:.02em;
  padding:.95rem 2.1rem;border-radius:999px;border:1px solid transparent;
  cursor:pointer;transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s,color .22s,border-color .22s;
  will-change:transform;
}
.btn-oro{background:var(--oro);color:var(--verde-scuro);box-shadow:0 10px 26px rgba(201,168,76,.32)}
.btn-oro:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(201,168,76,.42);background:var(--oro-chiaro)}
.btn-fantasma{background:transparent;color:var(--ink);border-color:rgba(244,241,232,.4)}
.btn-fantasma:hover{border-color:var(--oro);color:var(--oro)}
.btn-verde{background:var(--verde-scuro);color:var(--avorio);box-shadow:var(--shadow-soft)}
.btn-verde:hover{transform:translateY(-2px);background:var(--verde-medio)}
.btn:active{transform:translateY(0)}
.btn-nota{font-size:.8rem;color:var(--testo-muted);margin-top:.7rem}

/* ---------- NAVBAR ---------- */
#nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  transition:background .4s var(--ease),box-shadow .4s var(--ease),backdrop-filter .4s;
}
#nav.solida{
  background:rgba(20,46,36,.68);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 6px 24px rgba(10,24,18,.25);
}
.nav-in{
  max-width:1200px;margin:0 auto;padding:.8rem var(--px);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.brand img{height:44px;width:auto}
.menu{display:flex;align-items:center;gap:clamp(1rem,2.4vw,2rem)}
.menu a{
  font-size:.88rem;font-weight:500;color:var(--ink);
  position:relative;padding:.3rem 0;white-space:nowrap;
}
.menu a:not(.btn)::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:0;
  background:var(--oro);transition:width .3s var(--ease);
}
.menu a:not(.btn):hover::after,.menu a.attiva::after{width:100%}
.menu a.attiva{color:var(--oro)}
.menu .btn{padding:.6rem 1.4rem;font-size:.82rem}
/* CTA compatta nel top bar mobile: la consulenza resta a un tocco
   anche durante la discesa e le pagine lunghe (il menu completo sta nel burger) */
.btn-nav-mob{display:none}
.burger{
  display:none;background:none;border:0;cursor:pointer;padding:.5rem;
  flex-direction:column;gap:5px;
}
.burger span{display:block;width:24px;height:2px;background:var(--ink);transition:transform .3s var(--ease),opacity .3s}
@media(max-width:920px){
  .btn-nav-mob{display:inline-flex;margin-left:auto;padding:.55rem 1.05rem;font-size:.78rem;white-space:nowrap}
  .burger{display:flex}
  .menu{
    position:fixed;inset:0;z-index:-1;flex-direction:column;justify-content:center;
    background:rgba(20,46,36,.96);gap:1.6rem;
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    opacity:0;pointer-events:none;transition:opacity .35s var(--ease);
  }
  .menu a{font-size:1.15rem}
  body.menu-aperto .menu{opacity:1;pointer-events:auto}
  body.menu-aperto{overflow:hidden}
  body.menu-aperto .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.menu-aperto .burger span:nth-child(2){opacity:0}
  body.menu-aperto .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  body.menu-aperto #nav{background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ---------- HEADER pagine interne (fascia verde) ---------- */
.testata{
  background:linear-gradient(160deg,var(--verde-scuro) 0%,var(--verde-medio) 130%);
  color:var(--ink);padding:clamp(7rem,15vw,9.5rem) 0 clamp(2.6rem,6vw,4rem);
  position:relative;overflow:hidden;
}
.testata::after{ /* alone oro discreto */
  content:"";position:absolute;width:60vmax;height:38vmax;right:-18vmax;top:-16vmax;
  background:radial-gradient(ellipse at center,rgba(201,168,76,.14) 0%,transparent 65%);
  pointer-events:none;
}
.testata h1{color:var(--ink);font-size:clamp(1.9rem,4.6vw,3rem);max-width:20ch;text-wrap:balance}
.testata .sotto{color:var(--ink-muted);font-size:1.06rem;max-width:58ch;margin-top:1rem}
.briciole{
  position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;
  font-size:.76rem;letter-spacing:.06em;color:var(--ink-muted);margin-bottom:1.4rem;
}
.briciole a:hover{color:var(--oro)}
.briciole span[aria-hidden]{color:var(--oro)}

/* ---------- CARD generiche ---------- */
.card{
  background:#fff;border:1px solid var(--line-light);border-radius:var(--radius);
  padding:1.9rem 1.7rem;box-shadow:var(--shadow-soft);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 48px rgba(26,58,46,.14)}
.card-icona{
  width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--verde-scuro);color:var(--oro);margin-bottom:1.15rem;flex:none;
}
.card-icona svg{width:26px;height:26px}
.card h3{font-size:1.08rem;margin-bottom:.55rem}
.card p{font-size:.93rem;color:var(--testo-muted)}

/* ---------- reveal on scroll ---------- */
.rivela{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rivela.in{opacity:1;transform:none}
.rit-1{transition-delay:.08s}.rit-2{transition-delay:.16s}.rit-3{transition-delay:.24s}.rit-4{transition-delay:.32s}
@media(prefers-reduced-motion:reduce){
  .rivela{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ---------- FOOTER ---------- */
footer{background:var(--verde-scuro-2);color:var(--ink-muted);padding:3.4rem 0 2.2rem;font-size:.88rem}
.foot-su{
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.4rem;
  padding-bottom:2.2rem;border-bottom:1px solid var(--line-dark);
}
.foot-logo img{height:52px;width:auto;margin-bottom:1rem}
.foot-su h4{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--oro);margin-bottom:1rem;font-weight:600}
.foot-su ul{list-style:none}
.foot-su li{margin-bottom:.55rem}
.foot-su a{transition:color .25s}
.foot-su a:hover{color:var(--oro)}
.foot-compliance{
  font-size:.78rem;line-height:1.8;color:rgba(244,241,232,.6);
  padding-top:1.8rem;max-width:900px;
}
.foot-compliance strong{color:rgba(244,241,232,.75);font-weight:600}
.foot-riga{
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  margin-top:1.6rem;font-size:.78rem;color:rgba(244,241,232,.55);
}
.foot-riga nav{display:flex;gap:1.1rem}
.foot-riga a:hover{color:var(--oro)}
@media(max-width:760px){.foot-su{grid-template-columns:1fr;gap:1.8rem}}

/* ---------- COOKIE GATE — sito sfocato finché non si sceglie ---------- */
html.ck-locked,html.ck-locked body{overflow:hidden}
#ss-site,#ds-canvas,#ds-poster{transition:filter .55s var(--ease)}
html.ck-locked #ss-site{filter:blur(8px);pointer-events:none;-webkit-user-select:none;user-select:none}
html.ck-locked #ds-canvas,html.ck-locked #ds-poster{filter:blur(11px)}

/* ---------- COOKIE BANNER ---------- */
.hidden{display:none!important}
#ss-cookie{
  position:fixed;bottom:1.4rem;left:50%;transform:translateX(-50%);z-index:9998;
  width:min(92vw,560px);
  background:rgba(20,46,36,.96);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid var(--line-dark);border-radius:12px;
  padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:.85rem;
  box-shadow:0 18px 50px rgba(8,20,15,.55);color:var(--ink-muted);
}
#ss-cookie .ck-txt{font-size:.86rem;line-height:1.6}
#ss-cookie .ck-txt strong{color:var(--ink)}
#ss-cookie .ck-txt a{color:var(--oro);text-decoration:underline;text-underline-offset:2px}
#ss-cookie .ck-btns{display:flex;gap:.65rem;justify-content:flex-end;flex-wrap:wrap}
.ck-btn{
  font-size:.82rem;font-weight:600;padding:.55rem 1.2rem;border-radius:999px;cursor:pointer;
  border:1px solid rgba(244,241,232,.28);background:transparent;color:var(--ink-muted);
  transition:color .3s,border-color .3s,filter .3s;
}
.ck-btn:hover{color:var(--ink);border-color:rgba(244,241,232,.5)}
.ck-btn.p{background:var(--oro);color:var(--verde-scuro);border-color:var(--oro)}
.ck-btn.p:hover{filter:brightness(1.08)}
@media(max-width:600px){#ss-cookie{bottom:.9rem;padding:1rem 1.1rem}}

/* ---------- pagine legali ---------- */
.legale{padding:clamp(2.6rem,6vw,4.2rem) 0 clamp(3.4rem,8vw,5.5rem)}
.legale h2{font-size:1.35rem;margin:2.4rem 0 .8rem}
.legale h3{font-size:1.05rem;margin:1.6rem 0 .5rem}
.legale p,.legale li{font-size:.96rem;color:var(--testo-muted)}
.legale ul,.legale ol{margin:.4rem 0 1rem 1.3rem}
.legale li{margin-bottom:.45rem}
.legale a{color:var(--verde-medio);text-decoration:underline;text-underline-offset:2px}
.legale .box-riepilogo{
  background:#fff;border:1px solid var(--line-light);border-left:3px solid var(--oro);
  border-radius:10px;padding:1.3rem 1.5rem;margin:1.4rem 0;
}
.legale table{width:100%;border-collapse:collapse;font-size:.9rem;margin:1rem 0}
.legale th,.legale td{text-align:left;padding:.65rem .8rem;border-bottom:1px solid var(--line-light);vertical-align:top}
.legale th{color:var(--verde-scuro);font-weight:600;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase}
.legale .aggiornamento{font-size:.82rem;color:var(--testo-muted);font-style:italic}
@media(max-width:640px){
  .legale table{display:block;overflow-x:auto}
}

/* ---------- placeholder foto Stefano ---------- */
.foto-attesa{
  position:relative;border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(160deg,var(--verde-scuro) 0%,var(--verde-medio) 120%);
  border:1px solid var(--line-dark);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;
  box-shadow:var(--shadow-deep);
}
.foto-attesa .mono{
  font-family:Georgia,'Times New Roman',serif;font-size:clamp(4rem,9vw,6.5rem);
  color:var(--oro);line-height:1;
}
.foto-attesa .mono-cornice{
  width:clamp(96px,16vw,140px);height:clamp(96px,16vw,140px);
  border:1px solid rgba(201,168,76,.45);border-radius:18px;
  display:flex;align-items:center;justify-content:center;
}
.foto-attesa .nota-foto{
  font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;
  color:rgba(244,241,232,.34);margin-top:.9rem;
}

/* ---------- form ---------- */
.campo{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1.05rem}
.campo label{font-size:.8rem;font-weight:600;letter-spacing:.05em;color:var(--verde-scuro)}
.campo input{
  font-family:inherit;font-size:.95rem;padding:.8rem 1rem;
  border:1px solid var(--line-light);border-radius:10px;background:#fff;color:var(--testo-scuro);
  transition:border-color .25s,box-shadow .25s;
}
.campo input:focus{outline:none;border-color:var(--verde-medio);box-shadow:0 0 0 3px rgba(45,90,69,.14)}
.campo input.errore{border-color:var(--rosso);box-shadow:0 0 0 3px rgba(178,58,58,.12)}
.campo .msg-errore{display:none;font-size:.76rem;color:var(--rosso)}
.campo input.errore + .msg-errore,.campo input.errore ~ .msg-errore{display:block}
.consenso{display:flex;gap:.6rem;align-items:flex-start;font-size:.8rem;color:var(--testo-muted);margin:0 0 1.2rem}
.consenso input{margin-top:.28rem;accent-color:var(--verde-medio)}
.consenso a{color:var(--verde-medio);text-decoration:underline;text-underline-offset:2px}

/* ---------- avviso esito form (condiviso: contatti + opt-in simulatore) ---------- */
.form-avviso{display:none;border-radius:10px;padding:1rem 1.2rem;font-size:.88rem;margin-bottom:1.1rem;line-height:1.6}
.form-avviso.ok{display:block;background:#EAF3EC;border:1px solid #BFD9C6;color:#1F4A32}
.form-avviso.errore{display:block;background:var(--rosso-soft);border:1px solid #E0C4C0;color:#7C2D2D}

/* ---------- disclaimer educativo ---------- */
.disclaimer{
  border:1px solid var(--line-light);border-left:3px solid var(--oro);
  background:#fff;border-radius:10px;padding:1.15rem 1.4rem;margin:1.6rem 0;
  font-size:.86rem;color:var(--testo-muted);line-height:1.7;
}
.disclaimer strong{
  display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--verde-scuro);margin-bottom:.35rem;
}
.sez-scura .disclaimer{background:rgba(255,255,255,.05);border-color:var(--line-dark);color:var(--ink-muted)}
.sez-scura .disclaimer strong{color:var(--oro)}
