/* The page's original tokens, nav and CTA CSS remain canonical. */
html { scroll-behavior: auto; }
/* Transparent over the studio, including the mobile nav's default white surface. */
.nav.is-studio { background: transparent; box-shadow: none; border-bottom-color: transparent; }
.nav.is-studio a { color: #fff; }
.nav.is-studio:not(.is-hidden) { transition-delay: .18s, 0s; }
@media (prefers-reduced-motion: reduce) {
  .nav.is-studio:not(.is-hidden) { transition-delay: 0s; }
}
/* Follow the rising platform directly, without a second timed slide. */
.nav.is-studio.is-pushed {
  transform: translateY(calc(-1 * var(--nav-push) * (100% + var(--pad) + 2px)));
  transition: background-color .3s var(--ez);
}
.nav.is-studio .cell + .cell::before { background: rgba(255,255,255,.2); }

.entry-loader { display: none; }
html[data-entry] { overflow: hidden; }
html[data-entry] .entry-loader { display: grid; }
.entry-loader { position: fixed; inset: 0; z-index: 10000; background: #fff; color: #000; padding: 24px; place-items: center; opacity: 1; transition: opacity .24s ease; }
html[data-entry="leaving"] .entry-loader { opacity: 0; }
.entry-loader__panel { width: min(100%, 360px); }
.entry-loader__percent { margin-bottom: 24px; font-size: clamp(60px, 8vw, 84px); font-weight: 500; font-variant-numeric: tabular-nums; letter-spacing: -.05em; line-height: 1; }
.entry-loader__track { position: relative; height: 2px; background: #e5e5e5; overflow: hidden; }
.entry-loader__signal { position: absolute; inset: 0; background: #000; transform: scaleX(var(--entry-progress, 0)); transform-origin: left; }
@media (prefers-reduced-motion: reduce) {
  .entry-loader { transition: none; }
}
#approach { overflow-anchor: none; position: relative; z-index: 41; background: #0b0b0d; color: #fff; }
.studio-journey { height: 750svh; position: relative; }
.studio-journey.is-still, #studio-root[data-skipped="true"] .studio-journey { height: 100svh; }
.studio-stage { height: 100svh; position: sticky; top: 0; overflow: hidden; isolation: isolate; background: #0b0b0d; outline: none; }
.studio-canvas, .studio-loading { position: absolute; inset: 0; }
.studio-canvas { visibility: hidden; pointer-events: none; opacity: calc(1 - var(--studio-copy, 0)); }
.studio-stage[data-ready="true"] .studio-canvas { visibility: visible; }
.studio-canvas > div { height: 100% !important; }
.studio-loading { display: grid; place-items: center; text-align: center; background: #0b0b0d; }
.studio-loading > img { position: absolute; width: 100%; height: 100%; object-fit: contain; opacity: .3; }
.studio-loading > div { position: relative; }
.studio-loading p { font-size: var(--t-caption); margin-bottom: 1em; }
.studio-loading span { font-size: var(--t-h2); }
/* Cell 8: column 4, lower row; exactly one cell inset from its top/right. */
.studio-skip, .studio-restart, .studio-replay { position: absolute; top: calc(50% + var(--cell)); right: var(--cell); z-index: 6; font-size: var(--t-caption); line-height: 1.6; padding: 0; color: #fff; text-decoration: none; }
.studio-skip:hover, #approach button:hover { color: #3d6fc4; }
#approach button { font: inherit; font-size: var(--t-caption); border: 0; padding: 0; color: inherit; background: transparent; cursor: pointer; }
/* Cell 7: column 3, lower row; one cell inset from its bottom/left. */
.studio-explore { position: absolute; left: calc(50% + var(--cell)); bottom: var(--cell); z-index: 6; font-size: var(--t-caption); line-height: 1.6; }
.studio-endcopy { position: absolute; inset: 0; padding: clamp(100px, 14vh, 180px) clamp(24px, 7vw, 150px) 90px; display: flex; flex-direction: column; justify-content: center; opacity: var(--studio-copy, 0); visibility: hidden; background: #0009; outline: none; }
.studio-endcopy h2 { margin: 0 0 24px; font-size: var(--t-h4); line-height: 1.3; font-weight: 400; letter-spacing: -.012em; }
.studio-endcopy p { margin: 0; font-size: clamp(24px, 4.2vw, 60px); line-height: 1.1; font-weight: 500; letter-spacing: -.025em; text-wrap: balance; }
.studio-stage[data-complete="true"] .studio-endcopy { visibility: visible; }
.studio-stage[data-complete="true"] .studio-skip { visibility: hidden; }
.studio-restart { display: none; }
#studio-root[data-skipped="true"] .studio-endcopy { --studio-copy: 1; visibility: visible; }
#studio-root[data-skipped="true"] .studio-placeholder .studio-loading,
#studio-root[data-skipped="true"] .studio-placeholder .studio-skip,
#studio-root[data-skipped="true"] .studio-placeholder .studio-explore { display: none; }
#studio-root[data-skipped="true"] .studio-restart { display: block; }
.nav__jumps > a { display: flex; gap: .5ch; text-decoration: none; }
.nav__jumps .jno { opacity: .52; }
.nav__jumps > a:hover { color: var(--accent); }
.iv { opacity: 1; transform: none; }
/* Per-module grid origins prevent the studio's extra scroll distance shifting later rows. */
.hero > .grid, .card > .grid, .contact > .grid { z-index: 40; }
:focus-visible { outline: 2px solid #3d6fc4; outline-offset: 4px; }
@media (max-width: 1023px) {
  .studio-journey { height: 650svh; }
  .studio-journey.is-still { height: 100svh; }
  .studio-skip, .studio-explore, .studio-restart, .studio-replay { font-size: 12px; }
  .studio-restart, .studio-replay { top: auto; bottom: var(--cell); }
  .studio-endcopy { padding: 170px 24px 90px; }
  .studio-endcopy h2 { font-size: 18px; margin-bottom: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .studio-placeholder { height: 100svh; }
  .studio-placeholder .studio-endcopy { --studio-copy: 1; visibility: visible; }
}

/* Mobile composition: compact navigation and a readable, left-aligned close. */
@media (max-width: 1023px) {
  .nav:not(.is-paper) {
    background: transparent;
    box-shadow: none;
    border-bottom-color: rgba(255, 255, 255, .16);
  }
  .nav:not(.is-paper) a { color: #fff; }
  .nav .nav__links {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 20px;
    padding-top: 0;
  }
  .hero .cols {
    min-height: calc(100svh - var(--pad) * 2) !important;
    padding: 140px 20px 28px;
    gap: 28px;
  }
  .hero .cell { padding: 0; }
  .hero__display h1 { font-size: 15px; line-height: 1.4; color: #a6a6a6; }
  .hero__aside { gap: 28px; }
  .hero__aside .close p {
    font-size: clamp(27px, 7.4vw, 36px);
    line-height: 1.16;
    text-wrap: pretty;
    max-width: 22ch;
  }
  .hero__aside dl { gap: 4px; }
  .hero__aside .row { font-size: 13px; line-height: 1.5; }
  .hero__aside dt { flex: 0 0 44px; }
  .hero__aside dd { color: #a6a6a6; }
  .hero__cta a { font-size: 16px; min-height: 44px; display: flex; align-items: center; gap: .5ch; }

  .contact .cols { padding: 64px 20px 40px; gap: 0; min-height: 0 !important; }
  .contact .cell { padding: 0; align-self: stretch; }
  .contact__ticker { min-height: 0; margin-bottom: 48px; }
  .contact__ticker .ticker__seq { font-size: 28px; color: #707070; }
  .contact__h, .contact__lede { text-align: left; }
  .contact__h h2 { margin: 0; max-width: 20ch; font-size: clamp(28px, 8vw, 36px); line-height: 1.12; }
  .contact__lede { margin-top: 32px; }
  .contact__lede p { margin: 0; max-width: 48ch; font-size: 16px; line-height: 1.55; font-weight: 400; color: #b5b5b5; }
  .contact__cta { margin-top: 32px; margin-bottom: 48px; }
  .contact__cta a { display: flex; justify-content: space-between; align-items: center; min-height: 48px; font-size: 18px; border-bottom: 1px solid #ffffff30; }
  .contact__colophon { gap: 28px; }
  .contact__colophon .footer__name { font-size: 11px; line-height: 1.5; letter-spacing: .1em; }
  .contact__colophon .colo__mid { width: 100%; }
  .footer__nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; }
  .footer__nav a { font-size: 16px; line-height: 1.4; min-height: 44px; display: flex; align-items: center; }
  .contact__colophon .colo__bottom { gap: 0; width: 100%; }
  .contact__colophon .footer__mail { font-size: 14px; line-height: 1.5; min-height: 40px; display: flex; align-items: center; overflow-wrap: anywhere; }
  .contact .contact__c { margin-top: 40px; flex-direction: row; justify-content: space-between; align-items: center; font-size: 11px; }
  .footer__top { min-height: 44px; display: flex; align-items: center; gap: .5ch; }
}
