/* Fondamenta comuni alle tre proposte: font e palette del sito attuale. */
@font-face{font-family:'Clash Display';src:url(/assets/a0.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Clash Display';src:url(/assets/a1.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Clash Display';src:url(/assets/a2.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Satoshi';src:url(/assets/a3.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Satoshi';src:url(/assets/a4.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Satoshi';src:url(/assets/a5.woff2) format('woff2');font-weight:700;font-display:swap}

:root{
  --gold:#d3be93; --gold-bright:#f7ecc9; --champ:#e7d4a2;
  --green:#073830; --nearblack:#041a16; --midnight:#0a1628;
  --text:#ece7d8; --muted:#b8c3bb;
  --foto:url('/assets/a6.jpg');
  /* Luce da sopra: bordo chiaro in cima, ombra sotto. Tre strati, mai uno solo. */
  --lift:inset 0 1px 0 0 rgba(255,255,255,.10), 0 2px 6px rgba(0,0,0,.34), 0 12px 34px rgba(0,0,0,.28);
  --lift-alto:inset 0 1px 0 0 rgba(255,255,255,.16), 0 6px 14px rgba(0,0,0,.38), 0 26px 60px rgba(0,0,0,.32);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{
  font-family:'Satoshi',system-ui,sans-serif;color:var(--text);line-height:1.7;
  background:var(--nearblack);-webkit-font-smoothing:antialiased;
}
/* Grana finissima: toglie il "digitale piatto" senza farsi notare. */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.55'/></svg>");
}

.marchio{display:flex;align-items:center;gap:.9rem}
.marchio i{
  width:2.5rem;height:6px;border-radius:50%;flex:none;
  background:radial-gradient(closest-side,rgba(211,190,147,.98),rgba(211,190,147,.4) 68%,rgba(211,190,147,0));
}
/* Il marchio è testo, non un fregio: 17px è il pavimento anche sul telefono.
   Prima il clamp partiva da 13px e toccava i 17 solo oltre i 1133px di
   finestra — cioè su nessun telefono e su nessun tablet. */
.marchio span{
  font-family:'Clash Display',sans-serif;font-size:clamp(17px,1.5vw,19px);font-weight:600;
  text-transform:uppercase;letter-spacing:.22em;color:#dcc588;text-wrap:balance;
}

/* Era .78rem = 13,3px: sotto la soglia di lettura, e su OGNI etichetta di
   OGNI modulo del sito — compreso «Il tuo indirizzo email» sulla porta
   d'ingresso, che è la prima cosa che legge chi entra la prima volta.
   Il maiuscoletto spaziato rimpicciolisce già di suo: non si parte da sotto. */
label{display:block;font-size:1rem;letter-spacing:.14em;text-transform:uppercase;
      color:var(--muted);margin-bottom:.6rem;font-weight:600}
input[type=email],input[type=text]{
  width:100%;padding:1.05rem 1.25rem;border-radius:14px;
  border:1px solid rgba(211,190,147,.28);background:rgba(4,26,22,.5);
  color:var(--text);font:inherit;font-size:1.05rem;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
input::placeholder{color:rgba(184,195,187,.45)}
input:focus{outline:none;border-color:var(--gold);background:rgba(4,26,22,.72);
            box-shadow:0 0 0 4px rgba(211,190,147,.14)}
button.entra{
  width:100%;margin-top:1.1rem;padding:1.05rem 2rem;border:0;border-radius:14px;cursor:pointer;
  background:linear-gradient(180deg,#f2e2b4,#d9c188);color:#0a2a22;
  font-family:'Clash Display',sans-serif;font-size:1rem;font-weight:700;
  letter-spacing:.06em;box-shadow:var(--lift);
  transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s,filter .18s;
}
button.entra:hover{transform:translateY(-2px);box-shadow:var(--lift-alto);filter:brightness(1.05)}
button.entra:active{transform:translateY(0)}
button.entra:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
.nota{margin-top:1.5rem;font-size:.88rem;color:var(--muted);line-height:1.6}
.nota b{color:var(--champ);font-weight:600}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
