/*
Theme Name: 100K Kids V1 Clean
Theme URI: https://100kkids.org/
Author: 100K Kids
Description: Clean-room WordPress port of the approved V1 complete design system.
Version: 1.1.0
Text Domain: 100kkids-v1-clean
*/

:root {
  --white: #ffffff;
  --paper: #ffffff;
  --ink: #171714;
  --muted: #68675f;
  --line: #dfded5;
  --kk-brand-red: #d9362b;
  --kk-brand-red-hover: #b92b23;
  --kk-brand-red-soft: #fff1ef;
  --brand: var(--kk-brand-red);
  --brand-dark: var(--kk-brand-red-hover);
  --yellow: #f6d85f;
  --blue: #6db7ff;
  --green: #99cf8a;
  --pink: #f2a2b8;
  --cream: #ffffff;
  --radius-xl: 36px;
  --radius-lg: 24px;
  --shadow-book: 0 28px 60px rgba(28, 23, 17, .18), 0 5px 14px rgba(28, 23, 17, .12);
  --shadow-soft: 0 22px 60px rgba(31, 28, 22, .09);
  --display: Georgia, "Times New Roman", serif;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--white);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img { max-width: 100%; display: block; }

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 999;
  transform: translateY(-160%);
  padding: 12px 16px;
  background: var(--ink);
  color: var(--white);
  border-radius: 8px;
}
.skip-link:focus { transform: translateY(0); }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  min-height: 76px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 30px;
  padding: 12px clamp(20px, 4.6vw, 76px);
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(23,23,20,.08);
  backdrop-filter: blur(14px);
  transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.site-header.is-scrolled { box-shadow: 0 12px 36px rgba(26,23,19,.08); }
.brand {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-weight: 900;
  letter-spacing: -.04em;
}
.brand-mark { font-size: 28px; line-height: 1; }
.brand-word { font-size: 11px; letter-spacing: .14em; }
.site-nav { display: flex; justify-content: center; gap: clamp(16px, 2.3vw, 34px); }
.site-nav a, .text-action {
  position: relative;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.site-nav a::after, .text-action::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -6px;
  height: 2px;
  background: var(--brand);
  transition: right .25s ease;
}
.site-nav a:hover::after, .site-nav a:focus-visible::after, .text-action:hover::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 18px; }
.cart-count {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  margin-left: 4px;
  border: 1px solid var(--ink);
  border-radius: 50%;
  font-size: 11px;
}
.menu-toggle { display: none; }

.button {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 22px;
  border: 2px solid transparent;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease;
}
.button:hover { transform: none; }
.button:focus-visible, .hero-arrow:focus-visible, .hero-pause:focus-visible, .hero-dot:focus-visible, .pathway-tab:focus-visible, summary:focus-visible, .menu-toggle:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}
.button--small { min-height: 42px; padding: 11px 17px; font-size: 10px; }
.button--brand { color: var(--white); background: var(--kk-brand-red); box-shadow: 0 10px 24px rgba(217,54,43,.24); }
.button--brand:hover { background: var(--kk-brand-red-hover); box-shadow: 0 14px 30px rgba(217,54,43,.3); }
.button--ink { color: var(--white); background: var(--ink); }
.button--light { color: var(--ink); background: var(--white); }
.button--outline-light { color: var(--white); border-color: rgba(255,255,255,.72); }
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-bottom: 2px solid currentColor;
  padding-bottom: 3px;
}
.text-link span { transition: transform .2s ease; }
.text-link:hover span { transform: translate(3px,-3px); }
.button-row { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; }
.eyebrow {
  margin: 0 0 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .19em;
  text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 32px; height: 2px; background: currentColor; opacity: .6; }

.hero {
  position: relative;
  min-height: 100svh;
  padding: 128px clamp(20px, 6vw, 96px) 72px;
  display: grid;
  grid-template-columns: minmax(340px, .88fr) minmax(520px, 1.12fr);
  align-items: center;
  gap: clamp(30px, 5vw, 90px);
  overflow: hidden;
  background: var(--paper);
}
.hero::after {
  content: "";
  position: absolute;
  inset: auto -8vw -27vw auto;
  width: 58vw;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(23,23,20,.08);
  pointer-events: none;
}
.hero-ambient { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .8; pointer-events: none; transition: transform .9s cubic-bezier(.2,.8,.2,1); }
.hero-ambient--yellow { width: 260px; height: 260px; right: 6vw; top: 14vh; background: rgba(246,216,95,.42); }
.hero-ambient--blue { width: 190px; height: 190px; right: 36vw; bottom: 9vh; background: rgba(109,183,255,.24); }
.hero[data-state="mission"] .hero-ambient--yellow { transform: translate(-32vw, 46vh) scale(.8); }
.hero[data-state="mission"] .hero-ambient--blue { transform: translate(28vw,-34vh) scale(1.35); }
.hero-copy { position: relative; z-index: 4; max-width: 620px; }
.hero-copy__stack { position: relative; min-height: 430px; }
.hero-story {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(22px);
  pointer-events: none;
  transition: opacity .35s ease, transform .55s cubic-bezier(.2,.8,.2,1);
}
.hero-story.is-active { opacity: 1; transform: none; pointer-events: auto; }
.hero-story h1, .hero-story h2 {
  margin: 0 0 28px;
  max-width: 760px;
  font-family: var(--display);
  font-size: clamp(58px, 6.1vw, 102px);
  line-height: .88;
  letter-spacing: -.072em;
  font-weight: 500;
}
.hero-story h2 { font-size: clamp(54px, 5.6vw, 94px); }
.hero-story p { max-width: 570px; margin: 0 0 34px; color: #45443e; font-size: clamp(16px, 1.2vw, 20px); }
.hero-controls { display: flex; align-items: center; gap: 10px; position: relative; z-index: 7; }
.hero-arrow, .hero-pause {
  min-width: 46px;
  height: 46px;
  border: 1px solid var(--ink);
  background: transparent;
  border-radius: 50%;
  cursor: pointer;
  font-weight: 900;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.hero-arrow:hover { background: var(--ink); color: var(--white); transform: rotate(-5deg); }
.hero-pause { width: auto; padding: 0 16px; border-radius: 999px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.hero-pause:hover { background: var(--yellow); }
.hero-dots { display: flex; align-items: center; gap: 8px; padding: 0 4px; }
.hero-dot { width: 28px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: #cbc9c0; cursor: pointer; transition: width .25s ease, background .25s ease; }
.hero-dot.is-active { width: 48px; background: var(--brand); }
.hero-stage {
  position: relative;
  z-index: 3;
  min-height: 660px;
  display: grid;
  place-items: center;
  perspective: 1200px;
}
.orbit { position: absolute; border: 1px solid rgba(23,23,20,.13); border-radius: 50%; transition: transform .9s cubic-bezier(.2,.8,.2,1); }
.orbit--one { width: min(46vw, 650px); aspect-ratio: 1; }
.orbit--two { width: min(35vw, 490px); aspect-ratio: 1; transform: translate(7%, -6%); border-style: dashed; opacity: .55; }
.hero[data-state="mission"] .orbit--one { transform: rotate(28deg) scale(.88) translate(-8%,3%); }
.hero[data-state="mission"] .orbit--two { transform: translate(-12%, 8%) rotate(-38deg) scale(1.08); }
.book-scene {
  position: relative;
  width: min(50vw, 720px);
  height: 520px;
  transform-style: preserve-3d;
  transition: transform .4s ease-out;
}
.book {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 218px;
  aspect-ratio: .69;
  padding: 28px 21px 24px 29px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  border: 1px solid rgba(23,23,20,.18);
  border-radius: 4px 13px 13px 4px;
  box-shadow: var(--shadow-book);
  transform-style: preserve-3d;
  transition: transform .82s cubic-bezier(.2,.85,.22,1), filter .5s ease, opacity .5s ease;
  will-change: transform;
}
.book::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(255,255,255,.32), transparent 28%, transparent 72%, rgba(0,0,0,.08)); pointer-events: none; }
.book-spine { position: absolute; left: 0; top: 0; bottom: 0; width: 15px; background: rgba(0,0,0,.13); border-right: 1px solid rgba(255,255,255,.25); }
.book-kicker { position: relative; z-index: 1; font-size: 8px; font-weight: 900; letter-spacing: .12em; }
.book strong { position: relative; z-index: 1; font-family: var(--display); font-size: 38px; line-height: .82; letter-spacing: -.05em; font-weight: 500; }
.book small { position: relative; z-index: 1; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.book--sun { background: var(--yellow); }
.book--blue { background: var(--blue); }
.book--orange { background: #ff6b35; color: #13264b; }
.book--green { background: var(--green); }
.book--pink { background: var(--pink); }
.hero[data-state="group"] .book--a { transform: translate(-155%,-45%) rotate(-20deg) translateZ(-110px); }
.hero[data-state="group"] .book--b { transform: translate(-95%,-58%) rotate(-9deg) translateZ(-45px); }
.hero[data-state="group"] .book--hero { transform: translate(-49%,-58%) rotate(2deg) translateZ(65px) scale(1.07); z-index: 6; }
.hero[data-state="group"] .book--c { transform: translate(5%,-54%) rotate(12deg) translateZ(-25px); }
.hero[data-state="group"] .book--d { transform: translate(58%,-39%) rotate(23deg) translateZ(-95px); }
.hero[data-state="mission"] .book--a { transform: translate(-106%,-72%) rotate(-5deg) translateZ(-120px) scale(.86); }
.hero[data-state="mission"] .book--b { transform: translate(-78%,-54%) rotate(-1deg) translateZ(-42px) scale(.92); }
.hero[data-state="mission"] .book--hero { transform: translate(-50%,-33%) rotate(0deg) translateZ(78px) scale(1.02); z-index: 6; }
.hero[data-state="mission"] .book--c { transform: translate(-21%,-54%) rotate(2deg) translateZ(-32px) scale(.92); }
.hero[data-state="mission"] .book--d { transform: translate(5%,-72%) rotate(6deg) translateZ(-120px) scale(.86); }
.hero[data-state="mission"] .book { filter: saturate(.95); }
.hero-box {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 68%;
  width: 360px;
  height: 160px;
  background: #efc58f;
  border: 1px solid rgba(23,23,20,.2);
  transform: translate(-50%,12%) rotateX(8deg) scale(.86);
  opacity: .15;
  transition: opacity .45s ease, transform .82s cubic-bezier(.2,.85,.22,1);
}
.hero[data-state="mission"] .hero-box { opacity: 1; transform: translate(-50%,-2%) rotateX(8deg) scale(1); }
.hero-box__flap { position: absolute; top: -70px; width: 54%; height: 72px; background: #f3d3a8; border: 1px solid rgba(23,23,20,.18); transform-origin: bottom; }
.hero-box__flap--left { left: -1px; transform: skewX(-18deg); }
.hero-box__flap--right { right: -1px; transform: skewX(18deg); }
.hero-box__label { position: absolute; right: 24px; bottom: 18px; font-size: 12px; font-weight: 900; letter-spacing: .14em; }
.route-line { position: absolute; left: 50%; top: 62%; width: 72%; display: flex; align-items: center; justify-content: space-between; opacity: 0; transform: translateX(-50%) scaleX(.65); transition: opacity .4s ease, transform .75s ease; }
.route-line::before { content: ""; position: absolute; left: 0; right: 0; height: 2px; border-top: 2px dashed var(--brand); }
.route-line span { position: relative; z-index: 1; width: 11px; height: 11px; background: var(--white); border: 3px solid var(--brand); border-radius: 50%; }
.hero[data-state="mission"] .route-line { opacity: 1; transform: translateX(-50%) scaleX(1); }
.stage-caption { position: absolute; left: 10%; right: 2%; bottom: 48px; display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.stage-caption i { height: 1px; background: rgba(23,23,20,.25); }
.stage-caption strong { font-size: 9px; }
.scroll-cue { position: absolute; left: clamp(20px,6vw,96px); bottom: 28px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.scroll-cue span { display: inline-block; margin-left: 8px; animation: bounce 1.7s ease-in-out infinite; }
@keyframes bounce { 0%,100% { transform: translateY(-2px); } 50% { transform: translateY(6px); } }

.book-drop { padding: 120px clamp(20px,5vw,80px) 130px; background: var(--white); }
.section-intro { display: grid; grid-template-columns: 1fr 1.15fr .85fr; gap: 40px; align-items: end; margin-bottom: 70px; }
.section-intro .eyebrow { align-self: start; }
.section-intro h2, .pathways-head h2, .how-title-wrap h2, .missions h2, .audiences h2, .about-strip h2, .faq h2, .final-cta h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(48px, 5.2vw, 84px);
  font-weight: 500;
  line-height: .94;
  letter-spacing: -.055em;
}
.section-intro > p:last-child { margin: 0; color: var(--muted); font-size: 18px; }
.book-rail { display: grid; grid-template-columns: repeat(4, minmax(240px,1fr)); gap: 22px; }
.book-card {
  min-height: 570px;
  display: grid;
  grid-template-rows: 1fr auto;
  padding: 24px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  cursor: pointer;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
  transform-style: preserve-3d;
}
.book-card:hover, .book-card:focus-visible { transform: translateY(-14px) rotate(-1.25deg); box-shadow: var(--shadow-soft); outline: 0; }
.book-card--orange { background: #ffd3c8; }
.book-card--yellow { background: #f9edaa; }
.book-card--blue { background: #cce7ff; }
.book-card--green { background: #d9efcf; }
.mini-book {
  width: min(82%, 250px);
  aspect-ratio: .69;
  margin: 10px auto 30px;
  padding: 30px 22px 22px 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #ff6b35;
  color: #13264b;
  border-radius: 3px 12px 12px 3px;
  border: 1px solid rgba(23,23,20,.2);
  box-shadow: var(--shadow-book);
  transform: rotate(-5deg);
  transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
.book-card:hover .mini-book, .book-card:focus-visible .mini-book { transform: rotate(4deg) translateY(-5px) scale(1.03); }
.mini-book__stripe { font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.mini-book strong { font-family: var(--display); font-size: 38px; line-height: .85; font-weight: 500; }
.mini-book small { font-size: 9px; font-weight: 800; text-transform: uppercase; }
.mini-book--abstract { position: relative; overflow: hidden; color: var(--ink); background: var(--white); }
.mini-book--abstract strong { position: relative; z-index: 2; }
.shape { position: absolute; pointer-events: none; }
.shape--sun { width: 190px; height: 190px; border-radius: 50%; background: var(--yellow); right: -50px; top: 38px; }
.shape--moon { width: 180px; height: 180px; border-radius: 50%; border: 38px solid var(--blue); right: -64px; top: 54px; }
.shape--stairs { inset: auto -10px 0 auto; width: 160px; height: 190px; background: repeating-linear-gradient(to bottom, var(--green) 0 28px, transparent 28px 38px); transform: rotate(-30deg); }
.book-card__meta { border-top: 1px solid rgba(23,23,20,.18); padding-top: 18px; }
.book-card__meta p { margin: 0 0 6px; font-size: 10px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.book-card__meta h3 { margin: 0 0 9px; font-family: var(--display); font-size: 30px; line-height: 1; font-weight: 500; }
.book-card__meta a, .book-card__meta span { font-size: 12px; font-weight: 800; }
.section-action { display: flex; justify-content: center; margin-top: 54px; }

.pathways { padding: 120px clamp(20px,6vw,96px); background: var(--cream); }
.pathways-head { display: grid; grid-template-columns: .7fr 1.3fr; gap: 40px; align-items: start; }
.pathways-head h2 { max-width: 920px; }
.pathway-switcher { margin: 60px 0 30px auto; width: max-content; max-width: 100%; display: flex; gap: 8px; padding: 7px; background: rgba(255,255,255,.7); border: 1px solid rgba(23,23,20,.12); border-radius: 999px; }
.pathway-tab { min-height: 44px; padding: 10px 18px; border: 0; border-radius: 999px; background: transparent; cursor: pointer; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .07em; }
.pathway-tab.is-active { background: var(--ink); color: var(--white); }
.pathway-stage { min-height: 680px; display: grid; grid-template-columns: .82fr 1.18fr; border-radius: var(--radius-xl); overflow: hidden; background: var(--white); box-shadow: var(--shadow-soft); }
.pathway-copy { padding: clamp(36px,5vw,76px); display: flex; flex-direction: column; justify-content: center; }
.step-label { font-size: 11px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--brand); }
.pathway-copy h3 { margin: 18px 0 22px; font-family: var(--display); font-size: clamp(44px,4.2vw,70px); line-height: .95; letter-spacing: -.05em; font-weight: 500; }
.pathway-copy > p:not(.step-label) { margin: 0; color: var(--muted); font-size: 18px; }
.pathway-steps { list-style: none; margin: 32px 0; padding: 0; display: grid; gap: 15px; }
.pathway-steps li { display: flex; align-items: center; gap: 14px; font-weight: 800; }
.pathway-steps span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--cream); font-size: 10px; }
.pathway-visual { position: relative; overflow: hidden; background: var(--yellow); transition: background .6s ease; }
.pathway-stage[data-pathway="mission"] .pathway-visual { background: var(--blue); }
.shipping-box { position: absolute; left: 22%; bottom: 16%; width: 330px; height: 270px; padding: 48px; background: #efc58f; border: 2px solid rgba(23,23,20,.25); transform: rotate(-6deg); box-shadow: 0 26px 40px rgba(23,23,20,.15); transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.shipping-box__top { position: absolute; left: -2px; top: -92px; width: 60%; height: 94px; background: #f3d6af; border: 2px solid rgba(23,23,20,.22); transform: skewX(-20deg); transform-origin: bottom; }
.shipping-box__side { position: absolute; top: 0; right: -56px; width: 58px; height: 100%; background: #d8a86f; clip-path: polygon(0 0,100% 17%,100% 100%,0 100%); }
.shipping-box strong { font-size: 62px; line-height: .84; letter-spacing: -.08em; }
.pathway-book { position: absolute; width: 120px; aspect-ratio: .69; border: 1px solid rgba(23,23,20,.2); border-radius: 3px 8px 8px 3px; box-shadow: var(--shadow-book); transition: transform .7s cubic-bezier(.2,.8,.2,1), background .4s ease; }
.pathway-book--one { left: 49%; top: 12%; background: var(--brand); transform: rotate(14deg); }
.pathway-book--two { left: 66%; top: 22%; background: var(--green); transform: rotate(-9deg); }
.pathway-book--three { left: 47%; top: 44%; background: var(--pink); transform: rotate(6deg); }
.destination-card { position: absolute; right: 7%; bottom: 10%; width: 235px; padding: 22px; background: var(--white); border: 1px solid rgba(23,23,20,.2); transform: rotate(4deg); box-shadow: 0 16px 34px rgba(23,23,20,.12); transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.destination-card span { font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.destination-card strong { display: block; margin: 18px 0; font-size: 22px; }
.destination-card i { display: block; height: 6px; width: 80%; background: var(--ink); box-shadow: 0 13px 0 rgba(23,23,20,.25), 0 26px 0 rgba(23,23,20,.13); }
.route-dots { position: absolute; left: 38%; right: 22%; bottom: 29%; display: flex; justify-content: space-between; align-items: center; }
.route-dots::before { content: ""; position: absolute; left: 0; right: 0; border-top: 3px dashed rgba(23,23,20,.42); }
.route-dots i { position: relative; width: 10px; height: 10px; background: var(--white); border: 2px solid var(--ink); border-radius: 50%; }
.pathway-stage[data-pathway="mission"] .shipping-box { transform: translate(36%,-7%) rotate(2deg) scale(.9); }
.pathway-stage[data-pathway="mission"] .pathway-book--one { transform: translate(-80%,180%) rotate(-6deg); }
.pathway-stage[data-pathway="mission"] .pathway-book--two { transform: translate(-155%,108%) rotate(4deg); }
.pathway-stage[data-pathway="mission"] .pathway-book--three { transform: translate(-8%,20%) rotate(-12deg); }
.pathway-stage[data-pathway="mission"] .destination-card { transform: translate(-105%,-172%) rotate(-3deg) scale(1.08); }

.how-it-works { padding: 130px clamp(20px,5vw,80px); background: var(--white); }
.how-title-wrap { display: grid; grid-template-columns: .75fr 1.25fr; margin-bottom: 70px; }
.steps-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.process-card { min-height: 520px; padding: 24px; display: grid; grid-template-rows: auto 1fr auto auto; border-radius: var(--radius-lg); transition: transform .35s ease; overflow: hidden; }
.process-card:hover { transform: translateY(-12px) rotate(-.8deg); }
.process-card--yellow { background: var(--yellow); }
.process-card--blue { background: var(--blue); }
.process-card--green { background: var(--green); }
.process-card--red { background: var(--brand); color: var(--white); }
.process-number { font-size: 11px; font-weight: 900; }
.process-art { position: relative; min-height: 260px; }
.process-card h3 { margin: 0 0 12px; font-family: var(--display); font-size: 37px; line-height: .95; font-weight: 500; }
.process-card p { margin: 0; font-size: 14px; }
.process-art i { position: absolute; display: block; }
.process-art--browse i { width: 86px; aspect-ratio: .69; top: 64px; background: var(--white); border: 1px solid var(--ink); box-shadow: 8px 10px 0 rgba(23,23,20,.14); }
.process-art--browse i:nth-child(1) { left: 17%; transform: rotate(-15deg); }
.process-art--browse i:nth-child(2) { left: 39%; top: 42px; transform: rotate(2deg); background: var(--pink); }
.process-art--browse i:nth-child(3) { left: 61%; transform: rotate(16deg); background: var(--brand); }
.process-art--choose i { border-radius: 50%; border: 10px solid var(--ink); }
.process-art--choose i:nth-child(1) { width: 138px; height: 138px; left: 22%; top: 46px; }
.process-art--choose i:nth-child(2) { width: 34px; height: 34px; left: 51%; top: 96px; background: var(--white); border-width: 7px; }
.process-art--choose i:nth-child(3) { width: 92px; height: 18px; left: 45%; top: 186px; border: 0; border-radius: 999px; background: var(--ink); transform: rotate(38deg); transform-origin: left; }
.process-art--ship i:nth-child(1) { width: 180px; height: 125px; left: 20%; top: 74px; background: #efc58f; border: 2px solid var(--ink); }
.process-art--ship i:nth-child(2) { width: 96px; height: 70px; left: 22%; top: 7px; background: #f3d6af; border: 2px solid var(--ink); transform: skewX(-17deg); }
.process-art--ship i:nth-child(3) { width: 74px; height: 98px; left: 55%; top: 42px; background: var(--brand); border: 2px solid var(--ink); transform: rotate(10deg); }
.process-art--read i { width: 116px; height: 148px; top: 56px; border: 3px solid var(--white); }
.process-art--read i:nth-child(1) { left: 16%; transform: skewY(10deg); border-radius: 8px 0 0 8px; }
.process-art--read i:nth-child(2) { right: 16%; transform: skewY(-10deg); border-radius: 0 8px 8px 0; }
.process-art--read i:nth-child(3) { left: calc(50% - 2px); width: 4px; background: var(--white); border: 0; transform: none; }

.missions { padding: 130px clamp(20px,6vw,96px); display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: clamp(50px,8vw,120px); background: var(--cream); }
.missions-copy > p:not(.eyebrow) { margin: 26px 0 34px; max-width: 650px; color: var(--muted); font-size: 18px; }
.mission-board { min-height: 560px; display: grid; grid-template-rows: auto 1fr; padding: 22px; background: var(--ink); color: var(--white); border-radius: var(--radius-xl); transform: rotate(1.5deg); box-shadow: 0 34px 70px rgba(23,23,20,.2); }
.mission-board__top { display: flex; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.25); font-size: 9px; font-weight: 900; letter-spacing: .16em; }
.mission-board__empty { display: grid; place-items: center; align-content: center; text-align: center; padding: 40px; }
.mission-board__empty strong { margin-top: 28px; font-family: var(--display); font-size: 42px; font-weight: 500; }
.mission-board__empty p { max-width: 420px; color: rgba(255,255,255,.68); }
.empty-stack { position: relative; width: 260px; height: 190px; }
.empty-stack i { position: absolute; left: 50%; top: 50%; width: 96px; aspect-ratio: .69; border: 2px solid var(--white); border-radius: 3px 7px 7px 3px; transform-origin: center bottom; }
.empty-stack i:nth-child(1) { background: var(--yellow); transform: translate(-118%,-50%) rotate(-15deg); }
.empty-stack i:nth-child(2) { background: var(--blue); transform: translate(-50%,-64%) rotate(1deg); }
.empty-stack i:nth-child(3) { background: var(--brand); transform: translate(18%,-50%) rotate(15deg); }

.audiences { padding: 130px 0 0; overflow: hidden; background: var(--white); text-align: center; }
.audiences > .eyebrow { justify-content: center; }
.audiences h2 { margin-bottom: 70px; }
.audience-marquee { overflow: hidden; border-block: 1px solid var(--line); padding: 22px 0; }
.audience-marquee > div { width: max-content; display: flex; gap: 42px; animation: marquee 22s linear infinite; }
.audience-marquee span { font-family: var(--display); font-size: clamp(38px,4vw,68px); line-height: 1; }
.audience-marquee span::after { content: "✦"; margin-left: 42px; color: var(--brand); font-size: .45em; vertical-align: middle; }
@keyframes marquee { to { transform: translateX(-50%); } }
.cover-wall { height: 540px; position: relative; margin-top: 50px; }
.cover-tile { position: absolute; width: 150px; aspect-ratio: .69; border: 1px solid rgba(23,23,20,.22); border-radius: 4px 10px 10px 4px; box-shadow: var(--shadow-book); }
.cover-tile--1 { left: 4%; top: 120px; background: var(--brand); transform: rotate(-15deg); }
.cover-tile--2 { left: 17%; top: 30px; background: var(--yellow); transform: rotate(8deg); }
.cover-tile--3 { left: 30%; top: 180px; background: var(--blue); transform: rotate(-5deg); }
.cover-tile--4 { left: 43%; top: 45px; background: var(--pink); transform: rotate(13deg); }
.cover-tile--5 { left: 54%; top: 155px; background: var(--green); transform: rotate(-10deg); }
.cover-tile--6 { left: 67%; top: 15px; background: #efc58f; transform: rotate(5deg); }
.cover-tile--7 { left: 79%; top: 145px; background: var(--brand); transform: rotate(15deg); }
.cover-tile--8 { left: 90%; top: 58px; background: var(--blue); transform: rotate(-8deg); }
.cover-tile--9 { left: 38%; top: 280px; background: var(--yellow); transform: rotate(3deg); }

.about-strip { min-height: 700px; padding: 110px clamp(20px,6vw,96px); display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; background: var(--yellow); overflow: hidden; }
.about-strip__symbol { font-weight: 950; font-size: clamp(170px,24vw,410px); line-height: .75; letter-spacing: -.12em; transform: translateX(-4vw) rotate(-5deg); color: var(--ink); opacity: .92; }
.about-strip__copy { position: relative; z-index: 2; max-width: 650px; }
.about-strip__copy > p:not(.eyebrow) { margin: 26px 0; font-size: 18px; }

.faq { padding: 130px clamp(20px,6vw,96px); display: grid; grid-template-columns: .75fr 1.25fr; gap: 70px; background: var(--white); }
.faq-list { border-top: 1px solid var(--line); }
details { border-bottom: 1px solid var(--line); }
summary { list-style: none; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 24px; padding: 28px 0; cursor: pointer; font-family: var(--display); font-size: clamp(24px,2vw,36px); line-height: 1.08; }
summary::-webkit-details-marker { display: none; }
summary span { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--ink); border-radius: 50%; transition: transform .25s ease, background .25s ease; }
details[open] summary span { transform: rotate(45deg); background: var(--yellow); }
details p { max-width: 760px; margin: -6px 0 28px; color: var(--muted); font-size: 17px; }

.final-cta { min-height: 620px; padding: 90px clamp(20px,6vw,96px); display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 60px; background: var(--brand); color: var(--white); overflow: hidden; }
.final-cta__books { position: relative; height: 430px; }
.final-cta__books i { position: absolute; left: 50%; top: 50%; width: 190px; aspect-ratio: .69; border: 2px solid var(--white); border-radius: 4px 12px 12px 4px; box-shadow: 0 25px 50px rgba(23,23,20,.18); }
.final-cta__books i:nth-child(1) { background: var(--yellow); transform: translate(-138%,-45%) rotate(-22deg); }
.final-cta__books i:nth-child(2) { background: var(--blue); transform: translate(-84%,-58%) rotate(-7deg); }
.final-cta__books i:nth-child(3) { background: var(--green); transform: translate(-25%,-58%) rotate(8deg); }
.final-cta__books i:nth-child(4) { background: var(--pink); transform: translate(35%,-43%) rotate(22deg); }
.final-cta h2 { max-width: 800px; margin-bottom: 38px; }

.site-footer { padding: 90px clamp(20px,6vw,96px) 30px; background: var(--ink); color: var(--white); }
.footer-top { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 50px; border-bottom: 1px solid rgba(255,255,255,.2); }
.brand--footer .brand-mark { font-size: clamp(50px,7vw,110px); }
.brand--footer .brand-word { font-size: 15px; }
.footer-top p { max-width: 380px; color: rgba(255,255,255,.65); text-align: right; }
.footer-grid { display: grid; grid-template-columns: .7fr .7fr .7fr 1.3fr; gap: 40px; padding: 60px 0 90px; }
.footer-grid > div { display: flex; flex-direction: column; gap: 12px; }
.footer-grid h2 { margin: 0 0 8px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.footer-grid a { color: rgba(255,255,255,.72); }
.footer-grid a:hover { color: var(--white); }
.footer-action { align-items: flex-start; }
.footer-action h2 { font-family: var(--display); font-size: 36px; line-height: 1; letter-spacing: -.03em; text-transform: none; }
.footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.5); font-size: 11px; }

@media (max-width: 1180px) {
  .site-nav { gap: 15px; }
  .site-nav a { font-size: 11px; }
  .header-actions .text-action { display: none; }
  .hero { grid-template-columns: .9fr 1.1fr; gap: 20px; }
  .hero-stage { min-height: 590px; }
  .book { width: 180px; }
  .book strong { font-size: 31px; }
  .book-rail { grid-template-columns: repeat(2,1fr); }
  .steps-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 900px) {
  .site-header { grid-template-columns: auto auto; justify-content: space-between; min-height: 68px; padding: 12px 20px; }
  .header-actions { display: none; }
  .menu-toggle { display: flex; align-items: center; gap: 10px; border: 0; background: transparent; padding: 10px; cursor: pointer; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
  .menu-toggle__icon { width: 25px; display: grid; gap: 6px; }
  .menu-toggle__icon i { display: block; height: 2px; background: var(--ink); transition: transform .25s ease; }
  .menu-toggle[aria-expanded="true"] .menu-toggle__icon i:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__icon i:last-child { transform: translateY(-4px) rotate(-45deg); }
  .site-nav {
    position: fixed;
    inset: 68px 0 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 2px;
    padding: 34px 28px 60px;
    background: var(--yellow);
    transform: translateX(100%);
    transition: transform .45s cubic-bezier(.2,.8,.2,1);
  }
  .site-nav.is-open { transform: translateX(0); }
  .site-nav a { width: 100%; padding: 11px 0; font-family: var(--display); font-size: clamp(36px,8vw,62px); line-height: .95; font-weight: 500; letter-spacing: -.04em; border-bottom: 1px solid rgba(23,23,20,.18); }
  .site-nav a::after { display: none; }
  .hero { min-height: auto; padding: 110px 20px 50px; grid-template-columns: 1fr; gap: 20px; }
  .hero-copy { max-width: none; }
  .hero-copy__stack { min-height: 330px; }
  .hero-story h1, .hero-story h2 { font-size: clamp(52px,12vw,84px); }
  .hero-story p { max-width: 650px; }
  .hero-stage { min-height: 560px; }
  .book-scene { width: 100%; max-width: 700px; }
  .book { width: 170px; }
  .orbit--one { width: min(86vw,620px); }
  .orbit--two { width: min(68vw,480px); }
  .scroll-cue { display: none; }
  .section-intro, .pathways-head, .how-title-wrap, .missions, .faq, .about-strip, .final-cta { grid-template-columns: 1fr; }
  .section-intro { gap: 20px; }
  .pathway-stage { grid-template-columns: 1fr; }
  .pathway-visual { min-height: 570px; }
  .pathway-switcher { margin-left: 0; }
  .missions { gap: 60px; }
  .about-strip__symbol { font-size: 40vw; }
  .footer-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 620px) {
  .brand-mark { font-size: 23px; }
  .menu-toggle__label { display: none; }
  .hero { padding-top: 94px; }
  .hero-copy__stack { min-height: 390px; }
  .hero-story h1, .hero-story h2 { margin-bottom: 22px; font-size: clamp(48px,15.5vw,65px); line-height: .9; }
  .hero-story p { margin-bottom: 24px; font-size: 15px; }
  .button-row { gap: 14px; }
  .button { width: 100%; }
  .text-link { width: max-content; font-size: 10px; }
  .hero-controls { flex-wrap: wrap; }
  .hero-arrow { min-width: 44px; }
  .hero-stage { min-height: 440px; margin-top: -18px; }
  .book-scene { height: 390px; }
  .book { width: 123px; padding: 19px 13px 16px 19px; border-radius: 3px 8px 8px 3px; }
  .book-spine { width: 9px; }
  .book-kicker { font-size: 5px; }
  .book strong { font-size: 22px; }
  .book small { font-size: 6px; }
  .hero[data-state="group"] .book--a { transform: translate(-151%,-35%) rotate(-20deg) translateZ(-80px); }
  .hero[data-state="group"] .book--b { transform: translate(-96%,-49%) rotate(-9deg) translateZ(-30px); }
  .hero[data-state="group"] .book--hero { transform: translate(-49%,-52%) rotate(2deg) translateZ(50px) scale(1.08); }
  .hero[data-state="group"] .book--c { transform: translate(0%,-47%) rotate(12deg) translateZ(-20px); }
  .hero[data-state="group"] .book--d { transform: translate(47%,-33%) rotate(23deg) translateZ(-70px); }
  .hero[data-state="mission"] .book--a { transform: translate(-109%,-68%) rotate(-5deg) scale(.86); }
  .hero[data-state="mission"] .book--b { transform: translate(-80%,-50%) rotate(-1deg) scale(.92); }
  .hero[data-state="mission"] .book--hero { transform: translate(-50%,-25%) rotate(0deg) scale(1.03); }
  .hero[data-state="mission"] .book--c { transform: translate(-20%,-50%) rotate(2deg) scale(.92); }
  .hero[data-state="mission"] .book--d { transform: translate(8%,-68%) rotate(6deg) scale(.86); }
  .hero-box { width: 240px; height: 110px; top: 65%; }
  .hero-box__flap { top: -50px; height: 52px; }
  .route-line { width: 88%; top: 61%; }
  .stage-caption { left: 3%; right: 3%; bottom: 18px; }
  .stage-caption span, .stage-caption strong { font-size: 7px; }
  .book-drop, .pathways, .how-it-works, .missions, .faq { padding: 90px 16px; }
  .section-intro h2, .pathways-head h2, .how-title-wrap h2, .missions h2, .audiences h2, .about-strip h2, .faq h2, .final-cta h2 { font-size: 48px; }
  .book-rail, .steps-grid { grid-template-columns: 1fr; }
  .book-card { min-height: 510px; }
  .pathway-switcher { width: 100%; overflow-x: auto; justify-content: flex-start; }
  .pathway-tab { flex: 0 0 auto; }
  .pathway-copy { padding: 34px 22px; }
  .pathway-copy h3 { font-size: 43px; }
  .pathway-visual { min-height: 470px; }
  .shipping-box { left: 12%; bottom: 16%; width: 230px; height: 190px; padding: 34px; }
  .shipping-box__top { top: -64px; height: 66px; }
  .shipping-box strong { font-size: 44px; }
  .pathway-book { width: 85px; }
  .pathway-book--one { left: 53%; }
  .pathway-book--two { left: 69%; }
  .destination-card { width: 180px; right: 5%; }
  .pathway-stage[data-pathway="mission"] .destination-card { transform: translate(-56%,-168%) rotate(-3deg); }
  .process-card { min-height: 470px; }
  .mission-board { min-height: 470px; transform: none; }
  .mission-board__empty { padding: 20px; }
  .mission-board__empty strong { font-size: 34px; }
  .audiences { padding-top: 90px; }
  .audience-marquee span { font-size: 40px; }
  .cover-wall { height: 460px; }
  .cover-tile { width: 95px; }
  .cover-tile--1 { left: -3%; }
  .cover-tile--2 { left: 19%; }
  .cover-tile--3 { left: 42%; }
  .cover-tile--4 { left: 64%; }
  .cover-tile--5 { left: 84%; }
  .cover-tile--6 { left: 8%; top: 250px; }
  .cover-tile--7 { left: 34%; top: 285px; }
  .cover-tile--8 { left: 59%; top: 250px; }
  .cover-tile--9 { left: 82%; top: 300px; }
  .about-strip { padding: 80px 16px; }
  .about-strip__symbol { font-size: 45vw; }
  .faq { gap: 40px; }
  summary { font-size: 25px; }
  .final-cta { padding: 80px 16px; }
  .final-cta__books { height: 280px; }
  .final-cta__books i { width: 115px; }
  .site-footer { padding: 70px 20px 26px; }
  .footer-top { align-items: flex-start; flex-direction: column; gap: 26px; }
  .footer-top p { text-align: left; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 38px 22px; }
  .footer-action { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .audience-marquee > div { animation: none; flex-wrap: wrap; width: auto; justify-content: center; }
  .audience-marquee span[aria-hidden="true"] { display: none; }
}


/* =========================================================
   V1 COMPLETE SITE — LOCKED CONSISTENCY LAYER
   White-first. Red header/footer. No cream backgrounds.
   ========================================================= */
:root{
  --paper:#fff;
  --cream:#fff;
  --page-max:1440px;
  --content-max:1240px;
  --red:var(--kk-brand-red);
  --red-dark:var(--kk-brand-red-hover);
  --gray:#f2f3f5;
  --gray-2:#e5e6e9;
}
.site-header--red{background:var(--brand);color:var(--white);border-bottom-color:rgba(255,255,255,.22);backdrop-filter:none;}
.site-header--red.is-scrolled{background:var(--brand);box-shadow:0 12px 34px rgba(23,23,20,.16)}
.site-header--red .site-nav a::after,.site-header--red .text-action::after{background:var(--white)}
.site-header--red .cart-count{border-color:var(--white)}
.site-header--red .button--header{background:var(--white);color:var(--brand);box-shadow:none}
.site-header--red .button--header:hover{background:var(--yellow);color:var(--ink)}
.site-header--red .menu-toggle__icon i{background:var(--white)}
.site-footer--red{background:var(--brand);color:var(--white)}
.site-footer--red .footer-top,.site-footer--red .footer-bottom{border-color:rgba(255,255,255,.3)}
.site-footer--red .footer-grid a,.site-footer--red .footer-top p{color:rgba(255,255,255,.8)}
.site-footer--red .footer-grid a:hover{color:#fff}
body{background:#fff}
.pathways,.missions{background:#fff}
.pathway-steps span{background:var(--gray)}
.process-art--ship i:nth-child(1){background:var(--brand)}
.process-art--ship i:nth-child(2){background:var(--yellow)}
.cover-tile--6{background:var(--pink)}

.demo-notice{margin-top:76px;min-height:42px;padding:10px clamp(20px,6vw,96px);display:flex;align-items:center;justify-content:center;gap:12px;background:var(--ink);color:#fff;font-size:12px;letter-spacing:.02em;text-align:center}
.demo-notice strong{color:var(--yellow);text-transform:uppercase;letter-spacing:.12em;font-size:10px}

/* Refined homepage hero graphics */
.hero{background:#fff}
.hero-stage::before{content:"";position:absolute;inset:5% -2% 5% 2%;border-radius:48px;background:transparent;transform:scale(.92);transition:background .72s ease,transform .82s cubic-bezier(.2,.85,.22,1);z-index:-1}
.hero[data-state="mission"] .hero-stage::before{background:var(--blue);transform:scale(1)}
.hero-deck{position:absolute;z-index:2;left:50%;top:70%;width:430px;height:96px;transform:translate(-50%,0) rotateX(6deg);background:var(--brand);border:2px solid var(--ink);border-radius:18px 18px 34px 34px;box-shadow:0 24px 44px rgba(23,23,20,.22);transition:all .82s cubic-bezier(.2,.85,.22,1)}
.hero-deck::before{content:"";position:absolute;left:34px;right:34px;top:-22px;height:28px;border:2px solid var(--ink);border-bottom:0;border-radius:16px 16px 0 0;background:#fff}
.hero-deck__rail{position:absolute;left:22px;right:22px;top:22px;height:2px;background:rgba(255,255,255,.65)}
.hero-deck__seal{position:absolute;right:24px;bottom:18px;color:#fff;font-size:10px;font-weight:900;letter-spacing:.14em}
.hero-deck i{position:absolute;bottom:18px;width:13px;height:13px;border:2px solid #fff;border-radius:50%}.hero-deck i:nth-of-type(1){left:28px}.hero-deck i:nth-of-type(2){left:50px}.hero-deck i:nth-of-type(3){left:72px}
.hero-address-card{position:absolute;z-index:9;left:19%;top:15%;width:320px;min-height:190px;padding:34px;background:#fff;border:2px solid var(--ink);box-shadow:14px 16px 0 rgba(23,23,20,.17);transform:translate(-10px,-25px) rotate(-4deg) scale(.86);opacity:0;transition:opacity .45s ease,transform .82s cubic-bezier(.2,.85,.22,1)}
.hero-address-card small{display:block;font-size:10px;font-weight:900;letter-spacing:.17em}.hero-address-card strong{display:block;margin:22px 0 28px;font-size:34px;line-height:.95;letter-spacing:-.04em}.hero-address-card i{display:block;height:8px;margin-top:9px;background:var(--ink)}.hero-address-card i:nth-of-type(2){width:70%;opacity:.28}.hero-address-card span{display:block;margin-top:20px;color:var(--brand);font-size:9px;font-weight:900;letter-spacing:.13em}
.hero[data-state="mission"] .hero-address-card{opacity:1;transform:translate(0,0) rotate(-4deg) scale(1)}
.hero[data-state="mission"] .hero-deck{top:61%;left:67%;width:390px;height:218px;background:var(--brand);border-radius:18px;transform:translate(-50%,0) rotate(2deg)}
.hero[data-state="mission"] .hero-deck::before{height:78px;top:-72px;left:18px;right:160px;background:var(--yellow);transform:skewX(-20deg)}
.hero[data-state="mission"] .hero-deck__seal{font-size:14px;right:30px;bottom:28px}
.hero[data-state="mission"] .route-line{left:28%;top:58%;width:68%}
.hero[data-state="group"] .route-line{opacity:.6;transform:translateX(-50%) scaleX(.8);left:50%;top:66%;width:65%}
.hero[data-state="group"] .book--a{transform:translate(-150%,-61%) rotate(-15deg) translateZ(-80px)}
.hero[data-state="group"] .book--b{transform:translate(-93%,-69%) rotate(-6deg) translateZ(-30px)}
.hero[data-state="group"] .book--hero{transform:translate(-48%,-72%) rotate(2deg) translateZ(70px) scale(1.06)}
.hero[data-state="group"] .book--c{transform:translate(5%,-67%) rotate(9deg) translateZ(-18px)}
.hero[data-state="group"] .book--d{transform:translate(59%,-57%) rotate(17deg) translateZ(-65px)}
.hero[data-state="mission"] .book--a{transform:translate(-70%,-20%) rotate(-12deg) translateZ(-80px) scale(.78)}
.hero[data-state="mission"] .book--b{transform:translate(-45%,-17%) rotate(-5deg) translateZ(-10px) scale(.82)}
.hero[data-state="mission"] .book--hero{transform:translate(-14%,-14%) rotate(6deg) translateZ(70px) scale(.88)}
.hero[data-state="mission"] .book--c{transform:translate(15%,-19%) rotate(13deg) translateZ(-20px) scale(.80)}
.hero[data-state="mission"] .book--d{transform:translate(39%,-25%) rotate(21deg) translateZ(-70px) scale(.74)}

/* Refined two-pathway visual */
.pathway-stage--refined{border:1px solid var(--line);box-shadow:0 24px 70px rgba(23,23,20,.10)}
.pathway-visual--refined{background:var(--yellow)}
.pathway-stage[data-pathway="mission"] .pathway-visual--refined{background:var(--blue)}
.visual-route-card{position:absolute;left:16%;top:17%;z-index:5;width:360px;padding:34px;background:#fff;border:2px solid var(--ink);box-shadow:12px 14px 0 rgba(23,23,20,.16);transform:rotate(-4deg);transition:transform .7s ease,left .7s ease}
.visual-route-card small{font-size:10px;font-weight:900;letter-spacing:.15em}.visual-route-card strong{display:block;margin:20px 0 30px;font-size:36px;line-height:.95}.visual-route-card i{display:block;height:8px;background:var(--ink);margin-top:9px}.visual-route-card i:last-child{width:70%;opacity:.25}
.visual-book-bundle i{position:absolute;width:150px;aspect-ratio:.69;left:48%;top:34%;border:2px solid var(--ink);border-radius:4px 12px 12px 4px;box-shadow:var(--shadow-book);transition:transform .75s cubic-bezier(.2,.8,.2,1)}
.visual-book-bundle i:nth-child(1){background:var(--brand);transform:translate(-80%,-10%) rotate(-10deg)}.visual-book-bundle i:nth-child(2){background:var(--green);transform:translate(-28%,-19%) rotate(2deg)}.visual-book-bundle i:nth-child(3){background:var(--pink);transform:translate(22%,-7%) rotate(12deg)}
.visual-shipment{position:absolute;left:44%;right:8%;bottom:9%;height:190px;background:var(--brand);border:2px solid var(--ink);border-radius:18px;box-shadow:0 28px 50px rgba(23,23,20,.2);transition:all .7s ease}
.visual-shipment::before{content:"";position:absolute;left:18px;top:-72px;width:46%;height:75px;background:var(--yellow);border:2px solid var(--ink);transform:skewX(-18deg)}
.visual-shipment span{position:absolute;inset:0;background:linear-gradient(90deg,transparent 58%,rgba(0,0,0,.12) 58%);border-radius:inherit}.visual-shipment strong{position:absolute;right:28px;bottom:22px;color:#fff;font-size:31px;line-height:.78;letter-spacing:-.06em}
.visual-route{position:absolute;left:39%;right:8%;bottom:32%;display:flex;justify-content:space-between;align-items:center;z-index:8}.visual-route::before{content:"";position:absolute;left:0;right:0;border-top:3px dashed rgba(23,23,20,.45)}.visual-route b{position:relative;width:14px;height:14px;border:3px solid var(--ink);border-radius:50%;background:#fff}
.pathway-stage[data-pathway="group"] .visual-route-card{left:9%;top:14%}.pathway-stage[data-pathway="group"] .visual-route-card strong{font-size:34px}.pathway-stage[data-pathway="group"] .visual-shipment{left:42%;right:7%;bottom:8%;height:170px;background:var(--ink)}
.pathway-stage[data-pathway="group"] .visual-shipment::before{background:var(--brand)}
.pathway-stage[data-pathway="group"] .visual-book-bundle i:nth-child(1){transform:translate(-95%,-32%) rotate(-18deg)}.pathway-stage[data-pathway="group"] .visual-book-bundle i:nth-child(2){transform:translate(-30%,-49%) rotate(0)}.pathway-stage[data-pathway="group"] .visual-book-bundle i:nth-child(3){transform:translate(34%,-30%) rotate(17deg)}

/* Shared page system */
.page-hero{min-height:0;margin-top:76px;padding:clamp(48px,6vw,88px) clamp(20px,6vw,96px);display:grid;grid-template-columns:minmax(0,.88fr) minmax(460px,1.12fr);align-items:center;gap:clamp(40px,7vw,110px);background:#fff;border-bottom:1px solid var(--line);overflow:hidden}
.page-hero__copy{max-width:720px}.page-hero h1{margin:0 0 28px;font-family:var(--display);font-size:clamp(58px,5.35vw,96px);line-height:.89;letter-spacing:-.055em;font-weight:500}.page-hero__copy>p:not(.eyebrow){max-width:620px;margin:0 0 34px;color:var(--muted);font-size:19px}
.page-hero__visual{position:relative;min-height:clamp(360px,30vw,460px)}.page-hero__visual--stack i{position:absolute;left:50%;top:50%;width:200px;aspect-ratio:.69;border:2px solid var(--ink);border-radius:4px 13px 13px 4px;box-shadow:var(--shadow-book)}.page-hero__visual--stack i:nth-child(1){background:var(--yellow);transform:translate(-135%,-54%) rotate(-17deg)}.page-hero__visual--stack i:nth-child(2){background:var(--blue);transform:translate(-75%,-66%) rotate(-5deg)}.page-hero__visual--stack i:nth-child(3){background:var(--green);transform:translate(-15%,-61%) rotate(8deg)}.page-hero__visual--stack i:nth-child(4){background:var(--pink);transform:translate(46%,-47%) rotate(20deg)}.page-hero__visual--stack span{position:absolute;right:3%;bottom:1%;font-size:clamp(100px,13vw,220px);font-weight:950;letter-spacing:-.1em;color:var(--brand);opacity:.16}
.page-hero__visual--shelf{display:grid;place-items:center}.shelf-books{position:relative;width:100%;height:420px}.shelf-books i{position:absolute;bottom:60px;width:150px;aspect-ratio:.69;border:2px solid var(--ink);border-radius:4px 12px 12px 4px;box-shadow:var(--shadow-book)}.shelf-books i:nth-child(1){left:4%;background:var(--yellow);transform:rotate(-9deg)}.shelf-books i:nth-child(2){left:23%;background:var(--blue);transform:rotate(3deg)}.shelf-books i:nth-child(3){left:42%;background:var(--brand);transform:rotate(-2deg) translateY(-34px)}.shelf-books i:nth-child(4){left:61%;background:var(--green);transform:rotate(6deg)}.shelf-books i:nth-child(5){left:80%;background:var(--pink);transform:rotate(12deg)}.shelf-line{position:absolute;left:0;right:0;bottom:58px;height:18px;background:var(--ink)}
.page-hero__visual--route{background:var(--blue);border-radius:40px;overflow:hidden}.page-hero__visual--route .route-card{position:absolute;left:9%;top:16%;z-index:4;width:330px;padding:32px;background:#fff;border:2px solid var(--ink);box-shadow:12px 14px 0 rgba(23,23,20,.15);transform:rotate(-4deg)}.route-card small{font-size:10px;font-weight:900;letter-spacing:.15em}.route-card strong{display:block;margin:22px 0 28px;font-size:34px;line-height:.95}.route-card i{display:block;height:8px;background:var(--ink);margin-top:9px}.route-books i{position:absolute;width:140px;aspect-ratio:.69;border:2px solid var(--ink);border-radius:4px 11px 11px 4px;box-shadow:var(--shadow-book)}.route-books i:nth-child(1){left:41%;top:42%;background:var(--brand);transform:rotate(-11deg)}.route-books i:nth-child(2){left:53%;top:38%;background:var(--green);transform:rotate(2deg)}.route-books i:nth-child(3){left:65%;top:43%;background:var(--pink);transform:rotate(13deg)}.route-path{position:absolute;left:38%;right:5%;bottom:14%;border-top:3px dashed rgba(23,23,20,.55)}

.catalog-section,.mission-list-section,.profile-section,.contact-layout,.video-grid,.content-grid,.legal-layout,.search-section{padding:110px clamp(20px,6vw,96px)}
.catalog-toolbar{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:54px}.catalog-toolbar h2,.section-intro--compact h2{margin:0;font-family:var(--display);font-size:clamp(48px,5.2vw,82px);line-height:.94;letter-spacing:-.055em;font-weight:500}.catalog-filters{display:flex;flex-wrap:wrap;gap:8px}.filter-chip{min-height:42px;padding:10px 17px;border:1px solid var(--ink);border-radius:999px;background:#fff;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.filter-chip.is-active{background:var(--ink);color:#fff}
.demo-product-grid{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:24px}.demo-product-grid--home{grid-template-columns:repeat(4,minmax(220px,1fr))}.demo-product-card{min-width:0;display:grid;grid-template-rows:auto 1fr;border:1px solid var(--line);border-radius:26px;overflow:hidden;background:#fff;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}.demo-product-card:hover{transform:translateY(-12px) rotate(-.7deg);box-shadow:var(--shadow-soft)}.demo-cover-wrap{min-height:430px;padding:42px;display:grid;place-items:center;background:var(--gray)}.demo-cover-wrap img{width:min(100%,240px);filter:drop-shadow(0 24px 22px rgba(23,23,20,.22));transition:transform .4s ease}.demo-product-card:hover img{transform:rotate(3deg) scale(1.035)}.demo-product-meta{padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:20px}.demo-product-meta h3{margin:9px 0 6px;font-family:var(--display);font-size:30px;line-height:1;font-weight:500}.demo-product-meta p{margin:0;color:var(--muted)}.demo-product-bottom{padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.demo-product-bottom strong{font-size:20px}.demo-product-bottom a{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.demo-pill{display:inline-flex;width:max-content;padding:6px 9px;border-radius:999px;background:var(--yellow);font-size:8px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}

.demo-mission-card{min-height:560px;padding:28px;display:flex;flex-direction:column;background:var(--ink);color:#fff;border-radius:36px;box-shadow:0 34px 70px rgba(23,23,20,.2);transform:rotate(1deg)}.demo-mission-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.22);font-size:10px;font-weight:800}.demo-mission-card h3{margin:30px 0 8px;font-family:var(--display);font-size:clamp(38px,4vw,64px);font-weight:500;line-height:.94}.demo-mission-card>p{margin:0;color:rgba(255,255,255,.65)}.demo-mission-covers{height:230px;display:flex;align-items:center;justify-content:center;margin:20px 0}.demo-mission-covers img{width:115px;margin-left:-25px;border:1px solid #fff;border-radius:3px 8px 8px 3px;box-shadow:0 18px 30px rgba(0,0,0,.25)}.demo-mission-covers img:nth-child(1){transform:rotate(-14deg)}.demo-mission-covers img:nth-child(2){transform:rotate(-4deg)}.demo-mission-covers img:nth-child(3){transform:rotate(7deg)}.demo-mission-covers img:nth-child(4){transform:rotate(16deg)}.progress-track{height:12px;border-radius:999px;background:rgba(255,255,255,.18);overflow:hidden}.progress-track span{display:block;height:100%;background:var(--brand)}.demo-mission-stats{display:flex;justify-content:space-between;margin:15px 0 25px;font-size:12px}.demo-mission-stats strong{display:block;font-size:23px}.demo-mission-card .button{align-self:flex-start}.demo-mission-list{display:grid;grid-template-columns:1fr 1fr;gap:30px}.mission-empty-card{min-height:560px;padding:50px;display:grid;place-items:center;align-content:center;text-align:center;border:2px dashed var(--line);border-radius:36px}.mission-empty-card h3{font-family:var(--display);font-size:38px;font-weight:500;line-height:1}.mission-empty-card p{max-width:420px;color:var(--muted)}

.product-detail{padding:150px clamp(20px,7vw,110px) 110px;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(50px,8vw,120px);align-items:center}.product-detail__art{min-height:680px;display:grid;place-items:center;background:var(--gray);border-radius:36px}.product-detail__art img{width:min(70%,390px);filter:drop-shadow(0 35px 30px rgba(23,23,20,.22));transform:rotate(-5deg)}.product-detail__copy h1{margin:16px 0 12px;font-family:var(--display);font-size:clamp(66px,7vw,112px);line-height:.86;letter-spacing:-.07em;font-weight:500}.product-lede{font-size:22px;color:var(--muted)}.product-price{font-size:31px;font-weight:900}.quantity-row{display:flex;align-items:center;gap:24px;margin:32px 0}.quantity-row label{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}.quantity-control{display:grid;grid-template-columns:44px 60px 44px;border:1px solid var(--ink);border-radius:999px;overflow:hidden}.quantity-control button,.quantity-control input{height:44px;border:0;background:#fff;text-align:center}.quantity-control button{cursor:pointer;font-weight:900}.quantity-control input{width:60px;border-inline:1px solid var(--line)}.product-facts{margin-top:42px;border-top:1px solid var(--line)}.product-facts>div{display:flex;justify-content:space-between;gap:30px;padding:18px 0;border-bottom:1px solid var(--line)}.product-facts span{color:var(--muted)}
.content-band{padding:100px clamp(20px,6vw,96px);display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.content-band--blue{background:var(--blue)}.content-band--yellow{background:var(--yellow)}.content-band h2{margin:0;font-family:var(--display);font-size:clamp(52px,6vw,92px);line-height:.9;letter-spacing:-.06em;font-weight:500}.split-info{display:grid;grid-template-columns:1fr 1fr;gap:22px}.split-info article{padding:34px;background:#fff;border:2px solid var(--ink);border-radius:24px}.split-info span,.values-grid span,.requirement-list span{font-size:10px;font-weight:900;letter-spacing:.12em}.split-info h3{font-family:var(--display);font-size:35px;line-height:1;font-weight:500}.plain-copy{font-size:19px}.plain-copy .button{margin-top:20px}

.mission-detail{padding:150px clamp(20px,6vw,96px) 90px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end}.mission-detail__head h1{margin:16px 0 25px;font-family:var(--display);font-size:clamp(62px,7vw,108px);line-height:.88;letter-spacing:-.065em;font-weight:500}.mission-detail__head>p:last-child{max-width:650px;color:var(--muted);font-size:19px}.mission-detail__board{padding:40px;border-radius:30px;background:var(--ink);color:#fff}.mission-stat{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid rgba(255,255,255,.2)}.mission-stat span{color:rgba(255,255,255,.62)}.mission-detail__board .progress-track{margin-top:30px}.mission-detail__board>p{color:rgba(255,255,255,.6);font-size:12px}.mission-book-list{padding:100px clamp(20px,6vw,96px)}.mission-line-items article{display:grid;grid-template-columns:100px 1fr auto;align-items:center;gap:30px;padding:24px 0;border-bottom:1px solid var(--line)}.mission-line-items img{width:82px}.mission-line-items h3{margin:8px 0 4px;font-family:var(--display);font-size:30px;font-weight:500}.mission-line-items p{margin:0;color:var(--muted)}.mission-line-items>article>strong{font-size:22px}.mission-total{margin-top:30px;padding:30px;display:flex;align-items:center;justify-content:space-between;gap:30px;background:var(--gray);border-radius:24px}.mission-total strong{font-size:32px}.destination-demo{position:relative;min-height:480px}.destination-demo .visual-route-card{left:5%;top:4%}.destination-demo .visual-book-bundle i:nth-child(1){left:43%;top:39%}.destination-demo .visual-book-bundle i:nth-child(2){left:56%;top:34%}.destination-demo .visual-book-bundle i:nth-child(3){left:69%;top:40%}

.profile-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.profile-card{padding:50px;border:1px solid var(--line);border-radius:36px}.profile-card h2{font-family:var(--display);font-size:58px;line-height:.95;font-weight:500}.profile-card>p{color:var(--muted);font-size:18px}.profile-card dl{margin-top:35px}.profile-card dl div{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--line)}.profile-card dt{color:var(--muted)}.profile-card dd{margin:0;font-weight:800}

.content-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px}.content-grid h2{margin:0;font-family:var(--display);font-size:clamp(50px,5.5vw,86px);line-height:.92;letter-spacing:-.055em;font-weight:500}.requirement-list{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}.requirement-list article{padding:34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.requirement-list h3{font-family:var(--display);font-size:31px;font-weight:500}.requirement-list p{color:var(--muted)}.disabled-panel{margin:0 clamp(20px,6vw,96px) 110px;padding:70px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;background:var(--yellow);border-radius:36px}.disabled-panel h2{font-family:var(--display);font-size:clamp(48px,5vw,80px);line-height:.92;font-weight:500}.disabled-panel__art{position:relative;height:380px}.disabled-panel__art i{position:absolute;left:50%;top:50%;width:150px;aspect-ratio:.69;border:2px solid var(--ink);border-radius:4px 12px 12px 4px}.disabled-panel__art i:nth-child(1){background:var(--brand);transform:translate(-115%,-50%) rotate(-16deg)}.disabled-panel__art i:nth-child(2){background:var(--blue);transform:translate(-50%,-65%) rotate(0)}.disabled-panel__art i:nth-child(3){background:var(--green);transform:translate(15%,-48%) rotate(16deg)}

.story-section{padding:110px clamp(20px,6vw,96px);display:grid;grid-template-columns:.45fr 1.55fr;gap:50px;align-items:start;border-top:1px solid var(--line)}.story-section--blue{background:var(--blue)}.story-number{font-size:clamp(120px,15vw,260px);font-weight:950;line-height:.75;letter-spacing:-.1em;color:var(--brand)}.story-section h2{margin:0 0 28px;font-family:var(--display);font-size:clamp(52px,6vw,96px);line-height:.9;letter-spacing:-.06em;font-weight:500}.story-section p{max-width:800px;font-size:19px;color:var(--muted)}.story-section--blue p{color:var(--ink)}.values-grid{padding:100px clamp(20px,6vw,96px);display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}.values-grid article{padding:38px;background:#fff}.values-grid h3{font-family:var(--display);font-size:35px;font-weight:500}.values-grid p{color:var(--muted)}

.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.video-placeholder{min-height:540px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;border-radius:30px;position:relative;overflow:hidden}.video-placeholder--red{background:var(--brand);color:#fff}.video-placeholder--blue{background:var(--blue)}.video-placeholder--yellow{background:var(--yellow)}.video-placeholder>span{position:absolute;left:28px;top:25px;font-size:9px;font-weight:900;letter-spacing:.14em}.video-placeholder button{position:absolute;left:50%;top:42%;width:92px;height:92px;border:2px solid currentColor;border-radius:50%;background:transparent;font-size:30px;transform:translate(-50%,-50%)}.video-placeholder h2{margin:0;font-family:var(--display);font-size:46px;line-height:.95;font-weight:500}.video-placeholder p{max-width:400px}

.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px}.contact-card{min-height:560px;padding:50px;border-radius:36px;display:flex;flex-direction:column;justify-content:flex-end}.contact-card--red{background:var(--brand);color:#fff}.contact-card--blue{background:var(--blue)}.contact-card h2{margin:0 0 20px;font-family:var(--display);font-size:clamp(48px,5vw,78px);line-height:.92;font-weight:500}.contact-card p{font-size:18px}.contact-card .button{align-self:flex-start;margin-top:20px}

.timeline-section{padding:80px clamp(20px,6vw,96px) 120px}.timeline-section article{display:grid;grid-template-columns:180px 1fr;gap:50px;padding:55px 0;border-top:1px solid var(--line)}.timeline-section article>span{font-size:74px;font-weight:950;color:var(--brand);letter-spacing:-.08em}.timeline-section h2{margin:0 0 14px;font-family:var(--display);font-size:clamp(42px,5vw,78px);line-height:.95;font-weight:500}.timeline-section p{max-width:800px;color:var(--muted);font-size:18px}

.commerce-layout,.checkout-layout{padding:90px clamp(20px,6vw,96px) 120px;display:grid;grid-template-columns:1fr 390px;gap:50px;align-items:start}.cart-lines{border-top:1px solid var(--line)}.cart-row{display:grid;grid-template-columns:95px 1fr auto auto;gap:25px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}.cart-row img{width:78px}.cart-row h3{margin:8px 0 2px;font-family:var(--display);font-size:28px;font-weight:500}.cart-row p{margin:0;color:var(--muted)}.order-summary{position:sticky;top:110px;padding:32px;background:var(--ink);color:#fff;border-radius:28px}.order-summary>div:not(.summary-mini-book){display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.18)}.order-summary .summary-total{padding:24px 0;font-size:20px}.order-summary .button{width:100%;margin-top:20px}.summary-note{font-size:11px;color:rgba(255,255,255,.55)}.checkout-form{display:grid;gap:28px}.form-section{padding:40px;border:1px solid var(--line);border-radius:30px}.form-section h2{font-family:var(--display);font-size:48px;font-weight:500}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field-grid label{display:grid;gap:8px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.field-grid input,.search-form input{height:54px;padding:0 16px;border:1px solid var(--ink);border-radius:10px;background:#fff}.field-full{grid-column:1/-1}.payment-placeholder{padding:24px;display:flex;gap:20px;border:2px dashed var(--line);border-radius:16px}.payment-placeholder i{width:54px;height:38px;border:2px solid var(--ink);border-radius:7px}.payment-placeholder p{margin:5px 0;color:var(--muted)}.summary-mini-book{display:grid;grid-template-columns:55px 1fr;gap:14px;align-items:center;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.18)}.summary-mini-book img{width:45px}

.confirmation-card{max-width:980px;margin:150px auto 110px;padding:70px;background:var(--yellow);border-radius:40px;text-align:center}.confirmation-icon{display:grid;place-items:center;width:88px;height:88px;margin:0 auto 28px;border:3px solid var(--ink);border-radius:50%;font-size:40px}.confirmation-card h2{font-family:var(--display);font-size:clamp(54px,6vw,90px);line-height:.9;font-weight:500}.confirmation-card>p{max-width:650px;margin:20px auto 40px}.confirmation-grid{display:grid;grid-template-columns:repeat(3,1fr);margin:40px 0;border:1px solid var(--ink)}.confirmation-grid div{padding:22px;border-right:1px solid var(--ink)}.confirmation-grid div:last-child{border:0}.confirmation-grid span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.confirmation-grid strong{display:block;margin-top:7px}

.account-layout{padding:90px clamp(20px,6vw,96px) 120px;display:grid;grid-template-columns:280px 1fr;gap:50px}.account-nav{display:flex;flex-direction:column;border-top:1px solid var(--line)}.account-nav a{padding:17px 0;border-bottom:1px solid var(--line);font-weight:800}.account-nav a.is-active{color:var(--brand)}.account-panel{padding:50px;background:var(--gray);border-radius:32px}.account-panel h2{font-family:var(--display);font-size:62px;font-weight:500}.account-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}.account-cards article{padding:30px;background:#fff;border-radius:20px}.account-cards span{display:block;color:var(--muted)}.account-cards strong{display:block;font-size:50px}.account-cards a{font-weight:800}

.search-form{display:grid;grid-template-columns:1fr auto;gap:12px;max-width:900px}.search-count{margin:35px 0;color:var(--muted)}.search-results{border-top:1px solid var(--line)}.search-results article{display:grid;grid-template-columns:100px 1fr 1fr auto;gap:25px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line)}.search-results article>span{font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.search-results h2{margin:0;font-family:var(--display);font-size:35px;font-weight:500}.search-results p{color:var(--muted)}.search-results a{font-weight:800}

.not-found{min-height:100svh;padding:130px clamp(20px,6vw,96px) 80px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.not-found__number{font-size:clamp(190px,30vw,520px);font-weight:950;line-height:.7;letter-spacing:-.13em;color:var(--brand)}.not-found h1{margin:0 0 25px;font-family:var(--display);font-size:clamp(60px,7vw,112px);line-height:.86;font-weight:500}.not-found p{font-size:19px;color:var(--muted)}

.legal-layout{display:grid;grid-template-columns:260px 1fr;gap:70px}.legal-layout aside{position:sticky;top:110px;align-self:start}.legal-layout aside nav{display:flex;flex-direction:column;margin-top:25px;border-top:1px solid var(--line)}.legal-layout aside a{padding:13px 0;border-bottom:1px solid var(--line)}.legal-layout article{max-width:880px}.legal-layout article section{padding:20px 0 70px;border-bottom:1px solid var(--line)}.legal-layout h2{font-family:var(--display);font-size:54px;line-height:.95;font-weight:500}.legal-layout p,.legal-layout li{font-size:18px;color:var(--muted)}

.faq--page{padding-top:100px}.section-intro--compact{grid-template-columns:.5fr 1fr 1fr}

@media(max-width:1180px){.demo-product-grid,.demo-product-grid--home{grid-template-columns:repeat(2,1fr)}.page-hero{grid-template-columns:.9fr 1.1fr}.video-grid{grid-template-columns:1fr 1fr}.values-grid{grid-template-columns:repeat(2,1fr)}.commerce-layout,.checkout-layout{grid-template-columns:1fr 340px}}
@media(max-width:900px){
 .site-header--red .site-nav{background:var(--brand);color:#fff}.site-header--red .site-nav a{border-color:rgba(255,255,255,.25)}
 .demo-notice{margin-top:68px;flex-direction:column;gap:2px;padding:8px 20px}
 .hero-stage::before{inset:2% -10% 4%;border-radius:30px}.hero-deck{top:75%;width:330px;height:76px}.hero-address-card{left:4%;top:6%;width:270px;padding:25px}.hero[data-state="mission"] .hero-deck{left:58%;top:65%;width:300px;height:150px}.hero[data-state="mission"] .route-line{left:44%;top:61%;width:80%}
 .page-hero{margin-top:68px;padding:clamp(48px,8vw,72px) 20px;grid-template-columns:1fr;gap:20px}.page-hero h1{font-size:clamp(46px,13vw,60px);line-height:.92}.page-hero__visual{min-height:380px}.page-hero__visual--route .route-card{width:270px;left:5%}.route-books i{width:110px}.route-books i:nth-child(1){left:35%}.route-books i:nth-child(2){left:51%}.route-books i:nth-child(3){left:67%}
 .catalog-section,.mission-list-section,.profile-section,.contact-layout,.video-grid,.content-grid,.legal-layout,.search-section{padding:80px 20px}.catalog-toolbar{align-items:flex-start;flex-direction:column}.demo-product-grid,.demo-product-grid--home{grid-template-columns:1fr 1fr}.demo-cover-wrap{min-height:360px;padding:28px}.demo-mission-list,.profile-section,.content-band,.content-grid,.contact-layout,.mission-detail,.product-detail{grid-template-columns:1fr}.product-detail{padding:120px 20px 80px}.product-detail__art{min-height:520px}.product-detail__copy h1{font-size:72px}.split-info{grid-template-columns:1fr}.content-band{padding:80px 20px}.mission-detail{padding:120px 20px 70px}.mission-book-list{padding:70px 20px}.mission-line-items article{grid-template-columns:76px 1fr}.mission-line-items>article>strong{grid-column:2}.mission-total{align-items:flex-start;flex-direction:column}.profile-section{gap:25px}.requirement-list{grid-template-columns:1fr}.disabled-panel{margin:0 20px 80px;padding:38px;grid-template-columns:1fr}.story-section{padding:80px 20px;grid-template-columns:1fr}.story-number{font-size:150px}.values-grid{padding:1px;grid-template-columns:1fr 1fr}.video-grid{grid-template-columns:1fr}.timeline-section{padding:40px 20px 80px}.timeline-section article{grid-template-columns:90px 1fr;gap:20px}.commerce-layout,.checkout-layout{padding:70px 20px 90px;grid-template-columns:1fr}.order-summary{position:static}.field-grid{grid-template-columns:1fr}.field-full{grid-column:auto}.confirmation-card{margin:110px 20px 80px;padding:38px}.confirmation-grid{grid-template-columns:1fr}.confirmation-grid div{border-right:0;border-bottom:1px solid var(--ink)}.account-layout{padding:70px 20px 90px;grid-template-columns:1fr}.account-cards{grid-template-columns:1fr}.search-results article{grid-template-columns:1fr;gap:8px}.not-found{padding:110px 20px 60px;grid-template-columns:1fr}.not-found__number{font-size:210px}.legal-layout{grid-template-columns:1fr}.legal-layout aside{position:static}.section-intro--compact{grid-template-columns:1fr}
}
@media(max-width:620px){
 .demo-product-grid,.demo-product-grid--home{grid-template-columns:1fr}.demo-cover-wrap{min-height:430px}.hero-deck{width:280px}.hero-address-card{width:235px}.hero-address-card strong{font-size:27px}.hero[data-state="mission"] .hero-deck{left:55%;width:265px}.page-hero__visual{min-height:360px}.page-hero__visual--stack i{width:130px}.shelf-books i{width:100px}.shelf-books i:nth-child(1){left:1%}.shelf-books i:nth-child(2){left:20%}.shelf-books i:nth-child(3){left:39%}.shelf-books i:nth-child(4){left:58%}.shelf-books i:nth-child(5){left:77%}.page-hero__visual--route .route-card{width:230px}.route-books i{width:90px}.demo-notice span{font-size:10px}.cart-row{grid-template-columns:72px 1fr}.cart-row .quantity-control,.cart-row>strong{grid-column:2}.values-grid{grid-template-columns:1fr}.visual-route-card{width:270px;left:7%;top:10%}.visual-book-bundle i{width:105px}.visual-shipment{left:26%;right:4%;height:150px}.pathway-stage[data-pathway="mission"] .visual-route-card{left:5%}.pathway-stage[data-pathway="group"] .visual-route-card{left:5%}.confirmation-grid div:last-child{border-bottom:0}
}
