:root{
  --bg:#F5F9F8;
  --bg-soft:#EAF2F0;
  --card:#FFFFFF;
  --ink:#000000;
  --ink-soft:#000000;
  --line:#D8E4E1;
  --teal:#087ea4;
  --teal-deep:#065F7D;
  --beak:#F49B33;
  --beak-soft:#FDEBD3;
  --foam:#CBE7E3;
  --shadow:0 14px 40px rgba(12,42,51,.10);
  --radius:20px;
}
[data-theme="dark"]{
  --bg:#081C24;
  --bg-soft:#0C2530;
  --card:#10303C;
  --ink:#EAF4F2;
  --ink-soft:#9FBCC0;
  --line:#1D4250;
  --teal:#2EA8D0;
  --teal-deep:#7ADCE8;
  --beak:#F5A94B;
  --beak-soft:#3A2E17;
  --foam:#12404E;
  --shadow:0 14px 40px rgba(0,0,0,.35);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Instrument Sans',sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
  transition:background .4s ease,color .4s ease;
  overflow-x:hidden;
}
h1,h2,h3{font-family:'Bricolage Grotesque',sans-serif;line-height:1.12}
.mono{font-family:'Spline Sans Mono',monospace}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;position:relative;z-index:1}
section{padding:104px 0;position:relative}
/* seamless section blending: soft-bg sections fade in via gradient rather than hard edges */
.soft-sec{background:linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 12%,var(--bg-soft) 88%,var(--bg) 100%)}
.eyebrow{
  font-family:'Spline Sans Mono',monospace;
  font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:var(--teal);display:inline-block;margin-bottom:18px;
  position:relative;padding-bottom:9px;
}
.eyebrow::after{
  content:"";position:absolute;left:0;bottom:0;width:36px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--beak),var(--teal));
}
#faq .eyebrow::after{left:50%;transform:translateX(-50%)}
/* hero eyebrow becomes the main stylish tagline */
.hero .eyebrow{
  font-family:'Bricolage Grotesque',sans-serif;
  font-size:clamp(1rem,1.5vw,1.22rem);letter-spacing:.01em;text-transform:none;font-weight:700;
  background:linear-gradient(95deg,var(--teal) 0%,var(--teal-deep) 45%,var(--beak) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  padding-bottom:0;margin-bottom:14px;
}
.hero .eyebrow::after{display:none}
/* ===== MORE VISIBLE SECTION HEADINGS ===== */
.section-title{
  font-family:'Bricolage Grotesque',sans-serif;
  font-size:clamp(2.1rem,4.4vw,3.1rem);font-weight:800;margin-bottom:16px;letter-spacing:-.02em;
  color:var(--ink);position:relative;
}
.section-title .hl{
  color:var(--teal);position:relative;display:inline-block;
}
.section-title .hl::after{
  content:"";position:absolute;left:0;right:0;bottom:.06em;height:.28em;
  background:var(--beak-soft);z-index:-1;border-radius:4px;
}
[data-theme="dark"] .section-title .hl::after{background:rgba(245,169,75,.22)}
.stack-title{display:flex;flex-direction:column;gap:2px;line-height:1.05;margin-bottom:20px}
.stack-title span{display:block}
.stack-title span:nth-child(1){color:var(--ink)}
.stack-title span:nth-child(2){color:var(--teal)}
.stack-title span:nth-child(3){color:var(--beak)}
.section-sub{color:var(--ink-soft);max-width:380px;font-size:1.05rem}

/* ============ SCROLL REVEAL ============ */
:root{--ease-out:cubic-bezier(.22,.61,.36,1)}
.reveal{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-38px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal-left.in{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(38px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal-right.in{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(.9) translateY(20px);transition:opacity .75s var(--ease-out),transform .75s var(--ease-out)}
.reveal-scale.in{opacity:1;transform:scale(1) translateY(0)}

/* scroll progress bar */
.scroll-bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--beak),var(--teal));z-index:99;width:0%;transition:width .1s linear}

/* ============ AMBIENT BACKGROUND LAYER ============ */
.bg-layer{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.32}
[data-theme="dark"] .bg-layer{opacity:.22}
.bg-layer svg{position:absolute;inset:0;width:100%;height:100%}
.chain-drift{animation:chainMove 38s linear infinite}
.chain-drift.d2{animation-duration:60s;animation-delay:-20s}
.chain-drift.d3{animation-duration:54s;animation-delay:-36s}
@keyframes chainMove{
  0%{transform:translate(-8vw,0)}
  50%{transform:translate(50vw,-5vh)}
  100%{transform:translate(108vw,1vh)}
}

/* hero gradient wave (feels-alive layer) */
.wave-bg{
  position:absolute;inset:-60px;z-index:0;
  background:linear-gradient(120deg,var(--foam),var(--bg),var(--beak-soft),var(--foam));
  background-size:250% 250%;animation:waveShift 16s ease infinite;opacity:.55;
}
@keyframes waveShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media(prefers-reduced-motion:reduce){
  .bg-layer,.wave-bg{animation:none!important}
  .chain-drift{animation:none!important}
}

/* ============ FLOATING LINK NODES (SIDE-EDGE, FADE IN/OUT) ============ */
.link-nodes{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.link-nodes svg{width:100%;height:100%}
.link-nodes .node{fill:var(--teal)}
.link-nodes .edge{stroke:var(--teal);stroke-width:1;fill:none}
.link-nodes .n1{animation:nodeFade 6s ease-in-out infinite}
.link-nodes .n2{animation:nodeFade 7s ease-in-out infinite 1.4s}
.link-nodes .n3{animation:nodeFade 5.4s ease-in-out infinite 2.8s}
.link-nodes .n4{animation:nodeFade 6.6s ease-in-out infinite .7s}
.link-nodes .n5{animation:nodeFade 5.8s ease-in-out infinite 3.4s}
.link-nodes .n6{animation:nodeFade 7.2s ease-in-out infinite 2s}
.link-nodes .e1{animation:edgeFade 6s ease-in-out infinite}
.link-nodes .e2{animation:edgeFade 5.4s ease-in-out infinite 2.8s}
.link-nodes .e3{animation:edgeFade 6.6s ease-in-out infinite .7s}
.link-nodes .e4{animation:edgeFade 5.8s ease-in-out infinite 3.4s}
@keyframes nodeFade{0%,100%{opacity:0}50%{opacity:.9}}
@keyframes edgeFade{0%,100%{opacity:0}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.link-nodes .node,.link-nodes .edge{animation:none;opacity:0}}

/* ============ PERSPECTIVE GRID FLYING FORWARD (MORE VISIBLE) ============ */
.grid-flow{
  position:absolute;left:0;right:0;top:0;height:100%;z-index:0;pointer-events:none;overflow:hidden;
  perspective:400px;opacity:.7;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 66%,transparent 97%);
  mask-image:linear-gradient(180deg,#000 0%,#000 66%,transparent 97%);
}
[data-theme="dark"] .grid-flow{opacity:.72}
.grid-flow .plane{
  position:absolute;left:-50%;right:-50%;top:10%;bottom:-120%;
  background-image:
    linear-gradient(var(--teal) 2.4px, transparent 2.4px),
    linear-gradient(90deg, var(--teal) 2.4px, transparent 2.4px);
  background-size:50px 50px;
  transform:rotateX(64deg);
  animation:gridFly 2.6s linear infinite;
}
/* soft glow line where the grid meets the horizon for extra clarity */
.grid-flow::before{
  content:"";position:absolute;left:0;right:0;top:38%;height:120px;
  background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--teal) 22%,transparent),transparent 70%);
  pointer-events:none;
}
@keyframes gridFly{from{background-position:0 0}to{background-position:0 50px}}
@media(prefers-reduced-motion:reduce){.grid-flow .plane{animation:none!important}}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .gull-fly,.wave-drift,.bob{animation:none!important}
  html{scroll-behavior:auto}
}

/* ============ NAV ============ */
nav{
  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 .4s ease,box-shadow .4s ease,background .4s ease;
}
nav.scrolled{
  border-bottom-color:var(--line);
  box-shadow:0 6px 24px rgba(12,42,51,.06);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:4px;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.35rem;color:var(--ink);text-decoration:none}


/* Header and footer logo image fix
   The logo container also uses .img-slot, which adds 20px padding.
   Resetting that padding gives the image the full 38px/52px box. */
.logo.logo-with-image,
footer .logo.logo-with-image{
  display:inline-flex;
  align-items:center;
  gap:2px;
  text-decoration:none;
}
.logo-image-slot{
  position:relative;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:0!important;
  flex:0 0 38px!important;
  padding:0!important;
  margin:0;
  gap:0!important;
  overflow:hidden;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  display:flex!important;
  align-items:center;
  justify-content:center;
}
.logo-image-slot>img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
footer .logo-image-slot{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  flex-basis:52px!important;
}
.logo-wordmark{line-height:1}

/* logo image placeholder box (replace in WordPress with your uploaded logo) */
.logo-slot{
  display:flex;align-items:center;justify-content:center;gap:8px;
  height:38px;min-width:150px;padding:0 14px;
  border:2px dashed var(--teal);border-radius:12px;background:var(--bg-soft);
  font-family:'Spline Sans Mono',monospace;font-size:.62rem;letter-spacing:.08em;
  color:var(--teal);text-align:center;text-decoration:none;text-transform:uppercase;
}
.nav-links{display:flex;gap:28px;align-items:center}
.nav-links a:not(.btn){color:var(--ink-soft);text-decoration:none;font-size:.95rem;font-weight:500;transition:color .2s,transform .2s;display:inline-block}
.nav-links a:not(.btn):hover{color:var(--teal);transform:translateY(-2px) scale(1.05)}

/* Make the Inventory link bold in the header and footer */
nav .nav-links a[href="#inventory"],
nav .nav-links a[href="/#inventory"],
footer .foot-grid a[href="#inventory"],
footer .foot-grid a[href="/#inventory"]{
  font-weight:800 !important;
}

.btn{
  display:inline-block;background:var(--teal);color:#fff;
  padding:13px 26px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.95rem;
  border:none;cursor:pointer;transition:transform .22s cubic-bezier(.34,1.38,.64,1),box-shadow .22s ease,background .2s;
}
.btn:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 12px 28px rgba(8,126,164,.4)}
.btn:active{transform:translateY(-1px) scale(1.02)}
.btn-beak{background:var(--beak);color:#22303A;box-shadow:0 6px 18px rgba(238,155,51,.32)}
.btn-beak:hover{box-shadow:0 14px 30px rgba(238,155,51,.5)}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal)}
/* hero ghost button sits over the animated grid, so give it a solid readable backdrop */
.hero .btn-ghost{
  background:var(--card);color:var(--ink);border:1.5px solid var(--teal);
  box-shadow:0 6px 18px rgba(12,42,51,.10);
}
.hero .btn-ghost:hover{background:var(--card);color:var(--teal);box-shadow:0 12px 26px rgba(8,126,164,.22)}
.nav-cta{background:var(--beak)!important;color:#22303A!important;box-shadow:0 6px 16px rgba(238,155,51,.35)}
.nav-cta:hover{box-shadow:0 14px 28px rgba(238,155,51,.5)}
#themeToggle{
  width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);
  background:var(--card);cursor:pointer;font-size:1.1rem;display:flex;align-items:center;justify-content:center;
  transition:transform .2s;color:var(--ink);
}
#themeToggle:hover{transform:rotate(20deg) scale(1.08)}
@media(max-width:760px){.nav-links a:not(.btn){display:none}}

/* ============ HERO ============ */
.hero{padding:110px 0 80px;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:38px;align-items:center;position:relative;z-index:1}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr}}
.hero h1{font-size:clamp(2.6rem,6vw,4.3rem);font-weight:800;letter-spacing:-.02em;margin-bottom:22px}
.hero h1 .fetch{color:var(--teal);position:relative;display:inline-block}
.hero h1 .fetch::after{
  content:"";position:absolute;left:0;bottom:6px;width:100%;height:10px;
  background:var(--beak-soft);z-index:-1;border-radius:6px;
}
.hero p.lede{font-size:1.15rem;color:var(--ink-soft);max-width:520px;margin-bottom:34px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:38px}
.hero-stats{display:flex;gap:36px;flex-wrap:wrap}
.stat .num{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:2rem;color:var(--teal-deep)}
.stat .lbl{font-size:.85rem;color:var(--ink-soft)}

/* gull flight across the hero */
.sky{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.gull-fly{
  position:absolute;top:12%;left:-140px;width:110px;
  animation:fly 16s linear infinite;
}
@keyframes fly{
  0%{transform:translateX(-140px) translateY(0)}
  25%{transform:translateX(28vw) translateY(-26px)}
  50%{transform:translateX(38vw) translateY(10px)}
  75%{transform:translateX(82vw) translateY(-18px)}
  100%{transform:translateX(110vw) translateY(0)}
}
.wing{transform-origin:center;animation:flap 1s ease-in-out infinite alternate}
@keyframes flap{from{transform:rotate(-8deg)}to{transform:rotate(10deg)}}
.bob{animation:bobf 5s ease-in-out infinite}
@keyframes bobf{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* image placeholder */
.img-slot{
  border:2px dashed var(--teal);border-radius:var(--radius);
  background:var(--bg-soft);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  color:var(--ink-soft);text-align:center;padding:20px;
}
.img-slot .mono{font-size:.78rem;color:var(--teal)}
.hero .img-slot{min-height:380px}
.case-grid .reveal:nth-child(1){transition-delay:0s}
.case-grid .reveal:nth-child(2){transition-delay:.1s}
.case-grid .reveal:nth-child(3){transition-delay:.2s}
.case-grid .reveal:nth-child(4){transition-delay:.3s}
.case-grid .img-slot{transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),opacity .8s var(--ease-out)}
.case-grid .img-slot:hover{transform:translateY(-6px);box-shadow:var(--shadow)}

/* wave divider */
.wave{display:block;width:100%;height:70px;color:var(--bg-soft);margin-top:-1px}
.wave-drift{animation:drift 12s ease-in-out infinite alternate}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-40px)}}

/* ============ TICKER ============ */
.ticker-band{background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;overflow:hidden}
.ticker{display:flex;gap:38px;white-space:nowrap;animation:scrollx 26s linear infinite;width:max-content}
@keyframes scrollx{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker span{font-family:'Spline Sans Mono',monospace;font-size:.85rem;color:var(--ink-soft);display:flex;align-items:center;gap:10px}
.ticker span::before{content:"◆";color:var(--beak);font-size:.6rem}

/* ============ TIER CARDS ============ */
.tiers{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:52px}
@media(max-width:820px){.tiers{grid-template-columns:1fr}}
.tier{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:40px 36px;position:relative;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out),opacity .75s var(--ease-out),border-color .3s ease;
}
.tier:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--teal)}
.tier .badge{
  position:absolute;top:-14px;left:34px;background:var(--beak);color:#22303A;
  font-family:'Spline Sans Mono',monospace;font-size:.72rem;letter-spacing:.1em;
  padding:6px 14px;border-radius:999px;font-weight:600;text-transform:uppercase;
}
.tier h3{font-size:1.5rem;margin:8px 0 6px}
.tier .count{font-family:'Bricolage Grotesque',sans-serif;font-size:3rem;font-weight:800;color:var(--teal-deep)}
.tier ul{list-style:none;margin-top:22px}
.tier li{padding:9px 0;border-bottom:1px dashed var(--line);color:var(--ink-soft);display:flex;gap:10px;font-size:.97rem}
.tier li:last-child{border:none}
.tier li::before{content:"✓";color:var(--teal);font-weight:700}

/* ============ PROCESS ============ */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:52px}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.steps{grid-template-columns:1fr}}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px 26px;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out),opacity .8s var(--ease-out)}
.step:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.steps .step:nth-child(1){transition-delay:0s}
.steps .step:nth-child(2){transition-delay:.08s}
.steps .step:nth-child(3){transition-delay:.16s}
.steps .step:nth-child(4){transition-delay:.24s}
.step .ico{
  width:52px;height:52px;border-radius:14px;background:var(--foam);
  display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:18px;
}
.step h3{font-size:1.12rem;margin-bottom:8px}
.step p{font-size:.93rem;color:var(--ink-soft)}

/* ============ WHY / FOUNDERS ============ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}
@media(max-width:820px){.split{grid-template-columns:1fr}}
.split .img-slot{min-height:340px}
.why-list{list-style:none;margin-top:26px}
.why-list li{display:flex;gap:14px;padding:13px 0;color:var(--ink-soft)}
.why-list li strong{color:var(--ink)}
.why-list .dot{
  flex:none;width:30px;height:30px;border-radius:50%;background:var(--beak-soft);color:var(--beak);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;
}

/* ============ TEAM ============ */
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:52px}
@media(max-width:820px){.team-grid{grid-template-columns:1fr}}
.member{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:28px 28px 34px;text-align:center;
  transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out),border-color .3s ease,opacity .75s var(--ease-out);
}
.member:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--teal)}
.member .member-photo{min-height:250px;margin-bottom:24px;border-radius:16px}
.member h3{font-size:1.4rem;margin-bottom:8px}
.member .role{
  display:block;font-family:'Spline Sans Mono',monospace;font-size:.74rem;
  letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--teal);margin-bottom:16px;
}
.member p{color:var(--ink-soft);font-size:.95rem;text-align:left}
.team-grid .member:nth-child(2){transition-delay:.1s}

/* ============ TESTIMONIALS ============ */
.tst-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:52px}
@media(max-width:900px){.tst-grid{grid-template-columns:1fr}}
.tst{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:32px 30px;position:relative;
  transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out),border-color .3s ease,opacity .8s var(--ease-out);
}
.tst:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--teal)}
.tst .quote-mark{
  font-family:'Bricolage Grotesque',sans-serif;font-size:3.2rem;line-height:1;
  color:var(--beak);height:34px;display:block;margin-bottom:6px;
}
.tst .stars{color:var(--beak);font-size:.95rem;letter-spacing:2px;margin-bottom:14px}
.tst p{color:var(--ink);font-size:.99rem;margin-bottom:22px}
.tst .who{display:flex;align-items:center;gap:14px}
.tst .avatar{
  flex:none;width:46px;height:46px;border-radius:50%;
  background:linear-gradient(135deg,var(--teal),var(--teal-deep));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.05rem;
}
.tst .who .name{font-weight:700;color:var(--ink);font-size:.95rem}
.tst .who .co{color:var(--ink-soft);font-size:.82rem}
.tst-grid .tst:nth-child(2){transition-delay:.1s}
.tst-grid .tst:nth-child(3){transition-delay:.2s}

/* ============ PRICING ============ */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:52px}
@media(max-width:900px){.prices{grid-template-columns:1fr}}
.price{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:38px 32px;text-align:left;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out),opacity .8s var(--ease-out);position:relative;
}
.price:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.price.featured{transform:translateY(-6px)}
.price.featured:hover{transform:translateY(-12px)}
.prices .price:nth-child(1){transition-delay:0s}
.prices .price:nth-child(2){transition-delay:.1s}
.prices .price:nth-child(3){transition-delay:.2s}
.price.featured{border:2px solid var(--teal)}
.price.featured::before{
  content:"MOST POPULAR";position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--teal);color:#fff;font-family:'Spline Sans Mono',monospace;
  font-size:.68rem;letter-spacing:.12em;padding:5px 14px;border-radius:999px;
}
.price h3{font-size:1.2rem;margin-bottom:6px}
.price .amt{font-family:'Bricolage Grotesque',sans-serif;font-size:2.5rem;font-weight:800;color:var(--teal-deep)}
.price .amt small{font-size:1rem;color:var(--ink-soft);font-weight:400}
.price ul{list-style:none;margin:22px 0 28px}
.price li{padding:8px 0;color:var(--ink-soft);font-size:.94rem;display:flex;gap:10px}
.price li::before{content:"✓";color:var(--teal);font-weight:700}

/* ============ FAQ ============ */
.faq-item{border:1px solid var(--line);border-radius:16px;background:var(--card);margin-bottom:14px;overflow:hidden}
.faq-q{
  width:100%;text-align:left;background:none;border:none;cursor:pointer;
  padding:22px 26px;font-family:'Instrument Sans',sans-serif;font-weight:600;font-size:1.02rem;color:var(--ink);
  display:flex;justify-content:space-between;align-items:center;gap:16px;
}
.faq-q .chev{transition:transform .3s;color:var(--teal);flex:none}
.faq-item.open .chev{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease;color:var(--ink-soft);font-size:.96rem}
.faq-a p{padding:0 26px 22px}

/* ============ CTA ============ */
.cta-block{
  background:linear-gradient(135deg,var(--teal-deep),var(--teal));
  border-radius:28px;padding:70px 38px;text-align:center;color:#fff;position:relative;overflow:hidden;
}
[data-theme="dark"] .cta-block{background:linear-gradient(135deg,#0F5B68,#177E8F)}
.cta-block h2{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;margin-bottom:14px}
.cta-block p{opacity:.9;max-width:520px;margin:0 auto 32px}
.cta-gull{position:absolute;right:6%;top:14%;width:80px;opacity:.5}

/* ============ FOOTER ============ */
footer{border-top:1px solid var(--line);padding:52px 0 36px;background:var(--bg-soft)}
.foot-grid{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:36px}
.foot-grid a{display:block;color:var(--ink-soft);text-decoration:none;font-size:.93rem;padding:4px 0}
.foot-grid a:hover{color:var(--teal)}
.foot-grid h4{font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px;font-family:'Spline Sans Mono',monospace;color:var(--ink)}
.foot-logo-slot{
  display:inline-flex;align-items:center;justify-content:center;
  height:38px;min-width:150px;padding:0 14px;margin-bottom:12px;
  border:2px dashed var(--teal);border-radius:12px;background:var(--card);
  font-family:'Spline Sans Mono',monospace;font-size:.6rem;letter-spacing:.08em;
  color:var(--teal);text-align:center;text-transform:uppercase;
}
.copy{font-size:.85rem;color:var(--ink-soft);text-align:center;border-top:1px solid var(--line);padding-top:26px}

/* ============ MODAL ============ */
.modal-overlay{
  position:fixed;inset:0;background:rgba(8,28,36,.55);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;z-index:100;
  opacity:0;pointer-events:none;transition:opacity .25s ease;padding:20px;
}
.modal-overlay.show{opacity:1;pointer-events:auto}
.modal-box{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:36px 32px;max-width:420px;width:100%;box-shadow:var(--shadow);
  transform:translateY(18px) scale(.97);transition:transform .3s cubic-bezier(.34,1.38,.64,1);
}
.modal-overlay.show .modal-box{transform:translateY(0) scale(1)}
.modal-box h3{font-size:1.25rem;margin-bottom:12px}
.modal-box p{color:var(--ink-soft);font-size:.95rem;margin-bottom:18px}
.modal-box .mono-line{
  background:var(--bg-soft);border:1px dashed var(--teal);border-radius:12px;
  padding:14px 16px;font-family:'Spline Sans Mono',monospace;font-size:.85rem;color:var(--ink);
  margin-bottom:22px;word-break:break-word;
}
.modal-close{width:100%;text-align:center}
/* ============ BLOG ============ */

.blog-hero {
    padding: 90px 0 55px;
    text-align: center;
}

.blog-hero h1 {
    max-width: 780px;
    margin: 0 auto 18px;
    font-size: clamp(2.5rem, 6vw, 4rem);
    font-weight: 800;
}

.blog-hero p {
    max-width: 640px;
    margin: 0 auto;
    color: var(--ink-soft);
    font-size: 1.08rem;
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    padding-bottom: 100px;
}

.blog-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: transform .3s ease, box-shadow .3s ease;
}

.blog-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow);
}

.blog-card-image {
    min-height: 210px;
    background: var(--bg-soft);
}

.blog-card-body {
    padding: 26px;
}

.blog-card-meta {
    margin-bottom: 10px;
    color: var(--teal);
    font-family: 'Spline Sans Mono', monospace;
    font-size: .72rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.blog-card h2 {
    margin-bottom: 12px;
    font-size: 1.35rem;
}

.blog-card p {
    color: var(--ink-soft);
    font-size: .95rem;
}

.blog-card-link {
    display: inline-block;
    margin-top: 20px;
    color: var(--teal);
    font-weight: 700;
}

.article-header {
    padding: 95px 0 45px;
    text-align: center;
}

.article-header h1 {
    max-width: 900px;
    margin: 0 auto 20px;
    font-size: clamp(2.5rem, 6vw, 4.4rem);
    font-weight: 800;
    letter-spacing: -.025em;
}

.article-meta {
    color: var(--ink-soft);
    font-family: 'Spline Sans Mono', monospace;
    font-size: .78rem;
}

.article-cover {
    max-width: 1000px;
    min-height: 380px;
    margin: 35px auto 60px;
    background: var(--bg-soft);
    border: 1px dashed var(--teal);
    border-radius: var(--radius);
}

.article-content {
    max-width: 760px;
    margin: 0 auto;
    padding-bottom: 110px;
}

.article-content p {
    margin-bottom: 22px;
    color: var(--ink-soft);
    font-size: 1.08rem;
    line-height: 1.8;
}

.article-content h2 {
    margin: 54px 0 20px;
    font-size: clamp(1.8rem, 4vw, 2.5rem);
}

.article-content h3 {
    margin: 38px 0 16px;
    font-size: 1.5rem;
}

.article-content ul,
.article-content ol {
    margin: 0 0 26px 24px;
    color: var(--ink-soft);
}

.article-content li {
    margin-bottom: 10px;
}

.article-content a {
    color: var(--teal);
    text-decoration: underline;
}

.article-content blockquote {
    margin: 36px 0;
    padding: 24px 28px;
    background: var(--bg-soft);
    border-left: 4px solid var(--beak);
    border-radius: 0 14px 14px 0;
}

@media (max-width: 900px) {
    .blog-grid {
        grid-template-columns: 1fr;
    }

    .article-cover {
        min-height: 280px;
    }
}

/* ============ LARGER HOW IT WORKS IMAGES ============ */
/* Higher specificity ensures this overrides the 52px homepage rule. */
html body #process .steps .step .ico.process-image-slot{
  width:82px !important;
  height:82px !important;
  min-width:82px !important;
  min-height:82px !important;
  flex:0 0 82px !important;
  padding:0 !important;
  margin:0 auto 22px !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:14px;
  background:transparent !important;
  box-shadow:none !important;
}

html body #process .steps .step .ico.process-image-slot img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  object-position:center !important;
}

@media(max-width:600px){
  html body #process .steps .step .ico.process-image-slot{
    width:72px !important;
    height:72px !important;
    min-width:72px !important;
    min-height:72px !important;
    flex-basis:72px !important;
  }
}

/* ============ FASTER HOW IT WORKS REVEAL ============ */
/* Removes the long stagger and reveals all five cards and images quickly. */
html body #process .steps .step.reveal{
  transition:
    opacity .32s var(--ease-out),
    transform .32s var(--ease-out),
    box-shadow .25s ease !important;
  transition-delay:0s !important;
}

html body #process .steps .step:nth-child(1),
html body #process .steps .step:nth-child(2),
html body #process .steps .step:nth-child(3),
html body #process .steps .step:nth-child(4),
html body #process .steps .step:nth-child(5){
  transition-delay:0s !important;
}

html body #process .process-image-slot img{
  opacity:1 !important;
  transition:none !important;
}

/* ============ NEAR-INSTANT HOW IT WORKS REVEAL ============ */
html body #process .steps .step.reveal{
  transition:
    opacity .14s linear,
    transform .14s linear,
    box-shadow .2s ease !important;
  transition-delay:0s !important;
}

html body #process .steps .step.reveal:not(.in){
  transform:translateY(10px) !important;
}

html body #process .steps .step.reveal.in{
  transform:translateY(0) !important;
}

/* Footer brand alignment: match header logo size and wordmark */
footer .logo.logo-with-image{
  display:inline-flex!important;
  align-items:center!important;
  gap:2px;
  font-size:1.35rem;
  line-height:1;
  padding:0!important;
}
footer .logo.logo-with-image .logo-image-slot{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  flex:0 0 38px!important;
}
footer .logo.logo-with-image .logo-wordmark{
  font-size:inherit;
  line-height:1;
  transform:translateY(2px);
}
@media(max-width:900px){
  footer .logo.logo-with-image{
    font-size:1rem;
  }
  footer .logo.logo-with-image .logo-image-slot{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    flex:0 0 38px!important;
  }
}
@media(max-width:420px){
  footer .logo.logo-with-image{
    font-size:.92rem;
  }
}



/* Generic dropdown support */
.tools-dropdown{position:relative;display:flex;align-items:center}.tools-dropdown-trigger{display:inline-flex!important;align-items:center;gap:6px}.tools-dropdown-arrow{display:inline-block;line-height:1;transition:transform .22s ease}.tools-dropdown-menu{position:absolute;top:calc(100% + 12px);right:0;z-index:1000;min-width:220px;padding:10px;border:1px solid rgba(8,126,164,.18);border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 18px 42px rgba(12,42,51,.14);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);transition:opacity .2s ease,visibility .2s ease,transform .24s ease}.tools-dropdown-menu a{display:block;padding:12px 13px;border-radius:12px;color:var(--ink)!important;text-decoration:none!important;font-weight:600}.tools-dropdown-menu a:hover,.tools-dropdown-menu a:focus-visible{background:rgba(8,126,164,.08);color:var(--teal)!important}.tools-dropdown:hover .tools-dropdown-menu,.tools-dropdown:focus-within .tools-dropdown-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}.tools-dropdown:hover .tools-dropdown-arrow,.tools-dropdown:focus-within .tools-dropdown-arrow{transform:rotate(180deg)}.tools-dropdown::after{content:"";position:absolute;top:100%;right:0;width:100%;height:16px}@media(max-width:900px){.tools-dropdown{display:block;width:100%}.tools-dropdown-trigger{justify-content:space-between;width:100%}.tools-dropdown-menu{position:static;min-width:0;max-height:0;overflow:hidden;padding:0 0 0 10px;border:0;border-radius:0;box-shadow:none;opacity:1;visibility:visible;pointer-events:none;transform:none;transition:max-height .28s ease,padding .28s ease}.tools-dropdown.is-mobile-open .tools-dropdown-menu{max-height:260px;padding-top:6px;padding-bottom:6px;pointer-events:auto}.tools-dropdown::after{display:none}}
/* ================= STANDARD IMAGE SLOTS =================
   Change only the src path inside each <img> tag.
   The surrounding slot keeps the displayed size fixed. */
.img-slot{
  position:relative;
  width:100%;
  overflow:hidden;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:var(--bg-soft, #eaf2f0);
}
.img-slot > img{
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:cover;
}

/* Header and footer logos */
.logo-image-slot{
  width:38px !important;
  height:38px !important;
  flex:0 0 38px;
  border-radius:0 !important;
  background:transparent !important;
}
.logo-image-slot > img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
footer .logo-image-slot{
  width:38px !important;
  height:38px !important;
  flex-basis:52px;
}

/* Hero flowchart: no box, no border, no background */
.hero-parallax,
.hero-parallax .bob,
.hero-flowchart-slot{
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}
.hero-flowchart-slot{
  height:430px;
  padding:0 !important;
  border-radius:0 !important;
}
.hero-flowchart-slot::before,
.hero-flowchart-slot::after{
  content:none !important;
  display:none !important;
}
.hero-flowchart-slot > img{
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Fixed image heights for the other homepage sections */
.why-image-slot{
  width:min(100%, 420px);
  height:auto !important;
  aspect-ratio:2 / 3;
  margin:0 auto;
  padding:0 !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  overflow:visible !important;
  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.why-image-slot > img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.member-photo-slot{
  height:380px;
  padding:0 !important;
  display:block !important;
  overflow:hidden;
  border-radius:20px;
  background:transparent !important;
}
.member-photo-slot > img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:cover !important;
  object-position:center 22% !important;
  border-radius:inherit;
}
.case-study-slot{
  display:block;
  height:220px;
  border-radius:20px;
  text-decoration:none;
}
.blog-thumb-slot{height:210px;border-radius:0;}
.blog-thumb-slot .blog-thumb,
.blog-thumb-slot .blog-thumb-placeholder{
  width:100%;
  height:100%;
}

@media (max-width:900px){
  .hero-flowchart-slot{height:390px;}
}
@media (max-width:600px){
  .hero-flowchart-slot{height:320px;}
  .why-image-slot{
    width:min(100%, 360px);
  }
  .member-photo-slot{height:340px;}
  .blog-thumb-slot{height:190px;}
}

/* Header and footer logo image space */
nav .logo.logo-with-image,
footer .logo.logo-with-image{
  display:inline-flex !important;
  align-items:center;
  gap:2px;
  text-decoration:none;
}
.logo-image-wrap{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
}
footer .logo-image-wrap{
  width:52px;
  height:52px;
  flex-basis:52px;
}
.site-logo{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}
.logo-image-placeholder{
  width:100%;
  height:100%;
  display:none;
  place-items:center;
  border:1.5px dashed currentColor;
  border-radius:12px;
  font-family:"Spline Sans Mono", monospace;
  font-size:.58rem;
  letter-spacing:.08em;
  opacity:.65;
}
.logo-wordmark{line-height:1}

/* Three inventory cards */
.tiers{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:24px;
}

/* Centre all process-card content */
.steps .step{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
}
.steps .step .ico{
  margin-left:auto;
  margin-right:auto;
}
.steps .step p{
  margin-left:auto;
  margin-right:auto;
}



/* Three-line hero introduction */
.hero-lede-lines span{
  display:block;
}
.hero-lede-lines span + span{
  margin-top:15px;
}

/* Five-step workflow */
#process .steps{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:20px;
}

/* Team profile buttons */
.profile-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:20px;
}
.profile-actions .btn{
  padding:10px 15px;
  font-size:.82rem;
}

/* Team social/contact icon buttons */
.profile-actions .profile-icon-btn{
  width:38px;
  height:38px;
  flex:0 0 38px;
  padding:0 !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--teal);
  background:rgba(255,255,255,.38);
  border:1px solid color-mix(in srgb, var(--teal) 28%, var(--line));
  box-shadow:0 8px 20px rgba(12,42,51,.08);
}
.profile-actions .profile-icon-btn svg{
  width:20px;
  height:20px;
  display:block;
  fill:currentColor;
}
.profile-actions .profile-icon-btn:hover{
  color:#fff;
  background:var(--teal);
  border-color:var(--teal);
  transform:translateY(-3px) scale(1.06);
  box-shadow:0 12px 26px rgba(23,126,143,.24);
}
[data-theme="dark"] .profile-actions .profile-icon-btn{
  background:rgba(255,255,255,.06);
}

/* Latest blog posts */
.blog-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:42px;
}
.blog-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
}
.blog-card{
  min-width:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  color:inherit;
  text-decoration:none;
  background:var(--card, var(--bg, #fff));
  border:1px solid var(--line, rgba(0,0,0,.1));
  border-radius:22px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.blog-card:hover{
  transform:translateY(-5px);
  border-color:var(--teal);
  box-shadow:0 18px 42px rgba(0,0,0,.09);
}
.blog-thumb,
.blog-thumb-placeholder{
  width:100%;
  aspect-ratio:16/10;
  display:block;
  object-fit:cover;
}
.blog-thumb-placeholder{
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(26,166,161,.16), rgba(255,174,66,.18));
  font-family:"Spline Sans Mono", monospace;
  font-size:.7rem;
  letter-spacing:.08em;
  color:var(--ink-soft);
}
.blog-card-body{
  display:flex;
  flex:1;
  flex-direction:column;
  padding:22px;
}
.blog-date{
  margin-bottom:11px;
  color:var(--ink-soft);
  font-family:"Spline Sans Mono", monospace;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.blog-card h3{
  margin:0 0 12px;
  font-size:1.2rem;
  line-height:1.25;
}
.blog-card p{
  margin:0 0 20px;
  color:var(--ink-soft);
  font-size:.92rem;
  line-height:1.65;
}
.blog-read{
  margin-top:auto;
  color:var(--teal);
  font-weight:700;
}
.blog-empty{
  grid-column:1/-1;
  padding:34px;
  text-align:center;
  border:1px dashed var(--line, rgba(0,0,0,.15));
  border-radius:20px;
  color:var(--ink-soft);
}


/* SEO + AEO scroll flow */
#search-visibility{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 18%, rgba(23,126,143,.10), transparent 30%),
    radial-gradient(circle at 88% 78%, rgba(238,155,51,.11), transparent 28%),
    var(--bg, #fff);
}
#search-visibility::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(circle, rgba(23,126,143,.16) 1px, transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(to bottom, transparent, #000 16%, #000 84%, transparent);
  opacity:.38;
}
#search-visibility .wrap{
  position:relative;
  z-index:1;
}
.aeo-flow-head{
  max-width:850px;
  margin:0 auto;
  text-align:center;
}
.aeo-flow{
  max-width:1120px;
  margin:58px auto 0;
}
.aeo-columns{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  align-items:stretch;
}
.aeo-branch{
  min-width:0;
  display:flex;
}
.aeo-card{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:32px 20px 28px;
  border:0;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(23,126,143,.14), rgba(203,231,227,.30), rgba(238,155,51,.13));
  box-shadow:0 18px 38px rgba(12,42,51,.10);
}
.aeo-action-card{
  min-height:245px;
  border:0;
  isolation:isolate;
}
/* One-time moving gradient perimeter for the three SEO + AEO cards */
.aeo-action-card > h3,
.aeo-action-card > p{
  position:relative;
  z-index:1;
}
.aeo-perimeter-trace{
  position:absolute;
  inset:0;
  z-index:3;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  opacity:0;
}
.aeo-perimeter-path{
  fill:none;
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:18 82;
  stroke-dashoffset:0;
  opacity:0;
}
.aeo-action-card.aeo-trace-active .aeo-perimeter-trace{
  opacity:1;
}
.aeo-action-card.aeo-trace-active .aeo-perimeter-path{
  animation:aeoPerimeterTravel 2.55s cubic-bezier(.42,0,.2,1) var(--aeo-trace-delay, 0ms) 1 forwards;
}
@keyframes aeoPerimeterTravel{
  0%{
    stroke-dashoffset:0;
    opacity:1;
  }
  92%{
    stroke-dashoffset:-96;
    opacity:1;
  }
  100%{
    stroke-dashoffset:-100;
    opacity:0;
  }
}
.aeo-action-card h3{
  margin:0 0 20px;
  text-align:center;
  font-size:1.35rem;
  line-height:1.15;
  letter-spacing:-.015em;
  white-space:nowrap;
}
.aeo-card p{
  margin:0;
  color:var(--ink-soft);
  font-size:.94rem;
  line-height:1.72;
}
.aeo-card p strong{
  color:var(--ink);
  font-weight:700;
}
.aeo-branch:nth-child(1){--aeo-accent:#087EA4}
.aeo-branch:nth-child(2){--aeo-accent:#6C63B7}
.aeo-branch:nth-child(3){--aeo-accent:#E28A28}
.aeo-converge{
  width:100%;
  height:205px;
  display:block;
  margin:10px 0 0;
  overflow:visible;
}
.aeo-converge path{
  fill:none;
  stroke:var(--teal);
  stroke-width:4;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:900;
  stroke-dashoffset:900;
  transition:stroke-dashoffset 1.05s cubic-bezier(.22,.75,.2,1);
}
.aeo-converge path:nth-of-type(2){stroke:#6C63B7}
.aeo-converge path:nth-of-type(3){stroke:#E28A28}
.aeo-converge .aeo-merge-line{
  stroke:var(--teal-deep, var(--teal));
  transition-duration:.72s;
  transition-delay:1.35s;
}
.aeo-converge circle{
  fill:var(--card, #fff);
  stroke:var(--teal-deep, var(--teal));
  stroke-width:5;
  opacity:0;
  transform:scale(.25);
  transform-origin:center;
  transition:opacity .25s ease 1.05s, transform .42s cubic-bezier(.2,.9,.2,1.3) 1.05s;
}
.aeo-converge polygon{
  fill:var(--teal-deep, var(--teal));
  opacity:0;
  transform:translateY(-8px);
  transition:opacity .25s ease 1.95s, transform .35s ease 1.95s;
}
.aeo-converge.is-visible path{
  stroke-dashoffset:0;
}
.aeo-converge.is-visible circle,
.aeo-converge.is-visible polygon{
  opacity:1;
  transform:scale(1) translateY(0);
}
.aeo-outcomes{
  max-width:780px;
  margin:0 auto;
  text-align:center;
}
.aeo-result-card{
  position:relative;
  overflow:hidden;
  padding:33px 34px;
  border:1px solid rgba(23,126,143,.25);
  border-radius:24px;
  background:linear-gradient(135deg, rgba(23,126,143,.14), rgba(203,231,227,.30), rgba(238,155,51,.13));
  box-shadow:0 18px 38px rgba(12,42,51,.10);
}
.aeo-result-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg, transparent 15%, rgba(255,255,255,.38) 38%, transparent 72%);
  transform:translateX(-130%);
}
.aeo-result-card.is-visible::before{
  animation:aeoShine 1.1s ease .3s both;
}
.aeo-result-card h3{
  position:relative;
  z-index:1;
  margin:0;
  font-size:clamp(1.45rem, 3vw, 2.35rem);
  line-height:1.16;
}
.aeo-reveal{
  opacity:0;
  transform:translateY(30px) scale(.98);
  transition:opacity .68s ease, transform .72s cubic-bezier(.2,.8,.2,1);
  transition-delay:var(--aeo-delay, 0ms);
}
.aeo-reveal.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}
@keyframes aeoShine{
  to{transform:translateX(130%)}
}
@media (max-width:900px){
  .aeo-columns{
    grid-template-columns:1fr;
    gap:24px;
    max-width:650px;
    margin:0 auto;
  }
  .aeo-action-card{
    min-height:0;
  }
  .aeo-action-card h3{
    white-space:normal;
  }
  .aeo-converge{
    height:155px;
    margin-top:4px;
  }
  .aeo-converge path:nth-of-type(1),
  .aeo-converge path:nth-of-type(3){display:none}
}
@media (max-width:600px){
  .aeo-flow{margin-top:38px}
  .aeo-card{padding:27px 21px 25px}
  .aeo-result-card{padding:25px 21px}
  .aeo-converge{height:125px}
}
@media (prefers-reduced-motion:reduce){
  .aeo-reveal{
    opacity:1;
    transform:none;
    transition:none;
  }
  .aeo-converge path{stroke-dashoffset:0;transition:none}
  .aeo-converge circle,
  .aeo-converge polygon{opacity:1;transform:none;transition:none}
  .aeo-result-card.is-visible::before{animation:none}
  .aeo-perimeter-trace{display:none}
}

@media (max-width:1100px){
  .tiers{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  #process .steps{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
  .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .tiers{grid-template-columns:1fr !important}
  #process .steps{grid-template-columns:1fr !important}
  .blog-head{display:block}
  .blog-head .btn{margin-top:22px}
  .blog-grid{grid-template-columns:1fr}
  .logo-image-wrap{
    width:38px;
    height:38px;
    flex-basis:38px;
  }
}

/* Full-width underline for all section eyebrow labels */
.eyebrow{
  display:inline-block !important;
  position:relative;
  width:max-content;
  max-width:100%;
}
.eyebrow::after{
  left:0 !important;
  right:0 !important;
  width:100% !important;
  max-width:none !important;
}


/* Remove the pale horizontal shade behind the Hero text.
   The 3D floor grid remains visible through .grid-flow .plane. */
.hero{
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
}

/* Remove Hero overlay layers and pseudo-elements that create the tinted band. */
.hero::before,
.hero::after,
.hero .wave-bg,
.hero .wave-bg::before,
.hero .wave-bg::after{
  content:none !important;
  display:none !important;
  background:none !important;
  background-image:none !important;
  opacity:0 !important;
  box-shadow:none !important;
  filter:none !important;
}

/* Keep the floor-grid container, but remove any colour wash attached to it. */
.hero .grid-flow{
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
}
.hero .grid-flow::before,
.hero .grid-flow::after{
  content:none !important;
  display:none !important;
  background:none !important;
  opacity:0 !important;
}

.hero .wrap,
.hero-grid,
.hero .reveal,
.hero-lede-lines,
.hero-lede-lines span{
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
}


/* ================= ALTERNATING CARD GRADIENTS AND SHADOWS ================= */
/* Gradient A matches the SEO + AEO cards. */
#process .step,
#pricing .price{
  background:linear-gradient(
    135deg,
    rgba(23,126,143,.14) 0%,
    rgba(203,231,227,.30) 52%,
    rgba(238,155,51,.13) 100%
  );
  box-shadow:0 18px 38px rgba(12,42,51,.10);
}

/* Gradient B uses a darker teal-violet variation instead of repeating gold. */
#inventory .tier,
#team .member,
#faq .faq-item{
  background:linear-gradient(
    145deg,
    rgba(108,99,183,.15) 0%,
    rgba(203,231,227,.24) 50%,
    rgba(15,91,104,.16) 100%
  );
  box-shadow:0 18px 38px rgba(12,42,51,.10);
}

/* Balanced versions for dark mode. */
[data-theme="dark"] #process .step,
[data-theme="dark"] #pricing .price{
  background:linear-gradient(
    135deg,
    rgba(63,182,201,.14) 0%,
    rgba(18,64,78,.42) 52%,
    rgba(245,169,75,.13) 100%
  );
}

[data-theme="dark"] #inventory .tier,
[data-theme="dark"] #team .member,
[data-theme="dark"] #faq .faq-item{
  background:linear-gradient(
    145deg,
    rgba(108,99,183,.20) 0%,
    rgba(18,64,78,.40) 50%,
    rgba(15,91,104,.28) 100%
  );
}

/* Preserve a slightly stronger lift while hovering over interactive cards. */
#process .step:hover,
#team .member:hover,
#inventory .tier:hover,
#pricing .price:hover{
  box-shadow:0 24px 58px rgba(12,42,51,.15);
}

/* Keep the FAQ underline directly centred beneath the label.
   This cancels the translateX rule inherited from the external stylesheet. */
#faq .eyebrow::after{
  left:0 !important;
  right:0 !important;
  width:100% !important;
  transform:none !important;
}

/* Empty transparent image spaces for the five How It Works cards. */
#process .step .process-image-slot{
  width:52px;
  height:52px;
  flex:0 0 52px;
  padding:0 !important;
  margin-bottom:18px;
  background:transparent !important;
  border:0 !important;
  border-radius:14px;
  box-shadow:none !important;
  overflow:hidden;
}
#process .step .process-image-slot img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

/* Case-study cards and blog cards receive shadow only. */
#results .case-study-slot{
  box-shadow:0 18px 38px rgba(12,42,51,.10) !important;
}
#results .case-study-slot:hover{
  box-shadow:0 24px 58px rgba(12,42,51,.15) !important;
}
#blog .blog-card{
  box-shadow:0 18px 38px rgba(12,42,51,.10);
}
#blog .blog-card:hover{
  box-shadow:0 24px 58px rgba(12,42,51,.15);
}

/* Show each blog image completely inside its fixed image area without cropping. */
.blog-thumb-slot{
  padding:0 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--card, #fff) !important;
}
.blog-thumb-slot > img.blog-thumb{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:100%;
  max-height:100%;
  object-fit:contain !important;
  object-position:center center !important;
  aspect-ratio:auto !important;
  background:var(--card, #fff);
}

[data-theme="dark"] #process .step,
[data-theme="dark"] #team .member,
[data-theme="dark"] #inventory .tier,
[data-theme="dark"] #pricing .price,
[data-theme="dark"] #faq .faq-item{
  box-shadow:0 18px 38px rgba(0,0,0,.28);
}
[data-theme="dark"] #results .case-study-slot,
[data-theme="dark"] #blog .blog-card{
  box-shadow:0 18px 38px rgba(0,0,0,.28) !important;
}



/* ================= WHY LINKULL IMAGE MOTION ================= */
.why-image-slot{
  animation:whyImageBreathe 5.2s ease-in-out infinite;
  will-change:transform;
}
@keyframes whyImageBreathe{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-10px,0)}
}

/* ================= MORE FREQUENT BACKGROUND LINKS ================= */
.chain-drift{
  animation-duration:38s !important;
}
.chain-drift.d2{
  animation-duration:38s !important;
  animation-delay:-12s !important;
}
.chain-drift.d3{
  animation-duration:40s !important;
  animation-delay:-25s !important;
}
.chain-drift.d4{
  animation-duration:46s !important;
  animation-delay:-8s !important;
}
.chain-drift.d5{
  animation-duration:36s !important;
  animation-delay:-20s !important;
}
.chain-drift.d6{
  animation-duration:42s !important;
  animation-delay:-31s !important;
}

/* Additional subtle seagulls moving across the fixed background. */
.bg-gull{
  fill:none;
  stroke:var(--teal);
  stroke-width:3;
  stroke-linecap:round;
  opacity:.30;
  animation:bgGullDrift 34s linear infinite;
  will-change:transform;
}
.bg-gull.g2{
  stroke:var(--beak);
  opacity:.24;
  animation-duration:41s;
  animation-delay:-14s;
}
.bg-gull.g3{
  opacity:.25;
  animation-duration:37s;
  animation-delay:-27s;
}
@keyframes bgGullDrift{
  from{transform:translateX(-160px)}
  to{transform:translateX(1220px)}
}

@media(prefers-reduced-motion:reduce){
  .why-image-slot,
  .bg-gull{
    animation:none !important;
    transform:none !important;
  }
}



/* ================= JOIN OUR COMMUNITY ================= */
.community-invite{
  padding:72px 0 38px;
  text-align:center;
  background:transparent;
}
.community-invite-inner{
  max-width:760px;
  margin:0 auto;
  padding:0 22px;
}
.community-invite h2{
  margin:0;
  color:var(--ink);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:clamp(2rem, 4vw, 3.35rem);
  line-height:1.08;
  letter-spacing:-.035em;
}
.community-invite p{
  margin:13px 0 26px;
  color:var(--ink-soft);
  font-family:"Instrument Sans", sans-serif;
  font-size:clamp(1rem, 2vw, 1.14rem);
  line-height:1.65;
}
.community-join-btn{
  position:relative;
  isolation:isolate;
  min-width:230px;
  padding:15px 28px;
  border:0;
  border-radius:999px;
  overflow:hidden;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(110deg, #087EA4 0%, #2EA8D0 42%, #6C63B7 72%, #F49B33 100%);
  background-size:180% 180%;
  box-shadow:0 14px 34px rgba(23,126,143,.24);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:1rem;
  font-weight:700;
  letter-spacing:.01em;
  animation:
    communityButtonBreathe 4s ease-in-out infinite,
    communityGradientMove 7s ease-in-out infinite;
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.community-join-btn::before{
  content:"";
  position:absolute;
  inset:1px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(135deg, rgba(255,255,255,.11), rgba(255,255,255,0));
}
.community-join-btn:hover{
  transform:translateY(-4px) scale(1.025);
  box-shadow:0 20px 42px rgba(23,126,143,.32);
  filter:saturate(1.08);
}
.community-join-btn:focus-visible{
  outline:3px solid color-mix(in srgb, var(--teal) 32%, #fff);
  outline-offset:4px;
}
@keyframes communityButtonBreathe{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-8px,0)}
}
@keyframes communityGradientMove{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* Community modal */
.community-modal-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(7,25,31,.62);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease, visibility .25s ease;
}
.community-modal-overlay.is-open{
  opacity:1;
  visibility:visible;
}
.community-modal{
  position:relative;
  width:min(100%, 380px);
  max-height:min(90vh, 760px);
  overflow:auto;
  padding:34px;
  border:1px solid rgba(23,126,143,.19);
  border-radius:26px;
  background:
    radial-gradient(circle at 100% 0%, rgba(238,155,51,.11), transparent 30%),
    radial-gradient(circle at 0% 100%, rgba(23,126,143,.13), transparent 34%),
    var(--card, #fff);
  box-shadow:0 30px 85px rgba(3,20,25,.32);
  transform:translateY(18px) scale(.97);
  transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.community-modal-overlay.is-open .community-modal{
  transform:translateY(0) scale(1);
}
.community-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--line, rgba(0,0,0,.10));
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:rgba(255,255,255,.62);
  font-size:1.35rem;
  line-height:1;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.community-modal-close:hover{
  color:#fff;
  background:var(--teal);
  transform:rotate(5deg);
}
.community-modal h3{
  margin:0 38px 11px 0;
  color:var(--ink);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:clamp(1.55rem, 4vw, 2.2rem);
  line-height:1.15;
}
.community-modal-copy{
  margin:0 0 26px;
  color:var(--ink-soft);
  font-family:"Instrument Sans", sans-serif;
  font-size:.96rem;
  line-height:1.68;
}
.community-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:17px;
}
.community-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.community-field.full{
  grid-column:1 / -1;
}
.community-field label{
  color:var(--ink);
  font-family:"Instrument Sans", sans-serif;
  font-size:.86rem;
  font-weight:600;
}
.community-field input{
  width:100%;
  min-height:50px;
  padding:12px 14px;
  border:1px solid var(--line, rgba(0,0,0,.13));
  border-radius:14px;
  color:var(--ink);
  background:color-mix(in srgb, var(--card, #fff) 90%, var(--teal) 10%);
  font-family:"Instrument Sans", sans-serif;
  font-size:.95rem;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.community-field input:focus{
  border-color:var(--teal);
  background:var(--card, #fff);
  box-shadow:0 0 0 4px rgba(23,126,143,.12);
}
.community-submit{
  grid-column:1 / -1;
  width:100%;
  margin-top:5px;
  padding:14px 20px;
  border:0;
  border-radius:14px;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(110deg, #087EA4, #2EA8D0 38%, #6C63B7 100%);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:1rem;
  font-weight:700;
  box-shadow:0 12px 28px rgba(23,126,143,.22);
  transition:transform .2s ease, box-shadow .2s ease;
}
.community-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(23,126,143,.29);
}
.community-form-note{
  grid-column:1 / -1;
  margin:0;
  color:var(--ink-soft);
  font-size:.78rem;
  line-height:1.55;
  text-align:center;
}
body.community-modal-open{
  overflow:hidden;
}
[data-theme="dark"] .community-modal-close{
  background:rgba(255,255,255,.07);
}
@media(max-width:600px){
  .community-invite{
    padding:58px 0 38px;
  }
  .community-modal{
    padding:28px 20px 22px;
    border-radius:22px;
  }
  .community-form{
    grid-template-columns:1fr;
  }
  .community-field.full,
  .community-submit,
  .community-form-note{
    grid-column:1;
  }
}
@media(prefers-reduced-motion:reduce){
  .community-join-btn{
    animation:none !important;
  }
}



/* Community form submission states */
.community-honeypot{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.community-form-status{
  grid-column:1 / -1;
  min-height:0;
  margin:0;
  padding:0;
  border-radius:13px;
  font-family:"Instrument Sans", sans-serif;
  font-size:.88rem;
  line-height:1.55;
  text-align:center;
}
.community-form-status.is-visible{
  min-height:auto;
  padding:11px 13px;
}
.community-form-status.is-success{
  color:#0f5b68;
  background:rgba(23,126,143,.12);
  border:1px solid rgba(23,126,143,.22);
}
.community-form-status.is-error{
  color:#8b3c1d;
  background:rgba(238,155,51,.13);
  border:1px solid rgba(226,138,40,.26);
}
.community-submit[disabled]{
  cursor:wait;
  opacity:.72;
  transform:none !important;
}
.community-submit .community-submit-spinner{
  display:inline-block;
  width:15px;
  height:15px;
  margin-right:8px;
  vertical-align:-2px;
  border:2px solid rgba(255,255,255,.38);
  border-top-color:#fff;
  border-radius:50%;
  animation:communitySubmitSpin .75s linear infinite;
}
@keyframes communitySubmitSpin{
  to{transform:rotate(360deg)}
}
@media(max-width:600px){
  .community-form-status{
    grid-column:1;
  }
}



/* ================= EXIT-INTENT BACKLINK-GAP POPUP ================= */
.gap-exit-overlay{
  position:fixed;
  inset:0;
  z-index:10020;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(7,25,31,.64);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  transition:opacity .24s ease, visibility .24s ease;
}
.gap-exit-overlay.is-open{
  opacity:1;
  visibility:visible;
}
.gap-exit-modal{
  position:relative;
  width:min(100%, 380px);
  max-height:90vh;
  overflow:auto;
  padding:36px;
  border:1px solid rgba(23,126,143,.20);
  border-radius:26px;
  background:
    radial-gradient(circle at 100% 0%, rgba(238,155,51,.12), transparent 32%),
    radial-gradient(circle at 0% 100%, rgba(23,126,143,.14), transparent 36%),
    var(--card, #fff);
  box-shadow:0 30px 90px rgba(3,20,25,.34);
  transform:translateY(18px) scale(.97);
  transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.gap-exit-overlay.is-open .gap-exit-modal{
  transform:translateY(0) scale(1);
}
.gap-exit-close{
  position:absolute;
  top:16px;
  right:16px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--line, rgba(0,0,0,.1));
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:rgba(255,255,255,.65);
  font-size:1.35rem;
  line-height:1;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.gap-exit-close:hover{
  color:#fff;
  background:var(--teal);
  transform:rotate(5deg);
}
.gap-exit-kicker{
  display:inline-block;
  margin:0 0 13px;
  color:var(--teal);
  font-family:"Spline Sans Mono", monospace;
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.gap-exit-modal h3{
  max-width:460px;
  margin:0 38px 13px 0;
  color:var(--ink);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:clamp(1.65rem, 4vw, 2.45rem);
  line-height:1.1;
  letter-spacing:-.035em;
}
.gap-exit-copy{
  margin:0 0 25px;
  color:var(--ink-soft);
  font-family:"Instrument Sans", sans-serif;
  font-size:.97rem;
  line-height:1.68;
}
.gap-exit-form{
  display:grid;
  gap:16px;
}
.gap-exit-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.gap-exit-field label{
  color:var(--ink);
  font-family:"Instrument Sans", sans-serif;
  font-size:.86rem;
  font-weight:600;
}
.gap-exit-field input{
  width:100%;
  min-height:52px;
  padding:13px 15px;
  border:1px solid var(--line, rgba(0,0,0,.13));
  border-radius:14px;
  color:var(--ink);
  background:color-mix(in srgb, var(--card, #fff) 91%, var(--teal) 9%);
  font-family:"Instrument Sans", sans-serif;
  font-size:.96rem;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.gap-exit-field input:focus{
  border-color:var(--teal);
  background:var(--card, #fff);
  box-shadow:0 0 0 4px rgba(23,126,143,.12);
}
.gap-exit-submit{
  width:100%;
  margin-top:2px;
  padding:15px 20px;
  border:0;
  border-radius:14px;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(110deg, #087EA4 0%, #2EA8D0 38%, #6C63B7 100%);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:1rem;
  font-weight:700;
  box-shadow:0 12px 28px rgba(23,126,143,.23);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.gap-exit-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 17px 36px rgba(23,126,143,.30);
}
.gap-exit-submit[disabled]{
  cursor:wait;
  opacity:.72;
  transform:none !important;
}
.gap-exit-note{
  margin:0;
  color:var(--ink-soft);
  font-family:"Instrument Sans", sans-serif;
  font-size:.77rem;
  line-height:1.55;
  text-align:center;
}
.gap-exit-status{
  min-height:0;
  margin:0;
  padding:0;
  border-radius:13px;
  font-family:"Instrument Sans", sans-serif;
  font-size:.87rem;
  line-height:1.55;
  text-align:center;
}
.gap-exit-status.is-visible{
  padding:11px 13px;
}
.gap-exit-status.is-success{
  color:#0f5b68;
  background:rgba(23,126,143,.12);
  border:1px solid rgba(23,126,143,.22);
}
.gap-exit-status.is-error{
  color:#8b3c1d;
  background:rgba(238,155,51,.13);
  border:1px solid rgba(226,138,40,.26);
}
.gap-exit-spinner{
  display:inline-block;
  width:15px;
  height:15px;
  margin-right:8px;
  vertical-align:-2px;
  border:2px solid rgba(255,255,255,.38);
  border-top-color:#fff;
  border-radius:50%;
  animation:gapExitSpin .75s linear infinite;
}
.gap-exit-honeypot{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
@keyframes gapExitSpin{
  to{transform:rotate(360deg)}
}
body.gap-exit-open{
  overflow:hidden;
}
[data-theme="dark"] .gap-exit-close{
  background:rgba(255,255,255,.07);
}
@media(max-width:600px){
  .gap-exit-modal{
    padding:30px 20px 23px;
    border-radius:22px;
  }
}



/* ================= AUDIT + GET BACKLINKS POPUPS ================= */
.lead-modal-overlay{
  position:fixed;
  inset:0;
  z-index:10030;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(7,25,31,.64);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  transition:opacity .24s ease, visibility .24s ease;
}
.lead-modal-overlay.is-open{
  opacity:1;
  visibility:visible;
}
.lead-modal{
  position:relative;
  width:min(100%, 680px);
  max-height:90vh;
  overflow:auto;
  padding:36px;
  border:1px solid rgba(23,126,143,.20);
  border-radius:26px;
  background:
    radial-gradient(circle at 100% 0%, rgba(238,155,51,.12), transparent 31%),
    radial-gradient(circle at 0% 100%, rgba(23,126,143,.14), transparent 36%),
    var(--card, #fff);
  box-shadow:0 30px 90px rgba(3,20,25,.34);
  transform:translateY(18px) scale(.97);
  transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.lead-modal-overlay.is-open .lead-modal{
  transform:translateY(0) scale(1);
}
.lead-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--line, rgba(0,0,0,.1));
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:rgba(255,255,255,.65);
  font-size:1.35rem;
  line-height:1;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.lead-modal-close:hover{
  color:#fff;
  background:var(--teal);
  transform:rotate(5deg);
}
.lead-modal-kicker{
  display:inline-block;
  margin:0 0 12px;
  color:var(--teal);
  font-family:"Spline Sans Mono", monospace;
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.lead-modal h3{
  max-width:380px;
  margin:0 46px 12px 0;
  color:var(--ink);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:clamp(1.7rem, 4vw, 2.45rem);
  line-height:1.1;
  letter-spacing:-.035em;
}
.lead-modal-copy{
  max-width:590px;
  margin:0 0 26px;
  color:var(--ink-soft);
  font-family:"Instrument Sans", sans-serif;
  font-size:.96rem;
  line-height:1.68;
}
.lead-form{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.lead-field{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.lead-field.full{
  grid-column:1 / -1;
}
.lead-field label{
  color:var(--ink);
  font-family:"Instrument Sans", sans-serif;
  font-size:.86rem;
  font-weight:600;
}
.lead-field input,
.lead-field select,
.lead-field textarea{
  width:100%;
  min-height:50px;
  padding:12px 14px;
  border:1px solid var(--line, rgba(0,0,0,.13));
  border-radius:14px;
  color:var(--ink);
  background:color-mix(in srgb, var(--card, #fff) 91%, var(--teal) 9%);
  font-family:"Instrument Sans", sans-serif;
  font-size:.94rem;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.lead-field textarea{
  min-height:105px;
  resize:vertical;
  line-height:1.55;
}
.lead-field input:focus,
.lead-field select:focus,
.lead-field textarea:focus{
  border-color:var(--teal);
  background:var(--card, #fff);
  box-shadow:0 0 0 4px rgba(23,126,143,.12);
}
.lead-submit{
  grid-column:1 / -1;
  width:100%;
  margin-top:3px;
  padding:15px 20px;
  border:0;
  border-radius:14px;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(110deg, #087EA4 0%, #2EA8D0 38%, #6C63B7 100%);
  font-family:"Bricolage Grotesque", sans-serif;
  font-size:1rem;
  font-weight:700;
  box-shadow:0 12px 28px rgba(23,126,143,.23);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.lead-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 17px 36px rgba(23,126,143,.30);
}
.lead-submit[disabled]{
  cursor:wait;
  opacity:.72;
  transform:none !important;
}
.lead-form-note{
  grid-column:1 / -1;
  margin:0;
  color:var(--ink-soft);
  font-family:"Instrument Sans", sans-serif;
  font-size:.77rem;
  line-height:1.55;
  text-align:center;
}
.lead-form-status{
  grid-column:1 / -1;
  min-height:0;
  margin:0;
  padding:0;
  border-radius:13px;
  font-family:"Instrument Sans", sans-serif;
  font-size:.87rem;
  line-height:1.55;
  text-align:center;
}
.lead-form-status.is-visible{
  padding:11px 13px;
}
.lead-form-status.is-success{
  color:#0f5b68;
  background:rgba(23,126,143,.12);
  border:1px solid rgba(23,126,143,.22);
}
.lead-form-status.is-error{
  color:#8b3c1d;
  background:rgba(238,155,51,.13);
  border:1px solid rgba(226,138,40,.26);
}
.lead-spinner{
  display:inline-block;
  width:15px;
  height:15px;
  margin-right:8px;
  vertical-align:-2px;
  border:2px solid rgba(255,255,255,.38);
  border-top-color:#fff;
  border-radius:50%;
  animation:leadSpinnerRotate .75s linear infinite;
}
.lead-honeypot{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
@keyframes leadSpinnerRotate{
  to{transform:rotate(360deg)}
}
body.lead-modal-open{
  overflow:hidden;
}
[data-theme="dark"] .lead-modal-close{
  background:rgba(255,255,255,.07);
}
@media(max-width:650px){
  .lead-modal{
    padding:30px 20px 23px;
    border-radius:22px;
  }
  .lead-form{
    grid-template-columns:1fr;
  }
  .lead-field.full,
  .lead-submit,
  .lead-form-note,
  .lead-form-status{
    grid-column:1;
  }
}



/* ================= POPUP HEADING ADJUSTMENTS ================= */
.lead-two-line-title span{
  display:block;
}
.lead-two-line-title span:first-child{
  margin-bottom:2px;
}
.community-modal h3.community-single-line-title{
  max-width:none;
  margin-right:38px;
  white-space:nowrap;
  font-size:clamp(1.35rem, 3.6vw, 2.2rem);
  letter-spacing:-.035em;
}
@media(max-width:420px){
  .community-modal h3.community-single-line-title{
    margin-right:38px;
    font-size:1.18rem;
    letter-spacing:-.04em;
  }
}



/* ================= DECENT POPUP SCROLLBARS ================= */
/*
 * Replaces the browser's large scrollbar and arrow buttons with a slim,
 * rounded scrollbar positioned inside the popup edge.
 */
.lead-modal,
.community-modal,
.gap-exit-modal{
  scrollbar-width:thin;
  scrollbar-color:rgba(23,126,143,.72) transparent;
  scrollbar-gutter:stable;
}

/* Chrome, Edge, Safari and other WebKit browsers */
.lead-modal::-webkit-scrollbar,
.community-modal::-webkit-scrollbar,
.gap-exit-modal::-webkit-scrollbar{
  width:8px;
}

.lead-modal::-webkit-scrollbar-track,
.community-modal::-webkit-scrollbar-track,
.gap-exit-modal::-webkit-scrollbar-track{
  margin-block:18px;
  background:transparent;
}

.lead-modal::-webkit-scrollbar-thumb,
.community-modal::-webkit-scrollbar-thumb,
.gap-exit-modal::-webkit-scrollbar-thumb{
  min-height:64px;
  border:2px solid transparent;
  border-radius:999px;
  background:
    linear-gradient(
      180deg,
      rgba(23,126,143,.92),
      rgba(63,182,201,.82),
      rgba(108,99,183,.76)
    )
    padding-box;
}

.lead-modal::-webkit-scrollbar-thumb:hover,
.community-modal::-webkit-scrollbar-thumb:hover,
.gap-exit-modal::-webkit-scrollbar-thumb:hover{
  background:
    linear-gradient(
      180deg,
      #087EA4,
      #2EA8D0,
      #6C63B7
    )
    padding-box;
}

/* Removes the top and bottom arrow buttons visible in the old scrollbar. */
.lead-modal::-webkit-scrollbar-button,
.community-modal::-webkit-scrollbar-button,
.gap-exit-modal::-webkit-scrollbar-button{
  display:none;
  width:0;
  height:0;
}

/* Keeps the scrollbar visually inside the rounded popup edge. */
.lead-modal,
.community-modal,
.gap-exit-modal{
  background-clip:padding-box;
}

@media(max-width:650px){
  .lead-modal::-webkit-scrollbar,
  .community-modal::-webkit-scrollbar,
  .gap-exit-modal::-webkit-scrollbar{
    width:6px;
  }
}



/* ================= HEADER TOOLS DROPDOWN ================= */
.tools-dropdown{
  position:relative;
  display:flex;
  align-items:center;
}

.tools-dropdown-trigger{
  display:inline-flex !important;
  align-items:center;
  gap:6px;
}

.tools-dropdown-arrow{
  display:inline-block;
  font-size:.9em;
  line-height:1;
  transform:translateY(-1px);
  transition:transform .22s ease;
}

.tools-dropdown-menu{
  position:absolute;
  top:calc(100% + 14px);
  right:0;
  z-index:1000;
  width:310px;
  padding:10px;
  border:1px solid rgba(23,126,143,.17);
  border-radius:18px;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.98),
      rgba(235,247,245,.98)
    );
  box-shadow:0 20px 38px rgba(12,42,51,.16);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform-origin:top center;
  transform:translateY(-10px) scaleY(.92);
  transition:
    opacity .2s ease,
    visibility .2s ease,
    transform .24s cubic-bezier(.2,.8,.2,1);
}

.tools-dropdown-menu::before{
  content:"";
  position:absolute;
  top:-7px;
  right:28px;
  width:14px;
  height:14px;
  border-top:1px solid rgba(23,126,143,.17);
  border-left:1px solid rgba(23,126,143,.17);
  background:rgba(255,255,255,.98);
  transform:rotate(45deg);
}

.tools-dropdown-menu a{
  position:relative;
  z-index:1;
  display:block !important;
  padding:13px 14px !important;
  border-radius:12px;
  color:var(--ink) !important;
  font-family:"Instrument Sans", sans-serif;
  font-size:.9rem;
  font-weight:600;
  line-height:1.38;
  text-decoration:none;
  white-space:normal !important;
  transition:
    color .18s ease,
    background .18s ease,
    transform .18s ease;
}

.tools-dropdown-menu a:hover,
.tools-dropdown-menu a:focus-visible{
  color:var(--teal) !important;
  background:rgba(23,126,143,.09);
  transform:translateX(3px);
  outline:none;
}

.tools-dropdown:hover .tools-dropdown-menu,
.tools-dropdown:focus-within .tools-dropdown-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scaleY(1);
}

.tools-dropdown:hover .tools-dropdown-arrow,
.tools-dropdown:focus-within .tools-dropdown-arrow{
  transform:translateY(-1px) rotate(180deg);
}

[data-theme="dark"] .tools-dropdown-menu{
  border-color:rgba(63,182,201,.22);
  background:
    linear-gradient(
      145deg,
      rgba(15,37,38,.98),
      rgba(19,51,61,.98)
    );
  box-shadow:0 20px 38px rgba(0,0,0,.38);
}

[data-theme="dark"] .tools-dropdown-menu::before{
  border-color:rgba(63,182,201,.22);
  background:rgba(15,37,38,.98);
}

[data-theme="dark"] .tools-dropdown-menu a:hover,
[data-theme="dark"] .tools-dropdown-menu a:focus-visible{
  color:#71d3df !important;
  background:rgba(63,182,201,.12);
}

.tools-dropdown::after{
  content:"";
  position:absolute;
  top:100%;
  right:0;
  width:100%;
  height:16px;
}

@media(max-width:900px){
  .tools-dropdown-menu{
    right:auto;
    left:0;
    width:min(310px, calc(100vw - 32px));
  }

  .tools-dropdown-menu::before{
    right:auto;
    left:28px;
  }
}

@media(prefers-reduced-motion:reduce){
  .tools-dropdown-menu,
  .tools-dropdown-arrow,
  .tools-dropdown-menu a{
    transition:none !important;
  }
}


/* ================= MOBILE INTERFACE OPTIMIZATION ================= */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-padding-top:92px;
}

body{
  overflow-x:hidden;
}

img,
svg{
  max-width:100%;
}

button,
a,
input,
select,
textarea{
  -webkit-tap-highlight-color:transparent;
}

.mobile-menu-toggle,
.mobile-nav-backdrop{
  display:none;
}

/* Prevent long headings, URLs and labels from forcing horizontal scrolling. */
.section-title,
.hero h1,
.aeo-card h3,
.member h3,
.price h3,
.faq-q,
.lead-modal h3,
.community-modal h3,
.gap-exit-modal h3,
.foot-grid a{
  overflow-wrap:anywhere;
}

/* Touch devices should not depend on hover movement. */
@media (hover:none){
  #process .step:hover,
  #team .member:hover,
  #inventory .tier:hover,
  #pricing .price:hover,
  #results .case-study-slot:hover,
  #blog .blog-card:hover,
  .profile-actions .profile-icon-btn:hover,
  .community-join-btn:hover{
    transform:none !important;
  }
}

@media (max-width:900px){
  /* ---------- Mobile navigation ---------- */
  nav{
    padding-top:env(safe-area-inset-top);
  }

  nav .nav-inner{
    min-height:72px;
    padding-top:8px !important;
    padding-bottom:8px !important;
  }

  nav .logo{
    position:relative;
    z-index:1004;
  }

  nav .logo-image-slot{
    width:38px !important;
    height:38px !important;
    flex-basis:38px !important;
  }

  nav .logo-wordmark{
    font-size:1rem;
  }

  .mobile-menu-toggle{
    position:relative;
    z-index:1005;
    width:46px;
    height:46px;
    margin-left:auto;
    padding:0;
    display:grid;
    place-content:center;
    gap:5px;
    border:1px solid color-mix(in srgb, var(--teal) 26%, var(--line));
    border-radius:14px;
    color:var(--ink);
    background:color-mix(in srgb, var(--card, #fff) 92%, transparent);
    box-shadow:0 8px 22px rgba(12,42,51,.08);
    cursor:pointer;
  }

  .mobile-menu-toggle span{
    width:22px;
    height:2px;
    display:block;
    border-radius:99px;
    background:currentColor;
    transform-origin:center;
    transition:transform .22s ease, opacity .18s ease;
  }

  nav.mobile-menu-open .mobile-menu-toggle span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }

  nav.mobile-menu-open .mobile-menu-toggle span:nth-child(2){
    opacity:0;
  }

  nav.mobile-menu-open .mobile-menu-toggle span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }

  nav .nav-links{
    position:fixed !important;
    top:0;
    right:0;
    bottom:0;
    z-index:1003;
    width:min(88vw, 380px);
    height:100dvh;
    margin:0 !important;
    padding:
      calc(88px + env(safe-area-inset-top))
      20px
      calc(28px + env(safe-area-inset-bottom)) !important;
    display:flex !important;
    flex-direction:column;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:4px !important;
    overflow-y:auto;
    overscroll-behavior:contain;
    border-left:1px solid color-mix(in srgb, var(--teal) 18%, var(--line));
    background:
      radial-gradient(circle at 100% 0%, rgba(238,155,51,.10), transparent 30%),
      radial-gradient(circle at 0% 100%, rgba(23,126,143,.12), transparent 34%),
      var(--card, #fff);
    box-shadow:-22px 0 38px rgba(3,20,25,.20);
    transform:translateX(105%);
    visibility:hidden;
    transition:transform .28s cubic-bezier(.2,.8,.2,1), visibility .28s ease;
  }

  nav.mobile-menu-open .nav-links{
    transform:translateX(0);
    visibility:visible;
  }

  nav .nav-links > a:not(.btn),
  nav .tools-dropdown-trigger{
    width:100%;
    min-height:38px;
    padding:12px 13px !important;
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    border-radius:12px;
    color:var(--ink) !important;
    font-size:.96rem;
    font-weight:650;
    white-space:normal !important;
  }

  nav .nav-links > a:not(.btn):active,
  nav .tools-dropdown-trigger:active{
    background:rgba(23,126,143,.10);
  }

  nav .nav-cta{
    width:100%;
    min-height:50px;
    margin-top:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
  }

  #themeToggle{
    width:38px;
    min-width:38px;
    height:38px;
    margin:10px 0 0;
    align-self:flex-start;
    border-radius:13px;
  }

  .mobile-nav-backdrop,
  body.mobile-menu-open .mobile-nav-backdrop{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  body.mobile-menu-open{
    overflow:hidden;
  }

  /* Mobile Tools accordion */
  nav .tools-dropdown{
    width:100%;
    display:block !important;
  }

  nav .tools-dropdown-menu{
    position:static !important;
    width:100% !important;
    max-height:0;
    margin:0 !important;
    padding:0 0 0 10px !important;
    overflow:hidden;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:none !important;
    transform:none !important;
    transition:max-height .28s ease, padding .28s ease !important;
  }

  nav .tools-dropdown-menu::before,
  nav .tools-dropdown::after{
    display:none !important;
  }

  nav .tools-dropdown.is-mobile-open .tools-dropdown-menu{
    max-height:260px;
    padding-top:5px !important;
    padding-bottom:5px !important;
    pointer-events:auto !important;
  }

  nav .tools-dropdown-menu a{
    min-height:46px;
    padding:11px 12px !important;
    display:flex !important;
    align-items:center;
    border-radius:11px;
    font-size:.88rem;
  }

  nav .tools-dropdown.is-mobile-open .tools-dropdown-arrow{
    transform:rotate(180deg);
  }

  /* ---------- Tablet and mobile layout ---------- */
  .hero-grid,
  .split{
    grid-template-columns:1fr !important;
  }

  .hero-grid{
    gap:18px !important;
  }

  .hero .reveal{
    text-align:center;
  }

  .hero .lede{
    max-width:680px;
    margin-left:auto;
    margin-right:auto;
  }

  .hero-ctas{
    justify-content:center;
  }

  .hero-stats{
    max-width:620px;
    margin-left:auto;
    margin-right:auto;
  }

  .hero-parallax{
    width:100%;
    max-width:650px;
    margin:0 auto;
    transform:none !important;
  }

  .team-grid,
  .prices,
  .case-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .foot-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:34px 24px !important;
  }

  footer .logo-image-slot{
    width:46px !important;
    height:46px !important;
    flex-basis:46px !important;
  }

  .lead-modal-overlay,
  .community-modal-overlay,
  .gap-exit-overlay{
    padding:16px;
  }
}

@media (max-width:720px){
  /* ---------- General spacing and typography ---------- */
  .wrap{
    width:100% !important;
    max-width:100% !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }

  section{
    padding-top:72px !important;
    padding-bottom:72px !important;
  }

  .hero{
    min-height:auto !important;
    padding-top:98px !important;
    padding-bottom:58px !important;
  }

  .hero h1{
    font-size:clamp(2.55rem, 14vw, 4rem) !important;
    line-height:.98 !important;
  }

  .section-title{
    font-size:clamp(2rem, 10vw, 3rem) !important;
    line-height:1.08 !important;
  }

  .section-sub,
  .hero .lede,
  .aeo-card p,
  .tier li,
  .step p,
  .member p,
  .price li,
  .faq-a p{
    font-size:.97rem !important;
    line-height:1.68 !important;
  }

  .hero-lede-lines span + span{
    margin-top:10px;
  }

  .hero-ctas{
    display:grid !important;
    grid-template-columns:1fr;
    gap:11px !important;
  }

  .hero-ctas .btn{
    width:100%;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
  }

  .hero-stats{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .hero-stats .stat{
    min-width:0;
    padding:14px 7px !important;
  }

  .hero-stats .num{
    font-size:1.45rem !important;
  }

  .hero-stats .lbl{
    font-size:.69rem !important;
    line-height:1.3 !important;
  }

  .hero-flowchart-slot{
    height:270px !important;
  }

  .hero-parallax,
  .hero-parallax .bob,
  .why-image-slot{
    animation:none !important;
    transform:none !important;
  }

  .hero .grid-flow,
  .hero .sky,
  .bg-gull,
  .breathe-glow{
    display:none !important;
  }

  .ticker{
    font-size:.75rem;
  }

  .tiers,
  #process .steps,
  .team-grid,
  .prices,
  .case-grid,
  .blog-grid,
  .foot-grid{
    grid-template-columns:1fr !important;
  }

  .tiers,
  #process .steps,
  .team-grid,
  .prices,
  .case-grid,
  .blog-grid{
    gap:18px !important;
  }

  #process .step,
  #inventory .tier,
  #team .member,
  #pricing .price,
  #faq .faq-item{
    border-radius:18px !important;
  }

  #process .step,
  #inventory .tier,
  #team .member,
  #pricing .price{
    padding:24px 20px !important;
  }

  #process .step .process-image-slot{
    width:64px !important;
    height:64px !important;
    flex-basis:64px !important;
    margin-bottom:15px !important;
  }

  .aeo-flow{
    margin-top:34px;
  }

  .aeo-columns{
    gap:16px;
  }

  .aeo-card{
    padding:24px 19px 22px;
    border-radius:18px;
  }

  .aeo-action-card h3{
    margin-bottom:14px;
    font-size:1.16rem;
    white-space:normal;
  }

  .aeo-converge{
    height:92px !important;
  }

  .aeo-result-card{
    padding:23px 18px;
    border-radius:18px;
  }

  .why-image-slot{
    width:min(100%, 310px) !important;
    margin-bottom:12px !important;
  }

  .why-list li{
    align-items:flex-start !important;
    gap:12px !important;
  }

  .why-list .dot{
    flex:0 0 auto;
  }

  .member-photo-slot{
    width:100%;
    height:auto !important;
    aspect-ratio:4 / 5;
    max-height:460px;
  }

  .member p{
    text-align:left;
  }

  .profile-actions .profile-icon-btn{
    width:38px;
    height:38px;
    flex-basis:38px;
  }

  .price .btn,
  .tier .btn{
    width:100%;
    min-height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
  }

  .case-study-slot{
    height:auto !important;
    aspect-ratio:16 / 10;
  }

  .blog-head{
    margin-bottom:26px;
  }

  .blog-head .btn{
    width:100%;
    min-height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .blog-card-body{
    padding:19px;
  }

  .blog-thumb-slot{
    height:auto !important;
    min-height:180px;
    aspect-ratio:16 / 10;
  }

  .faq-q{
    min-height:58px;
    padding:17px 16px !important;
    gap:12px;
    text-align:left;
    line-height:1.35;
  }

  .faq-a p{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .cta-block{
    padding:38px 20px !important;
    border-radius:22px !important;
  }

  .cta-block h2{
    font-size:clamp(2rem, 10vw, 3rem) !important;
  }

  .cta-block .btn{
    width:100%;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
  }

  .community-invite{
    padding:58px 0 46px !important;
  }

  .community-join-btn{
    width:100%;
    max-width:340px;
    min-height:50px;
  }

  /* ---------- Mobile form behaviour ---------- */
  .community-form,
  .lead-form{
    grid-template-columns:1fr !important;
  }

  .community-field.full,
  .community-submit,
  .community-form-note,
  .community-form-status,
  .lead-field.full,
  .lead-submit,
  .lead-form-note,
  .lead-form-status{
    grid-column:1 !important;
  }

  .community-field input,
  .lead-field input,
  .lead-field select,
  .lead-field textarea,
  .gap-exit-field input{
    min-height:52px;
    font-size:16px !important;
  }

  .lead-field textarea{
    min-height:118px;
  }

  .lead-modal-overlay,
  .community-modal-overlay,
  .gap-exit-overlay{
    align-items:flex-end;
    padding:0 !important;
  }

  .lead-modal,
  .community-modal,
  .gap-exit-modal{
    width:100% !important;
    max-width:none !important;
    max-height:94dvh !important;
    margin:0;
    padding:
      38px
      18px
      calc(20px + env(safe-area-inset-bottom)) !important;
    border-right:0 !important;
    border-bottom:0 !important;
    border-left:0 !important;
    border-radius:24px 24px 0 0 !important;
    transform:translateY(28px) !important;
  }

  .lead-modal-overlay.is-open .lead-modal,
  .community-modal-overlay.is-open .community-modal,
  .gap-exit-overlay.is-open .gap-exit-modal{
    transform:translateY(0) !important;
  }

  .lead-modal-close,
  .community-modal-close,
  .gap-exit-close{
    top:10px !important;
    right:12px !important;
    width:38px !important;
    height:38px !important;
  }

  .lead-modal h3,
  .community-modal h3,
  .gap-exit-modal h3,
  .community-modal h3.community-single-line-title{
    max-width:none !important;
    margin-right:38px !important;
    white-space:normal !important;
    font-size:clamp(1.55rem, 8vw, 2.05rem) !important;
    line-height:1.12 !important;
  }

  .lead-modal-copy,
  .community-modal-copy,
  .gap-exit-copy{
    margin-bottom:21px !important;
    font-size:.94rem !important;
    line-height:1.58 !important;
  }

  .lead-submit,
  .community-submit,
  .gap-exit-submit{
    min-height:52px;
  }

  /* ---------- Footer ---------- */
  footer{
    padding-bottom:env(safe-area-inset-bottom);
  }

  .foot-grid{
    gap:28px !important;
  }

  .foot-grid > div{
    min-width:0;
  }

  .foot-grid a{
    min-height:38px;
    display:flex;
    align-items:center;
  }

  footer .logo{
    margin-bottom:12px;
  }

  footer .copy{
    margin-top:32px !important;
    padding-top:22px !important;
    text-align:center;
  }
}

@media (max-width:420px){
  .wrap{
    padding-left:15px !important;
    padding-right:15px !important;
  }

  .hero{
    padding-top:90px !important;
  }

  .hero h1{
    font-size:clamp(2.35rem, 15vw, 3.45rem) !important;
  }

  .hero-stats{
    grid-template-columns:1fr !important;
  }

  .hero-stats .stat{
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:13px;
    text-align:left;
  }

  .hero-stats .num{
    min-width:78px;
  }

  .hero-flowchart-slot{
    height:235px !important;
  }

  #process .step,
  #inventory .tier,
  #team .member,
  #pricing .price{
    padding:22px 17px !important;
  }

  .lead-modal,
  .community-modal,
  .gap-exit-modal{
    padding-left:15px !important;
    padding-right:15px !important;
  }

  nav .nav-links{
    width:92vw;
    padding-left:16px !important;
    padding-right:16px !important;
  }
}

@media (max-width:350px){
  .logo-wordmark{
    display:none;
  }

  .hero h1{
    font-size:2.25rem !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu-toggle span,
  nav .nav-links,
  .mobile-nav-backdrop,
  nav .tools-dropdown-menu{
    transition:none !important;
  }
}

/* Footer brand alignment: match header logo size and wordmark */
footer .logo.logo-with-image{
  display:inline-flex!important;
  align-items:center!important;
  gap:2px;
  font-size:1.35rem;
  line-height:1;
  padding:0!important;
}
footer .logo.logo-with-image .logo-image-slot{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  flex:0 0 38px!important;
}
footer .logo.logo-with-image .logo-wordmark{
  font-size:inherit;
  line-height:1;
  transform:translateY(2px);
}
@media(max-width:900px){
  footer .logo.logo-with-image{
    font-size:1rem;
  }
  footer .logo.logo-with-image .logo-image-slot{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    flex:0 0 38px!important;
  }
}
@media(max-width:420px){
  footer .logo.logo-with-image{
    font-size:.92rem;
  }
}



/* ================= AUG 16 HOMEPAGE UPDATES ================= */
.hero h1{max-width:700px;}
.hero-how-callout{display:flex;align-items:center;justify-content:center;gap:14px;margin:10px 0 30px;color:var(--teal-deep);font-family:"Spline Sans Mono",monospace;font-weight:600;letter-spacing:.02em;transform:rotate(-3deg);}
.hero-how-copy{padding:10px 16px;border-radius:999px;background:rgba(8,126,164,.09);border:1px dashed rgba(8,126,164,.35);}
.hero-how-arrow{font-size:1.4rem;transform:translateY(1px);}
@media(min-width:901px){.hero .reveal{text-align:left}.hero-how-callout{justify-content:center;max-width:460px}}

.case-study-card{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:26px;border:1px solid rgba(255,255,255,.12);border-radius:24px;min-height:245px;background:linear-gradient(135deg,#087EA4 0%,#0b8fb7 55%,#066682 100%);box-shadow:0 20px 38px rgba(6,95,125,.24);color:#fff;isolation:isolate;}
.case-study-card::before,.case-study-card::after{content:"";position:absolute;border-radius:999px;background:rgba(255,255,255,.10);z-index:0;animation:caseFloat 9s ease-in-out infinite;}
.case-study-card::before{width:140px;height:140px;top:-34px;right:-30px;}
.case-study-card::after{width:96px;height:96px;bottom:-22px;left:-18px;animation-duration:11s;}
.case-study-card > *{position:relative;z-index:1;}
.case-study-card h3{font-size:1.45rem;line-height:1.18;margin:10px 0 10px;max-width:270px;}
.case-study-card p{max-width:290px;color:rgba(255,255,255,.88);font-size:.96rem;line-height:1.6;}
.case-study-badge{display:inline-flex;align-items:center;justify-content:center;padding:8px 13px;border-radius:999px;background:rgba(255,255,255,.14);font-family:"Spline Sans Mono",monospace;font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;}
.case-study-pulse{position:absolute;border-radius:999px;border:1px solid rgba(255,255,255,.28);}
.case-study-pulse-1{width:84px;height:84px;top:18px;left:20px;animation:casePulse 4.8s ease-in-out infinite;}
.case-study-pulse-2{width:64px;height:64px;right:26px;bottom:24px;animation:casePulse 5.4s ease-in-out infinite 1.1s;}
@keyframes caseFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,12px,0)}}
@keyframes casePulse{0%,100%{transform:scale(.92);opacity:.45}50%{transform:scale(1.08);opacity:.95}}

#trusted-by{overflow:hidden;}
.trusted-marquee{display:flex;gap:18px;overflow:hidden;margin-top:42px;padding:12px 0;}
.trusted-track{display:flex;gap:18px;min-width:max-content;animation:trustedFloat 26s linear infinite;}
.trusted-logo-box{display:flex;align-items:center;justify-content:center;min-width:170px;height:82px;padding:0 22px;border:1px solid rgba(8,126,164,.18);border-radius:20px;background:rgba(255,255,255,.5);color:rgba(6,95,125,.72);font-weight:700;opacity:.72;backdrop-filter:blur(8px);}
@keyframes trustedFloat{from{transform:translateX(-2%)}to{transform:translateX(18%)}}
[data-theme="dark"] .trusted-logo-box{background:rgba(255,255,255,.04);color:rgba(234,238,242,.78);border-color:rgba(114,203,232,.18);}

.specialist-advantage .specialist-head{max-width:860px;margin:0 auto 38px;text-align:center;}
.specialist-grid{display:grid;grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr);gap:24px;align-items:stretch;}
.specialist-column{display:grid;gap:16px;padding:26px;border-radius:24px;background:rgba(255,255,255,.7);border:1px solid var(--line);box-shadow:0 18px 40px rgba(12,42,51,.08);}
.specialist-column-loss{background:linear-gradient(180deg,rgba(238,155,51,.10),rgba(255,255,255,.85));}
.specialist-column-win{background:linear-gradient(180deg,rgba(8,126,164,.12),rgba(255,255,255,.9));}
.specialist-kicker{display:inline-flex;align-items:center;justify-content:center;width:max-content;padding:8px 14px;border-radius:999px;font-family:"Spline Sans Mono",monospace;font-size:.77rem;letter-spacing:.08em;text-transform:uppercase;background:rgba(12,42,51,.06);color:var(--ink);}
.specialist-card{padding:18px 18px 17px;border-radius:18px;background:rgba(255,255,255,.76);border:1px solid rgba(12,42,51,.07);}
.specialist-card strong{display:block;margin-bottom:7px;font-size:1rem;}
.specialist-card p{color:var(--ink-soft);font-size:.96rem;line-height:1.65;}
.specialist-vs{display:flex;align-items:center;justify-content:center;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.45rem;color:var(--teal);}
[data-theme="dark"] .specialist-column{background:rgba(16,38,60,.9);border-color:rgba(63,182,201,.12);}
[data-theme="dark"] .specialist-card{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.06);}

.cta-block{position:relative;overflow:visible;}
.cta-note{position:absolute;top:-22px;left:18px;color:var(--teal-deep);font-family:"Spline Sans Mono",monospace;font-weight:700;letter-spacing:.03em;transform:rotate(-7deg);}

.community-phone-row{display:grid;grid-template-columns:minmax(0,1fr) 1.35fr;gap:14px;align-items:end;}
.community-field select{width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);font:inherit;}
.community-field select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(8,126,164,.10);}
[data-theme="dark"] .community-field select{background:#10303C;border-color:#1D4250;color:#EAF4F2;}

@media(max-width:900px){
  .specialist-grid{grid-template-columns:1fr;gap:18px;}
  .specialist-vs{min-height:54px;}
}
@media(max-width:720px){
  .hero-how-callout{margin-bottom:24px;}
  .community-phone-row{grid-template-columns:1fr;}
  .cta-note{position:static;display:block;margin-bottom:14px;}
  .case-study-card{min-height:220px;}
  .case-study-card h3{font-size:1.28rem;}
  .trusted-logo-box{min-width:150px;height:72px;}
}

/* ================= AUG 16 REFINEMENT PASS 2 ================= */
/* These rules refine only the newly added homepage elements. */

/* Hero handwritten cue: sit beneath the lower-right edge of the headline,
   close to the flowchart without changing the hero grid itself. */
.hero-how-callout{
  width:max-content;
  color:var(--teal-deep);
  text-decoration:none;
  font-family:"Spline Sans Mono", monospace;
  font-weight:650;
  letter-spacing:.02em;
}
.hero-how-copy{
  padding:0 2px 3px;
  border:0;
  border-bottom:2px solid currentColor;
  border-radius:0;
  background:transparent;
}
.hero-how-arrow{
  font-size:1.55rem;
  line-height:1;
}

@media(min-width:901px){
  .hero .reveal{
    position:relative;
  }
  .hero-how-callout{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:12px;
    margin:8px 0 28px 38%;
    transform:rotate(-3deg);
  }
}

/* Specialist agency comparison: one compact table, one line per idea. */
.specialist-advantage .specialist-head{
  max-width:940px;
  margin:0 auto 42px;
  text-align:center;
}
.specialist-compare-table{
  max-width:1040px;
  margin:0 auto;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--teal) 24%,var(--line));
  border-radius:24px;
  background:var(--card);
  box-shadow:0 18px 38px rgba(12,42,51,.08);
}
.specialist-table-row{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.specialist-table-row + .specialist-table-row{
  border-top:1px solid var(--line);
}
.specialist-table-row > div{
  min-width:0;
  padding:17px 22px;
  color:var(--ink-soft);
  font-size:.96rem;
  line-height:1.45;
}
.specialist-table-row > div + div{
  border-left:1px solid var(--line);
  background:linear-gradient(90deg,rgba(8,126,164,.055),rgba(8,126,164,.018));
}
.specialist-table-row strong{
  color:var(--ink);
}
.specialist-table-head > div{
  padding-top:18px;
  padding-bottom:18px;
  color:var(--ink);
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:1.08rem;
  font-weight:800;
  text-align:center;
}
.specialist-table-head > div:first-child{
  background:color-mix(in srgb,var(--beak) 10%,var(--card));
}
.specialist-table-head > div:last-child{
  color:var(--teal-deep);
  background:color-mix(in srgb,var(--teal) 11%,var(--card));
}
[data-theme="dark"] .specialist-compare-table{
  background:var(--card);
}
[data-theme="dark"] .specialist-table-row > div + div{
  background:rgba(46,168,208,.05);
}

/* Case-study cards now contain only a single, instantly scannable statement. */
.case-study-card{
  min-height:230px;
  padding:30px 24px;
}
.case-study-card h3{
  max-width:310px;
  margin:0;
  font-size:clamp(1.32rem,2vw,1.7rem);
  line-height:1.18;
  color:#fff;
}
.case-study-badge,
.case-study-card p{
  display:none;
}

/* Final CTA: handwritten cue to the left of the meeting button. */
.cta-booking-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  width:100%;
}
.cta-note{
  position:static;
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin:0;
  color:#fff;
  font-family:"Spline Sans Mono",monospace;
  font-size:.92rem;
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
  transform:rotate(-5deg);
  animation:ctaDiscussNudge 1.8s ease-in-out infinite;
}
.cta-note span{
  font-size:1.2rem;
  line-height:1;
}
@keyframes ctaDiscussNudge{
  0%,100%{transform:translateX(-4px) rotate(-5deg)}
  50%{transform:translateX(7px) rotate(-5deg)}
}

@media(max-width:900px){
  .hero-how-callout{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    margin:10px auto 24px;
    transform:rotate(-3deg);
  }
  .specialist-table-row > div{
    padding:16px 18px;
    font-size:.92rem;
  }
}

@media(max-width:720px){
  .specialist-compare-table{
    border-radius:20px;
  }
  .specialist-table-row{
    grid-template-columns:1fr;
  }
  .specialist-table-row > div + div{
    border-left:0;
    border-top:1px dashed var(--line);
  }
  .specialist-table-head > div{
    text-align:left;
  }
  .cta-booking-row{
    flex-direction:column;
    gap:14px;
  }
  .cta-note{
    font-size:.86rem;
  }
  .case-study-card{
    min-height:205px;
  }
}

@media(prefers-reduced-motion:reduce){
  .cta-note{
    animation:none;
  }
}

body>nav .logo-image-slot,nav .logo-image-slot,.logo.logo-with-image .logo-image-slot,footer .logo-image-slot,footer .logo.logo-with-image .logo-image-slot,nav .logo-image-wrap,footer .logo-image-wrap{width:30.4px!important;height:30.4px!important;min-width:30.4px!important;flex:0 0 30.4px!important;flex-basis:30.4px!important}