/* =========================================================
   D'Acquisto Rappresentanze
   Impresso ADV
   ========================================================= */

:root{
  --ink:        #0e1a26;
  --paper:      #f6f3ec;
  --paper-2:    #efeade;
  --white:      #fffdfa;
  --text:       #2a3644;
  --muted:      #5c6672;
  --muted-dark: #9aa7b5;
  --line:       #ddd5c5;
  --line-2:     #c9bfa9;
  --line-dark:  #2a3d52;
  --brass:      #a97f3d;
  --brass-lt:   #c9a468;
  --brass-pale: #e9dfc9;
  --brass-btn:  #916b30;   /* fondo CTA: bianco a 4.8:1 */
  --brass-btn-h:#7f5c24;   /* hover CTA */
  --brass-text: #8a6428;   /* testo brass piccolo su fondi chiari */

  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans:  "Source Sans 3", -apple-system, "Segoe UI", system-ui, sans-serif;

  --wrap: 1200px;
  --gutter: clamp(1.25rem, 5vw, 3rem);
  --section-y: clamp(4.5rem, 9vw, 8rem);

  --radius: 2px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,svg{ max-width:100%; display:block; }
a{ color:inherit; }

/* --- niente parole orfane: bilancia i titoli, evita righe da una parola --- */
h1,h2,h3,
.manifesto__quote,.section__intro,.prose__lead,.door h3,.quote p{
  text-wrap:balance;
}
p,li,figcaption,td,th,label,.facts__label,.cookie__row span{ text-wrap:pretty; }

h1,h2,h3{
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-0.012em;
  line-height:1.1;
  margin:0;
  color:var(--ink);
}
h1{ font-size:clamp(2.7rem,6.2vw,5.1rem); line-height:1.04; }
h2{ font-size:clamp(1.95rem,3.9vw,3.1rem); line-height:1.12; }
h3{ font-size:1.3rem; line-height:1.25; }
p{ margin:0 0 1.1em; }
p:last-child{ margin-bottom:0; }

em{ font-style:italic; color:var(--brass); }
.legal__body em{ color:var(--brass-text); }

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

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:300;
  background:var(--ink); color:var(--white); padding:.75rem 1.25rem; font-size:.9rem;
}
.skip-link:focus{ left:1rem; top:1rem; }
:focus-visible{ outline:2px solid var(--brass-btn-h); outline-offset:3px; }
.nav :focus-visible, .hero :focus-visible, .values :focus-visible, .contact :focus-visible,
.footer :focus-visible, .dock :focus-visible, .cookie :focus-visible,
.skip-link:focus-visible{
  outline-color:var(--brass-lt);
}

/* barra di avanzamento lettura */
.progress{
  position:fixed; inset:0 0 auto 0; height:2px; z-index:150;
  background:transparent; pointer-events:none;
}
.progress span{
  display:block; height:100%; width:100%;
  background:linear-gradient(90deg,var(--brass),var(--brass-lt));
  transform:scaleX(0); transform-origin:left;
  transition:transform .1s linear;
}

/* ---------- eyebrow ---------- */
.eyebrow{
  font-size:.72rem; font-weight:600; text-transform:uppercase;
  letter-spacing:.2em; margin:0 0 1.1rem;
  color:var(--brass-lt);
  display:flex; align-items:center; gap:.85rem;
}
.eyebrow::after{ content:""; flex:none; width:2.4rem; height:1px; background:currentColor; opacity:.5; }
.eyebrow--dark{ color:var(--brass-text); }
.eyebrow--light{ color:var(--brass-lt); }

/* ---------- bottoni ---------- */
.btn{
  --btn-bg:var(--brass-btn); --btn-fg:#fff;
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center;
  min-height:52px; padding:.85rem 1.7rem;
  background:var(--btn-bg); color:var(--btn-fg);
  font-family:var(--sans); font-size:.95rem; font-weight:600;
  letter-spacing:.02em; text-decoration:none; cursor:pointer;
  border:1px solid var(--btn-bg); border-radius:var(--radius);
  transition:background .22s var(--ease), color .22s var(--ease),
             border-color .22s var(--ease), transform .22s var(--ease),
             box-shadow .3s var(--ease);
}
.btn:hover{ transform:translateY(-2px); }
.btn--brass:hover{ --btn-bg:var(--brass-btn-h); border-color:var(--brass-btn-h); box-shadow:0 14px 30px -18px rgba(169,127,61,.9); }
.btn--ghost{ --btn-bg:transparent; --btn-fg:var(--paper); border-color:rgba(246,243,236,.32); }
.btn--ghost:hover{ --btn-bg:rgba(246,243,236,.08); border-color:rgba(246,243,236,.55); }
.btn--outline{ --btn-bg:transparent; --btn-fg:var(--ink); border-color:var(--line-2); }
.btn--outline:hover{ --btn-bg:var(--paper-2); border-color:var(--ink); }
.btn--sm{ min-height:44px; padding:.6rem 1.2rem; font-size:.875rem; }
.btn--full{ width:100%; }
.btn[hidden],.cookie__link[hidden]{ display:none; }

.link-arrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-weight:600; font-size:.95rem; color:var(--brass-text);
  text-decoration:none; margin-top:1.6rem;
  border-bottom:1px solid transparent; padding-bottom:2px;
  transition:border-color .2s var(--ease);
}
.link-arrow::after{ content:"\2192"; transition:transform .25s var(--ease); }
.link-arrow:hover{ border-color:var(--brass-text); }
.link-arrow:hover::after{ transform:translateX(5px); }

/* =========================================================
   NAV
   ========================================================= */
.nav{
  /* attaccata al bordo: la barra di lettura le passa sopra, cosi' non resta
     nessuna fessura da cui si veda scorrere il contenuto */
  position:fixed; inset:0 0 auto 0; z-index:100;
  transition:background .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.is-solid{
  background:rgba(14,26,38,.94);
  backdrop-filter:blur(12px);
  border-bottom-color:var(--line-dark);
}
.nav__inner{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding:1.05rem var(--gutter);
  display:flex; align-items:center; gap:1.5rem;
}

.lockup{ display:flex; align-items:center; gap:.75rem; text-decoration:none; margin-right:auto; }
.lockup__mark{
  /* il cerchio del marchio e' gia' il suo contenitore: niente cornice quadrata */
  flex:none; width:38px; height:38px;
  display:grid; place-items:center;
  color:var(--brass-lt);
  transition:color .3s var(--ease);
}
.lockup__mark svg{ width:100%; height:100%; }
.lockup:hover .lockup__mark{ color:var(--brass-pale); }
.lockup__text{ display:flex; flex-direction:column; line-height:1.05; }
.lockup__name{ font-family:var(--serif); font-size:1.18rem; color:var(--paper); }
.lockup__sub{
  font-size:.62rem; font-weight:600; text-transform:uppercase;
  letter-spacing:.24em; color:var(--muted-dark); margin-top:.2rem;
}

.nav__links{ display:flex; gap:2rem; }
.nav__links a{
  font-size:.92rem; font-weight:500; color:rgba(246,243,236,.82);
  text-decoration:none; padding:.4rem 0; position:relative;
  transition:color .2s var(--ease);
}
.nav__links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:var(--brass-lt); transform:scaleX(0); transform-origin:left;
  transition:transform .3s var(--ease);
}
.nav__links a:hover{ color:var(--paper); }
.nav__links a:hover::after{ transform:scaleX(1); }

.nav__toggle{
  display:none; width:44px; height:44px; padding:10px;
  background:none; border:0; cursor:pointer;
  flex-direction:column; justify-content:center; gap:5px;
}
.nav__toggle span{ display:block; height:1.5px; background:var(--paper); transition:transform .25s var(--ease), opacity .2s; }
.nav__toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

.nav__mobile{
  background:var(--ink); border-top:1px solid var(--line-dark);
  padding:.5rem var(--gutter) 1.6rem;
  display:flex; flex-direction:column;
  max-height:calc(100dvh - 72px); overflow-y:auto; overscroll-behavior:contain;
}
.nav__mobile[hidden]{ display:none; }
@media (min-width:1025px){ .nav__mobile{ display:none !important; } }
.nav__mobile a{
  padding:1rem 0; color:var(--paper); text-decoration:none;
  border-bottom:1px solid var(--line-dark); font-size:1.05rem;
}
.nav__mobile-cta{
  margin-top:1.2rem; border-bottom:0 !important;
  background:var(--brass); text-align:center; font-weight:600;
  padding:.95rem 1rem !important;
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative; background:var(--ink); color:var(--paper);
  padding:clamp(8.5rem,15vw,11rem) 0 0;
  overflow:hidden;
}
.hero__bg{
  position:absolute; inset:-10% 0 -10%; pointer-events:none;
  will-change:transform;
  background:
    radial-gradient(120% 90% at 78% 8%, rgba(169,127,61,.22), transparent 58%),
    radial-gradient(90% 70% at 8% 96%, rgba(30,50,71,.9), transparent 60%),
    linear-gradient(180deg, #0b1721 0%, #0e1a26 45%, #101f2d 100%);
}
.hero__grain,.values__grain{
  position:absolute; inset:0; pointer-events:none; opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
.hero__inner{
  position:relative;
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding-inline:var(--gutter);
  display:grid; grid-template-columns:1.35fr .85fr; gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
  padding-bottom:clamp(3.5rem,7vw,5.5rem);
}
.hero h1{ color:var(--paper); margin-bottom:1.6rem; }
.hero h1 em{ color:var(--brass-lt); }
/* scala dedicata: il titolo e' su due righe mascherate, ognuna deve
   restare su una riga sola. Le parole finali sono legate con &nbsp; nel markup. */
.hero__title{ font-size:clamp(2.9rem,5.2vw,3.7rem); line-height:1.08; }

/* rivelazione a righe del titolo.
   Lo stato nascosto vale solo con JS attivo (.js), cosi' senza JS
   la pagina resta comunque leggibile. */
.hero__title .line{ display:block; overflow:hidden; padding-bottom:.06em; }
.hero__title .line__in{ display:block; }
.js .hero__title .line__in{ transform:translateY(105%); }
.js .hero__eyebrow,
.js .hero__lead,
.js .hero__actions,
.js .portrait{ opacity:0; transform:translateY(16px); }

.js.ready .hero__title .line__in{
  transform:none; transition:transform 1.05s var(--ease-out);
}
.js.ready .hero__title .line:nth-child(1) .line__in{ transition-delay:.10s; }
.js.ready .hero__title .line:nth-child(2) .line__in{ transition-delay:.20s; }

.js.ready .hero__eyebrow,
.js.ready .hero__lead,
.js.ready .hero__actions,
.js.ready .portrait{
  opacity:1; transform:none;
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.js.ready .hero__eyebrow{ transition-delay:.05s; }
.js.ready .hero__lead{ transition-delay:.55s; }
.js.ready .hero__actions{ transition-delay:.68s; }
.js.ready .portrait{ transition-delay:.42s; }

.hero__lead{
  font-size:clamp(1.06rem,1.5vw,1.24rem);
  color:rgba(246,243,236,.78);
  max-width:34em; margin-bottom:2.4rem;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.9rem; }

/* ritratto */
.portrait{ margin:0; }
.portrait__frame{ position:relative; border:1px solid rgba(201,164,104,.38); padding:12px; }
.portrait__frame::before{
  content:""; position:absolute; inset:auto -12px -12px auto;
  width:58%; height:38%; border-right:1px solid var(--brass); border-bottom:1px solid var(--brass);
  pointer-events:none;
}
.portrait__slot{
  aspect-ratio:4/5;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  border:1px dashed rgba(201,164,104,.35);
  color:rgba(201,164,104,.8);
  text-align:center; padding:1.5rem;
}
.portrait__slot svg{ width:44px; height:44px; }
.portrait__slot span{ font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; }
.portrait__img{ display:block; width:100%; height:auto; }
.portrait figcaption{ margin-top:1rem; font-size:.85rem; color:var(--muted-dark); }

/* numeri */
.facts{
  position:relative;
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding:2.2rem var(--gutter) 3.4rem;
  list-style:none;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem;
  border-top:1px solid var(--line-dark);
}
.facts li{ display:flex; flex-direction:column; gap:.35rem; }
.facts strong{
  font-family:var(--serif); font-size:clamp(2.3rem,4vw,3.2rem);
  font-weight:400; color:var(--brass-lt); line-height:1;
  font-variant-numeric:tabular-nums;
}
.facts__pre{
  font-family:var(--sans); font-size:.28em; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  display:block; margin-bottom:.3em; opacity:.7;
}
.facts__label{ font-size:.85rem; color:rgba(246,243,236,.6); line-height:1.4; max-width:22ch; }

/* indicatore di scroll */
.scroll-hint{
  position:absolute; left:50%; bottom:1.1rem; transform:translateX(-50%);
  width:22px; height:36px; border:1px solid rgba(201,164,104,.5); border-radius:12px;
  display:grid; place-items:start center; padding-top:6px; z-index:2;
}
.scroll-hint span{
  width:3px; height:7px; border-radius:2px; background:var(--brass-lt);
  animation:hint 2.1s var(--ease) infinite;
}
@keyframes hint{
  0%{ transform:translateY(0); opacity:0; }
  30%{ opacity:1; }
  70%{ transform:translateY(12px); opacity:0; }
  100%{ opacity:0; }
}

/* =========================================================
   MANIFESTO
   ========================================================= */
.manifesto{ background:var(--paper); padding:clamp(4rem,8vw,7rem) 0; text-align:center; }
.manifesto__quote{
  font-family:var(--serif); font-weight:300;
  font-size:clamp(1.6rem,3.4vw,2.7rem); line-height:1.32;
  color:var(--ink); margin:0 auto 1.8rem; max-width:min(26ch,100%);
}
.manifesto__quote em{ display:block; color:var(--brass); }
.manifesto__sign{
  font-size:.78rem; text-transform:uppercase; letter-spacing:.22em; color:var(--muted);
}

/* =========================================================
   SEZIONI
   ========================================================= */
.section{ padding:var(--section-y) 0; }
.section--paper2{ background:var(--paper-2); }

.section__head{ max-width:44rem; margin-bottom:clamp(2.5rem,5vw,4rem); }
.section__head--center{ margin-inline:auto; text-align:center; }
.section__head--center .eyebrow{ justify-content:center; }
.section__head--center .eyebrow::before{
  content:""; width:2.4rem; height:1px; background:currentColor; opacity:.5;
}
.section__intro{ margin-top:1.4rem; color:var(--muted); font-size:1.08rem; }

.grid-2{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,5rem); }
.grid-2--map{ grid-template-columns:1fr 1fr; align-items:center; }
.grid-2--contact{ grid-template-columns:1fr 1fr; align-items:start; }
/* niente sticky sul titolo: nella colonna c'e' anche la foto sotto,
   e scorrendo il titolo le finiva sopra */
.section__aside h2{ position:static; }

.side-photo{ margin:2.5rem 0 0; }
.side-photo__slot{
  aspect-ratio:4/3;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.9rem;
  background:var(--white); border:1px dashed var(--line-2);
  color:var(--brass); text-align:center; padding:1.5rem;
}
.side-photo__slot svg{ width:40px; height:40px; }
.side-photo__slot span{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; }
.side-photo figcaption{ margin-top:.9rem; font-size:.85rem; color:var(--muted); }

.prose__lead{
  font-family:var(--serif); font-size:clamp(1.3rem,2vw,1.6rem);
  line-height:1.45; color:var(--ink); margin-bottom:1.4rem;
}
/* dentro il racconto di Giancarlo, il passaggio in cui parla Antonio */
.prose__voce{
  margin:1.8rem 0 0; padding:0 0 0 1.4rem;
  border-left:2px solid var(--brass);
}
.prose__voce blockquote{ margin:0; }
.prose__voce p{ margin:0; color:var(--text); }
.prose__voce figcaption{
  margin-top:.7rem; font-size:.74rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brass-text);
}

/* chiusura della sezione Chi siamo, staccata dal resto del racconto */
.prose__close{
  font-family:var(--serif); font-style:italic;
  font-size:clamp(1.12rem,1.6vw,1.32rem); line-height:1.5;
  color:var(--ink); margin-top:1.8rem; padding-top:1.5rem;
  border-top:1px solid var(--line);
}

/* timeline */
.timeline{
  list-style:none; margin:clamp(3rem,6vw,5rem) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,3vw,3rem);
  border-top:1px solid var(--line); padding-top:clamp(2rem,4vw,3rem);
}
.timeline__num{
  font-family:var(--serif); font-size:.95rem; color:var(--brass-text);
  letter-spacing:.1em; display:block; margin-bottom:.9rem;
}
.timeline h3{ margin-bottom:.65rem; }
.timeline p{ color:var(--muted); font-size:.98rem; }

/* =========================================================
   CARD SERVIZI
   ========================================================= */
.cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.5vw,2rem); }
.card{
  position:relative; background:var(--white); border:1px solid var(--line);
  padding:clamp(1.8rem,3vw,2.8rem);
  transition:border-color .3s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.card::before{
  content:""; position:absolute; inset:-1px -1px auto -1px; height:2px;
  background:linear-gradient(90deg,var(--brass),var(--brass-lt));
  transform:scaleX(0); transform-origin:left;
  transition:transform .45s var(--ease);
}
.card:hover{ border-color:var(--line-2); transform:translateY(-4px); box-shadow:0 24px 48px -34px rgba(14,26,38,.55); }
.card:hover::before{ transform:scaleX(1); }
.card__icon{ color:var(--brass); margin-bottom:1.4rem; transition:transform .35s var(--ease); }
.card:hover .card__icon{ transform:translateY(-3px); }
.card__icon svg{ width:38px; height:38px; }
.card h3{ margin-bottom:.8rem; }
.card > p{ color:var(--muted); }

.ticks{ list-style:none; margin:1.5rem 0 0; padding:0; }
.ticks li{ position:relative; padding-left:1.7rem; margin-bottom:.6rem; font-size:.95rem; color:var(--text); }
.ticks li::before{
  content:""; position:absolute; left:0; top:.55em;
  width:.7rem; height:.42rem;
  border-left:1.5px solid var(--brass); border-bottom:1.5px solid var(--brass);
  transform:rotate(-45deg);
}

/* =========================================================
   PER CHI
   ========================================================= */
.doors{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.5vw,2rem); }
.door{
  position:relative; overflow:hidden;
  background:var(--white); border:1px solid var(--line);
  padding:clamp(1.9rem,3.2vw,3rem);
  display:flex; flex-direction:column;
  transition:border-color .3s var(--ease), box-shadow .35s var(--ease);
}
.door::after{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg,var(--brass),var(--brass-lt));
  transform:scaleY(0); transform-origin:top;
  transition:transform .5s var(--ease);
}
.door:hover{ border-color:var(--line-2); box-shadow:0 24px 48px -36px rgba(14,26,38,.5); }
.door:hover::after{ transform:scaleY(1); }
.door__tag{
  font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.18em;
  color:var(--brass-text); margin-bottom:1rem;
}
.door h3{ font-size:clamp(1.45rem,2.2vw,1.85rem); margin-bottom:1rem; }
.door > p{ color:var(--muted); }
.door .link-arrow{ margin-top:auto; padding-top:1.6rem; }

/* =========================================================
   VALORI
   ========================================================= */
.values{
  position:relative; overflow:hidden;
  background:var(--ink); color:var(--paper);
  padding:var(--section-y) 0;
  background-image:radial-gradient(80% 60% at 50% 0%, rgba(169,127,61,.16), transparent 62%);
}
.values .wrap{ position:relative; z-index:1; }
.values h2{ color:var(--paper); }
.values__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-top:1px solid var(--line-dark);
}
.value{
  position:relative;
  padding:clamp(2rem,3.5vw,3rem) clamp(1.2rem,2vw,2rem);
  border-right:1px solid var(--line-dark);
  transition:background .35s var(--ease);
}
.value::before{
  content:""; position:absolute; left:0; right:0; top:-1px; height:1px;
  background:var(--brass-lt); transform:scaleX(0); transform-origin:left;
  transition:transform .5s var(--ease);
}
.value:last-child{ border-right:0; }
.value:hover{ background:rgba(255,255,255,.035); }
.value:hover::before{ transform:scaleX(1); }
.value h3{ color:var(--brass-lt); font-size:clamp(1.4rem,2.2vw,1.75rem); margin-bottom:.9rem; }
.value p{ color:rgba(246,243,236,.68); font-size:.97rem; }

/* =========================================================
   TERRITORIO
   ========================================================= */
.provinces{ list-style:none; margin:2.5rem 0 0; padding:0; }
.provinces li{
  display:grid; grid-template-columns:auto auto 1fr; align-items:baseline; gap:.9rem;
  padding:1.1rem 0; border-bottom:1px solid var(--line);
  transition:transform .3s var(--ease);
}
.provinces li:first-child{ border-top:1px solid var(--line); }
.provinces li:hover{ transform:translateX(.5rem); }
.provinces__dot{ width:.55rem; height:.55rem; border-radius:50%; background:var(--brass); transform:translateY(-1px); }
.provinces strong{ font-family:var(--serif); font-weight:400; font-size:1.25rem; color:var(--ink); }
.provinces span:last-child{ color:var(--muted); font-size:.94rem; }

.map svg{ width:100%; height:auto; overflow:visible; }
.map__island{ fill:var(--white); stroke:var(--line-2); stroke-width:1.1; stroke-linejoin:round; }
.map__area{
  fill:rgba(169,127,61,.17); stroke:var(--brass); stroke-width:1.6;
  stroke-linejoin:round; stroke-linecap:round;
}
.map__pins circle{ fill:var(--brass); stroke:var(--paper-2); stroke-width:1.6; }
.map__labels text{
  font-family:var(--sans); font-size:12px; font-weight:600;
  letter-spacing:.04em; fill:var(--ink);
  paint-order:stroke; stroke:var(--paper-2); stroke-width:4px; stroke-linejoin:round;
}
.map__caption{
  margin-top:1.4rem; font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted); text-align:center;
}

/* disegno progressivo del contorno + comparsa dei segnaposto */
.map.is-drawing .map__area{ animation:draw 1.9s var(--ease-out) forwards; }
.map.is-drawing .map__pins circle{ opacity:0; animation:pop .5s var(--ease-out) forwards; }
.map.is-drawing .map__pins circle:nth-child(1){ animation-delay:1.35s; }
.map.is-drawing .map__pins circle:nth-child(2){ animation-delay:1.5s; }
.map.is-drawing .map__pins circle:nth-child(3){ animation-delay:1.65s; }
.map.is-drawing .map__labels{ opacity:0; animation:fade .6s var(--ease-out) 1.7s forwards; }
@keyframes draw{
  from{ stroke-dashoffset:var(--len); fill-opacity:0; }
  60%{ fill-opacity:0; }
  to{ stroke-dashoffset:0; fill-opacity:1; }
}
@keyframes pop{ from{ opacity:0; transform:scale(.4); } to{ opacity:1; transform:scale(1); } }
@keyframes fade{ to{ opacity:1; } }
.map__pins circle{ transform-box:fill-box; transform-origin:center; }

/* =========================================================
   METODO
   ========================================================= */
.steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1.5rem,3vw,2.5rem); }
.steps li{ border-top:1px solid var(--line); padding-top:1.6rem; }
.steps__num{ font-family:var(--serif); font-size:2.2rem; color:var(--brass-pale); display:block; line-height:1; margin-bottom:1rem; }
.steps h3{ font-size:1.15rem; margin-bottom:.6rem; }
.steps p{ color:var(--muted); font-size:.95rem; }

/* =========================================================
   REFERENZE
   ========================================================= */
.brands{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:clamp(2.5rem,5vw,4rem); }
.brands--real{ grid-template-columns:repeat(2,1fr); max-width:56rem; margin-inline:auto; gap:clamp(1.2rem,2.5vw,2rem); }
.brand{
  background:var(--white); border:1px solid var(--line);
  padding:clamp(1.8rem,3vw,2.6rem); text-align:center;
  transition:border-color .3s var(--ease), transform .3s var(--ease);
}
.brand:hover{ border-color:var(--brass); transform:translateY(-3px); }
.brand__name{
  font-family:var(--serif); font-size:clamp(1.5rem,2.6vw,2rem);
  color:var(--ink); margin:0 0 .5rem; letter-spacing:-0.01em;
}
.brand__group{
  font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.16em;
  color:var(--brass-text); margin:0 0 1rem;
}
.brand__what{ font-size:.95rem; color:var(--muted); margin:0; }

.quote{ margin:0 auto; max-width:44rem; text-align:center; border:1px dashed var(--line); padding:clamp(2rem,4vw,3rem); }
.quote p{ font-family:var(--serif); font-size:clamp(1.2rem,2.2vw,1.6rem); line-height:1.4; color:var(--muted); }
.quote footer{ margin-top:1.2rem; font-size:.78rem; text-transform:uppercase; letter-spacing:.18em; color:var(--muted); }

/* =========================================================
   CONTATTI
   ========================================================= */
.contact{
  background:var(--ink); color:var(--paper); padding:var(--section-y) 0;
  background-image:radial-gradient(90% 80% at 88% 4%, rgba(169,127,61,.18), transparent 60%);
}
.contact h2{ color:var(--paper); }
.contact__intro{ color:rgba(246,243,236,.72); margin-top:1.4rem; max-width:34em; }
.contact__list{ list-style:none; margin:2.6rem 0 0; padding:0; }
.contact__list li{
  display:grid; grid-template-columns:8rem 1fr; gap:1rem; align-items:baseline;
  padding:1.05rem 0; border-bottom:1px solid var(--line-dark);
}
.contact__list li:first-child{ border-top:1px solid var(--line-dark); }
.contact__label{ font-size:.72rem; text-transform:uppercase; letter-spacing:.18em; color:var(--muted-dark); }
.contact__list a{
  color:var(--paper); text-decoration:none;
  border-bottom:1px solid rgba(201,164,104,.45); padding-bottom:1px;
  transition:border-color .2s var(--ease), color .2s var(--ease);
}
.contact__list a:hover{ color:var(--brass-lt); border-color:var(--brass-lt); }
.contact__stack{ display:flex; flex-direction:column; align-items:flex-start; gap:.5rem; }
.contact__riga{ display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; }
.contact__chi{
  font-size:.7rem; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted-dark);
}

.form{ background:rgba(255,255,255,.04); border:1px solid var(--line-dark); padding:clamp(1.6rem,3vw,2.6rem); }
.field{ margin-bottom:1.15rem; }
.field label{
  display:block; font-size:.82rem; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted-dark); margin-bottom:.5rem;
}
.field label span{ color:var(--brass-lt); }
.field input,.field select,.field textarea{
  width:100%; min-height:50px; padding:.75rem .9rem;
  background:rgba(14,26,38,.55); color:var(--paper);
  border:1px solid #55687e; border-radius:var(--radius);
  font-family:var(--sans); font-size:1rem;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.field textarea{ resize:vertical; min-height:120px; }
.field ::placeholder{ color:rgba(246,243,236,.55); opacity:1; }
.field select{
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23c9a468' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .95rem center;
  background-color:#101d29;
  padding-right:2.6rem;
}
/* su Windows le voci del menu ereditano il testo chiaro su fondo bianco: le fissiamo */
.field select option{ background-color:#0e1a26; color:var(--paper); }
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--brass); background-color:rgba(14,26,38,.8); outline:none;
}
.field :is(input,select,textarea):focus-visible{
  outline:2px solid var(--brass-lt); outline-offset:2px;
}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{ border-color:#d98b6a; }

.field--check{ display:grid; grid-template-columns:auto 1fr; gap:.75rem; align-items:start; margin-top:1.5rem; }
.field--check input{ width:24px; min-height:24px; height:24px; margin-top:.15rem; accent-color:var(--brass); }
.field--check label{
  text-transform:none; letter-spacing:0; font-weight:400; font-size:.88rem;
  color:rgba(246,243,236,.72); margin:0; line-height:1.5;
}
.field--check label a{ color:var(--brass-lt); }
.field--check .field__error{ grid-column:1 / -1; }

.field__error{ margin:.45rem 0 0; font-size:.85rem; color:#e0a288; display:flex; align-items:center; gap:.4rem; }
.field__error[hidden]{ display:none; }
.field__error::before{ content:"!"; font-weight:600; }
.form__note{ margin:.9rem 0 0; font-size:.85rem; color:var(--muted-dark); text-align:center; }
.form__status{ margin:.9rem 0 0; font-size:.92rem; color:var(--brass-lt); text-align:center; }

/* campo trappola per gli invii automatici, invisibile a chi legge */
.honeypot{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip-path:inset(50%); white-space:nowrap; margin:0;
}

/* conferma dopo l'invio */
.form--sent{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; gap:.4rem; min-height:22rem;
}
.form--sent[hidden]{ display:none; }
.form__check{ color:var(--brass-lt); margin-bottom:.6rem; }
.form__check svg{ width:52px; height:52px; }
.form--sent h3{ color:var(--paper); font-size:1.5rem; }
.form--sent p{ color:rgba(246,243,236,.72); max-width:26em; }
.form--sent:focus{ outline:none; }
.form[hidden]{ display:none; }

/* =========================================================
   FOOTER
   ========================================================= */
.footer{ background:#0a141d; color:var(--muted-dark); padding:clamp(3rem,6vw,4.5rem) 0 1.6rem; }
.footer__inner{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:clamp(2rem,4vw,3rem); align-items:start; }
.footer__brand{ display:flex; gap:1rem; align-items:flex-start; }
.footer__name{ font-family:var(--serif); font-size:1.2rem; color:var(--paper); margin:0 0 .4rem; }
.footer__claim{ font-size:.9rem; margin:0; max-width:32ch; }
.footer__legal p{ margin:0 0 .4rem; font-size:.88rem; line-height:1.55; }
.footer__meta nav{ display:flex; flex-direction:column; align-items:flex-start; gap:.6rem; }
.footer__meta a,.footer__prefs{
  font-size:.88rem; text-decoration:none; border:0; background:none; padding:.45rem 0;
  color:inherit; font-family:var(--sans); cursor:pointer;
  border-bottom:1px solid transparent; transition:color .2s var(--ease), border-color .2s var(--ease);
}
.footer__meta a:hover,.footer__prefs:hover{ color:var(--brass-lt); border-color:var(--brass-lt); }

.footer__bottom{
  margin-top:clamp(2.5rem,5vw,3.5rem); padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
}
.footer__copy{ font-size:.82rem; margin:0; }
.footer__by{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.82rem; text-decoration:none; color:var(--muted-dark);
  transition:color .25s var(--ease);
}
.footer__by img{ width:26px; height:26px; opacity:.75; transition:opacity .25s var(--ease), transform .35s var(--ease); }
.footer__by strong{ font-weight:600; color:var(--paper); }
.footer__by:hover{ color:var(--paper); }
.footer__by:hover img{ opacity:1; transform:scale(1.08); }

/* =========================================================
   DOCK MOBILE
   ========================================================= */
.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  display:none; gap:1px; background:var(--line-dark);
  border-top:1px solid var(--line-dark);
  visibility:hidden;
  transform:translateY(100%);
  transition:transform .4s var(--ease), visibility 0s .4s;
  padding-bottom:env(safe-area-inset-bottom);
}
.dock.is-in{ transform:none; visibility:visible; transition:transform .4s var(--ease), visibility 0s 0s; }
.dock a{
  flex:1; min-height:58px; display:flex; align-items:center; justify-content:center; gap:.6rem;
  background:rgba(14,26,38,.97); backdrop-filter:blur(12px);
  color:var(--paper); text-decoration:none;
  font-size:.92rem; font-weight:600; letter-spacing:.03em;
}
.dock a svg{ width:19px; height:19px; flex:none; opacity:.9; }
.dock__wa{ background:var(--brass-btn) !important; color:#fff !important; }
.dock.is-hidden{ transform:translateY(100%) !important; visibility:hidden; transition:transform .4s var(--ease), visibility 0s .4s; }

/* =========================================================
   COOKIE BANNER
   ========================================================= */
.cookie{ position:fixed; inset:auto 0 0 0; z-index:160; padding:var(--gutter); pointer-events:none; }
.cookie[hidden]{ display:none; }
.cookie__card{
  pointer-events:auto; position:relative; overflow:hidden;
  max-width:30rem; margin-inline:auto;
  color:var(--paper);
  background:rgba(14,26,38,.97);
  backdrop-filter:blur(18px);
  border:1px solid var(--line-dark);
  box-shadow:0 40px 90px -45px rgba(0,0,0,.85), 0 2px 10px -4px rgba(0,0,0,.4);
  padding:clamp(1.7rem,3vw,2.2rem);
  max-height:calc(100dvh - 2*var(--gutter));
  overflow-y:auto; overscroll-behavior:contain;
  animation:cookieIn .7s var(--ease-out) both;
}
.cookie__card::before{
  content:""; position:absolute; inset:0 0 auto 0; height:2px;
  background:linear-gradient(90deg,var(--brass),var(--brass-lt) 55%,var(--brass));
}
@media (min-width:900px){ .cookie__card{ margin-left:0; } }
@keyframes cookieIn{ from{ opacity:0; transform:translateY(28px); } to{ opacity:1; transform:none; } }

.cookie__eyebrow{
  font-size:.66rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--brass-lt); margin:0 0 .8rem;
}
.cookie__title{
  font-family:var(--serif); font-weight:400; font-size:1.35rem;
  color:var(--paper); letter-spacing:-0.015em; margin:0 0 .7rem;
}
.cookie p:not([class]){ font-size:.9rem; color:rgba(246,243,236,.66); line-height:1.6; }
.cookie a{ color:var(--brass-lt); text-decoration:none; border-bottom:1px solid rgba(201,164,104,.4); }
.cookie a:hover{ border-color:var(--brass-lt); }

.cookie__prefs{ margin-top:1.4rem; border-top:1px solid var(--line-dark); padding-top:1.2rem; }
.cookie__prefs[hidden]{ display:none; }
.cookie__row{
  display:grid; grid-template-columns:auto 1fr; gap:.8rem; align-items:start;
  padding:.75rem 0; cursor:pointer; border-bottom:1px solid rgba(42,61,82,.5);
}
.cookie__row:last-child{ border-bottom:0; }
.cookie__row input{ width:22px; height:22px; margin-top:.2rem; accent-color:var(--brass); }
.cookie__row input:disabled{ opacity:.55; }
.cookie__row span{ font-size:.83rem; color:rgba(246,243,236,.55); line-height:1.5; }
.cookie__row strong{
  display:block; color:var(--paper); font-size:.9rem; font-weight:600;
  margin-bottom:.15rem; letter-spacing:.01em;
}

.cookie__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:.7rem; margin-top:1.5rem; }
.cookie__actions .btn{ flex:1 1 8rem; }
.cookie__ghost{ --btn-bg:transparent; --btn-fg:var(--paper); border-color:rgba(246,243,236,.28); }
.cookie__ghost:hover{ --btn-bg:rgba(246,243,236,.07); border-color:rgba(246,243,236,.5); }
.cookie__link{
  flex:1 1 100%; text-align:center;
  background:none; border:0; padding:.6rem 0 .2rem; cursor:pointer;
  font-family:var(--sans); font-size:.84rem; letter-spacing:.02em;
  color:rgba(246,243,236,.5);
  text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px;
  transition:color .2s var(--ease);
}
.cookie__link:hover{ color:var(--brass-lt); }

/* =========================================================
   PAGINE LEGALI
   ========================================================= */
.legal{ padding:clamp(8rem,14vw,11rem) 0 var(--section-y); }
.legal__head{ max-width:46rem; margin-bottom:clamp(2.5rem,5vw,3.5rem); }
.legal__date{ font-size:.82rem; text-transform:uppercase; letter-spacing:.16em; color:var(--muted); margin-top:1.2rem; }
.legal__body{ max-width:46rem; }
.legal__body h2{ font-size:clamp(1.4rem,2.4vw,1.9rem); margin:2.6rem 0 .9rem; }
.legal__body h3{ font-size:1.1rem; margin:1.8rem 0 .6rem; }
.legal__body p,.legal__body li{ color:var(--text); font-size:1rem; }
.legal__body ul{ margin:0 0 1.1em; padding-left:1.3rem; }
.legal__body li{ margin-bottom:.45rem; }
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; margin:1.2rem 0 1.8rem; }
.legal__body .table-scroll table{ margin:0; min-width:34rem; }
.legal__body table{ width:100%; border-collapse:collapse; margin:1.2rem 0 1.8rem; font-size:.92rem; }
.legal__body th,.legal__body td{ text-align:left; padding:.75rem .8rem; border-bottom:1px solid var(--line); vertical-align:top; }
.legal__body th{ font-weight:600; color:var(--ink); background:var(--paper-2); }
.legal__back{ display:inline-flex; align-items:center; gap:.5rem; margin-top:3rem; color:var(--brass-text); font-weight:600; text-decoration:none; }
.legal__back:hover{ text-decoration:underline; text-underline-offset:4px; }

/* =========================================================
   REVEAL
   ========================================================= */
.js .reveal{ opacity:0; transform:translateY(20px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.reveal.is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1 !important; transform:none !important; transition:none; }
  .js .hero__title .line__in,
  .js .hero__eyebrow,.js .hero__lead,.js .hero__actions,.js .portrait{ opacity:1 !important; transform:none !important; transition:none !important; }
  .btn:hover{ transform:none; }
  .scroll-hint span{ animation:none; }
  .map.is-drawing .map__area,
  .map.is-drawing .map__pins circle,
  .map.is-drawing .map__labels{ animation:none !important; opacity:1 !important; stroke-dashoffset:0 !important; }
  .cookie__card{ animation:none; }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
  .nav__links,.nav__cta{ display:none; }
  .nav__toggle{ display:flex; }
  .nav{ background:rgba(14,26,38,.94); backdrop-filter:blur(12px); }

  .hero{ padding-top:7.5rem; }
  .hero__inner{ grid-template-columns:1fr; }
  .portrait{ max-width:340px; }
  .facts{ grid-template-columns:repeat(2,1fr); gap:1.8rem 1.5rem; }
  .scroll-hint{ display:none; }

  .grid-2,.grid-2--map,.grid-2--contact{ grid-template-columns:1fr; }
  .section__aside h2{ position:static; }

  .values__grid{ grid-template-columns:repeat(2,1fr); }
  .value{ border-bottom:1px solid var(--line-dark); }
  .value:nth-child(2n){ border-right:0; }
  .value:nth-last-child(-n+2){ border-bottom:0; }

  .steps{ grid-template-columns:repeat(2,1fr); }
  .timeline{ grid-template-columns:1fr; gap:2rem; }
  .brands{ grid-template-columns:repeat(2,1fr); }

  .dock{ display:flex; }
  .cookie{ padding-bottom:calc(var(--gutter) + 58px); }
}

@media (max-width:720px){
  body{ font-size:1rem; }
  h1{ font-size:clamp(1.95rem,9vw,3.4rem); }
  .hero__title{ font-size:clamp(1.85rem,8vw,2.9rem); }
  .cards,.doors{ grid-template-columns:1fr; }
  .brands--real{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .values__grid{ grid-template-columns:1fr; }
  .value{ border-right:0; }
  .value:nth-last-child(2){ border-bottom:1px solid var(--line-dark); }
  .value:last-child{ border-bottom:0; }
  .contact__list li{ grid-template-columns:1fr; gap:.25rem; }
  .footer__inner{ grid-template-columns:1fr; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; gap:1rem; }
  .hero__actions .btn{ width:100%; }
  .portrait{ max-width:none; }

  /* banner cookie compatto: foglio attaccato al bordo inferiore */
  .cookie{ padding:0; }
  .cookie__card{
    max-width:none; margin:0;
    border-left:0; border-right:0; border-bottom:0;
    box-shadow:0 -18px 50px -30px rgba(0,0,0,.7);
    padding:1.05rem 1.25rem calc(1.05rem + env(safe-area-inset-bottom));
    max-height:calc(100dvh - 4.5rem);
  }
  .cookie__eyebrow{ display:none; }
  .cookie__title{ font-size:1.08rem; margin-bottom:.4rem; }
  .cookie p:not([class]){ font-size:.84rem; line-height:1.5; }
  .cookie__actions{ margin-top:.9rem; gap:.5rem; }
  .cookie__actions .btn{
    flex:1 1 auto; min-height:46px;
    font-size:.84rem; padding:.5rem .8rem; letter-spacing:0;
  }
  .cookie__link{ padding:.4rem 0 0; font-size:.8rem; }
  .cookie__prefs{ margin-top:1rem; padding-top:.8rem; }
  .cookie__row{ padding:.55rem 0; }
  .cookie__row span{ font-size:.8rem; }
  .cookie__row strong{ font-size:.86rem; }
}

@media (max-width:400px){
  .facts{ grid-template-columns:1fr; }
}
