/* ============ GROWUILD REVAMP — shared design system ============ */
:root{
  --bg:#f6f3ec; --surface:#fffdf8; --surface-2:#efeadf;
  --ink:#1a1d16; --ink-soft:#535849; --line:rgba(26,29,22,.13);
  --accent:#1c6b3c; --accent-ink:#fff; --accent-soft:#e7efe6; --nav-hl:#cdeeab;
  --shadow:0 22px 60px -32px rgba(26,40,22,.45);
  --font-display:'Fraunces',Georgia,serif;
  --font-body:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --wrap:1180px; --radius:14px; --ease:cubic-bezier(.22,.61,.36,1);
}
html[data-theme="dark"]{
  --bg:#12140e; --surface:#1b1e15; --surface-2:#23271b;
  --ink:#ece8dd; --ink-soft:#a7a99a; --line:rgba(236,232,221,.14);
  --accent:#62c084; --accent-ink:#0c1408; --accent-soft:#1d2a1c; --nav-hl:rgba(98,192,132,.30);
  --shadow:0 26px 70px -34px rgba(0,0,0,.7);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg); color:var(--ink); font-family:var(--font-body);
  font-size:clamp(16px,1.05vw,18px); line-height:1.62; -webkit-font-smoothing:antialiased;
  overflow-x:hidden; transition:background .4s var(--ease), color .4s var(--ease)}
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(20px,5vw,56px)}
section{padding-block:clamp(64px,11vh,140px)}
h1,h2,h3,h4{font-family:var(--font-display); font-weight:600; line-height:1.04; letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,6.4vw,5.4rem); font-weight:700}
h2{font-size:clamp(2rem,4vw,3.3rem)}
h3{font-size:clamp(1.3rem,2vw,1.7rem)}
em{font-style:italic; color:var(--accent)}
a{color:inherit}
.eyebrow{font-family:var(--font-body); font-size:.8rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent)}
.lead{font-size:clamp(1.1rem,1.6vw,1.4rem); color:var(--ink-soft); max-width:60ch}
.muted{color:var(--ink-soft)}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:.5em; font-weight:600; font-size:1rem;
  padding:.85em 1.5em; border-radius:100px; text-decoration:none; border:1.5px solid transparent;
  transition:transform .5s var(--ease), background .25s, color .25s, border-color .25s; will-change:transform; cursor:pointer}
.btn-primary{background:var(--accent); color:var(--accent-ink); position:relative; overflow:hidden}
.btn-primary:hover{filter:brightness(1.07)}
/* premium gloss sweep (from growuild.com waFreeShine) */
.btn-primary::before{content:""; position:absolute; top:0; left:-160%; width:55%; height:100%; background:linear-gradient(115deg,transparent,rgba(255,255,255,.5),transparent); transform:skewX(-20deg); pointer-events:none; animation:btnShine 4.2s ease-in-out infinite}
@keyframes btnShine{0%,58%{left:-160%}100%{left:160%}}
.btn-primary>*{position:relative}
.btn-ghost{border-color:var(--line); color:var(--ink); background:transparent}
.btn-ghost:hover{border-color:var(--accent); color:var(--accent)}
.btn svg{width:1.1em;height:1.1em}
.btn[disabled]{opacity:.45; pointer-events:none}

/* header / nav */
header{position:sticky; top:0; z-index:50; background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:blur(14px); border-bottom:1px solid transparent; transition:border-color .3s,background .3s}
header.scrolled{border-bottom-color:var(--line)}
/* scroll accent wipe under bar (cydstumpel.nl) */
header::after{content:""; position:absolute; left:0; bottom:0; height:2px; width:100%; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .6s var(--ease)}
header.scrolled::after{transform:scaleX(1)}
.nav{display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:16px}
.brand{font-family:var(--font-display); font-weight:700; font-size:1.35rem; letter-spacing:-.02em; text-decoration:none; color:var(--ink)}
.brand b{color:var(--accent)}
.nav-links{display:flex; gap:28px; list-style:none}
/* nav link highlighter-marker sweep (cydstumpel.nl) */
.nav-links a{text-decoration:none; color:var(--ink-soft); font-weight:500; font-size:.95rem; padding:3px 6px; margin:0 -3px; border-radius:4px;
  background-image:linear-gradient(var(--nav-hl) 0 0); background-size:100% 0; background-position:bottom; background-repeat:no-repeat;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
  transition:background-size .45s cubic-bezier(.25,1,.5,1), color .25s}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ink); background-size:100% 100%}
.nav-tools{display:flex; align-items:center; gap:12px}
.icon-btn{display:grid; place-items:center; width:40px; height:40px; border-radius:50%;
  border:1.5px solid var(--line); background:transparent; color:var(--ink); cursor:pointer; transition:border-color .2s,color .2s}
.icon-btn:hover{border-color:var(--accent); color:var(--accent)}
.icon-btn svg{width:18px;height:18px}
.lang-wrap{position:relative}
.lang-menu{position:absolute; right:0; top:52px; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:6px; min-width:162px; box-shadow:var(--shadow); display:flex; flex-direction:column; z-index:60;
  opacity:0; visibility:hidden; transform:translateY(-10px) scale(.96); transform-origin:top right;
  transition:opacity .26s var(--ease), transform .26s var(--ease), visibility .26s; pointer-events:none}
.lang-menu.open{opacity:1; visibility:visible; transform:none; pointer-events:auto}
.lang-menu a{padding:9px 12px; border-radius:8px; text-decoration:none; color:var(--ink); font-size:.92rem;
  opacity:0; transform:translateX(7px); transition:opacity .25s var(--ease), transform .25s var(--ease), background .2s}
.lang-menu.open a{opacity:1; transform:none}
.lang-menu.open a:nth-child(1){transition-delay:.05s} .lang-menu.open a:nth-child(2){transition-delay:.09s}
.lang-menu.open a:nth-child(3){transition-delay:.13s} .lang-menu.open a:nth-child(4){transition-delay:.17s}
.lang-menu.open a:nth-child(5){transition-delay:.21s} .lang-menu.open a:nth-child(6){transition-delay:.25s}
.lang-menu a:hover{background:var(--surface-2)}
.nav-cta{display:inline-flex}
.menu-toggle{display:none}

/* mobile menu panel */
/* mobile menu — right-panel slide + staggered links (bethebuzz.co) */
.mobile-menu{position:fixed; inset:0 0 0 auto; width:min(100%,460px); background:var(--surface); z-index:70;
  transform:translateX(101%); transition:transform .85s cubic-bezier(.87,0,.13,1); padding:118px 36px 40px; display:flex; flex-direction:column; gap:2px;
  box-shadow:var(--shadow); border-left:1px solid var(--line)}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu a:not(.btn){text-decoration:none; color:var(--ink); font-family:var(--font-display); font-weight:600; font-size:clamp(2rem,8.5vw,2.8rem); line-height:1.12; padding:6px 0;
  opacity:0; transform:translateY(-22px); transition:opacity .6s var(--ease), transform .6s var(--ease), color .25s}
.mobile-menu.open a:not(.btn){opacity:1; transform:none}
.mobile-menu.open a:not(.btn):nth-of-type(1){transition-delay:.30s}
.mobile-menu.open a:not(.btn):nth-of-type(2){transition-delay:.38s}
.mobile-menu.open a:not(.btn):nth-of-type(3){transition-delay:.46s}
.mobile-menu.open a:not(.btn):nth-of-type(4){transition-delay:.54s}
.mobile-menu.open a:not(.btn):nth-of-type(5){transition-delay:.62s}
.mobile-menu.open a:not(.btn):nth-of-type(6){transition-delay:.70s}
.mobile-menu a:not(.btn):hover{color:var(--accent)}
.mobile-menu .btn{margin-top:26px; justify-content:center; opacity:0; transition:opacity .5s ease .78s}
.mobile-menu.open .btn{opacity:1}
.mm-close{position:absolute; top:24px; right:24px}
.scrim{position:fixed; inset:0; background:rgba(15,17,11,.72); z-index:65; opacity:0; pointer-events:none; transition:opacity .85s cubic-bezier(.26,1,.48,1)}
.scrim.open{opacity:1; pointer-events:auto}
/* hamburger collapse-to-dot morph (bethebuzz.co) */
.ham{position:relative; width:18px; height:12px; display:block}
.ham i{position:absolute; left:0; width:100%; height:2px; background:currentColor; border-radius:2px; transition:transform .5s cubic-bezier(.25,1,.5,1), opacity .35s}
.ham i:nth-child(1){top:0} .ham i:nth-child(2){top:5px} .ham i:nth-child(3){top:10px}
.menu-toggle.is-open .ham i:nth-child(1){opacity:0; transform:translateY(5px) scale(.2)}
.menu-toggle.is-open .ham i:nth-child(3){opacity:0; transform:translateY(-5px) scale(.2)}
.menu-toggle.is-open .ham i:nth-child(2){transform:rotate(180deg) scaleX(.75)}

/* hero */
.hero{padding-top:clamp(40px,8vh,90px); padding-bottom:clamp(56px,10vh,120px)}
.hero .eyebrow{display:block; margin-bottom:22px}
.hero h1{max-width:16ch}
.hero .lead{margin-top:26px; font-size:clamp(1.15rem,1.8vw,1.5rem)}
.hero-cta{display:flex; flex-wrap:wrap; gap:14px; margin-top:36px}
.hero-trust{margin-top:30px; display:flex; gap:28px; flex-wrap:wrap; color:var(--ink-soft); font-size:.95rem}
.hero-trust b{color:var(--ink); font-family:var(--font-display); font-weight:600}
.word{display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.16em; margin-bottom:-.16em}
.word .inner{display:inline-block; transform:translateY(110%); transition:transform .7s var(--ease)}
.word .inner.show{transform:none}

/* page header (sub-pages) */
.page-head{padding-top:clamp(48px,9vh,110px); padding-bottom:clamp(28px,5vh,56px)}
.page-head h1{font-size:clamp(2.4rem,5.4vw,4.4rem); max-width:18ch}
.page-head .lead{margin-top:20px}

/* marquee */
.marquee{border-block:1px solid var(--line); overflow:hidden; padding-block:18px; background:var(--surface-2)}
.marquee-track{display:flex; gap:48px; width:max-content; animation:scroll 34s linear infinite; will-change:transform}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{font-family:var(--font-display); font-style:italic; font-size:1.15rem; color:var(--ink-soft); white-space:nowrap}
.marquee span::after{content:"✦"; margin-left:48px; color:var(--accent); font-style:normal}
@keyframes scroll{to{transform:translateX(-50%)}}

/* reveal */
.reveal{opacity:0; transform:translateY(20px); transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.is-in{opacity:1; transform:none}
.stagger>*{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease); transition-delay:calc(var(--i,0)*70ms)}
.stagger.is-in>*{opacity:1; transform:none}

/* promise */
.promise{background:var(--accent-soft)}
.promise .big{font-family:var(--font-display); font-size:clamp(1.7rem,3.4vw,2.9rem); font-weight:600; line-height:1.18; max-width:20ch; letter-spacing:-.02em}
.promise .lead{margin-top:24px}

/* steps */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:28px; margin-top:48px}
.step .num{font-family:var(--font-display); font-size:2.4rem; font-weight:700; color:var(--accent); line-height:1}
.step h3{margin:14px 0 8px; font-size:1.15rem}
.step p{color:var(--ink-soft); font-size:.95rem}

/* pricing */
.price-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:48px}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:36px; display:flex; flex-direction:column; box-shadow:var(--shadow)}
.card.featured{border-color:var(--accent); position:relative}
.badge{position:absolute; top:-13px; left:36px; background:var(--accent); color:var(--accent-ink); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:6px 14px; border-radius:100px}
.card h3{font-size:1.6rem}
.price{font-family:var(--font-display); font-size:2.8rem; font-weight:700; margin:10px 0 4px}
.price small{font-family:var(--font-body); font-size:.9rem; font-weight:500; color:var(--ink-soft)}
.card>p{color:var(--ink-soft); margin-bottom:20px}
.feats{list-style:none; display:flex; flex-direction:column; gap:11px; margin-bottom:28px; flex:1}
.feats li{display:flex; gap:10px; align-items:flex-start; font-size:.95rem}
.feats li::before{content:""; flex:none; width:18px; height:18px; margin-top:3px; border-radius:50%;
  background:var(--accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c6b3c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat}
.price-sub{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px}
.mini{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px}
.mini h3{font-size:1.25rem} .mini .price{font-size:1.9rem; margin:6px 0}
.mini p{color:var(--ink-soft); font-size:.92rem; margin:8px 0 16px}

/* add-on teaser grid (home) */
.addon-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:36px 0 28px}
.addon{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:20px 22px; font-weight:500}
.addon span{display:block; color:var(--ink-soft); font-size:.85rem; margin-top:4px}

/* proof */
.quote{font-family:var(--font-display); font-style:italic; font-size:clamp(1.5rem,3vw,2.4rem); line-height:1.3; max-width:24ch; font-weight:500}
.quote-by{margin-top:18px; font-weight:600; color:var(--ink-soft); font-style:normal; font-family:var(--font-body); font-size:1rem}
.client-list{list-style:none; display:flex; flex-wrap:wrap; gap:14px; margin-top:40px}
.client-list a{text-decoration:none; border:1px solid var(--line); border-radius:100px; padding:10px 20px; font-weight:600; transition:border-color .2s,color .2s}
.client-list a:hover{border-color:var(--accent); color:var(--accent)}
.client-list span{display:block; font-weight:400; font-size:.8rem; color:var(--ink-soft)}

/* work / why */
.work-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:40px 0}
.work-card{aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--surface-2); display:grid; place-items:center; color:var(--ink-soft); text-decoration:none; font-family:var(--font-display); font-size:1.3rem; position:relative}
.work-card img{width:100%;height:100%;object-fit:cover; transition:transform .6s var(--ease)}
.work-card:hover img{transform:scale(1.04)}
.why-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:48px}
.why-item{padding:28px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface)}
.why-item h3{font-size:1.2rem; margin-bottom:8px}
.why-item p{color:var(--ink-soft); font-size:.95rem}

/* faq */
.faq-list{margin-top:40px; max-width:780px}
details{border-bottom:1px solid var(--line)}
summary{font-family:var(--font-display); font-size:1.15rem; font-weight:600; padding:22px 36px 22px 0; cursor:pointer; list-style:none; position:relative; transition:color .2s}
summary:hover{color:var(--accent)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+"; position:absolute; right:4px; top:18px; font-size:1.6rem; color:var(--accent); transition:transform .3s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 24px; color:var(--ink-soft); max-width:68ch}

/* final cta */
.final{text-align:center; background:var(--accent-soft)}
.final h2{max-width:18ch; margin-inline:auto}
.final .lead{margin:22px auto 32px; text-align:center}

/* footer */
footer{background:var(--surface-2); border-top:1px solid var(--line); padding-block:56px 40px}
.foot-top{display:flex; justify-content:space-between; flex-wrap:wrap; gap:28px}
.foot-links{list-style:none; display:flex; flex-wrap:wrap; gap:22px}
.foot-links a{text-decoration:none; color:var(--ink-soft); font-size:.9rem}
.foot-links a:hover{color:var(--ink)}
.foot-meta{margin-top:32px; color:var(--ink-soft); font-size:.85rem; display:flex; flex-direction:column; gap:4px}

/* sticky whatsapp */
.wa-fab{position:fixed; right:22px; bottom:22px; z-index:60; display:flex; align-items:center}
.wa-bubble{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow); border-radius:14px 14px 4px 14px;
  padding:12px 16px; margin-right:12px; max-width:210px; font-size:.88rem; opacity:0; transform:translateY(8px) scale(.96);
  transition:opacity .4s var(--ease),transform .4s var(--ease); pointer-events:none}
.wa-bubble.show{opacity:1; transform:none}
.wa-bubble b{display:block; font-family:var(--font-display)}
.wa-btn{position:relative; flex:none; width:60px; height:60px; border-radius:50%; background:#25d366; color:#fff; display:grid; place-items:center; box-shadow:0 12px 30px -8px rgba(37,211,102,.6); transition:transform .3s var(--ease); text-decoration:none}
.wa-btn:hover{transform:scale(1.07)}
.wa-btn svg{width:32px;height:32px}
.wa-dot{position:absolute; top:-2px; right:-2px; width:22px; height:22px; border-radius:50%; background:#ff3b30; color:#fff; font-size:.72rem; font-weight:700; display:grid; place-items:center; border:2px solid var(--bg)}

/* cursor */
.cursor{position:fixed; top:0; left:0; width:30px; height:30px; border:1.5px solid var(--accent); border-radius:50%; pointer-events:none; z-index:90; transform:translate(-50%,-50%); mix-blend-mode:difference; transition:width .25s,height .25s,background .25s; display:none}
.cursor.grow{width:54px; height:54px; background:rgba(98,192,132,.18)}

/* ============ ADD-ONS CATALOGUE + CART ============ */
.filters{display:flex; flex-wrap:wrap; gap:10px; margin:36px 0 8px}
.chip{border:1.5px solid var(--line); background:transparent; color:var(--ink-soft); padding:9px 18px; border-radius:100px; font-weight:600; font-size:.9rem; cursor:pointer; transition:all .2s}
.chip:hover{border-color:var(--accent); color:var(--accent)}
.chip[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); color:var(--accent-ink)}
.cat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:28px}
.cat-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; display:flex; flex-direction:column; gap:6px; transition:border-color .2s, transform .2s}
.cat-card.in-cart{border-color:var(--accent)}
.cat-card .name{font-family:var(--font-display); font-size:1.2rem; font-weight:600}
.cat-card .desc{color:var(--ink-soft); font-size:.9rem; flex:1}
.cat-card .row{display:flex; align-items:center; justify-content:space-between; margin-top:14px}
.cat-card .amt{font-family:var(--font-display); font-weight:700; font-size:1.3rem}
.add-btn{border:1.5px solid var(--accent); color:var(--accent); background:transparent; border-radius:100px; padding:8px 18px; font-weight:600; font-size:.9rem; cursor:pointer; transition:all .2s}
.add-btn:hover{background:var(--accent-soft)}
.add-btn.added{background:var(--accent); color:var(--accent-ink)}
.bundle-row{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:28px}
.bundle{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:26px}
.bundle h3{font-size:1.25rem} .bundle .amt{font-family:var(--font-display); font-weight:700; font-size:1.6rem; color:var(--accent); margin:6px 0}
.bundle ul{list-style:none; margin:12px 0 18px; display:flex; flex-direction:column; gap:6px; font-size:.88rem; color:var(--ink-soft)}

/* cart bar */
.cart-bar{position:fixed; left:0; right:0; bottom:0; z-index:62; background:var(--surface); border-top:1px solid var(--line);
  box-shadow:0 -18px 50px -30px rgba(0,0,0,.5); transform:translateY(110%); transition:transform .4s var(--ease)}
.cart-bar.show{transform:none}
.cart-inner{max-width:var(--wrap); margin-inline:auto; padding:16px clamp(20px,5vw,56px); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap}
.cart-info{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.cart-count{background:var(--accent); color:var(--accent-ink); border-radius:100px; padding:4px 12px; font-weight:700; font-size:.85rem}
.cart-total{font-family:var(--font-display); font-weight:700; font-size:1.3rem}
.cart-items{font-size:.85rem; color:var(--ink-soft); max-width:46ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cart-actions{display:flex; gap:10px; align-items:center}
.cart-clear{background:none; border:none; color:var(--ink-soft); text-decoration:underline; cursor:pointer; font-size:.85rem}

/* a11y / focus */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2.5px solid var(--accent); outline-offset:3px; border-radius:6px}
.skip{position:absolute; left:-999px; top:8px; background:var(--accent); color:#fff; padding:10px 16px; border-radius:8px; z-index:100}
.skip:focus{left:8px}

/* responsive */
@media(max-width:880px){
  .nav-links{display:none}
  .menu-toggle{display:grid}
  .steps{grid-template-columns:1fr 1fr}
  .price-grid,.price-sub,.why-grid{grid-template-columns:1fr}
  .addon-grid,.work-cards,.cat-grid{grid-template-columns:1fr 1fr}
  .bundle-row{grid-template-columns:1fr 1fr}
  .nav-cta{display:none}
}
@media(max-width:520px){
  .steps,.addon-grid,.work-cards,.cat-grid,.bundle-row{grid-template-columns:1fr}
  .hero-trust{gap:18px}
  .cart-items{display:none}
}

/* theme wipe (copied from growuild.com criss-cross clip-path) — sits BEHIND content so it never covers text/elements */
.theme-wipe{position:fixed; inset:0; z-index:-1; pointer-events:none; clip-path:circle(0% at 100% 0%)}
.theme-wipe.wipe-to-light{background:#f6f3ec; clip-path:circle(0% at 100% 0%); transition:clip-path .9s var(--ease)}
.theme-wipe.wipe-to-light.active{clip-path:circle(150% at 100% 0%)}
.theme-wipe.wipe-to-dark{background:#12140e; clip-path:circle(0% at 0% 0%); transition:clip-path .9s var(--ease)}
.theme-wipe.wipe-to-dark.active{clip-path:circle(150% at 0% 0%)}
#themeBtn svg{transition:transform .6s var(--ease)}
#themeBtn.spin svg{transform:rotate(360deg)}

/* rotating WhatsApp notification (copied from growuild.com) */
.wa-rotating{position:relative; height:18px; overflow:hidden; margin-top:3px}
.wa-rot{position:absolute; inset:0; font-size:.76rem; color:var(--ink-soft); white-space:nowrap; opacity:0; transform:translateY(10px); transition:opacity .5s var(--ease), transform .5s var(--ease)}
.wa-rot.active{opacity:1; transform:none}

/* trust strip (after hero) */
.trust-strip{border-bottom:1px solid var(--line); background:var(--surface)}
.trust-strip .wrap{display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; padding-block:15px; font-size:.9rem; color:var(--ink-soft)}
.trust-strip b{color:var(--ink); font-family:var(--font-display); font-weight:700}
.trust-strip .ts-clients{font-weight:600; color:var(--ink)}
.trust-strip .ts-sep{width:1px; height:15px; background:var(--line); display:inline-block}

/* repeated CTA band */
.cta-band{text-align:center; padding-block:clamp(40px,7vh,72px)}
.cta-band p{font-family:var(--font-display); font-size:clamp(1.2rem,2.4vw,1.8rem); font-weight:600; margin-bottom:22px; color:var(--ink); max-width:22ch; margin-inline:auto}

/* sticky mobile CTA bar */
.sticky-cta{position:fixed; left:0; right:0; bottom:0; z-index:58; display:none;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--bg) 92%,transparent); backdrop-filter:blur(12px);
  border-top:1px solid var(--line); transform:translateY(115%); transition:transform .4s var(--ease)}
.sticky-cta.show{transform:none}
.sticky-cta .btn{width:100%; justify-content:center}
@media(max-width:880px){ .sticky-cta{display:block} body.has-sticky-cta .wa-fab{bottom:86px} }

/* reduced motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important}
  .word .inner{transform:none!important}
  .reveal,.stagger>*{opacity:1!important; transform:none!important}
  .marquee-track{animation:none!important}
}