/* ═══════════════════════════════════════════════════════════
   AURÈA — Medicina Estetica
   Direzione: didone editoriale × luce mediterranea
   Palette: nero caldo · osso · oro brunito · verde salvia
   ═══════════════════════════════════════════════════════════ */

:root{
  /* colore */
  --noir:#0C0B08;
  --ink:#17150F;
  --ink-2:#2A261D;
  --bone:#F5F0E7;
  --bone-2:#EDE5D8;
  --sand:#E0D4C1;
  --gold:#A8834F;
  --gold-lt:#C9A874;
  --gold-gl:#E3C99B;
  --sage:#3D4A40;
  --blush:#DCC5B8;
  --line:rgba(23,21,15,.14);
  --line-lt:rgba(245,240,231,.16);

  /* tipografia */
  --display:"Bodoni Moda", "Didot", "Times New Roman", serif;
  --sans:"Jost", "Futura", "Century Gothic", sans-serif;

  /* misure */
  --gut:clamp(20px,5vw,72px);
  --maxw:1320px;
  --r:2px;

  /* motion */
  --e:cubic-bezier(.19,1,.22,1);
  --e2:cubic-bezier(.65,0,.35,1);
}

/* ─────────── reset ─────────── */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
body{
  background:var(--bone);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(15px,.55vw + 13px,17px);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
::selection{background:var(--gold);color:var(--bone)}

/* scrollbar */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--bone-2)}
::-webkit-scrollbar-thumb{background:var(--gold);border:3px solid var(--bone-2)}

.skip{position:fixed;top:-100px;left:20px;z-index:9999;background:var(--ink);color:var(--bone);padding:12px 20px;transition:top .2s}
.skip:focus{top:20px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ─────────── grana ─────────── */
.grain{
  position:fixed;inset:-50%;z-index:9000;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 6s steps(6) infinite;
}
@keyframes grain{
  0%,100%{transform:translate(0,0)} 16%{transform:translate(-2%,-3%)} 33%{transform:translate(-4%,2%)}
  50%{transform:translate(2%,-4%)} 66%{transform:translate(-2%,3%)} 83%{transform:translate(3%,1%)}
}

/* ─────────── layout ─────────── */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}

.eyebrow{
  font-size:11px;letter-spacing:.34em;text-transform:uppercase;font-weight:500;
  color:var(--gold);margin-bottom:22px;display:flex;align-items:center;gap:12px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--gold);opacity:.55}

.sec-head{max-width:760px;margin:0 auto clamp(48px,6vw,88px);text-align:center}
.sec-head .eyebrow{justify-content:center}
.sec-head--left{margin-inline:0;text-align:left}
.sec-head--left .eyebrow{justify-content:flex-start}

.sec-h2{
  font-family:var(--display);font-weight:400;
  font-size:clamp(2.1rem,5.2vw,4.1rem);
  line-height:1.06;letter-spacing:-.015em;
}
.sec-h2 em{font-style:italic;color:var(--gold)}
.sec-lead{margin-top:24px;color:var(--ink-2);opacity:.8;font-size:1.05em}

/* ─────────── bottoni ─────────── */
.btn{
  --bg:var(--ink);--fg:var(--bone);--bd:var(--ink);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:17px 34px;border:1px solid var(--bd);background:var(--bg);color:var(--fg);
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  border-radius:var(--r);overflow:hidden;isolation:isolate;
  transition:color .5s var(--e),border-color .5s var(--e);
}
.btn::after{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--fg);
  transform:scaleY(0);transform-origin:bottom;transition:transform .55s var(--e);
}
.btn:hover{color:var(--bg)}
.btn:hover::after{transform:scaleY(1)}
.btn--gold{--bg:var(--gold);--fg:#fff;--bd:var(--gold)}
.btn--gold:hover{color:var(--gold)}
.btn--ghost{--bg:transparent;--fg:var(--bone);--bd:var(--line-lt)}
.btn--ghost:hover{--bd:var(--bone)}
.btn--dark{--bg:var(--ink);--fg:var(--bone);--bd:var(--ink)}
.btn--sm{padding:13px 24px;font-size:11px}
.btn--full{width:100%}

.lnk{
  display:inline-block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);border-bottom:1px solid currentColor;padding-bottom:3px;
  transition:letter-spacing .4s var(--e),opacity .3s;
}
.lnk:hover{letter-spacing:.24em}

/* ═══════════ HEADER ═══════════ */
.hdr{
  position:fixed;inset:0 0 auto;z-index:800;
  transition:background .6s var(--e),border-color .6s var(--e),backdrop-filter .6s;
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  background:rgba(245,240,231,.86);backdrop-filter:blur(18px) saturate(1.3);
  border-bottom-color:var(--line);
}
.hdr.is-stuck .brand,.hdr.is-stuck .nav__link{color:var(--ink)}
.hdr.is-stuck .burger span{background:var(--ink)}
.hdr__in{
  max-width:var(--maxw);margin-inline:auto;padding:0 var(--gut);
  height:clamp(72px,7vw,96px);display:flex;align-items:center;gap:32px;
}

.brand{display:flex;align-items:center;gap:13px;color:var(--bone);transition:color .6s var(--e);flex-shrink:0}
.brand__mark{width:26px;height:26px;color:var(--gold-lt)}
.brand__mark svg{width:100%;height:100%}
.brand__txt{display:flex;flex-direction:column;line-height:1}
.brand__name{font-family:var(--display);font-size:23px;font-weight:500;letter-spacing:.06em}
.brand__name--big{font-size:clamp(38px,5vw,58px);letter-spacing:.03em}
.brand__sub{font-size:8.5px;letter-spacing:.36em;text-transform:uppercase;opacity:.62;margin-top:5px}

.nav{margin-left:auto}
.nav__list{display:flex;align-items:center;gap:clamp(18px,2.1vw,34px)}
.nav__link{
  position:relative;color:var(--bone);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  padding:8px 0;display:inline-flex;align-items:center;gap:7px;transition:color .6s var(--e);
}
.nav__link::after{
  content:"";position:absolute;left:0;bottom:2px;width:100%;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:right;transition:transform .5s var(--e);
}
.nav__link:hover::after{transform:scaleX(1);transform-origin:left}
.chev{width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6;transition:transform .4s var(--e)}
.has-mega:hover .chev{transform:rotate(225deg) translateY(-2px)}

.mega{
  position:absolute;left:0;right:0;top:100%;
  background:var(--bone);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .45s var(--e),transform .45s var(--e),visibility .45s;
  box-shadow:0 30px 60px -30px rgba(12,11,8,.28);
}
.has-mega:hover .mega,.has-mega:focus-within .mega{opacity:1;visibility:visible;transform:none}
.mega__in{
  max-width:var(--maxw);margin-inline:auto;padding:48px var(--gut) 54px;
  display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:clamp(24px,4vw,64px);
}
.mega__kicker{font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
.mega__link{display:block;padding:14px 0;border-bottom:1px solid var(--line);transition:padding-left .45s var(--e)}
.mega__link:hover{padding-left:12px}
.mega__link span{display:block;font-family:var(--display);font-size:26px;line-height:1.1}
.mega__link em{display:block;font-style:normal;font-size:12.5px;opacity:.6;margin-top:4px;letter-spacing:.02em}
.mega__col--feat{background:var(--bone-2);padding:30px;border-radius:var(--r)}
.mega__feat-t{font-family:var(--display);font-size:24px;font-style:italic;margin-bottom:10px}
.mega__feat-d{font-size:14px;opacity:.72;margin-bottom:22px;line-height:1.65}

.hdr__cta{display:flex;align-items:center;gap:16px;flex-shrink:0}

.burger{display:none;width:34px;height:34px;position:relative}
.burger span{position:absolute;left:5px;width:24px;height:1px;background:var(--bone);transition:.45s var(--e)}
.burger span:nth-child(1){top:14px}
.burger span:nth-child(2){top:20px}
.burger[aria-expanded="true"] span{background:var(--bone)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(3px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){transform:translateY(-3px) rotate(-45deg)}

/* ─────────── drawer ─────────── */
.drawer{
  position:fixed;inset:0;z-index:790;background:var(--noir);color:var(--bone);
  display:flex;flex-direction:column;justify-content:center;gap:40px;padding:110px var(--gut) 46px;
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--e);
}
.drawer.is-open{clip-path:inset(0 0 0 0)}
.drawer__nav{display:flex;flex-direction:column}
.drawer__link{
  display:flex;align-items:baseline;gap:18px;padding:15px 0;border-bottom:1px solid var(--line-lt);
  font-family:var(--display);font-size:clamp(28px,8vw,44px);line-height:1;
  opacity:0;transform:translateY(20px);
}
.drawer.is-open .drawer__link{animation:dIn .7s var(--e) forwards;animation-delay:calc(.22s + var(--i,0)*.05s)}
@keyframes dIn{to{opacity:1;transform:none}}
.drawer__n{font-family:var(--sans);font-size:11px;letter-spacing:.2em;color:var(--gold-lt);opacity:.8}
.drawer__foot{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.drawer__addr{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.5}

/* ═══════════ HERO — video in scrub ═══════════ */
.hero{
  position:relative;background:var(--noir);color:var(--bone);
  height:340svh;                     /* corsa dello scrub */
}
.hero__sticky{
  position:sticky;top:0;height:100svh;overflow:hidden;background:var(--noir);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:150px var(--gut) clamp(84px,9vw,118px);
}
/* niente z-index negativi: da "stuck" il layer composito li perderebbe */
.hero__bg{position:absolute;inset:0;z-index:0;background:var(--noir)}
.hero__vid{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transform:scale(1.06);transform-origin:60% 45%;will-change:transform;
}
.hero__veil{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(12,11,8,.82) 0%,rgba(12,11,8,.24) 26%,transparent 44%),
    linear-gradient(75deg,rgba(12,11,8,.93) 0%,rgba(12,11,8,.66) 34%,rgba(12,11,8,.12) 68%,transparent 88%),
    radial-gradient(130% 85% at 50% 112%,rgba(12,11,8,.9),transparent 62%);
}
.hero__rule{
  position:absolute;inset:0;
  background:repeating-linear-gradient(90deg,rgba(245,240,231,.05) 0 1px,transparent 1px 25%);
  mix-blend-mode:soft-light;
}

/* pannelli sovrapposti, guidati dallo scroll */
.hero__stage{position:relative;z-index:2;max-width:var(--maxw);width:100%;margin-inline:auto;min-height:clamp(330px,42vh,460px)}
.hpanel{
  position:absolute;left:0;bottom:0;width:100%;
  opacity:0;pointer-events:none;will-change:opacity,transform;
}
.hpanel.is-on{opacity:1;pointer-events:auto}
/* specificità doppia: .hero__h1 è dichiarato più sotto e vincerebbe a parità */
.hpanel .hero__h1--2{
  font-size:clamp(1.85rem,5.1vw,4.5rem);line-height:1.06;
  letter-spacing:-.025em;margin-bottom:26px;
}

/* HUD di avanzamento */
.hero__hud{
  position:absolute;left:var(--gut);bottom:34px;z-index:3;
  display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:.28em;opacity:.55;
}
.hero__idx{color:var(--gold-gl)}
.hero__bar{display:block;width:clamp(80px,12vw,150px);height:1px;background:rgba(245,240,231,.22);position:relative}
.hero__bar i{position:absolute;inset:0 auto 0 0;width:0;background:var(--gold-lt);transition:width .25s linear}
.hero__tot{opacity:.5}

.hero__kicker{
  display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.34em;
  text-transform:uppercase;color:var(--gold-gl);margin-bottom:30px;
}
.hero__kicker i{width:6px;height:6px;border-radius:50%;background:var(--gold-lt);box-shadow:0 0 0 0 rgba(201,168,116,.7);animation:pulse 2.6s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 11px rgba(201,168,116,0)}100%{box-shadow:0 0 0 0 rgba(201,168,116,0)}}

.hero__h1{
  font-family:var(--display);font-weight:400;
  font-size:clamp(3.2rem,11.5vw,10.5rem);
  line-height:.88;letter-spacing:-.03em;margin-bottom:34px;
}
.hero__h1 .l{display:block;overflow:hidden}
.hero__h1 em{font-style:italic;color:var(--gold-gl)}
.hero__lead{max-width:50ch;font-size:clamp(15px,1.15vw,18px);opacity:.76;line-height:1.75}
.hero__act{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}

.hero__stats{
  display:flex;flex-wrap:wrap;gap:clamp(26px,5vw,72px);
  margin-top:clamp(44px,6vw,72px);padding-top:30px;border-top:1px solid var(--line-lt);
}
.hero__stats dt{font-size:10px;letter-spacing:.3em;text-transform:uppercase;opacity:.5;margin-bottom:7px}
.hero__stats dd{font-family:var(--display);font-size:clamp(24px,2.4vw,34px);line-height:1}
.hero__stats dd span{color:var(--gold-lt)}

.hero__scroll{
  position:absolute;right:var(--gut);bottom:clamp(48px,7vw,90px);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:12px;
  font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;opacity:.45;writing-mode:vertical-rl;
  transition:opacity .5s var(--e);
}
.hero__scroll.is-off{opacity:0;pointer-events:none}
.hero__scroll span{width:1px;height:58px;background:linear-gradient(var(--gold-lt),transparent);position:relative;overflow:hidden}
.hero__scroll span::after{content:"";position:absolute;inset:0;background:var(--bone);animation:scr 2.4s var(--e2) infinite}
@keyframes scr{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
@media (max-width:900px){.hero__scroll{display:none}}

/* reveal iniziale */
.r{opacity:0;transform:translateY(26px);animation:rIn .95s var(--e) forwards;animation-delay:var(--d,0s)}
.hero__h1 .l{transform:none;opacity:1;animation:none}
.hero__h1 .l::after{content:none}
@keyframes rIn{to{opacity:1;transform:none}}
.hero__h1 .l{opacity:0;animation:lIn 1.15s var(--e) forwards;animation-delay:var(--d)}
@keyframes lIn{from{opacity:0;transform:translateY(88%)}to{opacity:1;transform:none}}

/* ═══════════ MARQUEE ═══════════ */
.marquee{
  background:var(--ink);color:var(--bone);overflow:hidden;
  padding:20px 0;border-block:1px solid rgba(245,240,231,.08);
}
.marquee__t{display:flex;gap:34px;white-space:nowrap;width:max-content;animation:mq 46s linear infinite;align-items:center}
.marquee__t span{font-family:var(--display);font-size:clamp(17px,2vw,26px);font-style:italic;opacity:.8}
.marquee__t i{color:var(--gold);font-style:normal;font-size:14px}
@keyframes mq{to{transform:translateX(-50%)}}

/* ═══════════ MANIFESTO ═══════════ */
.manifesto{padding:clamp(80px,11vw,150px) 0;background:var(--bone)}
.manifesto__q{
  font-family:var(--display);font-size:clamp(1.7rem,4.1vw,3.35rem);line-height:1.2;
  letter-spacing:-.015em;max-width:19ch;margin-bottom:clamp(56px,7vw,96px);
}
.manifesto__q em{font-style:italic;color:var(--gold)}
.manifesto__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:clamp(28px,3.5vw,56px);border-top:1px solid var(--line);padding-top:clamp(36px,4vw,56px)}
.manifesto__grid h3{font-family:var(--display);font-size:1.4rem;font-weight:400;margin-bottom:12px}
.manifesto__grid p{font-size:15px;opacity:.72;line-height:1.75}

/* ═══════════ CATEGORIE ═══════════ */
.cats{padding:clamp(80px,11vw,150px) 0;background:var(--bone-2)}
.cats__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:2px;background:var(--line)}
.cat{
  position:relative;display:flex;flex-direction:column;background:var(--bone);
  padding:34px 30px 30px;min-height:400px;overflow:hidden;isolation:isolate;
  transition:color .7s var(--e);
}
.cat::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:translateY(101%);transition:transform .75s var(--e)}
.cat:hover{color:var(--bone)}
.cat:hover::before{transform:none}
.cat__num{font-size:10px;letter-spacing:.28em;color:var(--gold);margin-bottom:26px}
.cat__img{
  display:block;width:100%;aspect-ratio:4/3;border-radius:var(--r);margin-bottom:26px;
  transition:transform .9s var(--e),filter .9s var(--e);
  background-size:cover;background-position:center;
}
.cat:hover .cat__img{transform:scale(1.045);filter:saturate(.6) brightness(.92)}
/* piastre fotografiche — sostituire con foto reali: background-image:url(../assets/…) */
.cat__img--a{background:linear-gradient(145deg,#E8D8CB 0%,#D9BFAE 45%,#B98F73 100%)}
.cat__img--b{background:linear-gradient(145deg,#E6E1D2 0%,#C9C3AE 48%,#8C907B 100%)}
.cat__img--c{background:linear-gradient(145deg,#DAD8D3 0%,#A9A9A4 45%,#5C5F5A 100%)}
.cat__img--d{background:linear-gradient(145deg,#DCD3C2 0%,#B7A88C 48%,#6E6449 100%)}
.cat__body{margin-top:auto;display:block}
.cat__k{display:block;font-size:10px;letter-spacing:.3em;text-transform:uppercase;opacity:.5;margin-bottom:6px}
.cat__t{display:block;font-family:var(--display);font-size:clamp(1.9rem,3vw,2.5rem);line-height:1.05;margin-bottom:12px}
.cat__d{display:block;font-size:13.5px;opacity:.65;line-height:1.6;max-width:30ch}
.cat__go{position:absolute;top:30px;right:30px;font-size:19px;color:var(--gold);transition:transform .6s var(--e)}
.cat:hover .cat__go{transform:translate(6px,-6px)}

/* ═══════════ ESPLORATORE ═══════════ */
.explorer{padding:clamp(80px,11vw,150px) 0;background:var(--bone)}
.ex__controls{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:44px}
.seg{position:relative;display:inline-flex;border:1px solid var(--line);border-radius:100px;padding:4px;background:var(--bone-2)}
.seg__b{
  position:relative;z-index:2;padding:10px 26px;border-radius:100px;
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  transition:color .45s var(--e);color:var(--ink-2);
}
.seg__b.is-on{color:var(--bone)}
.seg__pill{
  position:absolute;z-index:1;top:4px;left:4px;height:calc(100% - 8px);border-radius:100px;
  background:var(--ink);transition:transform .55s var(--e),width .55s var(--e);
}
.seg--alt .seg__pill{background:var(--gold)}

.ex__body{display:grid;grid-template-columns:minmax(190px,262px) 1fr;gap:clamp(24px,3.4vw,60px);align-items:start}
.ex__label{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.areas{border-top:1px solid var(--line)}
.area{
  width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 4px;border-bottom:1px solid var(--line);
  font-size:14.5px;letter-spacing:.01em;color:var(--ink-2);
  transition:padding-left .45s var(--e),color .3s;
}
.area:hover{padding-left:12px}
.area i{font-style:normal;font-size:10px;opacity:.35;letter-spacing:.1em}
.area.is-on{color:var(--ink);font-weight:500;padding-left:12px}
.area.is-on i{color:var(--gold);opacity:1}
.area.is-on::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:20px;background:var(--gold)}
.areas li{position:relative}

.ex__panel{background:var(--ink);color:var(--bone);border-radius:var(--r);padding:clamp(28px,3.4vw,52px);min-height:440px;display:flex;flex-direction:column}
.ex__panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--line-lt);margin-bottom:8px}
.ex__panel-head h3{font-family:var(--display);font-size:clamp(1.8rem,3.4vw,2.9rem);font-weight:400;line-height:1}
.ex__count{font-size:10px;letter-spacing:.26em;text-transform:uppercase;opacity:.45;white-space:nowrap}

.tlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:0 clamp(20px,2.6vw,44px);margin-bottom:auto}
.tlist li{
  display:flex;align-items:flex-start;gap:14px;padding:17px 0;border-bottom:1px solid var(--line-lt);
  opacity:0;transform:translateY(12px);animation:tIn .6s var(--e) forwards;animation-delay:calc(var(--i)*.045s);
}
@keyframes tIn{to{opacity:1;transform:none}}
.tlist b{font-weight:400;font-family:var(--display);font-size:1.18rem;line-height:1.25;flex:1}
.tlist small{display:block;font-family:var(--sans);font-size:12px;opacity:.5;margin-top:3px;letter-spacing:.01em}
.tlist span{font-size:9.5px;letter-spacing:.2em;color:var(--gold-lt);padding-top:7px}

.ex__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:36px;padding-top:26px;border-top:1px solid var(--line-lt)}
.ex__foot p{font-size:13px;opacity:.55;max-width:38ch}
.ex__foot .btn--dark{--bg:var(--bone);--fg:var(--ink);--bd:var(--bone)}

/* ═══════════ TECNOLOGIE ═══════════ */
.tech{padding:clamp(80px,11vw,150px) 0;background:var(--noir);color:var(--bone)}
.tech .sec-lead{color:var(--bone);opacity:.62}
.tech__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(275px,1fr));gap:1px;background:rgba(245,240,231,.1);border:1px solid rgba(245,240,231,.1)}
.tcard{position:relative;background:var(--noir);padding:clamp(28px,3vw,44px);transition:background .6s var(--e)}
.tcard::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--e)}
.tcard:hover{background:#131108}
.tcard:hover::after{transform:none}
.tcard__i{display:block;font-size:10px;letter-spacing:.3em;color:var(--gold);margin-bottom:26px}
.tcard h3{font-family:var(--display);font-size:1.65rem;font-weight:400;margin-bottom:12px}
.tcard p{font-size:14px;opacity:.58;line-height:1.7}

/* ═══════════ METODO ═══════════ */
.method{padding:clamp(80px,11vw,150px) 0;background:var(--bone-2)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:2px;background:var(--line)}
.step{background:var(--bone-2);padding:34px 28px 40px;display:flex;flex-direction:column;gap:26px;transition:background .6s var(--e)}
.step:hover{background:var(--bone)}
.step__n{
  font-family:var(--display);font-size:2.6rem;line-height:1;color:var(--gold);
  font-style:italic;display:block;
}
.step h3{font-family:var(--display);font-size:1.45rem;font-weight:400;margin-bottom:11px}
.step p{font-size:14px;opacity:.7;line-height:1.72}

/* ═══════════ STUDIO ═══════════ */
.studio{background:var(--bone)}
.studio__grid{display:grid;grid-template-columns:1fr 1fr;min-height:clamp(520px,68vw,760px)}
.studio__media{position:relative;overflow:hidden;background:var(--sage)}
.studio__plate{
  position:absolute;inset:0;
  background:
    radial-gradient(70% 55% at 25% 20%,rgba(227,201,155,.5),transparent 62%),
    linear-gradient(160deg,#5C6B5C 0%,#3D4A40 42%,#20261F 100%);
  transition:transform 1.4s var(--e);
}
.studio:hover .studio__plate{transform:scale(1.04)}
.studio__media::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,rgba(12,11,8,.09) 0 1px,transparent 1px 4px);
  mix-blend-mode:multiply;
}
.studio__cap{
  position:absolute;left:0;bottom:26px;z-index:2;color:var(--bone);
  font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;opacity:.7;
  padding:8px 18px;border-left:2px solid var(--gold-lt);
}
.studio__txt{padding:clamp(56px,7vw,110px) var(--gut);display:flex;flex-direction:column;align-items:flex-start;gap:20px;max-width:760px}
.studio__txt p{opacity:.75;font-size:15.5px;line-height:1.78}
.studio__txt .sec-h2{margin-bottom:6px}
.studio__facts{width:100%;margin:14px 0 12px;border-top:1px solid var(--line)}
.studio__facts li{display:flex;flex-wrap:wrap;gap:6px 24px;padding:15px 0;border-bottom:1px solid var(--line)}
.studio__facts strong{font-weight:500;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);min-width:150px}
.studio__facts span{font-size:14.5px;opacity:.75}

/* ═══════════ RECENSIONI ═══════════ */
.revs{padding:clamp(80px,11vw,150px) 0;background:var(--ink);color:var(--bone);overflow:hidden}
.revs__track{position:relative;min-height:clamp(230px,26vw,290px);max-width:930px;margin-inline:auto}
.rev{
  position:absolute;inset:0;text-align:center;
  opacity:0;transform:translateY(18px);pointer-events:none;
  transition:opacity .7s var(--e),transform .7s var(--e);
}
.rev.is-on{opacity:1;transform:none;pointer-events:auto}
.rev p{font-family:var(--display);font-size:clamp(1.25rem,2.7vw,2.15rem);line-height:1.42;font-style:italic;letter-spacing:-.01em}
.rev footer{margin-top:32px;display:flex;flex-direction:column;gap:5px}
.rev footer span{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-lt)}
.rev footer em{font-style:normal;font-size:11px;letter-spacing:.16em;opacity:.42;text-transform:uppercase}

.revs__nav{display:flex;align-items:center;justify-content:center;gap:26px;margin-top:48px}
.rnav{width:44px;height:44px;border:1px solid var(--line-lt);border-radius:50%;color:var(--bone);transition:.45s var(--e)}
.rnav:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.rdots{display:flex;gap:9px}
.rdot{width:6px;height:6px;border-radius:50%;background:rgba(245,240,231,.24);transition:.45s var(--e)}
.rdot.is-on{background:var(--gold-lt);width:26px;border-radius:100px}

/* ═══════════ FAQ ═══════════ */
.faq{padding:clamp(80px,11vw,150px) 0;background:var(--bone)}
.faq__wrap{display:grid;grid-template-columns:minmax(260px,.85fr) 1.15fr;gap:clamp(30px,5vw,90px);align-items:start}
.faq .sec-head{margin-bottom:0;position:sticky;top:130px}
.acc{border-top:1px solid var(--line)}
.ac{border-bottom:1px solid var(--line)}
.ac summary{
  list-style:none;cursor:pointer;padding:24px 44px 24px 0;position:relative;
  font-family:var(--display);font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.34;
  transition:color .35s;
}
.ac summary::-webkit-details-marker{display:none}
.ac summary:hover{color:var(--gold)}
.ac summary::after,.ac summary::before{content:"";position:absolute;right:6px;top:50%;background:var(--gold);transition:transform .5s var(--e),opacity .4s}
.ac summary::after{width:15px;height:1px}
.ac summary::before{width:1px;height:15px;right:13px;transform:translateY(-50%)}
.ac[open] summary::before{transform:translateY(-50%) rotate(90deg);opacity:0}
.ac__c{padding:0 40px 28px 0;overflow:hidden}
.ac__c p{font-size:15px;opacity:.73;line-height:1.8;max-width:62ch}
.ac[open] .ac__c{animation:acIn .55s var(--e)}
@keyframes acIn{from{opacity:0;transform:translateY(-8px)}}

/* ═══════════ CONTATTI ═══════════ */
.contact{padding:clamp(80px,11vw,150px) 0;background:var(--bone-2)}
.contact__wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,96px);align-items:start}
.contact__lead{margin:22px 0 40px;opacity:.75;max-width:44ch}
.contact__list{border-top:1px solid var(--line)}
.contact__list li{display:flex;flex-wrap:wrap;gap:6px 20px;padding:17px 0;border-bottom:1px solid var(--line)}
.ci{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);min-width:110px;padding-top:5px}
.contact__list a{font-size:15.5px;line-height:1.55;border-bottom:1px solid transparent;transition:border-color .4s}
.contact__list a:hover{border-bottom-color:var(--gold)}
.contact__soc{display:flex;gap:24px;margin-top:32px}
.contact__soc a{font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.6;transition:opacity .35s,color .35s}
.contact__soc a:hover{opacity:1;color:var(--gold)}

.form{background:var(--bone);padding:clamp(28px,3.4vw,52px);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;gap:18px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.fld{display:flex;flex-direction:column;gap:8px}
.fld>span{font-size:10px;letter-spacing:.24em;text-transform:uppercase;opacity:.6}
.fld input,.fld select,.fld textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);
  padding:11px 2px;font-size:15px;font-weight:300;transition:border-color .4s var(--e);
  border-radius:0;
}
.fld textarea{resize:vertical;min-height:74px;font-family:var(--sans)}
.fld select{cursor:pointer;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 12px) 19px,calc(100% - 7px) 19px;background-size:5px 5px;background-repeat:no-repeat}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-bottom-color:var(--gold)}
.fld input::placeholder,.fld textarea::placeholder{opacity:.32}
.fld.err input,.fld.err select,.fld.err textarea{border-bottom-color:#B4483C}

.chk{display:flex;gap:12px;align-items:flex-start;font-size:12.5px;opacity:.72;line-height:1.6;cursor:pointer;margin-top:6px}
.chk input{width:16px;height:16px;accent-color:var(--gold);margin-top:2px;flex-shrink:0}
.chk a{border-bottom:1px solid var(--gold)}
.chk.err{color:#B4483C;opacity:1}
.form__note{font-size:11px;opacity:.45;letter-spacing:.02em}
.form__msg{font-size:13px;color:var(--gold);min-height:1px}
.form__msg.ok{color:#4B7A52}
.form__msg.ko{color:#B4483C}

/* ═══════════ FOOTER ═══════════ */
.ft{background:var(--noir);color:var(--bone);padding:clamp(64px,8vw,110px) 0 40px}
.ft__top{display:grid;grid-template-columns:1fr 1.5fr;gap:clamp(36px,5vw,80px);padding-bottom:clamp(44px,5vw,72px);border-bottom:1px solid var(--line-lt)}
.ft__brand p{margin-top:18px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;opacity:.45;line-height:2}
.ft__nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:32px}
.ft__nav a{display:block;font-size:14px;opacity:.6;padding:7px 0;transition:opacity .35s,padding-left .45s var(--e)}
.ft__nav a:hover{opacity:1;padding-left:7px;color:var(--gold-lt)}
.ft__k{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.ft__bot{display:flex;flex-wrap:wrap;gap:14px 30px;justify-content:space-between;padding:32px 0 22px;font-size:11.5px;letter-spacing:.12em;opacity:.4;text-transform:uppercase}
.ft__legal{display:flex;gap:22px;flex-wrap:wrap}
.ft__legal a:hover{color:var(--gold-lt)}
.ft__disc{font-size:11px;line-height:1.85;opacity:.28;max-width:110ch;border-top:1px solid rgba(245,240,231,.07);padding-top:22px}

/* ═══════════ WHATSAPP FAB ═══════════ */
.wa{
  position:fixed;right:20px;bottom:20px;z-index:700;width:54px;height:54px;border-radius:50%;
  display:grid;place-items:center;background:var(--ink);color:var(--bone);
  box-shadow:0 12px 30px -10px rgba(12,11,8,.55);
  transition:transform .5s var(--e),background .5s var(--e);
}
.wa svg{width:24px;height:24px}
.wa:hover{transform:translateY(-4px) scale(1.05);background:var(--gold)}

/* ═══════════ SCROLL REVEAL ═══════════ */
.rv{opacity:0;transform:translateY(30px);transition:opacity 1s var(--e) var(--d,0s),transform 1s var(--e) var(--d,0s)}
.rv.in{opacity:1;transform:none}

/* ═══════════ RESPONSIVE ═══════════ */
@media (max-width:1080px){
  .nav{display:none}
  .burger{display:block}
  .faq__wrap{grid-template-columns:1fr}
  .faq .sec-head{position:static;margin-bottom:34px}
  .ex__body{grid-template-columns:1fr}
  .areas{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));border-top:0;gap:0 18px}
  .studio__grid{grid-template-columns:1fr}
  .studio__media{min-height:340px}
  .contact__wrap{grid-template-columns:1fr}
  .ft__top{grid-template-columns:1fr}
}
@media (max-width:760px){
  .hero{height:300svh}
  .hero__sticky{padding-top:120px}
  .hero__stage{min-height:clamp(300px,52vh,420px)}
  .hero__stats{gap:22px 34px}
  .hero__stats>div{flex:1 1 40%}
  .f2{grid-template-columns:1fr}
  .hero__act .btn{flex:1 1 100%}
  .ex__foot{flex-direction:column;align-items:flex-start}
  .studio__facts strong{min-width:100%}
}
@media (max-width:560px){
  .hdr__in{gap:16px}
  .hdr__cta .btn{display:none}   /* resta il burger: il CTA vive nel drawer */
  .wa{right:16px;bottom:16px}
}
@media (max-width:420px){
  .cat{min-height:340px;padding:26px 22px}
  .form{padding:24px 20px}
  .seg__b{padding:10px 18px;font-size:10.5px}
}