/* ============================================================
   Morello Landing Page - Direction 9 brand system
   Midnight / porcelain / hi-vis citrus / electric cyan
   ============================================================ */
:root{
  --c-morello:#0A1530; --c-morello-deep:#050A18; --c-morello-warm:#1A2548;
  --c-cream:#F2F1ED; --c-cream-warm:#E8E7E0; --c-charcoal:#141414; --c-charcoal-soft:#2A2A2A;
  --c-hi-vis:#B7FF1F; --c-hi-vis-dark:#9DE000; --c-cyan:#00E5FF; --c-blush:#057A8C; --c-yellow:#5CEFFF;
  --f-display:'Anton',Impact,sans-serif;
  --f-body:'General Sans',system-ui,-apple-system,sans-serif;
  --f-mono:'Geist Mono',ui-monospace,monospace;
  --container:1240px; --gutter:clamp(20px,4vw,56px); --section-py:clamp(72px,11vw,148px);
  --r:8px; --r-lg:16px; --r-pill:999px; --card-radius:clamp(32px,4vw,52px);
  --ease:cubic-bezier(0.25,1,0.5,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--f-body);font-size:17px;line-height:1.55;color:var(--c-charcoal);background:var(--c-morello-deep);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
ul{list-style:none;padding:0;margin:0}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;line-height:0.95;letter-spacing:0.005em;margin:0;text-transform:uppercase}
h2{font-size:clamp(34px,5vw,68px)}
h3{font-size:clamp(28px,3.4vw,44px)}
h4{font-size:clamp(19px,2vw,24px);letter-spacing:0.01em}
p{margin:0 0 1em}
em{font-style:normal;color:var(--c-cyan)}
.container{width:100%;max-width:var(--container);margin:0 auto;padding-inline:var(--gutter)}
.narrow{max-width:820px}
.center,.center *{text-align:center}
::selection{background:var(--c-hi-vis);color:var(--c-charcoal)}

/* ---- Eyebrow ---- */
.eyebrow{font-family:var(--f-mono);font-size:12px;letter-spacing:0.18em;text-transform:uppercase;font-weight:500;display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;color:var(--c-cyan)}
.eyebrow__dot{width:9px;height:9px;background:var(--c-hi-vis);border-radius:2px;display:inline-block}
.eyebrow--center{justify-content:center}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;gap:9px;padding:16px 28px;border-radius:var(--r-pill);font-family:var(--f-body);font-weight:600;font-size:15px;letter-spacing:0.01em;border:2px solid transparent;cursor:pointer;transition:transform .2s var(--ease),background .2s var(--ease);will-change:transform}
.btn--primary{background:var(--c-hi-vis);color:var(--c-charcoal);border-color:var(--c-hi-vis)}
.btn--primary:hover{background:var(--c-hi-vis-dark);border-color:var(--c-hi-vis-dark);transform:translateY(-2px)}
.btn--sm{padding:11px 20px;font-size:13.5px}
.btn--lg{padding:18px 34px;font-size:16px}
.btn--xl{padding:22px 44px;font-size:18px}
.btn__arrow{transition:transform .3s var(--ease)}
.btn:hover .btn__arrow{transform:translateX(4px)}
.cta-row{margin-top:38px}
.center .cta-row{display:flex;justify-content:center}

/* ---- Section colour variants + cards ---- */
.section{padding-block:var(--section-py);position:relative;overflow:hidden}
.section--morello{background:var(--c-morello);color:var(--c-cream)}
.section--cream{background:var(--c-cream);color:var(--c-charcoal)}
.section--ink{background:var(--c-morello-deep);color:var(--c-cream)}
.card{border-top-left-radius:var(--card-radius);border-top-right-radius:var(--card-radius);margin-top:calc(-1 * var(--card-radius));z-index:1;box-shadow:0 -10px 28px -8px rgba(0,0,0,.28)}
.home>.section:first-child{margin-top:0}
.accent-dark{color:var(--c-morello)}
.lead{font-size:clamp(18px,2.1vw,22px);line-height:1.5;opacity:.92;max-width:60ch}
h2+.lead,.eyebrow+h2{margin-top:.5em}
.note-center{text-align:center;font-family:var(--f-mono);font-size:13px;letter-spacing:.04em;opacity:.7;margin-top:34px}

/* ============================ HEADER ============================ */
.site-header{position:fixed;inset:0 0 auto 0;z-index:60;padding:16px 0;transition:background .4s var(--ease),padding .4s var(--ease)}
.site-header.is-scrolled{background:rgba(5,10,24,.82);backdrop-filter:blur(14px) saturate(140%);padding:10px 0;box-shadow:0 1px 0 rgba(0,229,255,.1)}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-family:var(--f-display);font-size:24px;letter-spacing:.02em;color:var(--c-cream);text-transform:uppercase}
.brand__dot{color:var(--c-hi-vis)}

/* ============================ HERO ============================ */
.hero{position:relative;padding-top:clamp(120px,16vw,180px);padding-bottom:clamp(60px,9vw,110px)}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.hero__h1{font-size:clamp(44px,6.6vw,92px);margin:.1em 0 .4em;color:var(--c-cream)}
.hero__h1 .hl{color:var(--c-hi-vis)}
.hero__sub{font-size:clamp(17px,1.9vw,21px);line-height:1.5;color:var(--c-cream);opacity:.86;max-width:46ch}
.hero__actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:34px}
.hero__note{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.04em;opacity:.62;color:var(--c-cream)}
.hero__proof{display:flex;align-items:center;gap:10px;margin-top:30px;font-size:14px;color:var(--c-cream);opacity:.8}
.stars{color:var(--c-hi-vis);letter-spacing:2px}
.hero__fade{position:absolute;inset:auto 0 0 0;height:120px;background:linear-gradient(transparent,var(--c-morello-deep));pointer-events:none}

/* Geo Grid viz */
.hero__viz{position:relative}
.geogrid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(6px,1vw,11px);aspect-ratio:1;padding:18px;background:radial-gradient(circle at 35% 35%,rgba(0,229,255,.10),transparent 60%),var(--c-morello);border:1px solid rgba(0,229,255,.18);border-radius:var(--r-lg);box-shadow:0 30px 80px -30px rgba(0,0,0,.7)}
.gcell{display:flex;align-items:center;justify-content:center;border-radius:50%;font-family:var(--f-mono);font-size:clamp(10px,1.3vw,15px);font-weight:500;color:#06210a;aspect-ratio:1;opacity:0;transform:scale(.4);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.gcell.in{opacity:1;transform:scale(1)}
.gcell--green{background:var(--c-hi-vis)}
.gcell--amber{background:#FFC73A}
.gcell--red{background:#FF5A4D;color:#2a0603}
.geogrid__legend{display:flex;justify-content:center;gap:18px;margin-top:16px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.04em;color:var(--c-cream);opacity:.82}
.geogrid__legend span{display:inline-flex;align-items:center;gap:7px}
.dot{width:11px;height:11px;border-radius:50%;display:inline-block}
.dot--green{background:var(--c-hi-vis)}.dot--amber{background:#FFC73A}.dot--red{background:#FF5A4D}

/* ============================ TRUST STRIP ============================ */
.trust-strip{background:var(--c-morello-deep);padding:30px 0 46px;color:var(--c-cream);text-align:center}
.trust-strip__items{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;margin-top:6px;font-family:var(--f-display);text-transform:uppercase;font-size:clamp(18px,2.4vw,30px);opacity:.5;letter-spacing:.02em}
.trust-strip__items i{color:var(--c-cyan);font-style:normal;font-size:.6em}

/* ============================ STEPS / MECHANISM ============================ */
.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.5vw,28px);margin-top:48px}
.step{background:#fff;border:1px solid var(--c-cream-warm);border-radius:var(--r-lg);padding:28px}
.step__n{font-family:var(--f-mono);font-size:13px;color:var(--c-blush);letter-spacing:.1em}
.step h4{margin:12px 0 8px;color:var(--c-morello)}
.step p{margin:0;font-size:15.5px;opacity:.82}

/* ============================ PROOF ============================ */
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.proof__card{margin:0;background:var(--c-morello);border:1px solid rgba(0,229,255,.18);border-radius:var(--r-lg);padding:26px;color:var(--c-cream)}
.proof__card p{font-size:16px;line-height:1.5;margin:14px 0}
.proof__card cite{font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;font-style:normal;color:var(--c-cyan)}

/* ============================ OFFER ============================ */
.offer{margin:40px 0 0;display:grid;gap:14px}
.offer li{position:relative;padding:18px 20px 18px 56px;background:#fff;border:1px solid var(--c-cream-warm);border-radius:var(--r);font-size:16px}
.offer li::before{content:"";position:absolute;left:20px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:50%;background:var(--c-hi-vis);box-shadow:0 0 0 4px rgba(183,255,31,.18)}
.offer li b{color:var(--c-morello)}
.risk{margin-top:26px;font-weight:600;color:var(--c-blush)}

/* ============================ FOUNDER ============================ */
.founder{display:flex;gap:28px;align-items:center}
.founder__avatar{flex:none;width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,var(--c-cyan),var(--c-blush));display:grid;place-items:center;font-family:var(--f-display);font-size:44px;color:var(--c-morello-deep)}
.founder__body h3{color:var(--c-cream);margin:6px 0 12px}

/* ============================ FAQ ============================ */
.faq{margin-top:36px;display:grid;gap:12px}
.faq details{background:#fff;border:1px solid var(--c-cream-warm);border-radius:var(--r);padding:18px 22px}
.faq summary{font-weight:600;cursor:pointer;color:var(--c-morello);list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq summary::after{content:"+";font-family:var(--f-mono);color:var(--c-blush);font-size:20px}
.faq details[open] summary::after{content:"-"}
.faq p{margin:14px 0 0;font-size:15.5px;opacity:.85}

/* ============================ FINAL CTA ============================ */
.final-cta{background:var(--c-morello-deep);color:var(--c-cream);padding-top:clamp(72px,11vw,140px);border-top-left-radius:var(--card-radius);border-top-right-radius:var(--card-radius);margin-top:calc(-1 * var(--card-radius));position:relative;z-index:1;box-shadow:0 -10px 28px -8px rgba(0,0,0,.28)}
.final-cta__h{font-size:clamp(40px,6vw,84px);color:var(--c-cream);margin:.2em 0}
.final-cta .btn{margin-top:14px}
.footer{margin-top:clamp(60px,9vw,110px);padding:28px 0;border-top:1px solid rgba(255,255,255,.08);font-family:var(--f-mono);font-size:12.5px;letter-spacing:.03em;opacity:.55;text-align:center}

/* ============================ STICKY MOBILE CTA ============================ */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:55;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(5,10,24,.92);backdrop-filter:blur(12px);border-top:1px solid rgba(0,229,255,.14);display:none;transform:translateY(120%);transition:transform .4s var(--ease)}
.sticky-cta.show{transform:translateY(0)}
.sticky-cta .btn{width:100%;justify-content:center}

/* ============================ CHATBOT ============================ */
.chat-launcher{position:fixed;right:20px;bottom:20px;z-index:70;display:inline-flex;align-items:center;gap:10px;padding:12px 18px 12px 14px;border:none;border-radius:var(--r-pill);background:var(--c-hi-vis);color:var(--c-charcoal);font-weight:600;font-size:14.5px;cursor:pointer;box-shadow:0 12px 34px -8px rgba(183,255,31,.5);transition:transform .25s var(--ease)}
.chat-launcher:hover{transform:translateY(-3px)}
.chat-launcher__label{white-space:nowrap}
.chat-launcher__pulse{position:absolute;inset:0;border-radius:var(--r-pill);box-shadow:0 0 0 0 rgba(183,255,31,.55);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(183,255,31,.5)}70%{box-shadow:0 0 0 16px rgba(183,255,31,0)}100%{box-shadow:0 0 0 0 rgba(183,255,31,0)}}
.chat-launcher.hidden{display:none}

.chat{position:fixed;right:20px;bottom:20px;z-index:71;width:min(380px,calc(100vw - 32px));height:min(580px,calc(100vh - 40px));background:var(--c-morello);border:1px solid rgba(0,229,255,.2);border-radius:20px;box-shadow:0 30px 80px -20px rgba(0,0,0,.7);display:none;flex-direction:column;overflow:hidden}
.chat.open{display:flex;animation:chatin .3s var(--ease)}
@keyframes chatin{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.chat__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:var(--c-morello-deep);border-bottom:1px solid rgba(0,229,255,.12)}
.chat__head-id{display:flex;align-items:center;gap:12px;color:var(--c-cream)}
.chat__avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--c-cyan),var(--c-blush));display:grid;place-items:center;font-family:var(--f-display);font-size:18px;color:var(--c-morello-deep)}
.chat__head-id b{font-size:14.5px;display:block}
.chat__status{font-family:var(--f-mono);font-size:11px;color:var(--c-hi-vis);opacity:.9}
.chat__close{background:none;border:none;color:var(--c-cream);font-size:26px;line-height:1;cursor:pointer;opacity:.7}
.chat__close:hover{opacity:1}
.chat__body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px}
.msg{max-width:84%;padding:12px 15px;border-radius:16px;font-size:14.5px;line-height:1.45;animation:msgin .3s var(--ease)}
@keyframes msgin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg--bot{align-self:flex-start;background:var(--c-morello-warm);color:var(--c-cream);border-bottom-left-radius:5px}
.msg--user{align-self:flex-end;background:var(--c-hi-vis);color:var(--c-charcoal);border-bottom-right-radius:5px;font-weight:500}
.typing{display:inline-flex;gap:4px;padding:14px 16px}
.typing span{width:7px;height:7px;border-radius:50%;background:var(--c-cyan);opacity:.6;animation:typing 1.2s infinite}
.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}
@keyframes typing{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
.chat__input{padding:14px;border-top:1px solid rgba(0,229,255,.12);background:var(--c-morello-deep)}
.chat-choices{display:flex;flex-wrap:wrap;gap:8px}
.chat-chip{padding:9px 15px;border-radius:var(--r-pill);border:1.5px solid var(--c-cyan);background:transparent;color:var(--c-cyan);font-size:13.5px;font-weight:500;cursor:pointer;transition:all .2s}
.chat-chip:hover{background:var(--c-cyan);color:var(--c-morello-deep)}
.chat-field{display:flex;gap:8px}
.chat-field input{flex:1;padding:12px 14px;border-radius:var(--r-pill);border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:var(--c-cream);font-size:14.5px;outline:none}
.chat-field input:focus{border-color:var(--c-cyan)}
.chat-field input::placeholder{color:rgba(242,241,237,.4)}
.chat-send{flex:none;width:46px;border-radius:50%;border:none;background:var(--c-hi-vis);color:var(--c-charcoal);font-size:18px;cursor:pointer;display:grid;place-items:center}
.chat__brand{text-align:center;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-cream);opacity:.35;padding:0 0 8px}
.chat__progress{height:3px;background:rgba(255,255,255,.08)}
.chat__progress-bar{height:100%;background:var(--c-hi-vis);width:0;transition:width .4s var(--ease)}

/* ============================ RESPONSIVE ============================ */
@media (max-width:860px){
  .hero__grid{grid-template-columns:1fr;gap:40px}
  .hero__viz{max-width:420px;margin:0 auto;width:100%}
  .steps,.proof{grid-template-columns:1fr}
  .founder{flex-direction:column;text-align:center}
  .site-header .btn{display:none}
}
@media (max-width:600px){
  :root{--card-radius:26px}
  .sticky-cta{display:block}
  .chat-launcher__label{display:none}
  .chat-launcher{padding:14px;right:16px;bottom:76px}
  .chat{bottom:0;right:0;width:100vw;height:100dvh;border-radius:0}
}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* ---- Chatbot enticement teaser ---- */
.chat-teaser{position:fixed;right:20px;bottom:88px;z-index:69;width:300px;max-width:calc(100vw - 32px);
  background:var(--c-morello);border:1px solid rgba(0,229,255,.28);border-radius:16px;padding:16px 16px 14px;
  box-shadow:0 24px 60px -16px rgba(0,0,0,.6);cursor:pointer;opacity:0;transform:translateY(14px) scale(.96);
  transition:opacity .35s var(--ease),transform .35s var(--ease)}
.chat-teaser.in{opacity:1;transform:none}
.chat-teaser__row{display:flex;gap:11px;align-items:flex-start}
.chat-teaser__av{flex:none;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--c-cyan),var(--c-blush));
  display:grid;place-items:center;font-family:var(--f-display);font-size:15px;color:var(--c-morello-deep)}
.chat-teaser p{margin:0;font-size:13.5px;line-height:1.45;color:var(--c-cream)}
.chat-teaser__cta{display:inline-block;margin:12px 0 0 45px;font-weight:600;font-size:13.5px;color:var(--c-hi-vis)}
.chat-teaser__x{position:absolute;top:7px;right:9px;background:none;border:none;color:var(--c-cream);opacity:.55;
  font-size:18px;line-height:1;cursor:pointer}
.chat-teaser__x:hover{opacity:1}
@media (max-width:600px){.chat-teaser{bottom:140px;right:16px}}

/* ============================================================
   CLASSIC layout additions (exact gg1 copy + real images)
   ============================================================ */
.logo{height:30px;width:auto;filter:brightness(0) invert(1)}
.hero__h1--classic{font-size:clamp(38px,5.6vw,80px)}
.hero__heroimg{border-radius:var(--r-lg);box-shadow:0 30px 80px -30px rgba(0,0,0,.7);background:#fff}

/* image + text row */
.media-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.media-row--rev .media-row__img{order:2}
.media-row__img img{border-radius:var(--r-lg);box-shadow:0 24px 60px -28px rgba(0,0,0,.45)}
.section--cream .media-row__img img{border:1px solid var(--c-cream-warm)}
.lead+.cta-row{margin-top:30px}

/* generic bullet list */
.ticks{margin:26px 0 0;display:grid;gap:13px}
.ticks li{position:relative;padding-left:34px;font-size:17px;line-height:1.5}
.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:18px;height:18px;border-radius:50%;background:var(--c-hi-vis);box-shadow:0 0 0 4px rgba(183,255,31,.16)}
.section--cream .ticks li b,.section--cream .ticks li strong{color:var(--c-morello)}

/* cross list (this is NOT) */
.crosses{margin:24px 0 0;display:grid;gap:12px}
.crosses li{position:relative;padding-left:34px;font-size:16.5px;opacity:.9}
.crosses li::before{content:"\00d7";position:absolute;left:2px;top:-4px;color:#FF5A4D;font-size:24px;font-weight:700;line-height:1}

/* search-intent quote chips */
.searchqs{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.searchq{font-family:var(--f-mono);font-size:14px;padding:10px 16px;border-radius:var(--r-pill);border:1px solid rgba(0,229,255,.3);color:var(--c-cyan)}
.section--cream .searchq{border-color:var(--c-cream-warm);color:var(--c-blush);background:#fff}

/* "what you get" icon cards */
.gets{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:44px}
.get{background:#fff;border:1px solid var(--c-cream-warm);border-radius:var(--r-lg);padding:26px}
.get__ic{width:52px;height:52px;border-radius:13px;background:var(--c-morello);display:grid;place-items:center;margin-bottom:16px;padding:11px}
.get__ic img{width:100%;height:100%;object-fit:contain}
.get h4{color:var(--c-morello);margin:0 0 8px}
.get p{margin:0;font-size:15px;opacity:.82}

/* testimonials grid (10) */
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px;margin-top:46px}
.tcard{background:var(--c-morello);border:1px solid rgba(0,229,255,.16);border-radius:var(--r-lg);padding:24px;color:var(--c-cream);display:flex;flex-direction:column;gap:10px}
.tcard__cat{font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;color:var(--c-cyan)}
.tcard .stars{font-size:15px}
.tcard p{margin:0;font-size:15px;line-height:1.5}
.tcard__res{font-weight:600;color:var(--c-hi-vis);font-size:14.5px}
.tcard__ba{display:flex;gap:18px;font-size:14px}
.tcard__ba b{color:var(--c-cyan)}

/* numbered how-to steps */
.howto{counter-reset:s;margin:28px 0 0;display:grid;gap:14px}
.howto li{counter-increment:s;position:relative;padding-left:52px;font-size:17px;line-height:1.5;min-height:36px;display:flex;align-items:center}
.howto li::before{content:counter(s);position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;background:var(--c-hi-vis);color:var(--c-charcoal);font-family:var(--f-display);display:grid;place-items:center;font-size:17px}

.scarcity{margin-top:22px;font-family:var(--f-mono);font-size:13px;letter-spacing:.03em;color:var(--c-cyan);opacity:.9}
.disclaimer{font-size:11.5px;opacity:.5;line-height:1.6;margin-top:14px}
.footer a{color:inherit;border-bottom:1px solid rgba(255,255,255,.25)}
.section--ink .ticks li,.section--ink .crosses li{color:var(--c-cream)}

@media (max-width:860px){
  .media-row{grid-template-columns:1fr;gap:32px}
  .media-row--rev .media-row__img{order:0}
}

/* ============================================================
   REVISION 2 - readability, compact hero, centred sections,
   media-row alignment, popup form modal
   ============================================================ */

/* Eyebrows: bigger + readable on every background */
.eyebrow{font-size:13.5px;letter-spacing:.16em;font-weight:500;margin-bottom:20px}
.section--cream .eyebrow,.section--cream .eyebrow .eyebrow__dot{color:var(--c-blush)}
.section--cream .eyebrow__dot{background:var(--c-blush)}

/* Bullets sized to match body copy */
.ticks li{font-size:18px;line-height:1.55}
.crosses li{font-size:17px}

/* White-card text contrast */
.get h4{color:var(--c-morello)}
.get p{color:var(--c-charcoal-soft);opacity:1}
.step p,.offer li,.faq p{opacity:1}

/* Media rows: pin image to top so long text reads cleanly, cap image size */
.media-row{align-items:start}
.media-row>*{min-width:0}
.media-row__img{position:sticky;top:96px}
.media-row__img img,.media-row__img .geogrid{max-width:min(520px,100%);margin-inline:auto}
@media (max-width:860px){.media-row__img{position:static;top:auto}}

/* COMPACT centred hero (no image) */
.hero{padding-top:clamp(116px,15vw,150px);padding-bottom:clamp(48px,7vw,84px)}
.hero__inner{max-width:860px;margin:0 auto;text-align:center;position:relative}
.hero__inner .eyebrow{justify-content:center}
.hero__h1{font-size:clamp(33px,5vw,62px);margin:.15em 0 .45em}
.hero__sub{font-size:clamp(16px,1.8vw,20px);max-width:44ch;margin:0 auto;opacity:.88}
.hero__actions{justify-content:center;margin-top:30px}
.hero__proof{justify-content:center;margin-top:26px}
.hero__scroll{display:inline-grid;place-items:center;width:42px;height:42px;margin-top:40px;border-radius:50%;border:1px solid rgba(0,229,255,.3);color:var(--c-cyan);font-size:20px;animation:bob 2s var(--ease) infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* Centred section helper */
.sec-center{text-align:center}
.sec-center .eyebrow{justify-content:center}
.sec-center .lead{margin-inline:auto}
.sec-center .ticks,.sec-center .crosses,.sec-center .howto{max-width:600px;margin-inline:auto;text-align:left}
.sec-center .cta-row{display:flex;justify-content:center}
.sec-center .gets{text-align:left}

/* ============================ POPUP FORM MODAL ============================ */
.modal{position:fixed;inset:0;z-index:90;display:none;align-items:flex-start;justify-content:center;padding:24px;overflow-y:auto}
.modal.open{display:flex}
.modal__overlay{position:fixed;inset:0;background:rgba(3,6,15,.78);backdrop-filter:blur(6px);animation:fade .25s var(--ease)}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal__card{position:relative;z-index:1;width:min(540px,100%);margin:auto;background:var(--c-morello);border:1px solid rgba(0,229,255,.22);border-radius:20px;padding:clamp(26px,4vw,42px);box-shadow:0 40px 100px -20px rgba(0,0,0,.7);animation:chatin .3s var(--ease);color:var(--c-cream)}
.modal__close{position:absolute;top:16px;right:18px;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:transparent;color:var(--c-cream);font-size:22px;line-height:1;cursor:pointer;opacity:.8}
.modal__close:hover{opacity:1;border-color:var(--c-cyan)}
.modal__title{font-size:clamp(26px,3.4vw,40px);color:var(--c-cream);margin:0 36px .4em 0;line-height:1}
.modal__title .hl,.modal__sub{color:var(--c-cream)}
.modal__sub{font-size:15px;opacity:.8;margin:0 0 24px}
.mform{display:grid;gap:14px}
.mfield{width:100%;padding:15px 18px;border-radius:12px;border:1.5px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--c-cream);font-size:16px;font-family:var(--f-body);outline:none;transition:border-color .2s}
.mfield::placeholder{color:rgba(242,241,237,.45)}
.mfield:focus{border-color:var(--c-cyan)}
.mfield.err{border-color:#FF5A4D}
.mteam{margin-top:4px}
.mteam.err .mteam__label{color:#FF5A4D}
.mteam__label{display:block;font-family:var(--f-mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--c-cyan);margin-bottom:10px}
.mteam__opts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.mteam__opt{padding:14px 8px;border-radius:12px;border:1.5px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--c-cream);font-size:15px;font-weight:600;cursor:pointer;transition:all .2s}
.mteam__opt:hover{border-color:var(--c-cyan)}
.mteam__opt.is-on{background:var(--c-hi-vis);color:var(--c-charcoal);border-color:var(--c-hi-vis)}
.mform__submit{margin-top:8px;width:100%;justify-content:center;display:inline-flex;align-items:center;gap:9px;padding:18px;border-radius:var(--r-pill);border:none;background:var(--c-hi-vis);color:var(--c-charcoal);font-family:var(--f-body);font-weight:700;font-size:17px;cursor:pointer;transition:background .2s,transform .2s}
.mform__submit:hover{background:var(--c-hi-vis-dark);transform:translateY(-2px)}
.mform__submit:disabled{opacity:.7;cursor:default;transform:none}
.mform__secure{text-align:center;font-size:12.5px;opacity:.65;margin:6px 0 0;line-height:1.5}
@media (max-width:480px){
  .modal{padding:0}
  .modal__card{border-radius:0;min-height:100vh;width:100%}
  .mteam__opts{grid-template-columns:repeat(2,1fr)}
}

/* ============================================================
   REVISION 3 - tick/cross markers, white image cards, callouts
   ============================================================ */

/* Green tick bullets (circle WITH a tick) */
.ticks li{padding-left:40px}
.ticks li::before{content:"\2713";width:24px;height:24px;top:.15em;background:var(--c-hi-vis);color:#0a1f02;display:grid;place-items:center;font-size:14px;font-weight:700;box-shadow:0 0 0 4px rgba(183,255,31,.14)}

/* Red cross bullets (circle WITH a cross) */
.crosses li{padding-left:40px;font-size:18px;line-height:1.55}
.crosses li::before{content:"\2715";left:0;top:.15em;width:24px;height:24px;border-radius:50%;background:#FF5A4D;color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;box-shadow:0 0 0 4px rgba(255,90,77,.14)}

/* White image card (guarantees a white bg behind a graphic) */
.imgcard{background:#fff;border-radius:var(--r-lg);padding:14px;box-shadow:0 26px 64px -28px rgba(0,0,0,.55);max-width:min(520px,100%);margin-inline:auto}
.imgcard img{border-radius:8px;box-shadow:none;width:100%}

/* Coloured callout box (a sub-panel inside a section) */
.callout{background:rgba(183,255,31,.12);border:1px solid rgba(183,255,31,.4);border-left:4px solid var(--c-hi-vis);border-radius:var(--r-lg);padding:26px 30px;margin-top:30px}
.callout p{margin:0;font-size:18px;line-height:1.55}
.callout--blue{background:var(--c-morello);color:var(--c-cream);border:1px solid rgba(0,229,255,.25);border-left:4px solid var(--c-cyan)}
.callout--blue h3{color:var(--c-cream);font-size:clamp(20px,2.4vw,28px);margin:0 0 16px}
.callout--blue .crosses li,.callout--blue p{color:var(--c-cream)}
.callout--blue .crosses{margin-top:0}
.callout--blue p:last-child{margin-top:18px}

/* Single-column "decisions" image */
.decisions-img{margin:24px 0 28px}

/* ============================================================
   REVISION 4 - numbered steps, 3/2 card grid, readable scarcity
   ============================================================ */

/* Numbered step boxes (How it Works, single column) */
.numsteps{display:grid;gap:14px;margin:30px 0 0}
.numstep{display:flex;gap:20px;align-items:center;background:var(--c-morello-warm);border:1px solid rgba(0,229,255,.16);border-radius:var(--r-lg);padding:20px 24px}
.numstep__n{flex:none;width:48px;height:48px;border-radius:12px;background:var(--c-hi-vis);color:var(--c-charcoal);font-family:var(--f-display);font-size:25px;display:grid;place-items:center}
.numstep p{margin:0;font-size:18px;line-height:1.5;color:var(--c-cream)}
@media (max-width:560px){.numstep{padding:16px 18px;gap:14px}.numstep__n{width:42px;height:42px;font-size:22px}}

/* "What you get" cards: 3 on top, 2 centred below (desktop) */
.gets{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}
.get{flex:0 1 calc(33.333% - 12px);max-width:400px;text-align:left}
@media (max-width:900px){.get{flex-basis:calc(50% - 9px)}}
@media (max-width:560px){.get{flex-basis:100%}}

/* Readable scarcity note (was unreadable cyan on cream) */
.scarcity{display:inline-block;background:rgba(5,122,140,.1);border:1px solid rgba(5,122,140,.4);color:var(--c-blush);font-family:var(--f-mono);font-size:13px;letter-spacing:.02em;line-height:1.5;padding:12px 22px;border-radius:18px;opacity:1;margin-top:26px}
.section--ink .scarcity,.section--morello .scarcity{background:rgba(0,229,255,.1);border-color:rgba(0,229,255,.35);color:var(--c-yellow)}

/* Footer was leaving a big empty navy gap (tall padding + margin). Make it a slim footer. */
.final-cta{padding-top:clamp(36px,4vw,56px);padding-bottom:0}
.final-cta .footer{margin-top:0}