/* ============================================================================ scrollcraft.css: the taste floor ---------------------------------------------------------------------------- Two layers, and the split matters: TOKENS what you override per brand. Colour roles, the type ramp, the spacing scale, elevation, motion. A brand is ~12 values. DEVICES what the engine drives. Do not restyle these to taste; they are the mechanism. Style your own markup instead. Nothing here draws a "component". There are no card, badge, or pill classes, because a stylesheet that ships those is how every page built on it ends up with the same shapes. You get a floor and a vocabulary; the composition is yours. ========================================================================== */ /* ---------------------------------------------------------------- tokens -- */ :root { /* --- colour roles. Override these six and the page is rebranded. -------- */ --sc-canvas: #08090b; /* the page ground. Drift interpolates this. */ --sc-surface: #101217; /* anything raised off the ground */ --sc-ink: #f4f2ef; /* primary text */ --sc-ink-soft: #9a9ba1; /* secondary text. Tinted, never flat gray. */ --sc-accent: #d8ff3e; /* ONE accent. It owns a region, not confetti. */ --sc-accent-ink: #08090b; /* text that sits on the accent */ --sc-hairline: color-mix(in oklab, var(--sc-ink) 12%, transparent); --sc-hairline-strong: color-mix(in oklab, var(--sc-ink) 22%, transparent); /* --- type. Two families max. Display carries voice, text carries prose. - */ --sc-font-display: "Instrument Sans", "Geist", system-ui, sans-serif; --sc-font-text: "Geist", system-ui, sans-serif; --sc-font-mono: "Geist Mono", ui-monospace, monospace; /* Fluid ramp. Tracking tightens as size grows because a face set at 6rem with 0 tracking reads loose; this is optical correction, not decoration. */ --sc-t-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.82rem); --sc-t-sm: clamp(0.875rem, 0.84rem + 0.18vw, 0.95rem); --sc-t-base: clamp(1rem, 0.96rem + 0.22vw, 1.125rem); --sc-t-lg: clamp(1.2rem, 1.1rem + 0.5vw, 1.5rem); --sc-t-xl: clamp(1.6rem, 1.35rem + 1.2vw, 2.25rem); --sc-t-2xl: clamp(2.1rem, 1.6rem + 2.4vw, 3.4rem); --sc-t-3xl: clamp(2.8rem, 1.9rem + 4.2vw, 5rem); --sc-t-4xl: clamp(3.4rem, 1.9rem + 6.6vw, 7.5rem); --sc-track-tight: -0.035em; --sc-track-snug: -0.02em; --sc-track-normal: -0.005em; --sc-track-wide: 0.08em; --sc-leading-none: 0.94; --sc-leading-tight: 1.06; --sc-leading-body: 1.62; --sc-measure: 62ch; /* --- space. 4px base: the useful middle steps an 8-only scale misses. --- */ --sc-1: 0.25rem; --sc-2: 0.5rem; --sc-3: 0.75rem; --sc-4: 1rem; --sc-5: 1.5rem; --sc-6: 2rem; --sc-7: 3rem; --sc-8: 4rem; --sc-9: 6rem; --sc-10: 8rem; --sc-11: 12rem; /* Section rhythm is fluid so a phone doesn't inherit desktop air. */ --sc-section: clamp(4.5rem, 9vw, 11rem); --sc-gutter: clamp(1.25rem, 5vw, 5.5rem); --sc-maxw: 82rem; /* --- radius. Pick one scale for the page and hold it. ------------------- */ --sc-r-sm: 6px; --sc-r-md: 12px; --sc-r-lg: 20px; --sc-r-pill: 999px; /* --- elevation. Every shadow has an offset AND a soft blur, and is tinted to the canvas hue. A zero-offset coloured halo is decoration, not depth, so there isn't one here. ---------------------------------- */ --sc-shadow-color: 220 40% 2%; --sc-e1: 0 1px 2px hsl(var(--sc-shadow-color) / 0.28), 0 2px 6px -1px hsl(var(--sc-shadow-color) / 0.20); --sc-e2: 0 2px 4px hsl(var(--sc-shadow-color) / 0.24), 0 8px 18px -4px hsl(var(--sc-shadow-color) / 0.30); --sc-e3: 0 4px 8px hsl(var(--sc-shadow-color) / 0.22), 0 18px 40px -8px hsl(var(--sc-shadow-color) / 0.38), 0 48px 90px -24px hsl(var(--sc-shadow-color) / 0.30); /* Edge light: a 1px top highlight sells a raised surface better than any amount of blur, because real raised things catch light on their lip. */ --sc-edge: inset 0 1px 0 color-mix(in oklab, var(--sc-ink) 10%, transparent); /* --- motion. Built-in CSS easings are too weak for UI. ------------------ */ --sc-ease-out: cubic-bezier(0.23, 1, 0.32, 1); --sc-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1); --sc-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1); --sc-d-fast: 160ms; --sc-d-base: 240ms; --sc-d-slow: 420ms; --sc-z-stage: 1; --sc-z-copy: 20; --sc-z-chrome: 60; } /* --------------------------------------------------------------- reset -- */ *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } body { margin: 0; background: var(--sc-canvas); color: var(--sc-ink); font-family: var(--sc-font-text); font-size: var(--sc-t-base); line-height: var(--sc-leading-body); letter-spacing: var(--sc-track-normal); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-synthesis-weight: none; overflow-x: clip; } img, video, canvas, svg { display: block; max-width: 100%; } button, input, select, textarea { font: inherit; color: inherit; } /* ------------------------------------------------- the browser surfaces -- The parts you did not draw still carry the design. Selection, caret, focus ring, scrollbar and tabular numerals all ship with defaults that belong to no design system. Theming them is the cheapest signal that a page was built rather than assembled, and it is the step that gets skipped most reliably. */ ::selection { background: var(--sc-accent); color: var(--sc-accent-ink); } :root { caret-color: var(--sc-accent); accent-color: var(--sc-accent); } :focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 3px; border-radius: var(--sc-r-sm); } :where(a) { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.22em; } @supports (scrollbar-color: auto) { html { scrollbar-color: color-mix(in oklab, var(--sc-ink) 26%, transparent) transparent; scrollbar-width: thin; } } :where(table, .sc-nums, [data-sc-count]) { font-variant-numeric: tabular-nums; } /* ----------------------------------------------------------- typography -- */ .sc-display { font-family: var(--sc-font-display); font-weight: 500; line-height: var(--sc-leading-none); letter-spacing: var(--sc-track-tight); text-wrap: balance; margin: 0; } .sc-display--xl { font-size: var(--sc-t-4xl); } .sc-display--lg { font-size: var(--sc-t-3xl); } .sc-display--md { font-size: var(--sc-t-2xl); letter-spacing: var(--sc-track-snug); } .sc-lede { font-size: var(--sc-t-lg); line-height: 1.44; letter-spacing: var(--sc-track-snug); color: var(--sc-ink); max-width: 46ch; text-wrap: pretty; margin: 0; } .sc-body { max-width: var(--sc-measure); color: var(--sc-ink-soft); text-wrap: pretty; margin: 0; } .sc-label { font-family: var(--sc-font-mono); font-size: var(--sc-t-xs); letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-ink-soft); } /* ---------------------------------------------------------------- layout -- */ .sc-wrap { width: 100%; max-width: var(--sc-maxw); margin-inline: auto; padding-inline: var(--sc-gutter); } .sc-section { padding-block: var(--sc-section); } /* More space above a heading than below it: the gap belongs to the boundary, not to the pair. */ .sc-stack > * + * { margin-top: var(--sc-4); } .sc-stack > :is(h1,h2,h3) { margin-top: var(--sc-7); } .sc-stack > :is(h1,h2,h3):first-child { margin-top: 0; } .sc-rule { height: 1px; border: 0; background: var(--sc-hairline); margin: 0; } /* =============================================================== DEVICES == Driven by the engine. Restyle your own markup, not these. */ .sc-act--pinned { position: relative; } .sc-stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: clip; z-index: var(--sc-z-stage); } /* scrub / sequence media */ .sc-stage :is(video[data-sc-scrub], canvas[data-sc-sequence], .sc-stage__poster) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } video[data-sc-scrub] { opacity: 0; transition: opacity 380ms var(--sc-ease-out); } .sc-has-clip video[data-sc-scrub] { opacity: 1; } /* The poster is a live frame-holder, not a placeholder: it stays up until a real video frame has painted, which is what stops the blank-stage flash. */ .sc-stage__poster { z-index: 0; transition: opacity 380ms var(--sc-ease-out); } .sc-has-clip .sc-stage__poster { opacity: 0; } /* A scrim only where text sits. A full-frame darkening layer flattens the image everywhere to fix contrast in one corner. */ .sc-scrim { position: absolute; inset: 0; pointer-events: none; z-index: 1; background: linear-gradient( var(--sc-scrim-angle, 180deg), color-mix(in oklab, var(--sc-canvas) var(--sc-scrim-a, 78%), transparent) 0%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 42%, transparent 68%); } /* Point the scrim at the copy. A scrim gradient that darkens the top while the copy sits at the bottom fixes contrast nowhere and flattens the image everywhere, which is the most common way text-over-video goes wrong. */ .sc-scrim--bottom { --sc-scrim-angle: 0deg; } .sc-scrim--left { --sc-scrim-angle: 90deg; } .sc-scrim--right { --sc-scrim-angle: 270deg; } /* Corner scrims, for copy anchored to a corner. An edge gradient has to darken a whole band across the frame to cover one corner; a corner gradient puts the density where the text is and leaves the rest of the image alone. Pair with .sc-copy--lead / .sc-copy--trail. */ .sc-scrim--lead { background: linear-gradient(to top right, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 72%, transparent) 30%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 52%, transparent 72%); } .sc-scrim--trail { background: linear-gradient(to top left, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 72%, transparent) 30%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 52%, transparent 72%); } /* A band across the bottom, for copy that spans the full width of the frame. That is what both corner anchors become below 860px, and it is also the right shape whenever the copy block is wider than a corner. */ .sc-scrim--band { background: linear-gradient(to top, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 74%, transparent) 22%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 42%, transparent 58%); } .sc-scrim--vignette { background: radial-gradient(120% 90% at 50% 45%, transparent 40%, color-mix(in oklab, var(--sc-canvas) 70%, transparent) 100%); } /* copy over a stage. max-width is in rem, never ch. A `ch` on this container resolves against the CONTAINER's font-size (body size), not the display size of the heading inside it, so `max-width: 20ch` here silently produces a ~180px column and wraps a hero headline to six lines. Set a ch measure on the text element itself. */ .sc-copy { position: absolute; z-index: var(--sc-z-copy); inset-inline: var(--sc-gutter); max-width: min(46rem, 76vw); will-change: opacity, transform; } .sc-copy--lead { left: var(--sc-gutter); bottom: clamp(3rem, 12vh, 9rem); } /* inset-inline FIRST. It is the shorthand for left+right, so declaring it after `left: 50%` resets left to auto and the block drifts off the left edge. */ .sc-copy--center { inset-inline: auto; left: 50%; top: 50%; translate: -50% -50%; text-align: center; } .sc-copy--trail { inset-inline: auto; right: var(--sc-gutter); bottom: clamp(3rem, 12vh, 9rem); text-align: right; } /* cue defaults: the engine writes opacity/transform inline, these are the pre-paint state so nothing flashes before the first read() */ [data-sc-cue] { opacity: 0; will-change: opacity, transform; } .sc-ready [data-sc-cue] { transition: none; } /* kinetic split */ .sc-split { display: inline-block; overflow: hidden; vertical-align: top; } /* Descenders live below the baseline; a line mask clipped to the line box eats the tails off g, y, p, j. The padding buys them room back. */ .sc-split--line { display: block; padding-bottom: 0.14em; margin-bottom: -0.14em; } .sc-split__i { display: inline-block; will-change: transform, opacity; } .sc-is-split { opacity: 1 !important; } /* horizontal rail */ [data-sc-pan] { display: flex; will-change: transform; } /* reveal + parallax */ [data-sc-reveal] { will-change: clip-path; } [data-sc-parallax] { will-change: transform; } /* flow reveal (fires once) */ [data-sc-in], [data-sc-stagger] > * { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity 620ms var(--sc-ease-out), transform 620ms var(--sc-ease-out); } [data-sc-in].sc-in, [data-sc-stagger] > .sc-in { opacity: 1; transform: none; } /* pointer devices */ [data-sc-tilt] { transform-style: preserve-3d; will-change: transform; } [data-sc-magnet] { will-change: transform; } /* isolation always; position only if nothing more specific already set it. Written with :where() (zero specificity) on purpose: a plain `position: relative` here has the same weight as `.sc-stage` and, being later in the file, silently wins. A stage carrying both attributes then stops being sticky and the whole act scrolls away instead of pinning. */ [data-sc-spotlight] { isolation: isolate; } :where([data-sc-spotlight]) { position: relative; } [data-sc-spotlight]::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2; background: radial-gradient( 28rem 28rem at calc(var(--sc-mx, 0.5) * 100%) calc(var(--sc-my, 0.5) * 100%), color-mix(in oklab, var(--sc-accent) 16%, transparent), transparent 70%); opacity: 0; transition: opacity var(--sc-d-slow) var(--sc-ease-out); } [data-sc-spotlight]:hover::after { opacity: 1; } /* =========================================================== WORLDFLIGHT == One fixed stage for the whole page. The only thing in document flow is the spacer, and it is empty. If you find yourself adding a section here, you want act mode instead: the moment a real block scrolls past the fixed stage, the page has a seam again and the whole point is gone. */ [data-sc-mode="worldflight"] { position: relative; } .sc-world { position: fixed; inset: 0; overflow: clip; z-index: var(--sc-z-stage); background: var(--sc-canvas); } /* Every leg is mounted for the life of the page and stacked in the same box. The engine owns opacity, visibility and z-index here; do not set them. */ .sc-world__seg { position: absolute; inset: 0; opacity: 0; will-change: opacity; } .sc-world__seg > :is(video, img, canvas) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } /* The poster is the frame-holder AND the first camera move: the engine pushes it in slowly until a real decoded frame is available to replace it. */ .sc-world__poster { z-index: 0; transform-origin: 50% 50%; transition: opacity 420ms var(--sc-ease-out); } .sc-world__seg > video { z-index: 1; } .sc-world__seg.sc-has-clip .sc-world__poster { opacity: 0; } /* The act stylesheet lights a clip through its ancestor act. A worldflight leg has no act, so match the class the engine also writes on the clip itself. */ video[data-sc-scrub].sc-has-clip { opacity: 1; } /* The copy layer is fixed too, and inert by default: the engine hands pointer-events back to a block only while it is actually legible. */ .sc-world__copy { position: fixed; inset: 0; z-index: var(--sc-z-copy); pointer-events: none; } .sc-world__scrim { position: absolute; inset: 0; pointer-events: none; z-index: 0; } [data-sc-copy] { opacity: 0; pointer-events: none; will-change: opacity, transform; } .sc-ready [data-sc-copy] { transition: none; } /* The track. Empty on purpose. */ .sc-world__spacer { pointer-events: none; } /* scroll progress */ [data-sc-progress] { position: fixed; inset: 0 0 auto 0; height: 2px; z-index: var(--sc-z-chrome); background: var(--sc-accent); transform-origin: 0 50%; transform: scaleX(0); will-change: transform; } /* ----------------------------------------------------------- atmosphere -- Depth is not only shadow. Grain keeps a flat dark ground from banding, and it is the difference between "a dark page" and "a lit room". */ .sc-grain { position: fixed; inset: 0; pointer-events: none; z-index: 3; opacity: 0.045; } .sc-grain::before { content: ""; position: absolute; inset: -50%; background-image: url("data:image/svg+xml;utf8,"); } /* -------------------------------------------------------- reduced motion -- */ @media (prefers-reduced-motion: reduce) { /* Fewer and gentler, not zero. Opacity still carries the reveal so the page is comprehensible; every position change is dropped. */ [data-sc-in], [data-sc-stagger] > * { transform: none; transition-duration: 220ms; } [data-sc-parallax], [data-sc-pan], .sc-split__i { transform: none !important; } /* A wipe is a position change too. Show reveal content settled. */ [data-sc-reveal] { clip-path: none !important; } /* A rail's transform IS its navigation, not decoration. Zeroing it the way parallax and kinetic type are zeroed parks the act on its first screenful and makes everything past the fold unreachable: a device degrading into missing content. Hand the travel back to the reader as an ordinary scroll region instead, so the same items are all still gettable without motion. A build that would rather re-lay the rail out as a grid can still do that; this is the floor, not the ceiling. */ [data-sc-act="pan"] .sc-stage, [data-sc-act="pan"] [data-sc-stage] { overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x proximity; } [data-sc-pan] > * { scroll-snap-align: center; } [data-sc-spotlight]::after { display: none; } /* A worldflight keeps its whole story here. No clip is ever fetched, so the posters are the film, and they cross-dissolve through exactly the same seams at exactly the same scroll positions. The push-in and the copy drift are the only things that go. */ .sc-world__poster, [data-sc-copy] { transform: none !important; } } /* --------------------------------------------------------------- mobile -- */ @media (max-width: 860px) { .sc-copy { inset-inline: var(--sc-gutter); max-width: none; } .sc-copy--trail { text-align: left; } .sc-stage { height: 100svh; } /* .sc-copy--trail re-anchors to the left and spans the full width here, so a bottom-RIGHT corner gradient darkens the one corner the copy just left and guarantees a contrast failure over any bright clip. Point the density at the copy: the same band .sc-scrim--band paints. */ .sc-scrim--trail { background: linear-gradient(to top, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 74%, transparent) 22%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 42%, transparent 58%); } } :root{--ink:#153543;--muted:#627d87;--teal:#177d90;--line:#d6e3e7;--paper:#f3f7f8;--amber:#ae722c}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);font:15px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}a{color:var(--teal);text-decoration:none}a:hover{text-decoration:underline}button,input,select{font:inherit}button,.button{border:1px solid var(--line);background:white;border-radius:6px;padding:9px 15px;color:var(--ink);cursor:pointer;line-height:1.4;display:inline-block}button:hover,button.active{background:#e1f0f3;border-color:#78afbd}.button{background:var(--ink);color:white;border-color:var(--ink);font-weight:600}.button:hover{background:#24586b;text-decoration:none}.button.small{padding:8px 12px;font-size:12px}.text-link{font-weight:650}header{height:76px;display:flex;align-items:center;justify-content:space-between;gap:22px;max-width:1440px;margin:auto;padding:0 42px;background:var(--paper)}.brand{font-size:18px;letter-spacing:2px;color:var(--ink);font-weight:800;white-space:nowrap}.brand span{font-weight:350}.brand b{font-size:10px;letter-spacing:0;background:#dcebef;border-radius:4px;padding:4px 6px;margin-left:9px;vertical-align:middle}nav{display:flex;gap:25px;font-size:13px}nav a{color:var(--ink)}main{max-width:1400px;margin:auto;padding:0 30px}.hero{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center;background:#0e2733;color:white;border-radius:15px;overflow:hidden;margin-top:10px}.hero-copy{padding:42px 0 40px 42px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:700;color:var(--teal);margin-bottom:12px}.hero .eyebrow{color:#87c9d2}h1{font-size:clamp(34px,3.2vw,48px);font-weight:580;line-height:1.14;letter-spacing:-1.5px;margin:0 0 22px}h2{font-size:27px;line-height:1.25;letter-spacing:-.7px;font-weight:620;margin:0 0 10px}h3{font-size:19px;margin:0 0 16px}p{margin:0 0 16px}.lead{font-size:16px;line-height:1.7;color:#c2d8e0;max-width:450px}.hero-actions{display:flex;align-items:center;gap:24px;margin-top:26px}.hero .button{background:#c4e8ec;color:#123846;border:0}.hero .text-link{color:#c4e8ec;font-size:13px}.hero-image{margin:0;height:100%;display:flex;flex-direction:column;justify-content:center;padding:26px 24px 26px 0}.hero-image img{width:100%;border-radius:8px}.hero-image figcaption{font-size:10px;color:#91abb6;padding-top:10px}.evidence-line{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:25px;font-size:9px}.evidence-line span{border:1px solid #547480;border-radius:3px;padding:2px 5px;letter-spacing:1px}.evidence-line strong{font-weight:400;color:#b2ced8;margin-left:3px;font-size:10px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:25px;margin:27px 0 36px}.metrics article{border-left:2px solid #9ac4cd;padding:3px 15px}.metrics strong{font-size:29px;display:block;font-weight:600;line-height:1.3}.metrics span{display:block;font-size:12px}.metrics small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.panel{background:white;border:1px solid var(--line);border-radius:12px;margin:26px 0;padding:33px 35px;box-shadow:0 4px 20px #183a4803}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:25px;margin-bottom:23px}.tag{font-size:10px;white-space:nowrap;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:4px 10px}.two-col{display:grid;grid-template-columns:1.65fr 1fr;gap:34px;align-items:start}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px;font-size:12px}.toolbar button{font-size:12px;padding:7px 10px}.toolbar label{display:flex;align-items:center;gap:8px;margin-right:8px}.toolbar select{background:white;border:1px solid #bacfd6;padding:6px;border-radius:4px;color:var(--ink);max-width:240px;font-size:12px}.toolbar input[type=range]{width:130px}input[type=range]{accent-color:var(--teal)}input[type=checkbox]{accent-color:var(--teal)}canvas{display:block;border:1px solid #dbe7eb;border-radius:8px;width:100%;background:#f4f8fa}#cad-view{height:370px;touch-action:none;cursor:grab}#cad-view:active{cursor:grabbing}#cold-plot,#trajectory{height:310px}.hint{font-size:11px;color:var(--muted);margin:9px 0 12px;line-height:1.6}.downloads{display:flex;flex-wrap:wrap;gap:7px 18px;font-size:12px;margin:13px 0}.downloads a{border-bottom:1px solid #bbd7de}.sequence{padding:0 0 0 20px;font-size:13px}.sequence li{padding-left:7px;margin-bottom:17px}.sequence b{display:block}.note{font-size:12px;color:var(--muted);padding:13px 15px;border-left:3px solid #a4c9d2;background:#f2f7f8;line-height:1.7;margin:18px 0}.intro{max-width:1050px;color:#536f7b;font-size:14px}.equations{display:flex;gap:25px;flex-wrap:wrap;background:#edf4f6;border-radius:7px;padding:14px 20px;margin:20px 0 25px}.equations code{font-size:14px;color:#285f71}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px;margin:10px 0}.result-grid strong{display:block;font-size:24px;line-height:1.3;font-weight:550}.result-grid span{font-size:11px;color:var(--muted)}.badge{font-size:11px;font-weight:600;padding:9px 12px;border-radius:5px;background:#e2f1ed;color:#276a57;margin-bottom:17px}.badge.fail{background:#fff1df;color:#925d1e}#motion-time{width:100%;margin:13px 0 0}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.gallery figure{margin:0}.gallery img{width:100%;border-radius:6px}.gallery figcaption{font-size:11px;color:var(--muted);line-height:1.6;padding:8px 0}details{border-top:1px solid var(--line)}details:last-child{border-bottom:1px solid var(--line)}summary{padding:17px 5px;cursor:pointer;font-size:14px;font-weight:600;list-style:none;display:flex;gap:20px}summary:after{content:"+";margin-left:auto;font-size:20px;font-weight:350;color:var(--muted)}details[open] summary:after{content:"−"}summary span{color:#80a2ae;font-size:11px;line-height:2}.chapter-body{padding:8px 28px 25px;font-size:14px;max-width:1150px}.chapter-body p{max-width:1050px}.chapter-body img{width:100%;max-height:730px;object-fit:contain}.chapter-body figure{margin:20px 0}.chapter-body figcaption{font-size:12px;color:var(--muted)}.review-actions{display:flex;gap:9px;margin:18px 0}.review-actions button{font-size:12px}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px;line-height:1.6;margin:15px 0}th,td{text-align:left;vertical-align:top;border-bottom:1px solid var(--line);padding:11px 12px;min-width:100px;overflow-wrap:anywhere}th{background:#eaf2f5;font-weight:650}tbody tr:nth-child(even){background:#f7fafb}.sources ul{display:grid;grid-template-columns:1fr 1fr;gap:16px 35px;list-style:none;padding:0;font-size:12px}.sources small{display:block;color:var(--muted);font-size:11px}footer{max-width:1400px;padding:15px 40px 35px;margin:auto;font-size:11px;color:var(--muted)}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #79baca;outline-offset:3px}@media(max-width:1000px){header{padding:0 25px}nav{gap:12px}.hero{grid-template-columns:1fr 1fr;gap:20px}.hero-copy{padding-left:28px}.two-col{grid-template-columns:1fr}.model-grid{grid-template-columns:1fr}.sequence{display:grid;grid-template-columns:1fr 1fr;gap:12px 30px}.metrics{gap:10px}.panel{padding:25px}h2{font-size:24px}}@media(max-width:680px){header{height:auto;min-height:70px;flex-wrap:wrap;padding:14px 20px;gap:12px}nav{order:3;width:100%;justify-content:space-between}.hero{grid-template-columns:1fr;margin-top:15px}.hero-copy{padding:30px 25px 0}.hero-image{padding:0 20px 20px}main{padding:0 14px}h1{font-size:38px}.hero-actions{gap:15px;flex-wrap:wrap}.metrics{grid-template-columns:1fr 1fr;gap:23px 10px}.metrics strong{font-size:26px}.panel{padding:22px 17px;margin:20px 0}.section-heading{display:block}.tag{display:inline-block;margin-top:10px}.section-heading .button{margin-top:14px}h2{font-size:23px}.toolbar label{flex-wrap:wrap}.two-col{gap:20px}.sequence{display:block}#cad-view{height:300px}.equations{gap:9px;padding:14px}.equations code{font-size:12px}.gallery-grid,.sources ul{grid-template-columns:1fr}.chapter-body{padding:8px 2px 22px}summary{font-size:13px;gap:12px}.result-grid strong{font-size:22px}#cold-plot,#trajectory{height:270px}.toolbar select{max-width:210px}} @font-face{font-family:Manrope;src:url("./media-3ae11c49db04.ttf") format('truetype');font-weight:200 800;font-display:swap}@font-face{font-family:'Space Grotesk';src:url("./media-acad6de1fc93.ttf") format('truetype');font-weight:300 700;font-display:swap} :root{--sc-canvas:#0b1217;--sc-surface:#142129;--sc-ink:#eef5f5;--sc-ink-soft:#a3b9c3;--sc-accent:#9be5e4;--sc-accent-ink:#102229;--sc-font-display:'Space Grotesk',sans-serif;--sc-font-text:Manrope,sans-serif;--sc-gutter:clamp(22px,5.2vw,90px);--sc-maxw:1440px;--ink:var(--sc-ink);--muted:var(--sc-ink-soft);--teal:var(--sc-accent);--line:#2c404a;--paper:var(--sc-canvas)} html{scroll-padding-top:100px}.pitch{background:var(--sc-canvas);color:var(--sc-ink);font:500 15px/1.75 Manrope,sans-serif;letter-spacing:.005em}.pitch main{max-width:none;padding:0;margin:0}.pitch .wrap{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--sc-gutter)}.pitch h1,.pitch h2,.pitch h3{font-family:'Space Grotesk',sans-serif;color:inherit;font-weight:500;text-wrap:balance}.pitch h1{font-size:clamp(50px,5.7vw,88px);line-height:1.035;letter-spacing:-.055em;margin:0}.pitch h2{font-size:clamp(34px,3.5vw,54px);letter-spacing:-.045em;line-height:1.08;margin:0 0 24px}.pitch h3{font-size:24px;line-height:1.2;letter-spacing:-.025em;margin:0 0 16px}.pitch p{max-width:64ch;text-wrap:pretty}.pitch a{text-underline-offset:5px}.pitch a:hover{text-decoration:none;color:#d7ffff}.pitch .eyebrow{color:var(--sc-ink-soft);font-size:10px;font-weight:700;letter-spacing:.15em;margin-bottom:24px}.pitch .button,.pitch button{border-radius:3px;min-height:44px;transition:background-color 150ms ease-out,color 150ms ease-out,border-color 150ms ease-out,transform 150ms ease-out}.pitch .button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;padding:14px 21px;border:1px solid var(--sc-accent);background:var(--sc-accent);color:var(--sc-accent-ink);font-size:12px;font-weight:750;white-space:nowrap;line-height:1.4}.pitch .button:hover{color:var(--sc-accent-ink);background:#c2f5f2;border-color:#c2f5f2}.pitch .button:active,.pitch button:active{transform:translateY(1px)}.pitch .button.small{padding:11px 15px;min-height:42px;font-size:11px}.pitch button{background:#182a33;border:1px solid #46606c;color:var(--sc-ink);padding:9px 13px;line-height:1.4;cursor:pointer}.pitch button.active,.pitch button[aria-pressed=true]{color:var(--sc-accent-ink);border-color:var(--sc-accent);background:var(--sc-accent)}.pitch button:disabled{opacity:.45;cursor:not-allowed}.pitch :is(a,button,input,select,summary,canvas):focus-visible{outline:2px solid var(--sc-accent);outline-offset:5px}.pitch .text-link{font-size:12px;font-weight:650}.pitch .skip-link{position:fixed;top:12px;left:18px;padding:12px;background:var(--sc-accent);color:var(--sc-accent-ink);transform:translateY(-150%);z-index:100}.pitch .skip-link:focus{transform:none} .pitch .site-header{position:sticky;top:0;z-index:60;max-width:none;height:82px;padding:0 var(--sc-gutter);margin:0;background:#0b1217;border-bottom:1px solid #263740;gap:24px}.pitch .brand{display:flex;align-items:center;gap:12px;letter-spacing:.1em;font:600 19px/1 'Space Grotesk',sans-serif;color:var(--sc-ink)}.pitch .brand svg{width:39px;height:39px;flex:none}.pitch .brand span{font-weight:600}.pitch .brand .brand-light{font-weight:300;color:var(--sc-ink);margin-left:1px}.pitch .site-header nav{gap:28px;font-size:11px}.pitch .site-header nav a{color:var(--sc-ink-soft)} .pitch-hero{isolation:isolate;position:relative;min-height:720px;height:calc(100svh - 82px);max-height:1000px;overflow:clip;border-bottom:1px solid var(--line);background:#0b1217}.hero-title{position:relative;z-index:5;padding:55px var(--sc-gutter) 0}.theory-label{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.03em;color:var(--sc-accent);margin:0 0 27px}.theory-label>span{width:7px;height:7px;background:var(--sc-accent);border-radius:50%}.hero-title h1{max-width:1150px}.hero-environment{position:absolute;inset:0;z-index:0}.reference-ring{position:absolute;width:720px;height:720px;border:1px solid #263b44;border-radius:50%;right:-80px;top:5%;box-shadow:0 0 0 90px #15242a24,0 0 0 180px #15242a12}.hero-ground{position:absolute;inset:30% -5% -8%;z-index:0;color:#36505d;opacity:.37;transform-origin:70% 95%}.hero-ground svg{width:100%;height:100%}.vehicle-plane{position:absolute;z-index:3;width:min(72%,1180px);right:-1%;bottom:20px;margin:0;transform-origin:50% 85%;pointer-events:none}.vehicle-plane img{display:block;width:100%;height:auto;max-width:none}.vehicle-plane figcaption{font-size:9px;text-align:right;max-width:none;color:#9ab0bb;padding:5px 8% 0 0}.hero-bottom{position:absolute;left:var(--sc-gutter);bottom:84px;z-index:5;max-width:290px}.hero-thesis>p{font-size:14px;line-height:1.8;color:#b0c5cd;max-width:255px;margin-bottom:25px}.hero-thesis .hero-evidence{font-size:10px;color:#a7c0ca;max-width:235px;margin:18px 0 0}.near-ribbon{position:absolute;inset:auto -5% 30px;z-index:4;pointer-events:none;opacity:.55}.near-ribbon svg{width:100%;height:180px;fill:none;stroke:#72a5af;stroke-width:1}.hypothesis{padding-block:110px 125px;display:grid;grid-template-columns:1.1fr 1fr;gap:12%}.hypothesis h2{font-size:clamp(32px,3.2vw,50px)}.large-copy{font-size:18px;line-height:1.7;color:var(--sc-ink-soft);margin:27px 0 0}.hypothesis-points{padding-top:35px}.hypothesis-points article{padding-bottom:23px;margin-bottom:25px;border-bottom:1px solid var(--line)}.hypothesis-points h3{font-size:20px}.hypothesis-points p{font-size:13px;color:#b2c6ce;line-height:1.85}.hypothesis-points .plain-note{font-size:11px;line-height:1.8;color:var(--sc-ink-soft)} .flow-story{background:#101e25;border-top:1px solid #30434c;border-bottom:1px solid #30434c;position:relative}.flow-stage{height:100svh;position:sticky;top:0;overflow:clip;padding-top:clamp(110px,13vh,150px);background:#101e25}.flow-top{display:flex;align-items:end;justify-content:space-between;gap:40px}.flow-top h2{font-size:clamp(34px,3.3vw,51px);margin:0}.flow-top>p{font-size:12px;color:var(--sc-ink-soft);margin:0;max-width:290px}.flow-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:7%;align-items:center;margin-top:10px!important}.flow-drawing svg{width:100%;height:auto;max-height:55vh}.flow-drawing .duct-shell{fill:#2b4854;stroke:#70939e;stroke-width:1}.flow-drawing .air-route{fill:none;stroke:#b0f1ee;stroke-width:3;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--route-progress,1))}.drawing-caption{font-size:10px;color:var(--sc-ink-soft);margin-top:-20px;text-align:center;max-width:none!important}.flow-mode-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:28px}.flow-mode-tabs button{font-size:10px;padding:8px 10px;min-height:42px}.flow-explanation h3{font-size:30px}.flow-explanation p{font-size:13px;color:#b2c6ce;line-height:1.85}.flow-principle{border-top:1px solid #3a535f;padding-top:23px;margin-top:26px}.flow-principle>span{font:500 11px 'Space Grotesk',sans-serif;letter-spacing:.04em;color:#c5efed}.flow-principle p{font-size:11px;margin:11px 0 0}.flow-track{position:absolute;bottom:32px;left:0;right:0;height:2px}.flow-track:before{content:'';position:absolute;inset:0 var(--sc-gutter);background:#34505b}.flow-track>span{display:block;height:2px;background:var(--sc-accent);transform:scaleX(var(--sc-p,0));transform-origin:left}.pressure-tray,.thermal-route{opacity:0;transition:opacity 250ms ease-out}.drawing-body,.duct-shell,.air-route,.rotor,.air-particle{transition:opacity 250ms ease-out}.flow-stage[data-phase=grip] .pressure-tray,.flow-stage[data-phase=cold] .thermal-route{opacity:1}.flow-stage[data-phase=grip] :is(.duct-shell,.air-route,.rotor,.air-particle),.flow-stage[data-phase=cold] :is(.duct-shell,.air-route,.rotor,.air-particle){opacity:.25} .benchmark{padding-block:90px 105px}.benchmark-head{max-width:900px}.benchmark .intro{font-size:15px;color:#a8c0ca;margin-top:24px;max-width:800px}.benchmark .intro strong{font-weight:600;color:var(--sc-ink)}.benchmark-workspace{display:grid;grid-template-columns:1.6fr 1fr;gap:7%;margin-top:45px}.speed-controls{display:flex;align-items:center;gap:15px;margin-bottom:38px;font-size:11px;color:var(--sc-ink-soft)}.speed-controls>div{display:flex;gap:3px}.speed-controls button{min-width:60px;padding:10px 15px}.distance-row{margin-bottom:32px}.distance-label{display:grid;grid-template-columns:1fr auto;column-gap:20px;align-items:center}.distance-label>span{font:500 21px 'Space Grotesk',sans-serif}.distance-label>small{grid-column:1;font-size:10px;color:var(--sc-ink-soft);margin-top:3px}.distance-label>strong{grid-row:1/3;grid-column:2;font:500 38px 'Space Grotesk',sans-serif;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.distance-label strong small{font-size:18px;font-weight:400}.distance-track{height:13px;background:#1e3039;margin-top:16px;overflow:clip}.distance-track>span{display:block;width:100%;height:100%;background:#79909c;transform-origin:left;transition:transform 260ms ease-out}.projected .distance-track>span{background:var(--sc-accent);transform:scaleX(.87145)}.projected .distance-label>span{color:var(--sc-accent)}.delta-line{display:flex;gap:27px;align-items:center;padding-top:20px;border-top:1px solid var(--line);margin-top:38px}.delta-line>strong{font:500 clamp(36px,4vw,60px) 'Space Grotesk',sans-serif;letter-spacing:-.05em;white-space:nowrap}.delta-line p{font-size:13px;margin:0}.delta-line p span{font-size:10px;color:var(--sc-ink-soft)}.chart-note{font-size:10px;color:var(--sc-ink-soft);margin:20px 0 0;line-height:1.9}.comparison-assumptions{padding:3px 0 0}.comparison-assumptions h3{font-size:22px}.comparison-assumptions ul{list-style:none;padding:0;font-size:12px;color:#bdd0d7}.comparison-assumptions li{padding:9px 0;border-bottom:1px solid var(--line)}.pitch .note{background:#15252e;border:1px solid #314a56;border-radius:3px;color:#adc3cd;font-size:11px;padding:16px 18px;line-height:1.9}.pitch .benchmark-limits{margin-top:32px}.limits-layout{display:grid;grid-template-columns:1fr 1fr;gap:45px;padding:12px 4px 25px;font-size:12px;color:var(--sc-ink-soft)}.limits-layout b{display:block;color:var(--sc-ink);margin-bottom:7px}.benchmark-links{display:flex;gap:35px;flex-wrap:wrap;margin-top:25px}.material-scene{position:relative;height:650px;overflow:clip;background:#0b1217;border-block:1px solid #233740}.material-scene>img{width:76%;height:100%;object-fit:cover;object-position:right center;margin-left:auto;mask-image:linear-gradient(to right,transparent 0%,#000 36%)}.material-copy{position:absolute;top:110px;left:0;right:0;z-index:2}.material-copy h2{max-width:550px}.material-copy p{max-width:335px;font-size:13px;color:#b7cbd2;margin-top:25px}.material-caption{position:absolute;bottom:22px;right:var(--sc-gutter);font-size:9px;color:#abc2cc;text-align:right;margin:0} .laboratory{background:#e5edef;color:#16313e;padding-block:95px 40px;--ink:#16313e;--muted:#4e6975;--teal:#176678;--line:#b7cbd2;--sc-accent:#176678;--sc-ink:#16313e;--sc-ink-soft:#4e6975;--sc-accent-ink:#f3f8f9}.laboratory .lab-intro h2{font-size:clamp(34px,3.8vw,56px)}.lab-intro>p:last-child{font-size:14px;color:#4e6975;max-width:680px;margin-top:20px}.pitch .lab-inner{padding-top:20px}.pitch .panel{border:none;border-top:1px solid #afc4cd;background:transparent;box-shadow:none;border-radius:0;margin:38px 0 40px;padding:40px 0 15px}.pitch .panel h2{font-size:30px;max-width:680px;line-height:1.17}.pitch .section-heading{margin-bottom:25px}.pitch .tag{border:1px solid #9cb6c1;color:#365969;border-radius:2px;font-size:9px;padding:5px 10px}.pitch .two-col{grid-template-columns:1.65fr 1fr;gap:42px}.pitch .model-grid{grid-template-columns:1.7fr 1fr}.pitch .toolbar{font-size:11px;gap:7px;margin-bottom:15px}.pitch .toolbar button{background:#dae7eb;border-color:#9fbac6;color:#1c4b5e;font-size:10px;padding:8px 11px;min-height:40px}.pitch .toolbar button.active{background:#1c5266;color:#f1f8fa;border-color:#1c5266}.pitch .toolbar select{padding:8px 9px;font-size:11px;border-radius:2px;background:#f4f8f9;color:#234958;min-height:42px;border-color:#9fbac6}.pitch .toolbar input[type=range]{width:125px}.pitch .toolbar label{gap:7px;margin-right:8px}.pitch canvas{border:1px solid #b4cbd4;border-radius:3px;background:#f2f7f9}.pitch #cad-view{height:420px}.pitch #cold-plot,.pitch #trajectory{height:320px}.laboratory .note{color:#3e6172;background:#d8e6eb;border:1px solid #b0c9d3}.laboratory .intro{color:#496773;font-size:13px;max-width:900px}.pitch .sequence{font-size:12px;padding-left:20px}.pitch .sequence li{margin-bottom:16px;padding-left:5px}.pitch .sequence b{font-weight:750}.pitch .hint{font-size:10px}.pitch .downloads{font-size:11px;gap:8px 20px}.laboratory .downloads a{border-color:#83a4b3}.pitch .equations{background:#d2e1e6;border:1px solid #b4cbd4;border-radius:3px;gap:30px;padding:16px 20px;margin:25px 0}.pitch .equations code{font-size:12px;color:#28596d}.pitch .result-grid{gap:22px 15px}.pitch .result-grid strong{font:500 27px 'Space Grotesk',sans-serif}.pitch .result-grid span{font-size:10px}.pitch .badge{font-size:10px;border-radius:2px;padding:11px 14px}.pitch .badge.fail{background:#fae5c7;color:#714812} .whole-plan{padding-block:110px}.plan-heading{display:grid;grid-template-columns:1.3fr 1fr;gap:12%;align-items:end;margin-bottom:50px}.plan-heading>p{font-size:13px;color:var(--sc-ink-soft);margin:0 0 4px}.package-ledger{display:grid;grid-template-columns:1fr 1fr;gap:0 60px}.package-ledger details{border-top:1px solid #31454f}.package-ledger details:last-child{border-bottom:0}.package-ledger summary{font-size:15px;padding:19px 0;font-weight:500;align-items:center;gap:20px}.package-ledger summary>span{font:500 10px 'Space Grotesk',sans-serif;min-width:32px;color:#8faab7;line-height:1.5}.package-ledger summary:after{color:#96b1bf}.package-ledger details>p{font-size:12px;padding:0 25px 16px 52px;color:var(--sc-ink-soft);line-height:1.9}.concept-gallery{display:grid;grid-template-columns:1.35fr 1fr;gap:8%;align-items:center;margin-top:90px}.concept-gallery figure{margin:0}.concept-gallery img{width:100%;height:auto;border-radius:3px}.concept-gallery figcaption,.next-proof figcaption{font-size:10px;color:var(--sc-ink-soft);line-height:1.8;margin-top:12px}.concept-gallery h3{font-size:34px}.concept-gallery p{font-size:13px;color:var(--sc-ink-soft);margin:24px 0}.review-wrap{padding-bottom:80px}.pitch .review-wrap .panel{border-color:var(--line);margin:0;padding:45px 0}.review-wrap h2{font-size:37px!important}.review-wrap .intro{color:var(--sc-ink-soft);max-width:800px;font-size:13px}.pitch summary{align-items:center;min-height:52px;padding:19px 3px;font-size:13px;font-weight:600;gap:20px}.pitch summary:after{color:var(--sc-ink-soft)}.pitch summary span{color:#91aebd}.pitch .chapter-body{font-size:12px;max-width:1100px;padding:15px 25px 35px;color:#b7cbd3}.pitch .chapter-body p{max-width:85ch;line-height:1.9}.pitch .chapter-body figure{background:#eef4f6;padding:12px;border-radius:3px}.pitch .chapter-body figcaption{color:#3d5c69;font-size:11px;line-height:1.7;margin-top:10px}.pitch .chapter-body th{background:#1d333e;color:#d5e6eb}.pitch .chapter-body td{background:transparent;color:#bfd0d7}.pitch .chapter-body tbody tr:nth-child(even){background:#14252e}.pitch .chapter-body table{font-size:11px}.next-proof{background:#14262f;border-block:1px solid #314955;padding-block:95px}.proof-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:7%;align-items:center}.proof-copy>p{font-size:13px;color:#b8cdd6;margin:25px 0 28px}.proof-copy .eyebrow{font-size:10px;margin:0 0 25px}.proof-copy .text-link{display:block;margin-top:18px}.proof-copy .proof-status{font-size:11px;color:#a7c0ca;margin-top:28px}.next-proof figure{margin:0}.next-proof img{width:100%;height:auto;border-radius:3px}.pitch .sources{padding-block:55px 30px;background:transparent;border:0}.pitch .sources summary{font-size:13px}.pitch .sources ul{font-size:11px;gap:20px 40px}.pitch .sources small{font-size:10px;line-height:1.8}.pitch .site-footer{display:flex;align-items:center;justify-content:space-between;gap:35px;border-top:1px solid #2c404a;padding-block:35px 40px;max-width:1440px}.site-footer p{font-size:9px;color:var(--sc-ink-soft);margin:0}.site-footer>span{font-size:9px;color:var(--sc-ink-soft)} @media(hover:hover) and (pointer:fine){.pitch button:hover{background:#2d4856;border-color:#84adb8}.pitch button.active:hover{background:#c2f5f2;color:#102229}.pitch .site-header nav a:hover{color:var(--sc-accent)}.hero-car{transform:translate3d(calc(var(--hero-x,0)*10px),calc(var(--hero-y,0)*4px),0);transition:transform 220ms ease-out}} @media(min-width:1650px){.vehicle-plane{width:69%;right:3%}.hero-bottom{bottom:120px}.hero-title{padding-top:65px}} @media(max-width:1100px){.pitch .site-header nav{gap:15px}.pitch .brand{font-size:17px;gap:9px}.pitch .brand svg{width:33px;height:33px}.pitch h1{font-size:6.1vw}.vehicle-plane{width:77%;right:-8%;bottom:60px}.hero-bottom{max-width:240px;bottom:85px}.hero-thesis>p{font-size:12px;max-width:210px}.pitch-hero{min-height:670px}.hypothesis{gap:7%;padding-block:85px}.flow-layout{gap:4%;grid-template-columns:1.3fr 1fr}.flow-explanation h3{font-size:26px}.flow-explanation p{font-size:12px}.flow-mode-tabs button{padding-inline:8px;font-size:9px}.flow-top>p{max-width:240px;font-size:11px}.benchmark-workspace{gap:6%;grid-template-columns:1.3fr 1fr}.pitch .two-col,.pitch .model-grid{grid-template-columns:1fr}.pitch .sequence{display:grid;grid-template-columns:1fr 1fr;gap:15px 30px}.pitch .panel aside{max-width:900px}.material-scene{height:560px}.material-scene>img{width:70%;mask-image:linear-gradient(to right,transparent 0%,#000 45%)}.material-copy{top:85px}.material-copy h2{font-size:40px}.material-copy p{max-width:265px}.pitch .site-footer{flex-wrap:wrap}} @media(max-width:760px){.pitch .site-header{height:70px;padding-inline:22px;gap:15px}.pitch .site-header nav{display:none}.pitch .site-header .button{font-size:9px;padding:10px 11px;gap:10px;min-height:40px}.pitch .brand{font-size:15px;gap:8px;letter-spacing:.06em}.pitch .brand svg{width:30px;height:30px}.pitch-hero{height:auto;min-height:0;padding:32px 0 35px;display:flex;flex-direction:column;max-height:none}.hero-title{padding:0 22px}.theory-label{font-size:9px;margin-bottom:21px;gap:8px}.pitch h1{font-size:clamp(31px,7.85vw,52px);letter-spacing:-.05em;line-height:1.06}.hero-title h1{max-width:660px}.hero-bottom{position:relative;left:0;bottom:auto;padding:22px 22px 0;max-width:none;order:1}.hero-thesis>p{font-size:12px;max-width:330px;margin:0 0 20px;line-height:1.75}.hero-thesis .button{font-size:10px;gap:25px;padding:12px 16px;min-height:43px}.hero-thesis .hero-evidence{font-size:9px;max-width:300px;margin-top:13px}.vehicle-plane{position:relative;width:100%;right:auto;bottom:auto;margin:12px 0 15px;padding:0 0;order:2}.vehicle-plane img{width:100%;height:auto}.vehicle-plane figcaption{font-size:8px;text-align:center;padding:10px 15px 0}.hero-ground{inset:40% -25% -15%;opacity:.32}.reference-ring{width:450px;height:450px;right:-210px;top:30%}.near-ribbon{bottom:40px;inset-inline:-30%;opacity:.5}.near-ribbon svg{height:80px}.hypothesis{padding-block:65px;grid-template-columns:1fr;gap:25px}.pitch h2,.hypothesis h2{font-size:33px;letter-spacing:-.045em;line-height:1.1}.hypothesis .large-copy{font-size:16px;margin-top:22px}.hypothesis-points{padding-top:5px}.hypothesis-points article{margin-bottom:20px;padding-bottom:15px}.hypothesis-points h3{font-size:20px;margin-bottom:12px}.hypothesis-points p{font-size:12px}.flow-stage{padding-top:95px;display:flex;flex-direction:column;justify-content:flex-start}.flow-top{display:block}.flow-top h2{font-size:30px}.flow-top>p{display:none}.flow-layout{display:flex;flex-direction:column;gap:0;margin-top:8px!important;min-height:0}.flow-drawing{width:100%;max-width:510px}.flow-drawing svg{max-height:31svh;width:100%}.drawing-caption{font-size:8px;margin-top:-15px;margin-bottom:12px}.flow-explanation{width:100%;max-width:510px}.flow-mode-tabs{gap:5px;margin-bottom:18px}.flow-mode-tabs button{font-size:9px;min-height:38px;padding:8px 12px}.flow-explanation h3{font-size:24px;margin-bottom:10px}.flow-explanation p{font-size:11px;line-height:1.8;margin-bottom:0}.flow-principle{padding-top:12px;margin-top:15px}.flow-principle>span{font-size:9px}.flow-principle p{font-size:9px;margin-top:5px}.flow-track{bottom:23px}.benchmark{padding-block:65px}.benchmark .eyebrow{font-size:8px;letter-spacing:.1em;margin-bottom:20px}.benchmark .intro{font-size:13px;margin-top:22px}.benchmark-workspace{grid-template-columns:1fr;gap:35px;margin-top:30px}.speed-controls{gap:10px;font-size:9px;margin-bottom:30px;flex-wrap:wrap}.speed-controls button{padding:9px 12px;min-width:48px;font-size:12px}.distance-label>span{font-size:19px}.distance-label>strong{font-size:34px}.distance-label>small{font-size:9px}.distance-track{height:10px;margin-top:13px}.distance-row{margin-bottom:28px}.delta-line{gap:20px;margin-top:30px;padding-top:25px}.delta-line>strong{font-size:41px}.delta-line p{font-size:11px}.delta-line p span{font-size:9px}.comparison-assumptions h3{font-size:23px}.comparison-assumptions li{font-size:12px}.limits-layout{grid-template-columns:1fr;gap:7px;font-size:11px}.benchmark-links{gap:18px}.benchmark-links a{font-size:10px!important}.material-scene{height:auto;display:flex;flex-direction:column}.material-scene>img{width:100%;height:320px;object-fit:cover;mask-image:linear-gradient(to bottom,#000 60%,transparent 100%);order:0}.material-copy{position:relative;top:auto;order:1;margin-top:-35px!important;padding-bottom:35px}.material-copy h2{font-size:34px}.material-copy p{font-size:12px;max-width:400px;margin-top:20px}.material-caption{position:relative;bottom:auto;right:auto;padding:0 22px 20px;text-align:left;order:2;font-size:8px}.laboratory{padding-block:65px 25px}.pitch .lab-intro h2{font-size:34px}.lab-intro>p:last-child{font-size:12px;margin-top:20px}.pitch .panel{margin-top:30px;padding-top:30px}.pitch .panel h2{font-size:26px}.pitch .section-heading{display:block}.pitch .tag{display:inline-block;margin-top:10px}.pitch .two-col{gap:20px}.pitch #cad-view{height:300px}.pitch #cold-plot,.pitch #trajectory{height:270px}.pitch .toolbar{font-size:10px;gap:6px}.pitch .toolbar label{flex-wrap:wrap}.pitch .toolbar select{max-width:220px}.pitch .toolbar button{font-size:9px;min-height:40px}.pitch .sequence{display:block;font-size:11px}.pitch .hint{font-size:9px}.pitch .intro{font-size:12px}.pitch .equations{gap:10px;padding:15px}.pitch .equations code{font-size:11px}.pitch .result-grid strong{font-size:25px}.pitch .note{font-size:10px}.whole-plan{padding-block:65px}.plan-heading{grid-template-columns:1fr;gap:20px;margin-bottom:30px}.plan-heading>p{font-size:12px}.package-ledger{grid-template-columns:1fr}.package-ledger summary{font-size:13px;padding:17px 0;gap:10px}.package-ledger details>p{padding-left:42px;font-size:11px}.concept-gallery{grid-template-columns:1fr;gap:30px;margin-top:50px}.concept-gallery h3{font-size:29px}.concept-gallery p{font-size:12px;margin-block:20px}.review-wrap{padding-bottom:45px}.review-wrap .section-heading .button{margin-top:15px}.review-wrap h2{font-size:29px!important}.review-wrap .intro{font-size:12px}.pitch .review-actions{flex-wrap:wrap}.pitch .review-actions button{font-size:10px}.pitch summary{font-size:12px;gap:10px}.pitch summary span{font-size:9px}.pitch .chapter-body{font-size:11px;padding:10px 0 25px}.pitch .chapter-body th,.pitch .chapter-body td{font-size:10px;padding:9px}.proof-layout{grid-template-columns:1fr;gap:40px}.next-proof{padding-block:60px}.proof-copy>p{font-size:12px}.proof-copy .button{font-size:11px}.proof-copy .text-link{font-size:10px}.pitch .sources{padding-block:35px 25px}.pitch .sources ul{grid-template-columns:1fr}.pitch .site-footer{display:grid;gap:22px;padding-block:28px 35px}.site-footer .brand{font-size:18px}.pitch .no-script{font-size:11px}} @media(max-width:400px) and (max-height:700px){.pitch-hero{padding-top:25px}.pitch h1{font-size:30px}.hero-title .theory-label{font-size:8px;margin-bottom:18px}.hero-bottom{padding-top:18px}.hero-thesis>p{font-size:11px;margin-bottom:14px}.vehicle-plane{margin-top:5px}.flow-stage{padding-top:90px}.flow-top h2{font-size:27px}.flow-drawing svg{max-height:25svh}.flow-mode-tabs{margin-bottom:12px}.flow-mode-tabs button{min-height:36px}.flow-explanation p{font-size:10px}.flow-principle{margin-top:12px}.flow-track{bottom:15px}} @media(prefers-reduced-motion:reduce){.pitch html{scroll-behavior:auto}.pitch *{scroll-behavior:auto!important}.pitch-hero [data-sc-parallax]{transform:none!important}.hero-car{transform:none!important;transition:none!important}.flow-story{height:auto!important}.flow-stage{position:relative!important;height:auto;min-height:0;padding-top:70px;padding-bottom:60px}.flow-track{display:none}.flow-drawing svg{max-height:none}.pitch [data-sc-reveal]{clip-path:none!important}.distance-track>span{transition:none}.pressure-tray,.thermal-route{transition:opacity 160ms ease-out}} .pitch [hidden]{display:none!important}.pitch .cad-fallback{width:100%;height:auto;display:block;border:1px solid #b4cbd4;border-radius:3px} .material-caption{background:#0b1217;padding:5px 8px} @media(max-width:760px){.material-caption{padding:0 22px 20px}} .pitch .site-footer{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) auto;align-items:start;gap:45px;padding-block:40px 45px}.footer-identity>p{margin-top:21px}.footer-contact{display:flex;flex-direction:column;gap:12px;padding-top:4px}.footer-contact>span{font-size:10px;color:var(--sc-ink-soft)}.footer-contact>a{font-size:13px;white-space:nowrap}.footer-contact>a>span{margin-left:8px}.footer-contact>small{font-size:9px;color:var(--sc-ink-soft);margin-top:7px}.genyra-credit{padding-top:4px;display:flex;flex-direction:column;align-items:flex-end;gap:17px}.genyra-company{display:flex;align-items:center;gap:9px;min-height:32px}.genyra-company img{width:160px;height:auto;display:block}.genyra-company>span{font-size:9px;letter-spacing:.07em;color:var(--sc-ink-soft)}.genyra-credit>p{font-size:10px;color:var(--sc-ink-soft)}.genyra-credit>p>a{color:var(--sc-ink)} @media(max-width:1100px){.pitch .site-footer{grid-template-columns:1.3fr 1fr;gap:30px}.genyra-credit{grid-column:1/-1;align-items:flex-start;flex-direction:row;align-items:center;gap:25px}} @media(max-width:760px){.pitch .site-footer{grid-template-columns:1fr;gap:32px;padding-block:32px 38px}.footer-identity>p{margin-top:18px}.footer-contact{gap:10px}.footer-contact>a{font-size:14px}.genyra-credit{grid-column:auto;flex-direction:column;align-items:flex-start;gap:14px}.genyra-company img{width:150px}} .comparison-scope{border-block:1px solid #385460;padding-block:19px;margin-top:30px;max-width:1000px}.comparison-scope>strong{font-size:14px;font-weight:650;color:#c5eeee}.comparison-scope>p{font-size:12px;line-height:1.8;color:var(--sc-ink-soft);margin:10px 0 8px;max-width:88ch}.comparison-scope>a{font-size:11px}.braking-questions{padding-block:25px 85px}.braking-questions h2{font-size:38px;margin-bottom:35px}.braking-questions details>p{font-size:12px;line-height:1.9;color:var(--sc-ink-soft);padding:8px 28px 24px;margin:0;max-width:90ch} @media(max-width:760px){.comparison-scope>strong{font-size:12px}.comparison-scope>p{font-size:11px}.comparison-scope>a{font-size:10px}.braking-questions{padding-block:10px 55px}.braking-questions h2{font-size:31px;margin-bottom:25px}.braking-questions details>p{font-size:11px;padding-inline:3px}} .development-note{margin-top:28px;max-width:900px}.development-note>strong{font-family:"Space Grotesk",sans-serif;font-size:23px;font-weight:500}.development-note>p{font-size:13px;line-height:1.85;color:var(--sc-ink-soft);max-width:86ch;margin-top:12px}@media(max-width:760px){.development-note>strong{font-size:21px}.development-note>p{font-size:12px}} .research-outlook{display:grid;grid-template-columns:1.2fr 1fr;gap:55px 9%;padding-block:85px 75px;border-bottom:1px solid #2c404a}.outlook-intro h2{max-width:550px;font-size:48px}.outlook-intro>p{font-size:15px;color:var(--sc-ink-soft);line-height:1.85;margin:25px 0}.focus-scope{border-top:1px solid #486572;padding-top:24px}.focus-scope h3{font-size:20px}.focus-fraction{font-size:14px;color:var(--sc-ink-soft);margin-bottom:5px}.focus-fraction>strong{font:500 48px/1.2 'Space Grotesk',sans-serif;letter-spacing:-.045em;color:var(--sc-ink);margin-right:8px}.focus-percent{font-size:12px;color:var(--sc-ink-soft)}.focus-percent>strong{font-size:20px;color:var(--sc-accent);font-weight:600;margin-right:7px}.focus-label{font-size:11px;color:#cee7eb;margin-top:21px}.scope-map{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin:17px 0}.scope-map>span{height:24px;display:flex;align-items:center;justify-content:center;background:#1e3039;color:#a5bdc8;font-size:7px}.scope-map>.focus{background:var(--sc-accent);color:#102229;font-weight:800}.scope-basis{font-size:11px;color:var(--sc-ink-soft);line-height:1.85}.outlook-next{grid-column:1/3;display:grid;grid-template-columns:1fr 1.2fr;gap:18px 9%;padding-top:15px}.outlook-next>h3{font-size:30px;margin:0}.outlook-next>p{font-size:12px;color:var(--sc-ink-soft);margin:0}.research-roadmap{grid-column:1/3;margin:22px 0 0}.research-roadmap>div{display:grid;grid-template-columns:1fr 1.2fr;gap:9%;border-top:1px solid #2c404a;padding:22px 0}.research-roadmap dt{font-size:15px;font-weight:600}.research-roadmap dt>span{display:block;font-size:10px;font-weight:500;color:var(--sc-accent);margin-top:6px}.research-roadmap dd{margin:0;font-size:12px;line-height:1.85;color:var(--sc-ink-soft)}.research-log{grid-column:1/3;border-top:1px solid #2c404a;padding-top:25px}.research-log>h3{font-size:21px}.research-log article{display:grid;grid-template-columns:120px 1fr;gap:10px 25px}.research-log article>time{font-size:10px;color:var(--sc-ink-soft);padding-top:4px}.research-log h4{font-size:14px;margin:0}.research-log article>p{grid-column:2;font-size:12px;color:var(--sc-ink-soft);margin:0;line-height:1.85;max-width:90ch}.research-updated{font-size:9px;color:var(--sc-ink-soft);margin:24px 0 0}.hero-evidence>strong{font-weight:650;color:var(--sc-ink)} @media(max-width:760px){.research-outlook{grid-template-columns:1fr;gap:32px;padding-block:55px}.outlook-intro h2{font-size:35px}.outlook-intro>p{font-size:13px;margin:20px 0}.focus-scope{padding-top:20px}.focus-scope h3{font-size:19px}.scope-map{gap:3px}.scope-map>span{font-size:7px;height:23px}.outlook-next{grid-column:auto;grid-template-columns:1fr;gap:16px;padding-top:0}.outlook-next>h3{font-size:27px}.outlook-next>p{font-size:12px}.research-roadmap{grid-column:auto;margin-top:5px}.research-roadmap>div{grid-template-columns:1fr;gap:14px;padding:20px 0}.research-roadmap dt{font-size:14px}.research-roadmap dt>span{display:inline-block;margin:0 0 0 12px;font-size:9px}.research-roadmap dd{font-size:11px}.research-log{grid-column:auto;padding-top:22px}.research-log article{grid-template-columns:1fr;gap:12px}.research-log article>p{grid-column:auto;font-size:11px}.research-log h4{font-size:13px}}