/* ═══════════════════════════════════════════════════════════
   MIKETING — design system
   ═══════════════════════════════════════════════════════════ */

:root{
  /* brand palette */
  --ink:#11110f;
  --ink-soft:#1c1c19;
  --paper:#f2f0e8;
  --paper-bright:#faf9f5;
  --lime:#e5d502;
  --business:#29465c;
  --business-deep:#172a38;
  --blue:#6f8798;
  --coral:#c8c5ba;
  --muted:#68675f;
  --line:rgba(17,17,15,.14);
  --line-strong:rgba(17,17,15,.28);

  /* type */
  --sans:'Inter Tight','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  /* fluid scale */
  --fs-display:clamp(3.1rem,11.2vw,10.5rem);
  --fs-h2:clamp(2.1rem,5.6vw,5.1rem);
  --fs-h3:clamp(1.25rem,2.2vw,1.85rem);
  --fs-lead:clamp(1.02rem,1.45vw,1.32rem);
  --fs-body:clamp(.96rem,1.05vw,1.06rem);
  --fs-micro:clamp(.66rem,.78vw,.78rem);

  /* rhythm */
  --pad:clamp(1.15rem,4.4vw,4.5rem);
  --gap:clamp(1rem,2.2vw,2rem);
  --sec:clamp(5.5rem,13vh,11rem);
  --r:clamp(14px,1.5vw,26px);
  --r-lg:clamp(20px,2.4vw,40px);

  /* motion */
  --e-out:cubic-bezier(.16,1,.3,1);
  --e-io:cubic-bezier(.65,.05,.36,1);
  --t:.7s var(--e-out);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border:0}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scrollbar-color:var(--line-strong) transparent;
  background:var(--paper);
}
body{
  font-family:var(--sans);
  font-size:var(--fs-body);
  font-weight:420;
  line-height:1.55;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  font-feature-settings:'ss01','cv11';
}
body.is-locked{overflow:hidden}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;cursor:pointer}
ol,ul{list-style:none}
h1,h2,h3,h4{font-weight:inherit;font-size:inherit;line-height:1}
em{font-style:normal}
::selection{background:var(--lime);color:var(--ink)}

main{position:relative;z-index:1}
section{position:relative}
.shell{padding-inline:var(--pad)}

/* ─── shared type ─────────────────────────────────────────── */
.eyebrow{
  font-family:var(--mono);
  font-size:var(--fs-micro);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
  display:flex;align-items:center;gap:.65em;
}
.eyebrow::before{
  content:'';width:clamp(18px,2.4vw,34px);height:1px;background:currentColor;opacity:.5;
  transform-origin:left;
}
h2{
  font-size:var(--fs-h2);
  font-weight:600;
  letter-spacing:-.036em;
  line-height:.94;
  text-wrap:balance;
}
/* accento: stessa famiglia, peso leggero e corpo minore.
   Il contrasto lo fanno peso, dimensione e colore — non un secondo carattere. */
h2 em,.accent-serif{
  font-family:inherit;
  font-style:normal;
  font-weight:300;
  font-size:.6em;
  letter-spacing:-.03em;
}

/* ─── split-text primitives ───────────────────────────────── */
.wd{display:inline-block}
/* la maschera taglia sul padding box: il padding (compensato dal margine
   negativo) dà aria a discendenti e code dei corsivi senza spostare il testo */
.line{
  display:block;overflow:hidden;
  padding-bottom:.09em;margin-bottom:-.09em;
  padding-inline:.12em .18em;margin-inline:-.12em -.18em;
}
.ln{display:inline-block;will-change:transform;transform:translate3d(0,110%,0) rotate(3deg);opacity:0}
.is-in .ln{
  transform:translate3d(0,0,0) rotate(0);opacity:1;
  transition:transform 1.05s var(--e-out),opacity .7s ease;
}
.is-in .ln:nth-child(1){transition-delay:0s}
[data-reveal]{
  opacity:0;transform:translate3d(0,26px,0);
  transition:opacity .85s var(--e-out),transform 1s var(--e-out);
  transition-delay:var(--d,0ms);
}
[data-reveal].is-in{opacity:1;transform:none}

/* no-js / pre-boot safety: never leave content invisible */
html.no-js [data-reveal],
html.no-js .ghost,
html.no-js .round,
html.no-js .sticker{opacity:1;transform:none;animation:none}

/* ─── buttons ─────────────────────────────────────────────── */
.btn{
  position:relative;display:inline-flex;align-items:center;gap:.7em;
  padding:.95em 1.5em;border-radius:100px;
  font-size:clamp(.86rem,1vw,1rem);font-weight:520;letter-spacing:-.015em;
  overflow:hidden;isolation:isolate;
  transition:color .45s var(--e-out),transform .5s var(--e-out),box-shadow .5s var(--e-out);
  will-change:transform;
}
.btn span,.btn i{position:relative;z-index:2}
.btn i{font-style:normal;transition:transform .5s var(--e-out)}
.btn::after{
  content:'';position:absolute;inset:0;z-index:1;border-radius:inherit;
  transform:translate3d(0,101%,0);transition:transform .6s var(--e-out);
}
.btn:hover::after{transform:translate3d(0,0,0)}
.btn:hover i{transform:translate(3px,-3px)}
.btn-ink{background:var(--ink);color:var(--paper-bright)}
.btn-ink::after{background:var(--lime)}
.btn-ink:hover{color:var(--ink)}
.btn-lime{background:var(--lime);color:var(--ink)}
.btn-lime::after{background:var(--ink)}
.btn-lime:hover{color:var(--paper-bright)}
.btn-outline{border:1px solid rgba(250,249,245,.32);color:var(--paper-bright)}
.btn-outline::after{background:var(--paper-bright)}
.btn-outline:hover{color:var(--ink)}
.btn-round{
  display:grid;place-items:center;width:clamp(48px,4.2vw,60px);aspect-ratio:1;
  border-radius:50%;border:1px solid var(--line-strong);
  transition:background .45s var(--e-out),color .45s var(--e-out),transform .5s var(--e-out);
  will-change:transform;
}
.btn-round i{font-style:normal;transition:transform .5s var(--e-out)}
.btn-round:hover{background:var(--ink);color:var(--paper-bright)}
.btn-round:hover i{transform:translateY(4px)}

/* riga dei bottoni sotto un titolo.
   Senza questa regola il tondo finisce a capo appiccicato al bottone,
   perché .btn è inline-flex e .btn-round è un grid a tutta riga. */
.hero-actions{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:clamp(.7rem,1.4vw,1.1rem);
}
.link-under{
  display:inline-flex;align-items:center;gap:.5em;font-weight:500;
  padding-bottom:.28em;background-image:linear-gradient(currentColor,currentColor);
  background-size:100% 1px;background-repeat:no-repeat;background-position:0 100%;
  transition:background-size .5s var(--e-out);
}
.link-under i{font-style:normal;transition:transform .5s var(--e-out)}
.link-under:hover{background-size:0% 1px}
.link-under:hover i{transform:translate(3px,-3px)}

/* ═══ overlays ════════════════════════════════════════════ */
.grain{
  position:fixed;inset:-120%;z-index:60;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 8s steps(6) infinite;
  mix-blend-mode:multiply;
}
@keyframes grain{
  0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-4%)}
  60%{transform:translate(-3%,-3%)}80%{transform:translate(4%,4%)}100%{transform:translate(0,0)}
}
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:70;pointer-events:none}
.progress i{
  display:block;height:100%;width:100%;background:var(--lime);
  transform:scaleX(0);transform-origin:0 50%;
}

/* cursor (desktop only) */
.cursor{display:none}
@media (hover:hover) and (pointer:fine){
  .cursor{
    display:block;position:fixed;top:0;left:0;z-index:80;pointer-events:none;
    mix-blend-mode:difference;opacity:0;transition:opacity .4s ease;
  }
  body.cur-live .cursor{opacity:1}
  .cursor-dot{
    position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;
    transform:translate(-50%,-50%);transition:opacity .3s,width .35s var(--e-out),height .35s var(--e-out);
  }
  .cursor-ring{
    position:absolute;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.6);
    transform:translate(-50%,-50%) scale(1);
    display:grid;place-items:center;
    transition:width .45s var(--e-out),height .45s var(--e-out),background .45s var(--e-out),border-color .4s;
  }
  .cursor-ring em{
    font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
    color:#000;opacity:0;transition:opacity .3s;font-style:normal;
  }
  body.cur-hover .cursor-ring{width:62px;height:62px;background:rgba(255,255,255,.9);border-color:transparent}
  body.cur-hover .cursor-dot{opacity:0}
  body.cur-view .cursor-ring{width:92px;height:92px;background:#fff;border-color:transparent}
  body.cur-view .cursor-ring em{opacity:1}
  body.cur-view .cursor-dot{opacity:0}
}

/* loader */
.loader{
  position:fixed;inset:0;z-index:90;background:var(--ink);color:var(--paper-bright);
  display:grid;place-items:center;
  transition:transform 1.1s var(--e-out),visibility 1.1s;
}
.loader.is-done{transform:translate3d(0,-101%,0);visibility:hidden}
.loader-inner{width:min(560px,78vw);display:flex;flex-direction:column;gap:1.4rem;align-items:center}
.loader-mark{width:clamp(150px,26vw,240px);overflow:hidden}
.loader-mark img{
  transform:translate3d(0,105%,0);
  animation:loadUp 1s var(--e-out) .1s forwards;
}
@keyframes loadUp{to{transform:translate3d(0,0,0)}}
.loader-meta{
  width:100%;display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  opacity:.55;
}
.loader-num{font-variant-numeric:tabular-nums}
.loader-bar{width:100%;height:1px;background:rgba(250,249,245,.18);overflow:hidden}
.loader-bar i{display:block;height:100%;width:100%;background:var(--lime);transform:scaleX(0);transform-origin:0 50%}

/* ═══ nav ═════════════════════════════════════════════════ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;gap:var(--gap);
  padding:clamp(.85rem,1.5vw,1.35rem) var(--pad);
  transition:transform .65s var(--e-out),background .5s ease,backdrop-filter .5s ease,padding .5s var(--e-out);
  will-change:transform;
}
.nav.is-hidden{transform:translate3d(0,-104%,0)}
.nav.is-stuck{
  background:color-mix(in srgb,var(--paper) 72%,transparent);
  backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);
  padding-block:clamp(.6rem,1vw,.85rem);
  box-shadow:0 1px 0 var(--line);
}
.nav.on-dark{color:var(--paper-bright)}
.nav.on-dark.is-stuck{background:color-mix(in srgb,var(--ink) 62%,transparent);box-shadow:0 1px 0 rgba(250,249,245,.12)}
.nav.on-dark .nav-cta{border-color:rgba(250,249,245,.34)}
.nav-brand{flex:0 0 auto;width:clamp(104px,9vw,132px);position:relative}
.nav-brand img{transition:opacity .45s ease}
.nav-brand .mark-light{position:absolute;inset:0;opacity:0}
.nav.on-dark .nav-brand .mark-dark{opacity:0}
.nav.on-dark .nav-brand .mark-light{opacity:1}
.nav-links{
  margin-inline:auto;display:flex;gap:clamp(.4rem,1.6vw,1.9rem);
  font-size:.92rem;font-weight:480;letter-spacing:-.01em;
}
.nav-links > a{position:relative;display:block;height:1.35em;overflow:hidden;padding-inline:.2em}
.nav-links > a span{display:block;transition:transform .55s var(--e-out)}
.nav-links > a span:last-child{color:var(--lime)}
.nav:not(.on-dark) .nav-links > a span:last-child{color:var(--business)}
.nav-links > a:hover span{transform:translateY(-100%)}
.nav-cta{
  display:inline-flex;align-items:center;gap:.5em;
  padding:.55em 1.05em;border:1px solid var(--line-strong);border-radius:100px;
  font-size:.88rem;font-weight:500;
  position:relative;overflow:hidden;isolation:isolate;will-change:transform;
  transition:color .4s var(--e-out),transform .5s var(--e-out);
}
.nav-cta::after{content:'';position:absolute;inset:0;z-index:-1;background:var(--lime);transform:translate3d(0,101%,0);transition:transform .55s var(--e-out)}
.nav-cta:hover{color:var(--ink)}
.nav-cta:hover::after{transform:none}
.nav-cta i{font-style:normal}
.nav-burger{display:none;width:46px;height:46px;border-radius:50%;border:1px solid var(--line-strong);position:relative}
.nav-burger i{
  position:absolute;left:50%;width:17px;height:1.5px;background:currentColor;
  transform:translateX(-50%);transition:transform .5s var(--e-out),opacity .3s;
}
.nav-burger i:first-child{top:19px}
.nav-burger i:last-child{top:25px}
body.menu-open .nav-burger i:first-child{transform:translateX(-50%) translateY(3px) rotate(45deg)}
body.menu-open .nav-burger i:last-child{transform:translateX(-50%) translateY(-3px) rotate(-45deg)}

@media (max-width:960px){
  .nav-links,.nav-cta{display:none}
  .nav-burger{display:block;margin-left:auto}
  .nav.on-dark .nav-burger{border-color:rgba(250,249,245,.34)}
  body.menu-open .nav{color:var(--paper-bright)}
  body.menu-open .nav .nav-brand .mark-dark{opacity:0}
  body.menu-open .nav .nav-brand .mark-light{opacity:1}
  body.menu-open .nav-burger{border-color:rgba(250,249,245,.34)}
}


/* ─── tendina servizi (desktop) ─────────────────────────── */
.nav-drop{position:relative}
.nav-drop-btn{
  position:relative;display:flex;align-items:center;gap:.38em;
  padding-inline:.2em;color:inherit;
  font:inherit;font-size:.92rem;font-weight:480;letter-spacing:-.01em;
  transition:color .35s ease;
}
.nav-drop:hover .nav-drop-btn,
.nav-drop.is-open .nav-drop-btn{color:var(--business)}
.nav.on-dark .nav-drop:hover .nav-drop-btn,
.nav.on-dark .nav-drop.is-open .nav-drop-btn{color:var(--lime)}
.nav-drop-btn i{
  width:0;height:0;flex:0 0 auto;align-self:center;
  border:4px solid transparent;border-top-color:currentColor;
  transform:translateY(2px);transition:transform .4s var(--e-out);
}
.nav-drop:hover .nav-drop-btn i,
.nav-drop.is-open .nav-drop-btn i{transform:translateY(-1px) rotate(180deg)}

.nav-drop-menu{
  position:absolute;top:calc(100% + .9rem);left:50%;
  min-width:230px;padding:.5rem;border-radius:16px;
  display:flex;flex-direction:column;
  background:color-mix(in srgb,var(--paper-bright) 92%,transparent);
  border:1px solid var(--line);
  box-shadow:0 26px 50px -26px rgba(17,17,15,.42);
  backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);
  opacity:0;visibility:hidden;
  transform:translate(-50%,-10px) scale(.97);transform-origin:50% 0;
  transition:opacity .35s var(--e-out),transform .45s var(--e-out),visibility .35s;
}
.nav-drop:hover .nav-drop-menu,
.nav-drop:focus-within .nav-drop-menu,
.nav-drop.is-open .nav-drop-menu{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)}
.nav-drop-menu::before{
  content:'';position:absolute;left:0;right:0;top:-.9rem;height:.9rem;
}
.nav-drop-menu a{
  display:flex;align-items:center;gap:.4em;
  padding:.62em .8em;border-radius:10px;
  font-size:.9rem;font-weight:480;color:var(--ink);white-space:nowrap;
  transition:background .3s ease,color .3s ease,padding-left .35s var(--e-out);
}
.nav-drop-menu a i{font-style:normal;font-size:.72em;opacity:.45}
.nav-drop-menu a:hover{background:var(--ink);color:var(--paper-bright);padding-left:1.05em}
.nav-drop-menu a:hover i{opacity:.8}

/* ─── gruppo servizi nel menu mobile ────────────────────── */
.menu-group{display:flex;flex-direction:column}
.menu-groupbtn{
  display:flex;align-items:baseline;gap:.7em;text-align:left;font:inherit;
  font-size:clamp(2.1rem,9vw,3.6rem);font-weight:550;letter-spacing:-.04em;line-height:1.1;
  color:inherit;
  opacity:0;transform:translate3d(0,40px,0);
  transition:opacity .6s var(--e-out) .22s,transform .8s var(--e-out) .22s;
}
body.menu-open .menu-groupbtn{opacity:1;transform:none}
.menu-groupbtn i{
  width:0;height:0;align-self:center;flex:0 0 auto;
  border:6px solid transparent;border-top-color:var(--lime);
  transition:transform .4s var(--e-out);
}
.menu-group.is-open .menu-groupbtn i{transform:rotate(180deg)}
.menu-sub{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .55s var(--e-out),opacity .4s ease;
  opacity:0;
}
.menu-group.is-open .menu-sub{grid-template-rows:1fr;opacity:1}
.menu-sub>*{overflow:hidden;display:flex;flex-direction:column}
.menu-sub a{
  padding:.42em 0 .42em 1.6rem;
  font-size:clamp(.95rem,4vw,1.25rem);font-weight:450;letter-spacing:-.02em;
  color:rgba(250,249,245,.72);border-left:1px solid rgba(250,249,245,.2);margin-left:.2rem;
  transition:color .3s ease,border-color .3s ease,padding-left .35s var(--e-out);
}
.menu-sub a:first-child{padding-top:.9rem}
.menu-sub a:last-child{padding-bottom:1.1rem}
.menu-sub a:hover,.menu-sub a:active{color:var(--lime);border-color:var(--lime);padding-left:1.9rem}

/* full-screen menu */
.menu{position:fixed;inset:0;z-index:45;visibility:hidden;pointer-events:none}
.menu-bg{
  position:absolute;inset:0;background:var(--ink);
  clip-path:inset(0 0 100% 0);transition:clip-path .85s var(--e-out);
}
.menu-body{
  position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;
  gap:.15em;padding:6rem var(--pad) 2.5rem;color:var(--paper-bright);
}
.menu-eyebrow{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.22em;text-transform:uppercase;
  opacity:.45;margin-bottom:1.4rem;
}
.menu-body>a,.menu-body>.menu-group>.menu-groupbtn{
  /* stessa entrata scaglionata delle voci */
}
.menu-body>a{
  display:flex;align-items:baseline;gap:.7em;
  font-size:clamp(2.1rem,9vw,3.6rem);font-weight:550;letter-spacing:-.04em;line-height:1.1;
  opacity:0;transform:translate3d(0,40px,0);
  transition:opacity .6s var(--e-out),transform .8s var(--e-out),color .3s;
}
.menu-idx{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;opacity:.4;transform:translateY(-.55em)}
.menu-body>a:active{color:var(--lime)}
.menu-foot{
  margin-top:auto;padding-top:2rem;display:flex;flex-wrap:wrap;gap:.9rem 1.6rem;
  font-size:.9rem;opacity:0;transition:opacity .5s ease .45s;border-top:1px solid rgba(250,249,245,.14);
}
body.menu-open .menu{visibility:visible;pointer-events:auto}
body.menu-open .menu-bg{clip-path:inset(0 0 0 0)}
body.menu-open .menu-body>a,.menu-body>.menu-group>.menu-groupbtn{
  /* stessa entrata scaglionata delle voci */
}
.menu-body>a{opacity:1;transform:none}
body.menu-open .menu-body>a:nth-child(2){transition-delay:.22s}
body.menu-open .menu-body>a:nth-child(3){transition-delay:.28s}
body.menu-open .menu-body>a:nth-child(4){transition-delay:.34s}
body.menu-open .menu-body>a:nth-child(5){transition-delay:.40s}
body.menu-open .menu-body>a:nth-child(6){transition-delay:.46s}
body.menu-open .menu-body>a:nth-child(7){transition-delay:.52s}
body.menu-open .menu-foot{opacity:.6}


/* ═══ 01 · hero: dentro il fulmine ════════════════════════ */
.bolt{height:270vh;background:var(--ink)}
.bolt-sticky{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--paper)}

/* strato rivelato attraverso il buco */
.bolt-behind{
  position:absolute;inset:0;z-index:0;
  display:flex;align-items:center;
  padding:clamp(6rem,12vh,8rem) var(--pad) clamp(3rem,7vh,4.5rem);
  background:var(--paper);
}
.bolt-behind::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 55% 60% at 12% 18%,rgba(229,213,2,.34),transparent 62%),
    radial-gradient(ellipse 50% 55% at 88% 82%,rgba(41,70,92,.16),transparent 60%);
}
.bolt-claim{
  position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;
  gap:clamp(1rem,2.4vh,1.6rem);max-width:min(94vw,1120px);
  transform:scale(var(--behind-s,.94));transform-origin:50% 50%;
}
.bolt-title{
  font-size:clamp(2.6rem,8.4vw,7.4rem);font-weight:600;letter-spacing:-.052em;line-height:.9;
}
.bolt-title em{font-weight:300;font-size:.66em;letter-spacing:-.035em;color:var(--business)}
.bolt-copy{max-width:46ch;font-size:var(--fs-lead);color:var(--muted);line-height:1.45}

/* schermo scuro iniziale */
.bolt-dark{
  position:absolute;inset:0;z-index:1;background:var(--ink);
  opacity:var(--dark-o,1);
}

/* la lampadina: SVG grande quanto lo schermo, lo zoom avviene
   dentro il viewBox — così resta nitida e non sfonda i limiti del browser */
.bolt-mark{
  position:absolute;inset:0;z-index:2;
  color:var(--lime);opacity:var(--mark-o,1);
}
.bolt-mark svg{width:100%;height:100%;display:block}
.bolt-halo{opacity:var(--halo-o,1)}

/* testo della fase scura */
.bolt-intro{
  position:absolute;z-index:3;inset:auto var(--pad) clamp(2rem,6vh,3.4rem) var(--pad);
  display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;
  color:var(--paper-bright);opacity:var(--intro-o,1);
  pointer-events:none;
}
.bolt-kicker{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.6);
}
.bolt-kicker em{font-style:normal;color:var(--lime)}
.bolt-hint{display:flex;align-items:center;gap:.7rem}
.bolt-hint span{
  font-family:var(--mono);font-size:9px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(250,249,245,.5);
}
.bolt-hint i{display:block;width:54px;height:1px;background:rgba(250,249,245,.24);position:relative;overflow:hidden}
.bolt-hint i::after{
  content:'';position:absolute;inset:0;background:var(--lime);
  animation:hintRun 2.2s var(--e-io) infinite;
}

@media (max-width:860px){
  .bolt{height:250vh}
  .bolt-behind{align-items:flex-end;padding-bottom:clamp(4rem,12vh,6rem)}
}
@media (prefers-reduced-motion:reduce){
  .bolt{height:auto}
  .bolt-sticky{position:static;height:auto;min-height:100svh}
  .bolt-dark,.bolt-mark,.bolt-intro{display:none}
  .bolt-claim{transform:none}
}

/* ═══ 02 · reel (expand on scroll) ════════════════════════ */
.reel{height:230vh;background:var(--ink)}
.reel-sticky{
  position:sticky;top:0;height:100svh;display:grid;place-items:center;
  padding:var(--pad);overflow:hidden;
}
.reel-frame{
  position:relative;display:block;width:100%;height:100%;
  border-radius:var(--r-lg);overflow:hidden;
  transform:scale(var(--reel-s,.62));
  will-change:transform,border-radius;
}
/* muro di foto: 3 colonne che scorrono in verticale a velocità
   diverse mentre la cornice si apre a tutto schermo */
.reel-wall{
  position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(5px,.7vw,11px);overflow:hidden;background:var(--ink);
}
.reel-col{position:relative;overflow:hidden}
.reel-strip{
  position:absolute;top:-26%;left:0;right:0;height:152%;
  display:flex;flex-direction:column;gap:clamp(5px,.7vw,11px);
  will-change:transform;
}
.reel-strip img{
  flex:1;min-height:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.94) contrast(1.03);
}
.reel-wash{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(17,17,15,.6),rgba(17,17,15,.05) 34%,rgba(17,17,15,.88)),
    radial-gradient(ellipse at 20% 88%,rgba(17,17,15,.6),transparent 60%);
}
.reel-copy{
  position:absolute;inset:auto var(--pad) clamp(1.6rem,5vh,3.4rem) var(--pad);
  display:flex;flex-direction:column;gap:.7rem;color:var(--paper-bright);
  opacity:var(--reel-o,0);transform:translate3d(0,calc((1 - var(--reel-o,0)) * 30px),0);
}
.reel-kicker{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;text-transform:uppercase;opacity:.7;
}
.reel-title{font-size:clamp(2rem,6.4vw,5.4rem);font-weight:580;letter-spacing:-.042em;line-height:.92}
.reel-title em{font-weight:300;font-size:.58em;letter-spacing:-.03em;color:var(--lime)}
.reel-action{
  display:inline-flex;align-items:center;gap:.5em;width:fit-content;margin-top:.4rem;
  padding:.7em 1.25em;border:1px solid rgba(250,249,245,.34);border-radius:100px;font-size:.9rem;
  transition:background .4s var(--e-out),color .4s var(--e-out);
}
.reel-action i{font-style:normal}
.reel-frame:hover .reel-action{background:var(--paper-bright);color:var(--ink)}
@media (max-width:720px){
  .reel-wall{grid-template-columns:repeat(2,1fr)}
  .reel-col-3{display:none}
}

/* ═══ marquee (usato dalla fascia corsi) ══════════════════ */
.marquee{overflow:hidden;display:flex}
.marquee-track{
  display:flex;align-items:center;gap:clamp(1.2rem,3vw,2.6rem);flex:0 0 auto;padding-right:clamp(1.2rem,3vw,2.6rem);
  font-size:clamp(1.5rem,4.4vw,3.4rem);font-weight:500;letter-spacing:-.035em;white-space:nowrap;
  will-change:transform;
}
.marquee-track i{font-style:normal;color:var(--lime);font-size:.45em;transform:translateY(-.15em)}
.marquee-track span{opacity:.92}

/* ═══ shared section head ════════════════════════════════ */
.sec-head{
  padding-block:var(--sec) clamp(2.4rem,5vw,4rem);
  display:grid;grid-template-columns:1.4fr .8fr;gap:var(--gap);align-items:end;
}
.sec-head .eyebrow{margin-bottom:1.1rem}
.sec-copy{max-width:42ch;color:var(--muted);font-size:var(--fs-lead);line-height:1.45;letter-spacing:-.012em}
.sec-head-invert{padding-inline:var(--pad)}
.sec-head-invert .sec-copy{color:rgba(250,249,245,.6)}
.sec-head-invert .eyebrow{color:rgba(250,249,245,.55)}
@media (max-width:860px){
  .sec-head{grid-template-columns:1fr;align-items:start;gap:1.4rem}
}

/* ═══ 04 · servizi ═══════════════════════════════════════ */
.services{background:var(--paper);padding-bottom:var(--sec)}
.svc-list{position:relative;border-top:1px solid var(--line)}
.svc{
  position:relative;display:grid;align-items:center;gap:var(--gap);
  grid-template-columns:auto minmax(0,1.15fr) minmax(0,1fr) auto;
  padding-block:clamp(1.5rem,3.2vw,2.5rem);
  border-bottom:1px solid var(--line);
  isolation:isolate;
}
.svc::before{
  content:'';position:absolute;inset:0 calc(var(--pad) * -.4);z-index:-1;border-radius:var(--r);
  background:var(--ink);transform:scaleY(0);transform-origin:50% 100%;opacity:0;
  transition:transform .55s var(--e-out),opacity .4s ease;
}
.svc-n{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;color:var(--muted);
  transition:color .4s ease;
}
.svc-main{display:flex;flex-direction:column;gap:.28rem}
.svc-main strong{
  font-size:clamp(1.5rem,3.4vw,2.85rem);font-weight:560;letter-spacing:-.04em;line-height:1;
  transition:transform .55s var(--e-out),color .4s ease;
}
.svc-main>span{color:var(--muted);font-size:var(--fs-body);max-width:40ch;transition:color .4s ease}
.svc-tags{display:flex;flex-wrap:wrap;gap:.4rem}
.svc-tags i{
  font-style:normal;font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.06em;
  padding:.4em .8em;border:1px solid var(--line);border-radius:100px;color:var(--muted);
  transition:border-color .4s ease,color .4s ease;
}
.svc-go{
  display:grid;place-items:center;width:clamp(38px,3.4vw,50px);aspect-ratio:1;border-radius:50%;
  border:1px solid var(--line-strong);
  transition:transform .55s var(--e-out),background .4s ease,color .4s ease,border-color .4s;
}
@media (hover:hover){
  .svc:hover::before{transform:scaleY(1);opacity:1}
  .svc:hover .svc-n{color:var(--lime)}
  .svc:hover .svc-main strong{transform:translateX(clamp(6px,1vw,18px));color:var(--paper-bright)}
  .svc:hover .svc-main>span{color:rgba(250,249,245,.6)}
  .svc:hover .svc-tags i{color:rgba(250,249,245,.75);border-color:rgba(250,249,245,.24)}
  .svc:hover .svc-go{background:var(--lime);border-color:var(--lime);color:var(--ink);transform:rotate(45deg)}
}
.svc-preview{
  position:absolute;top:0;left:0;z-index:5;pointer-events:none;
  width:clamp(96px,8vw,128px);aspect-ratio:1;border-radius:26%;
  display:grid;place-items:center;
  background:var(--lime);color:var(--ink);
  box-shadow:0 22px 44px -20px rgba(17,17,15,.5);
  opacity:0;transform:translate3d(-50%,-50%,0) scale(.7) rotate(-10deg);
  transition:opacity .35s ease,transform .5s var(--e-out);
  will-change:transform,opacity;
}
.svc-preview.is-on{opacity:1;transform:translate3d(-50%,-50%,0) scale(1) rotate(-6deg)}
.svc-ic{
  grid-area:1/1;width:46%;height:46%;
  opacity:0;transform:scale(.7);
  transition:opacity .3s ease,transform .45s var(--e-out);
}
.svc-ic.is-live{opacity:1;transform:none}

@media (max-width:860px){
  .svc{grid-template-columns:auto 1fr auto;grid-template-areas:'n main go' '. tags go';row-gap:.85rem}
  .svc-n{grid-area:n;align-self:start;padding-top:.5em}
  .svc-main{grid-area:main}
  .svc-tags{grid-area:tags}
  .svc-go{grid-area:go}
  .svc-preview{display:none}
}

/* ═══ 05 · ecosistema ════════════════════════════════════ */
.eco{height:300vh;background:var(--business-deep);color:var(--paper-bright)}
.eco-sticky{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:clamp(4.5rem,10vh,7rem) var(--pad) clamp(2.5rem,7vh,4rem);
  text-align:center;
}
.eco-sticky::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(229,213,2,.1),transparent 55%);
  opacity:var(--eco-p,0);
}
.eco-intro{max-width:min(92vw,700px);position:relative;z-index:3}
.eco-intro .eyebrow{justify-content:center;color:rgba(250,249,245,.55)}
.eco-intro h2{margin-top:.8rem;font-size:clamp(1.8rem,3.4vw,3.3rem);line-height:1}
.eco-intro h2 em{color:var(--lime)}

.eco-stage{
  position:relative;flex:1;width:min(100%,720px);margin-block:clamp(.5rem,2vh,1.5rem);
  min-height:min(52vh,470px);
  display:grid;place-items:center;
}
.eco-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.eco-lines path{
  fill:none;stroke:rgba(250,249,245,.5);stroke-width:1.2;stroke-linecap:round;
  stroke-dasharray:var(--len,400);stroke-dashoffset:calc(var(--len,400) * (1 - var(--eco-p,0)));
}
.eco-lines circle{fill:var(--lime);opacity:calc(var(--eco-p,0) * var(--eco-p,0))}

.eco-core{
  position:relative;z-index:4;display:grid;place-items:center;
  width:clamp(122px,17vw,172px);aspect-ratio:1;border-radius:50%;
  background:rgba(250,249,245,.06);border:1px solid rgba(250,249,245,.18);
  backdrop-filter:blur(6px);
  transform:scale(calc(.86 + var(--eco-p,0) * .14));
}
.eco-core img{width:62%}
/* la dicitura sta sotto al cerchio: dentro era sempre al limite */
.eco-core small{
  position:absolute;top:calc(100% + .9rem);left:50%;transform:translateX(-50%);
  font-family:var(--mono);font-size:clamp(7.5px,.62vw,9px);letter-spacing:.18em;
  text-transform:uppercase;white-space:nowrap;
  opacity:calc(var(--eco-p,0) * .55);
}
.core-pulse{
  position:absolute;inset:0;border-radius:50%;border:1px solid var(--lime);
  opacity:0;animation:pulse 3.4s var(--e-out) infinite;
}
.core-pulse-2{animation-delay:1.7s}
@keyframes pulse{
  0%{transform:scale(1);opacity:.5}
  100%{transform:scale(1.85);opacity:0}
}

.eco-node{
  position:absolute;left:50%;top:50%;z-index:3;opacity:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:.05rem;
  padding:.7rem .95rem;border-radius:14px;
  background:rgba(250,249,245,.07);border:1px solid rgba(250,249,245,.16);
  backdrop-filter:blur(8px);text-align:left;
  will-change:transform;
}
.eco-node span{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:var(--lime);opacity:.9}
.eco-node strong{font-size:clamp(.92rem,1.5vw,1.15rem);font-weight:560;letter-spacing:-.02em;line-height:1.1}
.eco-node small{font-size:.66rem;letter-spacing:.02em;opacity:.5}

.eco-final{
  max-width:46ch;position:relative;z-index:3;
  color:rgba(250,249,245,.72);font-size:var(--fs-lead);letter-spacing:-.012em;
  opacity:var(--eco-p,0);transform:translate3d(0,calc((1 - var(--eco-p,0)) * 18px),0);
}
.eco-hint{
  position:absolute;bottom:clamp(1rem,3vh,1.8rem);left:50%;transform:translateX(-50%);
  font-family:var(--mono);font-size:9px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(250,249,245,.42);opacity:calc(1 - var(--eco-p,0));
}
@media (max-width:860px){
  .eco{height:260vh}
  .eco-sticky{padding-top:clamp(4rem,9vh,5.5rem)}
  .eco-intro{max-width:min(94vw,460px)}
  .eco-intro h2{font-size:clamp(1.55rem,6.4vw,2.4rem);letter-spacing:-.03em}
  .eco-stage{min-height:min(46vh,360px);margin-block:.6rem}
  .eco-core{width:clamp(78px,22vw,110px)}
  .eco-core small{display:none}
  .eco-final{font-size:.94rem;max-width:32ch}
}
@media (max-width:640px){
  .eco-node{padding:.5rem .7rem;border-radius:11px}
  .eco-node small{display:none}
  .eco-node strong{font-size:.9rem}
}

/* ═══ 06 · settori rail ══════════════════════════════════ */
.sectors{background:var(--paper);padding-bottom:var(--sec)}
.sector-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.sec-card{
  position:relative;border-radius:var(--r);overflow:hidden;
  background:var(--ink);color:var(--paper-bright);
  aspect-ratio:5/4;display:flex;flex-direction:column;justify-content:flex-end;
  isolation:isolate;
  transition:transform .6s var(--e-out);
}
.sec-card:hover{transform:translateY(-4px)}
.sec-media{position:absolute;inset:0;z-index:-1}
.sec-media::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(17,17,15,0) 44%,rgba(17,17,15,.8) 100%);
}
.sec-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--e-out);transform:scale(1.02)}
.sec-card:hover .sec-media img{transform:scale(1.07)}
.sec-body{display:flex;padding:clamp(1rem,1.6vw,1.3rem)}
.sec-body h3{
  font-size:clamp(1.02rem,1.5vw,1.32rem);font-weight:560;letter-spacing:-.03em;line-height:1.08;
  text-shadow:0 2px 22px rgba(17,17,15,.55);text-wrap:balance;
}
.sec-go{
  position:absolute;top:.9rem;right:.9rem;z-index:2;
  display:grid;place-items:center;width:clamp(30px,2.4vw,36px);aspect-ratio:1;border-radius:50%;
  background:rgba(250,249,245,.14);border:1px solid rgba(250,249,245,.3);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-size:.8rem;
  transition:background .45s var(--e-out),color .45s var(--e-out),transform .55s var(--e-out);
}
.sec-card:hover .sec-go{background:var(--lime);border-color:var(--lime);color:var(--ink);transform:rotate(45deg)}
@media (max-width:1100px){.sector-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.sector-grid{grid-template-columns:repeat(2,1fr)}}

/* ═══ 07 · lavori ════════════════════════════════════════ */
.work{background:var(--ink);color:var(--paper-bright);padding-bottom:var(--sec)}
.work-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);
  padding-inline:var(--pad);
}
.work-item{
  position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;
  display:block;isolation:isolate;
}
.work-media{position:absolute;inset:-8% 0;z-index:-1;will-change:transform}
.work-media img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.2s var(--e-out),filter .6s ease;
  filter:saturate(.9) contrast(1.02);
}
.work-item::after{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(17,17,15,0) 42%,rgba(17,17,15,.88));
  opacity:.9;transition:opacity .5s ease;
}
.work-item:hover .work-media img{transform:scale(1.06);filter:saturate(1.05)}
.work-n{
  position:absolute;top:1rem;left:1.15rem;z-index:2;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;opacity:.75;
}
.work-cap{
  position:absolute;left:1.15rem;right:1.15rem;bottom:1.1rem;z-index:2;
  display:flex;flex-direction:column;gap:.12rem;
  transform:translate3d(0,8px,0);
  transition:transform .55s var(--e-out);
}
.work-item:hover .work-cap{transform:none}
.work-cap strong{font-size:clamp(1rem,1.4vw,1.25rem);font-weight:560;letter-spacing:-.028em;line-height:1.15}
.work-cap small{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.1em;opacity:.6}
.work-all{margin:clamp(2rem,4vw,3rem) var(--pad) 0}
@media (max-width:900px){.work-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.work-grid{grid-template-columns:1fr}}

/* ═══ 08 · loop ══════════════════════════════════════════ */
.loop{background:var(--paper-bright);padding:var(--sec) var(--pad)}
.loop-head{max-width:min(92vw,760px);margin-bottom:clamp(2.6rem,6vw,4.5rem)}
.loop-head .eyebrow{margin-bottom:1rem}
.loop-head h2 em{color:var(--business)}
.loop-track{
  position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);
  padding-top:1.7rem;
}
/* il binario viene allineato dal JS ai centri esatti delle 4 tappe */
.loop-line{
  position:absolute;
  top:var(--rail-y,0px);left:var(--rail-x,0px);
  width:var(--rail-w,100%);height:1px;background:var(--line);
}
.loop-line i{
  display:block;height:100%;background:var(--ink);
  transform:scaleX(var(--loop-p,0));transform-origin:0 50%;
}
/* il pallino che viaggia da 01 a 04 */
.loop-dot{
  position:absolute;top:0;left:0;
  width:16px;height:16px;border-radius:50%;background:var(--lime);
  transform:translate3d(var(--dot-x,0px),var(--dot-y,0px),0) translate(-50%,-50%);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--lime) 22%,transparent);
  will-change:transform;
}
.loop-dot::after{
  content:'';position:absolute;inset:0;border-radius:50%;border:1px solid var(--lime);
  animation:dotPing 2.4s var(--e-out) infinite;
}
@keyframes dotPing{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.6);opacity:0}}

.loop-track article{
  position:relative;padding-top:1.4rem;
  opacity:.32;transition:opacity .6s var(--e-out),transform .6s var(--e-out);
  transform:translateY(8px);
}
.loop-pin{
  position:absolute;top:-4.5px;left:0;width:9px;height:9px;border-radius:50%;
  background:var(--paper-bright);border:1px solid var(--line-strong);
  transition:background .5s ease,border-color .5s ease,transform .5s var(--e-out);
}
.loop-track article.is-on{opacity:1;transform:none}
.loop-track article.is-on .loop-pin{background:var(--ink);border-color:var(--ink);transform:scale(1.25)}
.loop-track article>span{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--muted);
}
.loop-track h3{
  font-size:clamp(1.3rem,2.6vw,2.1rem);font-weight:560;letter-spacing:-.035em;margin-top:.5rem;
}
.loop-track p{color:var(--muted);font-size:.9rem;margin-top:.25rem}
.loop-copy{
  max-width:44ch;margin-top:clamp(2.4rem,5vw,3.6rem);
  color:var(--muted);font-size:var(--fs-lead);letter-spacing:-.012em;
}

/* smartphone: il binario diventa verticale e il pallino scende */
@media (max-width:720px){
  .loop-track{
    grid-template-columns:1fr;row-gap:1.6rem;
    padding-top:0;padding-left:2.1rem;
  }
  .loop-line{width:1px;height:var(--rail-h,100%)}
  .loop-line i{width:100%;height:100%;transform:scaleY(var(--loop-p,0));transform-origin:50% 0}
  .loop-dot{width:14px;height:14px}
  .loop-track article{padding-top:0}
  .loop-pin{top:.6rem;left:-2.1rem;transform:translate(-50%,-50%)}
  .loop-track article.is-on .loop-pin{transform:translate(-50%,-50%) scale(1.25)}
  .loop-track h3{margin-top:.15rem}
}

/* ═══ 09 · metodo ════════════════════════════════════════ */
.method{background:var(--paper);padding-block:var(--sec)}
.method-inner{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.method-side{position:sticky;top:clamp(6rem,14vh,9rem);display:flex;flex-direction:column;gap:1.2rem;align-items:flex-start}
.method-side h2 em{color:var(--business)}
.method-copy{color:var(--muted);max-width:32ch;font-size:var(--fs-lead)}
.method-steps{display:flex;flex-direction:column}
.method-steps li{
  position:relative;padding:clamp(1.6rem,3vw,2.4rem) 0;border-top:1px solid var(--line);
  display:grid;grid-template-columns:auto 1fr;gap:clamp(1rem,2.4vw,2.2rem);
  opacity:.35;transform:translateY(20px);
  transition:opacity .8s var(--e-out),transform .8s var(--e-out);
}
.method-steps li:last-child{border-bottom:1px solid var(--line)}
.method-steps li.is-in{opacity:1;transform:none}
.step-n{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;color:var(--muted);
  padding-top:.5em;
}
.method-steps h3{font-size:clamp(1.5rem,2.8vw,2.2rem);font-weight:560;letter-spacing:-.035em;margin-bottom:.5rem}
.method-steps p{color:var(--muted);max-width:46ch;line-height:1.55}
@media (max-width:860px){
  .method-inner{grid-template-columns:1fr;gap:2.4rem}
  .method-side{position:static}
}

/* ═══ 10 · corsi ══════════════════════════════════════════ */
.courses{background:var(--lime);color:var(--ink);overflow:hidden}
.courses-band{
  position:relative;display:grid;grid-template-columns:1.15fr .85fr;
  gap:clamp(1.8rem,4vw,4rem);align-items:center;
  padding:clamp(3.6rem,8vw,6.5rem) var(--pad);
  isolation:isolate;
}
.courses-band::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse at 18% 0%,rgba(250,249,245,.55),transparent 58%);
}
.courses-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1.05rem;max-width:min(92vw,700px)}
.courses-copy .eyebrow{color:rgba(17,17,15,.58)}
.courses-copy h2{font-size:clamp(2.2rem,5.8vw,4.8rem)}
.courses-lead{font-size:var(--fs-lead);color:rgba(17,17,15,.72);max-width:52ch;line-height:1.45}
.courses-cta{
  display:inline-flex;align-items:center;gap:.7em;margin-top:.5rem;
  padding:.85em 1.4em;border-radius:100px;background:var(--ink);color:var(--paper-bright);
  font-size:clamp(.86rem,1vw,1rem);font-weight:520;letter-spacing:-.015em;
  transition:background .45s var(--e-out),transform .5s var(--e-out);
}
.courses-cta i{font-style:normal;transition:transform .5s var(--e-out)}
.courses-band:hover .courses-cta{background:var(--business-deep);transform:translateY(-2px)}
.courses-band:hover .courses-cta i{transform:translate(3px,-3px)}

/* banco di scuola disegnato e animato */
.desk{position:relative;justify-self:center;width:100%;max-width:min(86vw,470px)}
.desk svg{width:100%;height:auto;display:block;overflow:visible}
.dk-floor{opacity:.28}
.dk-chair{opacity:.5}
.dk-bulb{fill:var(--paper-bright)}
.dk-glow{fill:var(--paper-bright);opacity:.28;animation:deskGlow 3.4s ease-in-out infinite}
@keyframes deskGlow{0%,100%{opacity:.16;transform:scale(.9)}50%{opacity:.42;transform:scale(1.12)}}
.dk-glow{transform-origin:86px 102px}

/* le righe si scrivono da sole, poi si cancellano */
.dk-line{stroke-dasharray:44;stroke-dashoffset:44;animation:deskWrite 5.4s var(--e-io) infinite}
.dk-line:nth-of-type(2){animation-delay:.45s}
.dk-line:nth-of-type(3){animation-delay:.9s}
@keyframes deskWrite{
  0%{stroke-dashoffset:44}
  28%,70%{stroke-dashoffset:0}
  92%,100%{stroke-dashoffset:-44}
}

/* le idee salgono */
.dk-dot{fill:var(--ink);opacity:0;animation:deskIdea 4.6s ease-out infinite}
.dk-dot-2{animation-delay:1.5s}
.dk-dot-3{animation-delay:2.9s}
@keyframes deskIdea{
  0%{opacity:0;transform:translateY(18px) scale(.4)}
  22%{opacity:.85}
  70%{opacity:.5}
  100%{opacity:0;transform:translateY(-42px) scale(1.15)}
}
.desk svg{transition:transform .8s var(--e-out)}
.courses-band:hover .desk svg{transform:translateY(-6px)}

@media (max-width:860px){
  .courses-band{grid-template-columns:1fr;justify-items:start;gap:2.2rem}
  .desk{max-width:min(78vw,330px);justify-self:center}
}
@media (prefers-reduced-motion:reduce){
  .dk-line{stroke-dashoffset:0;animation:none}
  .dk-dot{opacity:.5;animation:none}
  .dk-glow{animation:none;opacity:.3}
}

/* ═══ 11 · conversion ════════════════════════════════════ */
.conv{background:var(--paper);padding:var(--sec) var(--pad)}
.conv-head{max-width:min(92vw,700px);margin-bottom:clamp(2.6rem,5.5vw,4.2rem)}
.conv-head .eyebrow{margin-bottom:1rem}
.conv-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.conv-card{
  position:relative;display:flex;flex-direction:column;gap:.7rem;
  padding:clamp(1.4rem,2.6vw,2.2rem);border-radius:var(--r-lg);
  min-height:clamp(300px,34vw,400px);overflow:hidden;isolation:isolate;
  transition:transform .6s var(--e-out),box-shadow .6s var(--e-out);
  will-change:transform;
}
.conv-card::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.28),transparent 55%);
  opacity:0;transition:opacity .5s ease;
}
.conv-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px -30px rgba(17,17,15,.4)}
.conv-card:hover::after{opacity:1}
.conv-card span{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;opacity:.65}
.conv-card h3{
  font-size:clamp(1.7rem,3.2vw,2.6rem);font-weight:560;letter-spacing:-.04em;line-height:.98;
  margin-top:auto;
}
.conv-card p{font-size:.95rem;opacity:.72;max-width:30ch}
.conv-card strong{
  display:inline-flex;align-items:center;gap:.45em;font-weight:520;font-size:.92rem;
  padding-top:.9rem;border-top:1px solid currentColor;margin-top:.4rem;
}
.conv-card strong i{font-style:normal;transition:transform .5s var(--e-out)}
.conv-card:hover strong i{transform:translate(3px,-3px)}
.conv-lime{background:var(--lime);color:var(--ink)}
.conv-blue{background:var(--business);color:var(--paper-bright)}
.conv-paper{background:var(--coral);color:var(--ink)}
@media (max-width:860px){
  .conv-cards{grid-template-columns:1fr}
  .conv-card{min-height:auto}
  .conv-card h3{margin-top:1.2rem}
}

/* ═══ 11 · agency ════════════════════════════════════════ */
.agency{background:var(--paper);padding-block:0 var(--sec)}
.agency-top{
  display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,5rem);align-items:center;
  padding-block:var(--sec) clamp(2.6rem,6vw,4.5rem);
}
.agency-portrait{position:relative}
.portrait-frame{
  display:block;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;
}
.portrait-frame img{width:100%;height:112%;object-fit:cover;will-change:transform}
.agency-portrait figcaption{
  position:absolute;bottom:-.9rem;left:-.6rem;
  padding:.7em 1.1em;border-radius:100px;background:var(--ink);color:var(--paper-bright);
  font-size:.86rem;font-weight:520;line-height:1.25;
}
.agency-portrait figcaption em{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;opacity:.6;font-style:normal}
.agency-story{display:flex;flex-direction:column;gap:1.2rem;align-items:flex-start}
.agency-story .eyebrow{margin-bottom:.2rem}
.agency-story h2 em{color:var(--business)}
.agency-story>p{color:var(--muted);font-size:var(--fs-lead);max-width:44ch;line-height:1.45}

.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);
  border-top:1px solid var(--line);padding-top:clamp(1.6rem,3vw,2.4rem);
}
.stats article{display:flex;flex-direction:column;gap:.2rem}
.stats strong{
  font-size:clamp(2.4rem,6vw,4.6rem);font-weight:560;letter-spacing:-.05em;line-height:.9;
  font-variant-numeric:tabular-nums;
}
.stats span{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
@media (max-width:860px){
  .agency-top{grid-template-columns:1fr;gap:2.8rem}
  .agency-portrait{max-width:min(360px,72vw)}
  .stats{grid-template-columns:repeat(2,1fr);row-gap:1.8rem}
}

/* ═══ 12 · logo proof ════════════════════════════════════ */
.proof{background:var(--ink);color:var(--paper-bright);padding-block:var(--sec);overflow:hidden}
.proof::before{
  content:'';position:absolute;inset:auto -10% -30% -10%;height:60%;pointer-events:none;
  background:radial-gradient(ellipse at 50% 100%,rgba(41,70,92,.55),transparent 62%);
}
.proof-head{
  position:relative;z-index:2;max-width:min(94vw,760px);
  display:flex;flex-direction:column;gap:1rem;margin-bottom:clamp(2.4rem,5vw,4rem);
}
.proof-head .eyebrow{color:rgba(250,249,245,.55)}
.proof-head h2{max-width:min(100%,620px)}
.proof-head h2 em{color:var(--lime)}
.proof-head>p{color:rgba(250,249,245,.62);font-size:var(--fs-lead);max-width:48ch}

.logo-wall{
  position:relative;z-index:2;
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.5rem,1vw,.9rem);
}
.logo-wall div{
  display:grid;place-items:center;min-height:clamp(92px,10vw,132px);
  padding:clamp(1rem,2.4vw,2rem);border-radius:var(--r);
  background:rgba(250,249,245,.045);
  border:1px solid rgba(250,249,245,.09);
  transition:background .5s var(--e-out),border-color .5s ease,transform .55s var(--e-out);
}
.logo-wall div:hover{
  background:rgba(250,249,245,.09);border-color:rgba(229,213,2,.45);transform:translateY(-4px);
}
/* i marchi arrivano con proporzioni molto diverse: i lettering larghi
   si limitano in larghezza, i marchi quadrati possono crescere in altezza */
.logo-wall img{
  max-height:calc(var(--h,1) * clamp(24px,2.6vw,36px));
  max-width:calc(var(--w,1) * min(82%,220px));
  width:auto;object-fit:contain;
  opacity:.9;transition:opacity .45s ease,transform .55s var(--e-out);
}
.logo-wall img.logo-sq{max-height:calc(var(--h,1) * clamp(46px,5vw,64px));max-width:calc(var(--w,1) * 64%)}
.logo-wall img.logo-block{border-radius:4px}
.logo-wall div:hover img{opacity:1;transform:scale(1.07)}
@media (max-width:900px){.logo-wall{grid-template-columns:repeat(3,1fr)}}
@media (max-width:560px){.logo-wall{grid-template-columns:repeat(2,1fr)}}

/* ═══ 13 · news ══════════════════════════════════════════ */
.news{background:var(--paper);padding-bottom:var(--sec)}
.news .sec-head{align-items:end}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.news-card{display:flex;flex-direction:column;gap:.55rem}
.news-media{
  position:relative;display:block;border-radius:var(--r);overflow:hidden;aspect-ratio:16/11;
  margin-bottom:.5rem;
}
.news-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--e-out)}
.news-card:hover .news-media img{transform:scale(1.06)}
.news-media i{
  position:absolute;top:.8rem;left:.9rem;color:var(--paper-bright);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;font-style:normal;
  text-shadow:0 1px 12px rgba(17,17,15,.5);
}
.news-card>p{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;color:var(--business)}
.news-card h3{font-size:clamp(1.1rem,1.7vw,1.42rem);font-weight:520;letter-spacing:-.028em;line-height:1.18;text-wrap:balance}
.news-read{
  margin-top:auto;padding-top:.7rem;font-size:.85rem;color:var(--muted);
  transition:color .4s ease;
}
.news-card:hover .news-read{color:var(--ink)}
@media (max-width:860px){.news-grid{grid-template-columns:1fr;gap:2.2rem}}

/* ═══ 14 · contatti + footer ═════════════════════════════ */
.contact{
  background:var(--ink);color:var(--paper-bright);
  padding:var(--sec) var(--pad) clamp(1.6rem,3vw,2.4rem);
  overflow:hidden;
}
.contact-kicker{
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.5);padding-bottom:clamp(2rem,5vw,3.5rem);
  border-bottom:1px solid rgba(250,249,245,.14);
}
.contact-title{
  font-size:clamp(2.5rem,8.4vw,7.5rem);font-weight:580;letter-spacing:-.05em;line-height:.9;
  margin-block:clamp(2.2rem,6vw,4rem);max-width:16ch;
}
.contact-title em{font-weight:300;font-size:.54em;letter-spacing:-.03em;color:var(--lime)}
.contact-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:clamp(4rem,10vw,7rem)}

.foot{border-top:1px solid rgba(250,249,245,.14);padding-top:clamp(1.8rem,4vw,2.8rem)}
.foot-top{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--gap);align-items:start}
.foot-logo{width:clamp(120px,12vw,170px);opacity:.92}
.foot-top>p{color:rgba(250,249,245,.6);font-size:.92rem;line-height:1.5}
.foot-social{display:flex;flex-direction:column;gap:.4rem;align-items:flex-start}
.foot-social a{
  display:inline-flex;gap:.4em;font-size:.95rem;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;
  padding-bottom:.15em;transition:background-size .45s var(--e-out);
}
.foot-social a:hover{background-size:100% 1px}
.foot-social i{font-style:normal}
.foot-bottom{
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  margin-top:clamp(2.4rem,6vw,4rem);padding-top:1.2rem;
  border-top:1px solid rgba(250,249,245,.1);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;
  color:rgba(250,249,245,.42);
}
@media (max-width:720px){
  .foot-top{grid-template-columns:1fr;gap:1.6rem}
}

/* ═══════════════════════════════════════════════════════════
   PAGINA AGENZIA
   ═══════════════════════════════════════════════════════════ */
.ag-hero{
  position:relative;min-height:100svh;
  padding:clamp(6.5rem,13vh,9rem) var(--pad) clamp(2.5rem,6vh,4rem);
  display:flex;flex-direction:column;justify-content:space-between;gap:clamp(2rem,6vh,4rem);
  background:var(--ink);color:var(--paper-bright);overflow:hidden;
}
.ag-hero-bg{position:absolute;inset:0;overflow:hidden}
.ag-hero-video{
  width:100%;height:112%;object-fit:cover;
  transform:scale(1.04) translate3d(0,var(--bg-y,0px),0);
  will-change:transform;
}
.ag-hero-veil{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(17,17,15,.94) 0%,rgba(17,17,15,.78) 9%,rgba(17,17,15,.48) 32%,rgba(17,17,15,.72) 68%,rgba(17,17,15,.96) 100%),
    radial-gradient(ellipse at 78% 22%,rgba(41,70,92,.5),transparent 58%);
}
.ag-hero-top{
  position:relative;z-index:3;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center;
}
.ag-hero-top .eyebrow{color:rgba(250,249,245,.65)}
.ag-kicker{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
  color:rgba(250,249,245,.6);
}
.ag-kicker em{font-style:normal;color:var(--lime)}
.ag-title{
  position:relative;z-index:3;
  font-size:clamp(2.1rem,5.4vw,4.6rem);font-weight:600;letter-spacing:-.045em;line-height:.96;
  max-width:min(94vw,1180px);
  text-shadow:0 6px 60px rgba(17,17,15,.45);
}
.ag-title em{font-weight:300;color:var(--lime);font-size:.55em;letter-spacing:-.03em}
/* le righe del titolo entrano ruotando in 3D */
.ag-title .line{perspective:800px}
.ag-title .ln{transform:translate3d(0,110%,0) rotateX(-55deg);transform-origin:50% 0}
.ag-title.is-in .ln{
  transform:translate3d(0,0,0) rotateX(0);
  transition:transform 1.15s var(--e-out),opacity .8s ease;
}
.ag-hero-bottom{
  position:relative;z-index:3;
  display:flex;justify-content:space-between;align-items:flex-end;gap:var(--gap);flex-wrap:wrap;
}
.ag-hero-bottom>p{max-width:44ch;font-size:var(--fs-lead);color:rgba(250,249,245,.72);line-height:1.45;letter-spacing:-.012em}
.btn-round-light{border-color:rgba(250,249,245,.34);color:var(--paper-bright)}
.btn-round-light:hover{background:var(--paper-bright);color:var(--ink)}
.ag-hero-meta{
  position:absolute;right:var(--pad);top:42vh;z-index:3;
  display:flex;flex-direction:column;gap:.9rem;text-align:right;
  padding-right:1rem;border-right:1px solid rgba(250,249,245,.22);
}
.ag-hero-meta li{display:flex;flex-direction:column;gap:.1rem}
.ag-hero-meta strong{font-size:clamp(1rem,1.5vw,1.35rem);font-weight:560;letter-spacing:-.035em;color:var(--lime)}
.ag-hero-meta span{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.55);
}
@media (min-width:1101px){
  /* il titolo si ferma prima della colonna dei numeri */
  .ag-title{max-width:min(75vw,1085px)}
}
@media (max-width:1100px){.ag-hero-meta{display:none}}
@media (max-width:860px){
  .ag-hero-bottom{flex-direction:column;align-items:flex-start;gap:1.6rem}
}


/* ── strato interattivo sopra il video ── */
.chips{position:absolute;inset:0;z-index:2;pointer-events:none}
.chip{
  position:absolute;left:var(--cx);top:var(--cy);
  padding:.5em 1em;border-radius:100px;
  font-family:var(--mono);font-size:clamp(.6rem,.78vw,.76rem);
  letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
  color:rgba(250,249,245,.92);
  background:rgba(250,249,245,.08);border:1px solid rgba(250,249,245,.22);
  backdrop-filter:blur(10px) saturate(1.4);-webkit-backdrop-filter:blur(10px) saturate(1.4);
  transform:translate3d(calc(-50% + var(--mx,0px)),calc(-50% + var(--my,0px)),0);
  opacity:0;transition:opacity .8s var(--e-out) .6s;
  pointer-events:auto;cursor:default;
  will-change:transform;
}
body.is-ready .chip{opacity:1}
.chip:hover{background:rgba(250,249,245,.18);border-color:rgba(250,249,245,.5)}
.chip-lime{background:rgba(229,213,2,.9);border-color:transparent;color:var(--ink)}
.chip-lime:hover{background:var(--lime)}
@media (max-width:860px){
  .chip{font-size:.58rem;padding:.42em .8em}
  .chip:nth-child(4),.chip:nth-child(6){display:none}
}

.ag-hero-live{
  position:absolute;left:var(--pad);bottom:clamp(1rem,3vh,1.8rem);z-index:3;
  display:flex;align-items:center;gap:.5rem;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;text-transform:uppercase;
  color:rgba(250,249,245,.55);
}
.ag-hero-live i{
  width:7px;height:7px;border-radius:50%;background:var(--lime);
  animation:livePulse 2s ease-in-out infinite;
}
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.75)}}
@media (max-width:860px){.ag-hero-live{display:none}}

/* ── strumenti: icone che si compongono scendendo ── */
.tools{height:210vh;background:var(--ink);color:var(--paper-bright)}
.tools-sticky{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:grid;place-items:center;padding:var(--pad);
}
.tools-field{position:absolute;inset:0;z-index:1;pointer-events:none}
.tool{
  position:absolute;left:var(--tx);top:var(--ty);
  width:var(--ts);height:var(--ts);
  transform:
    translate3d(calc(-50% + var(--mx,0px)), calc(-50% + var(--my,0px) + (1 - var(--tp,0)) * 90px), 0)
    scale(calc(.62 + var(--tp,0) * .38))
    rotate(calc((1 - var(--tp,0)) * var(--rot,12deg)));
  opacity:calc(var(--tp,0) * .96);
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.45));
  will-change:transform;
  pointer-events:auto;
  transition:filter .4s ease;
}
.tool svg{width:100%;height:100%;display:block;border-radius:22%}
.tool:hover{filter:drop-shadow(0 26px 44px rgba(0,0,0,.6)) brightness(1.08)}
.tool:nth-child(odd){--rot:-14deg}
.tool:nth-child(even){--rot:16deg}

.tools-copy{
  position:relative;z-index:5;text-align:center;max-width:min(90vw,720px);
  display:flex;flex-direction:column;gap:1rem;align-items:center;
}
.tools-copy .eyebrow{justify-content:center;color:rgba(250,249,245,.5)}
.tools-copy h2{font-size:clamp(1.9rem,4.4vw,3.6rem)}
.tools-copy h2 em{color:var(--lime)}
.tools-copy>p{
  color:rgba(250,249,245,.6);max-width:46ch;font-size:var(--fs-body);
  opacity:calc(var(--tp,0) * 1);
}
@media (max-width:860px){
  .tools{height:190vh}
  .tool{--ts:clamp(46px,13vw,66px) !important}
  /* su telefono le icone stanno in due fasce: sopra e sotto il testo */
  .tool:nth-child(1){--tx:12% !important;--ty:84% !important}
  .tool:nth-child(2){--tx:86% !important;--ty:12% !important}
  .tool:nth-child(3){--tx:62% !important;--ty:11% !important}
  .tool:nth-child(4){--tx:8% !important;--ty:15% !important}
  .tool:nth-child(5){--tx:14% !important;--ty:10% !important}
  .tool:nth-child(6){--tx:90% !important;--ty:28% !important}
  .tool:nth-child(7){--tx:36% !important;--ty:88% !important}
  .tool:nth-child(8){--tx:62% !important;--ty:86% !important}
  .tool:nth-child(9){--tx:88% !important;--ty:82% !important}
  .tool:nth-child(10){--tx:38% !important;--ty:10% !important}
}

/* approccio */
.ag-approach{background:var(--paper);padding-bottom:var(--sec)}
.ag-approach-body{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:center;
}
.ag-shot{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3}
.ag-shot img{width:100%;height:112%;object-fit:cover;will-change:transform}
.ag-approach-text{display:flex;flex-direction:column;align-items:flex-start;gap:1.2rem}
.ag-lead{
  font-size:clamp(1.25rem,2.3vw,1.9rem);font-weight:500;letter-spacing:-.03em;line-height:1.2;
  max-width:26ch;
}
.ag-approach-text p:not(.ag-lead){color:var(--muted);max-width:46ch;line-height:1.6}
.ag-approach-text strong{color:var(--ink);font-weight:560}
@media (max-width:860px){.ag-approach-body{grid-template-columns:1fr;gap:2rem}}

/* servizi in griglia */
.ag-services{background:var(--paper);padding-bottom:var(--sec)}
.ag-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);
  margin-bottom:clamp(3rem,7vw,5rem);
}
.ag-card{
  position:relative;display:flex;flex-direction:column;gap:.5rem;
  padding:clamp(1.4rem,2.6vw,2.2rem);border-radius:var(--r-lg);
  min-height:clamp(180px,20vw,250px);
  background:var(--paper-bright);border:1px solid var(--line);
  isolation:isolate;overflow:hidden;
  transition:transform .6s var(--e-out),color .45s ease,border-color .45s ease;
}
.ag-card::after{
  content:'';position:absolute;inset:0;z-index:-1;background:var(--ink);
  transform:translate3d(0,101%,0);transition:transform .6s var(--e-out);
}
.ag-card:hover{transform:translateY(-6px);color:var(--paper-bright);border-color:var(--ink)}
.ag-card:hover::after{transform:none}
.ag-card-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--muted);transition:color .4s}
.ag-card:hover .ag-card-n{color:var(--lime)}
.ag-card h3{
  font-size:clamp(1.3rem,2.2vw,1.75rem);font-weight:560;letter-spacing:-.032em;line-height:1.05;margin-top:auto;
}
.ag-card p{font-size:.92rem;color:var(--muted);max-width:32ch;transition:color .4s}
.ag-card:hover p{color:rgba(250,249,245,.62)}
.ag-card i{
  position:absolute;top:clamp(1.1rem,2vw,1.6rem);right:clamp(1.1rem,2vw,1.6rem);
  font-style:normal;transition:transform .5s var(--e-out);
}
.ag-card:hover i{transform:translate(3px,-3px)}
@media (max-width:900px){.ag-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.ag-grid{grid-template-columns:1fr}}

/* DNA */
.ag-dna{background:var(--paper);padding:var(--sec) var(--pad)}
.ag-dna .conv-card{min-height:clamp(260px,30vw,340px);cursor:default}
.ag-dna .conv-card:hover{transform:none;box-shadow:none}
.ag-dna .conv-card h3{margin-top:auto}

/* founder */
.ag-founder{
  background:var(--business-deep);color:var(--paper-bright);
  padding:var(--sec) var(--pad);overflow:hidden;
}
.ag-founder-head{margin-bottom:clamp(2.4rem,5vw,3.6rem)}
.ag-founder-head .eyebrow{color:rgba(250,249,245,.55);margin-bottom:1rem}
.ag-founder-name{font-size:clamp(3rem,10vw,9rem);letter-spacing:-.055em;line-height:.86}
.ag-founder-name em{color:var(--lime)}
.ag-founder-body{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.ag-portrait{position:relative}
.ag-portrait .portrait-frame{aspect-ratio:4/5}
.ag-portrait figcaption{
  position:absolute;bottom:-.9rem;left:-.6rem;
  padding:.6em 1.05em;border-radius:100px;background:var(--lime);color:var(--ink);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;
}
.ag-bio{display:flex;flex-direction:column;gap:1.2rem}
.ag-bio .ag-lead{color:var(--paper-bright);max-width:24ch}
.ag-bio>p:not(.ag-lead){color:rgba(250,249,245,.68);max-width:52ch;line-height:1.6}
.ag-facts{display:grid;gap:0;margin-top:.6rem;border-top:1px solid rgba(250,249,245,.16)}
.ag-facts li{
  display:grid;grid-template-columns:minmax(120px,.35fr) 1fr;gap:1rem;align-items:baseline;
  padding-block:clamp(.9rem,1.8vw,1.3rem);border-bottom:1px solid rgba(250,249,245,.16);
}
.ag-facts strong{
  font-size:clamp(1.1rem,1.9vw,1.5rem);font-weight:560;letter-spacing:-.03em;color:var(--lime);
}
.ag-facts span{color:rgba(250,249,245,.7);font-size:.95rem;line-height:1.45}
@media (max-width:860px){
  .ag-founder-body{grid-template-columns:1fr;gap:2.6rem}
  .ag-portrait{max-width:min(340px,70vw)}
  .ag-facts li{grid-template-columns:1fr;gap:.2rem}
}

/* storytelling */
.ag-story{
  background:var(--business-deep);color:var(--paper-bright);
  padding:0 var(--pad) var(--sec);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;
}
.ag-story-media{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/2}
.ag-story-media img{width:100%;height:114%;object-fit:cover;object-position:62% 50%;will-change:transform}
.ag-story-tag{
  position:absolute;left:1.1rem;bottom:1.1rem;
  padding:.55em 1em;border-radius:100px;background:var(--lime);color:var(--ink);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
}
.ag-story-copy{display:flex;flex-direction:column;gap:1.1rem}
.ag-story-copy .eyebrow{color:rgba(250,249,245,.55)}
.ag-story-copy h2 em{color:var(--lime)}
.ag-story-copy>p{color:rgba(250,249,245,.7);max-width:48ch;line-height:1.6}
.ag-story-copy strong{color:var(--paper-bright);font-weight:560}
.ag-timeline{margin-top:.6rem;display:flex;flex-direction:column}
.ag-timeline li{
  display:grid;grid-template-columns:minmax(88px,.28fr) 1fr;gap:1rem;
  padding-block:clamp(.9rem,1.6vw,1.2rem);border-top:1px solid rgba(250,249,245,.16);
}
.ag-timeline li:last-child{border-bottom:1px solid rgba(250,249,245,.16)}
.ag-timeline span{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
  color:var(--lime);padding-top:.25em;
}
.ag-timeline p{color:rgba(250,249,245,.72);line-height:1.55;font-size:.96rem}
@media (max-width:860px){
  .ag-story{grid-template-columns:1fr;padding-top:0}
  .ag-timeline li{grid-template-columns:1fr;gap:.25rem}
}

/* premiazione */
.ag-award{
  background:var(--paper-bright);padding-block:var(--sec);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;
}
.ag-award-media{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/2;background:var(--paper)}
.ag-award-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--e-out)}
.ag-award-media:hover img{transform:scale(1.04)}
.ag-award-copy{display:flex;flex-direction:column;gap:1.1rem}
.ag-award-copy h2 em{color:var(--business)}
.ag-award-copy>p{color:var(--muted);max-width:46ch;line-height:1.6}
.ag-award-copy blockquote{
  border-left:2px solid var(--lime);padding:.4rem 0 .4rem 1.2rem;
  font-weight:300;font-size:clamp(1rem,1.5vw,1.24rem);line-height:1.55;letter-spacing:-.02em;
}
.ag-award-copy cite{
  display:block;margin-top:.7rem;font-family:var(--mono);font-style:normal;
  font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}
@media (max-width:860px){.ag-award{grid-template-columns:1fr}}

/* certificazioni */
.ag-certs{background:var(--paper);padding-bottom:var(--sec)}
.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.cert-grid article{
  display:flex;flex-direction:column;gap:.6rem;align-items:flex-start;
  padding:clamp(1.4rem,2.6vw,2rem);border-radius:var(--r);
  background:var(--paper-bright);border:1px solid var(--line);
  transition:border-color .45s ease,transform .55s var(--e-out);
}
.cert-grid article:hover{border-color:var(--line-strong);transform:translateY(-4px)}
.cert-grid img{height:clamp(46px,5vw,62px);width:auto;object-fit:contain;margin-bottom:.4rem}
.cert-grid h3{font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:560;letter-spacing:-.028em}
.cert-grid p{font-size:.88rem;color:var(--muted);line-height:1.5}
@media (max-width:860px){.cert-grid{grid-template-columns:1fr}}

/* lista clienti */
.ag-clients{background:var(--paper);padding-bottom:var(--sec)}
.ag-clients-head{margin-bottom:clamp(1.8rem,4vw,2.8rem)}
.ag-clients-head .eyebrow{margin-bottom:1rem}
.ag-clients-head h2 em{color:var(--business)}
.ag-clients-head{text-align:center}
.ag-clients-head .eyebrow{justify-content:center}
.ag-clients-list{
  max-width:min(78%,760px);margin-inline:auto;text-align:center;
  font-size:clamp(1rem,1.3vw,1.18rem);line-height:2;color:var(--muted);
  letter-spacing:-.005em;text-wrap:pretty;
  border-top:1px solid var(--line);padding-top:clamp(1.6rem,3.4vw,2.6rem);
}
@media (max-width:860px){.ag-clients-list{max-width:100%;line-height:1.9}}

.ag-contact-copy{
  color:rgba(250,249,245,.6);font-size:var(--fs-lead);max-width:40ch;
  margin-top:-1rem;margin-bottom:clamp(1.8rem,4vw,2.6rem);
}


/* ═══════════════════════════════════════════════════════════
   PAGINA CONTATTI
   ═══════════════════════════════════════════════════════════ */
.ct-hero{
  position:relative;min-height:78svh;
  padding:clamp(7rem,15vh,10rem) var(--pad) clamp(3rem,7vh,4.5rem);
  display:flex;flex-direction:column;justify-content:space-between;gap:clamp(2rem,6vh,4rem);
  background:var(--paper);overflow:hidden;
}
.ct-hero-top{position:relative;z-index:3;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center}
.ct-kicker{color:var(--muted)}
.ct-kicker em{color:var(--business)}
.ct-title{
  position:relative;z-index:3;
  font-size:clamp(3.4rem,13vw,11rem);font-weight:600;letter-spacing:-.055em;line-height:.86;
}
.ct-hero-bottom{
  position:relative;z-index:3;
  display:flex;justify-content:space-between;align-items:flex-end;gap:var(--gap);flex-wrap:wrap;
}
.ct-hero-bottom>p{max-width:48ch;font-size:var(--fs-lead);color:var(--muted);line-height:1.45;letter-spacing:-.012em}
@media (max-width:860px){.ct-hero-bottom{flex-direction:column;align-items:flex-start;gap:1.6rem}}

/* canali diretti */
.ct-channels{background:var(--paper);padding-bottom:var(--sec)}
.ct-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.ct-card{
  position:relative;display:flex;flex-direction:column;gap:.35rem;
  padding:clamp(1.5rem,2.8vw,2.4rem);border-radius:var(--r-lg);
  min-height:clamp(200px,22vw,270px);
  background:var(--paper-bright);border:1px solid var(--line);
  isolation:isolate;overflow:hidden;
  transition:transform .6s var(--e-out),color .45s ease,border-color .45s ease;
}
.ct-card::after{
  content:'';position:absolute;inset:0;z-index:-1;background:var(--ink);
  transform:translate3d(0,101%,0);transition:transform .6s var(--e-out);
}
.ct-card:hover{transform:translateY(-6px);color:var(--paper-bright);border-color:var(--ink)}
.ct-card:hover::after{transform:none}
.ct-card-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--muted);transition:color .4s}
.ct-card:hover .ct-card-n{color:var(--lime)}
.ct-card h2{font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:560;letter-spacing:-.035em;margin-top:auto}
.ct-card p{font-size:clamp(1rem,1.4vw,1.15rem);font-weight:500;letter-spacing:-.02em}
.ct-card small{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.08em;color:var(--muted);transition:color .4s}
.ct-card:hover small{color:rgba(250,249,245,.6)}
.ct-card i{position:absolute;top:clamp(1.3rem,2.2vw,1.8rem);right:clamp(1.3rem,2.2vw,1.8rem);font-style:normal;transition:transform .5s var(--e-out)}
.ct-card:hover i{transform:translate(3px,-3px)}
.ct-card-lime{background:var(--lime);border-color:transparent}
.ct-card-lime .ct-card-n,.ct-card-lime small{color:rgba(17,17,15,.6)}
@media (max-width:900px){.ct-grid{grid-template-columns:1fr}}

/* mappa */
.ct-place{background:var(--paper);padding-bottom:var(--sec)}
.ct-map-wrap{
  position:relative;margin-inline:var(--pad);
  display:grid;grid-template-columns:1.55fr .95fr;gap:var(--gap);align-items:stretch;
}
.ct-map{
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  min-height:clamp(320px,52vh,540px);background:var(--paper-bright);
  border:1px solid var(--line);
}
.ct-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.28) contrast(1.04)}
.ct-place-card{
  display:flex;flex-direction:column;gap:.9rem;
  padding:clamp(1.5rem,2.8vw,2.4rem);border-radius:var(--r-lg);
  background:var(--ink);color:var(--paper-bright);
}
.ct-pin{
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:rgba(229,213,2,.16);margin-bottom:.2rem;
}
.ct-pin i{width:11px;height:11px;border-radius:50%;background:var(--lime);animation:livePulse 2.2s ease-in-out infinite}
.ct-place-label{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;text-transform:uppercase;color:rgba(250,249,245,.5)}
.ct-place-card h3{font-size:clamp(1.4rem,2.4vw,2rem);font-weight:560;letter-spacing:-.035em}
.ct-place-card address{font-style:normal;color:rgba(250,249,245,.72);line-height:1.6}
.ct-place-meta{display:flex;flex-direction:column;gap:.55rem;margin-top:.3rem;padding-top:1rem;border-top:1px solid rgba(250,249,245,.16)}
.ct-place-meta>div{display:flex;justify-content:space-between;gap:1rem;align-items:baseline}
.ct-place-meta dt{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;color:rgba(250,249,245,.45)}
.ct-place-meta dd{font-size:.95rem}
.ct-place-meta a{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;padding-bottom:.1em;transition:background-size .45s var(--e-out)}
.ct-place-meta a:hover{background-size:100% 1px}
.ct-place-actions{display:flex;flex-direction:column;gap:.9rem;align-items:flex-start;margin-top:auto;padding-top:1.2rem}
.ct-place-actions .btn-ink{background:var(--lime);color:var(--ink)}
.ct-place-actions .btn-ink::after{background:var(--paper-bright)}
.ct-place-actions .link-under{font-size:.9rem;color:rgba(250,249,245,.7)}
@media (max-width:900px){
  .ct-map-wrap{grid-template-columns:1fr}
  .ct-map{min-height:340px}
}

/* mondo */
.ct-world{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad);overflow:hidden}
.ct-world-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.ct-world-copy{display:flex;flex-direction:column;gap:1.1rem;align-items:flex-start}
.ct-world-copy .eyebrow{color:rgba(250,249,245,.55)}
.ct-world-copy h2 em{color:var(--lime)}
.ct-world-copy>p{color:rgba(250,249,245,.68);max-width:50ch;line-height:1.6}
.ct-world-facts{
  display:flex;flex-wrap:wrap;gap:0;width:100%;margin-top:.4rem;
  border-top:1px solid rgba(250,249,245,.16);
}
.ct-world-facts li{
  flex:1 1 140px;display:flex;flex-direction:column;gap:.15rem;
  padding:1rem 0;border-bottom:1px solid rgba(250,249,245,.16);
}
.ct-world-facts strong{font-size:clamp(1rem,1.5vw,1.25rem);font-weight:560;letter-spacing:-.03em;color:var(--lime)}
.ct-world-facts span{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;color:rgba(250,249,245,.55)}

.ct-globe{position:relative;aspect-ratio:1;width:100%;max-width:min(90vw,620px);justify-self:center}
.ct-globe canvas{width:100%;height:100%;display:block;touch-action:pan-y}
.ct-globe-hint{
  position:absolute;left:50%;bottom:-.4rem;transform:translateX(-50%);
  font-family:var(--mono);font-size:9px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(250,249,245,.4);white-space:nowrap;
}
@media (max-width:900px){
  .ct-world-inner{grid-template-columns:1fr;gap:2.6rem}
  .ct-globe{max-width:min(86vw,440px)}
}

/* modulo */
.ct-form-sec{background:var(--paper);padding-bottom:var(--sec)}
.ct-form{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.6rem)}
.fld{display:flex;flex-direction:column;gap:.45rem}
.fld-wide{grid-column:1 / -1}
.fld label{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}
.fld label em{color:var(--business);font-style:normal}
.fld input,.fld select,.fld textarea{
  width:100%;padding:.95em 1.1em;border-radius:14px;
  background:var(--paper-bright);border:1px solid var(--line);
  font-size:1rem;color:var(--ink);
  transition:border-color .35s ease,background .35s ease,box-shadow .35s ease;
}
.fld textarea{resize:vertical;min-height:130px;line-height:1.55}
.fld input:focus,.fld select:focus,.fld textarea:focus{
  outline:none;border-color:var(--ink);background:#fff;
  box-shadow:0 0 0 4px rgba(229,213,2,.28);
}
.fld input::placeholder,.fld textarea::placeholder{color:rgba(104,103,95,.6)}
.fld.is-bad input,.fld.is-bad textarea{border-color:#c0392b}
.ct-form-foot{
  grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;gap:var(--gap);
  flex-wrap:wrap;padding-top:.6rem;
}
.ct-form-foot p{font-size:.86rem;color:var(--muted);max-width:52ch}
.ct-form-note{
  grid-column:1 / -1;font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.1em;
  color:var(--business);min-height:1.2em;
}
@media (max-width:720px){.ct-form{grid-template-columns:1fr}}


/* ═══════════════════════════════════════════════════════════
   PAGINA MARKETING + AI
   ═══════════════════════════════════════════════════════════ */
.mk-hero{
  position:relative;min-height:100svh;
  padding:clamp(6.5rem,13vh,9rem) var(--pad) clamp(2.5rem,6vh,4rem);
  display:flex;flex-direction:column;justify-content:space-between;gap:clamp(1.6rem,4vh,3rem);
  background:var(--ink);color:var(--paper-bright);overflow:hidden;
}
.mk-field{position:absolute;inset:0;width:100%;height:100%;display:block}
.mk-hero-veil{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse at 22% 42%,rgba(41,70,92,.5),transparent 58%),
    linear-gradient(180deg,rgba(17,17,15,.86),rgba(17,17,15,.35) 42%,rgba(17,17,15,.92));
}
.mk-hero-top{
  position:relative;z-index:3;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center;
}
.mk-hero-top .eyebrow{color:rgba(250,249,245,.6)}
.mk-hero-body{
  position:relative;z-index:3;
  display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;
}
.mk-title{
  font-size:clamp(2.6rem,7vw,6.4rem);font-weight:620;letter-spacing:-.055em;line-height:.9;
}
.mk-title em{color:var(--lime);font-weight:300;font-size:.62em;letter-spacing:-.03em}
.mk-hero-bottom{
  position:relative;z-index:3;
  display:flex;justify-content:space-between;align-items:flex-end;gap:var(--gap);flex-wrap:wrap;
}
.mk-hero-bottom>p{max-width:50ch;font-size:var(--fs-lead);color:rgba(250,249,245,.7);line-height:1.45}
@media (max-width:960px){
  .mk-hero-body{grid-template-columns:1fr;gap:1.8rem}
  .mk-hero-bottom{flex-direction:column;align-items:flex-start;gap:1.5rem}
}

/* terminale */
.mk-term{
  border-radius:16px;overflow:hidden;
  background:rgba(10,10,9,.72);border:1px solid rgba(250,249,245,.14);
  backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 30px 70px -35px rgba(0,0,0,.9);
}
.mk-term-bar{
  display:flex;align-items:center;gap:.45rem;
  padding:.7rem .9rem;border-bottom:1px solid rgba(250,249,245,.12);
}
.mk-term-bar i{width:9px;height:9px;border-radius:50%;background:rgba(250,249,245,.22)}
.mk-term-bar i:first-child{background:rgba(229,213,2,.8)}
.mk-term-bar b{
  margin-left:.6rem;font-family:var(--mono);font-weight:400;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(250,249,245,.42);
}
.mk-term-out{
  margin:0;padding:1.1rem 1.1rem 1.4rem;
  font-family:var(--mono);font-weight:300;
  font-size:clamp(.68rem,.95vw,.86rem);line-height:1.85;
  color:var(--paper-bright);white-space:pre-wrap;word-break:break-word;
  min-height:12.5em;
}
.mk-term-out .dim{color:rgba(250,249,245,.55)}
.mk-term-out .ok{color:var(--lime)}
.mk-term-out .cur{color:var(--lime);font-weight:400;animation:blink 1s steps(2) infinite}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}

/* claim che si accende parola per parola */
.mk-claim{background:var(--paper-bright);padding:var(--sec) var(--pad)}
.mk-claim-text{
  max-width:min(94vw,1100px);margin-inline:auto;text-align:center;
  font-size:clamp(1.5rem,3.9vw,3.2rem);font-weight:500;letter-spacing:-.038em;line-height:1.18;
  text-wrap:balance;
}
.mk-claim-text .hw{color:rgba(17,17,15,.16);transition:color .5s ease}
.mk-claim-text .hw.on{color:var(--ink)}
.mk-claim-text b{font-weight:500}
.mk-claim-text .hw.on.key{color:var(--business)}

/* approccio */
.mk-approach{background:var(--paper);padding-bottom:var(--sec)}
.mk-approach-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.mk-approach-grid article{
  display:flex;flex-direction:column;gap:.55rem;
  padding:clamp(1.5rem,2.6vw,2.2rem);border-radius:var(--r-lg);
  background:var(--paper-bright);border:1px solid var(--line);
}
.mk-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--muted)}
.mk-approach-grid h3{font-size:clamp(1.25rem,2vw,1.6rem);font-weight:560;letter-spacing:-.032em;margin-top:.3rem}
.mk-approach-grid p{color:var(--muted);line-height:1.6;font-size:.96rem}
@media (max-width:900px){.mk-approach-grid{grid-template-columns:1fr}}

/* funnel */
.mk-funnel{height:250vh;background:var(--business-deep);color:var(--paper-bright)}
.mk-funnel-sticky{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;gap:clamp(1.4rem,4vh,2.6rem);
  padding:clamp(5rem,11vh,7rem) var(--pad) clamp(2rem,5vh,3rem);
}
.mk-funnel-head .eyebrow{color:rgba(250,249,245,.55);margin-bottom:.8rem}
.mk-funnel-head h2 em{color:var(--lime)}
.mk-stages{display:flex;flex-direction:column;gap:clamp(.5rem,1.4vh,1rem);width:100%}
.mk-stage{
  position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:1rem;
  padding:clamp(.7rem,1.8vh,1.15rem) clamp(1rem,2vw,1.6rem);
  border-radius:12px;isolation:isolate;
  width:var(--w);max-width:100%;
}
.mk-stage-bar{
  position:absolute;inset:0;z-index:-1;border-radius:12px;
  background:linear-gradient(90deg,rgba(229,213,2,.92),rgba(229,213,2,.5));
  transform:scaleX(var(--p,0));transform-origin:0 50%;
}
.mk-stage-lbl{display:flex;flex-direction:column;gap:.05rem;opacity:var(--p,0)}
.mk-stage-lbl b{
  font-size:clamp(.95rem,1.7vw,1.35rem);font-weight:560;letter-spacing:-.03em;color:var(--ink);
}
.mk-stage-lbl i{
  font-style:normal;font-family:var(--mono);font-size:var(--fs-micro);
  letter-spacing:.1em;color:rgba(17,17,15,.6);
}
.mk-stage-val{
  font-family:var(--mono);font-size:clamp(.8rem,1.3vw,1.05rem);color:var(--ink);
  font-variant-numeric:tabular-nums;opacity:var(--p,0);
}
.mk-stage-end .mk-stage-bar{background:linear-gradient(90deg,var(--paper-bright),rgba(250,249,245,.72))}
.mk-funnel-note{
  color:rgba(250,249,245,.6);max-width:52ch;font-size:var(--fs-body);
}
@media (max-width:640px){
  .mk-funnel{height:220vh}
  .mk-stage{padding:.7rem .9rem}
  .mk-stage-lbl i{display:none}
}
/* portatili con schermo basso: il funnel si compatta invece di tagliarsi */
@media (max-height:820px){
  .mk-funnel-sticky{padding-top:clamp(4rem,9vh,5.5rem);gap:clamp(.7rem,2vh,1.3rem)}
  .mk-funnel-head h2{font-size:clamp(1.6rem,3.2vw,2.5rem)}
  .mk-funnel-head .eyebrow{margin-bottom:.5rem}
  .mk-stage{padding-block:clamp(.45rem,1.1vh,.75rem)}
  .mk-funnel-note{font-size:.88rem}
}

/* canali */
.mk-channels{background:var(--paper);padding-bottom:var(--sec)}

/* statement lime */
.mk-money{background:var(--lime);color:var(--ink);padding:var(--sec) var(--pad);overflow:hidden}
.mk-money-inner{max-width:min(94vw,1080px);display:flex;flex-direction:column;gap:1.2rem}
.mk-money .eyebrow{color:rgba(17,17,15,.6)}
.mk-money h2{font-size:clamp(1.9rem,5vw,4.2rem)}
.mk-money h2 em{color:var(--business-deep)}

/* faq */
.mk-faq{background:var(--paper-bright);padding-bottom:var(--sec)}
.faq{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{
  list-style:none;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:1.5rem;
  padding:clamp(1.1rem,2.4vw,1.7rem) 0;
  font-size:clamp(1.05rem,1.9vw,1.5rem);font-weight:520;letter-spacing:-.028em;
  transition:color .35s ease;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--business)}
.faq-item summary i{
  position:relative;flex:0 0 auto;width:clamp(30px,2.6vw,38px);aspect-ratio:1;border-radius:50%;
  border:1px solid var(--line-strong);
  transition:background .4s var(--e-out),border-color .4s,transform .5s var(--e-out);
}
.faq-item summary i::before,.faq-item summary i::after{
  content:'';position:absolute;inset:0;margin:auto;background:currentColor;
  width:11px;height:1.5px;transition:transform .45s var(--e-out);
}
.faq-item summary i::after{transform:rotate(90deg)}
.faq-item[open] summary i{background:var(--ink);border-color:var(--ink);color:var(--paper-bright);transform:rotate(180deg)}
.faq-item[open] summary i::after{transform:rotate(0)}
.faq-body{overflow:hidden;padding-bottom:clamp(1.1rem,2.2vw,1.6rem)}
.faq-body p{color:var(--muted);max-width:70ch;line-height:1.65;font-size:var(--fs-body)}
.faq-item[open] .faq-body{animation:faqIn .5s var(--e-out)}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}


/* ═══════════════════════════════════════════════════════════
   PAGINA SOCIAL MEDIA
   ═══════════════════════════════════════════════════════════ */
.sm-hero{
  position:relative;min-height:100svh;
  padding:clamp(6.5rem,13vh,9rem) var(--pad) clamp(2.5rem,6vh,4rem);
  display:flex;flex-direction:column;justify-content:space-between;gap:clamp(1.6rem,4vh,3rem);
  background:var(--ink);color:var(--paper-bright);overflow:hidden;
}
.sm-hero-glow{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 55% at 78% 40%,rgba(41,70,92,.65),transparent 62%),
    radial-gradient(ellipse 45% 40% at 8% 78%,rgba(229,213,2,.16),transparent 60%);
}
.sm-hero-top{position:relative;z-index:3;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center}
.sm-hero-top .eyebrow{color:rgba(250,249,245,.6)}
.sm-hero-body{
  position:relative;z-index:3;
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center;
}
.sm-hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1.3rem}
.sm-title{font-size:clamp(2.9rem,8.4vw,7.2rem);font-weight:620;letter-spacing:-.055em;line-height:.9}
.sm-title em{color:var(--lime);font-weight:300;font-size:.72em;letter-spacing:-.035em}
.sm-lead{font-size:var(--fs-lead);color:rgba(250,249,245,.72);max-width:46ch;line-height:1.45}
.sm-hero-meta{
  position:relative;z-index:3;display:flex;flex-wrap:wrap;gap:0;
  border-top:1px solid rgba(250,249,245,.16);
}
.sm-hero-meta li{
  flex:1 1 130px;display:flex;flex-direction:column;gap:.1rem;padding:1rem 0;
}
.sm-hero-meta strong{font-size:clamp(1.3rem,2.4vw,2rem);font-weight:560;letter-spacing:-.04em;color:var(--lime)}
.sm-hero-meta span{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;color:rgba(250,249,245,.55)}

/* pila di post che segue il mouse */
.sm-stack{position:relative;aspect-ratio:5/4;width:100%}
.sm-card{
  position:absolute;display:block;border-radius:var(--r);overflow:hidden;
  box-shadow:0 34px 70px -30px rgba(0,0,0,.85);
  transform:translate3d(var(--mx,0px),var(--my,0px),0) rotate(var(--rot,0deg));
  will-change:transform;
}
.sm-card img{width:100%;height:100%;object-fit:cover;display:block}
.sm-card:nth-child(1){width:56%;top:0;left:0;--rot:-4deg;z-index:1}
.sm-card:nth-child(2){width:52%;bottom:2%;left:22%;--rot:3deg;z-index:3}
.sm-card:nth-child(3){width:58%;top:14%;right:0;--rot:5deg;z-index:2}
@media (max-width:960px){
  .sm-hero-body{grid-template-columns:1fr;gap:2.2rem}
  .sm-stack{aspect-ratio:16/10}
}

/* standard */
.sm-standard{background:var(--paper);padding-bottom:var(--sec)}
.sm-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.sm-pillars article{
  display:flex;flex-direction:column;gap:.5rem;
  padding:clamp(1.4rem,2.6vw,2rem);border-radius:var(--r);
  background:var(--paper-bright);border:1px solid var(--line);
}
.sm-pillars h3{font-size:clamp(1.1rem,1.7vw,1.35rem);font-weight:560;letter-spacing:-.03em}
.sm-pillars p{color:var(--muted);font-size:.95rem;line-height:1.55}
@media (max-width:900px){.sm-pillars{grid-template-columns:1fr}}

/* metodo */
.sm-method{background:var(--paper);padding-bottom:var(--sec)}
.sm-method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.sm-method-grid article{
  display:flex;flex-direction:column;gap:.5rem;
  padding:clamp(1.5rem,2.6vw,2.2rem);border-radius:var(--r-lg);
  background:var(--paper-bright);border:1px solid var(--line);
  transition:transform .6s var(--e-out),border-color .45s ease;
}
.sm-method-grid article:hover{transform:translateY(-5px);border-color:var(--line-strong)}
.sm-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--muted)}
.sm-method-grid h3{font-size:clamp(1.15rem,1.9vw,1.5rem);font-weight:560;letter-spacing:-.032em;margin-top:.2rem}
.sm-method-grid p{color:var(--muted);font-size:.95rem;line-height:1.55}
@media (max-width:900px){.sm-method-grid{grid-template-columns:1fr}}

/* tipi di contenuto */
.sm-types{background:var(--paper-bright);padding-bottom:var(--sec)}
.sm-type{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center;
  padding-block:clamp(2rem,5vw,4rem);border-top:1px solid var(--line);
}
.sm-type:nth-child(even) .sm-type-media{order:2}
.sm-type-media{
  border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;background:var(--paper);
}
.sm-type-media img{width:100%;height:112%;object-fit:cover;will-change:transform}
.sm-type-copy{display:flex;flex-direction:column;gap:.7rem}
.sm-type-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;color:var(--business)}
.sm-type-copy h3{font-size:clamp(1.4rem,2.8vw,2.3rem);font-weight:560;letter-spacing:-.038em;line-height:1.05}
.sm-type-claim{
  font-size:clamp(1rem,1.5vw,1.22rem);font-weight:500;letter-spacing:-.02em;color:var(--business);
  line-height:1.35;
}
.sm-type-copy p:last-child{color:var(--muted);line-height:1.65;max-width:52ch}
.sm-type-copy strong{color:var(--ink);font-weight:560}
@media (max-width:860px){
  .sm-type{grid-template-columns:1fr;gap:1.4rem}
  .sm-type:nth-child(even) .sm-type-media{order:0}
}

/* prova sul campo */
.sm-proof{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad);overflow:hidden}
.sm-proof-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.sm-proof-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem}
.sm-proof-copy .eyebrow{color:rgba(250,249,245,.55)}
.sm-proof-copy h2 em{color:var(--lime)}
.sm-proof-copy p{color:rgba(250,249,245,.7);max-width:54ch;line-height:1.6}
.sm-proof-copy strong{color:var(--paper-bright);font-weight:560}
.sm-numbers{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(250,249,245,.16)}
.sm-numbers li{
  display:flex;flex-direction:column;gap:.1rem;
  padding:clamp(1rem,2.4vw,1.6rem) 0;border-bottom:1px solid rgba(250,249,245,.16);
}
.sm-numbers li:nth-child(odd){padding-right:1rem}
.sm-numbers strong{
  font-size:clamp(1.8rem,4vw,3rem);font-weight:560;letter-spacing:-.045em;color:var(--lime);
  font-variant-numeric:tabular-nums;
}
.sm-numbers span{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;color:rgba(250,249,245,.55)}
@media (max-width:900px){.sm-proof-inner{grid-template-columns:1fr;gap:2.4rem}}


/* ─── consenso cookie: piccolo, in basso a sinistra ─────── */
.consent{
  position:fixed;left:clamp(.8rem,2vw,1.5rem);bottom:clamp(.8rem,2vw,1.5rem);z-index:75;
  width:min(92vw,360px);padding:1rem 1.1rem 1.05rem;border-radius:18px;
  background:color-mix(in srgb,var(--ink) 92%,transparent);color:var(--paper-bright);
  border:1px solid rgba(250,249,245,.16);
  box-shadow:0 30px 60px -28px rgba(0,0,0,.7);
  backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
  display:flex;flex-direction:column;gap:.85rem;
  transform:translateY(140%);opacity:0;
  transition:transform .7s var(--e-out),opacity .5s ease;
}
.consent.is-up{transform:none;opacity:1}
.consent[hidden]{display:none}
.consent-txt{font-size:.82rem;line-height:1.5;color:rgba(250,249,245,.72)}
.consent-txt strong{color:var(--paper-bright);font-weight:560}
.consent-txt a{
  color:var(--lime);background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;
  transition:background-size .4s var(--e-out);
}
.consent-txt a:hover{background-size:100% 1px}
.consent-btns{display:flex;gap:.5rem;flex-wrap:wrap}
.consent-btns button{
  flex:1 1 auto;padding:.6em 1em;border-radius:100px;
  font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  transition:background .35s ease,color .35s ease,transform .4s var(--e-out);
}
.consent-btns [data-consent-no]{border:1px solid rgba(250,249,245,.3);color:rgba(250,249,245,.8)}
.consent-btns [data-consent-no]:hover{border-color:var(--paper-bright);color:var(--paper-bright)}
.consent-btns [data-consent-yes]{background:var(--lime);color:var(--ink)}
.consent-btns [data-consent-yes]:hover{transform:translateY(-2px)}
@media (max-width:520px){.consent{width:calc(100vw - 1.6rem)}}

.foot-legal{display:inline-flex;gap:1.2rem;align-items:center;flex-wrap:wrap}
.foot-legal a,.foot-legal button{
  font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;
  padding-bottom:.15em;transition:background-size .4s var(--e-out),color .3s ease;
}
.foot-legal a:hover,.foot-legal button:hover{background-size:100% 1px;color:var(--paper-bright)}

/* mappa che si carica su richiesta */
.ct-map-hold{
  position:absolute;inset:0;display:grid;place-items:center;
  background:
    radial-gradient(circle at 30% 30%,rgba(41,70,92,.12),transparent 60%),
    repeating-linear-gradient(45deg,var(--paper) 0 12px,var(--paper-bright) 12px 24px);
}
.ct-map-hold iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.28) contrast(1.04)}
.ct-map-msg{
  display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center;
  padding:1.4rem;max-width:30ch;
}
.ct-map-msg b{font-size:1.05rem;font-weight:560;letter-spacing:-.025em}
.ct-map-msg span{font-size:.86rem;color:var(--muted)}
.ct-map-msg button{
  margin-top:.5rem;padding:.75em 1.3em;border-radius:100px;
  background:var(--ink);color:var(--paper-bright);
  font-size:.86rem;font-weight:520;
  transition:background .4s ease,transform .45s var(--e-out);
}
.ct-map-msg button:hover{background:var(--business);transform:translateY(-2px)}


/* ═══════════════════════════════════════════════════════════
   PAGINA · PRODUZIONE VIDEO
   ═══════════════════════════════════════════════════════════ */

/* ─── hero ─────────────────────────────────────────────── */
.vd-hero{
  position:relative;min-height:100svh;overflow:hidden;
  padding:clamp(5.4rem,10vh,7.6rem) 0 clamp(1.4rem,3.4vh,2.4rem);
  display:flex;flex-direction:column;justify-content:space-between;gap:clamp(1.5rem,3.4vh,2.6rem);
  background:var(--ink);color:var(--paper-bright);
}
.vd-hero::after{                                   /* alone freddo, come una sala montaggio */
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 60% at 15% 12%,rgba(41,70,92,.42),transparent 62%);
}
.vd-hero-top{
  position:relative;z-index:3;padding-inline:var(--pad);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center;
}
.vd-hero-top .eyebrow{color:rgba(250,249,245,.6)}
.vd-hero-copy{
  position:relative;z-index:3;padding-inline:var(--pad);
  display:flex;flex-direction:column;align-items:flex-start;gap:clamp(1rem,2.4vh,1.5rem);
}
.vd-title{font-size:clamp(2.9rem,min(7.4vw,12.5vh),6.8rem);font-weight:620;letter-spacing:-.055em;line-height:.9}
.vd-title em{color:var(--lime);font-weight:300;font-size:.6em;letter-spacing:-.03em}
.vd-lead{max-width:min(92vw,54ch);font-size:var(--fs-lead);color:rgba(250,249,245,.68);line-height:1.45}

/* pellicola */
.vd-film{position:relative;z-index:2;display:flex;flex-direction:column;gap:clamp(.5rem,1vw,.8rem)}
.vd-rec{
  display:flex;align-items:center;gap:.75rem;padding-inline:var(--pad);margin-bottom:.4rem;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.5);
}
.vd-rec{margin-bottom:.15rem}
.vd-rec i{font-style:normal;opacity:.55}
.vd-rec b{font-weight:400;color:var(--lime);letter-spacing:.12em;margin-left:auto;padding-right:0}
.vd-rec-dot{
  width:7px;height:7px;border-radius:50%;background:#e5484d;
  animation:recBlink 1.6s steps(1,end) infinite;
}
@keyframes recBlink{0%,55%{opacity:1}56%,100%{opacity:.15}}

.vd-lane .marquee-track{display:flex;align-items:center;gap:clamp(.5rem,1vw,.8rem);will-change:transform}
.vd-lane .marquee-track span{
  flex:none;height:clamp(78px,11.6vh,138px);aspect-ratio:16/9;
  border-radius:calc(var(--r) * .7);overflow:hidden;
  background:var(--ink-soft);border:1px solid rgba(250,249,245,.09);
}
.vd-lane .marquee-track img{width:100%;height:100%;object-fit:cover;opacity:.62;filter:grayscale(.25)}
.vd-lane:nth-of-type(3) .marquee-track img{opacity:.34}
.vd-film::after{                                   /* i bordi sfumano nel nero */
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,var(--ink),transparent 12%,transparent 88%,var(--ink));
}

/* ─── standard ─────────────────────────────────────────── */
.vd-standard{background:var(--paper);padding-bottom:var(--sec)}

/* ─── color grading ────────────────────────────────────── */
.vd-grade{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.vd-grade-inner{max-width:1320px;margin-inline:auto;display:flex;flex-direction:column;gap:clamp(2rem,4.5vw,3.4rem)}
.vd-grade-head{display:flex;flex-direction:column;gap:1.1rem;max-width:min(92vw,760px)}
.vd-grade-head .eyebrow{color:rgba(250,249,245,.55)}
.vd-grade-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.vd-grade-head .sec-copy{max-width:56ch;color:rgba(250,249,245,.66)}

.vd-ba{
  --ba:52%;
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  aspect-ratio:16/9;background:var(--ink);
  border:1px solid rgba(250,249,245,.12);
  touch-action:pan-y;
}
.vd-ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vd-ba-raw{
  position:absolute;inset:0;overflow:hidden;
  clip-path:inset(0 calc(100% - var(--ba)) 0 0);
}
.vd-ba-raw img{filter:saturate(.28) contrast(.84) brightness(1.1) sepia(.06)}
.vd-ba-bar{position:absolute;top:0;bottom:0;left:var(--ba);width:0;pointer-events:none}
.vd-ba-bar::before{
  content:'';position:absolute;top:0;bottom:0;left:-1px;width:2px;background:var(--lime);
}
.vd-ba-bar i{
  position:absolute;top:50%;left:0;transform:translate(-50%,-50%);
  width:clamp(38px,4vw,50px);aspect-ratio:1;border-radius:50%;
  background:var(--lime);
  box-shadow:0 8px 30px rgba(0,0,0,.4);
}
.vd-ba-bar i::before,.vd-ba-bar i::after{
  content:'';position:absolute;top:50%;width:0;height:0;
  border-block:5px solid transparent;
}
.vd-ba-bar i::before{left:26%;transform:translateY(-50%);border-right:7px solid var(--ink)}
.vd-ba-bar i::after{right:26%;transform:translateY(-50%);border-left:7px solid var(--ink)}
.vd-ba-range{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;cursor:ew-resize;appearance:none;background:none;margin:0;
}
.vd-ba-range::-webkit-slider-thumb{appearance:none;width:56px;height:100%;cursor:ew-resize}
.vd-ba-range::-moz-range-thumb{width:56px;height:100%;border:0;cursor:ew-resize}
.vd-ba-tag{
  position:absolute;top:clamp(.8rem,1.6vw,1.3rem);
  padding:.45em 1em;border-radius:100px;pointer-events:none;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  background:rgba(17,17,15,.6);backdrop-filter:blur(8px);color:var(--paper-bright);
}
.vd-ba-tag-l{left:clamp(.8rem,1.6vw,1.3rem)}
.vd-ba-tag-r{right:clamp(.8rem,1.6vw,1.3rem);background:var(--lime);color:var(--ink)}
.vd-ba figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:clamp(2.4rem,5vw,3.6rem) clamp(1rem,2.4vw,1.8rem) clamp(.9rem,1.8vw,1.3rem);
  font-size:.85rem;color:rgba(250,249,245,.72);pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(17,17,15,.72));
}

/* ─── audio ────────────────────────────────────────────── */
.vd-audio{background:var(--ink);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.vd-audio-inner{
  max-width:1320px;margin-inline:auto;
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;
}
.vd-audio-copy{display:flex;flex-direction:column;gap:1.1rem}
.vd-audio-copy .eyebrow{color:rgba(250,249,245,.55)}
.vd-audio-copy h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.vd-audio-copy p{color:rgba(250,249,245,.66);max-width:50ch;line-height:1.55}
.vd-audio-copy strong{color:var(--paper-bright);font-weight:560}
.vd-audio-tags{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin-top:.4rem}
.vd-audio-tags li{
  padding:.5em 1.05em;border-radius:100px;border:1px solid rgba(250,249,245,.18);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
  color:rgba(250,249,245,.6);
}
.vd-wave{
  display:flex;align-items:center;justify-content:space-between;gap:2px;
  height:clamp(180px,26vh,300px);
  padding:clamp(1.2rem,2.4vw,2rem);border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(41,70,92,.28),rgba(17,17,15,.1));
  border:1px solid rgba(250,249,245,.1);
}
.vd-wave i{
  flex:1;min-width:2px;border-radius:2px;
  height:var(--h,20%);
  background:linear-gradient(180deg,var(--lime),rgba(229,213,2,.35));
  transition:height .09s linear;
}
@media (max-width:960px){
  .vd-audio-inner{grid-template-columns:1fr;gap:2.2rem}
}

/* ─── tipologie ────────────────────────────────────────── */
.vd-types{background:var(--paper);padding-bottom:var(--sec)}
.vd-type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.vd-type-grid article{
  display:flex;flex-direction:column;gap:.5rem;
  padding:clamp(1.4rem,2.6vw,2rem);border-radius:var(--r);
  background:var(--paper-bright);border:1px solid var(--line);
  transition:transform .6s var(--e-out),border-color .45s ease;
}
.vd-type-grid article:hover{transform:translateY(-5px);border-color:var(--line-strong)}
.vd-type-n{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;color:var(--business);
}
.vd-type-grid h3{font-size:clamp(1.05rem,1.6vw,1.28rem);font-weight:560;letter-spacing:-.03em}
.vd-type-grid p{color:var(--muted);font-size:.94rem;line-height:1.55}
@media (max-width:960px){.vd-type-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.vd-type-grid{grid-template-columns:1fr}}

/* ─── lavori ───────────────────────────────────────────── */
.vd-work{background:var(--paper);padding-bottom:var(--sec)}
.vd-filters{
  display:flex;flex-wrap:wrap;gap:.5rem;
  margin-bottom:clamp(1.6rem,3vw,2.4rem);
}
.vd-chip{
  display:inline-flex;align-items:center;gap:.55em;
  padding:.62em 1.15em;border-radius:100px;cursor:pointer;
  background:transparent;border:1px solid var(--line);
  font-family:var(--sans);font-size:.9rem;font-weight:480;letter-spacing:-.015em;color:var(--ink);
  transition:background .35s ease,color .35s ease,border-color .35s ease;
}
.vd-chip span{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;
  color:var(--muted);transition:color .35s ease;
}
.vd-chip:hover{border-color:var(--line-strong)}
.vd-chip.is-on{background:var(--ink);border-color:var(--ink);color:var(--paper-bright)}
.vd-chip.is-on span{color:var(--lime)}

.vd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.vd-card{
  display:flex;flex-direction:column;gap:.85rem;text-align:left;cursor:pointer;
  background:none;font-family:inherit;color:inherit;
  transition:opacity .5s var(--e-out) var(--fd,0ms),transform .55s var(--e-out) var(--fd,0ms);
}
.vd-card.is-out{display:none}
.vd-card.is-fresh{animation:vdIn .55s var(--e-out) var(--fd,0ms) both}
@keyframes vdIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.vd-thumb{
  position:relative;display:block;overflow:hidden;
  border-radius:var(--r);aspect-ratio:16/9;background:var(--ink-soft);
}
.vd-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.1s var(--e-out),filter .5s ease;
}
.vd-card:hover .vd-thumb img{transform:scale(1.055);filter:brightness(.72)}
.vd-play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.86);
  width:clamp(48px,4.6vw,62px);aspect-ratio:1;border-radius:50%;
  background:rgba(250,249,245,.14);backdrop-filter:blur(10px);
  border:1px solid rgba(250,249,245,.4);
  opacity:0;transition:opacity .45s ease,transform .55s var(--e-out),background .35s ease;
}
.vd-play::after{
  content:'';position:absolute;left:calc(50% + 2px);top:50%;transform:translate(-50%,-50%);
  width:0;height:0;border-block:8px solid transparent;border-left:13px solid var(--paper-bright);
}
.vd-card:hover .vd-play,.vd-card:focus-visible .vd-play{opacity:1;transform:translate(-50%,-50%) scale(1)}
.vd-card:hover .vd-play{background:var(--lime);border-color:var(--lime)}
.vd-card:hover .vd-play::after{border-left-color:var(--ink)}
.vd-info{display:flex;flex-direction:column;gap:.12rem}
.vd-info b{font-size:1.02rem;font-weight:560;letter-spacing:-.028em}
.vd-info em{font-style:normal;font-size:.86rem;color:var(--muted)}
.vd-work-note{margin-top:clamp(2rem,4vw,3rem);color:var(--muted);font-size:var(--fs-lead)}
@media (max-width:960px){.vd-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){
  .vd-grid{grid-template-columns:1fr}
  .vd-play{opacity:1;transform:translate(-50%,-50%) scale(1)}
  .vd-filters{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
    margin-inline:calc(var(--pad) * -1);padding-inline:var(--pad);
  }
  .vd-filters::-webkit-scrollbar{display:none}
  .vd-chip{flex:none}
}

/* ─── processo ─────────────────────────────────────────── */
.vd-process{background:var(--paper);padding-bottom:var(--sec)}
.vd-steps{list-style:none;border-top:1px solid var(--line)}
.vd-steps li{
  display:grid;grid-template-columns:auto 1.1fr 1.5fr;gap:clamp(1rem,3vw,3rem);align-items:baseline;
  padding-block:clamp(1.5rem,3vw,2.4rem);border-bottom:1px solid var(--line);
}
.vd-step-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;color:var(--business)}
.vd-steps h3{font-size:clamp(1.2rem,2.2vw,1.75rem);font-weight:560;letter-spacing:-.035em}
.vd-steps p{color:var(--muted);line-height:1.55;max-width:52ch}
@media (max-width:860px){
  .vd-steps li{grid-template-columns:auto 1fr;gap:.4rem 1rem}
  .vd-steps p{grid-column:2}
}

/* ─── attrezzatura ─────────────────────────────────────── */
.vd-gear{background:var(--ink);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.vd-gear-inner{
  max-width:1320px;margin-inline:auto;
  display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:start;
}
.vd-gear-head{display:flex;flex-direction:column;gap:1rem}
.vd-gear-head .eyebrow{color:rgba(250,249,245,.55)}
.vd-gear-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.vd-gear-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,3vw,2.6rem)}
.vd-gear-cols h3{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;text-transform:uppercase;
  color:var(--lime);margin-bottom:1rem;font-weight:400;
}
.vd-gear-cols ul{list-style:none;display:flex;flex-direction:column}
.vd-gear-cols li{
  padding-block:.72rem;border-top:1px solid rgba(250,249,245,.12);
  color:rgba(250,249,245,.72);font-size:.95rem;
}
@media (max-width:960px){
  .vd-gear-inner{grid-template-columns:1fr;gap:2.2rem}
}
@media (max-width:560px){.vd-gear-cols{grid-template-columns:1fr}}

/* ─── player ───────────────────────────────────────────── */
.vd-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center}
.vd-modal[hidden]{display:none}
.vd-modal-bg{
  position:absolute;inset:0;background:rgba(9,9,8,.9);backdrop-filter:blur(14px);
  opacity:0;transition:opacity .4s ease;cursor:pointer;
}
.vd-modal.is-on .vd-modal-bg{opacity:1}
.vd-modal-box{
  position:relative;width:min(96vw,1180px);
  display:flex;flex-direction:column;gap:.9rem;
  opacity:0;transform:translateY(18px) scale(.985);
  transition:opacity .45s var(--e-out),transform .55s var(--e-out);
}
.vd-modal.is-on .vd-modal-box{opacity:1;transform:none}
.vd-modal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem}
.vd-modal-head p{display:flex;flex-direction:column;gap:.1rem;color:var(--paper-bright)}
.vd-modal-head b{font-size:1.05rem;font-weight:560;letter-spacing:-.03em}
.vd-modal-head em{font-style:normal;font-size:.85rem;color:rgba(250,249,245,.55)}
.vd-modal-x{
  position:relative;flex:none;width:44px;height:44px;border-radius:50%;cursor:pointer;
  background:rgba(250,249,245,.1);border:1px solid rgba(250,249,245,.2);
  transition:background .35s ease,transform .45s var(--e-out);
}
.vd-modal-x:hover{background:var(--lime);transform:rotate(90deg)}
.vd-modal-x i{
  position:absolute;left:50%;top:50%;width:15px;height:1.5px;background:var(--paper-bright);
}
.vd-modal-x i:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.vd-modal-x i:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
.vd-modal-x:hover i{background:var(--ink)}
.vd-modal-frame{
  aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#000;
  box-shadow:0 40px 120px rgba(0,0,0,.6);
}
.vd-modal-frame iframe{width:100%;height:100%;display:block;border:0}

@media (max-width:560px){
  .vd-hero-top .ag-kicker{display:none}
  .vd-lead{font-size:1rem}
}
@media (prefers-reduced-motion:reduce){
  .vd-rec-dot{opacity:1}
  .vd-lane .marquee-track{transform:none !important}
}


/* ═══════════════════════════════════════════════════════════
   PAGINA · FOTOGRAFIA
   ═══════════════════════════════════════════════════════════ */

/* ─── hero: testo a sinistra, colonne di foto a destra ─── */
.fo-hero{
  position:relative;height:100svh;min-height:620px;overflow:hidden;
  display:grid;grid-template-columns:1fr 1.06fr;grid-template-rows:minmax(0,1fr);
  align-items:center;gap:clamp(1.5rem,4vw,4rem);
  padding:clamp(5.4rem,10vh,7.6rem) 0 clamp(2rem,5vh,3rem) var(--pad);
  background:var(--ink);color:var(--paper-bright);
}
.fo-hero-copy{
  position:relative;z-index:3;
  display:flex;flex-direction:column;align-items:flex-start;gap:clamp(1rem,2.2vh,1.5rem);
  max-width:min(92vw,640px);
}
.fo-hero-copy .eyebrow{color:rgba(250,249,245,.6)}
.fo-title{font-size:clamp(2.9rem,min(6.2vw,11vh),5.6rem);font-weight:620;letter-spacing:-.055em;line-height:.9}
.fo-title em{color:var(--lime);font-weight:300;font-size:.52em;letter-spacing:-.03em}
.fo-lead{font-size:var(--fs-lead);color:rgba(250,249,245,.68);line-height:1.45}
.fo-hero-meta{
  margin-top:.4rem;padding-top:1.1rem;border-top:1px solid rgba(250,249,245,.14);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.1em;line-height:1.9;
  color:rgba(250,249,245,.5);
}
.fo-hero-meta b{color:var(--lime);font-weight:400}
.fo-hero-meta i{font-style:normal;opacity:.4;padding-inline:.3em}

/* le tre colonne scorrono a velocità diverse (data-float nel motore) */
.fo-hero-wall{
  position:relative;align-self:stretch;height:100%;min-height:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.5rem,.9vw,.85rem);
  align-items:start;overflow:hidden;
}
.fo-col{
  display:flex;flex-direction:column;gap:clamp(.5rem,.9vw,.85rem);
  will-change:transform;
}
.fo-col-mid{margin-top:-9%}
.fo-col span{
  display:block;overflow:hidden;border-radius:calc(var(--r) * .8);
  aspect-ratio:3/4;background:var(--ink-soft);
}
.fo-col img{width:100%;height:100%;object-fit:cover;display:block}
.fo-hero-wall::after{                              /* sopra e sotto sfumano nel nero */
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,var(--ink),transparent 16%,transparent 84%,var(--ink));
}
@media (max-width:980px){
  .fo-hero{
    grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);align-items:start;
    padding-inline:0;gap:clamp(1.6rem,4vh,2.4rem);
  }
  .fo-hero-copy{padding-inline:var(--pad);max-width:none}
  .fo-hero-wall{align-self:stretch}
  .fo-hero-meta{display:none}
}
@media (max-width:560px){
  .fo-hero-wall{grid-template-columns:repeat(2,1fr)}
  .fo-col:nth-child(3){display:none}
  .fo-col{transform:none !important}      /* niente parallasse: lo spazio è poco */
  .fo-col-mid{margin-top:-16%}
  .fo-lead{font-size:1rem}
}

/* ─── il muro di foto ──────────────────────────────────── */
.fo-wall{background:var(--paper);padding-bottom:var(--sec)}
.fo-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(1.4rem,2.6vw,2.1rem)}
.fo-chip{
  display:inline-flex;align-items:center;gap:.55em;
  padding:.62em 1.15em;border-radius:100px;cursor:pointer;
  background:transparent;border:1px solid var(--line);
  font-family:var(--sans);font-size:.9rem;font-weight:480;letter-spacing:-.015em;color:var(--ink);
  transition:background .35s ease,color .35s ease,border-color .35s ease;
}
.fo-chip span{font-family:var(--mono);font-size:.66rem;color:var(--muted);transition:color .35s ease}
.fo-chip:hover{border-color:var(--line-strong)}
.fo-chip.is-on{background:var(--ink);border-color:var(--ink);color:var(--paper-bright)}
.fo-chip.is-on span{color:var(--lime)}

/* mosaico: 12 colonne, riga alta quanto una colonna.
   Così gli span decidono il formato — e le foto migliori pesano di più. */
.fo-grid{
  --g:clamp(.5rem,.9vw,.9rem);
  display:grid;grid-template-columns:repeat(12,1fr);
  grid-auto-rows:var(--u,7.5vw);        /* --u lo calcola foto.js: una riga = una colonna */
  grid-auto-flow:row dense;
  gap:var(--g);
}
.fo-tile{
  position:relative;display:block;cursor:pointer;overflow:hidden;
  grid-column:span 3;grid-row:span 2;              /* un quarto, 3:2 */
  border-radius:var(--r);background:var(--ink-soft);
  padding:0;border:0;font-family:inherit;
}
.fo-tile.s-big {grid-column:span 6;grid-row:span 4}   /* metà pagina, 3:2 */
.fo-tile.s-tall{grid-column:span 3;grid-row:span 4}   /* un quarto, verticale */
.fo-tile.s-pano{grid-column:span 6;grid-row:span 3}   /* metà pagina, panoramica */
.fo-tile.s-hero{grid-column:span 12;grid-row:span 5}  /* tutta la larghezza */
.fo-tile.is-out{display:none}
.fo-tile.is-fresh{animation:foIn .55s var(--e-out) var(--fd,0ms) both}
@keyframes foIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.fo-tile img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s var(--e-out),filter .5s ease;
}
.fo-tile:hover img{transform:scale(1.06)}
.fo-cap{
  position:absolute;left:0;right:0;bottom:0;text-align:left;
  display:flex;flex-direction:column;gap:.05rem;
  padding:clamp(2rem,4vw,3rem) clamp(.8rem,1.4vw,1.15rem) clamp(.7rem,1.2vw,1rem);
  background:linear-gradient(180deg,transparent,rgba(17,17,15,.82));
  color:var(--paper-bright);
  opacity:0;transform:translateY(8px);
  transition:opacity .45s ease,transform .55s var(--e-out);
}
.fo-tile:hover .fo-cap,.fo-tile:focus-visible .fo-cap{opacity:1;transform:none}
.fo-cap b{font-size:.95rem;font-weight:560;letter-spacing:-.028em}
.fo-cap em{font-style:normal;font-size:.78rem;color:rgba(250,249,245,.66)}
/* le foto grandi meritano una didascalia grande */
.s-big .fo-cap b,.s-hero .fo-cap b{font-size:1.2rem}
.s-big .fo-cap em,.s-hero .fo-cap em{font-size:.85rem}

@media (max-width:1100px){
  .fo-grid{grid-template-columns:repeat(6,1fr)}
  .fo-tile{grid-column:span 3;grid-row:span 2}        /* metà, 3:2 */
  .fo-tile.s-big{grid-column:span 6;grid-row:span 4}  /* piena, 3:2 */
  .fo-tile.s-tall{grid-column:span 3;grid-row:span 4}
  .fo-tile.s-pano{grid-column:span 6;grid-row:span 3}
  .fo-tile.s-hero{grid-column:span 6;grid-row:span 3}
}
@media (max-width:760px){
  .fo-cap{opacity:1;transform:none;padding:1.1rem .7rem .5rem}
  .fo-cap b{font-size:.82rem}
  .fo-cap em{font-size:.7rem}
  .fo-filters{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
    margin-inline:calc(var(--pad) * -1);padding-inline:var(--pad);
  }
  .fo-filters::-webkit-scrollbar{display:none}
  .fo-chip{flex:none}
}

/* ─── standard / tipologie ─────────────────────────────── */
.fo-standard{background:var(--paper);padding-bottom:var(--sec)}
.fo-types{background:var(--paper);padding-bottom:var(--sec)}

/* ─── riconoscimenti ───────────────────────────────────── */
.fo-awards{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.fo-awards-inner{
  max-width:1320px;margin-inline:auto;
  display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;
}
.fo-awards-head{display:flex;flex-direction:column;gap:1.1rem;position:sticky;top:clamp(5rem,12vh,7rem)}
.fo-awards-head .eyebrow{color:rgba(250,249,245,.55)}
.fo-awards-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.fo-awards-head .sec-copy{color:rgba(250,249,245,.62)}
.fo-awards-list{list-style:none;counter-reset:aw}
.fo-awards-list li{
  padding-block:clamp(1.4rem,2.8vw,2.2rem);
  border-top:1px solid rgba(250,249,245,.14);
  display:flex;flex-direction:column;gap:.45rem;
}
.fo-awards-list li:last-child{border-bottom:1px solid rgba(250,249,245,.14)}
.fo-award-tag{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.45);
}
.fo-awards-list h3{font-size:clamp(1.5rem,3vw,2.4rem);font-weight:600;letter-spacing:-.04em;line-height:1}
.fo-awards-list h3 em{font-style:normal;font-weight:300;color:var(--lime);font-size:.7em}
.fo-awards-list p{color:rgba(250,249,245,.66);line-height:1.55;max-width:60ch}
@media (max-width:960px){
  .fo-awards-inner{grid-template-columns:1fr;gap:2.2rem}
  .fo-awards-head{position:static}
}

/* ─── visore ───────────────────────────────────────────── */
.fo-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center}
.fo-modal[hidden]{display:none}
.fo-modal-bg{
  position:absolute;inset:0;background:rgba(9,9,8,.94);backdrop-filter:blur(16px);
  opacity:0;transition:opacity .4s ease;cursor:zoom-out;
}
.fo-modal.is-on .fo-modal-bg{opacity:1}
.fo-modal-box{
  position:relative;width:min(94vw,1400px);
  display:flex;flex-direction:column;gap:.9rem;
  opacity:0;transform:scale(.985);
  transition:opacity .45s var(--e-out),transform .55s var(--e-out);
}
.fo-modal.is-on .fo-modal-box{opacity:1;transform:none}
.fo-modal-box img{
  width:100%;max-height:78svh;object-fit:contain;display:block;
  border-radius:var(--r);background:#0b0b0a;
}
.fo-modal-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.fo-modal-bar p{display:flex;flex-direction:column;gap:.1rem;color:var(--paper-bright)}
.fo-modal-bar b{font-size:1.05rem;font-weight:560;letter-spacing:-.03em}
.fo-modal-bar em{font-style:normal;font-size:.85rem;color:rgba(250,249,245,.55)}
.fo-modal-nav{display:flex;align-items:center;gap:.8rem}
.fo-modal-count{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.12em;
  color:rgba(250,249,245,.45);min-width:4.5em;text-align:center;
}
.fo-modal-count b{font-size:inherit;font-weight:400;color:var(--lime)}
.fo-modal-nav button{
  position:relative;width:42px;height:42px;border-radius:50%;cursor:pointer;
  background:rgba(250,249,245,.1);border:1px solid rgba(250,249,245,.2);
  transition:background .35s ease,border-color .35s ease;
}
.fo-modal-nav button:hover{background:var(--lime);border-color:var(--lime)}
.fo-modal-nav button i{
  position:absolute;left:50%;top:50%;width:0;height:0;
  border-block:6px solid transparent;
}
[data-modal-prev] i{transform:translate(-58%,-50%);border-right:9px solid var(--paper-bright)}
[data-modal-next] i{transform:translate(-42%,-50%);border-left:9px solid var(--paper-bright)}
.fo-modal-nav button:hover i{border-right-color:var(--ink);border-left-color:var(--ink)}
.fo-modal-x{
  position:absolute;top:-3.2rem;right:0;width:44px;height:44px;border-radius:50%;cursor:pointer;
  background:rgba(250,249,245,.1);border:1px solid rgba(250,249,245,.2);
  transition:background .35s ease,transform .45s var(--e-out);
}
.fo-modal-x:hover{background:var(--lime);transform:rotate(90deg)}
.fo-modal-x i{position:absolute;left:50%;top:50%;width:15px;height:1.5px;background:var(--paper-bright)}
.fo-modal-x i:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.fo-modal-x i:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
.fo-modal-x:hover i{background:var(--ink)}
@media (max-width:640px){
  .fo-modal-box img{max-height:64svh}
  .fo-modal-x{top:-3rem}
}

@media (prefers-reduced-motion:reduce){
  .fo-col{transform:none !important}
  .fo-cap{opacity:1;transform:none}
}



/* ═══════════════════════════════════════════════════════════
   PAGINA · SITI WEB
   ═══════════════════════════════════════════════════════════ */

/* ─── hero: il sito che si disegna da solo ─────────────── */
.wb-hero{
  position:relative;min-height:100svh;overflow:hidden;
  display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:clamp(1.6rem,4vw,4rem);
  padding:clamp(5.4rem,10vh,7.6rem) var(--pad) clamp(2rem,5vh,3.4rem);
  background:var(--ink);color:var(--paper-bright);
}
.wb-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 78% 42%,rgba(41,70,92,.5),transparent 64%);
}
.wb-hero-copy{
  position:relative;z-index:3;
  display:flex;flex-direction:column;align-items:flex-start;gap:clamp(1rem,2.2vh,1.5rem);
  max-width:min(92vw,620px);
}
.wb-hero-copy .eyebrow{color:rgba(250,249,245,.6)}
.wb-title{font-size:clamp(2.9rem,min(6.6vw,12vh),6rem);font-weight:620;letter-spacing:-.055em;line-height:.9}
.wb-title em{color:var(--lime);font-weight:300;font-size:.56em;letter-spacing:-.03em}
.wb-lead{font-size:var(--fs-lead);color:rgba(250,249,245,.68);line-height:1.45}
.wb-hero-meta{
  display:flex;flex-wrap:wrap;gap:clamp(1.2rem,3vw,2.4rem);list-style:none;
  margin-top:.5rem;padding-top:1.2rem;border-top:1px solid rgba(250,249,245,.14);
}
.wb-hero-meta li{display:flex;flex-direction:column;gap:.15rem}
.wb-hero-meta b{font-size:clamp(1.2rem,2vw,1.6rem);font-weight:560;letter-spacing:-.04em;color:var(--lime)}
.wb-hero-meta span{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;
  color:rgba(250,249,245,.45);
}

/* finestra del browser */
.wb-build{position:relative;z-index:2}
.wb-browser{
  border-radius:calc(var(--r) * 1.1);overflow:hidden;
  background:var(--ink-soft);border:1px solid rgba(250,249,245,.14);
  box-shadow:0 50px 120px rgba(0,0,0,.5);
}
.wb-bar{
  display:flex;align-items:center;gap:.45rem;
  padding:.75rem .9rem;background:rgba(250,249,245,.06);
  border-bottom:1px solid rgba(250,249,245,.1);
}
.wb-dot{width:9px;height:9px;border-radius:50%;background:rgba(250,249,245,.22)}
.wb-url{
  margin-left:.7rem;padding:.3em 1em;border-radius:100px;
  background:rgba(250,249,245,.07);
  font-family:var(--mono);font-size:.68rem;font-weight:400;letter-spacing:.06em;
  color:rgba(250,249,245,.5);
}
.wb-url em{
  display:inline-block;width:1px;height:.95em;margin-left:2px;vertical-align:-.13em;
  background:var(--lime);animation:wbCaret 1.1s steps(1,end) infinite;
}
@keyframes wbCaret{0%,55%{opacity:1}56%,100%{opacity:0}}

.wb-page{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:.6rem clamp(.6rem,1.2vw,1rem);
  padding:clamp(1rem,2vw,1.6rem);
  background:linear-gradient(180deg,rgba(250,249,245,.05),transparent);
}
.wb-page > span{
  border-radius:8px;background:rgba(250,249,245,.11);
  opacity:0;transform:translateY(10px);
}
.is-built .wb-page > span{
  animation:wbIn .5s var(--e-out) forwards;
  animation-delay:calc(var(--i) * .13s);
}
@keyframes wbIn{to{opacity:1;transform:none}}
.wb-nav{
  grid-column:1/-1;height:20px;background:none !important;
  display:flex;gap:.5rem;align-items:center;
}
.wb-nav i{height:7px;border-radius:4px;background:rgba(250,249,245,.16)}
.wb-nav i:nth-child(1){width:42px;background:var(--lime);opacity:.85}
.wb-nav i:nth-child(2){width:30px}
.wb-nav i:nth-child(3){width:26px}
.wb-nav i:nth-child(4){width:34px;margin-left:auto}
.wb-h1{grid-column:1/3;height:clamp(26px,3.4vw,42px);background:rgba(250,249,245,.2) !important}
.wb-h2{grid-column:1/3;height:12px}
.wb-cta{grid-column:1/2;height:26px;background:var(--lime) !important;border-radius:100px !important}
.wb-media{grid-column:3/4;grid-row:2/5;background:rgba(41,70,92,.55) !important}
.wb-card{height:clamp(52px,7vw,86px)}

@media (max-width:980px){
  .wb-hero{grid-template-columns:1fr;align-items:start;gap:clamp(1.4rem,3vh,2.2rem)}
  .wb-hero-copy{max-width:none}
  .wb-hero-meta{gap:1.2rem;padding-top:1rem}
}
@media (max-width:600px){
  .wb-hero{padding-top:clamp(4.8rem,9vh,6.4rem)}
  .wb-lead{font-size:1rem}
  .wb-page{gap:.45rem .6rem;padding:.9rem}
  .wb-card{height:44px}
}

/* ─── morph: computer → tablet → telefono ──────────────── */
.wb-morph{height:340vh;background:var(--business-deep)}
.wb-morph-sticky{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  gap:clamp(1rem,2.4vh,2rem);
  padding:clamp(5.4rem,10vh,7.4rem) var(--pad) clamp(1.6rem,4vh,2.6rem);
  background:var(--business-deep);color:var(--paper-bright);
}
.wb-morph-head{text-align:center;display:flex;flex-direction:column;gap:.9rem;align-items:center}
.wb-morph-head .eyebrow{color:rgba(250,249,245,.55)}
.wb-morph-head .eyebrow::before{display:none}
.wb-morph-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}

.wb-stage{
  --dar:1.62;--r:10px;--bezel:14px;--cols:3;--cam:0;
  flex:1;min-height:0;width:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;
}
.wb-stage-frame{
  flex:1;min-height:0;width:100%;
  display:flex;align-items:center;justify-content:center;
}
.wb-device{
  position:relative;
  /* prende l'altezza che c'è, ma se il monitor non ci sta in larghezza
     è la larghezza a comandare: la proporzione resta sempre giusta */
  height:min(100%, calc(88vw / var(--dar)));
  width:auto;aspect-ratio:var(--dar);max-width:88vw;
  padding:var(--bezel);
  border-radius:calc(var(--r) + var(--bezel));
  background:linear-gradient(160deg,#2c2c28,#161614);
  border:1px solid rgba(250,249,245,.16);
  box-shadow:0 40px 90px rgba(0,0,0,.45);
  display:flex;flex-direction:column;gap:calc(var(--bezel) * .5);
}
.wb-cam{
  position:absolute;top:calc(var(--bezel) * .42);left:50%;transform:translateX(-50%);
  width:34px;height:5px;border-radius:100px;background:rgba(250,249,245,.2);
  opacity:var(--cam);
}
.wb-screen{
  flex:1;min-height:0;
  border-radius:var(--r);overflow:hidden;background:var(--paper);
  padding:clamp(.7rem,1.4vw,1.2rem);
  display:flex;flex-direction:column;gap:clamp(.5rem,1vw,.85rem);
}
.wb-s-nav{display:flex;align-items:center;gap:.5rem;flex:none}
.wb-s-nav i{height:6px;border-radius:4px;background:rgba(17,17,15,.16)}
.wb-s-nav i:nth-child(1){width:38px;background:var(--business)}
.wb-s-nav i:nth-child(2){width:26px}
.wb-s-nav i:nth-child(3){width:22px}
.wb-s-nav i:nth-child(4){width:30px;margin-left:auto;background:var(--lime)}
.wb-s-hero{flex:none;height:22%;border-radius:8px;background:rgba(41,70,92,.22)}
.wb-s-grid{
  display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:clamp(.4rem,.8vw,.7rem);
  flex:1;min-height:0;overflow:hidden;
}
.wb-s-grid span{border-radius:7px;background:rgba(17,17,15,.1)}
.wb-s-grid span:nth-child(1){background:rgba(229,213,2,.4)}
.wb-s-line{flex:none;height:6px;border-radius:4px;background:rgba(17,17,15,.14)}
.wb-s-line.short{width:55%}
.wb-foot{
  flex:none;height:5px;width:32%;margin:0 auto;border-radius:100px;
  background:rgba(250,249,245,.28);opacity:var(--cam);
}
.wb-stage-label{
  display:flex;align-items:baseline;gap:.6rem;flex:none;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
}
.wb-stage-label b{font-weight:400;color:var(--lime)}
.wb-stage-label em{font-style:normal;color:rgba(250,249,245,.42)}

.wb-morph-steps{
  display:flex;gap:clamp(.5rem,1.6vw,1.4rem);list-style:none;flex-wrap:wrap;justify-content:center;flex:none;
}
.wb-morph-steps li{
  display:flex;flex-direction:column;gap:.15rem;
  padding:.7em 1.2em;border-radius:var(--r);
  border:1px solid rgba(250,249,245,.14);
  opacity:.4;transition:opacity .5s ease,border-color .5s ease,background .5s ease;
}
.wb-morph-steps li.is-on{opacity:1;border-color:rgba(229,213,2,.5);background:rgba(229,213,2,.08)}
.wb-morph-steps b{font-size:.95rem;font-weight:560;letter-spacing:-.025em}
.wb-morph-steps span{font-size:.8rem;color:rgba(250,249,245,.55)}
@media (max-width:700px){
  .wb-morph{height:300vh}
  .wb-morph-steps li span{display:none}
  .wb-stage{padding-block:.5rem}
}

/* ─── mobile first / velocità ──────────────────────────── */
.wb-mobile{background:var(--paper);padding-bottom:var(--sec)}
.wb-speed{background:var(--ink);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.wb-speed-inner{
  max-width:1320px;margin-inline:auto;
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;
}
.wb-speed-copy{display:flex;flex-direction:column;gap:1.1rem}
.wb-speed-copy .eyebrow{color:rgba(250,249,245,.55)}
.wb-speed-copy h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.wb-speed-copy p{color:rgba(250,249,245,.66);line-height:1.55;max-width:52ch}
.wb-speed-copy strong{color:var(--paper-bright);font-weight:560}

.wb-gauges{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,2.4vw,2rem)}
.wb-gauge{
  --p:0;
  position:relative;display:flex;flex-direction:column;align-items:center;gap:.5rem;
  padding:clamp(1.2rem,2.4vw,1.8rem) 1rem;border-radius:var(--r-lg);
  background:rgba(250,249,245,.04);border:1px solid rgba(250,249,245,.1);
}
.wb-gauge svg{width:clamp(84px,10vw,112px);height:auto;transform:rotate(-90deg)}
.wb-g-bg{fill:none;stroke:rgba(250,249,245,.12);stroke-width:6}
.wb-g-fg{
  fill:none;stroke:var(--lime);stroke-width:6;stroke-linecap:round;
  stroke-dasharray:270.2;
  stroke-dashoffset:calc(270.2 - 270.2 * var(--p) / 100);
}
.wb-gauge b{
  position:absolute;top:clamp(1.2rem,2.4vw,1.8rem);left:0;right:0;
  height:clamp(84px,10vw,112px);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(1.4rem,2.2vw,1.9rem);font-weight:560;letter-spacing:-.04em;
}
.wb-gauge em{
  font-style:normal;font-family:var(--mono);font-size:var(--fs-micro);
  letter-spacing:.14em;text-transform:uppercase;color:rgba(250,249,245,.5);text-align:center;
}
@media (max-width:960px){
  .wb-speed-inner{grid-template-columns:1fr;gap:2.4rem}
}

/* ─── SEO ──────────────────────────────────────────────── */
.wb-seo{background:var(--paper);padding-bottom:var(--sec)}
.wb-seo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.wb-seo-grid article{
  display:flex;flex-direction:column;gap:.5rem;position:relative;
  padding:clamp(1.5rem,2.6vw,2.2rem);border-radius:var(--r-lg);
  background:var(--paper-bright);border:1px solid var(--line);
  transition:transform .6s var(--e-out),border-color .45s ease;
}
.wb-seo-grid article:hover{transform:translateY(-5px);border-color:var(--line-strong)}
.wb-n{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;color:var(--business)}
.wb-seo-grid h3{font-size:clamp(1.05rem,1.7vw,1.32rem);font-weight:560;letter-spacing:-.03em}
.wb-seo-grid p{color:var(--muted);font-size:.95rem;line-height:1.55}
code{
  font-family:var(--mono);font-size:.88em;
  padding:.12em .45em;border-radius:5px;background:rgba(41,70,92,.1);color:var(--business);
}
@media (max-width:960px){.wb-seo-grid{grid-template-columns:1fr}}

/* ─── SEO per le AI ────────────────────────────────────── */
.wb-ai{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.wb-ai-inner{max-width:1320px;margin-inline:auto;display:flex;flex-direction:column;gap:clamp(2rem,4.5vw,3.4rem)}
.wb-ai-head{display:flex;flex-direction:column;gap:1.1rem;max-width:min(92vw,860px)}
.wb-ai-head .eyebrow{color:rgba(250,249,245,.55)}
.wb-ai-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.wb-ai-head .sec-copy{max-width:64ch;color:rgba(250,249,245,.66)}

.wb-chat{
  display:flex;flex-direction:column;gap:.9rem;align-items:stretch;
  max-width:min(94vw,860px);
}
.wb-chat-q{align-self:flex-end;max-width:min(90%,560px)}
.wb-chat-q span{
  display:block;padding:.85em 1.2em;border-radius:18px 18px 4px 18px;
  background:rgba(250,249,245,.1);border:1px solid rgba(250,249,245,.14);
  font-size:.98rem;color:rgba(250,249,245,.85);
}
.wb-chat-a{
  padding:clamp(1.1rem,2.2vw,1.6rem);border-radius:4px 18px 18px 18px;
  background:rgba(250,249,245,.05);border:1px solid rgba(250,249,245,.12);
  display:flex;flex-direction:column;gap:.7rem;
}
.wb-chat-who{
  display:flex;align-items:center;gap:.55rem;
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.45);
}
.wb-chat-dot{width:8px;height:8px;border-radius:50%;background:var(--lime)}
.is-typing .wb-chat-dot{animation:wbPulse 1.1s ease-in-out infinite}
@keyframes wbPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
.wb-chat-a p{font-size:1.02rem;line-height:1.6;color:var(--paper-bright);min-height:4.8em}
.is-typing .wb-chat-a p::after{
  content:'';display:inline-block;width:2px;height:1em;vertical-align:-.14em;margin-left:2px;
  background:var(--lime);
}
.wb-chat-cites{
  display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;
  opacity:0;transform:translateY(6px);transition:opacity .6s ease,transform .6s var(--e-out);
}
.is-done .wb-chat-cites{opacity:1;transform:none}
.wb-chat-cites i{
  font-style:normal;font-family:var(--mono);font-size:var(--fs-micro);
  letter-spacing:.16em;text-transform:uppercase;color:rgba(250,249,245,.35);margin-right:.2rem;
}
.wb-chat-cites b{
  padding:.32em .85em;border-radius:100px;font-weight:450;font-size:.8rem;
  background:rgba(229,213,2,.14);border:1px solid rgba(229,213,2,.35);color:var(--lime);
}

.wb-ai-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.wb-ai-grid article{
  display:flex;flex-direction:column;gap:.5rem;
  padding:clamp(1.4rem,2.6vw,2rem);border-radius:var(--r);
  background:rgba(250,249,245,.05);border:1px solid rgba(250,249,245,.12);
  transition:background .45s ease,border-color .45s ease;
}
.wb-ai-grid article:hover{background:rgba(250,249,245,.08);border-color:rgba(229,213,2,.4)}
.wb-ai-grid h3{font-size:clamp(1.05rem,1.6vw,1.28rem);font-weight:560;letter-spacing:-.03em}
.wb-ai-grid p{color:rgba(250,249,245,.66);font-size:.95rem;line-height:1.55}
.wb-ai-grid em{font-style:italic;color:rgba(250,249,245,.85)}
.wb-ai-grid code{background:rgba(250,249,245,.12);color:var(--lime)}
.wb-ai-note{
  font-size:var(--fs-lead);color:rgba(250,249,245,.6);max-width:64ch;
  padding-top:1.4rem;border-top:1px solid rgba(250,249,245,.14);
}
.wb-ai-note strong{color:var(--lime);font-weight:560}
.wb-ai-note em{font-style:normal;color:rgba(250,249,245,.75)}
@media (max-width:960px){.wb-ai-grid{grid-template-columns:1fr}}

.wb-types{background:var(--paper);padding-bottom:var(--sec)}

@media (prefers-reduced-motion:reduce){
  .wb-morph{height:auto}
  .wb-morph-sticky{position:static;height:auto;min-height:100svh}
  .wb-page > span{opacity:1;transform:none}
  .wb-url em{display:none}
}


/* ═══════════════════════════════════════════════════════════
   PAGINA · BRANDING, GRAFICA E STAMPA
   ═══════════════════════════════════════════════════════════ */

/* ─── hero: il brand board che si compone ──────────────── */
.bd-hero{
  position:relative;min-height:100svh;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  align-items:center;gap:clamp(1.6rem,4vw,4rem);
  padding:clamp(5.4rem,10vh,7.6rem) var(--pad) clamp(2rem,5vh,3.4rem);
  background:var(--ink);color:var(--paper-bright);
}
.bd-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 58% 55% at 76% 46%,rgba(229,213,2,.14),transparent 62%);
}
.bd-hero-copy{
  position:relative;z-index:3;
  display:flex;flex-direction:column;align-items:flex-start;gap:clamp(1rem,2.2vh,1.5rem);
  max-width:min(92vw,640px);
}
.bd-hero-copy .eyebrow{color:rgba(250,249,245,.6)}
.bd-title{font-size:clamp(2.25rem,min(5.6vw,10.5vh),4.9rem);font-weight:620;letter-spacing:-.05em;line-height:.94}
.bd-title em{color:var(--lime);font-weight:300;font-size:.6em;letter-spacing:-.03em;white-space:nowrap}
.bd-lead{font-size:var(--fs-lead);color:rgba(250,249,245,.68);line-height:1.45}

.bd-hero-board{position:relative;z-index:2;display:flex;justify-content:center}
.bd-sheet{
  position:relative;width:100%;max-width:460px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(.7rem,1.4vw,1.1rem);
  padding:clamp(1.3rem,2.6vw,2rem);
  border-radius:var(--r-lg);
  background:rgba(250,249,245,.05);border:1px solid rgba(250,249,245,.14);
  box-shadow:0 40px 100px rgba(0,0,0,.45);
}
.bd-sheet-tag{
  position:absolute;top:-.7rem;left:clamp(1.3rem,2.6vw,2rem);
  padding:.25em .8em;border-radius:100px;
  background:var(--lime);color:var(--ink);
  font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
}
.bd-sheet > *{opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .7s var(--e-out)}
.bd-sheet.is-on > *{opacity:1;transform:none}
.bd-sheet.is-on .bd-swatches{transition-delay:.5s}
.bd-sheet.is-on .bd-type{transition-delay:.7s}
.bd-sheet.is-on .bd-variants{transition-delay:.9s}
.bd-sheet-tag{opacity:1 !important;transform:none !important}

.bd-mark{
  grid-column:1/-1;aspect-ratio:2.4/1;
  display:grid;place-items:center;border-radius:var(--r);
  background:rgba(250,249,245,.05);
}
.bd-mark svg{width:auto;height:72%;fill:none;stroke:var(--lime);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.bd-swatches{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem}
.bd-swatches i{display:block;aspect-ratio:1;border-radius:8px;background:var(--c);border:1px solid rgba(250,249,245,.12)}
.bd-type{
  min-width:0;display:flex;align-items:baseline;gap:.7rem;
  padding:.8rem .9rem;border-radius:var(--r);background:rgba(250,249,245,.05);
}
.bd-type b{font-size:2rem;font-weight:600;letter-spacing:-.05em;line-height:1}
.bd-type span{min-width:0;display:flex;flex-direction:column;font-size:.78rem;color:rgba(250,249,245,.72)}
.bd-type em{font-style:normal;font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(250,249,245,.4)}
.bd-variants{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
.bd-v{display:grid;place-items:center;aspect-ratio:1;border-radius:10px;border:1px solid rgba(250,249,245,.12)}
.bd-v i{display:block;width:46%;aspect-ratio:1;border-radius:50%;border:2.5px solid currentColor}
.bd-v-pos{background:var(--paper);color:var(--ink)}
.bd-v-neg{background:var(--ink-soft);color:var(--paper-bright)}
.bd-v-ico{background:var(--lime);color:var(--ink)}
@media (max-width:980px){
  .bd-hero{grid-template-columns:minmax(0,1fr);align-items:start;gap:clamp(1.6rem,3.5vh,2.4rem)}
  .bd-hero-copy{max-width:none}
  .bd-sheet{width:min(100%,420px);margin-inline:auto}
}

/* ─── il sistema: la palette ricolora tutto ────────────── */
.bd-system{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.bd-system-inner{
  max-width:1320px;margin-inline:auto;
  display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4rem);align-items:center;
}
.bd-system-head{display:flex;flex-direction:column;gap:1.1rem}
.bd-system-head .eyebrow{color:rgba(250,249,245,.55)}
.bd-system-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.bd-system-head .sec-copy{max-width:52ch;color:rgba(250,249,245,.66)}

.bd-presets{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.4rem}
.bd-preset{
  display:inline-flex;align-items:center;gap:.6em;cursor:pointer;
  padding:.55em 1.05em .55em .55em;border-radius:100px;
  background:rgba(250,249,245,.06);border:1px solid rgba(250,249,245,.16);
  font-family:var(--sans);font-size:.88rem;font-weight:470;color:rgba(250,249,245,.75);
  transition:background .4s ease,border-color .4s ease,color .4s ease;
}
.bd-preset i{
  width:22px;height:22px;border-radius:50%;flex:none;
  background:conic-gradient(var(--p1) 0 33%,var(--p2) 0 66%,var(--p3) 0);
  border:1px solid rgba(250,249,245,.25);
}
.bd-preset:hover{border-color:rgba(250,249,245,.36)}
.bd-preset.is-on{background:var(--lime);border-color:var(--lime);color:var(--ink)}

.bd-board{
  --c1:#11110f;--c2:#e5d502;--c3:#29465c;--paper:#f2f0e8;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.5rem,1vw,.85rem);
}
.bd-cell{
  position:relative;overflow:hidden;
  border-radius:var(--r);padding:clamp(.9rem,1.8vw,1.3rem);
  background:var(--paper);color:var(--c1);
  transition:background .8s var(--e-out),color .8s var(--e-out);
  min-height:clamp(120px,15vw,168px);
  display:flex;flex-direction:column;justify-content:flex-end;gap:.6rem;
}
.bd-cell-lbl{
  position:absolute;top:clamp(.7rem,1.4vw,1rem);left:clamp(.9rem,1.8vw,1.3rem);
  font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  opacity:.45;
}
.bd-cell-mark{
  grid-column:span 1;grid-row:span 2;
  background:var(--c1);align-items:center;justify-content:center;
}
.bd-cell-mark .bd-cell-lbl{color:var(--paper)}
.bd-cell-mark svg{
  width:62%;height:auto;fill:none;stroke:var(--c2);stroke-width:5;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .8s var(--e-out);
}
.bd-cell-pal{grid-column:span 2}
.bd-pal{display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem}
.bd-pal i{
  position:relative;display:block;aspect-ratio:1.4;border-radius:8px;
  border:1px solid rgba(17,17,15,.12);
  transition:background .8s var(--e-out);
}
.bd-pal b{
  position:absolute;left:.4em;bottom:.35em;
  font-family:var(--mono);font-size:8.5px;font-weight:400;letter-spacing:.06em;
  color:rgba(255,255,255,.72);mix-blend-mode:difference;
}
.bd-cell-type{grid-column:span 2}
.bd-spec{display:flex;align-items:baseline;gap:.6rem}
.bd-spec b{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:600;letter-spacing:-.05em;line-height:1}
.bd-spec em{font-style:normal;font-size:.95rem;opacity:.55}
.bd-spec-meta{font-size:.72rem;line-height:1.5;opacity:.5}
.bd-cell-card{background:var(--c3);color:var(--paper)}
.bd-cell-card .bd-cell-lbl{color:var(--paper)}
.bd-card{display:flex;flex-direction:column;gap:.5rem}
.bd-card-mark{display:block;width:34px}
.bd-card-mark svg{width:100%;height:auto;fill:none;stroke:var(--c2);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;transition:stroke .8s var(--e-out)}
.bd-card-lines{display:flex;flex-direction:column;gap:.28rem}
.bd-card-lines i{display:block;height:4px;border-radius:3px;background:rgba(255,255,255,.35)}
.bd-card-lines i:first-child{width:64%}
.bd-card-lines i:last-child{width:40%}
.bd-cell-pack{background:var(--c2);color:var(--c1)}
.bd-pack{position:relative;flex:1;min-height:56px;border-radius:8px;background:rgba(255,255,255,.55);overflow:hidden}
.bd-pack-band{position:absolute;left:0;right:0;top:38%;height:26%;background:var(--c1);transition:background .8s var(--e-out)}
.bd-pack-mark{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:20px;height:20px;border-radius:50%;border:2.5px solid var(--c2);
  transition:border-color .8s var(--e-out);
}
.bd-cell-screen{grid-column:span 2}
.bd-screen{
  flex:1;min-height:70px;border-radius:8px;overflow:hidden;
  background:var(--c1);padding:.55rem;display:flex;flex-direction:column;gap:.35rem;
  transition:background .8s var(--e-out);
}
.bd-screen-bar{display:flex;gap:.25rem}
.bd-screen-bar i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.3)}
.bd-screen-h{display:block;height:12px;width:52%;border-radius:4px;background:var(--paper);opacity:.9;transition:background .8s var(--e-out)}
.bd-screen-t{display:block;height:5px;width:74%;border-radius:3px;background:rgba(255,255,255,.28)}
.bd-screen-btn{display:block;height:12px;width:34%;border-radius:100px;background:var(--c2);transition:background .8s var(--e-out)}
@media (max-width:980px){
  .bd-system-inner{grid-template-columns:1fr;gap:2.2rem}
}
@media (max-width:560px){
  .bd-board{grid-template-columns:repeat(2,1fr)}
  .bd-cell-mark{grid-row:span 1}
  .bd-cell-pal,.bd-cell-type,.bd-cell-screen{grid-column:span 2}
}

/* ─── mappa del posizionamento ─────────────────────────── */
.bd-pos{background:var(--paper);padding-bottom:var(--sec)}
.bd-map-wrap{display:grid;grid-template-columns:1fr .85fr;gap:clamp(2rem,4vw,3.4rem);align-items:center}
.bd-map{
  position:relative;aspect-ratio:1.15;border-radius:var(--r-lg);
  background:var(--paper-bright);border:1px solid var(--line);
  overflow:hidden;
}
.bd-map-ax{position:absolute;background:var(--line)}
.bd-map-ax-x{left:8%;right:8%;top:50%;height:1px}
.bd-map-ax-y{top:8%;bottom:8%;left:50%;width:1px}
.bd-map-lbl{
  position:absolute;font-family:var(--mono);font-size:var(--fs-micro);
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:400;
}
.bd-map-t{top:4%;left:50%;transform:translateX(-50%)}
.bd-map-b{bottom:4%;left:50%;transform:translateX(-50%)}
.bd-map-l{left:4%;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:left center}
.bd-map-r{right:4%;top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:right center}
.bd-dot{
  position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  width:12px;height:12px;border-radius:50%;
}
.bd-dot-c{background:var(--line-strong)}
.bd-dot-you{
  width:20px;height:20px;background:var(--lime);
  box-shadow:0 0 0 0 rgba(229,213,2,.5);
  left:38%;top:52%;                                  /* parte in mezzo al mucchio */
  transition:left 1.3s var(--e-out) .25s,top 1.3s var(--e-out) .25s;
}
.bd-map.is-on .bd-dot-you{left:var(--x);top:var(--y);animation:bdPulse 2.6s ease-out 1.5s infinite}
@keyframes bdPulse{0%{box-shadow:0 0 0 0 rgba(229,213,2,.5)}70%,100%{box-shadow:0 0 0 26px rgba(229,213,2,0)}}
.bd-dot-you em{
  position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);
  font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink);opacity:0;transition:opacity .5s ease 1.4s;
}
.bd-map.is-on .bd-dot-you em{opacity:1}
.bd-map-gap{
  position:absolute;right:8%;top:8%;width:34%;height:34%;
  border:1px dashed rgba(229,213,2,.55);border-radius:var(--r);
  opacity:0;transition:opacity .8s ease 1s;
}
.bd-map.is-on .bd-map-gap{opacity:1}
.bd-pos-copy{display:flex;flex-direction:column;gap:1rem}
.bd-pos-copy p{color:var(--muted);font-size:var(--fs-lead);line-height:1.5}
.bd-pos-copy strong{color:var(--ink);font-weight:560}
.bd-pos-list{list-style:none;display:flex;flex-direction:column;margin-top:.4rem;border-top:1px solid var(--line)}
.bd-pos-list li{padding-block:.7rem;border-bottom:1px solid var(--line);font-size:.95rem}
.bd-pos-list li::before{content:'—';color:var(--lime);margin-right:.6em;font-weight:600}
@media (max-width:900px){
  .bd-map-wrap{grid-template-columns:1fr;gap:2rem}
}

/* ─── applicazioni ─────────────────────────────────────── */
.bd-work{background:var(--paper);padding-bottom:var(--sec)}
.bd-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(1.4rem,2.6vw,2.1rem)}
.bd-types{background:var(--paper);padding-bottom:var(--sec)}

/* ─── stampa ───────────────────────────────────────────── */
.bd-print{background:var(--ink);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.bd-print-inner{max-width:1320px;margin-inline:auto;display:flex;flex-direction:column;gap:clamp(2rem,4vw,3.2rem)}
.bd-print-head{display:flex;flex-direction:column;gap:1.1rem;max-width:min(92vw,780px)}
.bd-print-head .eyebrow{color:rgba(250,249,245,.55)}
.bd-print-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.bd-print-head .sec-copy{max-width:58ch;color:rgba(250,249,245,.66)}
.bd-print-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.bd-print-grid article{
  display:flex;flex-direction:column;gap:.9rem;
  padding:clamp(1.3rem,2.4vw,1.9rem);border-radius:var(--r);
  background:rgba(250,249,245,.05);border:1px solid rgba(250,249,245,.12);
  transition:background .45s ease,border-color .45s ease,transform .6s var(--e-out);
}
.bd-print-grid article:hover{background:rgba(250,249,245,.08);border-color:rgba(229,213,2,.4);transform:translateY(-4px)}
.bd-print-grid h3{font-size:clamp(1.02rem,1.6vw,1.22rem);font-weight:560;letter-spacing:-.03em}
.bd-print-grid ul{list-style:none;display:flex;flex-direction:column}
.bd-print-grid li{
  padding-block:.5rem;border-top:1px solid rgba(250,249,245,.1);
  font-size:.9rem;color:rgba(250,249,245,.72);
}
.bd-print-grid > article > p{font-size:.85rem;line-height:1.5;color:rgba(250,249,245,.48)}
.bd-print-cta{
  display:flex;justify-content:space-between;align-items:center;gap:var(--gap);flex-wrap:wrap;
  padding-top:clamp(1.4rem,3vw,2.2rem);border-top:1px solid rgba(250,249,245,.14);
}
.bd-print-cta p{font-size:var(--fs-lead);color:rgba(250,249,245,.62);max-width:52ch}
.bd-print-cta b{color:var(--paper-bright);font-weight:560}
@media (max-width:1100px){.bd-print-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.bd-print-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  .bd-sheet > *{opacity:1;transform:none}
  .bd-dot-you{left:var(--x);top:var(--y)}
  .bd-dot-you em,.bd-map-gap{opacity:1}
}


/* ═══════════════════════════════════════════════════════════
   PAGINE DI SETTORE (ristorazione, hotel, …)
   ═══════════════════════════════════════════════════════════ */

/* ─── hero: copy a sinistra, tre facce che si alternano ─── */
.rs-hero{
  position:relative;min-height:100svh;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
  align-items:center;gap:clamp(1.6rem,4vw,4rem);
  padding:clamp(5.4rem,10vh,7.6rem) var(--pad) clamp(2rem,5vh,3.4rem);
  background:var(--ink);color:var(--paper-bright);
}
.rs-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 18% 30%,rgba(229,213,2,.1),transparent 62%);
}
.rs-hero-copy{
  position:relative;z-index:3;
  display:flex;flex-direction:column;align-items:flex-start;gap:clamp(.9rem,2vh,1.4rem);
  max-width:min(92vw,600px);
}
.rs-hero-copy .eyebrow{color:rgba(250,249,245,.6)}
.rs-title{font-size:clamp(2.7rem,min(6.4vw,12vh),5.8rem);font-weight:620;letter-spacing:-.055em;line-height:.92}
.rs-kicker{
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
  color:rgba(250,249,245,.55);line-height:1.9;
}
.rs-kicker em{font-style:normal;color:var(--lime)}
.rs-lead{font-size:var(--fs-lead);color:rgba(250,249,245,.68);line-height:1.45}
.rs-lead strong{color:var(--lime);font-weight:560}

.rs-hero-stage{
  position:relative;z-index:2;align-self:stretch;
  display:flex;align-items:center;min-height:0;
}
.rs-slide{
  position:absolute;inset:0;
  border-radius:var(--r-lg);overflow:hidden;background:var(--ink-soft);
  opacity:0;transform:scale(1.03);
  transition:opacity 1.1s var(--e-out),transform 1.6s var(--e-out);
}
.rs-slide.is-on{opacity:1;transform:none}
.rs-slide img{width:100%;height:100%;object-fit:cover;display:block}
.rs-slide figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:clamp(2.4rem,5vw,3.6rem) clamp(1rem,2vw,1.6rem) clamp(.9rem,1.6vw,1.3rem);
  background:linear-gradient(180deg,transparent,rgba(17,17,15,.8));
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;text-transform:uppercase;
  color:rgba(250,249,245,.8);
}
.rs-slide-bars{
  position:absolute;left:clamp(1rem,2vw,1.6rem);right:clamp(1rem,2vw,1.6rem);
  top:clamp(1rem,2vw,1.6rem);z-index:3;
  display:flex;gap:.4rem;
}
.rs-slide-bars i{
  flex:1;height:2px;border-radius:2px;cursor:pointer;
  background:rgba(250,249,245,.25);position:relative;overflow:hidden;
}
.rs-slide-bars i::after{
  content:'';position:absolute;inset:0;background:var(--lime);
  transform:scaleX(0);transform-origin:left;
}
.rs-slide-bars i.is-done::after{transform:scaleX(1)}
.rs-slide-bars i.is-run::after{animation:rsBar 4.2s linear forwards}
@keyframes rsBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:980px){
  .rs-hero{grid-template-columns:minmax(0,1fr);align-items:start;gap:clamp(1.5rem,3.4vh,2.2rem)}
  .rs-hero-copy{max-width:none}
  .rs-hero-stage{min-height:clamp(220px,34vh,340px)}
  .rs-kicker{display:none}
}

/* ─── i servizi applicati al settore ───────────────────── */
.rs-svc{background:var(--paper);padding-bottom:var(--sec)}

/* ─── video del settore ────────────────────────────────── */
.rs-video{background:var(--business-deep);color:var(--paper-bright);padding-bottom:var(--sec)}
.rs-video-inner{max-width:1320px;margin-inline:auto;padding-inline:var(--pad)}
.rs-video .vd-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.rs-video .vd-info b{color:var(--paper-bright)}
.rs-video .vd-info em{color:rgba(250,249,245,.55)}
.rs-partner{
  margin-top:clamp(2rem,4vw,3rem);padding-top:clamp(1.4rem,3vw,2rem);
  border-top:1px solid rgba(250,249,245,.14);
}
.rs-partner p{font-size:var(--fs-lead);color:rgba(250,249,245,.62);max-width:72ch;line-height:1.5}
.rs-partner b{color:var(--lime);font-weight:560}
@media (max-width:900px){.rs-video .vd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.rs-video .vd-grid{grid-template-columns:minmax(0,1fr)}}

/* ─── il muro dei lavori ───────────────────────────────── */
.rs-wall{background:var(--paper)}

/* ─── clienti del settore ──────────────────────────────── */
.rs-clients{background:var(--paper);padding-bottom:var(--sec)}
.rs-clients-inner{
  display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(1.6rem,4vw,3.4rem);align-items:start;
  padding-top:var(--sec);border-top:1px solid var(--line);
}
.rs-clients h2 em{color:var(--business);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.rs-clients .eyebrow{margin-bottom:1rem}
.rs-client-list{
  list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;align-content:flex-start;
}
.rs-client-list li{
  padding:.6em 1.15em;border-radius:100px;
  border:1px solid var(--line);background:var(--paper-bright);
  font-size:.95rem;font-weight:470;letter-spacing:-.015em;
  transition:border-color .4s ease,transform .5s var(--e-out);
}
.rs-client-list li:hover{border-color:var(--lime);transform:translateY(-2px)}
@media (max-width:820px){
  .rs-clients-inner{grid-template-columns:minmax(0,1fr);gap:1.6rem}
}

@media (prefers-reduced-motion:reduce){
  .rs-slide{position:relative;opacity:1;transform:none}
  .rs-slide:not(.is-on){display:none}
}


/* ─── blocco servizio con video guardabile sul posto ───── */
.sm-type-wide{grid-template-columns:1.3fr .7fr}
/* il video sta nella colonna larga, non in quella stretta:
   la regola pari/dispari qui non deve valere */
.sm-type.sm-type-wide .sm-type-media{order:0;aspect-ratio:16/9}
.sm-type-play{position:relative;cursor:pointer;display:block}
/* velo leggero: senza, il tondo bianco sparisce sulle immagini chiare */
.sm-type-play::before{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:rgba(17,17,15,.22);transition:background .5s ease;
}
.sm-type-play:hover::before,.sm-type-play:focus-visible::before{background:rgba(17,17,15,.42)}
.sm-type-play img{transition:transform 1.1s var(--e-out),filter .5s ease}
.sm-type-play:hover img,.sm-type-play:focus-visible img{transform:scale(1.03);filter:brightness(.72)}
.sm-play{
  position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);
  width:clamp(58px,5.4vw,76px);aspect-ratio:1;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(250,249,245,.16);backdrop-filter:blur(10px);
  border:1px solid rgba(250,249,245,.5);
  transition:background .35s ease,border-color .35s ease,transform .5s var(--e-out);
}
.sm-play i{
  display:block;width:0;height:0;margin-left:4px;
  border-block:11px solid transparent;border-left:17px solid var(--paper-bright);
  transition:border-left-color .35s ease;
}
.sm-type-play:hover .sm-play,.sm-type-play:focus-visible .sm-play{
  background:var(--lime);border-color:var(--lime);transform:translate(-50%,-50%) scale(1.06);
}
.sm-type-play:hover .sm-play i,.sm-type-play:focus-visible .sm-play i{border-left-color:var(--ink)}
.sm-play-lbl{
  position:absolute;z-index:2;left:0;right:0;bottom:0;
  padding:clamp(2.2rem,4vw,3.2rem) clamp(1rem,2vw,1.5rem) clamp(.9rem,1.6vw,1.2rem);
  background:linear-gradient(180deg,transparent,rgba(17,17,15,.78));
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,249,245,.82);pointer-events:none;
}
.sm-play-lbl em{font-style:normal;color:var(--lime)}
@media (max-width:860px){
  .sm-type-wide{grid-template-columns:1fr}
}

/* ─── numeri del settore (industria) ───────────────────── */
.ib-stats{background:var(--business-deep);color:var(--paper-bright);padding:var(--sec) var(--pad)}
.ib-stats-inner{
  max-width:1320px;margin-inline:auto;
  display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(2rem,4.5vw,4rem);align-items:center;
}
.ib-stats-head{display:flex;flex-direction:column;gap:1rem}
.ib-stats-head .eyebrow{color:rgba(250,249,245,.55)}
.ib-stats-head h2 em{color:var(--lime);font-weight:300;font-size:.58em;letter-spacing:-.03em}
.ib-stat-list{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.ib-stat-list li{
  display:flex;flex-direction:column;gap:.45rem;
  padding:clamp(1.2rem,2.4vw,1.8rem);border-radius:var(--r);
  background:rgba(250,249,245,.05);border:1px solid rgba(250,249,245,.12);
}
.ib-stat-list strong{
  font-size:clamp(2rem,4vw,3.2rem);font-weight:600;letter-spacing:-.05em;line-height:1;
  color:var(--lime);
}
.ib-stat-list span{font-size:.92rem;line-height:1.45;color:rgba(250,249,245,.66)}
@media (max-width:980px){
  .ib-stats-inner{grid-template-columns:minmax(0,1fr);gap:2rem}
}
@media (max-width:560px){
  .ib-stat-list{grid-template-columns:minmax(0,1fr)}
}
.ib-why{background:var(--paper);padding-bottom:var(--sec)}

/* ═══ icone dei riquadri ═════════════════════════════════ */
.ic-sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{
  width:22px;height:22px;flex:none;display:block;
  fill:none;stroke:currentColor;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;
}

/* il riquadro dell'icona: quadrato morbido che si accende al passaggio */
.vd-type-grid article,
.sm-pillars article,
.sm-method-grid article,
.mk-approach-grid article{position:relative}

.vd-type-grid > article > .ic,
.sm-pillars > article > .ic,
.sm-method-grid > article > .ic,
.mk-approach-grid > article > .ic{
  box-sizing:content-box;
  width:22px;height:22px;padding:11px;margin-bottom:.9rem;
  border-radius:14px;
  color:var(--business);
  background:rgba(41,70,92,.07);
  border:1px solid rgba(41,70,92,.14);
  transition:background .45s ease,color .45s ease,border-color .45s ease,transform .6s var(--e-out);
}
.vd-type-grid article:hover > .ic,
.sm-pillars article:hover > .ic,
.sm-method-grid article:hover > .ic,
.mk-approach-grid article:hover > .ic{
  background:var(--lime);border-color:var(--lime);color:var(--ink);
  transform:translateY(-3px) rotate(-4deg);
}

/* il numero passa in alto a destra, così l'icona guida la lettura */
.vd-type-grid .vd-type-n,
.sm-method-grid .sm-n,
.mk-approach-grid .mk-n{
  position:absolute;top:clamp(1.4rem,2.6vw,2rem);right:clamp(1.4rem,2.6vw,2rem);
  opacity:.5;
}
.sm-pillars article{padding-top:clamp(1.4rem,2.6vw,2rem)}

@media (max-width:520px){
  .vd-type-grid > article > .ic,
  .sm-pillars > article > .ic,
  .sm-method-grid > article > .ic,
  .mk-approach-grid > article > .ic{padding:9px;margin-bottom:.7rem}
}

/* ═══ accessibility / motion ═════════════════════════════ */
:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:4px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .ln,[data-reveal]{opacity:1 !important;transform:none !important}
  .ghost,.round,.sticker{opacity:1 !important}
  .grain{display:none}
  .reel-frame{transform:scale(1) !important}
  .reel-copy{opacity:1 !important;transform:none !important}
  .method-steps li,.loop-track article{opacity:1 !important;transform:none !important}
  .ag-hero-bg img{animation:none}
}

/* ═══════════════════════════════════════════════════════════
   PAGINE DI SETTORE · componenti aggiunti
   ═══════════════════════════════════════════════════════════ */

/* ─── fascia foto a scorrimento ────────────────────────────
   Due corsie che scorrono in direzioni opposte subito sotto
   la hero: è il colpo d'occhio, e sta in alto.
   Le foto tengono la loro forma (altezza fissa, larghezza
   automatica): niente ritagli forzati.                      */
.st-band{
  position:relative;background:var(--ink);overflow:hidden;
  padding-block:clamp(1.4rem,3vw,2.6rem);
  display:flex;flex-direction:column;gap:clamp(.55rem,1.1vw,.95rem);
}
.st-band .marquee-track{
  gap:clamp(.55rem,1.1vw,.95rem);padding-right:clamp(.55rem,1.1vw,.95rem);
  align-items:stretch;font-size:0;
}
.st-band .marquee-track span{
  flex:none;height:clamp(132px,21vh,272px);
  border-radius:calc(var(--r) * .8);overflow:hidden;background:var(--ink-soft);
}
.st-band .marquee-track img{
  height:100%;width:auto;display:block;object-fit:cover;
  transition:opacity .6s ease;
}
.st-band-lane-b .marquee-track span{height:clamp(104px,16vh,208px)}
.st-band-lane-b .marquee-track img{opacity:.78}
.st-band::after{                      /* i bordi sfumano nel nero */
  content:'';position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(90deg,var(--ink),transparent 8%,transparent 92%,var(--ink));
}
.st-band-note{
  position:relative;z-index:3;align-self:center;margin-top:clamp(.5rem,1.2vw,1rem);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.2em;text-transform:uppercase;
  color:rgba(250,249,245,.42);
}
@media (max-width:640px){
  .st-band .marquee-track span{height:clamp(112px,17vh,150px)}
  .st-band-lane-b{display:none}      /* su telefono una corsia basta */
}

/* ─── blocchi servizio con più di una foto ─────────────────
   Stessa griglia di .sm-type: cambia solo cosa c'è nella
   colonna delle immagini.                                   */
.st-duo-media,.st-trio-media{display:grid;gap:clamp(.45rem,.9vw,.75rem)}
.st-duo-media{grid-template-columns:1fr 1fr}
.st-trio-media{grid-template-columns:1.32fr .68fr;grid-template-rows:1fr 1fr}
.st-trio-media figure:first-child{grid-row:span 2}
.st-duo-media figure,.st-trio-media figure{
  margin:0;border-radius:var(--r);overflow:hidden;background:var(--paper);
}
.st-duo-media figure{aspect-ratio:1}
.st-trio-media figure{aspect-ratio:1}
.st-trio-media figure:first-child{aspect-ratio:auto}
.st-duo-media img,.st-trio-media img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.1s var(--e-out);
}
.st-duo-media figure:hover img,.st-trio-media figure:hover img{transform:scale(1.05)}
.sm-type:nth-child(even) .st-duo-media,
.sm-type:nth-child(even) .st-trio-media{order:2}
@media (max-width:860px){
  .sm-type:nth-child(even) .st-duo-media,
  .sm-type:nth-child(even) .st-trio-media{order:0}
  .st-trio-media{grid-template-columns:1fr 1fr;grid-template-rows:auto auto}
  .st-trio-media figure:first-child{grid-row:span 1;grid-column:span 2;aspect-ratio:16/10}
}

/* ─── blocco con l'elenco delle lavorazioni ────────────────
   Rompe la sequenza foto+testo senza aggiungere immagini.   */
.st-listbox{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(.6rem,1.4vw,1.1rem);margin-top:.4rem;
}
.st-listbox li{
  display:flex;gap:.65rem;align-items:flex-start;
  font-size:var(--fs-body);line-height:1.4;color:var(--ink);
}
.st-listbox .ic{
  flex:none;width:1.15em;height:1.15em;margin-top:.15em;
  fill:none;stroke:var(--business);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
}
@media (max-width:520px){.st-listbox{grid-template-columns:1fr}}

/* ─── il video del settore, uno solo e grande ──────────────
   Meglio un lavoro vero mostrato bene che tre riempitivi.   */
.st-film{background:var(--business-deep);color:var(--paper-bright);padding-bottom:var(--sec);overflow:hidden}
.st-film-inner{max-width:1320px;margin-inline:auto;padding-inline:var(--pad)}
.st-film-stage{
  margin:0;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;
  background:var(--ink);position:relative;
}
.st-film-stage img{width:100%;height:100%;object-fit:cover;display:block}
.st-film-meta{
  display:flex;flex-wrap:wrap;gap:.5rem clamp(1rem,2.4vw,2.2rem);
  margin-top:clamp(.9rem,1.8vw,1.4rem);
  font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.16em;text-transform:uppercase;
  color:rgba(250,249,245,.55);
}
.st-film-meta b{color:var(--lime);font-weight:400}
.st-film-note{
  margin-top:clamp(1.6rem,3.4vw,2.6rem);max-width:62ch;
  color:rgba(250,249,245,.68);line-height:1.65;
}
.st-film-note b{color:var(--paper-bright);font-weight:560}

/* ─── il lavoro di punta, messo in alto ────────────────────
   Video grande subito sotto la hero, poi il racconto di cosa
   succede tappa per tappa. Nato per il Percorso Reggenziale. */
.st-film-top{padding-top:clamp(3.4rem,7vw,6rem)}
.st-film-top .sec-head{padding-top:0}
.st-journey-intro{
  margin-top:clamp(2.2rem,4.5vw,3.4rem);max-width:64ch;
  font-size:var(--fs-lead);line-height:1.55;letter-spacing:-.012em;
  color:rgba(250,249,245,.86);
}
.st-journey{
  position:relative;margin-top:clamp(1.8rem,3.6vw,2.8rem);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(1rem,2.4vw,2.2rem);
}
.st-journey::before{                 /* il filo che tiene insieme le tappe */
  content:'';position:absolute;left:0;right:0;top:6px;height:1px;
  background:rgba(250,249,245,.16);
}
.st-journey li{
  position:relative;padding-top:clamp(2rem,3.4vw,2.6rem);list-style:none;
  opacity:.32;transform:translateY(18px);
  transition:opacity .8s var(--e-out),transform .8s var(--e-out);
}
.st-journey li.is-in{opacity:1;transform:none}
.st-journey li::before{             /* il pallino sulla linea */
  content:'';position:absolute;top:0;left:0;width:13px;height:13px;border-radius:50%;
  background:var(--business-deep);border:1px solid rgba(250,249,245,.4);
  transition:background .5s var(--e-out),border-color .5s var(--e-out);
}
.st-journey li.is-in::before{background:var(--lime);border-color:var(--lime)}
.st-journey .ic{
  display:block;width:clamp(20px,1.8vw,24px);height:clamp(20px,1.8vw,24px);margin-bottom:.7rem;
  fill:none;stroke:var(--lime);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
}
.st-journey .step-n{display:block;color:rgba(250,249,245,.45);margin-bottom:.35rem}
.st-journey h3{
  font-size:clamp(1.05rem,1.7vw,1.4rem);font-weight:560;letter-spacing:-.03em;
  line-height:1.15;margin-bottom:.45rem;
}
.st-journey p{color:rgba(250,249,245,.62);line-height:1.55;font-size:var(--fs-body)}
@media (max-width:860px){
  .st-journey{grid-template-columns:1fr 1fr;gap:1.6rem 1.2rem}
  .st-journey::before{display:none}
  .st-journey li{padding-top:1.6rem}
}
@media (max-width:520px){
  .st-journey{grid-template-columns:1fr}
}