@font-face {
  font-family: "SF Pro Display";
  src: url("./assets/fonts/sf-pro-display-regular.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "SF Pro Text";
  src: local("SF Pro Text"), local("SF Pro Text Regular");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "PP Editorial Old";
  src: url("./assets/fonts/pp-editorial-old-regular.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "PP Editorial Old";
  src: url("./assets/fonts/pp-editorial-old-italic.otf") format("opentype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

:root {
  --ink: #171717;
  --space-gray: #262626;
  --paper: #f1f1ef;
  --line: rgba(23, 23, 23, 0.18);
  --pad: clamp(20px, 3.2vw, 56px);
  --radius: clamp(24px, 3vw, 48px);
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--paper);
}

* { box-sizing: border-box; }
html { width: 100%; max-width: 100%; overflow-x: clip; scroll-behavior: smooth; background: #f6f6f4; }
body { width: 100%; max-width: 100%; margin: 0; background: #f6f6f4; color: var(--ink); overflow-x: clip; }
body.intro-locked { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
main#top { background: var(--page-bg, #f6f6f4); }

.site-intro { position: fixed; z-index: 200; inset: 0; overflow: hidden; background: #080b0f; color: #f1f1ef; opacity: var(--intro-opacity, 1); filter: contrast(var(--intro-contrast, 1)); transition: opacity .18s linear, filter .18s linear, visibility 0s .85s; }
.site-intro.is-blending { pointer-events: none; background: transparent; }
.site-intro.is-leaving { opacity: 0; visibility: hidden; }
.site-intro.is-skipped { transition-duration: .38s; }
.intro-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; opacity: 0; pointer-events: none; }
.intro-canvas { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; }
.intro-skip {
  position: absolute; z-index: 3; right: clamp(24px, 3.2vw, 52px); bottom: clamp(24px, 3.2vw, 44px);
  padding: 8px 0; border: 0; background: transparent; color: rgba(255,255,255,.76);
  font: 500 12px/1 "Courier New", monospace; letter-spacing: .08em; cursor: pointer;
  transition: color .2s ease, opacity .2s ease;
}

.intro-skip:hover, .intro-skip:focus-visible { color: #fff; }
.intro-skip:focus-visible { outline: 1px solid currentColor; outline-offset: 6px; }
.site-intro.is-blending .intro-skip { opacity: 0; pointer-events: none; }
.intro-pending .site-header,
.intro-pending .hero-kicker,
.intro-pending .hero-footer { opacity: 0; }
.intro-pending .title-line > span,
.intro-pending .hero-title__piece > span,
.intro-pending [data-reveal],
.intro-pending .hero-media { animation-play-state: paused !important; }
.intro-blending .site-header,
.intro-blending .hero-kicker,
.intro-blending .hero-footer { animation: intro-hero-flicker .95s steps(1,end) both; }
.intro-blending .hero { animation: intro-hero-decode 1.25s cubic-bezier(.22,.8,.24,1) both; }

.site-header {
  position: fixed; z-index: 50; inset: 0 0 auto 0; display: flex; align-items: center;
  justify-content: space-between; padding: 34px calc(var(--pad) + 24px); color: var(--ink); pointer-events: none;
  transform: translateY(30px);
}
.site-header a, .site-header button { pointer-events: auto; }
.site-header nav { display: flex; align-items: center; gap: 8px; }
.wordmark { display: inline-flex; align-items: center; font-size: 13px; font-weight: 700; line-height: 1; letter-spacing: -.03em; color: #111; transition: color .25s ease; }
.wordmark span { display: inline-flex; align-items: center; justify-content: center; min-height: 17px; margin-left: 4px; padding: 1px 4px 0; background: var(--space-gray); color: #fff; font: inherit; letter-spacing: inherit; line-height: 1; transition: color .25s ease, background-color .25s ease; }
.nav-link { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; }
.nav-pill { box-sizing: border-box; position: relative; height: 30px; padding: 0 16px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; font: 600 13px/1 "Courier New", monospace; letter-spacing: .035em; transition: color .3s ease, background-color .3s ease, border-color .3s ease, transform .35s cubic-bezier(.16,1,.3,1); }
.nav-pill > span { display: block; transition: transform .42s cubic-bezier(.16,1,.3,1), opacity .22s ease; }
.nav-pill::after { content: attr(data-label); position: absolute; left: 50%; top: 50%; transform: translate(-50%, 145%); white-space: nowrap; transition: transform .42s cubic-bezier(.16,1,.3,1); }
.nav-pill:hover > span { transform: translateY(-145%); opacity: .2; }
.nav-pill:hover::after { transform: translate(-50%, -50%); }
.nav-pill:active { transform: scale(.96); }
.nav-pill--filled { border: 1px solid #262626; background: #262626; color: #fafafa; }
.nav-pill--filled:hover { background: #fff; color: #262626; }
.nav-pill--outline { border: 1px solid #262626; background: #fff; color: #262626; }
.nav-pill--outline:hover { background: #262626; color: #fafafa; }
.nav-pill--filled.is-section-active { border-color: #fafafa; }
.nav-pill--outline.is-section-active { border-color: #fafafa; background: #262626; color: #fafafa; }
.nav-pill--filled.is-section-muted { border-color: transparent; background: #fff; color: #262626; }
.nav-pill--filled.is-section-muted:hover { border-color: #262626; background: #262626; color: #fafafa; }
.language-switch { box-sizing: border-box; height: 30px; margin-left: 4px; display: inline-flex; align-items: center; padding: 2px; border-radius: 7px; background: #e7e7e5; }
.language-switch button { box-sizing: border-box; min-width: 29px; height: 26px; padding: 0 7px; border: 0; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; background: transparent; color: #b6b6b3; font: 600 13px/1 "Courier New", monospace; cursor: pointer; transition: color .25s ease, background-color .25s ease, transform .25s ease; }
.language-switch button:hover { color: var(--ink); }
.language-switch button:active { transform: scale(.92); }
.language-switch button.is-active { background: #fff; color: #262626; }
.header-on-dark .language-switch { background: #e7e7e5; }
.header-on-dark .language-switch button { color: #b6b6b3; }
.header-on-dark .language-switch button.is-active { color: #171717; background: #fff; }
.header-on-dark .wordmark { color: #fff; }
.header-on-dark .wordmark span { color: #111; background: #fff; }

.hero { position: relative; isolation: isolate; min-height: calc(100svh - 48px); margin: 24px; padding: 100px var(--pad) 42px; border-radius: 24px; display: flex; flex-direction: column; overflow: hidden; background: #f3f3f1; }
.hero::before { content: ""; position: absolute; z-index: 1; inset: 0; background: rgba(255,255,255,.2); pointer-events: none; }
.hero-media { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: .4; filter: saturate(.68) contrast(.94) brightness(1.24); pointer-events: none; transition: opacity .6s ease, filter .6s ease, transform 1.2s cubic-bezier(.16,1,.3,1); }
.hero:hover .hero-media { opacity: .44; filter: saturate(.72) contrast(.96) brightness(1.2); transform: scale(1.008); }
.hero-pointer-trail { position: absolute; z-index: 2; inset: 0; overflow: hidden; pointer-events: none; }
.hero-pointer-card { position: absolute; width: 116px; height: 116px; background: var(--trail-pink); opacity: 0; transform: translate(-50%, -50%) scale(.15); transform-origin: center; animation: hero-pointer-card-life 3s cubic-bezier(.16,1,.3,1) forwards; will-change: transform, opacity; }
.hero-kicker, .hero-footer { position: relative; z-index: 3; display: flex; justify-content: space-between; font: 11px/1.3 "Courier New", monospace; text-transform: uppercase; letter-spacing: .05em; }
.hero-title { position: relative; z-index: 3; container-type: inline-size; width: min(120%, 1416px); aspect-ratio: 397 / 88; margin: auto 0; margin-left: clamp(24px, 5vw, 96px); color: var(--ink); transform: translateY(clamp(64px, 10vh, 128px)); }
.hero-title__piece { position: absolute; display: flex; align-items: center; overflow: hidden; white-space: nowrap; }
.hero-title__piece > span { display: block; width: max-content; transform: translateY(110%); animation: title-in 1.15s cubic-bezier(.16,1,.3,1) forwards; }
.hero-title__sans { top: 0; left: 0; width: 76.3224cqw; height: 11.5869cqw; font: 400 9.068cqw/normal "SF Pro Display", Arial, sans-serif; letter-spacing: -.5441cqw; color: var(--space-gray); }
.hero-title__for { top: 9.068cqw; left: 0; width: 8.8161cqw; height: 5.5416cqw; font: 300 4.534cqw/normal "SF Pro Display", Arial, sans-serif; letter-spacing: -.3627cqw; color: var(--space-gray); }
.hero-title__complex,
.hero-title__worlds { height: 11.5869cqw; font: 400 8.0605cqw/.86 "PP Editorial Old", Georgia, serif; color: var(--space-gray); }
.hero-title__complex { top: 8.8161cqw; left: 9.5718cqw; width: 26.7003cqw; }
.hero-title__worlds { top: calc(15.256cqw - 1px); left: 34.978cqw; width: 47.5cqw; }
.hero-title__complex b,
.hero-title__complex i,
.hero-title__worlds b,
.hero-title__worlds i { font: inherit; }
.hero-title__complex b,
.hero-title__worlds b { font-style: normal; }
.hero-title__complex i,
.hero-title__worlds i { font-style: italic; }
.hero-title__complex b:nth-child(1) { letter-spacing: -.8866cqw; }
.hero-title__complex i:nth-child(2) { letter-spacing: -.806cqw; }
.hero-title__complex i:nth-child(3) { letter-spacing: -.8866cqw; }
.hero-title__complex i:nth-child(4) { letter-spacing: -.6448cqw; }
.hero-title__worlds b:nth-child(1) { letter-spacing: -.403cqw; }
.hero-title__worlds i:nth-child(2) { letter-spacing: -.403cqw; }
.hero-title__worlds .hero-title__space { letter-spacing: .403cqw; }
.hero-title__worlds b:nth-child(4) { letter-spacing: -1.1285cqw; }
.hero-title__worlds i:nth-child(5) { letter-spacing: -.403cqw; }
.hero-title__worlds i:nth-child(6) { letter-spacing: -.2418cqw; }
.hero-title__worlds i:nth-child(7) { letter-spacing: -.403cqw; }
.hero-title__worlds b:nth-child(8) { letter-spacing: -.2821cqw; }
.hero-title__worlds b:nth-child(9) { letter-spacing: -.3224cqw; }
.hero-title__piece:nth-child(2) > span { animation-delay: .1s; }
.hero-title__piece:nth-child(3) > span { animation-delay: .18s; }
.hero-title__piece:nth-child(4) > span { animation-delay: .26s; }
.title-line { position: absolute; display: block; overflow: hidden; padding-block: .18em; margin-block: -.18em; white-space: nowrap; }
.title-line > span { display: block; width: max-content; transform: translateY(110%); animation: title-in 1.15s cubic-bezier(.16,1,.3,1) forwards; }
.title-line:nth-child(2) > span { animation-delay: .12s; }
.title-line:nth-child(3) > span { animation-delay: .24s; }
.title-line:nth-child(4) > span { animation-delay: .34s; }
.hero-lockup__sans { top: 0; left: 0; font-size: 1em; letter-spacing: -.06em; }
.hero-lockup__for { top: .78em; left: 0; font-size: .667em; letter-spacing: -.08em; }
.hero-lockup__complex,
.hero-lockup__worlds { font-family: "PP Editorial Old", Georgia, serif; font-size: .889em; line-height: .86; letter-spacing: 0; }
.hero-lockup__complex { top: .61em; left: .94em; }
.hero-lockup__worlds { top: 1.29em; left: 3.55em; }
.hero-lockup__complex b,
.hero-lockup__complex i,
.hero-lockup__worlds b,
.hero-lockup__worlds i { font: inherit; }
.hero-lockup__complex b,
.hero-lockup__worlds b { font-style: normal; }
.hero-lockup__complex i,
.hero-lockup__worlds i { font-style: italic; }
.hero-lockup__complex b:nth-child(1) { letter-spacing: -.11em; }
.hero-lockup__complex i:nth-child(2) { letter-spacing: -.10em; }
.hero-lockup__complex i:nth-child(3) { letter-spacing: -.11em; }
.hero-lockup__complex i:nth-child(4) { letter-spacing: -.08em; }
.hero-lockup__worlds b:nth-child(1) { letter-spacing: -.05em; }
.hero-lockup__worlds i:nth-child(2) { letter-spacing: -.05em; }
.hero-lockup__worlds .hero-lockup__space { letter-spacing: .05em; }
.hero-lockup__worlds b:nth-child(4) { letter-spacing: -.14em; }
.hero-lockup__worlds i:nth-child(5) { letter-spacing: -.05em; }
.hero-lockup__worlds i:nth-child(6) { letter-spacing: -.03em; }
.hero-lockup__worlds i:nth-child(7) { letter-spacing: -.05em; }
.hero-lockup__worlds b:nth-child(8) { letter-spacing: -.035em; }
.hero-lockup__worlds b:nth-child(9) { letter-spacing: -.04em; }
.hero-footer { align-items: center; }
.hero-footer p { margin: 0; font: 12px Arial, sans-serif; text-transform: uppercase; letter-spacing: .55px; }
.discover-link { display: flex; align-items: center; gap: 16px; font: 12px Arial, sans-serif; }
.link-arrow { width: 44px; height: 44px; border: 1px solid var(--space-gray); border-radius: 50%; display: grid; place-items: center; background: var(--space-gray); color: #fff; transition: transform .45s cubic-bezier(.16,1,.3,1), background .3s, color .3s; }
.link-arrow::before { content: ""; width: 8px; height: 8px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; }
.discover-link:hover .link-arrow { transform: rotate(45deg) scale(1.08); background: var(--space-gray); color: #fff; }

.work { position: relative; z-index: 1; background: transparent; color: var(--page-fg, #f4f3ef); padding: clamp(110px, 14vw, 220px) var(--pad); }
.work::after { content: ""; position: fixed; inset: 0; z-index: 25; pointer-events: none; background: var(--paper); opacity: var(--stack-wash, 0); will-change: opacity; }
.transition-dark .work::after { background: #111; }
.section-heading { display: grid; grid-template-columns: 1fr 2fr; margin-bottom: clamp(80px, 10vw, 150px); }
.section-heading p { margin: 12px 0 0 24px; font: 11px "Courier New", monospace; text-transform: uppercase; }
.section-heading h2 {
  margin: 0;
  font-family: "SF Pro Display", Arial, sans-serif;
  font-size: clamp(48px, 7vw, 108px);
  font-weight: 400;
  line-height: normal;
  letter-spacing: -.06em;
}
.js .section-heading > p,
.js .section-heading > h2 { opacity: 0; transform: translate3d(0, 42px, 0); }
.js .section-heading.is-visible > p,
.js .section-heading.is-visible > h2 { opacity: 1; transform: none; transition: opacity .7s ease, transform .9s cubic-bezier(.16,1,.3,1); }
.js .section-heading.is-visible > h2 { transition-delay: .08s; }
.work-title__sans,
.work-title__editorial { display: inline-block; }
.work-title__editorial {
  display: inline-block;
  font-family: "PP Editorial Old", Georgia, serif;
  font-style: normal;
  font-weight: 400;
  line-height: .86;
  letter-spacing: -.06em;
  color: inherit;
  transform: translateY(-.075em);
}
.work-title__editorial i {
  font: inherit;
  font-style: italic;
}
.work-card-stage { position: relative; background: transparent; }
.project-stack { --card-width: min(88vw, 1760px); position: relative; z-index: 1; display: block; width: var(--card-width); margin-inline: auto; padding-bottom: 72vh; }
.project-slot { position: relative; z-index: 1; height: min(72vh, 760px); }
.project-slot:not(:last-child) { margin-bottom: 24px; }
.project-card { position: absolute; inset: 0; min-height: min(72vh, 760px); padding: clamp(20px, 2vw, 34px); border-radius: var(--radius); corner-shape: squircle; overflow: hidden; display: grid; grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr); grid-template-rows: auto 1fr auto; column-gap: clamp(28px, 3vw, 58px); transform-style: flat; transform-origin: 50% 50%; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); box-shadow: 0 -18px 50px rgba(0,0,0,.28); transition: filter .45s; will-change: transform; visibility: hidden; }
.cards-active .project-card { position: fixed; left: calc((100vw - var(--card-width)) / 2); right: auto; width: var(--card-width); bottom: auto; visibility: visible; z-index: 20; }
.cards-active .project-slot:nth-child(1) .project-card { top: max(72px, calc((100svh - min(72vh, 760px)) / 2 - 28px)); }
.cards-active .project-slot:nth-child(2) .project-card { top: max(96px, calc((100svh - min(72vh, 760px)) / 2 - 4px)); }
.cards-active .project-slot:nth-child(3) .project-card { top: max(120px, calc((100svh - min(72vh, 760px)) / 2 + 20px)); }
.cards-active .project-slot:nth-child(4) .project-card { top: max(160px, calc((100svh - min(72vh, 760px)) / 2 + 60px)); }
.js .project-card { transform: perspective(1300px) translate3d(0, var(--rise-y, 82vh), var(--rise-z, 620px)) rotateX(var(--rise-angle, 89deg)) scale(var(--rise-scale, 1)); }
.measure-card-flow .project-card { position: relative !important; top: auto !important; transform: none !important; }
.project-card--light { background: #e8e3dc; color: #171717; }
.project-card--blue { background: #c6dcff; color: #111a2d; }
.project-card--dark { background: #232323; color: #f4f2ee; }
.project-card--lime { background: #d9f3ad; color: #172014; }
.project-card--clickable { cursor: pointer; }
.project-card--clickable .portfolio-video { cursor: default; }
.card-meta { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 2fr auto; font: 11px "Courier New", monospace; text-transform: uppercase; }
.card-copy { align-self: end; padding: 40px 20px 24px 0; z-index: 2; }
.card-copy h3 { margin: 0 0 16px; font: 500 clamp(52px, 6.2vw, 112px)/.86 Arial, sans-serif; letter-spacing: -.075em; }
.card-copy p { max-width: 300px; margin: 0; font-size: clamp(17px, 1.5vw, 24px); line-height: 1.2; }
.card-visual { grid-column: 2; grid-row: 2 / 4; align-self: center; margin: 24px 0 0; overflow: hidden; border-radius: calc(var(--radius) * .65); corner-shape: squircle; transform: none; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); }
.portfolio-video { position: relative; aspect-ratio: 16 / 9; background: #080808; cursor: pointer; }
.portfolio-video iframe,
.youtube-player { display: block; width: 100%; height: 100%; border: 0; background: #080808; transform: translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.portfolio-video iframe { pointer-events: none; transform: translate3d(0,0,0) scale(1.003); transform-origin: 50% 50%; backface-visibility: hidden; -webkit-backface-visibility: hidden; will-change: transform; }
.portfolio-image { aspect-ratio: 16 / 9; background: #151515; }
.portfolio-image img { height: 100%; object-fit: cover; }
.video-controls { position: absolute; z-index: 3; left: 14px; right: 14px; bottom: 14px; display: grid; grid-template-columns: auto minmax(80px, 1fr) auto minmax(56px, 86px) auto; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(16,16,16,.72); color: #fff; opacity: 0; transform: translateY(8px); pointer-events: none; backdrop-filter: blur(14px); transition: opacity .25s ease, transform .35s cubic-bezier(.16,1,.3,1); }
.portfolio-video:hover .video-controls,
.portfolio-video:focus-within .video-controls { opacity: 1; transform: translateY(0); pointer-events: auto; }
.video-controls button { width: 30px; height: 30px; padding: 5px; border: 0; border-radius: 50%; display: grid; place-items: center; background: transparent; color: inherit; cursor: pointer; transition: background .2s ease, transform .2s ease; }
.video-controls button:hover { background: rgba(255,255,255,.14); }
.video-controls button:active { transform: scale(.9); }
.video-controls button:focus-visible { outline: 1px solid #fff; outline-offset: 2px; }
.video-controls button svg { display: block; width: 18px; height: 18px; fill: currentColor; }
.video-controls button .icon-stroke { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.video-controls input { width: 100%; height: 2px; margin: 0; accent-color: #fff; cursor: pointer; }
.video-controls .video-volume { max-width: 86px; }
.video-poster { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; overflow: hidden; color: #fff; background: #080808; cursor: pointer; }
.video-poster::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.12); transition: background .35s; }
.video-poster img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.video-poster span { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%,-50%); padding: 12px 16px; border-radius: 999px; background: rgba(20,20,20,.76); backdrop-filter: blur(10px); font: 700 10px/1 "Courier New", monospace; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.video-poster:hover::after { background: rgba(0,0,0,.04); }
.video-poster:hover img { transform: scale(1.025); }
.card-action { align-self: end; display: flex; gap: 12px; align-items: center; font: 12px "Courier New", monospace; text-transform: uppercase; }
.card-action b { width: 36px; height: 36px; border: 1px solid currentColor; border-radius: 50%; display: grid; place-items: center; transition: transform .45s, background .3s, color .3s; }
.card-action b::before { content: ""; width: 7px; height: 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; }
.project-card:hover .card-action b { transform: rotate(45deg); background: currentColor; color: #eee; }

.resume-section { position: relative; z-index: 30; margin-top: min(-34vh, -260px); background: var(--paper); color: var(--ink); padding: 24px; border-radius: clamp(26px, 2.2vw, 42px) clamp(26px, 2.2vw, 42px) 0 0; box-shadow: 0 -24px 70px rgba(0,0,0,.13); scroll-margin-top: 20px; }
.js .resume-experience--primary,
.js .resume-statement,
.js .resume-lower { opacity: 0; transform: translateY(54px); transition: opacity .85s cubic-bezier(.16,1,.3,1), transform 1.05s cubic-bezier(.16,1,.3,1); }
.js .resume-statement { transition-delay: .08s; }
.js .resume-lower { transition-delay: .16s; }
.js .resume-visible .resume-experience--primary,
.js .resume-visible .resume-statement,
.js .resume-visible .resume-lower { opacity: 1; transform: translateY(0); }
.resume-primary { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr); gap: 16px; min-height: min(44vw, 860px); }
.resume-gallery,
.resume-statement { position: relative; min-width: 0; overflow: hidden; border-radius: 24px; }
.resume-gallery { background: #fafafa; padding: clamp(32px, 4vw, 64px); }
.resume-eyebrow { margin: 0 0 28px; font: 10px/1 "Courier New", monospace; text-transform: uppercase; letter-spacing: .06em; }
.resume-gallery h2 { position: relative; z-index: 2; margin: 0; font-size: clamp(56px, 4.5vw, 88px); line-height: .86; letter-spacing: -.075em; font-weight: 500; }
.resume-cascade { position: absolute; inset: 28% 5% 5% 30%; }
.resume-tile { position: absolute; width: clamp(62px, 6vw, 105px); aspect-ratio: 1 / 1; margin: 0; overflow: hidden; border-radius: 10px; box-shadow: 0 12px 24px rgba(0,0,0,.13); opacity: 0; transform: translate3d(0, 90px, 0) scale(.88); will-change: transform, opacity; }
.resume-tile img { width: 100%; height: 100%; object-fit: cover; }
.resume-tile--1 { left: 0; bottom: 0; z-index: 9; }
.resume-tile--2 { left: 11%; bottom: 8%; z-index: 8; }
.resume-tile--3 { left: 22%; bottom: 16%; z-index: 7; }
.resume-tile--4 { left: 34%; bottom: 26%; z-index: 6; }
.resume-tile--5 { left: 46%; bottom: 36%; z-index: 5; }
.resume-tile--6 { left: 58%; bottom: 46%; z-index: 4; }
.resume-tile--7 { left: 69%; bottom: 57%; z-index: 3; }
.resume-tile--8 { left: 80%; bottom: 67%; z-index: 2; }
.resume-tile--9 { left: 90%; bottom: 77%; z-index: 1; }
.resume-tile--2,
.resume-tile--5,
.resume-tile--8 { width: clamp(50px, 4.7vw, 82px); }
.resume-tile--4,
.resume-tile--7 { width: clamp(72px, 6.8vw, 118px); }
.resume-statement { display: flex; flex-direction: column; justify-content: center; background: #232323 url("./assets/resume-dot-texture.png") center / cover; color: #fafafa; padding: clamp(44px, 5vw, 88px); }
.resume-statement-trail { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.resume-quote { position: absolute; z-index: 2; top: 15%; left: 11%; font: 700 clamp(34px, 3vw, 52px)/1 Arial, sans-serif; }
.resume-statement p { position: relative; z-index: 2; max-width: 720px; margin: 0; font-size: clamp(34px, 3.35vw, 58px); line-height: .9; letter-spacing: -.06em; font-weight: 500; }
.resume-byline { position: relative; z-index: 2; margin-top: clamp(30px, 4vw, 58px); font-size: clamp(12px, 1vw, 16px); }
.resume-lower { display: grid; grid-template-columns: minmax(220px, .37fr) minmax(0, 1.63fr); gap: 16px; margin-top: 16px; }
.resume-preview { position: relative; min-height: 230px; overflow: hidden; border-radius: 24px; background: #2a2a2a; }
.resume-preview::after { content: ""; position: absolute; inset: 0; background: rgba(20,20,20,.56); transition: background .35s; }
.resume-preview img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; filter: grayscale(1); transition: transform .8s cubic-bezier(.16,1,.3,1), filter .4s; }
.resume-preview span { position: absolute; z-index: 2; inset: 50% auto auto 50%; transform: translate(-50%,-50%); padding: 12px 16px; border: 1px solid rgba(255,255,255,.75); border-radius: 7px; color: white; font: 700 10px/1 "Courier New", monospace; text-transform: uppercase; white-space: nowrap; }
.resume-preview:hover::after { background: rgba(20,20,20,.32); }
.resume-preview:hover img { transform: scale(1.035); filter: grayscale(.3); }
.resume-experience { display: flex; flex-direction: column; min-width: 0; padding: 24px; border-radius: 24px; background: #fafafa; }
.resume-experience--primary { padding: clamp(28px, 3vw, 48px); }
.resume-experience--primary h2 { margin: 0; font-size: clamp(36px, 4vw, 64px); line-height: .95; font-weight: 500; letter-spacing: -.055em; }
.resume-experience--primary .resume-eyebrow { margin-bottom: 22px; }
.resume-experience--primary .resume-roles { margin-top: auto; padding-top: clamp(46px, 6vw, 86px); }
.resume-experience-head { display: flex; justify-content: space-between; align-items: start; gap: 24px; }
.resume-experience h3 { margin: 0; font-size: clamp(24px, 2vw, 36px); line-height: 1; font-weight: 500; letter-spacing: -.04em; }
.resume-experience-head p { margin: 8px 0 0; max-width: 360px; font-size: 13px; line-height: 1.25; }
.resume-download { flex: 0 0 auto; white-space: nowrap; }
.resume-roles { display: grid; grid-template-columns: 1fr; gap: 0; margin-top: auto; padding-top: 20px; }
.resume-roles article { min-width: 0; min-height: 74px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: center; column-gap: 28px; padding: 14px 0; border-top: 1px solid rgba(32, 32, 30, .12); border-radius: 0; background: transparent; }
.resume-roles p { margin: 0; max-width: 220px; font-size: clamp(15px, 1.2vw, 19px); line-height: 1.15; }
.resume-roles div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; color: #555; font-size: 11px; }

footer { position: relative; min-height: 180px; display: flex; align-items: end; justify-content: space-between; padding: 34px var(--pad); background: var(--paper); color: var(--ink); border-top: 1px solid var(--line); font-size: 12px; overflow: hidden; }
.transition-dark footer { background: #111; color: #f1f1ef; border-top-color: #111; }
footer > span, footer > a { position: relative; z-index: 2; }
.footer-contact { display: inline-flex; align-items: center; gap: 8px; }
.inline-arrow { display: inline-block; width: 7px; height: 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; }

.page-transition { position: fixed; z-index: 100; inset: 0; background: #171717; color: white; display: grid; place-items: center; transform: translateY(-100%); pointer-events: none; }
.page-transition span { font: italic clamp(50px, 8vw, 120px) Georgia, serif; opacity: 0; }
.page-transition.is-entering { animation: curtain-in .8s cubic-bezier(.76,0,.24,1) forwards; }
.page-transition.is-entering span { animation: fade-in .3s .25s forwards; }
.page-transition.is-mosaic-active { display: block; transform: none; background: transparent; pointer-events: auto; animation: none; }
.page-transition.is-mosaic-active span { display: none; }
.page-transition-mosaic { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.page-transition.is-mosaic-active ~ .cursor-orbit { opacity: 0 !important; transform: scale(.2) !important; }
.cursor-orbit { position: fixed; z-index: 90; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%; background: #f1f1ef; color: #111; display: grid; place-items: center; pointer-events: none; opacity: 0; transform: scale(.2); transition: opacity .2s, transform .4s cubic-bezier(.16,1,.3,1); mix-blend-mode: difference; }
.cursor-orbit.is-visible { opacity: 1; transform: scale(1); }
.cursor-orbit span { font: 10px "Courier New", monospace; text-transform: uppercase; }

.case-page { background: #121212; color: white; }
.case-page .site-header--case { color: #fff; }
.case-page .site-header--case .wordmark { color: #fff; }
.case-page .site-header--case .wordmark span { background: #fff; color: #111; }
.case-page .site-header--case .nav-pill--case { width: 30px; padding: 0; border: 1px solid #fff; background: #121212; color: #fff; font-size: 18px; }
.case-page .site-header--case .nav-pill--case:hover,
.case-page .site-header--case .nav-pill--case:focus-visible { background: #fff; color: #111; border-color: #fff; }
.case-page .site-header--case.case-header-on-light .wordmark { color: #111; }
.case-page .site-header--case.case-header-on-light .wordmark span { background: #111; color: #fff; }
.case-page .site-header--case.case-header-on-light .nav-pill--case { border-color: #111; background: #111; color: #fff; }
.case-page .site-header--case.case-header-on-light .nav-pill--case:hover,
.case-page .site-header--case.case-header-on-light .nav-pill--case:focus-visible { background: #fff; color: #111; }
.case-hero { min-height: 100svh; padding: 130px var(--pad) var(--pad); display: grid; grid-template-columns: .4fr 1.3fr 1.7fr; gap: 32px; align-items: end; }
.case-index, .case-type { font: 400 11px/1.4 "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; text-transform: uppercase; }
.case-intro h1 { margin: 16px 0 24px; font-family: "SF Pro Display", Arial, Helvetica, sans-serif; font-size: clamp(76px, 11vw, 180px); line-height: .92; letter-spacing: -.04em; font-weight: 400; }
.case-thesis { max-width: 430px; font: italic 400 clamp(22px, 2.2vw, 34px)/1.3 "PP Editorial Old", Georgia, serif; }
.case-cover { margin: 0; border-radius: var(--radius); overflow: hidden; }
.case-cover img { height: 66vh; object-fit: cover; }
.case-cover--video { width: 100%; aspect-ratio: 16 / 9; }
.case-cover--video .video-poster img { height: 100%; }
.case-page--loading .case-index,
.case-page--loading .case-intro { opacity: 0; transform: translate3d(0, 34px, 0); }
.case-page--loading .case-cover { clip-path: inset(0 100% 0 0 round var(--radius)); transform: translate3d(5vw, 0, 0) scale(1.025); }
.case-page--ready .case-index,
.case-page--ready .case-intro { opacity: 1; transform: none; transition: opacity .64s ease, transform .9s cubic-bezier(.16,1,.3,1); }
.case-page--ready .case-intro { transition-delay: .1s; }
.case-page--ready .case-cover { clip-path: inset(0 0 0 0 round var(--radius)); transform: none; transition: clip-path 1.08s cubic-bezier(.76,0,.24,1), transform 1.12s cubic-bezier(.16,1,.3,1); }
.case-placeholder { background: var(--paper); color: var(--ink); padding: clamp(110px, 14vw, 220px) var(--pad); }
.case-placeholder__content > p { font: 11px "Courier New", monospace; text-transform: uppercase; }
.case-placeholder__content > h2 { max-width: 1050px; margin: 24px 0 100px; font: 500 clamp(54px, 8vw, 120px)/.92 Arial, sans-serif; letter-spacing: -.065em; }
.placeholder-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--line); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.placeholder-grid article { padding: 32px; background: var(--paper); min-height: 270px; }
.placeholder-grid span { font: 11px "Courier New", monospace; }
.placeholder-grid h3 { margin-top: 80px; font-size: 28px; }
.placeholder-grid p { max-width: 310px; line-height: 1.5; }

/* Subpage Design System
   Content hierarchy: Chapter / Subheading / Content.
   Functional labels and captions are the only type-size exceptions. */
.subpage-system {
  --sp-font-display: "SF Pro Display", Arial, Helvetica, sans-serif;
  --sp-font-text: "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
  --sp-font-mono: var(--sp-font-display);
  --sp-text-primary: #262626;
  --sp-text-secondary: #5f5f5a;
  --sp-text-tertiary: #85857f;
  --sp-text-inverse: #f8f8f6;
  --sp-page: #f8f8f6;
  --sp-card: #f1f1ef;
  --sp-card-soft: #f3f3f1;
  --sp-radius: 24px;
  --sp-content-width: 1040px;
  --sp-copy-width: 680px;
  --sp-space-1: 8px;
  --sp-space-2: 12px;
  --sp-space-3: 16px;
  --sp-space-4: 24px;
  --sp-space-5: 32px;
  --sp-space-6: 48px;
  --sp-space-7: 64px;
  --sp-space-8: 80px;
  --sp-space-9: 120px;
  --sp-space-10: 160px;
  position: relative;
  background: var(--sp-page);
  color: var(--sp-text-primary);
  font-family: var(--sp-font-text);
}
.subpage-system[hidden] { display: none; }
.sp-content { width: min(var(--sp-content-width), calc(100% - clamp(40px, 16vw, 256px))); margin: 0 auto; }
.sp-chapter { padding: 320px 0 0; scroll-margin-top: 100px; }
.sp-chapter:last-child { padding-bottom: var(--sp-space-10); }
.sp-chapter-title { display: flex; gap: var(--sp-space-4); align-items: baseline; max-width: 900px; margin: 0; color: var(--sp-text-primary); font-family: var(--sp-font-display); font-size: 56px; font-weight: 400; line-height: 1.02; letter-spacing: -.04em; }
.sp-chapter-title span { flex: 0 0 auto; color: var(--sp-text-tertiary); font-variant-numeric: tabular-nums; }
.sp-subheading { margin: 0; color: var(--sp-text-primary); font-family: var(--sp-font-display); font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: 0; }
.sp-content-copy { max-width: var(--sp-copy-width); margin: 0; color: var(--sp-text-secondary); font-family: var(--sp-font-text); font-size: 17px; font-weight: 400; line-height: 1.55; letter-spacing: 0; }
.sp-section-subheading { margin-top: var(--sp-space-8); }
.sp-lead { margin-top: var(--sp-space-3); }
.sp-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-space-6); margin-top: var(--sp-space-7); padding: var(--sp-space-6); border-radius: var(--sp-radius); background: var(--sp-card); }
.sp-meta div { min-width: 0; }
#aova-overview .sp-meta { grid-template-columns: max-content repeat(3, minmax(0, 1fr)); gap: 24px; padding: 0; border-radius: 0; background: transparent; }
@media (max-width: 900px) {
  #aova-overview .sp-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.sp-meta span, .sp-card > span, .sp-comparison-card article > span { color: var(--sp-text-tertiary); font: 600 12px/16px var(--sp-font-mono); letter-spacing: .04em; text-transform: uppercase; }
.sp-meta span { color: var(--sp-text-primary); font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: 0; text-transform: none; }
.sp-meta p { margin: var(--sp-space-3) 0 0; color: var(--sp-text-secondary); font-family: var(--sp-font-text); font-size: 17px; font-weight: 400; line-height: 1.55; }
.sp-card { width: 100%; margin: var(--sp-space-7) 0 0; border: 0; border-radius: var(--sp-radius); background: var(--sp-card); overflow: hidden; }
.sp-chapter-title + .sp-card { margin-top: var(--sp-space-8); }
.sp-narrative-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-space-6); padding: var(--sp-space-6); }
.sp-narrative-card--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sp-narrative-card > div { display: grid; align-content: start; gap: var(--sp-space-3); }
.sp-comparison-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-space-4); padding: 0; background: transparent; }
.sp-comparison-card article { display: grid; align-content: space-between; min-height: 220px; padding: var(--sp-space-5); border-radius: var(--sp-radius); background: var(--sp-card); }
.sp-comparison-card article:last-child { position: relative; isolation: isolate; background: var(--sp-text-primary) url("./assets/resume-dot-texture.png") center / cover; }
.sp-comparison-card article:last-child::after { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; background: rgba(38,38,38,.18); pointer-events: none; }
.sp-comparison-card article:last-child .sp-subheading { color: var(--sp-text-inverse); }
.sp-comparison-card article:last-child > span { color: rgba(248,248,246,.62); }
.sp-evidence-card { background: var(--sp-card-soft); }
.sp-evidence-card img { width: 100%; height: auto; object-fit: cover; }
.sp-evidence-card figcaption { padding: var(--sp-space-3) var(--sp-space-4) var(--sp-space-4); color: var(--sp-text-tertiary); font-family: var(--sp-font-text); font-size: 14px; line-height: 20px; }
.sp-evidence-card--hero img { max-height: 720px; object-fit: cover; }
.sp-evidence-card--split { display: grid; grid-template-columns: .75fr 1.25fr; align-items: stretch; }
.sp-evidence-card--split .sp-evidence-copy { display: grid; align-content: center; gap: var(--sp-space-3); padding: var(--sp-space-6); }
.sp-evidence-card--split img { height: 100%; min-height: 480px; }
.sp-evidence-card--split figcaption { grid-column: 1 / -1; }
.sp-conclusion-card { position: relative; isolation: isolate; padding: var(--sp-space-6); background: var(--sp-text-primary) url("./assets/resume-dot-texture.png") center / cover; }
.sp-conclusion-card::after { content: ""; position: absolute; z-index: -1; inset: 0; background: rgba(38,38,38,.18); pointer-events: none; }
.sp-conclusion-card > span { color: rgba(248,248,246,.62); }
.sp-conclusion-card .sp-subheading { max-width: 720px; margin-top: var(--sp-space-5); color: var(--sp-text-inverse); }
.sp-chapter > .back-link { display: inline-flex; margin-top: var(--sp-space-8); color: var(--sp-text-primary); font: 600 13px/1 var(--sp-font-mono); letter-spacing: .04em; text-transform: uppercase; }
.sp-toc { position: fixed; z-index: 10; top: 50%; left: clamp(18px, 3.2vw, 48px); display: grid; gap: 4px; width: 190px; opacity: 0; pointer-events: none; transform: translateY(calc(-50% + 8px)); transition: opacity .25s ease, transform .25s ease; }
.sp-toc.is-visible { opacity: 1; pointer-events: auto; transform: translateY(-50%); }
.sp-toc a { display: grid; grid-template-columns: 24px 1fr; gap: var(--sp-space-1); align-items: center; min-height: 34px; padding: var(--sp-space-1) var(--sp-space-2); border-radius: 8px; background: rgba(248,248,246,.92); color: var(--sp-text-primary); font: 600 12px/1.1 "Courier New", monospace; letter-spacing: .03em; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
.sp-toc a:hover, .sp-toc a:focus-visible { background: #e8e8e5; }
.sp-toc a.is-active { background: var(--sp-text-primary); color: var(--sp-text-inverse); }
.sp-toc a span { color: var(--sp-text-tertiary); }
.sp-toc a.is-active span { color: rgba(248,248,246,.62); }

@media (max-width: 1199px) {
  .sp-content { width: min(880px, calc(100% - 80px)); }
  .sp-chapter { padding-top: 240px; }
  .sp-narrative-card--three { grid-template-columns: 1fr 1fr; }
  .sp-toc { display: none; }
}

@media (max-width: 767px) {
  .subpage-system { --sp-radius: 18px; }
  .sp-content { width: calc(100% - 40px); }
  .sp-chapter { padding-top: 160px; }
  .sp-chapter:last-child { padding-bottom: 112px; }
  .sp-chapter-title { font-size: 40px; line-height: 1.05; }
  .sp-subheading { font-size: 21px; line-height: 26px; }
  .sp-content-copy, .sp-meta p { font-size: 16px; line-height: 25px; }
  .sp-meta span { font-size: 21px; line-height: 26px; }
  .sp-section-subheading { margin-top: var(--sp-space-6); }
  .sp-lead { margin-top: var(--sp-space-3); }
  .sp-meta, .sp-narrative-card, .sp-narrative-card--three, .sp-comparison-card, .sp-evidence-card--split { grid-template-columns: 1fr; }
  .sp-meta { gap: var(--sp-space-4); margin-top: var(--sp-space-6); padding: var(--sp-space-4); }
  .sp-card { margin-top: var(--sp-space-6); }
  .sp-chapter-title + .sp-card { margin-top: var(--sp-space-6); }
  .sp-narrative-card, .sp-conclusion-card { gap: var(--sp-space-6); padding: var(--sp-space-4); }
  .sp-comparison-card { gap: var(--sp-space-3); padding: var(--sp-space-3); }
  .sp-comparison-card article { min-height: 180px; padding: var(--sp-space-4); }
  .sp-evidence-card--split .sp-evidence-copy { padding: var(--sp-space-4); }
  .sp-evidence-card--split img { min-height: 320px; }
  .sp-evidence-card--split figcaption { grid-column: auto; }
  .sp-conclusion-card .sp-subheading { margin-top: var(--sp-space-4); }
}
.back-link { display: inline-block; margin-top: 90px; border-bottom: 1px solid; padding-bottom: 5px; }
.back-link::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-left: 1px solid currentColor; border-bottom: 1px solid currentColor; vertical-align: 1px; }

/* LiberCube long-form case study — appended below the existing case hero. */
.libercube-study[hidden], .case-placeholder[hidden] { display: none !important; }
.libercube-study { position: relative; z-index: 2; background: #f8f8f6; color: #181818; font-family: Inter, Arial, Helvetica, sans-serif; }
.lc-toc { position: fixed; z-index: 24; left: clamp(22px, 3.2vw, 56px); top: 50%; width: 194px; display: grid; gap: 6px; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(calc(-50% + 8px)); transition: opacity .3s ease, visibility 0s .3s, transform .45s cubic-bezier(.16,1,.3,1); }
.lc-toc.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(-50%); transition-delay: 0s; }
.lc-toc a { position: relative; min-height: 30px; padding: 6px 8px; border: 0; border-radius: 6px; display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 5px; align-items: center; background: #fff; color: #262626; white-space: nowrap; font: 600 12px/1.08 "Courier New", monospace; letter-spacing: .035em; text-transform: uppercase; transition: color .3s ease, background-color .3s ease, transform .35s cubic-bezier(.16,1,.3,1); }
.lc-toc a:hover { background: #ecece9; color: #262626; transform: translateX(3px); }
.lc-toc a:active { transform: translateX(3px) scale(.97); }
.lc-toc a:focus-visible { outline: 2px solid #262626; outline-offset: 3px; }
.lc-toc a.is-active { background: #262626; color: #fafafa; }
.lc-toc a span { color: #aaa9a4; transition: color .3s ease; }
.lc-toc a:hover span { color: #777772; }
.lc-toc a.is-active span { color: #d6d6d1; }
.lc-content { width: min(100%, 1440px); margin-inline: auto; padding: 160px clamp(24px, 16.67vw, 240px) 220px; }
.lc-section { width: min(100%, 960px); margin-inline: auto; padding-bottom: 250px; scroll-margin-top: 110px; }
.lc-section--continuation { padding-top: 0; padding-bottom: 170px; }
.lc-section:last-child { padding-bottom: 0; }
.lc-eyebrow { margin: 0 0 70px; color: #111; font: 700 12px/1.2 "Courier New", monospace; letter-spacing: .02em; text-transform: uppercase; }
.lc-eyebrow span { color: #8a8a84; }
.lc-section h2 { max-width: 820px; margin: 0 0 32px; font-size: clamp(46px, 5.5vw, 72px); line-height: .98; letter-spacing: -.055em; font-weight: 600; }
.lc-overview h2 { font-size: clamp(68px, 8vw, 112px); }
.lc-lead { max-width: 760px; margin: 0; color: #6b6b6b; font-size: clamp(21px, 2vw, 28px); line-height: 1.45; letter-spacing: -.025em; }
.lc-meta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin: 72px 0 80px; }
.lc-meta div { border-top: 1px solid #d4d4cf; padding-top: 14px; }
.lc-meta dt { color: #94948c; font-size: 13px; }
.lc-meta dd { margin: 8px 0 0; font-size: 15px; line-height: 1.4; }
.lc-overview-impact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: -26px 0 80px; }
.lc-overview-impact article { min-height: 178px; padding: 22px; border-radius: 16px; background: #ecece9; }
.lc-overview-impact span { display: block; color: #85857f; font: 700 10px/1.2 "Courier New", monospace; text-transform: uppercase; }
.lc-overview-impact strong { display: block; margin-top: 42px; font-size: 16px; line-height: 1.35; letter-spacing: -.015em; }
.lc-hero-image { position: relative; width: 100%; margin: 0; border-radius: 26px; overflow: hidden; background: #e7e7e2; }
.lc-hero-image img { aspect-ratio: 16 / 9; object-fit: cover; }
.lc-hero-image__link { position: absolute; z-index: 2; top: 22px; right: 22px; width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.58); border-radius: 50%; display: grid; place-items: center; color: #fff; background: rgba(17,17,17,.48); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transition: transform .35s cubic-bezier(.16,1,.3,1), background-color .25s ease; }
.lc-hero-image__link svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.lc-hero-image__link:hover { transform: scale(1.08); background: rgba(17,17,17,.78); }
.lc-hero-image__link:focus-visible { outline: 2px solid #181818; outline-offset: 3px; }
.lc-question { margin: 72px 0 92px; padding: 34px 32px 38px; border-radius: 18px; background: #e5e5e3; }
.lc-question span { display: block; margin-bottom: 16px; color: #6d6d68; font-size: 14px; }
.lc-question strong { display: block; max-width: 780px; font-size: clamp(25px, 3vw, 40px); line-height: 1.14; letter-spacing: -.035em; }
.lc-question strong em { font: inherit; font-style: normal; color: #777772; }
.lc-copy-block { max-width: 760px; margin: 0 0 72px; }
.lc-copy-block h3 { margin: 0 0 14px; font-size: 24px; line-height: 1.2; letter-spacing: -.02em; }
.lc-copy-block p, .lc-insight-grid p, .lc-principles p, .lc-note p, .lc-character-notes p, .lc-contribution-grid p { margin: 0; color: #6b6b6b; font-size: 17px; line-height: 1.55; }
.lc-copy-block--reframing { max-width: 760px; margin: 52px 0 72px; }
.lc-copy-block__question { margin: 0; padding: 0; }
.lc-copy-block__question span { display: block; margin-bottom: 12px; color: #8a8a84; font-size: 13px; }
.lc-copy-block__question strong { display: block; color: #181818; font-size: 24px; line-height: 1.25; letter-spacing: -.025em; }
.lc-insight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.lc-insight-grid article { min-height: 260px; padding: 28px; border-radius: 18px; background: var(--case-image-surface); }
.lc-insight-grid h3 { margin: 0 0 80px; font-size: 17px; }
.lc-from-to { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 72px; }
.lc-from-to div { min-height: 205px; padding: 26px 30px; border-radius: 18px; background: #e5e5e3; }
.lc-from-to div:last-child { background: #dfffbc; }
.lc-from-to span { display: block; color: #77776f; font-size: 13px; }
.lc-from-to strong { display: block; max-width: 370px; margin-top: 42px; font-size: 27px; line-height: 1.1; letter-spacing: -.03em; }
.lc-principles { border-top: 1px solid #d4d4cf; }
.lc-principles article { display: grid; grid-template-columns: 292px 1fr; gap: 40px; padding: 24px 0; border-bottom: 1px solid #d4d4cf; }
.lc-principles h3 { margin: 0; font-size: 20px; }
.lc-subchapter { margin: 0 0 64px; padding-top: 24px; border-top: 1px solid #d4d4cf; font-size: clamp(30px, 4vw, 48px); line-height: 1.05; letter-spacing: -.045em; }
.lc-subchapter span { display: block; margin-bottom: 18px; color: #77776f; font: 700 11px/1.2 "Courier New", monospace; letter-spacing: .02em; text-transform: uppercase; }
.lc-decision > .lc-eyebrow { margin-bottom: 130px; font-size: 11px; }
.lc-phone-feature { position: relative; width: 100%; min-height: 0; aspect-ratio: 960 / 685; margin: 40px 0 64px; overflow: hidden; border-radius: 28px; background: var(--case-image-surface); }
.lc-phone-feature .lc-phone-feature__phone { position: absolute; z-index: 2; top: 8.321%; left: 34.688%; width: 30.625%; height: 83.358%; max-height: none; margin: 0; object-fit: contain; filter: drop-shadow(0 14px 18px rgba(46,46,43,.18)); }
.lc-phone-feature .lc-phone-feature__connector, .lc-phone-feature .lc-phone-feature__dot { position: absolute; z-index: 3; max-height: none; margin: 0; object-fit: fill; filter: none; pointer-events: none; }
.lc-phone-feature .lc-phone-feature__connector { transform: scaleY(-1); }
.lc-phone-feature .lc-phone-feature__connector--greeting { top: 22.044%; left: calc(24.92% + 2px); width: calc(37.917% - 24.92% - 2px); height: 4.526%; }
.lc-phone-feature .lc-phone-feature__connector--task { top: 34.4%; left: 61.15%; width: calc(71.04% - 61.15% - 7px); height: 7.7%; }
.lc-phone-feature .lc-phone-feature__connector--methods { top: 45.5%; left: calc(24.92% + 7px); width: calc(38.855% - 24.92% - 7px); height: 11.75%; }
.lc-phone-feature .lc-phone-feature__dot { width: .521%; height: auto; aspect-ratio: 1; }
.lc-phone-feature .lc-phone-feature__dot--greeting { top: 21.679%; left: 37.656%; }
.lc-phone-feature .lc-phone-feature__dot--task { top: 34.035%; left: 60.89%; }
.lc-phone-feature .lc-phone-feature__dot--methods { top: 45.135%; left: 38.594%; }
.lc-phone-feature .lc-note { position: absolute; z-index: 3; width: 22%; }
.lc-phone-feature .lc-note--greeting { top: 25.255%; left: 2.92%; }
.lc-phone-feature .lc-note--task { top: 40.73%; left: 71.04%; width: 25.52%; }
.lc-phone-feature .lc-note--methods { top: 56.204%; left: 2.92%; }
.lc-note h4 { margin: 0 0 6px; color: #2e2e2b; font-family: var(--case-font-sans); font-size: 12px; font-weight: 700; line-height: 18px; letter-spacing: 0; }
.lc-note p { color: #6e6e69; font-family: var(--case-font-sans); font-size: 12px; font-weight: 400; line-height: 18px; letter-spacing: 0; }

/* Decision 01: reveal the visual explanation in reading order. */
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-phone-feature__phone {
  opacity: 0;
  transform: translateY(20px) scale(.965);
}
.js .lc-phone-feature--reading-reveal .lc-phone-feature__phone {
  transform-origin: 50% 55%;
  transition: opacity .48s ease, transform .62s cubic-bezier(.22, 1, .36, 1);
  will-change: opacity, transform;
}
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-phone-feature__connector,
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-phone-feature__dot { opacity: 0; }
.js .lc-phone-feature--reading-reveal .lc-phone-feature__connector {
  transition: opacity .4s cubic-bezier(.4, 0, .2, 1);
  will-change: opacity;
}
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-note h4,
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-note p {
  opacity: 0;
}
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-note h4,
.js .lc-phone-feature--reading-reveal:not(.is-reading-visible) .lc-note p {
  transform: translateY(7px);
}
.js .lc-phone-feature--reading-reveal .lc-phone-feature__dot {
  transition: opacity .4s cubic-bezier(.4, 0, .2, 1);
}
.js .lc-phone-feature--reading-reveal .lc-note h4,
.js .lc-phone-feature--reading-reveal .lc-note p {
  transition: opacity .34s ease, transform .44s cubic-bezier(.22, 1, .36, 1);
}
.js .lc-phone-feature--reading-reveal .lc-phone-feature__connector--greeting { transition-delay: .42s; }
.js .lc-phone-feature--reading-reveal .lc-phone-feature__dot--greeting { transition-delay: .42s; }
.js .lc-phone-feature--reading-reveal .lc-note--greeting h4 { transition-delay: .58s; }
.js .lc-phone-feature--reading-reveal .lc-note--greeting p { transition-delay: .74s; }
.js .lc-phone-feature--reading-reveal .lc-phone-feature__connector--task { transition-delay: .86s; }
.js .lc-phone-feature--reading-reveal .lc-phone-feature__dot--task { transition-delay: .86s; }
.js .lc-phone-feature--reading-reveal .lc-note--task h4 { transition-delay: 1.02s; }
.js .lc-phone-feature--reading-reveal .lc-note--task p { transition-delay: 1.18s; }
.js .lc-phone-feature--reading-reveal .lc-phone-feature__connector--methods { transition-delay: 1.3s; }
.js .lc-phone-feature--reading-reveal .lc-phone-feature__dot--methods { transition-delay: 1.3s; }
.js .lc-phone-feature--reading-reveal .lc-note--methods h4 { transition-delay: 1.46s; }
.js .lc-phone-feature--reading-reveal .lc-note--methods p { transition-delay: 1.62s; }
.lc-evolution-feature { --lc-ui-width: 30.625%; --lc-ui-height: 41.832%; position: relative; width: 100%; aspect-ratio: 960 / 1365; margin: 36px 0 64px; overflow: hidden; border-radius: 28px; background: var(--case-image-surface); }
.lc-evolution-feature__phone-wrap { display: contents; }
.lc-evolution-feature__phone { position: absolute; z-index: 1; width: var(--lc-ui-width); height: var(--lc-ui-height); object-fit: contain; filter: drop-shadow(0 14px 18px rgba(46,46,43,.18)); }
.lc-evolution-feature__phone--problem { top: 2.271%; left: 33.646%; }
.lc-evolution-feature__phone--home { top: 50.11%; left: 19.375%; }
.lc-evolution-feature__phone--subpage { top: 50.11%; left: 47.917%; }
.lc-evolution-feature__highlight { position: absolute; z-index: 3; border: 3px solid #ffe100; pointer-events: none; }
.lc-evolution-feature__highlight--problem { top: 17.363%; left: 36.771%; width: 24.375%; height: 6.227%; }
.lc-evolution-feature__highlight--home { top: 69.084%; left: 22.5%; width: 10.833%; height: 7.546%; }
.lc-evolution-feature__highlight--subpage { top: 58.535%; left: 50.729%; width: 24.896%; height: 27.106%; }
.lc-evolution-feature__arrow { position: absolute; z-index: 2; top: 46.374%; left: 48.958%; width: 20px; height: 20px; transform: rotate(90deg); }
.lc-evolution-feature__formula-link { position: absolute; z-index: 4; top: 72.894%; left: 33.333%; width: 17.5%; height: 3px; }
.lc-evolution-feature__connector, .lc-evolution-feature__dot { position: absolute; z-index: 4; pointer-events: none; }
.lc-evolution-feature__connector--problem { top: 16.63%; left: calc(3.333% + 164px); width: calc(32.084% - 161.5px); height: 3.128%; }
.lc-evolution-feature__connector--home { top: 66.593%; left: calc(2.083% + 119px); width: calc(18.646% - 116.5px); height: 6.3%; }
.lc-evolution-feature__connector--subpage { top: 66.593%; left: calc(76.875% + 2.5px); width: calc(80.729% - 76.875% - 9.5px); height: 5.582%; }
.lc-evolution-feature__dot { width: 5px; height: 5px; }
.lc-evolution-feature__dot--problem { top: 19.538%; left: 35.417%; }
.lc-evolution-feature__dot--home { top: 72.652%; left: 20.729%; }
.lc-evolution-feature__dot--subpage { top: 71.919%; left: 76.875%; }
.lc-evolution-feature__note { position: absolute; z-index: 5; }
.lc-evolution-feature__note--problem { top: 15.971%; left: 3.333%; width: 25%; }
.lc-evolution-feature__note--home { top: 65.934%; left: 2.083%; width: 15.104%; }
.lc-evolution-feature__note--subpage { top: 65.934%; left: 80.729%; width: 17.188%; }
.lc-evolution-feature__note--problem h4 { width: 157px; }
.lc-evolution-feature__note--home h4 { width: 112px; }
.lc-evolution-feature__note--subpage h4 { width: 131px; }
.lc-evolution-feature .lc-note h4 { margin: 0 0 6px; color: #2e2e2b; font-size: 12px; line-height: 18px; }
.lc-evolution-feature .lc-note p { margin: 0; color: #6e6e69; font-size: 12px; line-height: 18px; }
.lc-action-evidence { --lc-ui-width: 30.625%; --lc-ui-height: 45.498%; position: relative; width: 100%; aspect-ratio: 960 / 1255; margin: 52px 0 64px; overflow: visible; background: transparent; }
.lc-action-evidence::before { content: ""; position: absolute; z-index: 0; inset: calc(2.47% - 40px) 0 -40px; border-radius: 28px; background: var(--case-image-surface); pointer-events: none; }
.lc-action-evidence__phone { position: absolute; z-index: 1; left: 33.542%; width: var(--lc-ui-width); height: var(--lc-ui-height); object-fit: contain; filter: drop-shadow(0 14px 18px rgba(46,46,43,.18)); }
.lc-action-evidence__phone--before { top: 2.47%; }
.lc-action-evidence__phone--after { top: 54.502%; }
.lc-action-evidence__arrow { position: absolute; z-index: 2; top: 50.438%; left: 48.958%; width: 20px; height: 20px; transform: rotate(90deg); }
.lc-action-evidence__connector, .lc-action-evidence__dot { position: absolute; z-index: 4; pointer-events: none; }
.lc-action-evidence__connector--small { top: 15.06%; left: calc(3.333% + 179px); width: calc(33.438% - 179px); height: 3.307%; }
.lc-action-evidence__connector--expanded { top: 62.47%; left: calc(3.333% + 197px); width: calc(33.438% - 197px); height: 2.59%; }
.lc-action-evidence__connector--contrast { top: 76.016%; left: 59.802%; width: calc(11.865% - 7px); height: 1.641%; }
.lc-action-evidence__dot { width: 5px; height: 5px; }
.lc-action-evidence__dot--small { top: calc(18.367% - 2.5px); left: calc(36.771% - 2.5px); }
.lc-action-evidence__dot--expanded { top: calc(65.06% - 2.5px); left: calc(36.771% - 2.5px); }
.lc-action-evidence__dot--contrast { top: calc(77.657% - 2.5px); left: calc(59.802% - 2.5px); }
.lc-action-evidence__note { position: absolute; z-index: 5; }
.lc-action-evidence__note--small { top: 14.343%; left: 3.333%; width: 25%; }
.lc-action-evidence__note--expanded { top: 61.753%; left: 3.333%; width: 26.042%; }
.lc-action-evidence__note--contrast { top: 75.299%; left: 71.667%; width: 25%; }
.lc-action-evidence__note--small h4 { width: 172px; }
.lc-action-evidence__note--expanded h4 { width: 190px; }
.lc-action-evidence__note--contrast h4 { width: 181px; }
.lc-action-evidence .lc-note h4 { margin: 0 0 6px; color: #2e2e2b; font-size: 12px; line-height: 18px; }
.lc-action-evidence .lc-note p { margin: 0; color: #6e6e69; font-size: 12px; line-height: 18px; }
.lc-iteration-row { margin: 36px 0 64px; padding: 54px 28px 32px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: end; border-radius: 28px; background: var(--case-image-surface); }
.lc-iteration-row--two { grid-template-columns: repeat(2, 1fr); }
.lc-iteration-row figure, .lc-triptych figure { margin: 0; }
.lc-iteration-row img { width: auto; max-width: 100%; height: 500px; margin-inline: auto; object-fit: contain; filter: drop-shadow(0 16px 22px rgba(0,0,0,.1)); }
.lc-iteration-row figcaption, .lc-triptych figcaption, .lc-stage-visual figcaption { display: grid; gap: 9px; margin-top: 28px; }
.lc-iteration-row figcaption strong, .lc-triptych figcaption strong { font-size: 15px; line-height: 1.25; }
.lc-iteration-row figcaption span, .lc-triptych figcaption span, .lc-stage-visual figcaption span { color: #6b6b6b; font-size: 13px; line-height: 1.45; }
.lc-result { margin: 0; padding: 34px 34px 38px; border-radius: 20px; background: #20251e; color: white; font-size: clamp(22px, 2.3vw, 31px); line-height: 1.25; letter-spacing: -.025em; }
.lc-result span { display: block; margin-bottom: 20px; color: #b9bdb4; font: 12px "Courier New", monospace; text-transform: uppercase; }
.lc-loop-diagram {
  position: relative;
  width: 100%;
  aspect-ratio: 960 / 653;
  margin: 36px 0 64px;
  overflow: hidden;
  border: 0;
  border-radius: 28px;
  background: var(--case-image-surface);
}
.lc-loop-diagram__steps {
  position: absolute;
  top: 10.33%;
  left: 31.77%;
  width: 36.46%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.04%;
  color: #6b6b6b;
  font-family: var(--case-font-sans, Arial, Helvetica, sans-serif);
  font-size: clamp(10px, 1.77vw, 17px);
  line-height: 1.55;
  text-align: center;
}
.lc-loop-diagram__timeline {
  position: absolute;
  top: 20.06%;
  left: 37.76%;
  width: 24.48%;
  height: 8px;
}
.lc-loop-diagram__timeline > img { position: absolute; inset: 3px 0 auto; width: 100%; height: 1px; }
.lc-loop-diagram__timeline i {
  position: absolute;
  top: 0;
  width: 7px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #94948c;
}
.lc-loop-diagram__timeline i:nth-of-type(1) { left: calc(0% - 3.5px); }
.lc-loop-diagram__timeline i:nth-of-type(2) { left: calc(50% - 3.5px); }
.lc-loop-diagram__timeline i:nth-of-type(3) { right: -3.5px; }
.lc-loop-diagram__down { position: absolute; top: 30.62%; left: calc(50% - 12px); width: 24px; height: 24px; transform: rotate(90deg); }
.lc-loop-diagram__core {
  position: absolute;
  top: 44.63%;
  left: 33.13%;
  width: 33.65%;
  height: auto;
  object-fit: contain;
}
.lc-loop-showcase { display: grid; gap: 30px; margin: 38px 0 64px; }
.lc-loop-showcase article {
  display: grid;
  grid-template-columns: minmax(210px, 255px) minmax(0, 1fr);
  gap: 30px;
  align-items: center;
  min-height: 560px;
  padding: 38px 36px 34px;
  border: 2px solid transparent;
  border-radius: 28px;
  background:
    linear-gradient(var(--case-image-surface), var(--case-image-surface)) padding-box,
    linear-gradient(90deg, var(--loop-accent) 0%, color-mix(in srgb, var(--loop-accent) 20%, transparent) 100%) border-box;
}
.lc-loop-showcase__card--immediate { --loop-accent: #80a539; }
.lc-loop-showcase__card--achievement { --loop-accent: #0f8b9e; }
.lc-loop-showcase__card--growth { --loop-accent: #5b1384; }
.lc-loop-showcase__copy { align-self: center; }
.lc-phone-pair { display: flex; justify-content: center; align-items: center; gap: 8px; min-width: 0; min-height: 480px; }
.lc-phone-pair img { width: auto; height: 480px; object-fit: contain; filter: drop-shadow(0 16px 22px rgba(0,0,0,.1)); }
.lc-loop-showcase h3 { max-width: 250px; margin: 0 0 12px; color: var(--loop-accent); font-size: 24px; }
.lc-loop-showcase h3 span { color: inherit; font-weight: inherit; }
.lc-loop-showcase p { max-width: 620px; margin: 0; color: #6b6b6b; font-size: 16px; line-height: 1.5; }
.lc-character-system { margin: 20px 0 64px; padding: 46px 38px 38px; border-radius: 28px; background: var(--case-image-surface); color: var(--case-text-strong); }
.lc-character-strip { display: grid; grid-template-columns: repeat(6, 1fr); align-items: end; gap: 12px; }
.lc-character-strip img { height: 120px; object-fit: contain; }
.lc-character-notes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 44px; padding-top: 28px; border-top: 1px solid rgba(20,20,18,.14); }
.lc-character-notes h3 { margin: 0 0 10px; font-size: 17px; }
.lc-character-notes p { color: #b9bdb4; font-size: 14px; }
.lc-triptych { margin: 38px 0 64px; padding: 46px 28px 32px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; align-items: end; border-radius: 28px; background: var(--case-image-surface); }
.lc-triptych img { width: auto; max-width: 100%; height: 480px; margin-inline: auto; object-fit: contain; filter: drop-shadow(0 16px 22px rgba(0,0,0,.1)); }
.lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-items: start; padding: 42px 24px 36px; overflow: hidden; }
.lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figure { min-width: 0; }
.lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) img { width: 100%; max-width: none; height: auto; margin: 0; object-fit: contain; filter: none; }
.lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption { width: 200px; margin: 24px auto 0; gap: 6px; }
.lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption strong { margin: 0; color: #2e2e2b; font-family: var(--case-font-sans); font-size: 12px; font-weight: 700; line-height: 18px; letter-spacing: 0; }
.lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption span { margin: 0; color: #6e6e69; font-family: var(--case-font-sans); font-size: 12px; font-weight: 400; line-height: 18px; letter-spacing: 0; }
.lc-final > h2, .lc-contribution > h2 { margin-bottom: 74px; font-size: clamp(42px, 5vw, 64px); }
.lc-colour-system { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 52px 0 24px; }
.lc-colour-system article { min-height: 220px; padding: 24px; border-radius: 18px; background: var(--case-image-surface); }
.lc-colour-system i { display: block; width: 100%; height: 42px; margin-bottom: 28px; border-radius: 9px; background: var(--swatch); }
.lc-colour-system h3 { display: flex; justify-content: space-between; gap: 20px; margin: 0 0 12px; font-size: 18px; }
.lc-colour-system h3 span { color: #77776f; }
.lc-colour-system p, .lc-research { margin: 0; color: #6b6b6b; font-size: 13px; line-height: 1.5; }
.lc-research { margin-bottom: 150px; }
.lc-stage { margin-top: 145px; }
.lc-stage-label { margin: 0 0 42px; font: 700 14px/1.3 "Courier New", monospace; text-transform: uppercase; }
.lc-stage-meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
.lc-stage-meta div { padding-top: 14px; border-top: 1px solid #d4d4cf; }
.lc-stage-meta span { color: #77776f; font-size: 13px; }
.lc-stage-meta p { margin: 12px 0 0; font-size: 18px; line-height: 1.4; }
.lc-stage-summary { max-width: 760px; margin: 36px 0 48px; color: #6b6b6b; font-size: 18px; line-height: 1.5; }
.lc-stage-evidence { position: relative; width: 100%; aspect-ratio: 960 / 685; margin: 0; overflow: hidden; border-radius: 28px; background: var(--case-image-surface); }
.lc-stage-evidence__phone { position: absolute; z-index: 2; top: 4.671533%; left: 33.4375%; width: 33.333333%; height: auto; display: block; filter: drop-shadow(0 18px 26px rgba(20,20,18,.12)); }
.lc-stage-note { position: absolute; z-index: 4; width: 180px; }
.lc-stage-note h4 { margin: 0 0 6px; color: #2e2e2b; font-size: 12px; font-weight: 700; line-height: 18px; }
.lc-stage-note p { margin: 0; color: #6e6e69; font-size: 12px; font-weight: 400; line-height: 18px; }
.lc-stage-connector, .lc-stage-dot { position: absolute; z-index: 3; display: block; pointer-events: none; }
.lc-stage-dot { width: 5px; height: 5px; }

.lc-stage-evidence--begin .lc-stage-note--primary { left: 3.020833%; top: 16.10219%; }
.lc-stage-evidence--begin .lc-stage-note--secondary { left: 71.979167%; top: 51.430657%; }
.lc-stage-evidence--begin .lc-stage-connector--primary { left: 22.5%; top: 17.416058%; width: 13.125%; height: 10.554745%; }
.lc-stage-evidence--begin .lc-stage-connector--secondary { left: 64.375%; top: 52.744526%; width: 6.875%; height: 10.773723%; }
.lc-stage-evidence--begin .lc-stage-dot--primary { left: 35.3125%; top: 27.386861%; }
.lc-stage-evidence--begin .lc-stage-dot--secondary { left: 64.166667%; top: 62.861314%; }

.lc-stage-evidence--explore .lc-stage-note--primary { left: 71.979167%; top: 12.452555%; }
.lc-stage-evidence--explore .lc-stage-note--secondary { left: 3.020833%; top: 51.284672%; }
.lc-stage-evidence--explore .lc-stage-connector--primary { left: 64.739583%; top: 13.766423%; width: 6.510417%; height: 6.540146%; }
.lc-stage-evidence--explore .lc-stage-connector--secondary { left: 22.5%; top: 52.59854%; width: 13.072917%; height: 5.445255%; }
.lc-stage-evidence--explore .lc-stage-dot--primary { left: 64.53125%; top: 19.722628%; }
.lc-stage-evidence--explore .lc-stage-dot--secondary { left: 35.3125%; top: calc(58.043795% - 2.5px); }

.lc-stage-evidence--master .lc-stage-note--primary { left: 3.020833%; top: 13.182482%; }
.lc-stage-evidence--master .lc-stage-note--secondary { left: 71.979167%; top: 43.839416%; }
.lc-stage-evidence--master .lc-stage-connector--primary { left: 22.5%; top: 14.49635%; width: 13.177083%; height: 6.905109%; }
.lc-stage-evidence--master .lc-stage-connector--secondary { left: 65.260417%; top: 45.153285%; width: 5.989583%; height: 4.715328%; }
.lc-stage-evidence--master .lc-stage-dot--primary { left: 35.416667%; top: 20.744526%; }
.lc-stage-evidence--master .lc-stage-dot--secondary { left: 65.052083%; top: 49.211679%; }
.lc-stage-visual { min-height: 700px; margin: 0; padding: 60px; display: grid; grid-template-columns: 1fr 230px; gap: 46px; align-items: center; border-radius: 28px; background: var(--case-image-surface); }
.lc-stage-visual img { width: auto; max-width: 100%; max-height: 580px; margin-inline: auto; object-fit: contain; filter: drop-shadow(0 18px 26px rgba(0,0,0,.12)); }
.lc-stage-visual figcaption { margin: 0; }
.lc-stage-visual figcaption strong { font-size: 20px; }
.lc-contribution-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.lc-contribution-grid article { min-height: 300px; padding: 28px; border-radius: 18px; background: var(--case-image-surface); }

/* Desktop visual cards share the same spacing tier as adjacent subchapters. */
@media (min-width: 681px) {
  .libercube-study {
    --lc-visual-padding-desktop: 64px;
  }
  .libercube-study .lc-iteration-row,
  .libercube-study .lc-character-system,
  .libercube-study .lc-triptych,
  .libercube-study .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow),
  .libercube-study .lc-loop-showcase article,
  .libercube-study .lc-stage-visual {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    padding: var(--lc-visual-padding-desktop);
  }
  .libercube-study .lc-phone-feature {
    aspect-ratio: 960 / 699;
  }
  .libercube-study .lc-phone-feature .lc-phone-feature__phone {
    top: var(--lc-visual-padding-desktop);
    height: auto;
  }
  .libercube-study .lc-phone-feature .lc-note--greeting,
  .libercube-study .lc-phone-feature .lc-note--methods {
    left: var(--lc-visual-padding-desktop);
  }
  .libercube-study .lc-phone-feature .lc-note--task {
    right: 35px;
    left: auto;
  }
}
.lc-contribution-grid h3 { margin: 0 0 90px; font-size: 21px; line-height: 1.18; }
.lc-summary { padding-top: 40px; }
.lc-summary .lc-lead { font-size: clamp(25px, 3vw, 40px); line-height: 1.25; }
.lc-summary h2 { margin: 160px 0 0; max-width: 900px; font-size: clamp(58px, 8vw, 104px); }
.lc-summary .back-link { margin-top: 110px; }

@media (max-width: 900px) {
  .lc-toc { left: 12px; width: 156px; }
  .lc-toc a { grid-template-columns: 22px minmax(0, 1fr); gap: 4px; padding-inline: 8px; white-space: normal; font-size: 12px; }
  .lc-content { padding: 110px 22px 150px; }
  .lc-section { padding-bottom: 190px; }
  .lc-eyebrow { margin-bottom: 50px; }
  .lc-meta, .lc-insight-grid, .lc-contribution-grid { grid-template-columns: repeat(2, 1fr); }
  .lc-hero-image { width: 100%; margin-left: 0; }
  .lc-iteration-row img, .lc-triptych img { height: 420px; }
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) img { height: auto; }
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption { width: calc(100% - 56px); }
  .lc-stage-visual { min-height: 620px; grid-template-columns: 1fr 200px; padding: 40px; }
}

@media (max-width: 680px) {
  .case-page .site-header--case {
    isolation: isolate;
    padding: 13px 20px 27px;
  }
  .case-page .site-header--case::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: env(safe-area-inset-top, 0px) 0 auto;
    height: max(0px, calc(94px - env(safe-area-inset-top, 0px)));
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, .92) 0,
      rgba(255, 255, 255, .86) 48px,
      rgba(255, 255, 255, .76) 100%
    );
    backdrop-filter: blur(18px) saturate(1.08);
    -webkit-backdrop-filter: blur(18px) saturate(1.08);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .25s ease, visibility 0s .25s;
  }
  .case-page .site-header--case.case-header-toc-visible::before {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
  }
  .lc-toc { position: fixed; z-index: 60; top: 48px; left: 12px; width: calc(100% - 24px); margin: 0; padding: 5px; grid-auto-flow: column; grid-auto-columns: max-content; gap: 3px; overflow-x: auto; transform: none; border: 1px solid rgba(255,255,255,.5); border-radius: 9px; background: linear-gradient(180deg, rgba(255,255,253,.9), rgba(244,244,241,.74)); box-shadow: 0 8px 22px rgba(28,28,26,.06); backdrop-filter: blur(18px) saturate(1.08); -webkit-backdrop-filter: blur(18px) saturate(1.08); scrollbar-width: none; }
  .lc-toc { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-4px); }
  .lc-toc.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
  .lc-toc::-webkit-scrollbar { display: none; }
  .lc-toc a { display: flex; align-items: center; gap: 6px; min-height: 34px; padding: 7px 11px; white-space: nowrap; font-size: 11px; }
  .lc-toc a:hover { transform: none; }
  .lc-toc a:active { transform: scale(.97); }
  .lc-toc a.is-active { background: #262626; color: #fff; }
  .lc-toc a.is-active span { color: #c8c8c3; }
  .lc-content { padding: 70px 18px 120px; }
  .lc-section { padding-bottom: 145px; }
  .lc-section--continuation { padding-bottom: 110px; }
  .lc-eyebrow, .lc-decision > .lc-eyebrow { margin-bottom: 42px; line-height: 1.55; }
  .lc-eyebrow span { display: block; margin-top: 5px; }
  .lc-section h2 { font-size: 48px; }
  .lc-overview h2 { font-size: 64px; }
  .lc-lead { font-size: 21px; line-height: 1.4; }
  .lc-meta { grid-template-columns: repeat(2, 1fr); gap: 28px 14px; margin: 52px 0; }
  .lc-overview-impact { grid-template-columns: 1fr; margin: 0 0 52px; }
  .lc-overview-impact article { min-height: 136px; }
  .lc-overview-impact strong { margin-top: 28px; }
  .lc-hero-image { border-radius: 16px; }
  .lc-question { margin: 52px 0 68px; padding: 24px 22px 28px; }
  .lc-question strong { font-size: 27px; }
  .lc-insight-grid, .lc-from-to, .lc-contribution-grid { grid-template-columns: 1fr; }
  .lc-insight-grid article { min-height: 210px; }
  .lc-insight-grid h3, .lc-contribution-grid h3 { margin-bottom: 54px; }
  .lc-principles article { grid-template-columns: 1fr; gap: 10px; }
  .lc-subchapter { margin-bottom: 48px; font-size: 36px; }
  .lc-phone-feature { display: grid; width: 100%; aspect-ratio: auto; gap: 32px; padding: 0 20px 32px; overflow: visible; border-radius: 28px; }
  .lc-phone-feature .lc-phone-feature__phone { position: relative; top: auto; left: auto; grid-row: 1; width: min(320px, 100%); height: auto; margin-inline: auto; }
  .lc-phone-feature .lc-phone-feature__connector, .lc-phone-feature .lc-phone-feature__dot { display: none; }
  .lc-phone-feature .lc-note { position: static; width: auto; }
  .lc-phone-feature .lc-note h4 { margin-bottom: 8px; }
  .lc-evolution-feature { display: grid; aspect-ratio: auto; gap: 24px; padding: 30px 20px; overflow: visible; }
  .lc-evolution-feature__phone-wrap { position: relative; display: block; width: min(320px, 100%); margin-inline: auto; }
  .lc-evolution-feature__phone-wrap--problem { grid-row: 1; }
  .lc-evolution-feature__phone-wrap--home { grid-row: 4; }
  .lc-evolution-feature__phone-wrap--subpage { grid-row: 6; }
  .lc-evolution-feature__phone { position: relative; top: auto; left: auto; display: block; width: 100%; height: auto; margin: 0; }
  .lc-evolution-feature__note { position: static; width: auto; }
  .lc-evolution-feature__note--problem { grid-row: 2; }
  .lc-evolution-feature__arrow { position: relative; top: auto; left: auto; grid-row: 3; width: 20px; height: 20px; margin-inline: auto; }
  .lc-evolution-feature__note--home { grid-row: 5; }
  .lc-evolution-feature__note--subpage { grid-row: 7; }
  .lc-evolution-feature__connector, .lc-evolution-feature__dot, .lc-evolution-feature__formula-link { display: none; }
  .lc-evolution-feature__highlight { display: block; border-width: 3px; }
  .lc-evolution-feature__highlight--problem { top: 36.077%; left: 10.204%; width: 79.592%; height: 14.886%; transform: none; }
  .lc-evolution-feature__highlight--home { top: 45.359%; left: 10.169%; width: 35.254%; height: 18.039%; }
  .lc-evolution-feature__highlight--subpage { top: 19.965%; left: 9.184%; width: 81.293%; height: 64.799%; }
  .lc-action-evidence { display: grid; aspect-ratio: auto; gap: 24px; margin: 36px 0 64px; padding: 30px 20px; overflow: visible; border-radius: 28px; background: var(--case-image-surface); }
  .lc-action-evidence::before { display: none; }
  .lc-action-evidence__phone { position: relative; top: auto; left: auto; width: min(320px, 100%); height: auto; margin-inline: auto; }
  .lc-action-evidence__phone--before { grid-row: 1; }
  .lc-action-evidence__note { position: static; width: auto; }
  .lc-action-evidence__note h4 { width: auto; }
  .lc-action-evidence__note--small { grid-row: 2; }
  .lc-action-evidence__arrow { position: relative; top: auto; left: auto; grid-row: 3; width: 20px; height: 20px; margin-inline: auto; }
  .lc-action-evidence__phone--after { grid-row: 4; }
  .lc-action-evidence__note--expanded { grid-row: 5; }
  .lc-action-evidence__note--contrast { grid-row: 6; }
  .lc-action-evidence__connector, .lc-action-evidence__dot { display: none; }
  .lc-iteration-row, .lc-iteration-row--two, .lc-triptych { grid-template-columns: 1fr; gap: 70px; padding: 38px 22px 28px; }
  .lc-iteration-row img, .lc-triptych img { width: min(320px, 100%); height: auto; margin-inline: auto; }
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) { grid-template-columns: 1fr; gap: 56px; padding: 30px 20px; }
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) img { width: min(320px, 100%); height: auto; margin-inline: auto; }
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption { width: min(280px, 100%); margin-top: 24px; }
  .lc-triptych.lc-triptych--attention-flow {
    gap: 64px;
    padding: 48px 20px;
  }
  .lc-triptych.lc-triptych--attention-flow figure {
    display: grid;
    justify-items: center;
    width: 100%;
  }
  .lc-triptych.lc-triptych--attention-flow figcaption {
    width: min(320px, 100%);
    margin: 24px auto 0;
  }
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption strong,
  .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption span { font-size: 14px; line-height: 20px; }
  .lc-loop-diagram { aspect-ratio: 4 / 5; margin-bottom: 90px; }
  .lc-loop-diagram__steps { top: 12%; left: 7%; width: 86%; gap: 4%; font-size: 12px; }
  .lc-loop-diagram__timeline { top: 23%; left: 14%; width: 72%; }
  .lc-loop-diagram__down { top: 30%; }
  .lc-loop-diagram__core { top: 40%; left: 17%; width: 66%; }
  .lc-loop-showcase article { grid-template-columns: 1fr; gap: 30px; min-height: 0; padding: 32px 20px 28px; border-width: 1.5px; }
  .lc-loop-showcase__copy { order: 1; }
  .lc-phone-pair { order: 2; flex-direction: column; min-height: auto; gap: 32px; }
  .lc-phone-pair img { width: min(320px, 100%); height: auto; }
  .lc-character-strip { grid-template-columns: repeat(3, 1fr); }
  .lc-character-notes { grid-template-columns: 1fr; }
  .lc-colour-system { grid-template-columns: 1fr; }
  .lc-research { margin-bottom: 100px; }
  .lc-stage { margin-top: 105px; }
  .lc-stage-evidence { display: grid; aspect-ratio: auto; gap: 24px; padding: 30px 20px; overflow: hidden; }
  .lc-stage-evidence__phone { position: relative; top: auto; left: auto; grid-row: 1; width: min(320px, 100%); margin-inline: auto; }
  .lc-stage-note { position: static; width: auto; }
  .lc-stage-note--primary { grid-row: 2; }
  .lc-stage-note--secondary { grid-row: 3; }
  .lc-stage-note h4 { font-size: 14px; line-height: 20px; }
  .lc-stage-note p { font-size: 14px; line-height: 20px; }
  .lc-stage-connector, .lc-stage-dot { display: none; }
  .lc-stage-meta { grid-template-columns: 1fr; }
  .lc-stage-visual { min-height: auto; padding: 34px 22px; grid-template-columns: 1fr; }
  .lc-stage-visual img { max-height: 560px; }
  .lc-final > h2, .lc-contribution > h2 { font-size: 42px; }
  .lc-summary h2 { margin-top: 110px; font-size: 58px; }
}

/* Case Study Typography System v1 ---------------------------------------- */
.libercube-study {
  --case-font-sans: Arial, Helvetica, sans-serif;
  --case-font-mono: "Courier New", monospace;
  --case-text-strong: #181818;
  --case-text-body: #5f5f5a;
  --case-text-muted: #64645f;
  --case-text-inverse: #f8f8f6;
  --case-text-inverse-muted: #c5c5be;
  --case-image-surface: #f3f3f1;
  --case-display-xl: 96px;
  --case-display-lg: 56px;
  --case-feature: 36px;
  --case-heading: 24px;
  --case-lead: 22px;
  --case-body: 17px;
  --case-caption: 14px;
  --case-eyebrow: 12px;
  font-family: var(--case-font-sans);
  color: var(--case-text-strong);
}

.lc-eyebrow,
.lc-decision > .lc-eyebrow {
  color: var(--case-text-strong);
  font: 700 var(--case-eyebrow)/16px var(--case-font-mono);
  letter-spacing: .02em;
}
.lc-eyebrow span { color: var(--case-text-muted); }

/* Editorial chapter rail: keeps the label compact while carrying the
   section rhythm beyond the content column to the right viewport edge. */
.lc-section > .lc-eyebrow {
  width: fit-content;
  max-width: 100%;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 12px;
  padding-block: 6px;
}
.lc-section > .lc-eyebrow::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 calc(50% - 50vw) 0 -12px;
  border-radius: 4px 0 0 4px;
  background: #e9e9e6;
  pointer-events: none;
}
.lc-section > .lc-eyebrow::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset-block: 0;
  right: calc(50% - 50vw);
  width: 24px;
  background: #242422;
  pointer-events: none;
}
.lc-eyebrow__number {
  flex: 0 0 28px;
  color: var(--case-text-strong) !important;
  font-variant-numeric: tabular-nums;
}
.lc-eyebrow__tick {
  flex: 0 0 1px;
  width: 1px;
  height: 12px;
  margin-inline: 1px 2px;
  background: #8e8e88;
}
.lc-eyebrow__label { color: var(--case-text-strong) !important; }
.lc-eyebrow__detail {
  color: var(--case-text-muted) !important;
  font-weight: 400;
}
.lc-eyebrow__detail::before {
  content: "/";
  margin-right: 12px;
  color: #9a9a94;
}
.lc-section > .lc-eyebrow.rail-pending::before { transform: scaleX(0); }
.lc-section > .lc-eyebrow.rail-pending::after { opacity: 0; transform: scaleX(0); }
.lc-section > .lc-eyebrow.rail-pending > span { opacity: 0; transform: translateY(3px); }
.lc-section > .lc-eyebrow::before {
  transform-origin: left center;
  transition: transform 440ms cubic-bezier(.22, 1, .36, 1);
}
.lc-section > .lc-eyebrow::after {
  transform-origin: right center;
  transition: opacity 180ms ease 300ms, transform 220ms cubic-bezier(.22, 1, .36, 1) 280ms;
}
.lc-section > .lc-eyebrow > span {
  margin-top: 0;
  transition: opacity 240ms ease 90ms, transform 320ms cubic-bezier(.22, 1, .36, 1) 90ms;
}

.lc-section { position: relative; }
.lc-chapter-pet {
  position: absolute;
  top: -20px;
  left: calc(var(--lc-pet-anchor-x, 0px) + 30px);
  width: 78px;
  height: 77px;
  pointer-events: none;
  transform-origin: center bottom;
  will-change: auto;
}
.lc-chapter-pet.is-moving { will-change: transform; }
.lc-toc > .lc-chapter-pet {
  top: -67px;
  left: calc(50% - 39px);
}
.lc-chapter-pet--body { z-index: 1; }
.lc-chapter-pet--overlay {
  z-index: 30;
  pointer-events: auto;
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.lc-chapter-pet--overlay.is-dragging { cursor: grabbing; }
.lc-chapter-pet[hidden] { display: none; }
.lc-chapter-pet__body { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.lc-chapter-pet__detail {
  position: absolute;
  left: calc(var(--pet-x) / 157 * 100%);
  top: calc(var(--pet-y) / 155 * 100%);
  width: calc(var(--pet-w) / 157 * 100%);
  height: calc(var(--pet-h) / 155 * 100%);
  object-fit: fill;
}
.lc-chapter-pet.is-landed { animation: lc-pet-breathe 3.6s ease-in-out infinite; }
.lc-chapter-pet.is-landed.is-idle-playing { animation: lc-pet-breathe-sway 675ms ease-in-out both; }
.lc-chapter-pet.is-landed.is-hover-inviting { animation: lc-pet-breathe-sway var(--lc-pet-hover-duration, 675ms) ease-in-out both; }
@keyframes lc-pet-breathe {
  0%, 100% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(0) scale(1); }
  45% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(-1.5px) scale(1.018, 1.026); }
  62% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(-.5px) scale(1.008, 1.012); }
}
@keyframes lc-pet-breathe-sway {
  0% { transform: translateX(var(--lc-pet-idle-from-x, 0px)) translateY(0) rotate(0deg) scale(1); }
  22% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(-1px) rotate(-1.1deg) scale(1.012, 1.018); }
  50% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(-1.5px) rotate(.9deg) scale(1.018, 1.026); }
  76% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(-.5px) rotate(-.55deg) scale(1.008, 1.012); }
  100% { transform: translateX(var(--lc-pet-idle-x, 0px)) translateY(0) rotate(0deg) scale(1); }
}

@media (max-width: 680px) {
  .intro-video { object-position: 48% 50%; }
  .lc-section > .lc-eyebrow {
    display: grid;
    grid-template-columns: 25px 1px minmax(0, 1fr);
    column-gap: 9px;
  }
  .lc-eyebrow__number { flex-basis: auto; }
  .lc-eyebrow__detail {
    grid-column: 3;
    margin-top: 0 !important;
  }
  .lc-eyebrow__detail::before { display: none; }
  .lc-section > .lc-eyebrow::after { width: 12px; }
  .lc-chapter-pet { width: 58px; height: 58px; }
  .lc-chapter-pet,
  .lc-chapter-pet.is-moving { will-change: auto; }
  .lc-chapter-pet img {
    image-rendering: auto;
    backface-visibility: visible;
    -webkit-backface-visibility: visible;
  }
  .lc-chapter-pet.is-landed,
  .lc-chapter-pet.is-landed.is-idle-playing,
  .lc-chapter-pet.is-landed.is-hover-inviting { animation: none; }
  .libercube-study > .lc-chapter-pet,
  .case-page > .lc-chapter-pet { position: fixed; top: 0; left: calc(50% - 29px); z-index: 64; }
}

@media (prefers-reduced-motion: reduce) {
  .lc-section > .lc-eyebrow::before,
  .lc-section > .lc-eyebrow::after,
  .lc-section > .lc-eyebrow > span { transition: none; }
  .lc-chapter-pet.is-landed { animation: none; }
  .lc-chapter-pet.is-landed.is-idle-playing { animation: none; }
  .lc-chapter-pet.is-landed.is-hover-inviting { animation: none; }
}

.lc-section h2,
.lc-final > h2,
.lc-contribution > h2 {
  max-width: 820px;
  font-family: var(--case-font-sans);
  font-size: var(--case-display-lg);
  line-height: 58px;
  font-weight: 500;
  letter-spacing: -.045em;
  color: var(--case-text-strong);
}
.lc-overview h2,
.lc-summary h2 {
  font-size: var(--case-display-xl);
  line-height: 92px;
  font-weight: 500;
  letter-spacing: -.055em;
}
.lc-summary h2 {
  max-width: 960px;
  font-size: 88px;
  line-height: 88px;
  text-wrap: balance;
}
.lc-summary .lc-lead,
.lc-question strong,
.lc-result {
  font-family: var(--case-font-sans);
  font-size: var(--case-feature);
  line-height: 41px;
  letter-spacing: -.035em;
}
.lc-question strong { font-weight: 700; color: var(--case-text-strong); }
.lc-result { color: var(--case-text-inverse); font-weight: 400; }

.lc-copy-block h3,
.lc-loop-showcase h3 {
  font-family: var(--case-font-sans);
  font-size: var(--case-heading);
  line-height: 29px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--case-text-strong);
}
.lc-lead {
  max-width: 720px;
  color: var(--case-text-body);
  font-size: var(--case-lead);
  line-height: 32px;
  letter-spacing: -.018em;
}
.lc-copy-block { max-width: 680px; }
.lc-copy-block p,
.lc-insight-grid p,
.lc-principles p,
.lc-note p,
.lc-contribution-grid p,
.lc-loop-showcase p,
.lc-stage-meta p,
.lc-stage-summary {
  color: var(--case-text-body);
  font-size: var(--case-body);
  line-height: 27px;
  letter-spacing: 0;
}
.lc-stage-summary { max-width: 680px; }

.lc-insight-grid h3,
.lc-principles h3,
.lc-note h4,
.lc-character-notes h3,
.lc-colour-system h3,
.lc-stage-visual figcaption strong,
.lc-contribution-grid h3 {
  color: var(--case-text-strong);
  font-family: var(--case-font-sans);
  font-size: var(--case-body);
  line-height: 22px;
  font-weight: 700;
  letter-spacing: 0;
}
.lc-from-to strong {
  color: var(--case-text-strong);
  font-size: var(--case-heading);
  line-height: 29px;
  letter-spacing: -.02em;
}

.lc-meta dt,
.lc-meta dd,
.lc-question span,
.lc-from-to span,
.lc-iteration-row figcaption strong,
.lc-triptych figcaption strong,
.lc-iteration-row figcaption span,
.lc-triptych figcaption span,
.lc-stage-visual figcaption span,
.lc-loop-diagram span,
.lc-loop-diagram p,
.lc-character-notes p,
.lc-colour-system p,
.lc-research,
.lc-stage-meta span {
  font-family: var(--case-font-sans);
  font-size: var(--case-caption);
  line-height: 20px;
  letter-spacing: 0;
}
.lc-meta dt,
.lc-question span,
.lc-from-to span,
.lc-loop-diagram span,
.lc-stage-meta span { color: var(--case-text-muted); }
.lc-meta dd,
.lc-iteration-row figcaption strong,
.lc-triptych figcaption strong { color: var(--case-text-strong); }
.lc-iteration-row figcaption span,
.lc-triptych figcaption span,
.lc-stage-visual figcaption span,
.lc-loop-diagram p,
.lc-colour-system p,
.lc-research { color: var(--case-text-body); }
.lc-character-notes p { color: var(--case-text-body); }

.lc-phone-feature .lc-note h4 {
  margin-bottom: 6px;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 0;
}
.lc-phone-feature .lc-note p {
  color: #6e6e69;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 0;
}

.lc-stage-label {
  color: var(--case-text-strong);
  font: 700 var(--case-eyebrow)/16px var(--case-font-mono);
  letter-spacing: .02em;
}
.lc-result span {
  color: var(--case-text-inverse-muted);
  font: 700 var(--case-eyebrow)/16px var(--case-font-mono);
  letter-spacing: .02em;
}
.lc-loop-diagram b {
  font-family: var(--case-font-sans);
  font-size: var(--case-body);
  line-height: 22px;
  font-weight: 700;
}
.lc-loop-showcase h3 span,
.lc-colour-system h3 span { color: var(--case-text-muted); }
.lc-loop-showcase .lc-loop-showcase__copy h3,
.lc-loop-showcase .lc-loop-showcase__copy h3 span { color: var(--loop-accent); }

/* Reframing rhythm: one editorial title scale, one supporting-title scale. */
.lc-section--reframing { padding-bottom: 170px; }
#lc-insight { padding-bottom: 64px; }
.lc-section--reframing .lc-subchapter { margin-bottom: 48px; }
.lc-section--reframing .lc-principles article { padding-block: 32px; }
.lc-section--reframing .lc-principles h3 {
  font-size: var(--case-heading);
  line-height: 29px;
  letter-spacing: -.02em;
}

@media (max-width: 680px) {
  .libercube-study {
    --case-display-xl: 56px;
    --case-display-lg: 40px;
    --case-feature: 28px;
    --case-heading: 22px;
    --case-lead: 20px;
    --case-body: 16px;
  }
  .lc-section h2,
  .lc-final > h2,
  .lc-contribution > h2 {
    font-size: var(--case-display-lg);
    line-height: 42px;
  }
  .lc-overview h2,
  .lc-summary h2 {
    font-size: var(--case-display-xl);
    line-height: 54px;
  }
  .lc-section { padding-bottom: 120px; }
  .lc-summary h2 { max-width: 100%; text-wrap: balance; }
  .lc-summary .lc-lead,
  .lc-question strong,
  .lc-result {
    font-size: var(--case-feature);
    line-height: 33px;
  }
  .lc-copy-block h3,
  .lc-loop-showcase h3,
  .lc-from-to strong {
    font-size: var(--case-heading);
    line-height: 27px;
  }
  .lc-lead { font-size: var(--case-lead); line-height: 29px; }
  .lc-copy-block p,
  .lc-insight-grid p,
  .lc-principles p,
  .lc-note p,
  .lc-contribution-grid p,
  .lc-loop-showcase p,
  .lc-stage-meta p,
  .lc-stage-summary {
    font-size: var(--case-body);
    line-height: 25px;
  }
  .lc-insight-grid h3,
  .lc-principles h3,
  .lc-note h4,
  .lc-character-notes h3,
  .lc-colour-system h3,
  .lc-stage-visual figcaption strong,
  .lc-contribution-grid h3,
  .lc-loop-diagram b {
    font-size: var(--case-body);
    line-height: 21px;
  }
  .lc-phone-feature .lc-note h4,
  .lc-phone-feature .lc-note p,
  .lc-evolution-feature .lc-note h4,
  .lc-evolution-feature .lc-note p {
    font-size: 14px;
    line-height: 20px;
  }
  .lc-section--reframing { padding-bottom: 120px; }
  .lc-section--reframing .lc-subchapter { margin-bottom: 36px; }
  .lc-section--reframing .lc-principles article { padding-block: 24px; }
  .lc-section--reframing .lc-principles h3 {
    font-size: var(--case-heading);
    line-height: 27px;
  }
}

[data-reveal] { animation: fade-up .8s .5s both; }
@keyframes title-in { to { transform: translateY(0); } }
@keyframes hero-pointer-card-life {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.15); }
  9% { opacity: .96; transform: translate(-50%, -50%) scale(1); }
  70% { opacity: .96; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
}
@keyframes fade-up { from { opacity: 0; transform: translateY(20px); } }
@keyframes grid-drift { to { transform: scale(1.08) translate3d(-1.5%, 1%, 0); } }

/* LiberCube — Subpage Design System text-layout adoption.
   Image/evidence compositions and their internal annotation typography remain unchanged. */
.libercube-study {
  --case-font-display: "SF Pro Display", Arial, Helvetica, sans-serif;
  --case-font-text: "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
  --case-text-strong: #262626;
  --case-text-body: #5f5f5a;
  --case-text-muted: #85857f;
  --case-display-lg: 56px;
  --case-heading: 24px;
  --case-body: 17px;
  font-family: var(--case-font-text);
}

.lc-section > .lc-eyebrow {
  gap: 24px;
  margin-bottom: 80px;
  padding: 0;
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 56px;
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.04em;
  text-transform: none;
}
.lc-section > .lc-eyebrow::before,
.lc-section > .lc-eyebrow::after {
  display: none;
}
.lc-section > .lc-eyebrow .lc-eyebrow__number {
  flex-basis: auto;
  color: var(--case-text-muted) !important;
  font: inherit;
}
.lc-section > .lc-eyebrow .lc-eyebrow__tick {
  display: none;
}
.lc-section > .lc-eyebrow .lc-eyebrow__label {
  color: var(--case-text-strong) !important;
  font: inherit;
}

.lc-section > h2,
.lc-final > h2,
.lc-contribution > h2,
.lc-summary > h2 {
  max-width: 900px;
  margin: 0 0 16px;
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 56px;
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.04em;
}

.lc-overview h2,
.lc-summary h2 {
  font-size: 56px;
  line-height: 1.02;
  letter-spacing: -.04em;
}
.lc-overview > h2 {
  max-width: 720px;
  margin: 0 0 16px;
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-overview > .lc-meta + .lc-hero-image {
  margin: 64px 0 0;
}
.lc-meta dt {
  display: flex;
  align-items: center;
  gap: 12px;
}
.lc-meta .lc-hero-image__link {
  position: static;
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border: 0;
  color: #f8f8f6;
  background: #262626;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.lc-meta .lc-hero-image__link svg {
  width: 15px;
  height: 15px;
}

.lc-lead {
  max-width: 680px;
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}

.lc-meta {
  margin: 64px 0 0;
}
.lc-meta dt {
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-meta dd {
  margin-top: 16px;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-overview-impact {
  margin: 64px 0 0;
}
.lc-overview-impact article {
  min-height: 0;
  padding: 48px;
  border-radius: 24px;
  background: #f1f1ef;
}
.lc-overview-impact span {
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}
.lc-overview-impact strong {
  margin-top: 16px;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-overview-impact + .lc-hero-image {
  margin-top: 64px;
}

.lc-copy-block {
  max-width: 680px;
  margin-bottom: 64px;
}
.lc-content-subheading,
.lc-copy-block__question h3 {
  max-width: 720px;
  margin: 0 0 16px;
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-copy-block__question p {
  max-width: 680px;
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-copy-block--reframing {
  margin: 64px 0;
}
.lc-copy-block h3,
.lc-insight-grid h3,
.lc-principles h3,
.lc-loop-showcase__copy h3,
.lc-contribution-grid h3,
.lc-copy-block__question strong,
.lc-subchapter {
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-copy-block h3,
.lc-insight-grid h3,
.lc-loop-showcase__copy h3,
.lc-contribution-grid h3 {
  margin-bottom: 16px;
}
.lc-copy-block p,
.lc-insight-grid p,
.lc-principles p,
.lc-contribution-grid p,
.lc-loop-showcase__copy p,
.lc-stage-meta p,
.lc-stage-summary,
.lc-research,
.lc-summary .lc-lead {
  max-width: 680px;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-copy-block__question span,
.lc-subchapter span,
.lc-stage-label,
.lc-result span {
  color: var(--case-text-muted);
}
.lc-copy-block__question strong {
  max-width: 720px;
}
.lc-subchapter {
  margin-bottom: 64px;
}
.lc-decision > .lc-subchapter {
  padding-top: 0;
  border-top: 0;
  color: var(--case-text-strong);
}
.lc-decision > .lc-subchapter span {
  display: inline;
  margin: 0 16px 0 0;
  color: var(--case-text-muted);
  font: inherit;
  letter-spacing: inherit;
  text-transform: none;
}
.lc-meta div,
.lc-stage-meta div {
  padding-top: 0;
  border-top: 0;
}
.lc-subchapter {
  padding-top: 0;
  border-top: 0;
}
.lc-principles {
  border-top: 0;
}
.lc-principles article {
  border-bottom: 0;
}
.lc-character-notes {
  border-top: 0;
}
.lc-principles article {
  gap: 48px;
  padding-block: 32px;
}
.lc-principles h3 {
  margin: 0;
}
.lc-reframing-summary {
  max-width: 720px;
}
.lc-reframing-summary h3 {
  margin: 0 0 16px;
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-reframing-summary p {
  max-width: 680px;
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-section--reframing .lc-principles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 64px;
}
.lc-section--reframing .lc-principles article {
  display: block;
  min-height: 260px;
  padding: 48px;
  border: 0;
  border-radius: 24px;
  background: #f1f1ef;
}
.lc-section--reframing .lc-principles h3 {
  margin: 0 0 16px;
}
.lc-section--reframing .lc-principles p {
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}

/* Evidence-image annotations use the shared caption tier. */
.lc-phone-feature .lc-note h4,
.lc-evolution-feature .lc-note h4,
.lc-action-evidence .lc-note h4 {
  margin: 0 0 8px;
  color: var(--case-text-strong);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
}
.lc-phone-feature .lc-note p,
.lc-evolution-feature .lc-note p,
.lc-action-evidence .lc-note p {
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0;
}
.lc-insight-grid {
  margin-top: 64px;
}
.lc-result {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 48px;
  border: 0;
  border-radius: 24px;
  background: #262626 url("./assets/resume-dot-texture.png") center / cover;
  color: var(--case-text-inverse);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-result::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: rgba(38, 38, 38, .18);
  pointer-events: none;
}
.lc-result span {
  margin-bottom: 32px;
  color: var(--case-text-inverse-muted);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
}
.lc-stage-meta span {
  color: var(--case-text-muted);
  font-family: var(--case-font-text);
  font-size: 14px;
  line-height: 20px;
}
.lc-stage-summary {
  display: none;
}
.lc-overall-experience {
  margin-bottom: 64px;
}
.lc-final > .lc-eyebrow {
  margin-bottom: 64px;
}
.lc-overall-experience + .lc-stage {
  margin-top: 160px;
}
.lc-stage-label,
.lc-stage-meta span {
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}
.lc-stage-label {
  margin-bottom: 64px;
  color: var(--case-text-strong);
}
.lc-stage-label > span {
  display: inline-block;
  margin-right: 16px;
  color: var(--case-text-muted);
}
.lc-stage-meta span {
  display: block;
}
.lc-stage-meta p {
  margin-top: 16px;
}
.lc-stage-meta ~ .lc-stage-evidence {
  margin-top: 64px;
}
.lc-visual-system-intro {
  margin-top: 145px;
}
.lc-visual-system-intro h3 > span {
  display: inline-block;
  margin-right: 16px;
  color: var(--case-text-muted);
}
.lc-colour-system h3 {
  margin-bottom: 16px;
  color: var(--case-text-strong);
  font-family: var(--case-font-display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.lc-colour-system h3 span {
  color: var(--case-text-muted);
  font: inherit;
}
.lc-colour-system p {
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-impact-copy {
  max-width: 680px;
  margin: 64px 0 0;
}
.lc-impact-copy p {
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
.lc-impact-copy p + p {
  margin-top: 24px;
}
.lc-character-strip img {
  height: 84px;
  justify-self: center;
}
.libercube-study .lc-character-notes h3 {
  margin: 0 0 8px;
  color: var(--case-text-strong);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
}
.libercube-study .lc-character-notes p {
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0;
}
.libercube-study .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption strong {
  color: var(--case-text-strong);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
}
.libercube-study .lc-triptych:is(.lc-triptych--match-flow, .lc-triptych--attention-flow) figcaption span {
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0;
}
.libercube-study #lc-experience .lc-stage-note h4 {
  margin: 0 0 8px;
  color: var(--case-text-strong);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
}
.libercube-study #lc-experience .lc-stage-note p {
  margin: 0;
  color: var(--case-text-body);
  font-family: var(--case-font-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0;
}
/* Decision 01: compare the previous and revised home screens side by side. */
@media (min-width: 681px) {
  .libercube-study .lc-action-evidence {
    --lc-ui-width: 30.625%;
    --lc-ui-height: 83.3577%;
    aspect-ratio: 960 / 685;
    overflow: hidden;
    border-radius: 28px;
    background: var(--case-image-surface);
  }
  .libercube-study .lc-action-evidence::before { display: none; }
  .libercube-study .lc-action-evidence__phone {
    top: 8.3212%;
    width: var(--lc-ui-width);
    height: var(--lc-ui-height);
    object-fit: fill;
    filter: none;
  }
  .libercube-study .lc-action-evidence__phone--before { left: 19.375%; }
  .libercube-study .lc-action-evidence__phone--after {
    left: 50%;
    width: 30.7292%;
  }
  .libercube-study .lc-action-evidence__arrow {
    top: 48.466%;
    left: 48.9583%;
    width: 2.2396%;
    height: 3.2251%;
    transform: none;
  }
  .libercube-study .lc-action-evidence__note--small {
    top: 44.3796%;
    left: 4.0625%;
    width: 14.375%;
  }
  .libercube-study .lc-action-evidence__note--expanded {
    top: 25.2555%;
    left: 81.6667%;
    width: 14.0625%;
  }
  .libercube-study .lc-action-evidence__note--contrast {
    top: 57.2263%;
    left: 81.6667%;
    width: 14.0625%;
  }
  .libercube-study .lc-action-evidence .lc-note h4 {
    width: auto;
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 20px;
  }
  .libercube-study .lc-action-evidence .lc-note p {
    font-size: 14px;
    line-height: 20px;
  }
  .libercube-study .lc-action-evidence__connector--small {
    top: 33.7956%;
    left: 19.4792%;
    width: 3.3333%;
    height: auto;
    transform: none;
  }
  .libercube-study .lc-action-evidence__connector--expanded {
    top: 26.7883%;
    left: 76.9792%;
    width: 3.6402%;
    height: auto;
    transform: scaleX(-1);
  }
  .libercube-study .lc-action-evidence__connector--contrast {
    top: 50.6569%;
    left: 76.9792%;
    width: 3.6443%;
    height: auto;
    transform: scaleX(-1);
  }
  .libercube-study .lc-action-evidence__dot {
    width: 5px;
    height: 5px;
  }
  .libercube-study .lc-action-evidence__dot--small {
    top: calc(33.7956% - 2.5px);
    left: calc(22.8125% - 2.5px);
  }
  .libercube-study .lc-action-evidence__dot--expanded {
    top: calc(30.763% - 2.5px);
    left: calc(76.9792% - 2.5px);
  }
  .libercube-study .lc-action-evidence__dot--contrast {
    top: calc(50.6569% - 2.5px);
    left: calc(76.9792% - 2.5px);
  }
  .libercube-study .lc-action-evidence__dot--title {
    top: calc(37.8686% - 2.5px);
    left: calc(58.4375% - 2.5px);
    width: 5px;
    height: 5px;
  }

  /* Centre each annotation in the gutter between the phone and card edge. */
  .libercube-study #lc-experience .lc-stage-note--primary { left: 7.3%; }
  .libercube-study #lc-experience .lc-stage-note--secondary { left: 74%; }
  .libercube-study #lc-experience .lc-stage-evidence--explore .lc-stage-note--primary { left: 74%; }
  .libercube-study #lc-experience .lc-stage-evidence--explore .lc-stage-note--secondary { left: 7.3%; }

  .libercube-study #lc-experience .lc-stage-evidence--begin .lc-stage-connector--primary,
  .libercube-study #lc-experience .lc-stage-evidence--explore .lc-stage-connector--secondary,
  .libercube-study #lc-experience .lc-stage-evidence--master .lc-stage-connector--primary {
    left: 26.05%;
    width: 9.52%;
  }
  .libercube-study #lc-experience .lc-stage-evidence--begin .lc-stage-connector--secondary {
    left: 64.375%;
    width: 8.9%;
  }
  .libercube-study #lc-experience .lc-stage-evidence--explore .lc-stage-connector--primary {
    left: 64.739583%;
    width: 8.53%;
  }
  .libercube-study #lc-experience .lc-stage-evidence--master .lc-stage-connector--secondary {
    left: 65.260417%;
    width: 8.01%;
  }
}
.lc-contribution {
  padding-bottom: 0;
}
.lc-contribution + .lc-summary {
  padding-top: 100px;
}

/* Chapter rhythm. Continuation sections remain inside their parent chapter. */
.lc-section {
  padding-bottom: 64px;
}
.lc-section:has(+ .lc-section[data-lc-chapter]) {
  padding-bottom: 320px;
}
.lc-decision:has(+ .lc-decision) {
  padding-bottom: 160px;
}
.lc-section:last-child {
  padding-bottom: 160px;
}

@media (max-width: 1199px) {
  .lc-section:has(+ .lc-section[data-lc-chapter]) {
    padding-bottom: 240px;
  }
  .lc-decision:has(+ .lc-decision) {
    padding-bottom: 160px;
  }
}

@media (max-width: 680px) {
  .libercube-study {
    --case-display-lg: 40px;
    --case-heading: 21px;
    --case-body: 16px;
  }
  .lc-section > .lc-eyebrow {
    width: 100%;
    max-width: none;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 12px;
    align-items: start;
    margin-bottom: 48px;
    font-size: 40px;
    line-height: 1.05;
  }
  .lc-section > .lc-eyebrow .lc-eyebrow__label {
    min-width: 0;
  }
  .lc-evolution-feature .lc-note h4 {
    width: auto;
    max-width: none;
  }
  .lc-section > h2,
  .lc-final > h2,
  .lc-contribution > h2,
  .lc-summary > h2,
  .lc-overview h2,
  .lc-summary h2 {
    font-size: 40px;
    line-height: 1.05;
  }
  .lc-overview > h2 {
    font-size: 21px;
    line-height: 26px;
  }
  .lc-overview > .lc-meta + .lc-hero-image {
    margin: 48px 0 0;
  }
  .lc-lead,
  .lc-copy-block p,
  .lc-insight-grid p,
  .lc-principles p,
  .lc-contribution-grid p,
  .lc-loop-showcase__copy p,
  .lc-stage-meta p,
  .lc-stage-summary,
  .lc-research,
  .lc-summary .lc-lead {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-meta dt,
  .lc-overview-impact span,
  .lc-content-subheading,
  .lc-copy-block__question h3,
  .lc-copy-block h3,
  .lc-insight-grid h3,
  .lc-principles h3,
  .lc-loop-showcase__copy h3,
  .lc-contribution-grid h3,
  .lc-copy-block__question strong,
  .lc-subchapter,
  .lc-result {
    font-size: 21px;
    line-height: 26px;
  }
  .lc-meta dd {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-overview-impact article {
    padding: 24px;
    border-radius: 18px;
  }
  .lc-overview-impact strong {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-copy-block__question p {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-reframing-summary h3 {
    font-size: 21px;
    line-height: 26px;
  }
  .lc-reframing-summary p {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-section--reframing .lc-principles {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 48px;
  }
  .lc-section--reframing .lc-principles article {
    min-height: 0;
    padding: 24px;
    border-radius: 18px;
  }
  .lc-section--reframing .lc-principles p {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-result {
    padding: 24px;
    border-radius: 18px;
  }
  .lc-result span {
    margin-bottom: 24px;
  }
  .lc-stage-label,
  .lc-stage-meta span {
    font-size: 21px;
    line-height: 26px;
  }
  .lc-stage-label {
    margin-bottom: 48px;
  }
  .lc-stage-label > span {
    margin-right: 12px;
  }
  .lc-stage-meta ~ .lc-stage-evidence {
    margin-top: 48px;
  }
  .lc-visual-system-intro {
    margin-top: 112px;
  }
  .lc-colour-system h3 {
    font-size: 21px;
    line-height: 26px;
  }
  .lc-colour-system p {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-impact-copy {
    margin-top: 48px;
  }
  .lc-impact-copy p {
    font-size: 16px;
    line-height: 25px;
  }
  .lc-impact-copy p + p {
    margin-top: 20px;
  }
  .lc-contribution + .lc-summary {
    padding-top: 80px;
  }
  .lc-decision > .lc-subchapter span {
    margin-right: 12px;
  }
  .lc-section:has(+ .lc-section[data-lc-chapter]),
  .lc-decision:has(+ .lc-decision) {
    padding-bottom: 160px;
  }
  .lc-section:last-child {
    padding-bottom: 112px;
  }
}
@keyframes curtain-in { 0% { transform: translateY(100%); } 45%,60% { transform: translateY(0); } 100% { transform: translateY(-100%); } }
@keyframes fade-in { to { opacity: 1; } }
@keyframes intro-hero-decode {
  0% { opacity: 0; filter: contrast(1.35) brightness(.68); transform: translateY(9px); }
  18% { opacity: .13; }
  21% { opacity: .03; }
  35% { opacity: .34; filter: contrast(1.18) brightness(.82); }
  38% { opacity: .18; }
  63% { opacity: .72; }
  100% { opacity: 1; filter: none; transform: none; }
}
@keyframes intro-hero-flicker {
  0%, 14% { opacity: 0; }
  15%, 23% { opacity: .18; }
  24%, 31% { opacity: .04; }
  32%, 51% { opacity: .46; }
  52%, 59% { opacity: .25; }
  60%, 100% { opacity: 1; }
}

@media (max-width: 800px) {
  :root { --pad: clamp(16px, 5vw, 24px); --radius: clamp(22px, 7vw, 30px); }
  .site-header { padding: 20px 20px; transform: none; }
  .site-header nav { gap: 4px; }
  .nav-link { font-size: 11px; }
  .nav-pill { height: 26px; padding-inline: 9px; font-size: 13px; border-radius: 5px; }
  .language-switch { height: 26px; margin-left: 0; }
  .language-switch button { min-width: 24px; height: 22px; padding-inline: 5px; font-size: 13px; }
  .hero { min-height: calc(100svh - 20px); margin: 10px; padding-top: 82px; padding-bottom: 28px; border-radius: 18px; }
  .hero-media { opacity: .5; }
  .hero:hover .hero-media { opacity: .4; transform: none; }
  .hero-title { width: 123%; margin-left: 0; transform: none; }
  .section-heading p { margin-left: 10px; }
  .hero-kicker span:last-child { display: none; }
  .hero-footer p { max-width: 210px; font-size: 10px; }
  .discover-link { gap: 10px; font-size: 10px; }
  .link-arrow { width: 38px; height: 38px; }
  .work { padding-top: 92px; padding-bottom: 92px; }
  .section-heading { grid-template-columns: 1fr; gap: 28px; }
  .section-heading { margin-bottom: 64px; }
  .section-heading h2 { margin-left: 10px; font-size: clamp(38px, 11.7vw, 54px); }
  .project-stack { --card-width: calc(100vw - 32px); }
  .project-card { min-height: clamp(386px, 47svh, 402px); padding: 18px; grid-template-columns: 1fr; grid-template-rows: auto auto auto 1fr; column-gap: 0; }
  .project-slot { height: clamp(400px, 49svh, 416px); }
  .project-slot:not(:last-child) { margin-bottom: 16px; }
  .project-stack { padding-bottom: 48vh; }
  .cards-active .project-slot:nth-child(1) .project-card { top: max(84px, calc((100svh - clamp(386px, 47svh, 402px)) / 2 - 18px)); }
  .cards-active .project-slot:nth-child(2) .project-card { top: max(104px, calc((100svh - clamp(386px, 47svh, 402px)) / 2 + 2px)); }
  .cards-active .project-slot:nth-child(3) .project-card { top: max(124px, calc((100svh - clamp(386px, 47svh, 402px)) / 2 + 22px)); }
  .cards-active .project-slot:nth-child(4) .project-card { top: max(160px, calc((100svh - clamp(386px, 47svh, 402px)) / 2 + 58px)); }
  .card-meta { grid-template-columns: 40px 1fr auto; font-size: 9px; }
  .card-copy { grid-row: 2; padding: 24px 0 16px; }
  .card-copy h3 { margin-bottom: 8px; font-size: clamp(38px, 11.8vw, 52px); line-height: .9; }
  .card-copy p { max-width: 240px; font-size: 15px; line-height: 1.25; }
  .card-visual { grid-column: 1; grid-row: 3; align-self: start; width: 100%; height: auto; min-height: 0; margin: 0 0 18px; transform: none; }
  .portfolio-video { aspect-ratio: 16 / 9; }
  .portfolio-image { aspect-ratio: 16 / 9; }
  .video-controls { left: 8px; right: 8px; bottom: 8px; grid-template-columns: auto minmax(42px, 1fr) auto minmax(42px, 62px) auto; gap: 5px; padding: 7px 8px; }
  .video-controls button { width: 28px; height: 28px; }
  .card-action { grid-row: 4; align-self: end; }
  .card-action { gap: 8px; font-size: 10px; }
  .card-action b { width: 32px; height: 32px; }
  .resume-section { margin-top: -18vh; padding: 12px; border-radius: 24px 24px 0 0; }
  .resume-primary { grid-template-columns: 1fr; min-height: auto; gap: 12px; }
  .resume-gallery,
  .resume-statement,
  .resume-preview,
  .resume-experience { border-radius: 20px; }
  .resume-gallery { min-height: 490px; padding: 30px 24px; }
  .resume-eyebrow { margin-bottom: 22px; }
  .resume-gallery h2 { font-size: clamp(52px, 15vw, 68px); }
  .resume-cascade { inset: 27% 8% 7% 13%; }
  .resume-tile { width: clamp(52px, 16vw, 76px); border-radius: 8px; }
  .resume-tile--2,
  .resume-tile--5,
  .resume-tile--8 { width: clamp(44px, 13vw, 62px); }
  .resume-tile--4,
  .resume-tile--7 { width: clamp(58px, 18vw, 84px); }
  .resume-statement { min-height: 450px; justify-content: end; padding: 68px 24px 36px; }
  .resume-quote { top: 32px; left: 24px; }
  .resume-statement p { font-size: clamp(34px, 9.4vw, 38px); line-height: .98; letter-spacing: -.045em; }
  .resume-byline { font-size: 11px; }
  .resume-lower { grid-template-columns: 1fr; gap: 12px; margin-top: 12px; }
  .resume-preview { min-height: 180px; }
  .resume-preview img { object-position: center 20%; }
  .resume-experience { padding: 20px; }
  .resume-experience-head { position: relative; display: block; }
  .resume-experience-head > div { min-width: 0; }
  .resume-download { position: absolute; top: 0; right: 0; }
  .resume-experience-head p { font-size: 12px; }
  .resume-roles { grid-template-columns: 1fr; gap: 10px; padding-top: 24px; }
  .resume-roles article { min-height: 92px; padding: 16px; }
  .case-hero { grid-template-columns: 1fr; align-items: start; }
  .case-cover img { height: 50vh; }
  .case-page--libercube .case-cover img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  .placeholder-grid { grid-template-columns: 1fr; }
  footer { min-height: 112px; padding-top: 24px; padding-bottom: 24px; }
}

/* LiberCube desktop visual safe area: every image surface starts content at 64px. */
@media (min-width: 681px) {
  .libercube-study .lc-phone-feature .lc-phone-feature__phone,
  .libercube-study .lc-evolution-feature__phone--problem,
  .libercube-study .lc-action-evidence__phone,
  .libercube-study #lc-experience .lc-stage-evidence__phone {
    top: 64px;
  }
  .libercube-study .lc-loop-diagram__steps {
    top: 64px;
  }
  .libercube-study .lc-iteration-row,
  .libercube-study .lc-character-system,
  .libercube-study .lc-triptych,
  .libercube-study .lc-loop-showcase article,
  .libercube-study .lc-stage-visual {
    padding-top: 64px;
  }
  .libercube-study .lc-iteration-row,
  .libercube-study .lc-character-system,
  .libercube-study .lc-triptych,
  .libercube-study .lc-loop-showcase article,
  .libercube-study .lc-stage-visual {
    align-content: center;
    justify-content: center;
  }
  .libercube-study .lc-loop-showcase article {
    grid-template-columns: minmax(210px, 255px) max-content;
  }
  .libercube-study .lc-iteration-row figure,
  .libercube-study .lc-triptych figure {
    display: grid;
    justify-items: center;
  }
  .libercube-study .lc-character-strip,
  .libercube-study .lc-character-notes {
    width: 100%;
  }
  .libercube-study .lc-insight-grid {
    gap: 24px;
  }
  .libercube-study .lc-insight-grid article {
    min-height: 260px;
    padding: 48px;
    border-radius: 24px;
  }
  .libercube-study .lc-contribution-grid article {
    padding: 48px;
    border-radius: 24px;
  }
  .libercube-study .lc-colour-system article {
    padding: 48px;
    border-radius: 24px;
  }
}

@media (max-width: 680px) {
  .libercube-study .lc-contribution-grid article {
    padding: 24px;
    border-radius: 18px;
  }
  .libercube-study .lc-colour-system article {
    padding: 24px;
    border-radius: 18px;
  }
}

@media (min-width: 1200px) {
  .subpage-system .sp-content {
    width: min(960px, calc(100% - 480px));
    margin-inline: auto;
    transform: translateX(-64px);
  }
  .sp-toc { left: auto; right: calc(var(--pad) + 24px); }
  .case-placeholder__content { width: min(960px, calc(100vw - 480px)); margin-inline: auto; transform: translateX(-64px); }
  .case-placeholder .sp-toc { color: #262626; }
  .case-placeholder .sp-toc a { color: #262626; }
  .case-placeholder .sp-toc a.is-active { background: #262626; color: #fafafa; }
  .libercube-study .lc-content {
    margin-inline: auto;
    transform: translateX(-64px);
  }
  .libercube-study .lc-toc {
    right: calc(var(--pad) + 24px);
    left: auto;
  }
  .libercube-study .lc-toc a:hover {
    transform: translateX(-3px);
  }
  .libercube-study .lc-toc a:active {
    transform: translateX(-3px) scale(.97);
  }
}

@media (min-width: 681px) {
  .libercube-study .lc-evolution-feature {
    aspect-ratio: 960 / 1319;
  }
  .libercube-study .lc-evolution-feature__phone {
    height: auto;
  }
  .libercube-study .lc-evolution-feature__phone--home,
  .libercube-study .lc-evolution-feature__phone--subpage {
    top: 51.858%;
  }
  .libercube-study .lc-evolution-feature__highlight--problem {
    top: 18.3472%;
    height: 5.9894%;
    transform: translateY(30px);
  }
  .libercube-study .lc-evolution-feature__note--problem,
  .libercube-study .lc-evolution-feature__connector--problem,
  .libercube-study .lc-evolution-feature__dot--problem {
    transform: translateY(40px);
  }
  .libercube-study .lc-evolution-feature__highlight--home {
    top: 71.4936%;
    height: 7.8089%;
  }
  .libercube-study .lc-evolution-feature__highlight--subpage {
    top: 60.5762%;
    height: 28.0516%;
  }
  .libercube-study .lc-action-evidence {
    aspect-ratio: 960 / 700;
  }
  .libercube-study .lc-action-evidence__phone {
    height: auto;
  }
  .libercube-study #lc-experience .lc-stage-evidence {
    aspect-ratio: 960 / 749;
  }
  .libercube-study .lc-evolution-feature__arrow {
    top: 49.25%;
  }
  .libercube-study .lc-action-evidence__phone--before {
    left: 7.1875%;
  }
  .libercube-study .lc-action-evidence__phone--after {
    left: 37.8125%;
  }
  .libercube-study .lc-action-evidence__arrow {
    left: 36.7708%;
  }
  .libercube-study .lc-action-evidence__note--small,
  .libercube-study .lc-action-evidence__connector--small,
  .libercube-study .lc-action-evidence__dot--small {
    display: none;
  }
  .libercube-study .lc-action-evidence__note--expanded,
  .libercube-study .lc-action-evidence__note--contrast {
    left: calc(68.5417% + 47.5px);
    width: 20%;
  }
  .libercube-study .lc-action-evidence__connector--expanded {
    left: calc(68.5417% - 0.5px);
    width: 34.9455px;
  }
  .libercube-study .lc-action-evidence__connector--contrast {
    left: calc(68.5417% - 0.5px);
    width: 34.9851px;
  }
  .libercube-study .lc-action-evidence__dot--expanded,
  .libercube-study .lc-action-evidence__dot--contrast {
    left: calc(68.5417% - 3px);
  }
  .libercube-study .lc-action-evidence__dot--expanded {
    top: calc(30.763% - 2.5px);
  }
  .libercube-study .lc-action-evidence__dot--contrast {
    top: calc(50.657% - 2.5px);
  }
  .libercube-study .lc-action-evidence__note--contrast {
    top: 50.657%;
  }
  .libercube-study .lc-action-evidence__dot--title {
    top: calc(38.162% - 2.5px);
    left: calc(48.4375% - 2.5px);
  }
}

@media (hover: none) {
  .portfolio-video .video-controls { opacity: 0; transform: translateY(8px); pointer-events: none; }
  .portfolio-video.controls-visible .video-controls,
  .portfolio-video:focus-within .video-controls { opacity: 1; transform: none; pointer-events: auto; }
}

@media (max-width: 680px) {
  .libercube-study .lc-insight-grid article {
    min-height: 0;
    padding: 24px;
  }
}

@media (max-width: 380px) {
  .card-meta span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .project-card { min-height: clamp(380px, 55svh, 394px); }
  .project-slot { height: clamp(394px, 57svh, 408px); }
  .card-copy { padding-top: 30px; }
  .resume-gallery { min-height: 460px; }
  .resume-statement { min-height: 430px; }
  .resume-experience-head { display: block; }
}

@media (pointer: coarse) { .cursor-orbit { display: none; } }

.libercube-study .lc-ui-preview-trigger {
  cursor: zoom-in;
}

.libercube-study .lc-ui-preview-trigger:focus-visible {
  outline: 2px solid #0877ff;
  outline-offset: 5px;
}

body.lc-ui-viewer-open {
  overflow: hidden;
}

.lc-ui-viewer {
  position: fixed;
  inset: 0;
  z-index: 180;
  display: grid;
  place-items: center;
  padding: clamp(56px, 7vw, 88px) clamp(18px, 5vw, 72px) clamp(24px, 5vw, 64px);
  background: rgba(8, 8, 8, .94);
  opacity: 0;
  transition: opacity 180ms ease;
}

.lc-ui-viewer[hidden] {
  display: none;
}

.lc-ui-viewer.is-open {
  opacity: 1;
}

.lc-ui-viewer__stage {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
}

.lc-ui-viewer__image {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .42);
  transform: scale(.985);
  transition: transform 180ms ease;
}

.lc-ui-viewer.is-open .lc-ui-viewer__image {
  transform: scale(1);
}

.lc-ui-viewer__close {
  position: fixed;
  top: max(18px, env(safe-area-inset-top));
  right: max(18px, env(safe-area-inset-right));
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: 6px;
  display: grid;
  width: 36px;
  height: 36px;
  padding: 0;
  place-items: center;
  color: #fff;
  background: rgba(18, 18, 18, .7);
  font: 700 20px/1 "Courier New", monospace;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .project-stack { padding-bottom: 0; }
  .project-slot { height: auto; margin-bottom: 24px; }
  .project-card,
  .cards-active .project-card { position: relative; inset: auto; visibility: visible; transform: none !important; }
  .site-intro { display: none; }
}
