/* Local LaneRunner fonts — no external font requests */
@font-face {
  font-family: "Audiowide";
  src: url("../fonts/Audiowide-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-Light.ttf") format("truetype");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-Italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-MediumItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-SemiBoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Chakra Petch";
  src: url("../fonts/ChakraPetch-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}


:root {
  --bg: #050607;
  --bg-soft: #090b0d;
  --panel: rgba(8, 11, 13, 0.9);
  --panel-solid: #0a0d0f;
  --panel-raised: #0d1114;
  --line: rgba(255,255,255,.09);
  --line-cyan: rgba(38, 202, 207, .45);
  --line-orange: rgba(246, 166, 0, .48);
  --text: #f4f6f6;
  --muted: #a8b0b2;
  --muted-2: #6f7779;
  --cyan: #28c9cf;
  --cyan-bright: #52e3e7;
  --cyan-dark: #148b90;
  --orange: #f4a400;
  --orange-bright: #ffba21;
  --orange-dark: #a86e00;
  --max: 1440px;
  --header-h: 74px;
  --font-head: "Audiowide", "Eurostile", "Arial Black", sans-serif;
  --font-body: "Chakra Petch", "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html {
  background: var(--bg);
  color-scheme: dark;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background:
    radial-gradient(circle at 80% -15%, rgba(40,201,207,.07), transparent 35rem),
    linear-gradient(180deg, #050607 0%, #07090a 50%, #050607 100%);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }
.site-shell { min-height: 100vh; overflow: hidden; }

.topbar {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(22px, 4vw, 68px);
  border-bottom: 1px solid rgba(255,255,255,.05);
  background: rgba(3,4,5,.86);
  backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  font-family: var(--font-head);
  letter-spacing: .02em;
}

.brand-mark {
  position: relative;
  width: 28px;
  height: 25px;
  display: inline-block;
}

.brand-mark::before {
  content: "";
  position: absolute;
  inset: 1px 4px 1px 1px;
  border: 3px solid var(--orange);
  clip-path: polygon(25% 0,100% 0,100% 75%,75% 100%,0 100%,0 25%);
}

.brand-mark span { display: none; }

.brand-mark::after {
  content:"";
  position:absolute;
  width: 19px;
  height: 3px;
  left: 11px;
  top: 11px;
  background: var(--cyan);
  box-shadow: 8px 0 0 var(--cyan);
}

.brand-word {
  font-family: var(--font-head);
  font-size: .96rem;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.2vw, 34px);
  font-family: var(--font-head);
  font-size: .65rem;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.main-nav a {
  position: relative;
  color: #d7dcdd;
  text-decoration: none;
  transition: color .16s ease;
}

.main-nav a::after {
  content:"";
  position:absolute;
  left: 0;
  right: 100%;
  bottom: -11px;
  height: 2px;
  background: var(--orange);
  transition: right .16s ease;
}

.main-nav a:hover,
.main-nav a:focus-visible { color: var(--cyan-bright); }

.main-nav a[aria-current="page"] { color: var(--cyan-bright); }

.main-nav a:hover::after,
.main-nav a:focus-visible::after { right: 0; }

.main-nav a[aria-current="page"]::after { right: 0; }

.menu-toggle {
  display: none;
  border: 0;
  background: none;
  color: var(--text);
  font: inherit;
}

.hero {
  position: relative;
  min-height: min(900px, 100svh);
  padding: calc(var(--header-h) + 95px) clamp(24px, 7vw, 112px) 72px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(3,4,5,.97) 0%, rgba(3,4,5,.84) 38%, rgba(3,4,5,.33) 67%, rgba(3,4,5,.12) 100%),
    linear-gradient(180deg, rgba(3,4,5,.14) 0%, rgba(3,4,5,.14) 70%, rgba(3,4,5,.9) 100%),
    url("../images/lanerunner-hero.png") center center / cover no-repeat;
}

.hero::after {
  content:"";
  position:absolute;
  inset: var(--header-h) 0 0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(244,164,0,.8) 0 2px, transparent 2px) left 34px top 44px / 2px 160px no-repeat,
    linear-gradient(90deg, rgba(40,201,207,.55) 0 2px, transparent 2px) right 38px bottom 100px / 2px 120px no-repeat;
  opacity:.75;
}

.hero-grid,
.hero-orbit,
.hero-marker { display: none; }

.hero-content {
  position: relative;
  z-index: 2;
  width: min(760px, 62vw);
  padding: 18px 0;
}

.eyebrow {
  display: flex;
  gap: 14px;
  margin-bottom: 26px;
  font-family: var(--font-head);
  font-size: .62rem;
  letter-spacing: .04em;
  color: var(--cyan);
  text-transform: uppercase;
}

.eyebrow span + span { color: var(--orange); }
.eyebrow span + span::before { content: "//"; margin-right: 14px; color: var(--muted-2); }

.hero h1,
.section h2,
.pillar h3,
.access-card h2 {
  font-family: var(--font-head);
  font-weight: 400;
  text-wrap: balance;
}

.hero h1 {
  margin: 0;
  font-size: clamp(3.25rem, 6.5vw, 6.7rem);
  line-height: 1.03;
  letter-spacing: -.025em;
  text-transform: uppercase;
  text-shadow: 0 2px 18px #000;
}

.hero h1::first-line { color: #fff; }

.hero-copy {
  max-width: 650px;
  margin: 30px 0 0;
  color: #c8cecf;
  font-size: 1.08rem;
  line-height: 1.6;
  text-shadow: 0 2px 8px #000;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.button {
  min-height: 54px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  background: rgba(4,5,6,.74);
  text-decoration: none;
  text-transform: uppercase;
  font-family: var(--font-head);
  font-size: .66rem;
  letter-spacing: .035em;
  clip-path: polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  transition: background .16s ease, color .16s ease, transform .16s ease;
}

.button:hover,
.button:focus-visible { transform: translateY(-2px); }

.button-primary {
  color: var(--orange-bright);
  border: 1px solid var(--orange);
  box-shadow: inset 0 0 0 1px rgba(244,164,0,.05);
}

.button-primary:hover,
.button-primary:focus-visible {
  background: rgba(244,164,0,.12);
  color: #fff;
}

.button-ghost {
  color: var(--cyan-bright);
  border: 1px solid var(--cyan-dark);
}

.button-ghost:hover,
.button-ghost:focus-visible {
  background: rgba(40,201,207,.11);
  border-color: var(--cyan);
}

.hero-status {
  position:absolute;
  z-index:2;
  right: clamp(24px, 4vw, 64px);
  bottom: 38px;
  display:flex;
  gap: 22px;
  font-family: var(--font-head);
}

.hero-status > div {
  padding-left: 10px;
  border-left: 1px solid var(--line-cyan);
}

.hero-status > div:nth-child(2) { border-left-color: var(--line-orange); }

.status-label {
  display:block;
  color: var(--muted-2);
  font-size: .48rem;
}

.hero-status strong {
  display:block;
  margin-top: 4px;
  color: var(--cyan);
  font-size: .55rem;
  font-weight:400;
}

.quick-access {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  max-width:var(--max);
  margin:-1px auto 0;
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
  background:#050607;
}

.access-card {
  min-height: 190px;
  padding: 30px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:end;
  gap:20px;
  border-right:1px solid var(--line);
  border-top:2px solid transparent;
  text-decoration:none;
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.002));
  transition: background .18s ease, border-color .18s ease;
}

.access-card:nth-child(1) { border-top-color: var(--orange); }
.access-card:nth-child(2) { border-top-color: var(--cyan); }
.access-card:nth-child(3) { border-top-color: var(--orange); }
.access-card:last-child { border-right:0; }

.access-card:hover { background:var(--panel-raised); }

.access-index {
  align-self:start;
  color:var(--muted-2);
  font-family:var(--font-head);
  font-size:.52rem;
}

.access-kicker,
.eyebrow-text {
  color:var(--cyan);
  font-family:var(--font-head);
  font-size:.54rem;
  letter-spacing:.025em;
  text-transform:uppercase;
}

.access-card:nth-child(odd) .access-kicker { color: var(--orange); }

.access-card h2 {
  margin:5px 0 7px;
  font-size:1.5rem;
  text-transform:uppercase;
  letter-spacing:-.015em;
}

.access-card p {
  margin:0;
  max-width:310px;
  color:var(--muted);
  font-size:.92rem;
}

.access-arrow { color:var(--orange); font-size:1.2rem; }
.access-card:nth-child(2) .access-arrow { color: var(--cyan); }

.section {
  max-width:var(--max);
  margin:0 auto;
  padding:100px clamp(24px,5vw,72px);
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
  border-top:1px solid var(--line);
  background:rgba(5,6,7,.5);
}

.section-label {
  display:flex;
  gap:12px;
  margin-bottom:55px;
  color:var(--muted-2);
  font-family:var(--font-head);
  font-size:.52rem;
  letter-spacing:.035em;
}

.section-label span:first-child { color:var(--orange); }

.intro-layout {
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:clamp(42px,8vw,120px);
  align-items:start;
}

.intro-heading h2,
.workflow h2,
.universe-teaser h2,
.final-cta h2 {
  margin:12px 0 0;
  font-size:clamp(2.5rem,4.7vw,4.8rem);
  line-height:1.08;
  letter-spacing:-.025em;
  text-transform:uppercase;
}

.intro-copy {
  padding-top:20px;
  color:#bbc2c3;
  font-size:1.05rem;
}

.intro-copy p { margin:0 0 22px; }

.pillars { padding-bottom:0; }

.pillar-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  margin:0 calc(clamp(24px,5vw,72px) * -1);
  border-top:1px solid var(--line);
}

.pillar {
  min-height:330px;
  padding:34px clamp(24px,4vw,56px);
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(255,255,255,.012),transparent 55%);
}

.pillar:nth-child(even) { border-right:0; }

.pillar::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:90px;
  height:2px;
  background:var(--cyan);
}
.pillar:nth-child(2n)::before { background:var(--orange); }

.pillar-number {
  display:block;
  margin-top:110px;
  color:var(--muted-2);
  font-family:var(--font-head);
  font-size:.5rem;
}

.pillar h3 {
  margin:9px 0 10px;
  font-size:1.8rem;
  line-height:1.15;
  text-transform:uppercase;
}

.pillar p {
  max-width:520px;
  margin:0;
  color:var(--muted);
}

.pillar-visual {
  position:absolute;
  left:32px;
  right:32px;
  top:22px;
  height:100px;
  opacity:.52;
}

.orbit-visual .orbit-line {
  position:absolute;
  border:1px solid rgba(40,201,207,.42);
  border-radius:50%;
  left:11%;
  top:50%;
  transform:translateY(-50%) scaleY(.27) rotate(-8deg);
}
.orbit-visual .one { width:190px;height:190px; }
.orbit-visual .two { width:120px;height:120px;left:20%;border-color:rgba(244,164,0,.5);transform:translateY(-50%) scaleY(.22) rotate(20deg); }
.orbit-point { position:absolute;left:36%;top:49%;width:7px;height:7px;background:var(--orange);transform:rotate(45deg); }

.signal-visual { display:flex;align-items:end;gap:7px;padding:10px 10%; }
.signal-visual span { flex:1;max-width:42px;border-top:1px solid rgba(40,201,207,.5);border-bottom:1px solid rgba(40,201,207,.25); }
.signal-visual span:nth-child(1){height:24px}.signal-visual span:nth-child(2){height:50px}.signal-visual span:nth-child(3){height:82px;background:rgba(244,164,0,.05);border-color:rgba(244,164,0,.55)}.signal-visual span:nth-child(4){height:46px}.signal-visual span:nth-child(5){height:30px}

.grid-visual {
  background-image:linear-gradient(rgba(40,201,207,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(40,201,207,.14) 1px,transparent 1px);
  background-size:20px 20px;
  mask-image:linear-gradient(90deg,black,transparent 75%);
}
.grid-visual span { position:absolute;width:42px;height:42px;left:34%;top:38%;border:1px solid var(--orange); }
.grid-visual span::before,.grid-visual span::after{content:"";position:absolute;background:var(--orange)}
.grid-visual span::before{width:65px;height:1px;left:-12px;top:20px}.grid-visual span::after{width:1px;height:65px;left:20px;top:-12px}

.fracture-visual span { position:absolute;display:block;height:1px;background:rgba(40,201,207,.5);transform-origin:left center; }
.fracture-visual span:nth-child(1){width:170px;left:12%;top:64%;transform:rotate(-18deg)}
.fracture-visual span:nth-child(2){width:135px;left:42%;top:43%;transform:rotate(23deg);background:rgba(244,164,0,.55)}
.fracture-visual span:nth-child(3){width:100px;left:34%;top:43%;transform:rotate(72deg)}

.workflow-panel,
.universe-card {
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:0;
  background:var(--panel-solid);
  border:1px solid rgba(255,255,255,.11);
  clip-path:polygon(15px 0,100% 0,100% calc(100% - 15px),calc(100% - 15px) 100%,0 100%,0 15px);
}

.workflow-panel { border-top:2px solid var(--cyan); }
.universe-card { border-top:2px solid var(--orange); }

.workflow-copy,
.universe-copy { padding:clamp(34px,5vw,66px); }

.workflow h2,
.universe-teaser h2 { font-size:clamp(2.25rem,3.7vw,4rem); }

.workflow-copy > p:not(.eyebrow-text),
.universe-copy > p:not(.eyebrow-text) {
  max-width:580px;
  color:var(--muted);
}

.text-link {
  display:inline-flex;
  gap:16px;
  margin-top:20px;
  color:var(--text);
  text-decoration:none;
  text-transform:uppercase;
  font-family:var(--font-head);
  font-size:.58rem;
}
.text-link span { color:var(--orange); }

.workflow-diagram {
  padding:44px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-left:1px solid var(--line);
  background:
    linear-gradient(rgba(40,201,207,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(40,201,207,.07) 1px,transparent 1px);
  background-size:32px 32px;
}

.workflow-step {
  width:min(100%,430px);
  margin:0 auto;
  min-height:72px;
  padding:14px 20px;
  display:grid;
  grid-template-columns:44px 1fr;
  align-items:center;
  background:#080a0c;
  border:1px solid rgba(255,255,255,.14);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
}

.workflow-step.active { border-color:var(--orange); }
.workflow-step > span { grid-row:1 / span 2;color:var(--orange);font-family:var(--font-head);font-size:.5rem; }
.workflow-step strong { font-family:var(--font-head);font-size:.65rem;font-weight:400; }
.workflow-step small { color:var(--muted);font-size:.72rem; }
.workflow-connector { width:1px;height:24px;margin:0 auto;background:linear-gradient(var(--orange),var(--cyan)); }

.universe-card { grid-template-columns:1fr 1fr; }

.star-chart {
  position:relative;
  min-height:500px;
  overflow:hidden;
  border-left:1px solid var(--line);
  background:
    radial-gradient(circle at 45% 50%,rgba(40,201,207,.08),transparent 18rem),
    linear-gradient(rgba(40,201,207,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(40,201,207,.08) 1px,transparent 1px);
  background-size:auto,50px 50px,50px 50px;
}

.star { position:absolute;width:7px;height:7px;background:#fff;border-radius:50%;box-shadow:0 0 18px rgba(255,255,255,.45); }
.s1{left:26%;top:53%;width:10px;height:10px;background:var(--orange)}
.s2{left:61%;top:35%;background:var(--cyan)} .s3{left:72%;top:66%;width:5px;height:5px}.s4{left:43%;top:72%;width:4px;height:4px}.s5{left:82%;top:24%;width:3px;height:3px}
.chart-line{position:absolute;height:1px;background:rgba(40,201,207,.38);transform-origin:left center}
.l1{width:210px;left:27%;top:53%;transform:rotate(-28deg)}.l2{width:260px;left:27%;top:53%;transform:rotate(17deg)}.l3{width:140px;left:44%;top:72%;transform:rotate(-70deg)}.l4{width:120px;left:61%;top:35%;transform:rotate(-19deg)}
.chart-label{position:absolute;color:var(--muted);font-family:var(--font-head);font-size:.46rem}.c1{left:21%;top:57%;color:var(--orange)}.c2{left:63%;top:30%;color:var(--cyan)}.c3{left:73%;top:69%}

.final-cta {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:40px;
  background:linear-gradient(100deg,rgba(244,164,0,.035),rgba(40,201,207,.025) 65%,transparent);
}
.final-cta h2 { max-width:850px;font-size:clamp(2.4rem,4.4vw,4.7rem); }

.footer {
  max-width:var(--max);
  min-height:170px;
  margin:0 auto;
  padding:50px clamp(24px,5vw,72px);
  border:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr auto;
  align-items:start;
  gap:16px 40px;
  color:var(--muted);
  font-size:.78rem;
  background:#040506;
}
.footer-brand { grid-row:1 / span 2;align-self:center; }
.footer p { margin:0; }
.footer-meta { color:var(--muted-2); }

/* Subpages */
.subpage {
  min-height:100svh;
  padding:calc(var(--header-h) + 70px) clamp(24px,6vw,96px) 80px;
  background:
    radial-gradient(circle at 80% 15%,rgba(40,201,207,.06),transparent 28rem),
    #050607;
}
.subpage-inner { max-width:1050px;margin:0 auto; }
.subpage .eyebrow-text { display:block;margin-bottom:16px; }
.subpage h1 {
  margin:0;
  max-width:900px;
  font-family:var(--font-head);
  font-size:clamp(3rem,7vw,7rem);
  line-height:.98;
  letter-spacing:-.025em;
  text-transform:uppercase;
}
.subpage .lede { max-width:720px;margin-top:30px;color:#bbc2c3;font-size:1.08rem; }
.placeholder-box {
  margin-top:48px;
  padding:28px;
  border:1px solid rgba(40,201,207,.32);
  border-top:2px solid var(--orange);
  background:var(--panel-solid);
  color:var(--muted);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
}
.placeholder-box strong { color:var(--cyan-bright);font-family:var(--font-head);font-weight:400; }
.back-link { margin-top:34px; }

@media (max-width:920px) {
  :root { --header-h:68px; }
  .menu-toggle { display:inline-flex;gap:12px;align-items:center;cursor:pointer;font-family:var(--font-head);font-size:.6rem; }
  .menu-icon,.menu-icon::before,.menu-icon::after{display:block;width:20px;height:1px;background:currentColor;transition:transform .16s ease,opacity .16s ease}
  .menu-icon{position:relative}.menu-icon::before,.menu-icon::after{content:"";position:absolute;left:0}.menu-icon::before{top:-6px}.menu-icon::after{top:6px}
  .menu-toggle[aria-expanded="true"] .menu-icon{background:transparent}.menu-toggle[aria-expanded="true"] .menu-icon::before{top:0;transform:rotate(45deg)}.menu-toggle[aria-expanded="true"] .menu-icon::after{top:0;transform:rotate(-45deg)}

  .main-nav {
    position:fixed;
    inset:var(--header-h) 0 auto;
    padding:25px;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:rgba(3,4,5,.985);
    border-bottom:1px solid var(--line-orange);
  }
  .main-nav.open{display:flex}
  .main-nav a{padding:14px 4px;border-bottom:1px solid var(--line)}

  .hero { min-height:780px;padding-top:calc(var(--header-h) + 78px);background-position:58% center; }
  .hero-content { width:min(700px,88vw); }
  .hero h1 { font-size:clamp(3rem,11vw,6rem); }
  .hero-status { display:none; }

  .quick-access,.pillar-grid{grid-template-columns:1fr}
  .access-card{border-right:0;border-bottom:1px solid var(--line)}
  .intro-layout,.workflow-panel,.universe-card{grid-template-columns:1fr}
  .pillar{border-right:0}
  .workflow-diagram,.star-chart{min-height:420px;border-left:0;border-top:1px solid var(--line)}
  .final-cta{align-items:start;flex-direction:column}
  .footer{grid-template-columns:1fr}.footer-brand{grid-row:auto;margin-bottom:18px}
}

@media (max-width:560px) {
  .brand-word{font-size:.76rem}
  .menu-toggle>span:first-child{display:none}
  .hero{min-height:720px;padding-inline:22px;background-position:63% center}
  .hero-content{width:100%}
  .hero h1{font-size:clamp(2.7rem,13vw,4.7rem)}
  .hero-copy{font-size:1rem}
  .eyebrow{flex-direction:column;gap:5px}.eyebrow span+span::before{display:none}
  .hero-actions{flex-direction:column;align-items:stretch}.button{width:100%}
  .section{padding-block:72px}.section-label{margin-bottom:38px}
  .intro-heading h2,.workflow h2,.universe-teaser h2,.final-cta h2{font-size:clamp(2.2rem,10vw,3.8rem)}
  .pillar{min-height:310px;padding-inline:24px}.pillar h3{font-size:1.55rem}
  .workflow-copy,.universe-copy{padding:28px}.workflow-diagram{padding:24px}
  .star-chart{min-height:360px}
  .access-card{min-height:170px;padding:24px;grid-template-columns:auto 1fr}.access-arrow{display:none}
}

@media (prefers-reduced-motion:reduce) {
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}


/* =========================================================
   LaneRunner asset + corner treatment refinements (v3)
   ========================================================= */

.brand-logo {
  display: inline-flex;
  align-items: center;
  height: 42px;
  text-decoration: none;
}

.brand-logo img {
  display: block;
  width: auto;
  height: 34px;
  max-width: min(330px, 45vw);
  object-fit: contain;
}

.footer-brand.brand-logo img {
  height: 30px;
}

.brand-mark,
.brand-word {
  display: none !important;
}

/*
  Buttons keep a rectangular body, but gain a visible diagonal
  colored corner cap instead of simply cutting the corner away.
*/
.button {
  position: relative;
  overflow: visible;
  clip-path: none !important;
  border-radius: 0;
  isolation: isolate;
}

/* Main button body */
.button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: rgba(4,5,6,.82);
  border: 1px solid currentColor;
  clip-path: polygon(
    0 0,
    calc(100% - 13px) 0,
    100% 13px,
    100% 100%,
    13px 100%,
    0 calc(100% - 13px)
  );
}

/* Colored diagonal corner wedge */
.button::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 16px;
  height: 16px;
  z-index: -1;
  background: currentColor;
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}

/* restore text/icon above pseudo layers */
.button > * {
  position: relative;
  z-index: 1;
}

.button-primary,
.button-ghost {
  border: 0 !important;
  background: transparent !important;
}

.button-primary {
  color: var(--orange-bright);
}

.button-primary::before {
  border-color: var(--orange);
}

.button-primary::after {
  background: var(--orange);
}

.button-primary:hover,
.button-primary:focus-visible {
  color: #fff;
}

.button-primary:hover::before,
.button-primary:focus-visible::before {
  background: rgba(244,164,0,.12);
}

.button-ghost {
  color: var(--cyan-bright);
}

.button-ghost::before {
  border-color: var(--cyan-dark);
}

.button-ghost::after {
  background: var(--cyan);
}

.button-ghost:hover,
.button-ghost:focus-visible {
  color: #fff;
}

.button-ghost:hover::before,
.button-ghost:focus-visible::before {
  background: rgba(40,201,207,.11);
  border-color: var(--cyan);
}

/*
  Same LaneRunner corner language for large panels/cards:
  mostly rectangular, with a subtle diagonal upper-right accent.
*/
.workflow-panel,
.universe-card,
.placeholder-box {
  position: relative;
  clip-path: none !important;
  overflow: hidden;
}

.workflow-panel::after,
.universe-card::after,
.placeholder-box::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 18px;
  height: 18px;
  clip-path: polygon(0 0, 100% 0, 100% 100%);
  pointer-events: none;
}

.workflow-panel::after { background: var(--cyan); }
.universe-card::after { background: var(--orange); }
.placeholder-box::after { background: var(--orange); }

.workflow-step {
  clip-path: none !important;
  position: relative;
}

.workflow-step::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 10px;
  height: 10px;
  background: rgba(255,255,255,.18);
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}

.workflow-step.active::after {
  background: var(--orange);
}

@media (max-width: 560px) {
  .brand-logo {
    height: 36px;
  }

  .brand-logo img {
    height: 28px;
    max-width: 58vw;
  }

  .footer-brand.brand-logo img {
    height: 26px;
  }
}

/* Legal pages */
.legal-page{min-height:75svh;padding:calc(var(--header-h) + 80px) clamp(24px,6vw,96px) 100px}
.legal-inner{max-width:900px;margin:0 auto}
.legal-inner h1{margin:12px 0 20px;font-family:var(--font-head);font-size:clamp(2.8rem,6vw,5.5rem);font-weight:400;text-transform:uppercase;line-height:1}
.legal-lede{max-width:720px;color:var(--muted);font-size:1.1rem;margin-bottom:58px}
.legal-section{padding:30px 0;border-top:1px solid var(--line)}
.legal-section:first-of-type{border-top-color:var(--orange)}
.legal-section h2{margin:0 0 16px;color:var(--cyan-bright);font-family:var(--font-head);font-size:.95rem;font-weight:400;text-transform:uppercase}
.legal-section p{max-width:780px;margin:0 0 14px;color:#c3c9ca}
.legal-section a,.footer-legal-links a{color:var(--orange-bright)}
.footer-legal-links{display:flex;gap:24px;font-family:var(--font-head);font-size:.56rem;text-transform:uppercase}
.legal-footer{align-items:center}

/* Full-height host for the separately built Lifepath application. */
body.lifepath-host {
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}

.lifepath-stage {
  height: 100vh;
  height: 100dvh;
  padding-top: var(--header-h);
  background: #070b18;
}

.lifepath-app {
  display: block;
  width: 100%;
  height: calc(100vh - var(--header-h));
  height: calc(100dvh - var(--header-h));
  border: 0;
  background: #070b18;
  color-scheme: dark;
}

.lifepath-noscript {
  margin: 0;
  padding: 32px;
  color: var(--text);
}