.l8w {
  --ink: #2D2D2D; --paper: #F9F8F5; --citrus: #F8FAEB; --khaki: #D3CEB3; --mauve: #DFC3FF; --mauve-dark: #C796FF;
  --olive: #66662A; --caerulean: #0046C6; --white: #FFFFFF; --muted: #6A6A69;
  --font-display: "Poppins", "Century Gothic", "Avenir Next", sans-serif;
  --font-body: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-hand: "Covered By Your Grace", "Bradley Hand", cursive;
  --t-display: clamp(2.5rem, 1rem + 7.2vw, 10rem);
  --t-title: clamp(2rem, 1.1rem + 3.9vw, 5.5rem);
  --t-heading: clamp(1.375rem, 1rem + 1.7vw, 3rem);
  --t-h3: clamp(1.1875rem, 1rem + .7vw, 1.75rem);
  --t-body: clamp(1.0625rem, .8rem + .75vw, 1.5rem);
  --t-small: clamp(.9375rem, .82rem + .4vw, 1.125rem);
  --t-label: clamp(.75rem, .66rem + .3vw, 1rem);
  --gutter: clamp(1.25rem, 6.67vw, 8rem);
  --col: clamp(0px, 10.83vw, 13rem);
  --nav-h: 3.75rem;
  --top: calc(var(--nav-h) + env(safe-area-inset-top, 0px));
  --pen: clamp(3.5px, .32vw, 5px);
  --vh: 100vh;
  --bg: var(--paper); --fg: var(--ink); --signal: var(--caerulean); --rule: rgba(45, 45, 45, .3); --soft: rgba(45, 45, 45, .68);
  color-scheme: light; position: relative; overflow-x: clip;
  background: var(--paper); color: var(--ink); font-family: var(--font-body); font-size: var(--t-body); line-height: 1.45;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
@supports (height: 100svh) {
  .l8w { --vh: 100svh; }
}
.l8w { --lvh: var(--vh); --under: 0px; }
@supports (height: 100lvh) {
  .l8w { --lvh: 100lvh; --under: calc(100lvh - 100svh); }
}
.l8w, .l8w *, .l8w *::before, .l8w *::after { box-sizing: border-box; }
.l8w h1, .l8w h2, .l8w h3, .l8w h4, .l8w p, .l8w ol, .l8w ul, .l8w figure { margin: 0; padding: 0; }
.l8w ol, .l8w ul { list-style: none; }
.l8w img, .l8w svg { display: block; max-width: 100%; }
.l8w a { color: inherit; }
.l8w :focus-visible { outline: 2px solid var(--signal, var(--caerulean)); outline-offset: 3px; }
.l8w .on-paper { --bg: var(--paper);     --fg: var(--ink);   --signal: var(--caerulean); --rule: rgba(45, 45, 45, .3); --soft: rgba(45, 45, 45, .68); }
.l8w .on-citrus { --bg: var(--citrus);    --fg: var(--ink);   --signal: var(--caerulean); --rule: rgba(45, 45, 45, .3); --soft: rgba(45, 45, 45, .68); }
.l8w .on-ink { --bg: var(--ink);       --fg: var(--paper); --signal: var(--mauve);     --rule: rgba(249, 248, 245, .35); --soft: rgba(249, 248, 245, .72); }
.l8w .on-caerulean { --bg: var(--caerulean); --fg: var(--paper); --signal: var(--mauve);     --rule: rgba(249, 248, 245, .4); --soft: rgba(249, 248, 245, .86); }
.l8w .sec { background: var(--bg); color: var(--fg); position: relative; }
.l8w .wrap { max-width: 105rem; margin-inline: auto; padding-inline: var(--gutter); }
.l8w .eyebrow { font-size: var(--t-label); line-height: 1.3; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--signal); }
.l8w .display { font-family: var(--font-display); font-weight: 500; font-size: var(--t-display); line-height: 1; letter-spacing: -.045em; text-wrap: balance; }
.l8w .title { font-family: var(--font-display); font-weight: 500; font-size: var(--t-title); line-height: 1.05; letter-spacing: -.035em; text-wrap: balance; }
.l8w .heading { font-family: var(--font-display); font-weight: 500; font-size: var(--t-heading); line-height: 1.12; letter-spacing: -.025em; text-wrap: balance; }
.l8w .h3 { font-family: var(--font-display); font-weight: 500; font-size: var(--t-h3); line-height: 1.2; letter-spacing: -.015em; }
.l8w .turn { font-style: italic; color: var(--signal); }
.l8w .body { font-size: var(--t-body); line-height: 1.45; max-width: 38em; }
.l8w .small { font-size: var(--t-small); line-height: 1.5; }
.l8w .soft { color: var(--soft); }
.l8w .head { display: flex; flex-direction: column; gap: .5rem; }
.l8w .stack-m > * + * { margin-top: 1.1em; }
.l8w .btn { display: inline-block; font-family: var(--font-body); font-size: var(--t-small); font-weight: 600; line-height: 1.2; padding: .85em 1.5em; border-radius: 3px; border: 2px solid var(--caerulean); background: var(--caerulean); color: var(--paper); text-decoration: none; white-space: nowrap; }
.l8w .on-caerulean .btn, .l8w .on-ink .btn { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.l8w .btn:hover { filter: brightness(1.08); }
.l8w .btn:active { transform: translateY(1px); }
.l8w .link { --pen-u: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7C40 4 80 9 120 6S180 4 198 7' fill='none' stroke='%230046C6' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); color: var(--signal); font-weight: 600; text-decoration: none; padding-bottom: .16em; background: var(--pen-u) 0 100% / calc(var(--d, 1) * 100%) .34em no-repeat; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.l8w :is(.on-ink, .on-caerulean) .link { --pen-u: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7C40 4 80 9 120 6S180 4 198 7' fill='none' stroke='%23DFC3FF' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); }
.l8w .link .pen-word { white-space: nowrap; }
.l8w .link .pen { display: inline-block; width: 1.15em; height: .8em; margin-left: .38em; vertical-align: -.04em; overflow: visible; transition: transform .25s ease; }
.l8w .link .pen path { fill: none; stroke: var(--signal); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--d, 1)); }
.l8w .link:hover .pen, .l8w .link:focus-visible .pen { transform: translateX(.3em); }
.l8w .link.go { font-family: var(--font-display); font-weight: 500; font-size: var(--t-h3); line-height: 1.2; letter-spacing: -.015em; }
.l8w .nav { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; height: var(--nav-h); background: var(--paper); color: var(--ink); border-bottom: 1px solid rgba(45, 45, 45, .15); }
.l8w .nav .wrap { height: 100%; display: flex; align-items: center; gap: 1.25rem; }
.l8w .nav .wrap > a:first-child { flex: 0 1 auto; min-width: 5.75rem; }
.l8w .nav img { width: calc(1.375rem * 440 / 69); height: auto; max-width: 100%; }
.l8w .nav .where { flex-shrink: 100; margin-left: .5rem; font-size: var(--t-label); letter-spacing: .08em; text-transform: uppercase; font-weight: 600; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.l8w .nav .where b { font-family: var(--font-display); font-weight: 300; color: var(--caerulean); letter-spacing: 0; font-size: 1.25em; margin-right: .35em; }
.l8w .nav .grow { flex: 1; }
.l8w .nav .quiet { font-size: var(--t-small); color: var(--caerulean); white-space: nowrap; }
.l8w .nav .btn { padding: .6em 1.1em; }
.l8w .nav button.motion { font: 600 var(--t-label)/1 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); background: none; border: 0; padding: .6em .2em; cursor: pointer; white-space: nowrap; }
.l8w .nav button.motion:has(.sw) { display: inline-flex; align-items: center; gap: .6em; padding: .55em .15em; color: var(--ink); }
.l8w .nav button.motion[aria-checked="false"] { color: var(--muted); }
.l8w .nav .motion .sw { position: relative; flex: none; width: 2.25rem; height: 1.25rem; border-radius: 3px; background: var(--caerulean); box-shadow: inset 0 0 0 1.5px var(--caerulean); transition: background-color .2s, box-shadow .2s; }
.l8w .nav .motion .sw::after { content: ""; position: absolute; top: 3px; left: calc(100% - .875rem - 3px); width: .875rem; height: calc(100% - 6px); border-radius: 2px; background: var(--paper); transition: left .2s, background-color .2s; }
.l8w .nav .motion[aria-checked="false"] .sw { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(45, 45, 45, .45); }
.l8w .nav .motion[aria-checked="false"] .sw::after { left: 3px; background: var(--ink); }
.l8w .nav button.motion:focus-visible { outline: 2px solid var(--caerulean); outline-offset: 3px; border-radius: 3px; }
.l8w .nav .motion .sw.pen, .l8w .nav .motion[aria-checked="false"] .sw.pen { width: 3rem; height: 1.75rem; border-radius: 0; background: none; box-shadow: none; transition: none; }
.l8w .nav .motion .sw.pen::after { content: none; }
.l8w .nav .motion .sw.pen svg { display: block; width: 100%; height: 100%; overflow: visible; --sw: 1.7; }
.l8w .nav .motion .sw.pen .lane { fill: var(--caerulean); stroke: var(--caerulean); stroke-width: 1.6; stroke-linejoin: round; }
.l8w .nav .motion[aria-checked="true"] .sw.pen svg { --signal: var(--mauve); }
.l8w .nav .motion[aria-checked="false"] .sw.pen .lane { fill: none; }
.l8w .nav .motion[aria-checked="false"] .sw.pen .dash { display: none; }
.l8w .nav .motion .sw.pen .runner.hop { animation: l8-hop .4s cubic-bezier(.3, .7, .4, 1); }
@keyframes l8-hop { from { transform: translate(calc(var(--dx) * 1px), 0); } 45% { transform: translate(calc(var(--dx) * .5px), -5px); } to { transform: none; } }
.l8w .nav .bar { position: absolute; left: 0; bottom: -1px; height: 2px; width: 100%; background: var(--caerulean); transform-origin: 0 50%; transform: scaleX(var(--prog, 0)); }
.l8w .nav .menu { display: inline-flex; align-items: center; gap: .5em; font: 600 var(--t-label)/1 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink); background: none; border: 0; padding: .6em .2em; cursor: pointer; white-space: nowrap; }
.l8w .nav .menu svg { flex: none; width: 1.5rem; height: 1.5rem; overflow: visible; }
.l8w .nav .menu path, .l8w .sheet .go path { fill: none; stroke: var(--signal); stroke-linecap: round; stroke-linejoin: round; }
.l8w .nav .menu path { stroke-width: 2.6; }
.l8w .sheet { position: fixed; inset: var(--top) 0 0 0; z-index: 70; overflow: auto; overscroll-behavior: contain; background: var(--bg); color: var(--fg); }
.l8w .sheet[hidden] { display: none; }
.l8w .sheet .wrap { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2rem, 6vw, 7rem); align-items: start; padding-block: clamp(1.5rem, 5vh, 4rem); }
.l8w .sheet .eyebrow { margin: 0 0 .9rem; }
.l8w .sheet ol, .l8w .sheet ul { list-style: none; margin: 0; padding: 0; }
.l8w .sheet ol { --ms: clamp(1.375rem, 1rem + 1.9vw, 2.9rem); }
.l8w .sheet ol li { border-top: 1px solid var(--rule); }
.l8w .sheet ol li:last-child { border-bottom: 1px solid var(--rule); }
.l8w .sheet ol a { display: flex; align-items: baseline; gap: 1.1rem; padding: .62em 0; text-decoration: none; font-family: var(--font-display); font-weight: 500; font-size: var(--ms); letter-spacing: -.03em; line-height: 1.1; }
.l8w .sheet ol b { font-weight: 300; color: var(--signal); font-size: .62em; letter-spacing: 0; min-width: 1.9em; }
.l8w .sheet .go { flex: none; margin-left: auto; align-self: center; width: 1.1em; height: .8em; overflow: visible; }
.l8w .sheet .go path { stroke-width: 3; }
.l8w .sheet ol li.sub { border-top-color: rgba(249, 248, 245, .14); border-top-color: color-mix(in srgb, var(--rule) 40%, transparent); }
.l8w .sheet ol li.sub a { font-size: clamp(1.0625rem, .85rem + .9vw, 1.75rem); letter-spacing: -.02em; padding: max(.62em, .8rem) 0 max(.62em, .8rem) calc(1.178 * var(--ms) + 1.1rem); }
.l8w .sheet ol li.sub .go { width: calc(1.1 * var(--ms)); height: calc(.8 * var(--ms)); }
.l8w .sheet ul a { display: block; padding: .42em 0; text-decoration: none; font-family: var(--font-display); font-weight: 400; font-size: var(--t-h3); letter-spacing: -.015em; line-height: 1.2; }
.l8w .sheet ul li:first-child a { font-family: var(--font-display); font-weight: 500; }
.l8w .sheet a[aria-current] span { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .18em; }
.l8w [id] { scroll-margin-top: var(--top); }
.l8w .skip { position: absolute; left: -999px; }
.l8w .skip:focus { left: 1rem; top: 1rem; z-index: 50; background: var(--paper); padding: .5rem 1rem; }
.l8w .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.l8w .pin { height: calc(var(--len, 2) * var(--vh)); }
.l8w .pin > .stage { position: sticky; top: var(--top); height: calc(var(--lvh) - var(--top)); padding-bottom: var(--under); overflow: hidden; background: var(--bg); }
.l8w .stage > .wrap { height: 100%; }
.l8w .duo { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(1.5rem, 4vw, 5rem); align-items: center; height: 100%; padding-block: clamp(1.25rem, 4vh, 3.5rem); }
.l8w .duo.flip > .copy { order: 2; }
.l8w .copy { display: flex; flex-direction: column; gap: clamp(.9rem, 2.2vh, 1.75rem); min-width: 0; }
.l8w .art { min-width: 0; min-height: 0; height: 100%; display: flex; align-items: center; justify-content: center; }
.l8w svg.il { width: 100%; height: 100%; overflow: visible; }
.l8w .flow { padding-block: clamp(3.5rem, 5.5vw, 5.5rem); }
.l8w .hand { fill: none; stroke: var(--signal); stroke-width: var(--sw, 5); stroke-linecap: round; stroke-linejoin: round; }
.l8w .hand.soft { stroke: var(--fg); opacity: .28; }
.l8w .crowd .hand { stroke: var(--fg); opacity: .82; }
.l8w .note { font-family: var(--font-hand); fill: var(--signal); text-transform: uppercase; }
.l8w .num { font-family: var(--font-display); font-weight: 500; }
.l8w .looped { position: relative; white-space: nowrap; }
.l8w .looped svg { max-width: none; position: absolute; left: -.75em; top: -.5em; width: calc(100% + 1.5em); height: calc(100% + 1em); overflow: visible; pointer-events: none; }
.l8w .looped path { fill: none; stroke: var(--signal); stroke-width: calc(var(--pen) * .8); stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.l8w .under { position: relative; white-space: nowrap; }
.l8w .under svg { max-width: none; position: absolute; left: -.1em; bottom: -.42em; width: calc(100% + .2em); height: .5em; overflow: visible; pointer-events: none; }
.l8w .under path { fill: none; stroke: var(--signal); stroke-width: calc(var(--pen) * .8); stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.l8w .hero .stage > .wrap { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: clamp(1rem, 3vh, 2.5rem); padding-block: clamp(1.5rem, 5vh, 4rem) clamp(1.25rem, 4vh, 3rem); }
.l8w .hero h1 span { display: block; }
.l8w .hero h1 span:nth-child(2) { padding-left: var(--col); }
.l8w .hero h1 span:nth-child(3) { padding-left: calc(var(--col) * 2); }
.l8w .hero .copy { max-width: min(34rem, 42%); }
.l8w .hero .art { position: absolute; right: var(--gutter); bottom: clamp(.5rem, 2vh, 1.5rem); width: 54%; height: 52%; align-items: flex-end; }
.l8w .levers .stage { display: grid; grid-template-columns: minmax(0, 62fr) minmax(0, 38fr); }
.l8w .panel { --phase: var(--caerulean); --on-phase: var(--paper); --phase-mark: var(--mauve); background: var(--phase); color: var(--on-phase); padding: clamp(1.25rem, 4.5vh, 3.5rem) clamp(1.25rem, 3vw, 3rem) clamp(1.25rem, 4.5vh, 3.5rem) var(--gutter); display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; min-width: 0; min-height: 0; transition: background-color .4s ease, color .4s ease; }
.l8w .panel[data-phase="2"] { --phase: var(--mauve-dark); --on-phase: var(--ink); --phase-mark: var(--ink); }
.l8w .panel[data-phase="3"] { --phase: var(--olive); --on-phase: var(--paper); --phase-mark: var(--mauve); }
.l8w .panel[data-phase="4"] { --phase: var(--khaki); --on-phase: var(--ink); --phase-mark: var(--caerulean); }
.l8w .panel .eyebrow { color: var(--on-phase); }
.l8w .panel .numeral { font-family: var(--font-display); font-weight: 200; font-size: min(30vw, 44vh); line-height: .8; letter-spacing: -.04em; margin-left: -.06em; transform: translateY(calc((1 - var(--roll, 1)) * 14%)); opacity: var(--roll, 1); }
.l8w .panel .name { opacity: var(--roll, 1); }
.l8w .panel .desc { font-size: var(--t-body); line-height: 1.4; max-width: 30em; opacity: var(--roll, 1); }
.l8w .side { background: var(--paper); color: var(--ink); padding: clamp(1.25rem, 4.5vh, 3.5rem) var(--gutter) clamp(.75rem, 2vh, 1.5rem) clamp(1.25rem, 3vw, 3rem); display: grid; grid-template-rows: auto auto minmax(0, 1fr); gap: clamp(.75rem, 2vh, 1.5rem); min-width: 0; min-height: 0; }
.l8w .index li { display: grid; grid-template-columns: 2.2em 1fr; align-items: baseline; padding: .32em 0; border-top: 1px solid rgba(45, 45, 45, .15); font-size: var(--t-small); line-height: 1.3; color: var(--muted); }
.l8w .index li b { font-family: var(--font-display); font-weight: 300; }
.l8w .index li.is-on { color: var(--ink); font-weight: 600; }
.l8w .index li.is-on b { color: var(--caerulean); }
.l8w .index li .d, .l8w .index li .ph { display: none; }
.l8w .rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(1.5rem, 4vw, 5rem); }
.l8w .rows > li { border-top: 2px solid var(--rule); padding: clamp(1rem, 2.4vw, 1.75rem) 0 clamp(1.25rem, 3vw, 2.25rem); display: flex; flex-direction: column; gap: .6rem; }
.l8w .rows.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.l8w .rows .n { font-family: var(--font-display); font-weight: 300; color: var(--signal); font-size: var(--t-h3); line-height: 1; }
.l8w .cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.75rem, 1.4vw, 1.25rem); }
.l8w .card { background: var(--white); border: 1px solid rgba(45, 45, 45, .15); border-radius: 3px; padding: clamp(1rem, 1.8vw, 1.6rem); display: flex; flex-direction: column; gap: .6rem; min-width: 0; }
.l8w .split { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(1.5rem, 4vw, 5rem); align-items: end; }
.l8w .two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 5rem); }
.l8w .days { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 5rem); }
.l8w .days > div { display: flex; flex-direction: column; gap: .6rem; }
.l8w .days > div:last-child { text-align: right; align-items: flex-end; }
.l8w .person { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(1rem, 2vw, 1.75rem); align-items: start; }
.l8w .person img { width: clamp(4.5rem, 7vw, 7rem); height: clamp(4.5rem, 7vw, 7rem); border-radius: 50%; object-fit: cover; }
.l8w .strip { height: clamp(9rem, 22vw, 20rem); }
.l8w .gap-l { margin-top: clamp(2rem, 5vw, 4.5rem); }
.l8w .gap-m { margin-top: clamp(1.25rem, 3vw, 2.5rem); }
.l8w .foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem 2rem; border-top: 2px solid var(--rule); padding-top: 1.25rem; font-size: var(--t-small); }
.l8w .foot img { height: 1.375rem; width: auto; }
.l8w .tail { padding-block: clamp(2.5rem, 4.5vw, 4rem) clamp(1.5rem, 3vw, 2.5rem); font-size: var(--t-small); line-height: 1.4; }
.l8w main:has(> .sec.on-caerulean:last-child) + .tail { padding-top: 0; }
.l8w main:has(> .sec.on-caerulean:last-child) + .tail .fmap { border-top: 2px solid var(--rule); padding-top: clamp(1.75rem, 3vw, 2.5rem); }
.l8w .tail .fmap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-areas: "brand nav" "foot nav"; grid-template-rows: auto 1fr; gap: 1.75rem clamp(1.5rem, 4vw, 5rem); }
.l8w .tail .fbrand { grid-area: brand; display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
.l8w .tail .fbrand img { height: clamp(1.5rem, 1.1rem + .8vw, 2.125rem); width: auto; }
.l8w .tail .fbrand p { color: var(--soft); max-width: 24em; }
.l8w .tail .fnav { grid-area: nav; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 3fr); gap: 1.5rem clamp(1.25rem, 3vw, 3rem); }
.l8w .tail .fnav ul { margin-top: .75rem; }
.l8w .tail .fnav a { display: inline-block; padding-block: .2rem; text-decoration: none; text-underline-offset: .22em; text-decoration-thickness: 2px; }
.l8w .tail .fnav a:hover, .l8w .tail .fnav a[aria-current] { text-decoration: underline; text-decoration-color: var(--signal); }
.l8w .tail .fnav .sub { padding-left: 1em; }
.l8w .tail .fnav .sub a { color: var(--soft); }
.l8w .tail .foot { grid-area: foot; align-self: end; justify-content: flex-start; gap: .5rem 2rem; border-top: 0; padding-top: 0; }
.l8w .tail .foot > p { flex: 0 0 100%; }
.l8w .tail .link { --d: 1 !important; }
@media (max-width: 860px) {
  .l8w .tail .fmap { grid-template-columns: minmax(0, 1fr); grid-template-areas: "brand" "nav" "foot"; grid-template-rows: auto; }
  .l8w .tail .fnav { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .l8w .tail .foot { border-top: 2px solid var(--rule); padding-top: 1.25rem; }
}
.l8w .mail { user-select: all; }
.l8w.still .pin { height: auto; }
.l8w.still .pin > .stage { position: static; height: auto; padding-bottom: 0; overflow: visible; }
.l8w.still .duo, .l8w.still .hero .stage > .wrap { height: auto; }
.l8w.still .art { height: clamp(15rem, 44vw, 34rem); }
.l8w.still .levers .stage { display: block; }
.l8w.still .panel { display: none; }
.l8w.still .side { padding: clamp(3.5rem, 5.5vw, 5.5rem) var(--gutter); display: block; }
.l8w.still .side .art { height: clamp(13rem, 30vw, 22rem); margin-top: 2rem; }
.l8w.still .index { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.75rem, 1.4vw, 1.25rem); margin-top: 2rem; }
.l8w.still .index li, .l8w.still .index li.is-on { display: flex; flex-direction: column; gap: .5rem; background: var(--white); border: 0; border-top: 8px solid var(--pc); border-radius: 2px; padding: 1.1rem 1.2rem 1.3rem; color: var(--ink); font-weight: 400; }
.l8w.still .index li b { font-size: var(--t-heading); line-height: 1; color: var(--caerulean); }
.l8w.still .index li .nm { font-family: var(--font-display); font-weight: 500; font-size: var(--t-h3); line-height: 1.2; }
.l8w.still .index li .d { display: block; font-size: var(--t-small); line-height: 1.45; }
.l8w.still .index li .ph { display: block; font-size: var(--t-label); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
@media (max-width: 860px) {
  .l8w .duo, .l8w .duo.flip { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); align-items: start; gap: 1rem; }
  .l8w .duo.flip > .copy { order: 0; }
  .l8w .copy > .act { order: 9; }
  .l8w .hero h1 span { display: inline; padding-left: 0 !important; }
  .l8w .hero .stage > .wrap { display: grid; grid-template-rows: auto auto minmax(0, 1fr); justify-content: stretch; gap: .9rem; }
  .l8w .hero .copy { max-width: none; }
  .l8w .hero .art { position: static; width: auto; height: 100%; }
  .l8w .levers .stage { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
  .l8w .panel { padding: 1.1rem var(--gutter) 1.2rem; gap: .6rem; }
  .l8w .panel .numeral { font-size: min(34vw, 20vh); }
  .l8w .side { padding: .9rem var(--gutter) .5rem; grid-template-rows: auto minmax(0, 1fr); }
  .l8w:not(.still) .index { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .l8w .rows, .l8w .rows.three, .l8w .two, .l8w .split, .l8w.still .index { grid-template-columns: minmax(0, 1fr); }
  .l8w .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .l8w .nav .quiet, .l8w .nav .where span { display: none; }
  .l8w .nav .where { flex: none; overflow: visible; margin-left: 0; }
  .l8w .nav .wrap { gap: .75rem; }
  .l8w .nav .menu span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .l8w .nav .menu { order: 9; min-width: 2.5rem; min-height: 2.75rem; justify-content: center; padding: 0; margin-right: -.5rem; }
  .l8w .sheet .wrap { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
  .l8w .sheet ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1rem; }
  .l8w .strip { height: clamp(11rem, 48vw, 16rem); }
}
@media (max-width: 520px) {
  .l8w .cards { grid-template-columns: minmax(0, 1fr); }
  .l8w .days { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .l8w .days > div:last-child { text-align: left; align-items: flex-start; }
  .l8w .nav button.motion:not(:has(.sw)) { display: none; }
  .l8w .nav button.motion:has(.sw) { padding: .5rem 0; }
  .l8w .nav button.motion:has(.sw) > span:not(.sw) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .l8w .nav .motion .sw.pen, .l8w .nav .motion[aria-checked="false"] .sw.pen { width: 2.25rem; height: 1.625rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) { gap: .5rem; }
  .l8w .nav button.motion:has(.sw):focus-visible { outline-offset: 1px; }
  .l8w .nav .btn { padding: .6em .85em; }
  .l8w .nav .wrap:has(.menu) .where { display: none; }
}
@media (max-width: 429px) {
  .l8w .nav .wrap:has(.menu) { gap: .5rem; }
  .l8w .nav .wrap:has(.menu) .btn { font-size: .875rem; padding: .6em .75em; }
  .l8w .nav .wrap:has(.menu):has(.sw) { gap: .375rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) > a:first-child { min-width: 5rem; }
  .l8w .nav .motion .sw.pen, .l8w .nav .motion[aria-checked="false"] .sw.pen { width: 2rem; }
}
@media (max-width: 369px) {
  .l8w .nav .where { display: none; }
  .l8w .nav .wrap:has(.menu):has(.sw) .btn { font-size: .8125rem; padding: .6em .6em; }
  .l8w .nav .motion .sw.pen, .l8w .nav .motion[aria-checked="false"] .sw.pen { width: 1.875rem; }
}
@media (max-width: 359px) {
  .l8w .nav .wrap { gap: .5rem; }
  .l8w .nav .btn { padding: .6em .7em; }
  .l8w .nav .wrap:has(.menu) .btn { font-size: .8125rem; padding: .6em .55em; }
  .l8w .nav .menu { min-width: 2.25rem; margin-right: -.375rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) { gap: .3125rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) > a:first-child { min-width: 4.75rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) .btn { padding: .6em .45em; }
}
@media (max-width: 339px) {
  .l8w .nav .wrap:has(.menu) > a:first-child { min-width: 5.25rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) > a:first-child { min-width: 4.5rem; }
  .l8w .nav .wrap:has(.menu):has(.sw) .btn { font-size: .75rem; padding: .6em .5em; }
  .l8w .nav .motion .sw.pen, .l8w .nav .motion[aria-checked="false"] .sw.pen { width: 1.625rem; }
}
@media (min-width: 861px) and (max-width: 1149px) {
  .l8w .nav .quiet { white-space: normal; max-width: 11.5em; line-height: 1.2; text-align: right; }
}
@media (min-width: 861px) and (max-width: 999px) {
  .l8w .nav .wrap:has(.quiet) .where span { display: none; }
  .l8w .nav .wrap:has(.quiet) .menu span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}
@media (min-width: 861px) {
  .l8w .only-narrow { display: none; }
}
.l8w .hl { font-family: var(--font-display); font-weight: 500; font-size: .92em; letter-spacing: -.01em; padding: .04em .34em .08em; border-radius: 3px; background: var(--hl); color: var(--ink); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.l8w .hl.kh { --hl: var(--khaki); }
.l8w .hl.mv { --hl: var(--mauve); }
.l8w .hl.bl { --hl: var(--caerulean); color: var(--paper); }
.l8w .pen-u { padding-bottom: .16em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7C40 4 80 9 120 6S180 4 198 7' fill='none' stroke='%230046C6' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 100% / 100% .34em no-repeat; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.l8w .pen-u.c-mv { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7C40 4 80 9 120 6S180 4 198 7' fill='none' stroke='%23DFC3FF' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); }
.l8w .pen-u.c-ink { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7C40 4 80 9 120 6S180 4 198 7' fill='none' stroke='%232D2D2D' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); }
.l8w .pen-u.c-paper { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7C40 4 80 9 120 6S180 4 198 7' fill='none' stroke='%23F9F8F5' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); }
.l8w .f-hand { font-family: var(--font-hand); text-transform: uppercase; letter-spacing: .02em; font-size: 1.08em; color: var(--signal); }
