/* ============================================================
   pages-2026.css — image-led components for the 2026 pages.
   Extends site.css tokens. No new fonts, no new colours.
   ============================================================ */

/* ---------- HERO: text + media ---------- */
.k-hero { position: relative; overflow: hidden; padding: clamp(120px,13vw,168px) clamp(24px,6vw,96px) clamp(48px,6vw,72px); }
.k-hero::before { content:""; position:absolute; inset:0; z-index:0;
  background: radial-gradient(42% 55% at 16% 22%, rgba(238,77,31,.13), transparent 70%),
              radial-gradient(46% 58% at 84% 18%, rgba(35,55,241,.15), transparent 72%); }
.k-hero__in { position:relative; z-index:2; max-width:1240px; margin:0 auto;
  display:grid; grid-template-columns:1fr; gap:44px; align-items:center; }
@media(min-width:980px){ .k-hero__in { grid-template-columns:1.04fr .96fr; gap:60px; } }
.k-hero h1 { font-family:var(--font-display); font-weight:400; letter-spacing:-.028em; line-height:1.02;
  font-size:clamp(40px,5.6vw,74px); color:var(--fg-1); }
.k-hero h1 em { font-style:italic; background:var(--kit-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.k-hero__lede { margin-top:22px; max-width:54ch; font-size:clamp(17px,1.5vw,20px); line-height:1.6; color:var(--fg-2); }
.k-hero__cta { margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.k-hero__media { position:relative; border-radius:28px; overflow:hidden; box-shadow:0 30px 80px -30px rgba(11,13,18,.45); }
.k-hero__media img { width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; display:block; }
.k-hero__media--tall img { aspect-ratio:5/6; }
.k-hero__tag { position:absolute; left:16px; bottom:16px; z-index:2; display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#fff;
  background:rgba(11,13,18,.72); backdrop-filter:blur(6px); padding:9px 14px; border-radius:999px; }
.k-hero__tag i { width:7px; height:7px; border-radius:50%; background:var(--kit-fox-500); display:block; }

/* ---------- LOGO WALL (real mastheads) ---------- */
.k-logowall { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-top:34px; }
@media(max-width:900px){ .k-logowall { grid-template-columns:repeat(3,1fr); } }
@media(max-width:560px){ .k-logowall { grid-template-columns:repeat(2,1fr); } }
.k-logo { aspect-ratio:16/7; border:1px solid var(--border); border-radius:var(--r-md); background:#fff;
  display:flex; align-items:center; justify-content:center; padding:0 14px; text-decoration:none;
  transition:transform .3s var(--ease-out), box-shadow .3s, border-color .3s; }
.k-logo:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--border-strong); }
.k-logo img { max-width:80%; max-height:58%; object-fit:contain; display:block; }
.k-logo--name { font-family:var(--font-display); font-size:clamp(15px,1.5vw,20px); color:var(--fg-2); }

/* ---------- MARQUEE (name-only outlets) ---------- */
.k-marquee { overflow:hidden; border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  background:var(--bg-sunken); padding:18px 0; margin-top:30px; }
.k-marquee__track { display:flex; gap:44px; width:max-content; animation:k-scroll 46s linear infinite; }
.k-marquee span { font-family:var(--font-display); font-size:clamp(19px,2vw,27px); color:var(--fg-2); white-space:nowrap; }
.k-marquee span i { font-style:normal; color:var(--kit-slate-300); padding-left:44px; }
@keyframes k-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@media (prefers-reduced-motion:reduce){ .k-marquee__track { animation:none; flex-wrap:wrap; width:auto; } }

/* ---------- STICKY SCROLLYTELLING (media pinned, steps scroll) ---------- */
.k-scrolly { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:36px; }
@media(min-width:980px){ .k-scrolly { grid-template-columns:.92fr 1.08fr; gap:64px; align-items:start; } }
.k-scrolly__media { position:relative; }
@media(min-width:980px){ .k-scrolly__media { position:sticky; top:110px; } }
.k-scrolly__media img { width:100%; border-radius:28px; object-fit:cover; aspect-ratio:4/5;
  box-shadow:0 30px 80px -34px rgba(11,13,18,.5); }
.k-steps { display:flex; flex-direction:column; gap:14px; }
.k-step { border:1px solid var(--border); border-radius:28px; padding:28px 30px; background:#fff;
  transition:transform .3s var(--ease-out), box-shadow .3s, border-color .3s; }
.k-step:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--border-strong); }
.k-step__n { font-family:var(--font-mono); font-size:12px; letter-spacing:.16em; color:var(--kit-fox-500); }
.k-step h3 { font-family:var(--font-display); font-weight:400; font-size:clamp(21px,2.1vw,27px); color:var(--fg-1); margin:10px 0 8px; letter-spacing:-.015em; }
.k-step p { font-size:15.5px; line-height:1.6; color:var(--fg-2); }

/* ---------- MEDIA ROWS (alternating image / text) ---------- */
.k-row { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:34px; align-items:center; padding:clamp(36px,5vw,64px) 0; }
@media(min-width:900px){ .k-row { grid-template-columns:1fr 1fr; gap:64px; } .k-row--flip .k-row__media { order:2; } }
.k-row__media img { width:100%; border-radius:28px; object-fit:cover; aspect-ratio:4/3; box-shadow:0 26px 70px -32px rgba(11,13,18,.45); }
.k-row h2 { font-family:var(--font-display); font-weight:400; letter-spacing:-.022em; line-height:1.08;
  font-size:clamp(28px,3.2vw,44px); color:var(--fg-1); }
.k-row p { margin-top:16px; font-size:16.5px; line-height:1.62; color:var(--fg-2); max-width:52ch; }
.k-row .k-chips { margin-top:22px; }

/* ---------- PHOTO CARDS ---------- */
.k-cards { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media(max-width:900px){ .k-cards { grid-template-columns:1fr; } }
.k-cards--2 { grid-template-columns:repeat(2,1fr); }
@media(max-width:900px){ .k-cards--2 { grid-template-columns:1fr; } }
.k-card { display:block; border:1px solid var(--border); border-radius:28px; overflow:hidden; background:#fff;
  text-decoration:none; transition:transform .3s var(--ease-out), box-shadow .3s, border-color .3s; }
.k-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--border-strong); }
.k-card__img { position:relative; overflow:hidden; }
.k-card__img img { width:100%; aspect-ratio:16/10; object-fit:cover; display:block; transition:transform .6s var(--ease-out); }
.k-card:hover .k-card__img img { transform:scale(1.04); }
.k-card__k { position:absolute; left:14px; top:14px; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:#fff; background:rgba(11,13,18,.7); backdrop-filter:blur(6px); padding:7px 12px; border-radius:999px; }
.k-card__b { padding:24px 26px 26px; }
.k-card__b h3 { font-family:var(--font-display); font-weight:400; font-size:24px; color:var(--fg-1); letter-spacing:-.015em; }
.k-card__b p { margin-top:9px; font-size:14.8px; line-height:1.58; color:var(--fg-2); }
.k-card__go { margin-top:16px; display:inline-block; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--kit-fox-500); }

/* ---------- CHIPS ---------- */
.k-chips { display:flex; flex-wrap:wrap; gap:9px; }
.k-chips span { font-family:var(--font-mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
  padding:9px 15px; border-radius:999px; border:1px solid var(--border-strong); color:var(--fg-2); }
.k-chips--fox span { border-color:var(--kit-fox-300); color:var(--kit-fox-700); background:var(--kit-fox-50); }

/* ---------- DARK STAT BAND ---------- */
.k-band { position:relative; overflow:hidden; background:var(--kit-ink); color:#fff;
  padding:clamp(60px,7vw,96px) clamp(24px,6vw,96px); }
.k-band__grid { position:absolute; inset:0; z-index:0; opacity:.6;
  background-image:linear-gradient(to right,rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:68px 68px;
  -webkit-mask-image:radial-gradient(ellipse 72% 82% at 50% 40%,#000,transparent 76%);
  mask-image:radial-gradient(ellipse 72% 82% at 50% 40%,#000,transparent 76%); }
.k-band__in { position:relative; z-index:1; max-width:1240px; margin:0 auto; }
.k-band h2 { font-family:var(--font-display); font-weight:400; letter-spacing:-.022em; line-height:1.06;
  font-size:clamp(30px,3.6vw,52px); color:#fff; max-width:20ch; }
.k-band h2 em { font-style:italic; background:var(--kit-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.k-band__lede { margin-top:18px; max-width:58ch; font-size:17px; line-height:1.6; color:var(--kit-slate-300); }
.k-stats { display:grid; grid-template-columns:repeat(4,1fr); margin-top:44px; border-top:1px solid #232734; }
@media(max-width:820px){ .k-stats { grid-template-columns:repeat(2,1fr); } }
.k-stat { padding:30px 26px; border-left:1px solid #232734; }
.k-stat:first-child { border-left:0; }
@media(max-width:820px){ .k-stat { border-left:0; border-top:1px solid #232734; } .k-stat:first-child { border-top:0; } }
.k-stat b { display:block; font-family:var(--font-display); font-weight:400; font-size:clamp(32px,3.4vw,52px); line-height:1; color:#fff; }
.k-stat b em { font-style:italic; background:var(--kit-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.k-stat span { display:block; margin-top:10px; font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--kit-slate-400); line-height:1.55; }

/* ---------- CTA WITH PHOTO ---------- */
.k-cta { position:relative; overflow:hidden; min-height:420px; display:flex; align-items:center;
  padding:clamp(60px,7vw,100px) clamp(24px,6vw,96px); }
.k-cta img.k-cta__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.k-cta::after { content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(100deg, rgba(11,13,18,.94) 0%, rgba(11,13,18,.82) 46%, rgba(11,13,18,.55) 100%); }
.k-cta__in { position:relative; z-index:2; max-width:1240px; margin:0 auto; width:100%; }
.k-cta h2 { font-family:var(--font-display); font-weight:400; letter-spacing:-.022em; line-height:1.05;
  font-size:clamp(30px,4vw,56px); color:#fff; max-width:18ch; }
.k-cta h2 em { font-style:italic; background:var(--kit-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.k-cta p { margin-top:18px; max-width:50ch; font-size:17px; line-height:1.6; color:var(--kit-slate-300); }
.k-cta__actions { margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- COMPARISON TABLE ---------- */
.k-tablewrap { max-width:1240px; margin:38px auto 0; overflow-x:auto; }
.k-table { width:100%; border-collapse:collapse; font-size:15px; min-width:660px; }
.k-table th, .k-table td { padding:15px 16px; text-align:center; border-bottom:1px solid var(--border); }
.k-table th:first-child, .k-table td:first-child { text-align:left; }
.k-table thead th { font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-3); }
.k-table .kt-us { background:var(--kit-ink); color:#fff; }
.k-table thead .kt-us { color:#fff; border-radius:14px 14px 0 0; }
.k-table tbody tr:last-child .kt-us { border-radius:0 0 14px 14px; }
.k-table .kt-yes { color:var(--kit-fox-300); font-weight:700; font-size:17px; }
.k-table .kt-no { color:var(--kit-slate-400); }

/* ---------- IMAGE STRIP (creator / people wall) ---------- */
.k-strip { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; max-width:1240px; margin:0 auto; }
@media(max-width:900px){ .k-strip { grid-template-columns:repeat(3,1fr); } }
.k-strip img { width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:16px; display:block; }
.k-strip img:nth-child(even) { aspect-ratio:3/4.4; }

/* ---------- SECTION HEADS ---------- */
.k-sec { max-width:1240px; margin:0 auto; padding:clamp(56px,7vw,100px) clamp(24px,6vw,96px); }
.k-head { max-width:760px; margin-bottom:clamp(30px,4vw,46px); }
.k-head--mid { margin-left:auto; margin-right:auto; text-align:center; }
.k-eyebrow { display:inline-block; margin-bottom:14px; font-family:var(--font-mono); font-size:11.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--kit-fox-500); }
.k-band .k-eyebrow, .k-cta .k-eyebrow { color:var(--kit-fox-300); }
.k-head h2 { font-family:var(--font-display); font-weight:400; letter-spacing:-.022em; line-height:1.08;
  font-size:clamp(28px,3.4vw,48px); color:var(--fg-1); }
.k-head h2 em { font-style:italic; background:var(--kit-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.k-head p { margin-top:16px; font-size:17px; line-height:1.62; color:var(--fg-2); max-width:58ch; }
.k-head--mid p { margin-left:auto; margin-right:auto; }

/* ---------- HEIGHT GUARDS: deterministic sizing regardless of source ratio ---------- */
.k-hero__media img { height:clamp(300px,40vh,460px); aspect-ratio:auto; }
.k-hero__media--tall img { height:clamp(380px,54vh,600px); }
.k-scrolly__media img { height:clamp(400px,52vh,600px); aspect-ratio:auto; }
.k-row__media img { height:clamp(260px,36vh,420px); aspect-ratio:auto; }
.k-card__img img { height:210px; aspect-ratio:auto; }
.k-strip img { height:clamp(170px,21vh,260px); aspect-ratio:auto; }
.k-strip img:nth-child(even) { aspect-ratio:auto; }

/* ---------- PRESS WALL (deck-sourced composites) ---------- */
.k-reach { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:44px; }
@media(min-width:980px){ .k-reach { grid-template-columns:1.42fr 1fr; gap:56px; } }
.k-reach__k { font-family:var(--font-mono); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--kit-fox-500); }
.k-reach__note { margin:8px 0 18px; font-size:15px; line-height:1.55; color:var(--fg-2); max-width:46ch; }
.k-reach img.k-wall { width:100%; height:auto; border-radius:18px; border:1px solid var(--border); display:block; }
.k-reach__pair { display:grid; grid-template-columns:.85fr 1.15fr; gap:14px; align-items:start; }
.k-names { margin-top:22px; display:flex; flex-wrap:wrap; gap:10px 26px; }
.k-names span { font-family:var(--font-display); font-size:clamp(15px,1.45vw,20px); color:var(--fg-2); }

/* ---------- ARTICLE COLLAGE ---------- */
.k-arts { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media(max-width:1000px){ .k-arts { grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .k-arts { grid-template-columns:1fr; } }
.k-art { position:relative; display:block; border-radius:16px; overflow:hidden; border:1px solid var(--border);
  background:#fff; text-decoration:none; transition:transform .3s var(--ease-out), box-shadow .3s; }
.k-art:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.k-art img { width:100%; height:200px; object-fit:cover; object-position:top center; display:block; }
.k-art__tag { position:absolute; left:10px; bottom:10px; font-family:var(--font-mono); font-size:10px; letter-spacing:.12em;
  text-transform:uppercase; color:#fff; background:rgba(11,13,18,.82); padding:6px 11px; border-radius:999px; }
.k-art__pub { position:absolute; right:10px; bottom:10px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.1em;
  text-transform:uppercase; color:#fff; padding:6px 10px; border-radius:999px; }
.k-art__pub--pub { background:#2337f1; }
.k-art__pub--pri { background:var(--kit-fox-500); }
.k-art--stat { display:flex; flex-direction:column; justify-content:center; padding:26px 24px; background:var(--kit-ink); border-color:#232734; }
.k-art--stat b { font-family:var(--font-display); font-weight:400; font-size:clamp(36px,4vw,54px); line-height:1; color:#fff; }
.k-art--stat span { margin-top:10px; font-size:13.5px; line-height:1.5; color:var(--kit-slate-400); }

/* ---------- HERO TRUST LINE ---------- */
.k-trust { margin-top:22px; display:flex; flex-wrap:wrap; gap:8px 22px; font-family:var(--font-mono);
  font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--fg-3); }
.k-trust b { color:var(--kit-fox-600); font-weight:500; }

/* ---------- GUARANTEE PANEL ---------- */
.k-guar { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:34px; align-items:start; }
@media(min-width:900px){ .k-guar { grid-template-columns:1fr 1fr; gap:60px; } }
.k-guar ul { list-style:none; padding:0; margin:22px 0 0; }
.k-guar li { position:relative; padding-left:30px; margin-bottom:15px; font-size:16px; line-height:1.6; color:var(--kit-slate-300); }
.k-guar li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--kit-fox-300); font-weight:700; }

/* ---------- FAQ ---------- */
.k-faq { max-width:900px; margin:0 auto; }
.k-faq details { border:1px solid var(--border); border-radius:18px; padding:0; margin-bottom:12px; background:#fff; overflow:hidden; }
.k-faq summary { cursor:pointer; list-style:none; padding:22px 26px; font-family:var(--font-display); font-weight:400;
  font-size:19px; color:var(--fg-1); display:flex; justify-content:space-between; align-items:center; gap:16px; }
.k-faq summary::-webkit-details-marker { display:none; }
.k-faq summary::after { content:"+"; font-family:var(--font-mono); font-size:20px; color:var(--kit-fox-500); flex:none; }
.k-faq details[open] summary::after { content:"–"; }
.k-faq details[open] summary { padding-bottom:10px; }
.k-faq p { padding:0 26px 24px; font-size:15.5px; line-height:1.65; color:var(--fg-2); margin:0; }

/* ---------- OUTLET NAME TILES ---------- */
.k-outlets { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
@media(max-width:1000px){ .k-outlets { grid-template-columns:repeat(3,1fr); } }
@media(max-width:620px){ .k-outlets { grid-template-columns:repeat(2,1fr); } }
.k-outlet { border:1px solid var(--border); border-radius:14px; background:#fff; min-height:74px;
  display:flex; align-items:center; justify-content:center; text-align:center; padding:14px 12px;
  font-family:var(--font-display); font-size:clamp(14px,1.35vw,18px); color:var(--fg-1); line-height:1.2;
  transition:transform .25s var(--ease-out), border-color .25s, box-shadow .25s; }
.k-outlet:hover { transform:translateY(-3px); border-color:var(--kit-fox-300); box-shadow:var(--shadow-md); }

/* ---------- BIGGER TRUST TICKS ---------- */
.k-trust { margin-top:26px; display:flex; flex-wrap:wrap; gap:10px; font-family:var(--font-mono); }
.k-trust span { display:inline-flex; align-items:center; gap:9px; font-size:13px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--fg-1); background:var(--kit-fox-50); border:1px solid var(--kit-fox-300);
  padding:12px 18px; border-radius:999px; }
.k-trust b { color:var(--kit-fox-500); font-size:15px; }
