/* The supplied ribbon is the colour signature; the page keeps its quiet palette. */
#main:focus { outline:none }
.brand { width:180px;min-height:46px;letter-spacing:normal }
.brand>img { display:block;width:100%;height:auto }
/* Keep the page's geometry stable while the sticky navigation gets lighter. */
.header { --header-height:94px;--header-compact:68px;height:var(--header-height);background:transparent;border:0;pointer-events:none;isolation:isolate }
.header::before { content:"";position:absolute;inset:0 0 auto;height:var(--header-height);z-index:-1;background:var(--paper);border-bottom:1px solid var(--line);transition:height .32s cubic-bezier(.22,1,.36,1),background-color .28s ease,border-color .28s ease,box-shadow .28s ease }
.header-inner { height:var(--header-height);pointer-events:none;transition:transform .32s cubic-bezier(.22,1,.36,1) }
.header-inner>.brand,.header-inner>.desktop-nav,.header-actions { pointer-events:auto }
.header .brand { transform-origin:left center;transition:transform .32s cubic-bezier(.22,1,.36,1) }
.header.is-scrolled::before { height:var(--header-compact);background:rgba(245,245,246,.94);border-color:rgba(170,183,176,.28);box-shadow:0 5px 24px rgba(34,42,43,.055) }
.header.is-scrolled .header-inner { transform:translateY(calc((var(--header-compact) - var(--header-height)) / 2)) }
.header.is-scrolled .brand { transform:scale(.88) }
.header .mobile-nav { position:absolute;inset:var(--header-height) 0 auto;max-height:calc(100dvh - var(--header-height));overflow-y:auto;overscroll-behavior:contain;pointer-events:auto;box-shadow:0 15px 25px #222a2b0b }
.header.is-scrolled .mobile-nav { top:var(--header-compact);max-height:calc(100dvh - var(--header-compact)) }
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .header::before { -webkit-backdrop-filter:blur(14px) saturate(1.12);backdrop-filter:blur(14px) saturate(1.12) }
  .header.is-scrolled::before { background:rgba(245,245,246,.77) }
  .menu-open .header.is-scrolled::before { background:rgba(245,245,246,.96) }
}
@media(max-width:900px) { .header { --header-height:78px;--header-compact:64px } }
@media(max-width:550px) { .header { --header-height:74px;--header-compact:62px } }
.footer .brand { width:212px;margin-bottom:23px }
.studio-wordmark { width:min(520px,85%);margin:12px auto 28px }
.studio-wordmark img { display:block;width:100%;height:auto }
.studio-statement { background:#eceee9 }
.hero-signature { display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:24px }
.hero-signature>img { width:68px;height:68px }
.brand-replay { display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:36px;padding:6px 0;background:transparent;border:0;color:var(--muted);font-size:11px;cursor:pointer }
.brand-replay:hover { color:var(--ink) }
.brand-replay>span { font-size:19px;line-height:1 }
.brand-replay[hidden] { display:none }
.footer .brand-replay { margin-top:12px }
.brand-replay:focus-visible,.brand-intro-skip:focus-visible { outline:2px solid #52647b;outline-offset:5px }
html.intro-active { overflow:hidden }
.brand-intro { position:fixed;inset:0;z-index:10000;display:grid;place-items:center;isolation:isolate;background:radial-gradient(ellipse at 50% 47%,#e6e0cf 5%,#d5ccb7 56%,#beb399 100%);opacity:1;transition:opacity .42s ease;overscroll-behavior:contain }
.brand-intro[hidden] { display:none }
.brand-intro.is-leaving { opacity:0;pointer-events:none }
.brand-intro-film { display:block;width:min(100%,2560px);height:auto;max-height:100%;object-fit:contain;pointer-events:none;mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent),linear-gradient(transparent,#000 10%,#000 90%,transparent);mask-composite:intersect }
.brand-intro-top { position:absolute;top:max(26px,env(safe-area-inset-top));left:4.5%;right:4.5%;display:flex;align-items:center;justify-content:space-between;gap:24px;color:#333933;font-size:11px;letter-spacing:.04em }
.brand-intro-top img { width:150px;height:auto }
.brand-intro-skip { position:absolute;right:4.5%;bottom:max(30px,env(safe-area-inset-bottom));display:inline-flex;align-items:center;gap:26px;min-height:48px;padding:12px 19px;color:#222a2b;background:#f5f5f6d9;border:1px solid #222a2b30;border-radius:3px;font-size:12px;cursor:pointer;transition:background .2s }
.brand-intro-skip:hover { background:#fff }
.brand-intro-skip span { font-size:18px }
.brand-intro-progress { position:absolute;inset:auto 0 0;height:2px;background:#222a2b12;overflow:hidden }
.brand-intro-progress span { display:block;width:100%;height:100%;background:#7a697f;transform:scaleX(0);transform-origin:left }
/* Progress follows the video time, including buffering and replay. */
@keyframes brand-intro-progress { to {transform:scaleX(1)} }
@media(max-aspect-ratio:4/3) {
  .brand-intro-film { mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);mask-composite:add }
}
@media(max-width:900px) { .brand { width:164px;min-height:44px } }
@media(max-width:550px) { .brand { width:143px }.footer .brand { width:188px }.hero-signature { margin-bottom:18px }.hero-signature>img { width:59px;height:59px }.brand-intro-top { top:24px;left:22px;right:22px }.brand-intro-top img { width:126px }.brand-intro-top>span { display:none }.brand-intro-skip { right:22px;bottom:max(24px,env(safe-area-inset-bottom)) }.studio-wordmark { width:min(390px,90%) } }
@media(prefers-reduced-motion:reduce) { .brand-intro,.header::before,.header-inner,.header .brand { transition:none }.brand-intro-progress { display:none } }