@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/space-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/space-grotesk-latin-700-normal.woff2) format("woff2")}
/* Solar Punk shared foundations. Page templates own composition; this file owns
   reusable controls, cards, theme semantics and the footer. */
:root{
  --sp-font-sans:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --sp-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  --sp-font-display:"Space Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-sans:var(--sp-font-sans);--font-mono:var(--sp-font-mono);
  --sp-canvas:#110b14;--sp-surface:#17101a;--sp-surface-raised:#241a28;
  --sp-text:#f5f1eb;--sp-muted:#c6bdc8;--sp-border:#514553;
  /* Outlines that identify a control: at least 3:1 against the canvas and surfaces. */
  --sp-border-control:#6e6170;
  --sp-accent:#ff7a1a;--sp-link:#ffb04b;--sp-focus:#ffb04b;
  --sp-radius-control:999px;--sp-radius-card:24px;--sp-target:44px;
  --sp-space-1:4px;--sp-space-2:8px;--sp-space-3:12px;--sp-space-4:16px;
  --sp-space-5:24px;--sp-space-6:32px;--sp-space-7:48px;--sp-space-8:64px;
  --sp-duration:180ms;--sp-ease:cubic-bezier(.2,.75,.2,1);
}
body.theme-light{
  --sp-canvas:#f3f0e9;--sp-surface:#fffdf9;--sp-surface-raised:#ebe4dc;
  --sp-text:#170d19;--sp-muted:#625a66;--sp-border:#9b8d9f;
  --sp-link:#923700;--sp-focus:#923700;
}
body{font-family:var(--sp-font-sans)}
/* Read by assistive technology, not shown. */
.sp-visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
:where(a,button,summary,[tabindex]):focus-visible{
  outline:3px solid var(--sp-focus);outline-offset:4px;
  box-shadow:0 0 0 3px var(--sp-surface),0 0 0 7px var(--sp-focus);
}
.sp-button{display:inline-flex;align-items:center;justify-content:center;min-height:var(--sp-target);padding:12px 22px;border:1px solid var(--sp-border-control);border-radius:var(--sp-radius-control);background:var(--sp-surface);color:var(--sp-text);font:700 15px/1.3 var(--sp-font-sans);text-decoration:none;cursor:pointer}
.sp-button--primary{background:var(--sp-accent);border-color:var(--sp-accent);color:#160b18}
.sp-button:hover{filter:brightness(1.08)}
.sp-button:disabled,.sp-button[aria-disabled="true"]{opacity:.6;cursor:default}
.meta-row,.breadcrumb,.vertical-number,.track-section-label{font-family:var(--sp-font-mono)}

/* Track chapters. Each track is a chapter in the page flow: a centred opening (its
   drawing, number, title and the vision as a two-tone lead), then the benefits as a
   walkthrough beside one sticky diagram stage, the strategy pillars as rows, and the
   roadmap as a row of warm pillar cards that slide past as the page scrolls. A glass
   chapter nav holds under the site header with a sliding thumb and a fine
   reading-progress line; on the homepage the header's Conceptualise names the track
   being read. Page scrolling stays the reader's own; sections rise in gently once
   (sp-stories.js), and everything reads without script or with reduced motion.
   Layout follows the 8px rhythm; text never drops below 13px. */
.track-stories{
  --story-sticky-top:80px;
  --ch-line:color-mix(in srgb,var(--sp-text) 12%,transparent);
  --ch-line-2:color-mix(in srgb,var(--sp-text) 22%,transparent);
  --ch-text-2:color-mix(in srgb,var(--sp-text) 78%,transparent);
  --ch-text-3:color-mix(in srgb,var(--sp-text) 60%,transparent);
  --spring:cubic-bezier(.22,1,.36,1);
  position:relative
}
.track-stories h3,.track-stories h4,.track-stories h5{text-wrap:balance}

/* chapter nav */
.chapter-nav{position:sticky;top:var(--story-sticky-top);z-index:20;display:flex;align-items:center;justify-content:center;margin:0 0 clamp(56px,8vw,104px);padding:12px 0;pointer-events:none;transition:background-color .3s,box-shadow .3s}
/* Held under the site header, the nav sits in a quiet full-width band (a shadow, so it
   never widens the page) with a hairline beneath, like a product page's local nav. */
.track-stories.is-stuck .chapter-nav{--band:var(--sp-canvas);background:var(--band);box-shadow:0 0 0 100vmax var(--band),0 1px 0 100vmax var(--ch-line);clip-path:inset(0 -100vmax -1px -100vmax)}
.chapter-seg{position:relative;display:inline-flex;gap:2px;max-width:100%;padding:6px;border:1px solid var(--ch-line);border-radius:999px;background:color-mix(in srgb,var(--sp-surface) 76%,transparent);-webkit-backdrop-filter:saturate(1.6) blur(20px);backdrop-filter:saturate(1.6) blur(20px);box-shadow:0 1px 0 color-mix(in srgb,#fff 7%,transparent) inset,0 20px 44px -26px rgba(0,0,0,.7);pointer-events:auto}
.chapter-seg a{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:0 26px;border-radius:999px;color:var(--ch-text-2);font:600 17px/1 var(--sp-font-sans);text-decoration:none;white-space:nowrap;transition:color .3s var(--spring)}
.chapter-seg a:hover,.chapter-seg a[aria-current]{color:var(--sp-text)}
.chapter-seg a:focus-visible{outline:3px solid var(--sp-focus);outline-offset:-3px}
.chapter-seg-n{font:700 13px/1 var(--sp-font-mono);letter-spacing:.06em;color:var(--ch-text-3);transition:color .3s}
.chapter-seg a[aria-current] .chapter-seg-n{color:var(--sp-accent)}
.chapter-nav-reordered .chapter-seg-n{display:none}
/* reading progress fills the current pill from left to right, reaching its end as the chapter ends */
.chapter-seg-progress{position:absolute;inset:0;z-index:-1;border-radius:inherit;background:color-mix(in srgb,var(--sp-accent) 30%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sp-accent) 45%,transparent);clip-path:inset(0 calc((1 - var(--p,0)) * 100%) 0 0 round 999px);opacity:0;transition:opacity .3s}
.chapter-seg a[aria-current] .chapter-seg-progress{opacity:1}
.chapter-thumb{position:absolute;top:6px;bottom:6px;left:0;width:0;border-radius:999px;background:color-mix(in srgb,var(--sp-text) 9%,transparent);box-shadow:0 1px 0 color-mix(in srgb,#fff 9%,transparent) inset;opacity:0;transition:transform .6s var(--spring),width .6s var(--spring),opacity .3s}
.has-current .chapter-thumb{opacity:1}
body.theme-light .chapter-seg{box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 18px 40px -26px rgba(60,40,30,.45)}
/* On the homepage the site header always carries Conceptualise for the track being
   read, so the chapters' own action rows give way to it once script is running. */
.home-page .track-stories.is-ready .chapter-cta-row{display:none}

/* chapter */
.chapter{position:relative;padding:0 0 clamp(104px,13vw,176px);scroll-margin-top:calc(var(--story-sticky-top) + 96px)}
.chapter+.chapter{padding-top:clamp(104px,13vw,176px)}
.chapter+.chapter::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--ch-line-2) 18%,var(--ch-line-2) 82%,transparent)}
.chapter-head{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:clamp(40px,5vw,64px)}
.chapter-title{display:flex;flex-direction:column;align-items:center;min-width:0;max-width:100%}
.vertical-number{display:block;margin:0 0 20px;font:700 13px/1.4 var(--sp-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sp-link)}
.chapter-own{display:inline-block;margin:0 0 18px;padding:7px 14px;border:1px solid var(--ch-line-2);border-radius:999px;font:700 13px/1.2 var(--sp-font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ch-text-2)}
.chapter-title h3{margin:0;font:700 clamp(38px,5vw,64px)/1 var(--sp-font-display);letter-spacing:-.045em;color:var(--sp-text)}
.chapter-title h3:focus{outline:none}
.chapter-art{position:relative;order:-1;width:clamp(232px,30vw,400px);aspect-ratio:1;margin:0 0 clamp(4px,1vw,12px)}
.chapter-art::before{content:"";position:absolute;inset:-14%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--sp-accent) 20%,transparent),transparent 72%)}
.chapter-art .focus-motion{position:absolute;inset:0;display:block;width:100%;height:100%;-webkit-mask-image:radial-gradient(circle,#000 54%,transparent 72%);mask-image:radial-gradient(circle,#000 54%,transparent 72%)}
.chapter-body{display:grid;gap:clamp(72px,9vw,128px)}
.chapter-section{min-width:0}
/* section headings: Vision, Benefits, Strategy, Roadmap (the track's name is already in
   the chapter title and the nav), one step below the track title and above the content,
   so the hierarchy runs section heading > track title > these > content */
.vert-card .chapter-heading{margin:0 0 clamp(20px,2.4vw,32px);font:700 clamp(26px,2.6vw,36px)/1.1 var(--sp-font-display);letter-spacing:-.03em;color:var(--sp-text);text-wrap:balance}

/* vision: a two-tone lead, centred under the title */
.chapter-vision{text-align:center}
.card-lead{margin:0 auto;max-width:34ch;font:500 clamp(24px,2.6vw,34px)/1.24 var(--sp-font-display);letter-spacing:-.025em;color:var(--ch-text-3);text-wrap:pretty}
.card-lead .lead-strong{color:var(--sp-text)}

/* benefits: unframed text under mid-size orange numerals. A track with scenes reads them as a
   walkthrough: on narrow screens each card sits above its scene; on wide screens one
   sticky stage beside the cards plays the scene of the card being read. The stage is
   the services cards' warm plum panel in both themes, so the scenes keep their glow. */
.benefit-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px);margin:0;padding:0;list-style:none}
.benefit-list li,.walk-text{position:relative;padding:0}
.benefit-list .item-n,.walk-text .item-n{display:block;margin-bottom:14px;font:500 clamp(24px,2.2vw,30px)/1 var(--sp-font-display);letter-spacing:-.03em;color:#ffb27a}
.benefit-list p{margin:0;font:400 18px/1.55 var(--sp-font-sans);color:var(--ch-text-2)}
.walk{display:grid;gap:clamp(48px,7vw,72px);margin:0;padding:0;list-style:none}
.walk-step{display:grid;gap:20px;min-width:0}
.walk-text p{margin:0;max-width:40ch;font:400 clamp(18px,1.6vw,22px)/1.5 var(--sp-font-sans);color:var(--ch-text-2);text-wrap:pretty}
.walk-media{margin:0;min-width:0}
.walk:not(.is-live) .walk-media{display:none}
.walk-frame{position:relative;max-width:640px;margin:0 auto;aspect-ratio:4/3;border-radius:28px;overflow:hidden;background:radial-gradient(120% 90% at 68% 32%,rgba(255,122,26,.14),transparent 60%),linear-gradient(160deg,#261127,#130a15);box-shadow:0 44px 90px -50px rgba(0,0,0,.9)}
.walk-frame::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none}
body.theme-light .walk-frame{box-shadow:0 34px 70px -40px rgba(60,30,30,.55)}
.walk-scene{position:absolute;inset:0;display:block;width:100%;height:100%}
.walk-count{margin-top:14px;text-align:center;font:700 13px/1.4 var(--sp-font-mono);letter-spacing:.08em;color:var(--ch-text-3)}
.walk-count span{color:var(--sp-link)}
@media(min-width:901px){
  .walk.is-live{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:repeat(var(--steps,3),auto);column-gap:clamp(32px,4.5vw,72px);row-gap:clamp(140px,26vh,280px);align-items:start}
  .walk.is-live .walk-step{display:contents}
  .walk.is-live .walk-text{grid-column:1;opacity:.65;transform:scale(.975);transform-origin:left center;transition:opacity .6s var(--spring),transform .7s var(--spring)}
  .walk.is-live .is-current .walk-text{opacity:1;transform:none}
  .walk.is-live .walk-step:last-child .walk-text{margin-bottom:clamp(220px,32vh,340px)}
  .walk.is-live .walk-media{display:none;grid-column:2;grid-row:1/-1;position:sticky;top:max(calc(var(--story-sticky-top) + 96px),calc(50vh - 240px));align-self:start}
  .walk.is-live .is-current .walk-media{display:block;animation:walk-in .7s var(--spring) both}
}
@keyframes walk-in{from{opacity:0;transform:translate3d(0,14px,0) scale(.985)}}

/* strategy: lede, then the pillars as rows */
.strategy-lede{margin:0 0 36px;max-width:56ch;font:400 clamp(18px,1.5vw,21px)/1.55 var(--sp-font-sans);color:var(--ch-text-2)}
.pillar-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--ch-line)}
.pillar-list li{display:grid;grid-template-columns:56px minmax(180px,280px) minmax(0,1fr);gap:8px 32px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--ch-line)}
.pillar-list .item-n{font:700 13px/1.4 var(--sp-font-mono);letter-spacing:.08em;color:var(--ch-text-3)}
.pillar-name{margin:0;font:700 22px/1.25 var(--sp-font-display);letter-spacing:-.018em;color:var(--sp-text)}
.pillar-list p{margin:0;max-width:62ch;font:400 17px/1.6 var(--sp-font-sans);color:var(--ch-text-2)}

/* roadmap: one warm plum card per pillar (the services tiles' panel, dark in both
   themes) in a row. Without script, or on narrow screens or with reduced motion, the
   row scrolls sideways and snaps to each card. On wide screens sp-stories.js pins the
   roadmap under the chapter nav (.is-pinned) and slides the row as the page scrolls. */
.roadmap-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px;margin:0 0 clamp(28px,3.5vw,40px)}
.vert-card .roadmap-title{margin:0}
.roadmap-meta{display:flex;align-items:center;gap:14px;margin:0}
.roadmap-counter{font:700 13px/1 var(--sp-font-mono);letter-spacing:.08em;color:var(--ch-text-3);font-variant-numeric:tabular-nums}
.roadmap-at{color:var(--sp-link)}
.roadmap-viewport{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;margin:0 0 -48px;padding:0 0 48px}
.roadmap-viewport::-webkit-scrollbar{display:none}
.roadmap{display:flex;align-items:stretch;gap:clamp(16px,1.8vw,24px);margin:0;padding:0;list-style:none}
.roadmap-pillar{position:relative;flex:none;display:flex;flex-direction:column;box-sizing:border-box;width:min(600px,86%);min-width:0;scroll-snap-align:start;border-radius:32px;overflow:hidden;
  background:radial-gradient(90% 90% at 28% 40%,rgba(255,122,26,.15),transparent 62%),linear-gradient(160deg,#271129,#130a15);
  border:1px solid rgba(255,150,80,.16);color:#f5f1eb;box-shadow:0 30px 70px -44px rgba(40,12,30,.7);transition:border-color .6s var(--spring)}
.roadmap-pillar::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent 6%,rgba(255,150,80,.55) 30%,rgba(255,150,80,.55) 70%,transparent 94%);pointer-events:none}
.roadmap-pillar.is-current{border-color:rgba(255,150,80,.3)}
.roadmap-pillar-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:30px 32px 18px}
.roadmap-pillar-n{font:600 13px/1.4 var(--sp-font-mono);letter-spacing:.12em;color:#ffb27a}
.roadmap-pillar-head h5{margin:0;font:700 clamp(22px,1.9vw,28px)/1.15 var(--sp-font-display);letter-spacing:-.025em;color:#f5f1eb;text-wrap:balance}
.roadmap-items{flex:1;margin:0;padding:0 32px 12px;list-style:none}
.roadmap-items li{position:relative;padding:14px 0 14px 20px;border-top:1px solid rgba(255,235,220,.1);font:400 16px/1.55 var(--sp-font-sans);color:rgba(245,241,235,.76);text-wrap:pretty}
.roadmap-items li::before{content:"";position:absolute;left:2px;top:calc(14px + .62em);width:6px;height:6px;border-radius:50%;background:var(--sp-accent);box-shadow:0 0 10px rgba(255,122,26,.6)}
.roadmap-items a{color:#ffb27a;text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:rgba(255,178,122,.38);text-underline-offset:4px;transition:text-decoration-color .2s}
.roadmap-items a:hover,.roadmap-items a:focus-visible{text-decoration-color:currentColor}
.roadmap-items .plain{color:#f5f1eb}
.roadmap-related{display:flex;flex-wrap:wrap;align-items:center;gap:0 16px;padding:6px 32px 10px;border-top:1px solid rgba(255,235,220,.1);background:rgba(255,235,220,.035)}
.roadmap-related-label{font:700 13px/1.4 var(--sp-font-mono);letter-spacing:.08em;text-transform:uppercase;color:rgba(245,241,235,.58)}
.roadmap-related-links{display:flex;flex-wrap:wrap;gap:0 20px;margin:0;padding:0;list-style:none}
.related-blog-link{display:inline-flex;align-items:center;min-height:var(--sp-target);color:var(--sp-link);font:600 14px/1.4 var(--sp-font-sans);text-decoration:none}
.roadmap-pillar .related-blog-link{color:#ffb27a}
.related-blog-link:hover{text-decoration:underline;text-underline-offset:3px}
body.theme-light .roadmap-pillar{box-shadow:0 30px 60px -36px rgba(60,30,30,.55)}
/* pinned: the pin holds under the chapter nav while the row slides sideways */
.chapter-roadmap.is-pinned .roadmap-pin{position:sticky;top:var(--pin-top,160px)}
.chapter-roadmap.is-pinned .roadmap-viewport{overflow:hidden;scroll-snap-type:none}
.chapter-roadmap.is-pinned .roadmap{will-change:transform}
/* a title waiting under the nav (short windows) fades while the row is held */
.chapter-roadmap.is-pinned .roadmap-head{transition:opacity .35s}
.chapter-roadmap.is-tucked.is-held .roadmap-head{opacity:0}
/* on the homepage the row runs to the window's right edge, so the next card peeks in,
   but starts and is clipped at the column's left edge, in line with the Roadmap title */
.home-page .roadmap-viewport{margin-right:calc(50% - 50vw);padding-right:calc(50vw - 50%)}
/* wide screens: one wide card in view with the next one peeking, its heading on one
   line and its items in as many columns as fit, so even a long pillar fits under the nav */
@media(min-width:901px){
  .roadmap-pillar{width:min(1180px,88%)}
  .roadmap-pillar-head{padding:32px 40px 18px}
  .roadmap-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));align-content:start;column-gap:40px;padding:0 40px 16px}
  .roadmap-items li:only-child{grid-column:1/-1;max-width:72ch}
  .roadmap-items li{padding:13px 0 13px 20px;font-size:15px;line-height:1.52}
  .roadmap-items li::before{top:calc(13px + .6em)}
  .roadmap-related{padding-left:40px;padding-right:40px}
}

/* the chapter's one primary action */
.chapter-cta-row{display:flex;justify-content:center;margin:0}
/* A track's own articles, on the Blog list filtered to the track. */
.chapter-articles{display:flex;justify-content:center;margin:0 0 32px}
.chapter-articles a{display:inline-flex;align-items:center;min-height:var(--sp-target);color:var(--sp-link);font:600 14px/1.5 var(--sp-font-mono);letter-spacing:.04em;text-decoration:underline;text-underline-offset:5px}
.chapter-articles a:hover{color:var(--sp-text)}
.chapter-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:58px;padding:0 32px;border-radius:999px;background:var(--sp-accent);color:#160b18;font:700 17px/1 var(--sp-font-sans);text-decoration:none;box-shadow:0 18px 40px -18px color-mix(in srgb,var(--sp-accent) 75%,transparent);transition:transform .3s var(--spring),box-shadow .4s var(--spring)}
.chapter-cta svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s var(--spring)}
.chapter-cta:hover{transform:translateY(-2px);box-shadow:0 26px 50px -20px color-mix(in srgb,var(--sp-accent) 85%,transparent)}
.chapter-cta:hover svg{transform:translateX(4px)}
.chapter-cta:active{transform:scale(.98)}
.chapter-cta:focus-visible{outline:3px solid var(--sp-focus);outline-offset:4px}

/* article pages: the post's own track reads in full; the other tracks wait in a
   disclosure after it, and open in full in place */
.track-others{margin:0;border-top:1px solid var(--ch-line-2)}
.track-others>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:var(--sp-target);padding:28px 0;cursor:pointer;list-style:none;color:var(--sp-text);font:700 clamp(22px,2.2vw,30px)/1.2 var(--sp-font-display);letter-spacing:-.025em}
.track-others>summary::-webkit-details-marker{display:none}
.track-others>summary::after{content:"";flex:none;width:12px;height:12px;margin-right:6px;border-right:2px solid var(--sp-link);border-bottom:2px solid var(--sp-link);transform:translateY(-4px) rotate(45deg);transition:transform .3s var(--spring)}
.track-others[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.track-others-hint{display:block;margin-top:6px;font:400 16px/1.5 var(--sp-font-sans);letter-spacing:0;color:var(--ch-text-2)}
.track-others>summary+.chapter{padding-top:clamp(56px,7vw,96px)}

/* sections rise in once as they arrive */
.track-stories.is-ready .chapter-head,.track-stories.is-ready .chapter-section,.track-stories.is-ready .chapter-cta-row{transition:opacity .9s var(--spring),transform .9s var(--spring)}
.track-stories.is-ready .chapter-head:not(.is-in),.track-stories.is-ready .chapter-section:not(.is-in),.track-stories.is-ready .chapter-cta-row:not(.is-in){opacity:0;transform:translate3d(0,28px,0)}
@media(max-width:900px){
  .track-stories.is-ready .walk-step{transition:opacity .9s var(--spring),transform .9s var(--spring)}
  .track-stories.is-ready .walk-step:not(.is-in){opacity:0;transform:translate3d(0,28px,0)}
}

@media(max-width:900px){
  .chapter-art{width:clamp(200px,44vw,280px)}
  .benefit-list{grid-template-columns:minmax(0,1fr);gap:16px}
  .pillar-list li{grid-template-columns:40px minmax(0,1fr);gap:6px 16px}
  .pillar-list p{grid-column:2}
}
@media(max-width:640px){
  .chapter-nav{padding:8px 0}
  .chapter-seg{width:100%}
  .chapter-seg a{flex:auto;justify-content:center;min-height:48px;padding:0 10px;font-size:14px}
  .chapter-seg-n{display:none}
  .roadmap-pillar{width:86%;border-radius:24px}
  .roadmap-pillar-head{padding:24px 22px 14px}
  .roadmap-items,.roadmap-related{padding-left:22px;padding-right:22px}
  .chapter-cta{width:100%}
  .chapter-seg{flex:1 1 auto;width:auto;min-width:0}
  .chapter-seg a{flex:1 1 0;min-width:0;padding:0 6px;white-space:normal;text-align:center;line-height:1.15}
  .chapter-vision{text-align:left}
  .card-lead{max-width:none;margin:0;font-size:22px}
}

.site-footer{max-width:none;margin:0;padding:64px clamp(20px,4vw,64px) 32px;border-radius:0;background:#0a060d;color:#c6bdc8;font:400 14px/1.65 var(--sp-font-sans);letter-spacing:0}
.site-footer .footer-grid{max-width:1370px;margin:auto;display:grid;grid-template-columns:1.05fr .95fr 1.2fr .6fr;gap:48px;padding-bottom:48px}
.site-footer .footer-label{display:block;margin-bottom:16px;color:#ffb04b;font:700 13px/1.4 var(--sp-font-mono);letter-spacing:.08em;text-transform:uppercase}
.site-footer .footer-block{color:#c6bdc8}
.site-footer .footer-block strong{display:block;margin-bottom:14px;color:#f5f1eb;font:700 18px/1.3 var(--sp-font-sans);letter-spacing:0}
.site-footer a{display:inline-flex;align-items:center;min-height:44px;color:#f5f1eb;text-decoration:underline;text-underline-offset:4px;border:0}
.site-footer a:hover{color:#ffb04b}
/* Without JavaScript an email address stays text (data-sp-mail); keep the link's box. */
.site-footer .sp-mail{display:inline-flex;align-items:center;min-height:44px;color:#f5f1eb}
.site-footer .footer-bottom{max-width:1370px;margin:auto;padding-top:24px;border-top:1px solid #514553;display:flex;justify-content:space-between;gap:24px;color:#aaa2ad;font:400 13px/1.5 var(--sp-font-mono);letter-spacing:0;text-transform:none}
@media(min-width:761px) and (max-width:1023px){.site-footer .footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.site-footer .footer-grid{grid-template-columns:1fr;gap:32px}.site-footer .footer-block:last-child{grid-column:auto}.site-footer .footer-bottom{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.roadmap-viewport{scroll-behavior:auto}.roadmap-pillar,.walk-text,.walk-step{transition:none!important}.walk-media{animation:none!important}.track-stories.is-ready .walk-step:not(.is-in){opacity:1;transform:none}.chapter-nav,.chapter-seg a,.chapter-seg-n,.chapter-seg-progress,.chapter-thumb,.chapter-cta,.chapter-cta svg,.track-stories.is-ready .chapter-head,.track-stories.is-ready .chapter-section,.track-stories.is-ready .chapter-cta-row{transition:none}.track-stories.is-ready .chapter-head:not(.is-in),.track-stories.is-ready .chapter-section:not(.is-in),.track-stories.is-ready .chapter-cta-row:not(.is-in){opacity:1;transform:none}}