:root{
  --dark-teal:#053339;
  --light-blue:#eef7f4;
  --sand:#ede0d4;
  --white:#ffffff;
  --electric-blue:#0027ea;
  --highlighter:#eefe23;
  --font-display:"Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-body:"DM Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --radius-sm:12px;
  --radius-md:20px;
  --radius-lg:32px;
  --radius-pill:999px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  background:var(--light-blue);
  color:var(--dark-teal);
  font-size:17px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}

/* ------------------- Typography ------------------- */
.display{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:-0.035em;
  line-height:.95;
}
.eyebrow{
  font-family:var(--font-body);
  font-weight:500;
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:28px;height:1.5px;background:currentColor;opacity:.6;
}

/* ------------------- Shared layout ------------------- */
.wrap{max-width:1280px;margin:0 auto;padding:0 32px}
section{padding:120px 0;position:relative}

/* ------------------- NAV ------------------- */
.nav{
  position:fixed;top:20px;left:50%;transform:translateX(-50%);
  z-index:100;
  width:calc(100% - 40px);max-width:1280px;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 14px 14px 26px;
  background:rgba(0,56,63,.82);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-radius:var(--radius-pill);
  color:var(--light-blue);
  transition:background .35s var(--ease), box-shadow .35s var(--ease);
}
.nav__logo{height:22px;display:flex;align-items:center}
.nav__logo svg{height:100%;width:auto}
.nav__links{display:flex;gap:32px;align-items:center}
.nav__links a{
  font-size:14.5px;font-weight:500;
  position:relative;opacity:.7;transition:opacity .2s;
}
.nav__links a:hover{opacity:1}
.nav__links a.active{opacity:1}
.nav__links a.active::after{
  content:"";
  position:absolute;bottom:-4px;left:0;right:0;
  height:1.5px;background:currentColor;border-radius:1px;
}
.nav__cta{
  background:var(--highlighter);
  color:var(--dark-teal);
  padding:11px 22px;
  border-radius:var(--radius-pill);
  font-weight:600;font-size:14.5px;
  transition:transform .25s var(--ease), background .25s;
  display:inline-flex;align-items:center;gap:8px;
}
.nav__cta:hover{transform:translateY(-2px);background:#f6ff5a}
.nav__burger{display:none}

/* Mobile burger icon toggle */
.nav__burger .close-icon{display:none}
.nav__burger.open .burger-icon{display:none}
.nav__burger.open .close-icon{display:block}
.nav__mobile{display:none}

@media (max-width:860px){
  .nav{padding:12px 14px 12px 20px}
  .nav__links{display:none}
  .nav__cta{display:none}
  .nav__burger{
    display:flex;width:42px;height:42px;border-radius:50%;
    background:var(--highlighter);color:var(--dark-teal);
    align-items:center;justify-content:center;
    flex-shrink:0;
  }

  /* Mobile dropdown menu */
  .nav__mobile{
    display:flex;flex-direction:column;gap:4px;
    position:fixed;top:80px;left:20px;right:20px;
    z-index:99;
    background:rgba(5,51,57,.97);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    border-radius:24px;
    padding:20px;
    border:1px solid rgba(230,253,255,.1);
    opacity:0;
    transform:translateY(-12px);
    pointer-events:none;
    transition:opacity .22s var(--ease), transform .22s var(--ease);
  }
  .nav__mobile.open{
    opacity:1;transform:translateY(0);pointer-events:all;
  }
  .nav__mobile a{
    color:var(--light-blue);
    font-size:17px;font-weight:500;
    padding:14px 18px;
    border-radius:14px;
    opacity:.8;
    transition:background .18s, opacity .18s;
  }
  .nav__mobile a:hover,.nav__mobile a.active{
    background:rgba(230,253,255,.08);opacity:1;
  }
  .nav__mobile-cta{
    background:var(--highlighter) !important;
    color:var(--dark-teal) !important;
    font-weight:600 !important;
    opacity:1 !important;
    text-align:center;
    margin-top:8px;
  }
  .nav__mobile-cta:hover{background:#f6ff5a !important}
}

/* ------------------- HERO ------------------- */
.hero{
  min-height:100vh;
  padding-top:160px;padding-bottom:100px;
  background:var(--light-blue);
  position:relative;overflow:hidden;
  display:flex;align-items:center;
}
.hero__blob-1,.hero__blob-2{
  position:absolute;border-radius:50%;
  pointer-events:none;background:transparent;
}
.hero__blob-1{
  top:-240px;right:-240px;width:840px;height:840px;
  border:1.5px solid rgba(5,51,57,.07);
  box-shadow:0 0 0 72px rgba(5,51,57,.035), 0 0 0 144px rgba(5,51,57,.018);
  animation:float 16s ease-in-out infinite;
}
.hero__blob-2{
  bottom:-300px;left:-280px;width:660px;height:660px;
  border:1px solid rgba(5,51,57,.05);
  box-shadow:0 0 0 56px rgba(5,51,57,.025);
  animation:float 20s ease-in-out infinite reverse;
}
@keyframes float{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(30px,-20px) scale(1.05)}
}
/* .hero__inner layout is defined in the HERO VISUAL PANEL block below */
.hero__eyebrow-row{
  display:flex;align-items:center;gap:18px;
  margin-bottom:48px;
}
.hero__rule{
  width:48px;height:1.5px;background:var(--dark-teal);opacity:.6;
  flex-shrink:0;
}
.hero__eyebrow{
  font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dark-teal);opacity:.75;
}
.hero__claim{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(44px, 6.4vw, 92px);
  line-height:.96;letter-spacing:-0.045em;
  color:var(--dark-teal);
  margin:0 0 56px;
  max-width:none;
}
.hero__claim-line{display:block}
.hero__claim-line--mark{margin-top:.06em}
.hero__mark{
  display:inline;
  background:linear-gradient(180deg, transparent 68%, var(--highlighter) 68%);
  padding:0 .08em 0 0;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
.hero__claim-line--echo{
  margin-top:.06em;
  color:var(--dark-teal);
  opacity:.55;
  font-weight:500;
  font-size:.7em;
  letter-spacing:-0.03em;
  line-height:1.05;
}
.hero__claim-line--echo + .hero__claim-line--echo{margin-top:.02em}
.hero__claim .dot{
  display:inline-block;width:.18em;height:.18em;border-radius:50%;
  background:var(--dark-teal);opacity:.35;
  margin-left:.04em;
  transform:translateY(-.1em);
}
.hero__signature{
  max-width:780px;
  margin-bottom:48px;
  border-top:1px solid rgba(0,56,63,.18);
  padding-top:32px;
}
.hero__signature-num{
  font-family:var(--font-display);font-weight:600;
  font-size:32px;line-height:1;
  color:var(--dark-teal);opacity:.55;
  transform:translateY(-4px);
}
.hero__signature-text{
  font-size:18px;line-height:1.55;
  color:var(--dark-teal);opacity:.82;
  margin:0;
}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap}
.btn-primary{
  background:var(--dark-teal);color:var(--light-blue);
  padding:18px 30px;border-radius:var(--radius-pill);
  font-weight:600;font-size:16px;
  display:inline-flex;align-items:center;gap:12px;
  transition:transform .25s var(--ease), background .25s;
}
.btn-primary:hover{transform:translateY(-3px);background:#002a30}
.btn-primary svg{transition:transform .25s var(--ease)}
.btn-primary:hover svg{transform:translate(4px,-4px)}
.btn-ghost{
  background:transparent;color:var(--dark-teal);
  padding:18px 28px;border-radius:var(--radius-pill);
  font-weight:600;font-size:16px;
  border:1.5px solid rgba(0,56,63,.25);
  transition:border-color .25s, background .25s;
}
.btn-ghost:hover{border-color:var(--dark-teal);background:rgba(0,56,63,.04)}

.marquee{
  background:var(--dark-teal);color:var(--light-blue);
  padding:22px 0;overflow:hidden;
  border-top:1px solid rgba(230,253,255,.08);
  border-bottom:1px solid rgba(230,253,255,.08);
}
.marquee__track{
  display:flex;gap:56px;
  animation:marquee 38s linear infinite;
  white-space:nowrap;width:max-content;
}
.marquee__item{
  font-family:var(--font-display);font-weight:600;
  font-size:22px;letter-spacing:-0.01em;
  display:inline-flex;align-items:center;gap:56px;
}
.marquee__item .dot{
  width:8px;height:8px;border-radius:50%;background:var(--highlighter);display:inline-block;
}
@keyframes marquee{to{transform:translateX(-50%)}}

@media (max-width:960px){
  .hero{padding-top:130px;padding-bottom:80px;min-height:auto}
  .hero__claim{font-size:clamp(40px, 9vw, 72px)}
  .hero__signature{grid-template-columns:1fr;gap:12px}
  .hero__signature-num{font-size:24px}
  .hero__signature-text{font-size:16px}
  .hero__eyebrow-row{margin-bottom:32px}
}

/* ------------------- PAGE HERO ------------------- */
.page-hero{
  background:var(--light-blue);
  padding:160px 0 100px;
  position:relative;overflow:hidden;
  text-align:center;
}
.page-hero__blob{
  position:absolute;top:-200px;right:-200px;
  width:600px;height:600px;border-radius:50%;
  background:transparent;
  border:1.5px solid rgba(5,51,57,.07);
  box-shadow:0 0 0 60px rgba(5,51,57,.03), 0 0 0 120px rgba(5,51,57,.015);
  opacity:1;pointer-events:none;
}
.page-hero__back{
  display:flex;align-items:center;gap:8px;
  font-size:14px;font-weight:500;
  opacity:.55;margin-bottom:36px;
  text-align:left;
  transition:opacity .2s, gap .2s;
}
.page-hero__back:hover{opacity:1;gap:12px}
.page-hero__eyebrow{margin-bottom:20px;position:relative;z-index:2}
.page-hero__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(52px, 7vw, 96px);
  letter-spacing:-0.040em;line-height:.95;
  max-width:1100px;
  margin:0 auto 28px;
  position:relative;z-index:2;
}
.page-hero__title .swipe{
  display:inline;
}
.page-hero__desc{
  font-size:18px;line-height:1.55;opacity:.8;
  max-width:680px;
  margin:0 auto;
  position:relative;z-index:2;
}

/* ------------------- MANIFESTO ------------------- */
.manifesto{
  background:var(--dark-teal);
  padding:160px 0;
  position:relative;
  overflow:hidden;
}
.manifesto::before{
  content:"100K";
  position:absolute;
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(180px,21vw,300px);
  letter-spacing:-0.06em;
  line-height:1;
  color:rgba(230,253,0,.08);
  right:-10px;
  top:50%;
  transform:translateY(-30%);
  pointer-events:none;
  user-select:none;
}
.manifesto__grid{
  display:grid;grid-template-columns:1fr 2.5fr;gap:80px;align-items:start;
}
.manifesto__body{
  display:flex;flex-direction:column;gap:52px;
  justify-content:center;grid-column:1/-1;
  max-width:920px;
}
.manifesto__label{
  font-size:14px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--light-blue);opacity:.5;
  position:sticky;top:120px;
}
.manifesto__text{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(36px, 4.6vw, 60px);
  line-height:1.12;letter-spacing:-0.03em;
  color:var(--white);
}
.manifesto__text em{
  font-style:italic;
  font-weight:700;
}
.manifesto__img{
  border-radius:var(--radius-lg);
  overflow:hidden;
  margin-bottom:64px;
}
.manifesto__img img{
  width:100%;height:auto;display:block;
  border-radius:var(--radius-lg);
}
.manifesto__cta{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--font-display);font-weight:700;font-size:16px;
  color:var(--dark-teal);
  background:var(--highlighter);
  padding:18px 30px;border-radius:var(--radius-pill);
  align-self:flex-start;
  transition:transform .25s var(--ease),opacity .2s;
}
.manifesto__cta:hover{transform:translateY(-3px);opacity:.9}
.manifesto__cta svg{transition:transform .25s var(--ease)}
.manifesto__cta:hover svg{transform:translate(4px,-4px)}
.manifesto__text .mark-pink{
  font-weight:700;
}
@media (max-width:860px){
  .manifesto__grid{grid-template-columns:1fr;gap:40px}
  .manifesto__label{position:static}
}

/* ------------------- PRODUCT SHOWCASE ------------------- */
.showcase{
  background:#F9F7F4;
  color:var(--dark-teal);
  padding:120px 0;
  overflow:hidden;
}
.showcase__grid{
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:80px;
  align-items:center;
}
.showcase__info{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.showcase__eyebrow{color:var(--dark-teal);opacity:.5}
.showcase__title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(44px,5vw,72px);
  letter-spacing:-0.04em;
  line-height:.95;
  margin:20px 0 24px;
}
.showcase__desc{
  font-size:17px;
  line-height:1.65;
  opacity:.7;
  max-width:340px;
  margin-bottom:32px;
}
.showcase__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:15px;
  font-weight:600;
  color:var(--electric-blue);
  transition:gap .2s;
}
.showcase__link:hover{gap:14px}
.showcase__viewer{
  border-radius:24px;
  overflow:hidden;
  aspect-ratio:4/3;
  background:#F9F7F4;
  position:relative;
  outline:14px solid #F9F7F4;
  outline-offset:-14px;
}
.showcase__iframe{
  width:100%;
  height:100%;
  border:none;
  display:block;
  transform:none;
}
@media(max-width:860px){
  .showcase__grid{grid-template-columns:1fr;gap:48px}
  .showcase__viewer{aspect-ratio:1/1}
  .showcase__desc{max-width:none}
}

/* ------------------- OVERVIEW TEASERS ------------------- */
.overview{background:var(--light-blue);padding:120px 0 140px}
.overview__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.teaser-card--wide{grid-column:span 2}

.teaser-card{
  background:var(--white);
  border-radius:28px;padding:36px 40px 40px;
  display:flex;flex-direction:column;
  color:var(--dark-teal);
  border:1px solid rgba(0,56,63,.08);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  min-height:280px;
}
.teaser-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px -12px rgba(0,56,63,.13)}
.teaser-card--dark{background:var(--dark-teal);color:var(--light-blue);border-color:transparent}
.teaser-card--highlight{background:var(--highlighter);color:var(--dark-teal);border-color:transparent}

.teaser-card__eyebrow{
  font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  opacity:.6;margin-bottom:18px;
  display:inline-flex;align-items:center;gap:8px;
}
.teaser-card__eyebrow::before{content:"";width:20px;height:1.5px;background:currentColor}
.teaser-card__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(26px, 2.8vw, 38px);
  letter-spacing:-0.03em;line-height:.98;
  margin-bottom:14px;
}
.teaser-card__desc{
  font-size:15.5px;line-height:1.55;opacity:.78;
  flex:1;
}
.teaser-card__link{
  display:inline-flex;align-items:center;gap:8px;
  font-weight:600;font-size:14.5px;
  margin-top:28px;
  transition:gap .25s var(--ease);
}
.teaser-card:hover .teaser-card__link{gap:14px}
.teaser-card--dark .teaser-card__link{color:var(--highlighter)}
.teaser-card--highlight .teaser-card__link{color:var(--dark-teal)}

@media (max-width:960px){.overview__grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.overview__grid{grid-template-columns:1fr}.teaser-card--wide{grid-column:span 1}}

/* ------------------- SHARED SECTION HEADER ------------------- */
.section-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:70px;gap:40px;flex-wrap:wrap;
}
.section-title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(44px, 6vw, 80px);
  line-height:.98;letter-spacing:-0.035em;
  max-width:720px;
}
.section-title .swipe{
  display:inline-block;font-style:italic;
  opacity:.55;
  padding-right:0.12em;
}
.section-intro{max-width:360px;font-size:17px;opacity:.78;font-style:italic;font-family:var(--font-display);font-weight:500;letter-spacing:-0.01em;}

/* ------------------- PRODUCTS ------------------- */
.products{background:var(--light-blue);padding:140px 0}
.products__grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.product-card{
  position:relative;
  border-radius:36px;padding:40px 40px 0;
  display:flex;flex-direction:column;
  overflow:hidden;
  transition:transform .4s var(--ease);
}
.product-card:hover{transform:translateY(-6px)}
.product-card--one{background:var(--dark-teal);color:var(--light-blue)}
.product-card--two{background:#d6ecf3;color:var(--dark-teal)}
.product-card__header{
  display:flex;justify-content:space-between;align-items:flex-start;
  z-index:3;position:relative;margin-bottom:28px;
}
.product-card__tag{
  font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:7px 14px;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.14);
  display:inline-block;
}
.product-card--one .product-card__tag{background:rgba(230,253,255,.14)}
.product-card--two .product-card__tag{background:rgba(0,56,63,.10);color:var(--dark-teal)}
.product-card__price{
  font-family:var(--font-display);font-weight:600;
  font-size:18px;opacity:.8;letter-spacing:-0.01em;
}
.product-card__price strong{font-size:24px;opacity:1;font-weight:700}
.product-card__body{position:relative;z-index:3}
.product-card__spacer{flex:1;min-height:0}
.product-card__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(48px, 6vw, 72px);
  letter-spacing:-0.035em;line-height:.95;
  margin-bottom:14px;
}
.product-card__title .small{
  font-size:.32em;display:block;font-weight:500;
  opacity:.7;letter-spacing:.01em;
  margin-top:10px;line-height:1.3;
}
.product-card__desc{font-size:16px;line-height:1.5;opacity:.82;margin-bottom:22px}
.product-card__features{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.product-card__features span{
  font-size:12.5px;padding:7px 13px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--radius-pill);
  font-weight:500;
}
.product-card--one .product-card__features span{border-color:rgba(230,253,255,.22)}
.product-card--two .product-card__features span{border-color:rgba(5,51,57,.20);color:var(--dark-teal)}
.product-card__link{
  display:inline-flex;align-items:center;gap:12px;
  font-weight:600;font-size:15px;
  padding:14px 22px;border-radius:var(--radius-pill);
  transition:transform .25s;
  align-self:flex-start;
  z-index:3;position:relative;
}
.product-card--one .product-card__link{background:var(--highlighter);color:var(--dark-teal)}
.product-card--two .product-card__link{background:var(--highlighter);color:var(--dark-teal)}

.product-card__link:hover{transform:translateX(4px)}
.product-card__stage{
  position:relative;
  margin:32px -40px 0;
  padding:70px 24px 40px;
  background:#ffffff;
  display:flex;align-items:center;justify-content:center;
  flex:1;
  min-height:360px;
}
.product-card__image-wrap{
  position:relative;
  width:100%;max-width:520px;
  transition:transform .5s var(--ease);
}
.product-card__image{
  width:100%;height:auto;display:block;
  filter:drop-shadow(0 14px 20px rgba(0,56,63,.15));
}
.product-card:hover .product-card__image-wrap{transform:scale(1.03)}
@media (max-width:860px){
  .products__grid{grid-template-columns:1fr}
  .product-card{min-height:auto;padding:32px 32px 0}
  .product-card__stage{margin:24px -32px 0;padding:56px 20px 32px}
}

/* ------------------- SMART ------------------- */
.smart{background:var(--dark-teal);color:var(--light-blue);padding:140px 0;position:relative;overflow:hidden}
.smart::before{
  content:"";position:absolute;top:-200px;right:-200px;
  width:680px;height:680px;border-radius:50%;
  background:transparent;
  border:1px solid rgba(238,254,35,.1);
  box-shadow:0 0 0 80px rgba(238,254,35,.04);
  pointer-events:none;
}
.smart__grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.smart__eyebrow{color:var(--highlighter);font-weight:600;margin-bottom:20px}
.smart__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(44px, 6vw, 76px);letter-spacing:-0.035em;line-height:.98;
  margin-bottom:24px;
}
.smart__title u{
  text-decoration:none;
}
.smart__lead{font-size:18px;line-height:1.5;opacity:.85;margin-bottom:32px;max-width:500px}
.smart__features{display:flex;flex-direction:column;gap:14px;max-width:500px}
.smart__feature{
  display:flex;gap:16px;align-items:flex-start;
  padding:16px 20px;background:rgba(230,253,255,.06);
  border-radius:var(--radius-md);
  border:1px solid rgba(230,253,255,.1);
}
.smart__feature-icon{
  width:40px;height:40px;border-radius:12px;
  background:var(--highlighter);color:var(--dark-teal);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.smart__feature h4{font-family:var(--font-display);font-size:17px;font-weight:600;margin-bottom:3px;letter-spacing:-0.01em}
.smart__feature p{font-size:14px;opacity:.8}
.dashboard{
  background:var(--light-blue);
  border-radius:28px;padding:28px;
  color:var(--dark-teal);
  box-shadow:0 40px 80px -20px rgba(0,0,0,.35);
  position:relative;transform:rotate(-1.5deg);
  transition:transform .5s var(--ease);
}
.dashboard:hover{transform:rotate(0deg) scale(1.02)}
.dash__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.dash__title{font-family:var(--font-display);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.dash__dots{display:flex;gap:6px}
.dash__dots span{width:9px;height:9px;border-radius:50%;background:var(--dark-teal);opacity:.18}
.dash__hero{
  background:var(--dark-teal);color:var(--light-blue);
  border-radius:20px;padding:24px;
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:12px;position:relative;overflow:hidden;
}
.dash__hero::after{
  content:"";position:absolute;top:-40px;right:-40px;width:160px;height:160px;
  border:1.5px dashed var(--highlighter);border-radius:50%;opacity:.3;
}
.dash__hero-label{font-size:12px;opacity:.7;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.dash__hero-num{font-family:var(--font-display);font-weight:700;font-size:52px;line-height:.95;letter-spacing:-0.03em}
.dash__hero-num sup{font-size:18px;opacity:.6;margin-left:4px;vertical-align:top;font-weight:500}
.dash__hero-trend{background:var(--highlighter);color:var(--dark-teal);padding:6px 12px;border-radius:var(--radius-pill);font-size:12px;font-weight:600}
.dash__metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.dash__metric{background:var(--white);border-radius:16px;padding:18px}
.dash__metric-label{font-size:11px;opacity:.6;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
.dash__metric-num{font-family:var(--font-display);font-weight:700;font-size:28px;letter-spacing:-0.02em;line-height:1}
.dash__metric-unit{font-size:14px;opacity:.5;font-weight:500;margin-left:3px}
.dash__chart{margin-top:10px;height:34px;display:flex;align-items:flex-end;gap:3px}
.dash__chart span{flex:1;background:var(--dark-teal);border-radius:2px;opacity:.8}
.dash__footer{
  background:var(--light-blue);border-radius:16px;padding:16px 20px;
  display:flex;justify-content:space-between;align-items:center;font-size:13px;
}
.dash__footer strong{font-family:var(--font-display);font-weight:600}
@media (max-width:960px){
  .smart__grid{grid-template-columns:1fr;gap:60px}
  .dashboard{max-width:440px;margin:0 auto}
}

/* ------------------- HOE HET WERKT ------------------- */
.how{background:var(--dark-teal);color:var(--light-blue);padding:0 0 140px}
.how__head{margin-bottom:70px}
.how__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(44px, 6vw, 80px);line-height:.98;letter-spacing:-0.035em;
  max-width:820px;
}
.how__title b{font-weight:700}
.how__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.step{
  background:rgba(230,253,255,.05);
  border:1px solid rgba(230,253,255,.1);
  border-radius:24px;padding:28px;
  display:flex;flex-direction:column;gap:16px;
  transition:background .3s, transform .3s var(--ease);
}
.step:hover{background:rgba(230,253,255,.08);transform:translateY(-4px)}
.step__num{
  font-family:var(--font-display);font-weight:700;
  font-size:46px;letter-spacing:-0.04em;line-height:1;
  color:var(--highlighter);
}
.step__num::before{
  content:"";display:inline-block;
  width:10px;height:10px;border-radius:50%;background:var(--highlighter);
  margin-right:10px;vertical-align:middle;transform:translateY(-10px);
}
.step h3{font-family:var(--font-display);font-weight:600;font-size:22px;letter-spacing:-0.015em}
.step p{font-size:15px;opacity:.75;line-height:1.5}
@media (max-width:960px){.how__steps{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.how__steps{grid-template-columns:1fr}}

/* ------------------- SECTOREN ------------------- */
.sectors{background:var(--white);padding:140px 0}
.sectors__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:60px}
.sector{
  position:relative;border-radius:28px;padding:36px;
  min-height:420px;display:flex;flex-direction:column;justify-content:space-between;
  overflow:hidden;transition:transform .35s var(--ease);
}
.sector:hover{transform:translateY(-6px)}
.sector--clean{background:var(--white);color:var(--dark-teal);border:1px solid rgba(0,56,63,.12)}
.sector--care{background:var(--white);color:var(--dark-teal);border:1px solid rgba(0,56,63,.12)}
.sector--corp{background:var(--white);color:var(--dark-teal);border:1px solid rgba(0,56,63,.12)}
.sector__icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:26px}
.sector--clean .sector__icon{background:var(--light-blue);color:var(--dark-teal)}
.sector--care .sector__icon{background:var(--light-blue);color:var(--dark-teal)}
.sector--corp .sector__icon{background:var(--light-blue);color:var(--dark-teal)}
.sector__title{font-family:var(--font-display);font-weight:700;font-size:36px;letter-spacing:-0.03em;line-height:1;margin:20px 0 14px}
.sector__desc{font-size:15.5px;opacity:.85;line-height:1.5;max-width:320px}
.sector__stat{margin-top:auto;padding-top:24px;border-top:1px solid rgba(0,56,63,.15)}
.sector__stat-num{font-family:var(--font-display);font-weight:700;font-size:36px;letter-spacing:-0.03em;line-height:1}
.sector--clean .sector__stat-num{color:var(--electric-blue)}
.sector__stat-label{font-size:13px;opacity:.7;margin-top:4px}
.sector--extra{
  grid-column:1 / -1;
  min-height:auto;
  flex-direction:row;
  align-items:center;
  gap:60px;
  background:var(--dark-teal);
  color:var(--light-blue);
  border:none;
  padding:56px 64px;
}
.sector--extra .sector__icon{
  background:rgba(230,253,255,.12);
  color:var(--light-blue);
  flex-shrink:0;
  width:68px;height:68px;border-radius:20px;
}
.sector--extra__content{flex:1}
.sector--extra .sector__title{
  margin:0 0 14px;
  font-size:clamp(28px,3vw,40px);
  color:var(--light-blue);
}
.sector--extra .sector__desc{
  max-width:640px;
  opacity:.75;
  font-size:16.5px;
  line-height:1.65;
}
.sector--extra__cta{
  flex-shrink:0;
  white-space:nowrap;
  font-weight:600;font-size:15px;
  background:var(--highlighter);
  color:var(--dark-teal);
  padding:16px 32px;
  border-radius:var(--radius-pill);
  transition:transform .25s var(--ease), background .25s;
}
.sector--extra__cta:hover{transform:translateY(-2px);background:#f6ff5a}
@media (max-width:860px){
  .sectors__grid{grid-template-columns:1fr}
  .sector--extra{flex-direction:column;align-items:flex-start;gap:24px;padding:40px 32px}
  .sector--extra__cta{align-self:flex-start}
}

/* ------------------- IMPACT STORY ------------------- */
.impact-story{
  background:var(--dark-teal);
  color:var(--light-blue);
  padding:120px 0 100px;
}
.impact-story__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
}
.impact-story__img{
  border-radius:20px;
  overflow:hidden;
  aspect-ratio:4/3;
}
.impact-story__p{
  font-size:clamp(17px,1.4vw,20px);
  line-height:1.7;
  opacity:.8;
}

/* ------------------- STAT STRIP ------------------- */
.stat-strip{
  background:var(--light-blue);
  padding:80px 40px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  max-width:1280px;
  margin:0 auto;
}
.stat-strip__item{
  background:var(--dark-teal);
  color:var(--light-blue);
  border-radius:24px;
  padding:50px 43px 54px;
  display:flex;flex-direction:column;gap:14px;
}
.stat-strip__num{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(52px,5.5vw,88px);
  letter-spacing:-0.05em;
  line-height:.85;
  color:var(--light-blue);
}
.stat-strip__unit{
  font-size:.5em;
  letter-spacing:-0.02em;
  opacity:.6;
}
.stat-strip__sub{
  font-size:12px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.45;
  margin-top:-8px;
}
.stat-strip__label{
  font-size:15.4px;
  line-height:1.5;
  opacity:.55;
}
.stat-strip__item--blue{background:var(--electric-blue)}
.stat-strip__item--blue .stat-strip__num{color:#fff}
.stat-strip__item--blue .stat-strip__sub{color:#fff;opacity:.5}
.stat-strip__item--blue .stat-strip__label{color:#fff;opacity:.65}
.stat-strip__item--yellow{background:var(--highlighter);color:var(--dark-teal)}
.stat-strip__item--yellow .stat-strip__num{color:var(--dark-teal)}
.stat-strip__item--yellow .stat-strip__unit{opacity:.55}
.stat-strip__item--yellow .stat-strip__label{color:var(--dark-teal);opacity:.7}
@media(max-width:1240px){
  .stat-strip{padding-left:32px;padding-right:32px}
}
@media(max-width:860px){
  .stat-strip{grid-template-columns:1fr 1fr;padding:60px 24px;gap:16px}
  .impact-story__grid{grid-template-columns:1fr;gap:32px}
}

/* ------------------- VITALITY ------------------- */
.vitality{background:var(--white);color:var(--dark-teal);padding:140px 0}
.vitality__editorial{
  max-width:820px;
  margin:0 auto 80px;
}
/* Map area */
.vitality__map-area{
  display:flex;align-items:center;justify-content:center;
}
.vitality__map-wrap{
  position:relative;
  width:100%;max-width:400px;
}
.vitality__map-img{
  width:100%;height:auto;display:block;
}
.vitality__map-overlay{
  position:absolute;
  top:0;left:0;width:100%;height:100%;
}
.nl-routes{ fill:none; }
.nl-route{
  stroke:var(--electric-blue);
  stroke-width:1.2;
  stroke-dasharray:5 4;
  opacity:.35;
  animation:route-flow 6s linear infinite;
}
.nl-route--b{ animation-delay:-2s; opacity:.25; }
.nl-route--c{ animation-delay:-4s; opacity:.2; }
@keyframes route-flow{
  from{ stroke-dashoffset:80; }
  to{ stroke-dashoffset:0; }
}
.nl-city__dot{
  fill:var(--electric-blue);
  opacity:.9;
}
.nl-city__ring{
  fill:none;
  stroke:var(--electric-blue);
  stroke-width:1;
  transform-box:fill-box;
  transform-origin:center;
  animation:city-pulse 3s ease-out infinite;
}
@keyframes city-pulse{
  0%  { transform:scale(1); opacity:.7; }
  100%{ transform:scale(5); opacity:0; }
}
.vitality__content{
  display:flex;flex-direction:column;gap:0;
}
.vitality__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(40px,4.5vw,72px);
  letter-spacing:-0.04em;line-height:.95;
  margin-bottom:24px;
}
.vitality__lead{
  font-size:clamp(17px,1.4vw,21px);
  line-height:1.65;
  opacity:.85;
  margin-bottom:36px;
}
.vitality__body{
  font-size:17px;line-height:1.75;opacity:.65;
  margin-bottom:20px;
}
.vitality__pullquote{
  margin:4px 0 20px;
  padding:16px 0 16px 20px;
  border-left:3px solid var(--electric-blue);
  font-family:var(--font-display);
  font-size:clamp(18px,2vw,22px);
  font-weight:600;
  line-height:1.4;
  letter-spacing:-0.02em;
  color:var(--dark-teal);
  font-style:normal;
}
.vitality__statement{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(32px,4vw,58px);
  letter-spacing:-0.04em;
  line-height:1.15;
  max-width:820px;
  margin:0 auto;
  padding-top:64px;
  border-top:1px solid rgba(5,51,57,.1);
}
.vs-mark{
  background:linear-gradient(180deg, transparent 68%, var(--highlighter) 68%);
  color:inherit;
  padding:0 .08em;
  border-radius:0;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
@media(max-width:860px){
  .vitality__editorial{margin-bottom:48px}
  .vitality__statement{font-size:clamp(28px,8vw,44px);padding-top:48px}
}

/* ------------------- CTA ------------------- */
.cta{background:var(--light-blue);padding:120px 0}
.cta__box{
  background:var(--dark-teal);color:var(--light-blue);
  border-radius:32px;padding:72px 64px;
  position:relative;overflow:hidden;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  grid-template-rows:auto 1fr auto;
  gap:0 80px;
  text-align:left;
}
.cta__box::before{
  content:"";position:absolute;top:-180px;left:-180px;width:520px;height:520px;
  background:transparent;border-radius:50%;
  border:1px solid rgba(238,254,35,.12);
  box-shadow:0 0 0 80px rgba(238,254,35,.04);
  pointer-events:none;
}
.cta__box::after{
  content:"";position:absolute;bottom:-160px;right:-160px;width:440px;height:440px;
  background:transparent;border-radius:50%;
  border:1px solid rgba(238,254,35,.08);
  box-shadow:0 0 0 60px rgba(238,254,35,.03);
  pointer-events:none;
}
.cta__eyebrow{
  grid-column:2;grid-row:1;align-self:end;
  position:relative;z-index:2;
  color:var(--highlighter);font-weight:600;margin-bottom:0;
}
.cta__title{
  grid-column:1;grid-row:1/4;align-self:center;
  position:relative;z-index:2;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(36px, 4.5vw, 58px);letter-spacing:-0.035em;line-height:.98;
  max-width:none;margin:0;
}
.cta__title i{font-style:normal;background:var(--highlighter);color:var(--dark-teal);padding:0 .1em;border-radius:8px}
.cta__sub{
  grid-column:2;grid-row:2;align-self:start;
  position:relative;z-index:2;
  font-size:17px;opacity:.85;max-width:none;margin:16px 0 0;line-height:1.55;
}
.cta__actions{
  grid-column:2;grid-row:3;align-self:end;
  position:relative;z-index:2;
  display:flex;gap:12px;flex-wrap:wrap;
  padding-top:28px;
}
.cta__primary{
  background:var(--highlighter);color:var(--dark-teal);
  padding:16px 28px;border-radius:var(--radius-pill);
  font-weight:600;font-size:16px;
  display:inline-flex;align-items:center;gap:12px;
  transition:transform .25s var(--ease), background .25s;
}
.cta__primary:hover{transform:translateY(-3px);background:#f6ff5a}
.cta__secondary{
  background:transparent;color:var(--light-blue);
  border:1.5px solid rgba(230,253,255,.3);
  padding:16px 24px;border-radius:var(--radius-pill);
  font-weight:600;font-size:16px;
  transition:border-color .25s,background .25s;
}
.cta__secondary:hover{border-color:var(--light-blue);background:rgba(230,253,255,.06)}
@media(max-width:860px){
  .cta__box{
    grid-template-columns:1fr;grid-template-rows:auto;
    text-align:center;padding:48px 32px;gap:0;
  }
  .cta__eyebrow{grid-column:1;grid-row:auto;margin-bottom:16px;}
  .cta__title{grid-column:1;grid-row:auto;font-size:clamp(32px,8vw,48px);margin-bottom:20px;}
  .cta__sub{grid-column:1;grid-row:auto;margin:0 0 24px;}
  .cta__actions{grid-column:1;grid-row:auto;justify-content:center;padding-top:0;}
}

/* ------------------- FOOTER ------------------- */
footer{background:var(--dark-teal);color:var(--light-blue);padding:80px 0 40px}
.foot__top{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:60px;
  padding-bottom:60px;
  border-bottom:1px solid rgba(230,253,255,.15);
}
.foot__logo{height:32px;margin-bottom:24px}
.foot__logo svg{height:100%;width:auto}
.foot__about{font-family:var(--font-display);font-size:18px;font-weight:700;line-height:1.45;max-width:360px;color:var(--light-blue);opacity:1;letter-spacing:-0.01em}
.foot h5{
  font-family:var(--font-display);font-size:13px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;opacity:.6;
}
.foot__col ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.foot__col a{font-size:15px;opacity:.85;transition:opacity .2s}
.foot__col a:hover{opacity:1}
.foot__bottom{
  margin-top:40px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  font-size:14px;opacity:.55;
}
@media (max-width:860px){.foot__top{grid-template-columns:1fr 1fr;gap:40px}}
@media (max-width:560px){.foot__top{grid-template-columns:1fr}}

/* ------------------- IMAGE PLACEHOLDER ------------------- */
.img-placeholder{
  position:relative;
  background:rgba(5,51,57,.05);
  border:1.5px dashed rgba(5,51,57,.2);
  border-radius:var(--radius-md);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:12px;text-align:center;padding:40px 32px;
  width:100%;height:100%;
  overflow:hidden;
}
.img-placeholder__icon{
  width:48px;height:48px;border-radius:50%;
  background:rgba(5,51,57,.08);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.img-placeholder__icon svg{opacity:.45}
.img-placeholder__label{
  font-family:var(--font-display);font-weight:600;
  font-size:13px;letter-spacing:.05em;
  color:var(--dark-teal);opacity:.55;
}
.img-placeholder__hint{
  font-size:12px;line-height:1.55;
  color:var(--dark-teal);opacity:.38;
  max-width:240px;
}
.img-placeholder--dark{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.15);
}
.img-placeholder--dark .img-placeholder__icon{background:rgba(255,255,255,.08)}
.img-placeholder--dark .img-placeholder__icon svg{color:#fff}
.img-placeholder--dark .img-placeholder__label{color:#fff;opacity:.5}
.img-placeholder--dark .img-placeholder__hint{color:#fff;opacity:.32}

/* ------------------- HERO VISUAL PANEL ------------------- */
.hero__inner{
  position:relative;z-index:2;
  width:100%;
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:72px;
  align-items:center;
}
.hero__text{display:flex;flex-direction:column}
.hero__visual{
  border-radius:var(--radius-lg);
  overflow:hidden;
  aspect-ratio:4/5;
  position:relative;
}
.hero__visual .img-placeholder{border-radius:var(--radius-lg)}
.hero__visual-img{
  width:100%;height:100%;
  object-fit:cover;object-position:center top;
  border-radius:var(--radius-lg);
  display:block;
}
.hero__slide{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center top;
  border-radius:var(--radius-lg);
}
@media (max-width:960px){
  .hero__inner{grid-template-columns:1fr;gap:48px}
  .hero__visual{aspect-ratio:16/9;max-height:360px}
}

/* ------------------- EDITORIAL IMAGE STRIP ------------------- */
.img-strip{
  padding:0 0 80px;
  background:inherit;
}
.img-strip--standalone{
  padding:0 0 60px;background:var(--light-blue);
}
.img-strip__inner{
  max-width:1280px;margin:0 auto;padding:0 32px;
}
.img-strip__frame{
  border-radius:var(--radius-lg);
  overflow:hidden;
  aspect-ratio:21/9;
  position:relative;
}
.img-strip__frame .img-placeholder{border-radius:var(--radius-lg)}
@media(max-width:860px){
  .img-strip__frame{aspect-ratio:16/9}
}

/* ------------------- SECTOR CARD IMAGE ------------------- */
.sector__img-area{
  margin:-36px -36px 28px;
  height:260px;
  border-radius:20px 20px 0 0;
  overflow:hidden;
  flex-shrink:0;
}
.sector__img-area .img-placeholder{
  height:100%;border-radius:0;border-left:none;border-right:none;border-top:none;
}
.sector__img{
  width:100%;height:100%;object-fit:cover;object-position:center center;display:block;
}
.sector--clean .sector__img{
  filter:brightness(1.35) contrast(0.95);
}

/* ------------------- VITALITY SIDE IMAGE ------------------- */
.vitality__img-area{
  border-radius:var(--radius-lg);
  overflow:hidden;
  aspect-ratio:4/5;
  position:relative;
}
.vitality__img-area .img-placeholder{border-radius:var(--radius-lg)}
@media(max-width:860px){
  .vitality__img-area{aspect-ratio:4/3}
}

/* ------------------- STRATEGIE IMAGE ------------------- */
.how__img-area{
  aspect-ratio:21/9;
  overflow:hidden;
  margin-bottom:0;
  position:relative;
}
.how__img-area .img-placeholder{border-radius:0}
.how__inner{padding:80px 0 0}

/* Reveal-on-scroll */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease), transform .8s var(--ease)}
.reveal.in{opacity:1;transform:translateY(0)}