/* ============================================================
   KUT Consulting, inner-page components (Assessment + FAQ)
   Loaded in ADDITION to styles.css. Uses the same brand tokens.
   ============================================================ */

/* Larger primary button for landing-style pages (same one style, bigger) */
.btn-lg{padding:20px 38px;font-size:17px}

/* Inner-page section wrapper (kept separate from the homepage's .block
   so homepage-specific h2 rules don't leak in) */
.sec{padding:14vh 0;border-top:1px solid var(--line)}
.sec .lede{margin-top:4px}
.eyebrow{display:flex;align-items:center;gap:12px}

/* Section headings on inner pages: silver, roomy, no clipped descenders */
.sec h2,.subhero h1,.guarantee-block h2,.price-final h2,.closer .slogan{
  line-height:1.12;padding-bottom:.08em;max-width:none;
}
.sec h2{font-size:clamp(29px,4.4vw,54px);margin:16px 0 22px;max-width:24ch;text-wrap:balance}

/* ---------- Sub-page hero ---------- */
.subhero{position:relative;min-height:82vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:clamp(80px,9vh,104px) 24px 52px}
.subhero .eyebrow{justify-content:center;margin-bottom:22px;color:#8ea0cf}
.subhero-logo{width:clamp(214px,33vw,338px);max-width:86vw;margin:0 auto 22px;line-height:0}
.subhero-logo img{display:block;width:100%;height:auto}
.subhero h1{font-size:clamp(40px,6.2vw,80px);max-width:24ch;margin:0 auto 22px}
.subhero .sub{color:var(--muted);font-size:clamp(16px,1.6vw,19px);max-width:640px;margin:0 auto 16px;line-height:1.65}
.subhero .guarantee{color:var(--muted);font-size:14.5px;margin:0 auto 18px;max-width:520px;line-height:1.65;text-wrap:balance}
.subhero .guarantee b{color:var(--ink);font-weight:500}

/* Price chip (hero) */
.price-card{display:inline-flex;flex-direction:column;align-items:center;gap:6px;padding:22px 50px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(150deg,rgba(20,20,26,.7),rgba(8,8,10,.7));box-shadow:0 30px 80px rgba(0,0,0,.5);margin-bottom:18px}
.price-card .pk{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--faint)}
.price-card .pv{font-family:var(--display);font-weight:500;font-size:clamp(54px,7vw,76px);line-height:1}
.price-card .pn{color:var(--muted);font-size:14px;margin-top:4px}
.price-card .pn b{color:var(--ink);font-weight:500}

/* ---------- Deliverable buckets ---------- */
.buckets{margin-top:60px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:880px){.buckets{grid-template-columns:1fr}}
.bucket{position:relative;background:linear-gradient(150deg,#101014,#08080a);border:1px solid var(--line);border-radius:14px;padding:34px 30px 30px;overflow:hidden;transition:border-color .45s,transform .45s}
.bucket::before{content:'';position:absolute;inset:0;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),rgba(91,111,158,.13),transparent 62%);opacity:0;transition:opacity .4s;pointer-events:none}
.bucket:hover{border-color:rgba(140,160,210,.28);transform:translateY(-4px)}
.bucket:hover::before{opacity:1}
.bucket .bk{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--meteor);margin-bottom:14px;display:flex;align-items:center;gap:10px;position:relative}
.bucket h3{font-family:var(--display);font-weight:400;font-size:26px;margin-bottom:18px;position:relative}
.bucket ul{list-style:none;position:relative}
.bucket li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--line);color:var(--ink);font-size:15.5px;line-height:1.45}
.bucket li:first-child{border-top:0;padding-top:0}
.bucket li .lbb{margin-top:9px}
.bucket li b{display:block;font-family:var(--display);font-weight:400;font-size:18px;color:var(--ink);margin-bottom:2px}
.bucket li span{color:var(--muted);font-size:14px;line-height:1.5}

/* ---------- Process steps ---------- */
.steps{margin-top:56px}
.step{display:grid;grid-template-columns:60px 1fr auto;gap:30px;align-items:baseline;padding:34px 0;border-top:1px solid var(--line);transition:padding-left .45s}
.step:last-child{border-bottom:1px solid var(--line)}
.step:hover{padding-left:14px}
.step .n{font-family:var(--display);font-size:30px;color:var(--meteor)}
.step .body h3{font-family:var(--display);font-weight:400;font-size:clamp(24px,2.6vw,30px);color:var(--ink);margin-bottom:8px;line-height:1.2}
.step .body p{color:var(--muted);font-size:15.5px;max-width:680px}
.step .body p b{color:var(--ink);font-weight:500}
.step .tag{font-size:13px;color:var(--meteor);letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;font-weight:500}
@media(max-width:720px){.step{grid-template-columns:40px 1fr}.step .tag{grid-column:2;margin-top:6px;letter-spacing:.12em}}

/* ---------- Guarantee moment ---------- */
.guarantee-block{text-align:center;padding:16vh 24px;border-top:1px solid var(--line)}
.guarantee-block .eyebrow{justify-content:center;margin-bottom:18px}
.guarantee-block h2{font-size:clamp(32px,4.8vw,58px);margin:0 auto 22px;max-width:34ch}
.guarantee-block p{color:var(--muted);font-size:17px;max-width:620px;margin:0 auto;line-height:1.65}

/* ---------- KUT vs DIY ---------- */
.vs{margin-top:56px;display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media(max-width:820px){.vs{grid-template-columns:1fr}}
.col{position:relative;border:1px solid var(--line);border-radius:14px;padding:36px 32px;background:linear-gradient(150deg,rgba(18,18,22,.55),rgba(8,8,10,.55))}
.col.kut{border-color:rgba(91,111,158,.36);box-shadow:inset 0 0 50px rgba(91,111,158,.05)}
.col .ch{font-family:var(--display);font-size:24px;margin-bottom:18px}
.col.kut .ch{color:var(--metal1)}
.col .ch .pill{display:inline-block;font-family:var(--body);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--meteor);border:1px solid rgba(91,111,158,.36);padding:3px 10px;border-radius:40px;vertical-align:middle;margin-left:10px}
.col ul{list-style:none}
.col li{display:flex;gap:12px;padding:11px 0;border-top:1px solid var(--line);color:var(--ink);font-size:15.5px;line-height:1.4}
.col li:first-child{border-top:0;padding-top:0}
.col li .lbb{margin-top:9px}
.col.diy li{color:var(--muted)}

/* ---------- Pricing recap ---------- */
.price-final{margin-top:44px;position:relative;background:linear-gradient(150deg,#11111a,#06060a);border:1px solid rgba(91,111,158,.32);border-radius:18px;padding:52px 48px;display:grid;grid-template-columns:1.05fr 1fr;gap:46px;align-items:center;box-shadow:0 40px 100px rgba(0,0,0,.6)}
@media(max-width:820px){.price-final{grid-template-columns:1fr;padding:38px 30px;gap:30px}}
.price-final h2{font-size:clamp(30px,4.2vw,50px);margin:0 0 14px;max-width:14ch}
.price-final .ps{color:var(--muted);font-size:15.5px;max-width:440px;line-height:1.6}
.price-final .incl{list-style:none;margin-top:22px}
.price-final .incl li{display:flex;gap:12px;padding:9px 0;color:var(--ink);font-size:15px;line-height:1.45}
.price-final .incl li .lbb{margin-top:9px}
.pf-right{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.pf-right .pk{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--faint)}
.pf-right .pv{font-family:var(--display);font-weight:500;font-size:clamp(66px,9vw,96px);line-height:1}
.pf-right .pn{color:var(--muted);font-size:14px}
.pf-right .pn b{color:var(--ink);font-weight:500}
.pf-right .note{font-size:12.5px;color:var(--faint);margin-top:6px;max-width:24ch}

/* ---------- Closer ---------- */
.closer{text-align:center;padding:14vh 24px 17vh;border-top:1px solid var(--line)}
.closer .eyebrow{justify-content:center;margin-bottom:34px}
.closer .btn-lg{margin-bottom:30px;padding:22px 44px;font-size:18px}
.closer .slogan{font-family:var(--display);font-weight:300;font-size:clamp(38px,5.4vw,64px);line-height:1.14;margin:0 auto;letter-spacing:-.01em;max-width:22ch}
/* "KUT DEEP", set apart from the two setup lines as the payoff:
   own line, breathing room above, wide engraved-caps tracking,
   a brighter silver, a whisper of blue-steel glow, and a slow
   light-glint that sweeps across the letters (same feel as the
   hero logo). Two clipped background layers: a moving highlight
   band over the fixed brushed-silver base. */
.closer .slogan .kut-deep{
  display:block;
  margin-top:.38em;
  font-weight:600;
  font-size:1.34em;
  letter-spacing:.2em;
  padding-left:.2em;                 /* offsets the trailing tracking so it stays centred */
  padding-bottom:.1em;
  background-image:
    linear-gradient(100deg, transparent 34%, rgba(255,255,255,.55) 45%, #ffffff 50%, rgba(255,255,255,.55) 55%, transparent 66%),
    linear-gradient(180deg,#e8eaf0,#a8acb7 56%,#7a7e88);   /* mid brushed-silver base so the glint pops */
  background-size:230% 100%, 100% 100%;
  background-position:170% 0, 0 0;   /* glint parked off to the right */
  background-repeat:no-repeat;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 0 24px rgba(91,111,158,.28));
  animation:kutShine 4s ease-in-out infinite;
}
@keyframes kutShine{
  0%   {background-position:170% 0, 0 0;}   /* off-right, brief wait */
  38%  {background-position:-75% 0, 0 0;}   /* sweeps across to off-left */
  100% {background-position:-75% 0, 0 0;}   /* short hold, then loops */
}
@media(prefers-reduced-motion:reduce){
  .closer .slogan .kut-deep{animation:none;background-position:0 0,0 0}
}
.closer .sub-line{color:var(--muted);font-size:15px;margin-top:22px;max-width:520px;margin-left:auto;margin-right:auto;line-height:1.5}
.closer .sub-line b{color:var(--ink);font-weight:500}

/* ---------- Deliverable preview (shows the real doc) ---------- */
.deliv{margin-top:52px;border:1px solid rgba(91,111,158,.28);border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#0f0f16,#08080b);box-shadow:0 40px 100px rgba(0,0,0,.5)}
.deliv .dh{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:18px 26px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.015)}
.deliv .dt{font-family:var(--display);font-size:19px;color:var(--ink)}
.deliv .dt span{color:var(--meteor)}
.ex-tag{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);border:1px solid var(--line);border-radius:20px;padding:4px 12px}
.deliv-tally{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--line);background:rgba(91,111,158,.045)}
.deliv-tally .ti{flex:1 1 0;min-width:118px;padding:18px 16px;border-right:1px solid var(--line);text-align:center}
.deliv-tally .ti:last-child{border-right:none}
.deliv-tally .tn{font-family:var(--display);font-weight:500;font-size:clamp(24px,3vw,34px);line-height:1;font-variant-numeric:tabular-nums}
.deliv-tally .tn.pos{color:#a9dcc4}
.deliv-tally .tl{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-top:7px}
@media(max-width:560px){
  .deliv-tally{display:grid;grid-template-columns:1fr 1fr}
  .deliv-tally .ti{flex:none;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
  .deliv-tally .ti:nth-child(2n){border-right:none}
  .deliv-tally .ti:last-child{grid-column:1/-1;border-right:none;border-bottom:none}
}
.dblock{padding:30px 26px;border-bottom:1px solid var(--line)}
.dblock:last-child{border-bottom:none}
.dbl{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--meteor);margin-bottom:18px;display:flex;align-items:center;gap:10px}
.dbl .dpg{color:var(--faint);margin-left:auto;letter-spacing:.14em}
.ex-cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.ex-cols .exl{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}
.ex-cols p{font-size:15px;color:var(--ink);line-height:1.5}
.ex-stat{display:flex;gap:34px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line);flex-wrap:wrap}
.ex-stat .num{font-family:var(--display);font-weight:500;font-size:clamp(28px,4vw,44px);line-height:1;font-variant-numeric:tabular-nums}
.ex-stat .c{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-top:6px}
.pm{display:grid;grid-template-columns:auto 1fr;gap:14px}
.pm-yl{writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);align-self:center}
.pm-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:11px}
.pm .q{border:1px solid var(--line);border-radius:12px;padding:16px;min-height:104px;display:flex;flex-direction:column;gap:5px}
.pm .q .qt{font-family:var(--display);font-size:18px;color:var(--ink)}
.pm .q .qd{font-size:12px;color:var(--faint);line-height:1.4}
.pm .q.win{border-color:var(--meteor);background:linear-gradient(155deg,rgba(91,111,158,.22),rgba(91,111,158,.03))}
.pm .q .dots{display:flex;gap:5px;margin-top:auto}
.pm .q .dots i{width:7px;height:7px;border-radius:50%;background:rgba(91,111,158,.4)}
.pm .q.win .dots i{background:var(--meteor)}
.pm-xl{text-align:center;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-top:8px}
.qw .qwr{display:grid;grid-template-columns:26px 1fr auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.qw .qwr:last-child{border-bottom:none}
.qwn{font-family:var(--display);color:var(--meteor);font-size:15px}
.qwt{color:var(--ink);font-size:15px}
.qwt .lk{filter:blur(5px);color:var(--muted);user-select:none}
.qwv{font-size:12.5px;color:#7fc7a6;white-space:nowrap;font-variant-numeric:tabular-nums}
.qwv.blur{filter:blur(4px)}
.lockchip{display:inline-flex;align-items:center;gap:7px;margin-top:16px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--meteor);border:1px solid rgba(91,111,158,.4);border-radius:22px;padding:5px 13px}
.lockchip svg{width:12px;height:12px}
.fin{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px;align-items:start}
.fin .fc{border:1px solid var(--line);border-radius:13px;padding:18px 18px}
.fin .fc.fc-primary{border-color:rgba(91,111,158,.4);background:linear-gradient(155deg,rgba(91,111,158,.14),transparent)}
.fin .fc .fl{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:10px}
.fin .fc .fv{font-family:var(--display);font-weight:500;font-size:clamp(28px,4.4vw,46px);line-height:1;font-variant-numeric:tabular-nums}
.fin .fc .fv.pos{color:#a9dcc4}
.fin .fc .fs{font-size:11.5px;color:var(--muted);margin-top:8px}
.fin .fc .fs.lk{filter:blur(4px)}
.dfind{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.dfind .fl2{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-bottom:10px}
.dfind .fr{display:flex;gap:11px;align-items:flex-start;padding:7px 0;color:var(--ink);font-size:14.5px;line-height:1.4}
.dfind .fr .fb{margin-top:7px;flex:none}
.dfind .fr .lk{filter:blur(5px);color:var(--muted);user-select:none}
.deliv-note{margin-top:24px;font-size:13.5px;color:var(--faint);max-width:70ch;line-height:1.6}
.deliv-note b{color:var(--ink);font-weight:500}
@media(max-width:820px){.ex-cols,.fin{grid-template-columns:1fr}.pm{grid-template-columns:1fr}.pm-yl{display:none}}
@media(max-width:560px){.pm-grid{grid-template-columns:1fr}}

/* (Accordion FAQ styles live in styles.css, shared by the homepage teaser too) */

/* ---------- Answer-first Q&A list (dedicated FAQ page) ---------- */
.qa-list{margin-top:48px;border-top:1px solid var(--line)}
.qa{padding:36px 0;border-bottom:1px solid var(--line)}
.qa .q{display:flex;gap:14px;align-items:baseline;font-family:var(--display);font-weight:400;font-size:clamp(23px,2.6vw,32px);color:var(--ink);line-height:1.2}
.qa .q .qn{color:var(--meteor);font-size:.7em;flex:none}
.qa .a{color:var(--muted);font-size:17px;max-width:820px;line-height:1.7;margin-top:16px}
.qa .a b{color:var(--ink);font-weight:500}
.faq-end{text-align:center;padding:12vh 24px 15vh;border-top:1px solid var(--line)}
.faq-end .eyebrow{justify-content:center;margin-bottom:26px}
.faq-end .kicker{font-family:var(--display);font-weight:300;font-size:clamp(28px,3.6vw,44px);line-height:1.16;margin:0 auto 30px;max-width:20ch;padding-bottom:.08em}

/* ============================================================
   Growth Sprint landing page (single-CTA lead page)
   ============================================================ */
.sprint-cta{margin-top:34px;display:flex;flex-direction:column;align-items:center}
.sprint-cta .free-note{margin-top:16px}
.sprint-reassure{margin-top:20px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.sprint-kick{font-family:var(--display);font-weight:300;font-size:clamp(26px,3.4vw,40px);line-height:1.16;margin:0 auto 6px;max-width:22ch;padding-bottom:.08em}
/* Balance the how-it-works card text so no single word is left alone */
.sprint-steps .card p{text-wrap:balance}
/* Keep the Growth Sprint CTA on one line on phones */
@media(max-width:760px){ .sprint-cta .btn-lg{font-size:15px;padding:16px 20px} }
/* Balance the Growth Sprint hero sub + CTA notes so no lone word hangs on phones */
.sprint-sub{text-wrap:balance}
.sprint-cta .free-note{text-wrap:balance}
