/* ============================================================
   ACD — Homepage
   Design: CAMPORSEVOLI | Concept (Figma)
   Font: Onest · Base unit: 1440px canvas, 40px side padding
   ============================================================ */

/* ---- Page transition overlay ---- */
.page-transition{
  position:fixed;inset:0;z-index:99999;
  background:#fff;
  opacity:1;
  pointer-events:none;
  transition:opacity .7s ease .3s;
}
.page-transition.is-out{opacity:0;}

:root{
  --bg:#f7f7f7;
  --ink:#222;
  --ink-strong:#111;
  --blue:#174bd2;
  --cream:#efebe7;
  --muted:#444;
  --navy:#0d1226;
  --white:#fff;
  --border-soft:rgba(34,34,34,.1);
  --tight:-0.03em;
  --pad:40px;
  /* Spaziatura blocchi Solutions */
  --radius:16px;
  --section-y:120px;
  --section-y-mobile:60px;
  --gap-lg:80px;
  --gap-cols:60px;
  --gap:40px;
  --gap-sm:20px;
  --gap-xs:12px;
}

*{box-sizing:border-box;}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  font-size:100%; /* base: 16px = 1rem */
}

/* Scale up typography at wider viewports */
@media (min-width:1541px){ html{ font-size:110%; } }
@media (min-width:1921px){ html{ font-size:120%; } }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Onest",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;}
/* border-radius:16px su TUTTE le immagini contenuto — applicato per classe o tramite parent overflow:hidden.
   Eccezioni: immagini full-viewport/full-bleed (hero__bg, intro__watermark, talk__bg) e loghi. */
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
ul{margin:0;padding:0;list-style:none;}

.wrap{width:100%;padding:0 var(--pad);}

/* ---------- shared bits ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin:0;
  font-size:0.875rem;font-weight:500;text-transform:uppercase;letter-spacing:0;
  line-height:1.1;
}
.eyebrow--cream{color:var(--cream);}
.eyebrow .dot{width:6px;height:6px;border-radius:12px;background:#222;flex:0 0 auto;}
.eyebrow--cream .dot{border-radius:12px;background:var(--cream);}

.accent{color:var(--blue);}

.ic-arrow{width:24px;height:24px;flex:0 0 auto;}
.ic-download{width:24px;height:24px;flex:0 0 auto;}
.ic-enter{width:24px;height:24px;flex:0 0 auto;}
.ic-chevron{width:20px;height:20px;flex:0 0 auto;}

/* Buttons: tall pill, label sits at the bottom, arrow top-right corner feel */
.btn{
  display:inline-flex;align-items:flex-end;justify-content:space-between;gap:16px;
  padding:48px 16px 16px;border-radius:8px;
  font-size:1rem;font-weight:400;letter-spacing:var(--tight);line-height:1;
  transition:transform .15s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
}
.btn:active{transform:translateY(1px);}

.btn--glass,
.navpill-wrap:not(.navpill-wrap--left):not(.is-expanding) .navpill{
  color:var(--cream);
  background:rgba(0,0,0,.1);
  border:1px solid rgba(239,235,231,.5);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.btn--glass:hover,
.navpill-wrap:not(.navpill-wrap--left):not(.is-expanding) .navpill:hover{background:rgba(0,0,0,.25);}

.btn--outline{
  color:var(--ink);
  background:transparent;
  border:1px solid var(--ink);
  flex:1 1 0;
}
.btn--outline:hover{background:var(--ink);color:var(--bg);}

/* CTA su fondo scuro (sezioni data-nav="dark", nav dell'header esclusa):
   all'hover diventano bianco pieno con testo scuro. Vale per outline e glass. */
[data-nav="dark"] .btn--outline:hover,
[data-nav="dark"] .btn--glass:hover{
  background:var(--white);color:var(--ink);border-color:var(--white);
}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:fixed;
  top:0;left:0;right:0;
  height:100vh;
  height:100dvh;
  overflow:hidden;
  background:#2a2a2a;
  z-index:1;
}
/* content scrolls OVER the pinned hero */
main{
  position:relative;
  z-index:2;
  margin-top:100vh;
  margin-top:100dvh;
  background:var(--bg);
}
.hero__bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.hero__scrim{
  position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 55%, rgba(0,0,0,.05) 100%);
}

.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;width:100%;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px;
}
/* Overlay backdrop menu mobile */
.nav-overlay{display:none;}
/* Headroom — nav always transparent; only logo hides on scroll-down */
.nav.headroom--pinned,.nav.headroom--unpinned{transform:none;}
.nav.headroom--top,.nav.headroom--not-top{background:transparent;}
.nav__logo{transition:opacity .3s ease,transform .3s ease;}
.nav__logo img{height:34px;width:auto;object-fit:contain;transition:filter .3s ease;}
@media (max-width:768px){.nav__logo img{height:28px;}}
.nav.headroom--unpinned .nav__logo{opacity:0;transform:translateY(-10px);pointer-events:none;}
.nav.headroom--pinned .nav__logo,
.nav.headroom--top .nav__logo{opacity:1;transform:none;}

/* --- section-aware colour themes --- */
.nav--on-dark .navpill-wrap:not(.is-expanding) .navpill{
  color:var(--white);background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);
}
.nav--on-dark .navpill-wrap:not(.is-expanding) .navpill:hover{background:rgba(255,255,255,.24);}
.nav--on-dark .nav__logo img{filter:brightness(0) invert(1);}
.nav--on-light .navpill-wrap:not(.is-expanding) .navpill{
  color:var(--ink);background:rgba(34,34,34,.07);border-color:rgba(34,34,34,.12);
}
.nav--on-light .navpill-wrap:not(.is-expanding) .navpill:hover{background:rgba(34,34,34,.15);}
.nav--on-light .nav__logo img{filter:brightness(0) opacity(.87);}
/* fallback wordmark if logo asset not yet downloaded */
.nav__logo img[alt]{min-width:60px;}
.nav__menus{display:flex;gap:12px;}
/* Il wrap ha dimensioni fisse = il pill iniziale.
   Il pill è absolute inside, così si espande senza spostare il bottone accanto. */
.navpill-wrap{
  position:relative;
  flex-shrink:0;
  width:200px;
  height:62px; /* padding-top(24)+content(20)+padding-bottom(16)+border(2) */
}
.navpill-wrap.is-expanding,
.navpill-wrap.is-open{ z-index:60; }
/* Solutions + Menu stacking: coordinato via JS.
   Quando uno è aperto, ha z-index:61. Quando entrambi chiusi, solito stacking order. */
.navpill-wrap--left.is-expanding,
.navpill-wrap--left.is-open{ z-index:61; }
.navpill-wrap:not(.navpill-wrap--left).is-expanding,
.navpill-wrap:not(.navpill-wrap--left).is-open{ z-index:61; }

.navpill{
  position:absolute;
  top:0;right:0;  /* default: ancora a destra, espande verso sinistra */
  width:200px;
  display:flex;align-items:flex-end;justify-content:space-between;
  padding:24px 16px 16px;border-radius:8px;
  color:var(--white);font-size:1rem;font-weight:400;letter-spacing:var(--tight);
  background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:width .3s cubic-bezier(.4,0,.2,1),
             border-radius .3s ease,
             background .3s ease,
             border-color .3s ease,
             color .3s ease;
}
.navpill:hover{ background:rgba(0,0,0,.35); }

/* Step 1 — button si espande a 412px verso sinistra */
.navpill-wrap.is-expanding .navpill{
  width:412px;
  border-radius:8px 8px 0 0;
  background:var(--white);
  border-color:var(--border-soft);
  border-bottom-color:var(--border-soft);
  color:var(--ink);
}

/* + → — */
.navpill .ic-v{
  transition:opacity .2s ease, transform .2s ease;
  transform-origin:center;
}
.navpill-wrap.is-expanding .navpill .ic-v{
  opacity:0;transform:scaleY(0);
}

/* Step 2 — pannello wipe dall'alto verso il basso */
.navpill__panel{
  position:absolute;top:100%;right:0;
  width:412px;height:484px;
  background:var(--white);
  border:1px solid var(--border-soft);
  border-top:none;
  border-radius:0 0 8px 8px;
  padding:32px 24px 24px;
  display:flex;flex-direction:column;
  /* nascosto: clip dal basso che copre tutto */
  visibility:hidden;
  clip-path:inset(0 0 100% 0 round 0 0 8px 8px);
  transition:clip-path .4s cubic-bezier(.4,0,.2,1),
             visibility 0s linear .4s;
}
.navpill-wrap.is-open .navpill__panel{
  visibility:visible;
  clip-path:inset(0 0 0% 0 round 0 0 8px 8px);
  transition:clip-path .4s cubic-bezier(.4,0,.2,1),
             visibility 0s linear 0s;
  pointer-events:auto;
}

.navpanel__links{
  display:flex;flex-direction:column;gap:24px;
  flex:1;
}
/* stile link Menu */
.navpanel__links a{
  color:var(--ink);font-size:1.75rem;font-weight:300;
  letter-spacing:var(--tight);line-height:1.1;
  transition:color .15s ease;
}
.navpanel__links a:hover{ color:var(--blue); }

/* stile link Solutions (sovrascrive solo nel wrap --left) */
.navpill-wrap--left .navpanel__links a{
  font-size:16px;
  font-weight:300;
  letter-spacing:normal;
  line-height:1.2;
}

.navpanel__cta{
  display:flex;align-items:flex-end;justify-content:space-between;
  padding:48px 16px 16px;border-radius:8px;
  border:1px solid var(--ink);
  color:var(--ink);font-size:1rem;font-weight:400;letter-spacing:var(--tight);
  flex:0 0 auto;
  transition:background .15s ease, color .15s ease;
}
.navpanel__cta svg{ width:24px;height:24px;flex:0 0 auto; }
.navpanel__cta:hover{ background:var(--ink);color:var(--white); }

/* ---- variante sinistra (Solutions): bottone espande verso destra ---- */
.navpill-wrap--left .navpill{
  right:auto;
  left:0;
}
/* pannello Solutions: altezza auto, padding 32px 24px */
.navpill-wrap--left .navpill__panel{
  right:auto;
  left:0;
  height:auto;
  padding:0 24px; /* le sezioni gestiscono il padding verticale */
}

/* struttura a sezioni */
.navpanel__sections{
  display:flex;
  flex-direction:column;
  width:100%;
}
.navpanel__section{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:32px 0;
}
.navpanel__section--bordered{
  border-bottom:1px solid #f0f0f0;
}
/* prima sezione: niente padding-top (il panel ne ha già 0, gestiamo qui) */
.navpanel__section:first-child{
  padding-top:32px;
}

/* categoria */
.navpanel__category{
  margin:0;
  font-size:12px;font-weight:500;
  text-transform:uppercase;letter-spacing:.06em;
  color:var(--blue);line-height:1;
}

/* stile link Solutions (sovrascrive solo nel wrap --left) */
.navpill-wrap--left .navpanel__links a,
.navpill-wrap--left .navpanel__section a{
  font-size:16px;
  font-weight:300;
  letter-spacing:normal;
  line-height:1.2;
}

@media (max-width:560px){
  .navpill-wrap.is-expanding .navpill,
  .navpill__panel{ width:calc(100% - 2 * var(--pad)); }
}

.hero__content{
  position:absolute;left:var(--pad);bottom:40px;z-index:5;
  max-width:80vw;
  display:flex;flex-direction:column;gap:40px;align-items:flex-start;
}
.hero__head{display:flex;flex-direction:column;gap:20px;color:var(--cream);}
.hero__title{
  margin:0;font-weight:300;font-size:5rem;line-height:1.15;letter-spacing:-0.03em;
}
.hero .btn--glass{width:253px;}

/* ============================================================
   INTRO
   ============================================================ */
.intro-hero{position:relative;overflow:hidden;isolation:isolate;}
.intro__watermark{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.05;pointer-events:none;z-index:-1;
}
.intro-hero__inner{
  position:relative;z-index:1;
  padding-top:120px;padding-bottom:120px;
  display:flex;flex-direction:column;gap:120px;
}
.intro{}
.intro__inner{position:relative;z-index:1;display:flex;flex-direction:column;gap:60px;}
.intro__lead{
  Margin:0;max-width:80vw;
  font-weight:300;font-size:4rem;line-height:1.2;letter-spacing:-0.04em;color:var(--ink);
}
.intro__actions{display:flex;gap:20px;width:670px;max-width:100%;}

/* Word-mask reveal (rises into view on scroll) */
.reveal .r-word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em;}
.reveal .r-inner{
  display:inline-block;transform:translateY(110%);opacity:0;
  transition:transform .85s cubic-bezier(.22,.61,.36,1), opacity .85s ease;
}
.reveal.is-in .r-inner{transform:translateY(0);opacity:1;}
/* subtle fade-up for the buttons after the line reveals */
.intro__actions.reveal-fade{opacity:0;transform:translateY(24px);transition:opacity .7s ease .35s, transform .7s cubic-bezier(.22,.61,.36,1) .35s;}
.intro__actions.reveal-fade.is-in{opacity:1;transform:translateY(0);}

/* ============================================================
   STATS
   ============================================================ */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.stat{
  background:var(--white);border:1px solid var(--border-soft);border-radius:16px;
  padding:32px 24px;display:flex;flex-direction:column;gap:60px;
}
.stat__num{
  margin:0;color:var(--blue);font-weight:300;font-size:2.25rem;line-height:1.2;letter-spacing:-0.04em;
}
.stat__label{
  margin:0;color:var(--ink);font-weight:400;font-size:1.125rem;line-height:1.48;letter-spacing:-0.02em;
}

/* ============================================================
   CASE STUDY
   ============================================================ */
.case{background:var(--ink-strong);color:var(--cream);}
.case__grid{
  display:grid;grid-template-columns:50vw 1fr;gap:0;
  align-items:stretch;
  padding:120px 0;
}
.case__text{
  display:flex;flex-direction:column;justify-content:space-between;gap:80px;
  padding:0 60px 0 var(--pad);
  max-width:900px;
  width:100%;
  box-sizing:border-box;
}
.case__top{display:flex;flex-direction:column;gap:20px;}
.case__title{
  margin:0;font-weight:300;font-size:3.375rem;line-height:1.2;letter-spacing:-0.04em;color:#f7f7f7;
}
.case__detail{display:flex;flex-direction:column;gap:40px;max-width:440px;margin-left:115px;}
.case__meta{display:flex;gap:20px;}
.case__meta>div{flex:1;display:flex;flex-direction:column;gap:12px;}
.case__metalabel{
  margin:0;font-weight:500;font-size:0.875rem;line-height:1;color:rgba(247,247,247,.7);text-transform:uppercase;
}
.case__metavalue{margin:0;font-weight:300;font-size:1rem;line-height:1;color:#f7f7f7;}
.case__quote{
  margin:0;font-weight:300;font-size:1.25rem;line-height:1.4;color:#f7f7f7;
}
.case__detail .btn--glass{width:325px;border-color:rgba(239,235,231,.5);}
.case__media{border-radius:16px;overflow:hidden;background:#222;margin-right:var(--pad);align-self:start;}
.case__media img{width:100%;height:auto;display:block;}

/* ============================================================
   LET'S TALK
   ============================================================ */
.talk{margin-top:120px;}
.talk__card{
  position:relative;border-radius:16px;overflow:hidden;
  min-height:clamp(480px, 55vw, 900px);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:40px;background:#1a1a1a;
}
.talk__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.talk__scrim{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,0) 53%, rgba(0,0,0,.8) 100%);
}
.talk__eyebrow{position:relative;z-index:2;}
.talk__bottom{position:relative;z-index:2;display:flex;flex-direction:column;gap:24px;align-items:flex-start;}
.talk__title{
  margin:0;max-width:637px;color:var(--cream);
  font-weight:300;font-size:3rem;line-height:1.2;letter-spacing:-0.03em;
}
.talk .btn--glass{width:253px;}

/* ============================================================
   VENDORS (marquee)
   ============================================================ */
.vendors{padding:120px 0;overflow:hidden;}
.vendors__title{
  margin:0 0 40px;text-align:center;color:var(--ink-strong);
  font-weight:300;font-size:2.5rem;line-height:1.2;letter-spacing:-0.04em;
}
.marquee{
  position:relative;width:100%;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee__track{
  display:flex;align-items:center;gap:60px;
  width:max-content;
  background:#f7f7f7;
  will-change:transform;
}
.marquee:hover .marquee__track{animation-play-state:paused;}
.vlogo{
  display:block;
  max-width:none;
  flex:0 0 auto;
  object-fit:contain;
  mix-blend-mode:darken;
  filter:grayscale(1);
  height:44px;
  width:auto;
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--white);position:relative;z-index:2;}
.footer__inner{display:flex;flex-direction:column;gap:120px;padding-top:60px;padding-bottom:40px;}
.footer__top{display:flex;align-items:flex-start;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.footer__brand{display:flex;flex-direction:column;gap:40px;width:265px;}
.footer__logo{height:52px;width:auto;object-fit:contain;}
.footer__address{font-style:normal;display:flex;flex-direction:column;gap:17px;color:var(--ink);font-size:1rem;font-weight:400;}
.footer__address p{margin:0;line-height:1.4;}

.footer__cols{display:flex;gap:20px;align-items:stretch;flex-wrap:wrap;}
.footer__col{width:210px;}
.footer__heading{display:block;margin:0 0 12px;color:var(--ink);font-size:1.25rem;font-weight:400;line-height:1.1;}
.footer__col ul{display:flex;flex-direction:column;gap:12px;}
.footer__col li{color:var(--muted);font-size:0.875rem;font-weight:300;line-height:1.4;}
.footer__col--links{display:flex;flex-direction:column;gap:20px;}
.footer__col--links .footer__heading{margin:0;}
.footer__mobile-links{display:none;}

.partner{
  width:325px;background:var(--navy);border-radius:16px;padding:24px;
  display:flex;flex-direction:column;justify-content:space-between;gap:60px;
}
.partner__head{display:flex;flex-direction:column;gap:20px;}
.partner__logo{margin:0;height:40px;width:auto;object-fit:contain;color:var(--white);font-size:1.625rem;font-weight:500;letter-spacing:-0.02em;display:block;align-items:center;align-self:flex-start;object-position:left center;}
.partner__desc{margin:0;color:#f7f7f7;font-size:1rem;font-weight:300;line-height:1.4;}
.partner__btn{width:100%;}
.partner__btn:hover{background:#f7f7f7;color:#222;}
.about-partners__cta{display:none;} /* Phase 2: Partner page TBD */
.cta--pending{display:none;} /* CTA con asset non ancora pronto (es. brochure mancante) */

.footer__bar{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  color:var(--muted);font-size:0.875rem;font-weight:300;line-height:1.4;
}
.footer__legal{display:flex;gap:40px;}

/* ============================================================
   ABOUT PAGE
   ============================================================ */

/* Hero blue variant */
.hero--blue { background:var(--blue); }
.hero--blue .hero__bg { opacity:.05; mix-blend-mode:normal; }
.hero--blue .hero__scrim { display:none; }

.hero__content--about{
  position:absolute;
  left:var(--pad);top:25vh;bottom:auto;
  width:min(800px,calc(100% - var(--pad)*2));
  display:flex;flex-direction:column;gap:20px;
  align-items:flex-start;
}
.about-hero__sub{
  position:absolute;
  bottom:120px;
  left:calc(50% + 75px);
  width:490px;max-width:calc(50% - 75px - var(--pad));
  margin:0;color:var(--white);
  font-size:1.125rem;font-weight:300;line-height:1.4;
}

/* About main (same stack as index main) */
.about-main{
  position:relative;z-index:2;
  margin-top:100vh;margin-top:100dvh;
  background:var(--bg);
}

/* Eyebrow variants */
.eyebrow--dark{ color:var(--ink); }

/* Active nav link */
.navpanel__links a.is-active{ color:var(--blue); }

/* ---- Intro ---- */
.about-intro{ padding:120px 0 0; }
.about-intro__lead{
  margin:0;max-width:80vw;
  font-size:4rem;font-weight:300;line-height:1.2;letter-spacing:-0.04em;
  color:var(--ink);
}

/* ---- Stats ---- */
.about-stats{ padding-top:60px; }
.about-rule{ border:none;border-top:1px solid #d9d9d9;margin:0; }
.about-stat-row{
  display:grid;grid-template-columns:440px 1fr;
  padding:60px 0;align-items:center;
}
.about-stat__left{ display:flex;flex-direction:column;gap:8px; }
.about-stat__num{
  margin:0;color:var(--blue);
  font-size:7.5rem;font-weight:300;line-height:1;letter-spacing:-0.04em;
}
.about-stat__lbl{
  margin:0;color:var(--ink);
  font-size:1.5rem;font-weight:300;line-height:1.4;letter-spacing:-0.02em;
}
.about-stat__desc{
  margin:0 auto;padding-left:60px;
  width:50vw;min-width:600px;
  color:var(--ink);font-size:1.125rem;font-weight:300;line-height:1.4;
}

/* ---- Bridge diagram ---- */
.about-bridge{ padding:120px 0;text-align:center; }
.about-bridge__title{
  margin:0 auto 60px;
  max-width:1106px;padding:0 var(--pad);
  font-size:4rem;font-weight:300;line-height:1.2;letter-spacing:-0.04em;
  color:var(--ink);
}
.about-diagram{
  display:flex;flex-direction:column;align-items:center;gap:0;
  padding:0 var(--pad);
}
/* connector zone: stacks the two SVGs with badge floating in the middle */
.diag-zone{
  position:relative;
  width:800px;max-width:100%;
  margin:0 auto;
}
.diag-svg-top,.diag-svg-bot{ display:block;width:100%; }
.diag-svg-top svg,.diag-svg-bot svg{ display:block;width:100%;height:auto; }
.diag-badge{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  z-index:2;
}
.about-diagram__row{ display:flex;align-items:center;gap:16px; }
.about-vcard{
  background:var(--white);border-radius:16px;
  width:120px;height:48px;
  display:flex;align-items:center;justify-content:center;padding:10px;
}
.about-vlogo{
  height:28px;width:auto;object-fit:contain;
  mix-blend-mode:darken;filter:grayscale(1);
}
.about-diagram__center{ display:flex;align-items:center;justify-content:center; }
.about-agents-img{ width:120px;height:120px;border-radius:16px;display:block; }
.about-spill{
  background:var(--white);border-radius:16px;
  width:120px;height:48px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:1rem;font-weight:500;letter-spacing:-0.04em;color:var(--ink);
}

/* ---- Why ---- */
.about-why{ padding:120px 0; }
.about-why__inner{
  display:grid;grid-template-columns:1fr 1fr;
  gap:60px;align-items:start;
}
.about-why__title{
  margin:0;font-size:2.5rem;font-weight:300;
  line-height:1.2;letter-spacing:-0.04em;color:var(--ink-strong);
}
.about-why__body{ display:flex;flex-direction:column;gap:40px;align-items:flex-start; }
.about-why__copy{ display:flex;flex-direction:column;gap:20px; }
.about-why__copy p{
  margin:0;font-size:1.125rem;font-weight:300;line-height:1.4;color:var(--ink);
}
.about-why__cta{ width:325px;flex:0 0 auto; }

/* ---- AI section ---- */
.about-ai{ padding-bottom:120px; }
.about-ai__inner{
  display:grid;grid-template-columns:1fr 1fr;
  gap:60px;align-items:stretch;
}
.about-ai__media{ border-radius:16px;overflow:hidden; }
.about-ai__media img{ width:100%;height:503px;object-fit:cover;display:block; }
.about-ai__text{
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:503px;
}
.about-ai__head{ display:flex;flex-direction:column;gap:20px; }
.about-ai__title{
  margin:0;font-size:2.5rem;font-weight:300;
  line-height:1.2;letter-spacing:-0.04em;color:var(--ink);
}
.about-ai__body{
  margin:0;font-size:1.25rem;font-weight:300;
  line-height:1.4;letter-spacing:-0.04em;color:var(--ink);
}

/* ---- Partners ---- */
.about-partners-section{ padding-bottom:120px; }
.about-partners__inner{
  display:grid;grid-template-columns:555px 1fr;
  gap:60px;align-items:stretch;
}
.about-partners__text{
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:840px;
}
.about-partners__head{ display:flex;flex-direction:column;gap:20px; }
.about-partners__title{
  margin:0;font-size:2.5rem;font-weight:300;
  line-height:1.2;letter-spacing:-0.04em;color:var(--ink-strong);
}
.about-partners__bottom{ display:flex;flex-direction:column;gap:40px;align-items:flex-start; }
.about-partners__body{
  margin:0;font-size:1.25rem;font-weight:300;
  line-height:1.4;letter-spacing:-0.04em;color:var(--ink-strong);
}
.about-partners__cta{ width:325px; }
.about-partners__media{ border-radius:16px;overflow:hidden; }
.about-partners__media img{ width:100%;height:840px;object-fit:cover;display:block; }

/* ---- About responsive ---- */
@media (max-width:1280px){
  .about-stat-row{ grid-template-columns:320px 1fr; }
  .about-stat__num{ font-size:5rem; }
  .about-why__inner{ gap:80px; }
  .about-partners__text{ min-height:auto; }
  .about-partners__media img{ height:600px; }
}
@media (max-width:900px){
  .about-hero__sub{ left:var(--pad);width:auto;right:var(--pad);max-width:100%; }
  .about-stat-row{ grid-template-columns:1fr; }
  .about-stat__desc{ width:auto;min-width:0;padding-left:0;padding-top:24px; }
  .about-stat__num{ font-size:4rem; }
  .about-bridge__title{ font-size:clamp(2rem,5vw,4rem); }
  .about-why__inner{ grid-template-columns:1fr;gap:48px; }
  .about-ai__inner{ grid-template-columns:1fr; }
  .about-ai__media img{ height:360px; }
  .about-ai__text{ min-height:auto;gap:32px; }
  .about-partners__inner{ grid-template-columns:1fr; }
  .about-partners__text{ min-height:auto; }
  .about-partners__media{ order:-1; }
  .about-partners__media img{ height:400px; }
  .about-intro__lead{ font-size:clamp(2rem,5vw,4rem); }
}
@media (max-width:560px){
  .about-why__cta,.about-partners__cta{ width:100%; }
  .about-diagram__row{ flex-wrap:wrap;justify-content:center; }
  .about-stat__num{ font-size:3.5rem; }
}

/* ============================================================
   SOLUTIONS PAGE
   ============================================================ */

/* Header block — intro + filters in one column */
.sol-header{
  display:flex;flex-direction:column;gap:64px;
  padding:200px var(--pad) 120px;
}
.sol-intro{display:flex;flex-direction:column;gap:20px;max-width:1100px;}
.sol-intro__title{
  margin:0;
  font-size:clamp(3.5rem,8vw,7.5rem);font-weight:300;
  line-height:1.1;letter-spacing:-0.04em;
  color:var(--ink);
  max-width:80vw;
}

/* Filter tabs */
.sol-filters{display:flex;gap:12px;flex-wrap:wrap;}
.sol-filter{
  display:inline-flex;align-items:flex-end;
  padding:24px 48px 16px 16px;
  border-radius:8px;font-size:1rem;font-weight:400;font-family:inherit;
  cursor:pointer;white-space:nowrap;
  border:1px solid rgba(34,34,34,.5);
  background:transparent;color:var(--ink);
  transition:background .2s,color .2s,border-color .2s;
}
.sol-filter.is-active,.sol-filter:hover{
  background:var(--ink-strong);color:var(--white);border-color:transparent;
}

/* Category heading */
.sol-category{padding:80px var(--pad) 0;}
.sol-category--next{padding-top:120px;}
.sol-category__title{
  margin:0 0 20px;font-size:clamp(2.5rem,5vw,4rem);font-weight:300;
  line-height:1.2;letter-spacing:-0.04em;color:var(--ink-strong);
}
.sol-category__sub{
  margin:0;font-size:clamp(1.25rem,2.5vw,2rem);font-weight:300;
  line-height:1.4;letter-spacing:-0.04em;color:var(--ink-strong);
  max-width:900px;
}

/* Product rows — sticky card stack */
.sol-items{padding:0 var(--pad);}
.sol-item{
  display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;
  padding-top:40px;margin-top:40px;
  border-top:1px solid var(--border-soft);
  /* sticky stack */
  position:sticky;
  top:100px;
  background:var(--bg);
  border-radius:20px;
  transform-origin:center top;
  will-change:transform;
}
/* z-index: later cards sit on top of earlier ones */
.sol-item:nth-child(1){z-index:1;}
.sol-item:nth-child(2){z-index:2;}
.sol-item:nth-child(3){z-index:3;}
.sol-item__img{
  /* height fissa per pareggiare .sol-item__body e per il calcolo dello
     sticky stack scale (item.offsetHeight) — eccezione analoga a .sol-industry__media */
  width:100%;height:503px;object-fit:cover;display:block;
  border-radius:16px;
}
.sol-item__body{
  flex:1;min-width:0;
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;
  height:503px;
}
.sol-item__head{
  width:100%;display:flex;flex-direction:column;gap:20px;
}
.sol-item__title{
  margin:0;font-size:clamp(1.75rem,3vw,3rem);font-weight:300;
  line-height:1.2;letter-spacing:-0.03em;color:var(--ink);
}
.sol-item__tail{
  width:min(440px,100%);display:flex;flex-direction:column;gap:40px;align-items:flex-end;
}
.sol-item__desc{
  margin:0;font-size:1rem;font-weight:300;
  line-height:1.48;color:var(--ink);
}
.sol-item__cta{flex:none;width:325px;}

/* Big cards */
.sol-bigcards{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
  padding:120px var(--pad);
}
.sol-bigcard{
  display:block;
  position:relative;border-radius:16px;overflow:hidden;height:670px;
}
.sol-bigcard img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s ease;
}
/* hover: zoom-in dell'immagine (1 → 1.2) contenuto nel container (overflow:hidden) */
.sol-bigcard:hover img{transform:scale(1.2);}
.sol-bigcard__content{
  position:absolute;inset:0;padding:32px 24px 24px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.sol-bigcard__title{
  margin:0;font-size:clamp(1.75rem,2.5vw,3rem);font-weight:300;
  line-height:1.2;letter-spacing:-0.03em;color:var(--white);
  max-width:28vw;
}


/* Sol responsive */
@media (max-width:1100px){
  .sol-item{grid-template-columns:1fr;}
  .sol-item__img{width:100%;height:420px;max-width:100%;}
  .sol-item__body{height:auto;gap:32px;}
  .sol-item__tail{width:100%;align-items:flex-start;}
  .sol-item__cta{width:100%;flex:none;}
  .sol-bigcards{grid-template-columns:1fr;}
  .sol-bigcard{height:480px;}
}
@media (max-width:560px){
  .sol-intro__title{font-size:clamp(2.5rem,10vw,4rem);}
  .sol-item__img{height:280px;}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1280px){
  .intro__lead{font-size:clamp(2.125rem,5vw,4rem);}
  .case__grid{grid-template-columns:1fr 1fr;}
  .case__detail{margin-left:0;}
}

@media (max-width:900px){
  :root{--pad:24px;}
  .nav__menus{gap:8px;}
  .navpill{width:auto;min-width:120px;padding:18px 14px 12px;}
  .hero{min-height:100dvh;}
  .hero__content{bottom:32px;}
  .hero__title{font-size:clamp(2.25rem,8vw,5rem);}
  .stats{grid-template-columns:repeat(2,1fr);}
  .intro-hero__inner{padding-top:80px;padding-bottom:80px;gap:80px;}
  .intro{padding-top:0;}
  .intro__actions{width:100%;}
  .case__grid{grid-template-columns:1fr;padding:0;}
  .case__text{padding:72px var(--pad);width:100%;}
  .case__text{gap:48px;}
  .case__title{font-size:clamp(1.875rem,6vw,3.375rem);}
  .case__media{order:-1;margin:24px var(--pad) 0;}
  .case__media img{min-height:420px;}
  .talk{margin-top:80px;}
  .talk__card{padding:28px;min-height:560px;}
  .talk__title{font-size:clamp(1.75rem,6vw,3rem);}
  .vendors{padding:80px 0;}
  .footer__inner{gap:64px;}
  .footer__top{gap:48px;}
}

/* Hamburger icon: visibile solo su mobile nel pill Menu */
.ic-burger{display:none;align-self:center;flex-shrink:0;}

/* ---- Mobile / phone ≤ 768px ---- */
@media (max-width:768px){
  /* Nav: Solutions nascosto; padding 12px tutti i lati (Figma 1017:658) */
  .navpill-wrap--left{display:none;}
  .nav{padding:12px;}
  /* Menu wrap: 126×48px (Figma), button chiuso */
  .navpill-wrap:not(.navpill-wrap--left){height:48px;width:126px;}
  /* Navpill mobile: 126×48px (Figma), icone assolute per non gonfiare l'altezza */
  .navpill-wrap:not(.navpill-wrap--left) .navpill{
    width:126px;height:48px;padding:16px;align-items:center;
  }
  /* Temi dark/light: stessa logica desktop, specificità più alta per vincere sul default glass */
  .nav--on-dark .navpill-wrap:not(.navpill-wrap--left):not(.is-expanding) .navpill{
    color:var(--white);background:rgba(255,255,255,.0);border-color:rgba(255,255,255,.22);
  }
  .nav--on-dark .navpill-wrap:not(.navpill-wrap--left):not(.is-expanding) .navpill:hover{background:rgba(255,255,255,.24);}
  .nav--on-light .navpill-wrap:not(.navpill-wrap--left):not(.is-expanding) .navpill{
    color:var(--ink);background:rgba(34,34,34,.07);border-color:rgba(34,34,34,.12);
  }
  .nav--on-light .navpill-wrap:not(.navpill-wrap--left):not(.is-expanding) .navpill:hover{background:rgba(34,34,34,.15);}
  .navpill-wrap:not(.navpill-wrap--left) .navpill .ic-chevron,
  .navpill-wrap:not(.navpill-wrap--left) .navpill .ic-burger{
    position:absolute;right:16px;top:50%;transform:translateY(-50%);
  }
  /* Button espande a piena larghezza meno 12px su ogni lato — stessa animazione desktop */
  .navpill-wrap:not(.navpill-wrap--left).is-expanding .navpill{
    width:calc(100dvw - 24px);
  }
  /* Panel: stessa larghezza del button espanso, altezza auto, gap link→CTA 60px */
  .navpill-wrap:not(.navpill-wrap--left) .navpill__panel{
    width:calc(100dvw - 24px);
    height:auto;
    gap:60px;
  }
  .navpill-wrap:not(.navpill-wrap--left) .navpanel__links{flex:0 0 auto;}

  /* Icona: swap hamburger ↔ minus con opacity transition */
  .navpill-wrap:not(.navpill-wrap--left) .ic-chevron{
    display:block;
    opacity:0;
    transition:opacity .2s ease;
  }
  .navpill-wrap:not(.navpill-wrap--left) .ic-burger{
    display:block;
    opacity:1;
    transition:opacity .2s ease;
  }
  .navpill-wrap:not(.navpill-wrap--left).is-expanding .navpill .ic-chevron{opacity:1;}
  .navpill-wrap:not(.navpill-wrap--left).is-expanding .navpill .ic-burger{opacity:0;}
  .navpill-wrap:not(.navpill-wrap--left).is-expanding .navpill{border-bottom-color:transparent;}

  /* Hero */
  .hero__head{gap:12px;}
  .hero__content{gap:24px;}
  .hero__title{font-size:1.75rem;letter-spacing:-0.03em;max-width:none;}
  .hero .btn--glass{width:100%;}

  /* Intro */
  .intro-hero__inner{padding-top:60px;padding-bottom:60px;gap:60px;}
  .intro__lead{font-size:1.75rem;line-height:1.2;letter-spacing:-0.03em;}
  .intro__watermark{display:none;}

  /* Stats → carte bianche singola colonna */
  .stats{display:flex;flex-direction:column;gap:20px;}
  .stat{
    background:var(--white);
    border:1px solid rgba(17,17,17,0.1);
    border-radius:16px;
    padding:32px 24px;
    display:flex;flex-direction:column;gap:32px;
    min-height:180px;
  }
  .stat__num{font-size:2.25rem;font-weight:300;color:var(--blue);line-height:1.2;letter-spacing:-0.04em;}
  .stat__label{font-size:1rem;line-height:1.48;}

  /* Case study: eyebrow+titolo → immagine → meta+quote+CTA */
  .case__grid{display:flex;flex-direction:column;}
  .case__text{display:contents;}
  .case__top{order:1;padding:60px 20px 24px;}
  .case__media{order:2;margin:0 20px;}
  .case__media img{height:471px;min-height:0;width:100%;object-fit:cover;border-radius:16px;}
  .case__detail{order:3;padding:40px 20px 60px;margin-left:0;margin-top:0;gap:32px;}
  .case__title{font-size:1.75rem;}

  /* Overlay backdrop menu mobile */
  .nav-overlay{
    display:block;
    position:fixed;inset:0;z-index:49;
    background:rgba(34,34,34,.6);
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
    opacity:0;pointer-events:none;
    transition:opacity .3s ease;
  }
  body.menu-open .nav-overlay{opacity:1;pointer-events:auto;}

  /* Eyebrow mobile: 12px, letter-spacing 0 — esclusi quelli nell'hero */
  .eyebrow{font-size:12px;letter-spacing:0;}
  .hero .eyebrow{font-size:0.875rem;letter-spacing:.02em;}

  /* Gap eyebrow→title: 12px — regola globale mobile */
  .sol-intro{gap:12px;}
  .sol-item__head{gap:12px;}
  .sol-item__body{gap:20px;}
  .about-ai__head{gap:12px;}
  .about-partners__head{gap:12px;}

  /* ── Solutions mobile ──────────────────────────────────────── */

  /* 1. Rimuovi max-width su tutte le headline */
  .sol-intro__title{max-width:none;}

  /* Header: padding ridotto, gap intro→filtri ridotto */
  .sol-header{padding:120px var(--pad) 60px;gap:32px;}

  /* Filtri ancora: riga orizzontale scrollabile full-viewport
     margin negativo rompe il padding del header, poi re-padding laterale */
  .sol-filters{
    flex-wrap:nowrap;
    overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    margin:0 calc(-1 * var(--pad));
    padding:4px var(--pad);
  }
  .sol-filters::-webkit-scrollbar{display:none;}

  /* Category: padding ridotto, font ridotto */
  .sol-category{padding:60px var(--pad) 0;}
  .sol-category--next{padding-top:60px;}
  .sol-category__title{font-size:2rem;letter-spacing:-0.04em;}
  .sol-category__sub{font-size:1rem;line-height:1.5;max-width:none;}

  /* 2. Ordine card: head → img → tail (come about-ai / about-partners)
     display:contents scioglie il wrapper → head e tail diventano figli diretti del flex */
  .sol-item{position:static;gap:20px;will-change:auto;}
  .sol-item__body{display:contents;}
  .sol-item__head{order:1;}
  .sol-item__img{flex:none;order:2;}
  .sol-item__tail{order:3;width:100%;align-items:flex-start;gap:20px;}
  .sol-item__cta{width:100%;flex:none;}

  /* 4. Rimuovi sticky → niente overlap, CTA sempre visibile */

  /* 3. Big cards: max-width titolo 90% su mobile */
  .sol-bigcard__title{max-width:90%;font-size:1.75rem;}
  .sol-bigcards{padding:60px var(--pad);}
  /* ─────────────────────────────────────────────────────────── */

  /* About — mobile overrides (Figma 481:1069) */
  /* --pad a 20px: tutte le .wrap usano 20px di margine laterale */
  :root{--pad:20px;}

  /* Hero about: titolo a 120px dal top, sub-testo a 60px dal bottom */
  .hero__content--about{top:120px;bottom:auto;left:20px;width:calc(100% - 40px);gap:12px;}
  .about-hero__sub{bottom:60px;left:24vw;right:20px;width:auto;max-width:100%;font-size:1rem;line-height:1.5;}

  /* Intro: 60px dal hero, testo full-width senza max-width */
  .about-intro{padding:60px 0 0;}
  .about-intro__lead{font-size:1.75rem;letter-spacing:-0.03em;line-height:1.2;max-width:none;}

  /* Stats: num 5rem (80px Figma), label 1.25rem, desc 1rem stacked */
  .about-stats{padding-top:40px;}
  .about-stat-row{padding:40px 0;gap:16px;}
  .about-stat__num{font-size:4rem;line-height:1;}
  .about-stat__lbl{font-size:1.25rem;line-height:1.3;}
  .about-stat__desc{font-size:1rem;line-height:1.5;padding-top:8px;}

  /* Bridge: padding ridotto, titolo left-aligned 2rem (32px Figma) */
  .about-bridge{padding:60px 0;}
  .about-bridge__title{font-size:2rem;letter-spacing:-0.03em;text-align:center;margin:0 0 40px;max-width:none;padding:0 20px;}

  /* Why: gap compatto, titolo 1.625rem (26px Figma), CTA full-width */
  .about-why{padding:60px 0;}
  .about-why__inner{gap:20px;}
  .about-why__title{font-size:1.625rem;letter-spacing:-0.03em;line-height:1.2;}
  .about-why__copy p{font-size:1rem;line-height:1.5;}
  .about-why__body{gap:32px;}
  .about-why__cta{width:100%;flex:none;}

  /* AI: reorder mobile → img / head / body (Figma 481:1069) */
  .about-ai{padding-bottom:60px;}
  .about-ai__inner{gap:20px;}
  .about-ai__media img{height:265px;}
  /* display:contents scioglie il wrapper → head e body diventano figli diretti del grid */
  .about-ai__text{display:contents;}
  .about-ai__head{order:1;}
  .about-ai__media{order:2;}
  .about-ai__body{order:3;font-size:1rem;line-height:1.5;}
  .about-ai__title{font-size:2rem;letter-spacing:-0.03em;line-height:1.2;}

  /* Partners: reorder mobile → head / img / body+cta (Figma 481:1069) */
  .about-partners-section{padding-bottom:60px;}
  .about-partners__inner{gap:20px;}
  .about-partners__title{font-size:2rem;letter-spacing:-0.03em;line-height:1.2;}
  /* display:contents scioglie il wrapper → head e bottom diventano figli diretti del grid */
  .about-partners__text{display:contents;}
  .about-partners__head{order:1;}
  .about-partners__media{order:2;}
  .about-partners__bottom{order:3;gap:24px;}
  .about-partners__body{font-size:1rem;line-height:1.5;}
  .about-partners__cta{display:none;} /* Phase 2: Partner page TBD — nascosta anche su mobile */
  .about-partners__media img{height:378px;}

  /* Let's talk */
  .talk__card{min-height:471px;border-radius:16px;padding:24px;}
  .talk__title{font-size:1.5rem;}

  /* Vendors */
  .vendors__title{font-size:1.5rem;text-align:center;}

  /* Footer */
  .footer__inner{gap:60px;}
  .footer__top{flex-direction:column;gap:60px;align-items:stretch;}
  .footer__brand{width:100%;align-items:center;}
  .footer__address{text-align:center;}
  .footer__col{display:none;}
  .footer__cols{flex-direction:column;gap:0;}
  .partner{width:100%;}
  .footer__bar{align-items:center;text-align:center;}

  /* Mobile nav links */
  .footer__mobile-links{
    display:flex;flex-direction:column;gap:40px;
    border-top:1px solid var(--ink);
    padding-top:60px;
    width:100%;
  }
  .footer__mobile-links a{
    font-size:2rem;font-weight:400;
    color:var(--ink);text-decoration:none;
    text-align:center;line-height:1.1;
  }
}

@media (max-width:560px){
  :root{--pad:20px;}
  .stats{grid-template-columns:1fr;}
  .intro__actions{flex-direction:column;}
  .btn--outline{width:100%;}
  .hero .btn--glass,.talk .btn--glass,.case__detail .btn--glass{width:100%;}
  /* case__meta resta in riga su mobile (Figma mostra affiancati) */
  .case__meta{flex-direction:row;gap:20px;}
  .footer__bar{flex-direction:column;align-items:center;gap:16px;text-align:center;}
  .footer__legal{gap:24px;}
  .partner{width:100%;}
}

/* ===== SOLUTIONS ===== */
.sol-main{margin-top:0;}

/* ===== CASE STUDIES ===== */
.cs-main{margin-top:0;}
.cs-header{gap:74px;}
.cs-header .sol-intro{max-width:1280px;}

.cs-cases{padding:0 var(--pad) 160px;}
.cs-case{
  display:flex;flex-direction:column;gap:40px;
  position:sticky;top:100px;
  background:var(--bg);border-radius:20px;
  transform-origin:center top;will-change:transform;
  margin-top:120px;
}
.cs-case:first-child{margin-top:0;}
.cs-case:nth-child(1){z-index:1;}
.cs-case:nth-child(2){z-index:2;}
.cs-case:nth-child(3){z-index:3;}
.cs-case:nth-child(4){z-index:4;}
.cs-case:nth-child(5){z-index:5;}
.cs-case__separator{height:1px;background:var(--border-soft);}
.cs-case__row{display:flex;gap:40px;align-items:stretch;}
.cs-case__img{
  flex:0 0 calc(50% - 10px);width:calc(50% - 10px);
  height:520px;border-radius:16px;object-fit:cover;
}
.cs-case__body{
  flex:1;min-width:0;
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;
  height:520px;
}
.cs-case__head{display:flex;flex-direction:column;gap:40px;width:100%;}
.cs-case__title-wrap{display:flex;flex-direction:column;gap:20px;}
.cs-case__title{
  margin:0;font-size:clamp(2rem,3.5vw,3rem);font-weight:300;
  line-height:1.2;letter-spacing:-0.03em;color:var(--ink);
}
.cs-case__meta{display:flex;gap:20px;width:100%;}
.cs-meta-item{flex:1;display:flex;flex-direction:column;gap:6px;}
.cs-meta-label{font-size:0.875rem;font-weight:500;text-transform:uppercase;letter-spacing:0;color:#777;}
.cs-meta-value{font-size:1rem;font-weight:300;color:var(--ink);}
.cs-case__cta{flex:none;width:325px;}

/* ── Case Studies — mobile (dopo le regole base per vincere la cascata) ── */
@media (max-width:768px){
  .cs-header{gap:40px;}
  .cs-header .sol-intro{max-width:none;}
  .cs-cases{padding:0 var(--pad) 80px;}

  /* Rimuovi sticky + azzera transform residui dal JS scale */
  .cs-case{position:static;margin-top:60px;gap:0;will-change:auto;transform:none;}
  .cs-case:first-child{margin-top:0;}

  /* Row → colonna */
  .cs-case__row{flex-direction:column;gap:20px;align-items:stretch;}

  /* display:contents su body e head → title-wrap, img, meta, cta
     diventano figli diretti del flex row e si riordinano */
  .cs-case__body{display:contents;}
  .cs-case__head{display:contents;}

  /* Ordine: eyebrow+titolo(1) → immagine(2) → meta(3) → cta(4) */
  .cs-case__title-wrap{order:1;padding-top:40px;gap:12px;}
  .cs-case__img{order:2;flex:none;width:100%;max-width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:16px;}
  .cs-case__meta{order:3;flex-direction:column;gap:16px;}
  .cs-case__cta{order:4;width:100%;flex:none;}

  .cs-case__body{height:auto;}
  .cs-case__title{font-size:1.75rem;}
  .cs-meta-item{flex:none;}
  .cs-meta-label{font-size:12px;letter-spacing:0;}
}

/* footer email link — underline animato */
.footer__email{
  color:inherit;text-decoration:none;
  position:relative;
}
.footer__email::after{
  content:'';position:absolute;left:0;bottom:-4px;
  height:1px;width:100%;background:currentColor;
  transform:scaleX(0);transform-origin:right;
  transition:transform 1s cubic-bezier(.6,0,.2,1);
}
.footer__email:hover::after{
  transform:scaleX(1);transform-origin:left;
}


/* ============================================================
   SOLUTIONS BLOCKS — 6 componenti da blocks.html (dev only)
   Selettori tutti .sol-* nuovi: nessuna regola condivisa
   (.eyebrow, .btn, .nav, .case, .hero, .sol-item base) è
   modificata qui. Solo overrides scoped al container.
   Token: --radius --section-y --gap-cols --gap --gap-sm --gap-xs
   Colonne: grid + fr (niente flex % né calc con gap manuale).
   Immagini: aspect-ratio + object-fit:cover + var(--radius).
   ============================================================ */

/* ---- 1. sol-hero (Figma 1056:630) ----------------------------- */
.sol-hero{
  background:var(--bg);
  padding:200px var(--pad) var(--section-y);
  display:flex;flex-direction:column;gap:var(--gap-cols);
}
.sol-hero__head{
  display:flex;flex-direction:column;gap:var(--gap-sm);
  max-width:min(1130px,83%);
}
.sol-hero__title{
  margin:0;
  font-size:clamp(2.5rem,4.44vw,4rem);
  font-weight:300;line-height:1.2;letter-spacing:-0.04em;
}
/* gap tra immagine e tail = --section-y (stesso valore 120px, uso dedicato) */
.sol-hero__body{
  display:flex;flex-direction:column;gap:var(--section-y);
  align-items:flex-end;
}
.sol-hero__img{
  width:100%;max-width:100%;
  aspect-ratio:1672/941;
  object-fit:cover;border-radius:var(--radius);display:block;
}
.sol-hero__tail{
  width:min(670px,100%);padding-right:80px;
  display:flex;flex-direction:column;gap:var(--gap);align-items:flex-start;
}
.sol-hero__desc{margin:0;font-size:1.25rem;font-weight:300;line-height:1.48;letter-spacing:-0.02em;}
.sol-hero__cta{width:325px;}

/* ---- 2. sol-demo (Figma 1056:765) ----------------------------- */
/* col immagine (900px) : col testo (400px) = 9fr 4fr; gap 60px */
.sol-demo{
  background:#f0f0f0;
  padding:var(--section-y) var(--pad);
  display:flex;flex-direction:column;gap:var(--gap-cols);
}
.sol-demo__title{
  margin:0;
  font-size:clamp(2.5rem,4.44vw,4rem);
  font-weight:300;line-height:1.2;letter-spacing:-0.04em;
  max-width:min(1130px,83%);
}
.sol-demo__row{
  display:grid;grid-template-columns:9fr 4fr;gap:var(--gap-cols);
  align-items:end;
}
.sol-demo__img{
  width:100%;height:auto;display:block;
  border-radius:var(--radius);
  align-self:end;
}
.sol-demo__aside{display:flex;flex-direction:column;gap:var(--gap);}
.sol-demo__desc{margin:0;font-size:1.125rem;font-weight:300;line-height:1.48;letter-spacing:-0.02em;max-width:50ch;}
.sol-demo__cta{width:325px;}

/* ---- 3. sol-features (Figma 1057:941) ------------------------- */
.sol-features{
  background:var(--bg);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--gap-sm);
  padding:var(--section-y) var(--pad);
}
.sol-features__card{
  background:#fff;border-radius:var(--radius);
  padding:32px 24px;
  display:flex;flex-direction:column;gap:var(--gap);
}
.sol-features__title{
  margin:0;font-size:1.5rem;font-weight:300;
  color:var(--blue);line-height:1.2;letter-spacing:-0.03em;
}
.sol-features__text{
  margin:0;font-size:1.125rem;font-weight:300;
  line-height:1.48;letter-spacing:-0.02em;color:var(--ink);
}

/* ---- 3b. sol-features--flush (variante: nessun padding verticale) ----- */
.sol-features--flush{padding-top:0;padding-bottom:0;}

/* ---- 4. sol-how (Figma 1057:984) ------------------------------ */
/* col lead (sticky) : col steps = 1fr 1fr */
.sol-how{
  background:var(--bg);
  display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-sm);
  align-items:start;
  padding:var(--section-y) var(--pad);
}
.sol-how__lead{
  display:flex;flex-direction:column;gap:var(--gap-sm);
  position:sticky;top:var(--section-y);
}
.sol-how__lead .eyebrow{color:var(--ink-strong);}
.sol-how__title{
  margin:0;font-size:clamp(1.75rem,2.78vw,2.5rem);
  font-weight:300;line-height:1.2;letter-spacing:-0.04em;
  padding-right:80px;
}
.sol-how__steps{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;
}
.sol-how__step{
  display:flex;flex-direction:column;gap:var(--gap-cols);
  padding:var(--gap) 0;
  border-bottom:1px solid #d6d6d6;
}
.sol-how__step:first-child{border-top:1px solid #d6d6d6;}
.sol-how__step-head{display:flex;flex-direction:column;gap:var(--gap-xs);}
.sol-how__step-label{
  margin:0;color:var(--blue);
  font-size:0.875rem;font-weight:500;text-transform:uppercase;letter-spacing:0;
}
.sol-how__step-title{
  margin:0;font-size:1.5rem;font-weight:300;
  line-height:1.2;letter-spacing:-0.03em;
}
.sol-how__step-body{padding-right:var(--gap);}
.sol-how__step-text{
  margin:0;font-size:1.125rem;font-weight:300;
  line-height:1.48;letter-spacing:-0.02em;
}

/* ---- 4b. sol-how--with-cta (variante: CTA nella colonna sinistra) --- */
/* Il blocco base NON è modificato. Questa variante aggiunge solo lo slot CTA. */
.sol-how--with-cta .sol-how__lead{gap:var(--gap);}
.sol-how__lead-cta{display:none;}
.sol-how--with-cta .sol-how__lead-cta{display:inline-flex;width:325px;}
.sol-how--with-cta .sol-how__lead-cta.cta--pending{display:none;} /* asset non ancora pronto (es. brochure mancante) */

/* ---- 5. sol-industry (Figma 1057:1031) ------------------------ */
/* col testo (630px) : col media (670px) = 63fr 67fr; gap 60px   */
/* align-items:stretch → colonna testo si pareggia all'altezza    */
/* della colonna media (che è dettata dall'immagine naturale).    */
/* .sol-industry__media ha align-self:start → se il testo fosse  */
/* più alto, l'immagine resta in cima senza stirarsi.             */
.sol-industry{
  background:#171717;
  padding:var(--section-y) var(--pad);
  display:grid;grid-template-columns:63fr 67fr;gap:var(--gap-cols);
  align-items:stretch;
}
/* justify-content:space-between: head in alto, desc+CTA ancorati
   al fondo — si allineano al fondo dell'immagine quando questa
   è più alta del testo. */
.sol-industry__text{
  display:flex;flex-direction:column;justify-content:space-between;
}
.sol-industry__head{display:flex;flex-direction:column;gap:var(--gap-sm);}
.sol-industry__eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:0.875rem;font-weight:500;
  text-transform:uppercase;letter-spacing:0;
  line-height:1.1;color:var(--bg);margin:0;
}
.sol-industry__dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--bg);flex:0 0 auto;
}
.sol-industry__title{
  margin:0;font-size:clamp(2rem,3.75vw,3.375rem);
  font-weight:300;line-height:1.2;letter-spacing:-0.04em;color:#f7f7f7;
}
/* centering bilaterale: Figma usa items-center sul flex col, __bottom è 440px
   dentro 630px → (630-440)/2 = 95px su ogni lato. align-self:center lo
   replica proporzionalmente senza px fissi. */
.sol-industry__bottom{
  width:min(440px,100%);display:flex;flex-direction:column;gap:var(--gap);
  align-self:center;
}
.sol-industry__desc{
  margin:0;font-size:1.25rem;font-weight:300;line-height:1.48;letter-spacing:-0.02em;
  color:#f7f7f7;max-width:50ch;
}
.sol-industry__cta{width:325px;}
/* media: ratio naturale — l'immagine detta l'altezza del blocco  */
.sol-industry__media{
  border-radius:var(--radius);
  align-self:start; /* se il testo fosse più alto, non si stira  */
}
.sol-industry__media img{
  width:100%;height:auto;display:block;border-radius:var(--radius);
}

/* ---- 6. sol-subcards (Figma 1057:1088) ------------------------ */
/* col media : col cards = 134fr 111fr (670px : 555px da Figma) */
.sol-subcards{
  background:#f0f0f0;
  padding:var(--section-y) var(--pad);
  display:flex;flex-direction:column;gap:var(--gap-cols);
}
.sol-subcards__head{display:flex;flex-direction:column;gap:var(--gap-sm);}
.sol-subcards__head .eyebrow{color:var(--ink-strong);}
.sol-subcards__title{
  margin:0;font-size:clamp(2.5rem,4.44vw,4rem);
  font-weight:300;line-height:1.2;letter-spacing:-0.04em;
  max-width:min(1193px,88%);
}
.sol-subcards__grid{
  display:grid;grid-template-columns:134fr 27fr 111fr;gap:0;
  align-items:stretch;
}
.sol-subcards__media{
  grid-column:1;
  max-width:100%;
  border-radius:var(--radius);
  align-self:end;
}
.sol-subcards__media img{width:100%;height:auto;display:block;border-radius:var(--radius);}
.sol-subcards__cards{grid-column:3;display:flex;flex-direction:column;height:100%;justify-content:flex-end;gap:var(--gap-sm);}
.sol-subcards__card{
  background:#fff;border-radius:var(--radius);
  padding:32px 24px;
  display:flex;flex-direction:column;gap:var(--gap);
}
.sol-subcards__card-head{display:flex;flex-direction:column;gap:var(--gap-xs);}
.sol-subcards__card-label{
  margin:0;font-size:0.875rem;font-weight:500;
  text-transform:uppercase;letter-spacing:0;color:var(--blue);
}
.sol-subcards__card-title{
  margin:0;font-size:1.5rem;font-weight:300;
  line-height:1.2;letter-spacing:-0.03em;
}
.sol-subcards__card-text{
  margin:0;font-size:1.125rem;font-weight:300;
  line-height:1.48;letter-spacing:-0.02em;
}

/* ---- 6b. sol-subcards--no-media (variante senza immagine) ----- */
.sol-subcards--no-media .sol-subcards__media{display:none;}
.sol-subcards--no-media .sol-subcards__grid{
  grid-template-columns:1fr 1fr;
  gap:var(--gap-sm);
  align-items:stretch;
}
.sol-subcards--no-media .sol-subcards__cards{
  grid-column:auto;
  display:contents;
}
.sol-subcards--no-media .sol-subcards__card{
  height:100%;
  justify-content:flex-start;
}

/* ---- Solutions blocks — mobile (≤768px) ----------------------- */
@media (max-width:768px){
  .sol-hero{padding:120px var(--pad) var(--section-y-mobile);gap:var(--gap-sm);}
  .sol-hero__head{max-width:none;gap:var(--gap-xs);}
  .sol-hero__title{font-size:1.75rem;}
  .sol-hero__body{gap:var(--gap-sm);}
  .sol-hero__tail{width:100%;padding-right:0;}
  .sol-hero__desc{font-size:1rem;}
  .sol-hero__cta{width:100%;}

  .sol-demo{padding:var(--section-y-mobile) var(--pad);gap:var(--gap-sm);}
  .sol-demo__title{font-size:1.75rem;max-width:none;}
  .sol-demo__row{grid-template-columns:1fr;gap:var(--gap-sm);align-items:start;}
  .sol-demo__img{align-self:auto;}
  .sol-demo__desc{font-size:0.875rem;max-width:none;}
  .sol-demo__cta{width:100%;}

  .sol-features{grid-template-columns:1fr;padding:var(--section-y-mobile) var(--pad);}
  .sol-features--flush{padding-top:0;padding-bottom:0;}
  .sol-features__title{font-size:1.25rem;}
  .sol-features__text{font-size:0.875rem;}

  .sol-how{grid-template-columns:1fr;gap:var(--gap);padding:var(--section-y-mobile) var(--pad);}
  .sol-how__lead{position:static;gap:var(--gap-xs);}
  .sol-how--with-cta .sol-how__lead{gap:var(--gap-sm);}
  .sol-how__title{font-size:1.75rem;padding-right:0;}
  .sol-how__step{gap:var(--gap-sm);padding:32px 0;}
  .sol-how__step-body{padding-right:0;}
  .sol-how__step-label{font-size:0.75rem;}
  .sol-how__step-title{font-size:1.25rem;}
  .sol-how__step-text{font-size:0.875rem;}

  .sol-industry{display:flex;flex-direction:column;gap:var(--gap-sm);padding:var(--section-y-mobile) var(--pad);}
  .sol-industry__text{display:contents;}
  .sol-industry__head{order:1;gap:var(--gap-xs);}
  .sol-industry__eyebrow{font-size:0.75rem;}
  .sol-industry__media{order:2;border-radius:var(--radius);overflow:hidden;align-self:auto;width:100%;}
  .sol-industry__bottom{order:3;width:100%;align-self:auto;}
  .sol-industry__title{font-size:1.75rem;}
  .sol-industry__desc{font-size:1rem;max-width:none;}
  .sol-industry__cta{width:100%;}

  .sol-subcards{padding:var(--section-y-mobile) var(--pad);gap:var(--gap-sm);}
  .sol-subcards__head{gap:var(--gap-xs);}
  .sol-subcards__title{font-size:1.75rem;max-width:none;}
  .sol-subcards__grid{grid-template-columns:1fr;gap:var(--gap-sm);}
  .sol-subcards__media{grid-column:auto;align-self:auto;}
  .sol-subcards__cards{grid-column:auto;height:auto;justify-content:flex-start;}
  .sol-subcards__card-label{font-size:0.75rem;}
  .sol-subcards__card-title{font-size:1.25rem;}
  .sol-subcards__card-text{font-size:0.875rem;}
  /* variante senza immagine — mobile */
  .sol-subcards--no-media .sol-subcards__grid{grid-template-columns:1fr;gap:var(--gap-sm);}
}

/* ============================================================
   CASE STUDY LIBRARY — blocchi cs-* (Figma 1103:1228 / 1103:1360)
   Hero full-width + colonna offset a destra con moduli componibili.
   ============================================================ */

/* ---- case-hero (Figma 1103:1228) ----------------------------- */
.case-hero{
  background:var(--bg);
  padding:200px var(--pad) var(--section-y);
  display:flex;flex-direction:column;gap:var(--section-y);
}
.case-hero__head{display:flex;flex-direction:column;gap:var(--gap-cols);}
.case-hero__title{
  margin:0;max-width:1132px;
  font-size:4rem;font-weight:300;line-height:1.2;letter-spacing:-0.04em;color:var(--ink);
}
/* l'eyebrow + headline raggruppati: gap 20px (Figma 1103:1250) */
.case-hero__intro{display:flex;flex-direction:column;gap:var(--gap-sm);}
.case-hero__img{
  width:100%;height:auto;display:block;
  aspect-ratio:1536/1024;object-fit:cover;
  border-radius:var(--radius);
}
.case-hero__summary{
  margin:0;max-width:80vw;
  font-size:3rem;font-weight:300;line-height:1.2;letter-spacing:-0.04em;color:var(--ink);
}
.case-hero__bottom{display:flex;flex-direction:column;gap:var(--gap);}
.case-hero__meta{display:flex;gap:var(--gap-sm);flex-wrap:wrap;}
.case-hero__meta-item{display:flex;flex-direction:column;gap:var(--gap-xs);width:325px;max-width:100%;}
.case-hero__meta-label{margin:0;font-size:0.875rem;font-weight:500;letter-spacing:0;color:var(--ink);}
.case-hero__meta-value{margin:0;font-size:1rem;font-weight:300;color:var(--ink);}

/* ---- case-main : contenitore a colonna offset (Figma 1103:1360) -- */
/* pl 490/1440 ≈ 34% ; colonna ~900px a 1440, tetto 1200px su schermi grandi */
.case-main{
  background:var(--bg);
  padding:var(--section-y) var(--pad) 80px 34%;
}
.case-main__col{
  max-width:1200px;
  display:flex;flex-direction:column;gap:var(--gap-lg);
}

/* ---- cs-text : titolo + intro + N sotto-punti + chiusura opz. --- */
.cs-text{display:flex;flex-direction:column;gap:var(--gap-sm);color:var(--ink);}
.cs-text__title{margin:0;font-size:2rem;font-weight:400;line-height:1.4;}
.cs-text__body{display:flex;flex-direction:column;gap:var(--gap);}
.cs-text__intro{margin:0;font-size:1.125rem;font-weight:300;line-height:1.6;}
.cs-text__point{display:flex;flex-direction:column;gap:8px;}
.cs-text__point-title{margin:0;font-size:1.25rem;font-weight:500;line-height:1.6;}
.cs-text__point-text{margin:0;font-size:1.125rem;font-weight:300;line-height:1.6;}
.cs-text__closing{margin:0;font-size:1.125rem;font-weight:300;line-height:1.6;}

/* ---- cs-quote : citazione grande + attribuzione ----------------- */
.cs-quote{margin:0;padding-right:80px;display:flex;flex-direction:column;gap:var(--gap-sm);color:var(--ink);}
.cs-quote__text{
  margin:0;font-size:2.5rem;font-weight:300;line-height:1.2;letter-spacing:-0.04em;
}
.cs-quote__cite{display:flex;flex-direction:column;gap:8px;font-style:normal;}
.cs-quote__name{margin:0;font-size:1.125rem;font-weight:400;}
.cs-quote__role{margin:0;font-size:0.875rem;font-weight:300;}

/* ---- cs-image : immagine a larghezza colonna -------------------- */
.cs-image{width:100%;}
.cs-image__img{
  width:100%;height:auto;display:block;
  border-radius:var(--radius);
}

/* ---- cs-stats : card statistiche, griglia adattiva (auto-fit) --- */
.cs-stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:var(--gap-sm);
}
.cs-stats__card{
  background:var(--white);border:1px solid var(--white);border-radius:var(--radius);
  padding:32px 24px;
  display:flex;flex-direction:column;gap:var(--gap-cols);
}
.cs-stats__num{
  margin:0;font-size:2.25rem;font-weight:300;line-height:1.2;letter-spacing:-0.04em;color:var(--blue);
}
.cs-stats__desc{
  margin:0;font-size:1.125rem;font-weight:300;line-height:1.48;letter-spacing:-0.02em;color:var(--ink);
}

/* ---- case-main: sotto 1024px l'offset sparisce, colonna piena --- */
@media (max-width:1024px){
  .case-main{padding:var(--section-y) var(--pad) 80px;}
  .case-main__col{max-width:none;}
}

/* ---- Case Study mobile (≤768px) -------------------------------- */
@media (max-width:768px){
  .case-hero{padding:120px var(--pad) var(--section-y-mobile);gap:var(--section-y-mobile);}
  .case-hero__head{gap:var(--gap-sm);}
  .case-hero__intro{gap:var(--gap-xs);}
  .case-hero__title{font-size:2.25rem;letter-spacing:-0.03em;}
  .case-hero__summary{font-size:1.5rem;letter-spacing:-0.03em;}
  .case-hero__bottom{gap:var(--gap-sm);}
  .case-hero__meta{flex-direction:column;gap:var(--gap-sm);}
  .case-hero__meta-item{width:100%;}

  .case-main{padding:var(--section-y-mobile) var(--pad);}
  .case-main__col{gap:var(--gap-cols);}

  .cs-text__title{font-size:1.5rem;}
  .cs-text__intro,.cs-text__point-text,.cs-text__closing{font-size:1rem;}
  .cs-text__point-title{font-size:1.25rem;}

  .cs-quote__text{font-size:1.5rem;letter-spacing:-0.03em;}

  .cs-stats{grid-template-columns:1fr;}
  .cs-stats__card{gap:var(--gap-sm);}
  .cs-stats__num{font-size:2rem;}
  .cs-stats__desc{font-size:1rem;}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto;}
  .marquee__track{animation:none !important;}
}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px;}