/* ============================================================
   KUT Consulting, site styles
   Obsidian / brushed-silver / one blue-steel accent (#5b6f9e).
   Cormorant Garamond (display) + Hanken Grotesk (body).
   Shared across every page.
   ============================================================ */

:root{
  --bg:#060607; --ink:#EFEDE6; --muted:#a2a199; --faint:#8b8a80; --line:#1c1c21;
  --metal1:#eef0f4; --metal2:#9da1ab; --metal3:#6f727a;
  --meteor:#5b6f9e;                       /* the one cool blue-steel accent */
  --mammoth:#8a6c4e;
  --display:'Cormorant Garamond',Georgia,serif;
  --body:'Hanken Grotesk',system-ui,sans-serif;
  --space:32px;                           /* base horizontal gutter */
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--body); font-weight:400; line-height:1.7;
  -webkit-font-smoothing:antialiased; overflow-x:hidden; position:relative;
}

/* --- Atmosphere: drifting glows + film grain ------------------------------ */
.atmo{position:fixed;inset:0;z-index:0;pointer-events:none}
.atmo .glow{position:absolute;border-radius:50%;filter:blur(55px)}
.glow.a{top:-32vw;left:50%;width:92vw;height:92vw;transform:translateX(-50%);background:radial-gradient(circle,rgba(58,72,108,.30),transparent 62%);animation:drift1 24s ease-in-out infinite}
.glow.b{bottom:-22vw;right:-12vw;width:74vw;height:74vw;background:radial-gradient(circle,rgba(96,72,50,.20),transparent 62%);animation:drift2 30s ease-in-out infinite}
.glow.c{top:42vh;left:-20vw;width:50vw;height:50vw;background:radial-gradient(circle,rgba(122,42,40,.13),transparent 62%);animation:drift2 34s ease-in-out infinite}
@keyframes drift1{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-46%,4vw)}}
@keyframes drift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-4vw,-3vw)}}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.content{position:relative;z-index:2}
.wrap{max-width:1200px;margin:0 auto;padding:0 var(--space)}

/* --- Type -------------------------------------------------------------- */
.label{font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.34em;color:var(--faint)}
h1,h2{font-family:var(--display);font-weight:300;line-height:1.03;letter-spacing:-.01em}

/* Brushed-silver gradient used on every major heading + wordmark.
   line-height/padding-bottom keep descenders (g, y, p) from clipping. */
.metal,
.hero h1,
.block h2,
.edge h2{
  background:linear-gradient(180deg,var(--metal1),var(--metal2) 52%,var(--metal3));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.hero h1,.block h2,.turn{line-height:1.13;padding-bottom:.1em}

/* Tiny arrowhead bullet (pure CSS) reused in cards + ticker */
.ahead-bullet{display:inline-block;width:7px;height:9px;opacity:.65;background:linear-gradient(180deg,var(--metal2),var(--metal3));clip-path:polygon(50% 0,92% 100%,50% 76%,8% 100%);flex:none}

/* ============================================================
   Navigation (shared)
   ============================================================ */
nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:20px var(--space);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(to bottom,rgba(6,6,7,.9),rgba(6,6,7,0))}
.brand{display:flex;align-items:baseline;gap:9px;text-decoration:none}
.brand .b1{font-family:var(--display);font-size:24px;letter-spacing:.3em;font-weight:600;padding-left:.3em}
.brand .b2{font-family:var(--body);font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);font-weight:600}
.nav-links{display:flex;align-items:center;gap:36px}
.nav-links a{color:var(--muted);text-decoration:none;font-size:14px;transition:color .3s}
.nav-links a:hover{color:var(--ink)}
.nav-toggle{display:none}

/* Mobile: collapse the links into a hamburger drop-down panel */
@media(max-width:760px){
  .nav-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;padding:0;background:none;border:0;cursor:pointer}
  .nav-toggle span{display:block;width:26px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s ease,opacity .2s ease}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .nav-links{
    position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:rgba(6,6,7,.98);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);
    padding:6px 0 16px;
    max-height:0;overflow:hidden;opacity:0;pointer-events:none;
    transition:max-height .35s ease,opacity .3s ease;
  }
  .nav-links.open{max-height:80vh;opacity:1;pointer-events:auto}
  .nav-links a{display:block;padding:15px var(--space);font-size:16px;color:var(--ink)}
  .nav-links a:not(.btn-glass){border-bottom:1px solid var(--line)}
  .nav-links .btn-glass{margin:16px var(--space) 4px;justify-content:center;min-height:44px;font-size:14px}
}

/* ============================================================
   Buttons, ONE primary "metal/glass" style, site-wide
   ============================================================ */
.btn-glass{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:44px;                                   /* touch target */
  background:linear-gradient(180deg,#34353d 0%,#1a1b20 52%,#0a0b0e 100%);
  border:1px solid rgba(255,255,255,.10);
  color:#f2f1ec;font-family:var(--body);font-weight:500;font-size:15px;letter-spacing:.02em;
  padding:16px 30px;border-radius:7px;cursor:pointer;text-decoration:none;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26), 0 10px 26px rgba(0,0,0,.5);
  transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease,background .25s ease,border-color .35s;
  will-change:transform;
}
.btn-glass:hover{transform:translateY(-2px);border-color:rgba(140,160,210,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 16px 34px rgba(0,0,0,.6)}
/* sheen sweep across the face on hover */
.btn-glass::after{content:'';position:absolute;top:0;left:-70%;width:48%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);transition:left .6s ease}
.btn-glass:hover::after{left:135%}
.btn-sm{padding:11px 20px;font-size:14px;min-height:0}
/* secondary / ghost variant (kept for inner pages) */
.btn-glass.btn-ghost{background:transparent;box-shadow:none;border:1px solid rgba(236,234,227,.24)}
.btn-glass.btn-ghost:hover{transform:translateY(-2px);background:rgba(255,255,255,.045);box-shadow:none;border-color:rgba(236,234,227,.4)}
/* gentle attention pulse on the primary CTA */
.btn-pulse{animation:pulse 3.4s ease-in-out infinite}
.btn-pulse:hover{animation-play-state:paused}
@keyframes pulse{0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 12px 34px rgba(0,0,0,.55),0 0 0 rgba(91,111,158,0)}50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 12px 34px rgba(0,0,0,.55),0 0 30px rgba(91,111,158,.26)}}
/* visible keyboard focus (accessibility) */
.btn-glass:focus-visible,.nav-links a:focus-visible,.fixcard:focus-visible,.foot-links a:focus-visible{outline:2px solid var(--meteor);outline-offset:3px}

/* ============================================================
   Hero
   Content starts near the top so headline + button sit above the
   fold on every screen; both mountain + arrowhead read behind.
   ============================================================ */
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:clamp(80px,10vh,120px) 24px 48px}
.hero-bg{position:absolute;inset:0;z-index:1;background-image:url('../img/mountain.webp');background-size:cover;background-position:center 24%;opacity:.64;-webkit-mask-image:radial-gradient(ellipse 68% 62% at 50% 40%,#000 34%,transparent 82%);mask-image:radial-gradient(ellipse 68% 62% at 50% 40%,#000 34%,transparent 82%)}
.hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(6,6,7,.24),rgba(6,6,7,.03) 42%,rgba(6,6,7,.5))}
@media(max-width:760px){.hero-bg{opacity:.8}}
.hero > :not(.hero-bg){position:relative;z-index:2}

/* entrance animation */
.anim{opacity:0;transform:translateY(26px);animation:rise 1.1s cubic-bezier(.2,.7,.2,1) forwards}
.d1{animation-delay:.05s}.d2{animation-delay:.22s}.d3{animation-delay:.38s}.d4{animation-delay:.54s}
@keyframes rise{to{opacity:1;transform:none}}

.logo-wrap{position:relative;width:min(84vw,560px);overflow:hidden;border-radius:5px;margin-bottom:16px}
.logo-wrap img{display:block;width:100%;height:auto}
.shine{position:absolute;top:0;left:0;height:100%;width:70%;background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.07) 44%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.07) 56%,transparent 100%);transform:translateX(-160%);mix-blend-mode:screen;pointer-events:none;animation:sweep 8.5s ease-in-out infinite}
@keyframes sweep{0%{transform:translateX(-160%)}24%{transform:translateX(215%)}100%{transform:translateX(215%)}}

.hero h1{font-size:clamp(40px,5.4vw,72px);margin:8px auto 16px}
.hero-eyebrow{font-family:var(--body);font-size:clamp(11px,1.2vw,13px);font-weight:600;text-transform:uppercase;letter-spacing:.26em;color:#8ea0cf;margin:0 auto 14px}
.hero-promise{font-family:var(--display);font-weight:400;font-size:clamp(21px,2.7vw,32px);color:var(--ink);max-width:36ch;margin:2px auto 18px;line-height:1.3;letter-spacing:-.01em}
.hero-terms{font-family:var(--body);font-size:clamp(14px,1.5vw,16px);color:var(--muted);max-width:60ch;margin:20px auto 0;line-height:1.6;text-align:center}
.hero-terms .hl{color:#8ea0cf;font-weight:600}
.hero-cta{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}
.scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:var(--faint);font-size:11px;letter-spacing:.3em;text-transform:uppercase}

@media(max-width:760px){
  .hero{min-height:100svh;padding:88px 22px 40px}
  .logo-wrap{width:min(70vw,340px)}
  .hero h1{font-size:clamp(38px,11vw,52px)}
  .hero-cta{flex-direction:column;width:100%;max-width:320px;margin:0 auto}
  .hero-cta .btn-glass{width:100%}
  .scroll-hint{display:none}
}
@media(max-width:430px){
  .brand .b1{font-size:20px;letter-spacing:.22em}
  .brand .b2{font-size:9px;letter-spacing:.16em}
}

/* ============================================================
   Content sections
   ============================================================ */
section.block{padding:16vh 0;border-top:1px solid var(--line)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1.1s ease,transform 1.1s ease}
.reveal.in{opacity:1;transform:none}
h2{font-size:clamp(38px,6.5vw,76px);margin:18px 0 28px;max-width:15ch}
.lede{color:var(--muted);font-size:clamp(17px,1.6vw,20px);max-width:640px;line-height:1.6}

/* Video lead-gen section */
#video .vtag{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--meteor);font-weight:600;margin:24px 0 16px}
#video .plats{display:flex;flex-wrap:wrap;gap:10px}
#video .plat{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);border-radius:22px;padding:8px 16px}
#video .avatar-note{display:inline-flex;align-items:center;gap:10px;margin-top:22px;background:linear-gradient(150deg,#101014,#08080a);border:1px solid var(--line);border-radius:26px;padding:10px 18px;font-size:15px;color:var(--ink)}
#video .avatar-note .d{width:7px;height:7px;border-radius:50%;background:var(--meteor);flex:none}
.vbtn{margin-top:44px}

/* "A thousand small cuts" pain rows */
.pain-rows{margin-top:58px;border-top:1px solid var(--line)}
.pain-row{display:grid;grid-template-columns:54px 1fr 1.1fr;gap:24px;align-items:baseline;padding:32px 0;border-bottom:1px solid var(--line);transition:padding-left .45s}
.pain-row:hover{padding-left:14px}
.pain-row .n{font-family:var(--display);font-size:20px;color:var(--faint)}
.pain-row .t{font-family:var(--display);font-size:clamp(24px,3vw,34px);color:var(--ink)}
.pain-row .d{color:var(--muted);font-size:16px;line-height:1.5}
@media(max-width:720px){.pain-row{grid-template-columns:34px 1fr}.pain-row .d{grid-column:2}}

.approach{position:relative;margin:112px 0 48px;padding-top:88px}
.approach::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,rgba(197,208,236,.7),transparent)}
.approach .label{margin-bottom:16px}
.approach h2{margin:0;max-width:24ch}

/* The offer ($999) */
#offer .offer-card{display:grid;grid-template-columns:1.6fr 1fr;margin-top:38px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:linear-gradient(160deg,#101015,#08080b)}
.offer-main{padding:clamp(26px,3.4vw,44px)}
.offer-main h3{font-family:var(--display);font-weight:400;font-size:clamp(24px,2.8vw,32px);color:var(--ink);margin-bottom:12px}
.offer-lede{color:var(--muted);font-size:clamp(15px,1.5vw,17px);line-height:1.6;max-width:52ch;margin-bottom:22px}
.offer-list{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:13px}
.offer-list li{display:flex;align-items:flex-start;gap:12px;color:var(--ink);font-size:clamp(14px,1.4vw,16px);line-height:1.4}
.offer-list li .ahead-bullet{margin-top:5px;flex:none}
.offer-note{color:var(--faint);font-size:13.5px;line-height:1.6;max-width:52ch;border-top:1px solid var(--line);padding-top:18px;margin:0}
.offer-price{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:clamp(26px,3.4vw,44px);border-left:1px solid var(--line);background:linear-gradient(180deg,rgba(91,111,158,.1),rgba(91,111,158,0))}
.offer-pk{font-size:13px;text-transform:uppercase;letter-spacing:.28em;color:var(--faint)}
.offer-pv{font-family:var(--display);font-weight:300;font-size:clamp(56px,7vw,88px);line-height:1}
.offer-price .btn-glass{margin-top:6px}
@media(max-width:760px){#offer .offer-card{grid-template-columns:1fr}.offer-price{border-left:none;border-top:1px solid var(--line)}}

/* Cards (glow-follow) */
.cards{margin-top:60px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.cards.four{grid-template-columns:repeat(2,1fr);gap:22px}
@media(max-width:820px){.cards,.cards.two{grid-template-columns:1fr}}
@media(max-width:640px){.cards.four{grid-template-columns:1fr}}
.card{position:relative;background:linear-gradient(150deg,#101014,#08080a);border:1px solid var(--line);border-radius:14px;padding:38px;overflow:hidden;transition:border-color .45s,transform .45s}
.card::before{content:'';position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(91,111,158,.16),transparent 62%);opacity:0;transition:opacity .4s;pointer-events:none}
.card:hover{border-color:rgba(140,160,210,.28);transform:translateY(-4px)}
.card:hover::before{opacity:1}
.card .cap{display:flex;align-items:center;gap:10px;position:relative}
.card .num{font-family:var(--display);font-size:15px;color:var(--faint);letter-spacing:.1em}
.card h3{font-family:var(--display);font-weight:400;font-size:30px;margin:14px 0 14px;position:relative}
.card p{color:var(--muted);font-size:15px;position:relative}

/* Fix cards use the brand blue-steel in EVERY state (no browser blue/purple) */
.fixcard,.fixcard:link,.fixcard:visited,.fixcard:hover,.fixcard:active{color:var(--meteor);text-decoration:none;display:block}
/* Fix cards stand out from the other card sets: a blue-steel border */
.fixcard{border-color:rgba(91,111,158,.45)}
.fixcard:hover{border-color:rgba(120,145,205,.75)}
.fixcard h3{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fixcard .arw{color:var(--meteor);transition:transform .3s;flex:none}
.fixcard:hover .arw{transform:translateX(5px)}
/* Bigger, brighter number + mini arrowhead on the fix cards and lead-gen cards */
.fixcard .num,#video .card .num{font-size:19px;color:#b4b3a9}
.fixcard .cap,#video .card .cap{gap:12px}
.fixcard .cap .ahead-bullet,#video .card .cap .ahead-bullet{width:11px;height:14px;opacity:.95}
#assistant .backup{margin-top:40px}

/* Ticker */
.ticker{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin-top:54px}
.ticker-track{display:flex;white-space:nowrap;width:max-content;animation:scrollx 36s linear infinite}
.ticker-track .it{color:var(--muted);font-size:15px;display:inline-flex;align-items:center;gap:14px;padding:0 28px}
@keyframes scrollx{to{transform:translateX(-50%)}}

/* ============================================================
   ROI calculator (leak + lead-gen + combined)
   ============================================================ */
/* Taller input box = comfortable touch target; the visible track stays 3px
   via the track pseudo-elements, with the thumb centred on it. */
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;outline:none;margin-top:2px;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:3px;background:var(--line);border-radius:3px}
input[type=range]::-moz-range-track{height:3px;background:var(--line);border-radius:3px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-9.5px;border-radius:50%;background:linear-gradient(150deg,#eef0f4,#8a8d96);cursor:pointer;border:3px solid var(--bg);box-shadow:0 2px 8px rgba(0,0,0,.6)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#dfe1e7;cursor:pointer;border:3px solid var(--bg)}
input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px rgba(91,111,158,.6)}

#proof .roi-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:40px}
#proof .roi-card{background:linear-gradient(160deg,#101319,#0b0c10);border:1px solid var(--line);border-radius:16px;padding:26px 24px}
#proof .roi-kh{font-family:var(--display);font-size:22px;font-weight:500;margin-bottom:4px}
#proof .roi-kh.roi-leak{color:#C98A86}
#proof .roi-kh.roi-gain{color:#8FB89C}
#proof .roi-khs{font-size:13px;color:var(--faint);margin-bottom:22px}
#proof .roi-field{margin-bottom:22px}
#proof .roi-field:last-child{margin-bottom:0}
#proof .roi-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
#proof .roi-field label{font-size:14px;color:var(--muted)}
#proof .roi-val{font-family:var(--display);font-size:22px;color:var(--ink)}
#proof .roi-hint{font-size:12px;color:var(--faint);margin-top:8px}
#proof .roi-nudge{text-align:center;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:26px 0 2px}
#proof .roi-results{margin-top:18px;background:linear-gradient(160deg,#101319,#0b0c10);border:1px solid var(--line);border-radius:16px;padding:30px 28px}
#proof .roi-rgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px}
#proof .roi-rlabel{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
#proof .roi-rnum{font-family:var(--display);font-size:clamp(26px,4vw,38px);line-height:1}
#proof .roi-rnum.roi-warn{color:#C98A86}
#proof .roi-rnum.roi-recover{color:#8FB89C}
#proof .roi-rnum.roi-gaintxt{color:var(--meteor)}
#proof .roi-rsmall{font-size:12.5px;color:var(--faint);margin-top:6px}
#proof .roi-total{border-top:1px solid var(--line);padding-top:24px;text-align:center}
#proof .roi-tlabel{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
#proof .roi-tnum{font-family:var(--display);font-weight:500;font-size:clamp(44px,9vw,76px);line-height:1;padding-bottom:.06em}
#proof .roi-tsent{font-size:15px;color:var(--muted);margin-top:12px}
#proof .roi-tsent b{color:var(--ink);font-weight:500}
#proof .roi-disc{font-size:12px;color:var(--faint);text-align:center;margin-top:22px;max-width:62ch;margin-left:auto;margin-right:auto}
@media(max-width:720px){#proof .roi-grid,#proof .roi-rgrid{grid-template-columns:1fr}}

/* ============================================================
   Accordion FAQ, shared by the homepage teaser + assessment page
   ============================================================ */
.faq{margin-top:52px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:24px 4px}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;font-family:var(--display);font-size:clamp(20px,2.1vw,24px);color:var(--ink);line-height:1.3;transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:var(--display);font-weight:300;font-size:32px;color:var(--meteor);transition:transform .35s ease;flex:none;line-height:1}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--metal1)}
.faq summary:focus-visible{outline:2px solid var(--meteor);outline-offset:4px}
.faq .ans{color:var(--muted);font-size:16px;max-width:760px;line-height:1.65;margin-top:14px;padding-right:40px}
.faq .ans b{color:var(--ink);font-weight:500}
.faq-seeall{display:inline-block;margin-top:34px;color:var(--meteor);text-decoration:none;font-weight:500;font-size:15px;letter-spacing:.01em;transition:opacity .3s}
.faq-seeall:hover{opacity:.75}
.faq-seeall:focus-visible{outline:2px solid var(--meteor);outline-offset:3px}

/* ============================================================
   Close / "The edge"
   Compact so the Book button is always in view.
   ============================================================ */
.edge{position:relative;text-align:center;padding:4vh 24px;border-top:1px solid var(--line);scroll-margin-top:60px}
.edge-bg{position:absolute;inset:0;z-index:0;background-image:url('../img/mountain.webp');background-size:cover;background-position:center 24%;opacity:.64;-webkit-mask-image:radial-gradient(ellipse 54% 72% at 50% 44%,#000 30%,transparent 78%);mask-image:radial-gradient(ellipse 54% 72% at 50% 44%,#000 30%,transparent 78%)}
.edge-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(6,6,7,.5),rgba(6,6,7,.3) 38%,rgba(6,6,7,.88))}
.edge > :not(.edge-bg){position:relative;z-index:2}
.ahead-stage{perspective:1100px;width:118px;max-width:64vw;margin:4px auto 2px}
.ahead-float{position:relative;animation:float 6.5s ease-in-out infinite;transform-style:preserve-3d}
.ahead-tilt{position:relative;transition:transform .3s ease;transform-style:preserve-3d}
.ahead-tilt img{display:block;width:100%;height:auto;position:relative;z-index:2}
.ahead-glow{position:absolute;inset:-32% -45%;z-index:1;background:radial-gradient(ellipse 48% 56% at 50% 50%,rgba(6,6,7,.60),rgba(6,6,7,.26) 55%,transparent 76%);filter:blur(26px)}
.ahead-shine{position:absolute;top:0;left:0;height:100%;width:62%;z-index:3;background:linear-gradient(105deg,transparent,rgba(255,255,255,.15) 50%,transparent);mix-blend-mode:screen;transform:translateX(-150%);animation:sweep 7s ease-in-out infinite;pointer-events:none}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.edge h2{font-size:clamp(28px,3.8vw,44px);line-height:1.12;margin:14px auto 0;max-width:20ch}
.guarantee{color:var(--muted);font-size:17px;max-width:560px;margin:22px auto 36px;line-height:1.6;text-wrap:balance}
.guarantee b{color:var(--ink);font-weight:500}

/* ============================================================
   Footer (shared)
   ============================================================ */
footer{border-top:1px solid var(--line);padding:60px 0 70px;color:var(--faint)}
.foot-grid{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px}
.foot-grid a{color:var(--muted);text-decoration:none;font-size:14px;transition:color .3s}
.foot-grid a:hover{color:var(--ink)}
.foot-links{display:flex;gap:28px;justify-content:flex-end}
.foot-note{font-size:12px;margin-top:10px;max-width:430px;line-height:1.6}

/* ============================================================
   Chat bubble + booking placeholder toast (GoHighLevel)
   ============================================================ */
.chat-bubble{position:fixed;bottom:26px;right:26px;z-index:60;display:flex;align-items:center;gap:10px;border-radius:40px;padding:14px 22px;font-size:14px;font-weight:500;cursor:pointer;color:#f2f1ec;font-family:var(--body);background:linear-gradient(150deg,#23232a,#0a0a0c);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 34px rgba(0,0,0,.6);transition:transform .3s}
.chat-bubble:hover{transform:translateY(-2px)}
@media(max-width:760px){.chat-bubble{bottom:18px;right:14px;padding:10px 16px;font-size:13px}}

.kut-toast{position:fixed;left:50%;bottom:32px;transform:translate(-50%,20px);z-index:80;max-width:min(90vw,420px);background:linear-gradient(150deg,#16171c,#0b0b0e);border:1px solid rgba(140,160,210,.28);color:var(--ink);font-size:14px;line-height:1.5;padding:14px 18px;border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.kut-toast.show{opacity:1;transform:translate(-50%,0)}
.kut-toast b{color:var(--meteor);font-weight:600}

/* ============================================================
   Reduced motion
   ============================================================ */
@media(prefers-reduced-motion:reduce){
  .reveal,.anim{opacity:1;transform:none;transition:none;animation:none}
  .shine,.glow,.ticker-track,.btn-pulse,.ahead-float,.ahead-shine{animation:none}
  .shine,.ahead-shine{opacity:0}
  html{scroll-behavior:auto}
}

/* ============================================================
   CTA ladder, "or" divider + free Growth Sprint button
   Secondary offer sitting under the primary Book button
   (hero + close). Lighter/ghost than .btn-glass.
   ============================================================ */
.or-line{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;max-width:300px;margin:18px auto}
.or-line::before,.or-line::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(197,208,236,.28),transparent)}
.or-line span{color:var(--faint);font-family:var(--body);font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase}

/* Ghost/outline button, lighter than .btn-glass, rounded pill */
.btn-free{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px;
  min-height:44px;                                   /* touch target */
  background:rgba(255,255,255,.03);
  border:1px solid rgba(197,208,236,.28);
  color:var(--ink);font-family:var(--body);font-weight:500;font-size:15px;letter-spacing:.02em;
  padding:12px 24px;border-radius:40px;cursor:pointer;text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .35s,background .25s,box-shadow .25s;
}
.btn-free:hover{transform:translateY(-2px);background:rgba(255,255,255,.06);border-color:rgba(140,160,210,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 12px 28px rgba(0,0,0,.42)}
.btn-free:focus-visible{outline:2px solid var(--meteor);outline-offset:3px}
.btn-free .arw{color:var(--meteor);transition:transform .3s;flex:none}
.btn-free:hover .arw{transform:translateX(4px)}

/* Small glowing "Free" badge inside the sprint button */
.free-pill{
  display:inline-flex;align-items:center;
  font-family:var(--body);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:#dfe6f6;
  background:linear-gradient(180deg,rgba(91,111,158,.5),rgba(91,111,158,.22));
  border:1px solid rgba(142,160,207,.6);
  padding:3px 10px;border-radius:20px;
  box-shadow:0 0 14px rgba(91,111,158,.45),inset 0 1px 0 rgba(255,255,255,.18);
  animation:freeglow 3s ease-in-out infinite;
}
@keyframes freeglow{0%,100%{box-shadow:0 0 10px rgba(91,111,158,.35),inset 0 1px 0 rgba(255,255,255,.18)}50%{box-shadow:0 0 20px rgba(91,111,158,.65),inset 0 1px 0 rgba(255,255,255,.18)}}
@media(prefers-reduced-motion:reduce){.btn-free{transition:none}.free-pill{animation:none}}

/* Quiet supporting line under the free Growth Sprint button */
.free-note{color:var(--faint);font-size:13px;line-height:1.5;max-width:46ch;margin:12px auto 0;text-align:center}

/* Mobile CTA polish: make the hero buttons hug their text and center, matching the
   cleaner even look of the close section, so the price button stays on one line
   instead of being forced to a fixed width and wrapping. Headline stays on one line. */
@media(max-width:760px){
  .hero .hero-cta{max-width:none;width:auto}
  .hero .hero-cta .btn-glass{width:auto}
  .hero h1{font-size:clamp(31px,9.4vw,52px);text-wrap:balance}
  /* Give the Free button text more room on phones so "Book the 15-minute" fits
     on one line, and both buttons wrap identically to two even lines. */
  .btn-free{font-size:14px;padding:12px 16px;gap:9px}
}
/* Balance the hero terms line so "it's free." never orphans on its own line.
   .brm forces an even break on phones only (hidden on desktop). */
.hero-terms{text-wrap:balance}
.brm{display:none}
@media(max-width:760px){ .brm{display:inline} }

/* ============================================================
   Nav tap-to-call phone button
   Desktop variant (.nav-phone-d) sits just left of the Book button
   inside nav-links; mobile variant (.nav-phone-m) stays in the top bar.
   ============================================================ */
.nav-phone,.nav-links a.nav-phone{
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(111,134,189,.5);
  color:#6f86bd;font-family:var(--body);font-weight:600;font-size:15px;line-height:1;
  padding:8px 16px;border-radius:7px;text-decoration:none;white-space:nowrap;
  transition:border-color .3s,color .3s;
}
.nav-phone:hover,.nav-links a.nav-phone:hover{border-color:rgba(111,134,189,.8);color:#6f86bd}
.nav-phone:focus-visible{outline:2px solid var(--meteor);outline-offset:3px}
.nav-phone-m{display:none}
@media(max-width:760px){
  .nav-links a.nav-phone-d{display:none}
  .nav-phone-m{display:inline-flex;margin-left:auto;margin-right:12px;padding:7px 13px;font-size:14px}
}

/* ============================================================
   Footer: one row. Brand on the left, then contact + links + domain.
   ============================================================ */
.foot-grid{align-items:center}
.foot-links{align-items:center;gap:22px;flex-wrap:wrap;justify-content:flex-end}
.foot-links a.foot-phone{color:#6f86bd;font-weight:700}
.foot-links a.foot-phone:hover{color:#8ea0cf}
.foot-links a.foot-note{font-size:14px;margin-top:0;max-width:none}
@media(max-width:760px){
  .foot-grid{flex-direction:column;align-items:center;text-align:center;gap:16px}
  .foot-links{justify-content:center;gap:12px 20px}
  .nav-phone-m{font-size:12px;padding:5px 9px;margin-right:10px}
}

/* Cleaner tap feedback on iOS */
a,button,.btn-glass,.btn-free,.nav-phone,.chat-bubble{-webkit-tap-highlight-color:transparent}
