/* Local review overlay. All paint resolves through the existing hub Design Engine. */
html[data-floating-hub] {
 --floating-edge:var(--space-6);
 --floating-top:var(--space-4);
 --floating-clearance:calc(var(--floating-top) + var(--space-8) + var(--space-16) + var(--space-6) + env(safe-area-inset-top,0px));
 scroll-padding-top:var(--floating-clearance);
}
html[data-floating-hub] body { min-height:100svh; }
.floating-hub-panel {
 position:fixed;
 top:calc(var(--floating-top) + env(safe-area-inset-top,0px));
 left:calc(var(--floating-edge) + env(safe-area-inset-left,0px));
 right:calc(var(--floating-edge) + env(safe-area-inset-right,0px));
 z-index:40;
 border:1px solid var(--line);
 border-radius:calc(var(--radius) + var(--space-2));
 background:var(--paper);
 color:var(--ink);
 box-shadow:var(--shadow-lg);
}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
 .floating-hub-panel {
  background:color-mix(in srgb,var(--paper) 68%,transparent);
  -webkit-backdrop-filter:blur(var(--space-4));
  backdrop-filter:blur(var(--space-4));
 }
}
html[data-floating-hub] .floating-hub-panel .family-bar {
 background:transparent;border:0;border-bottom:1px solid var(--line-soft);
 border-radius:inherit;
}
html[data-floating-hub] .floating-hub-panel .family-inner {
 min-height:var(--space-8);padding-inline:var(--space-5);gap:var(--space-4);
}
html[data-floating-hub] .floating-hub-panel .family-tab { min-height:var(--space-8); }
html[data-floating-hub] .floating-hub-panel .site-header {
 position:relative;top:auto;z-index:auto;background:transparent;border:0;margin:0;
}
html[data-floating-hub] .floating-hub-panel .header-inner {
 min-height:var(--space-16);padding-inline:var(--space-5);padding-block:var(--space-2);
 gap:var(--space-4);flex-wrap:nowrap;
}
html[data-floating-hub] .floating-hub-panel .header-actions {width:auto;gap:var(--space-2);}
html[data-floating-hub] .floating-hub-panel #main-nav {gap:var(--space-5);}
html[data-floating-hub] .floating-hub-panel :is(.locale,.header-theme,.menu-toggle) {color:var(--ink);}
html[data-floating-hub] .floating-hub-panel a:focus-visible,
html[data-floating-hub] .floating-hub-panel button:focus-visible {outline:2px solid var(--focus);outline-offset:2px;}
html[data-floating-hub] main {padding-top:var(--floating-clearance);}
/* Cinematic surfaces paint at the viewport edge; only their overlaid copy is inset. */
html[data-floating-hub] body:is([data-route="index"],[data-route="about"],[data-route="programs"],[data-route="app"],[data-route="grit"],[data-route="pricing"],[data-route="how"],[data-route="casper"],[data-route="medicine"],[data-route="dentistry"],[data-route="pharmacy"],[data-route="actuarial"]) main {padding-top:0;}
html[data-floating-hub] body[data-route="index"] .home-about-art h1,
html[data-floating-hub] body[data-route="programs"] .programs-banner h1 {top:var(--floating-clearance);bottom:auto;}
html[data-floating-hub] body[data-route="about"] .about-preview-title {padding-top:var(--floating-clearance);}
html[data-floating-hub] .skip:focus {position:fixed;z-index:60;top:var(--space-2);left:var(--space-2);background:var(--paper);color:var(--ink);}
@media(max-width:1100px) {
 html[data-floating-hub] .floating-hub-panel #main-nav {gap:var(--space-3);}
}
@media(max-width:1024px) {
 html[data-floating-hub] .floating-hub-panel #main-nav.is-open {
  position:absolute;top:calc(100% + var(--space-2));left:0;right:0;
  padding:var(--space-3) var(--space-5);
  border:1px solid var(--line);border-radius:var(--radius);
  background:var(--paper);box-shadow:var(--shadow-lg);gap:0;
  max-height:calc(100dvh - var(--floating-clearance) - var(--space-5) - env(safe-area-inset-bottom,0px));
  overflow-y:auto;overscroll-behavior:contain;
 }
}
@media(max-width:600px) {
 html[data-floating-hub] {--floating-edge:var(--space-2);--floating-top:var(--space-2);}
 html[data-floating-hub] .floating-hub-panel .family-inner {padding-inline:var(--space-3);gap:var(--space-2);}
 html[data-floating-hub] .floating-hub-panel .header-inner {padding-inline:var(--space-3);gap:var(--space-2);min-height:var(--space-16);}
 html[data-floating-hub] .floating-hub-panel .brand {min-height:44px;}
 html[data-floating-hub] .floating-hub-panel .brand img {width:140px;}
 html[data-floating-hub] .floating-hub-panel .header-actions {gap:0;}
 html[data-floating-hub] .floating-hub-panel .header-app {
  position:absolute;right:var(--space-3);top:calc(-1 * var(--space-8));
  margin:0;padding:var(--space-1) var(--space-2);min-height:28px;
  font-size:11px;line-height:1.4;
 }
 html[data-floating-hub] .floating-hub-panel .menu-toggle {
  position:static;min-width:44px;min-height:44px;padding:var(--space-3);
  font-size:0;gap:0;
 }
 html[data-floating-hub] .floating-hub-panel .menu-lines {flex:none;}
 html[data-floating-hub] body[data-route="index"] .home-about-art,
 html[data-floating-hub] body[data-route="programs"] .programs-banner {min-height:calc(var(--floating-clearance) + var(--space-20) + var(--space-8));}
 html[data-floating-hub] body[data-route="programs"] .programs-banner img {height:100%;min-height:inherit;object-fit:cover;}
}
@media(max-width:380px) {
 html[data-floating-hub] .floating-hub-panel .brand img {width:112px;}
 html[data-floating-hub] .floating-hub-panel .family-tab {font-size:11px;}
}
@media(prefers-reduced-transparency:reduce) {
 .floating-hub-panel {background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none;}
}
@media(prefers-reduced-motion:reduce) {
 html[data-floating-hub] {scroll-behavior:auto;}
 .floating-hub-panel,.floating-hub-panel * {animation:none;transition:none;}
}
/* These existing hero headings used the former in-flow header's height. */
html[data-floating-hub] body[data-route="app"] .app-story-stage h1 {top:var(--floating-clearance);}
html[data-floating-hub] .grit-welcome {padding-top:var(--floating-clearance);}
html[data-floating-hub][data-program-editorial] .pe-copy {top:var(--floating-clearance);}
@media(max-width:600px) {
 html[data-floating-hub] body[data-route="app"] .app-story-stage h1 {padding-top:var(--floating-clearance);}
}
/* Immersive pages retain their original transparent navigation over the scene. */
html[data-floating-hub].hiw-immersive {--floating-scene-ink:var(--hiw-header-ink);--floating-scene-paper:var(--sidebar-blue);}
html[data-floating-hub][data-program-editorial].pe-at-top {--floating-scene-ink:var(--pe-header-ink);--floating-scene-paper:var(--pe-header-paper);}
html[data-floating-hub][data-casper-editorial].ce-at-top {--floating-scene-ink:var(--floating-casper-ink,var(--ink));--floating-scene-paper:var(--floating-casper-paper,var(--paper));}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel {
 background:transparent;border-color:transparent;box-shadow:none;
 backdrop-filter:none;-webkit-backdrop-filter:none;color:var(--floating-scene-ink);
}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel .family-bar {border-color:transparent;}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel :is(a,button) {color:var(--floating-scene-ink);}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel .header-app {background:var(--floating-scene-ink);color:var(--floating-scene-paper);}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel .family-tab[aria-current=page]::after {background:currentColor;}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel #main-nav.is-open {background:var(--paper);color:var(--ink);}
html[data-floating-hub]:is(.hiw-immersive,.pe-at-top,.ce-at-top) .floating-hub-panel #main-nav.is-open a {color:var(--ink);}
/* The header is out of flow now: old negative offsets prematurely advance scenes. */
html[data-floating-hub] body[data-route="how"] .hiw-root,
html[data-floating-hub][data-program-editorial] .pe-opening,
html[data-floating-hub][data-casper-editorial] .ce-opening {margin-top:0;}
html[data-floating-hub] .pe-nav {top:var(--floating-clearance);}
html[data-floating-hub] [data-pe-panel] {scroll-margin-top:calc(var(--floating-clearance) + var(--space-16));}
html[data-floating-hub][data-casper-editorial] .ce-opening .ce-hero {height:100svh;max-height:none;margin-top:0;}
/* Opening media fills the screen rather than ending at a fixed landscape ratio. */
html[data-floating-hub] body[data-route="index"] .home-about-scene {max-width:none;}
html[data-floating-hub] body[data-route="index"] .home-about-art,
html[data-floating-hub] body[data-route="programs"] .programs-banner {height:100svh;min-height:100svh;aspect-ratio:auto;}
html[data-floating-hub] body[data-route="index"] .home-about-art :is(img,video),
html[data-floating-hub] body[data-route="programs"] .programs-banner img {height:100%;width:100%;object-fit:cover;aspect-ratio:auto;}
html[data-floating-hub] body.hiw-phone .hiw-stage {transform:translate(-50%,-50%) scale(var(--floating-hiw-fit,1));}
/* Shade the footage itself so white navigation stays legible over the window. */
html[data-floating-hub] .hiw-sticky::after {
 content:"";position:absolute;inset:0 0 auto;height:calc(var(--floating-clearance) + var(--space-20));z-index:10;pointer-events:none;
 background:linear-gradient(180deg,color-mix(in srgb,var(--sidebar-blue) 72%,transparent) 0 var(--floating-clearance),transparent);
}
@media(max-width:700px) and (orientation:portrait) {
 html[data-floating-hub][data-program-editorial] .pe-art :is(img,video) {inset:0;height:100%;}
}
/* Titles and playback controls belong inside the opening's viewport budget. */
html[data-floating-hub] body[data-route="about"] .home-about-scene,
html[data-floating-hub] body[data-route="app"] .app-story-stage {
 display:flex;flex-direction:column;height:100svh;min-height:620px;max-width:none;
}
html[data-floating-hub] body[data-route="about"] .home-about-art,
html[data-floating-hub] body[data-route="app"] .app-story-art {
 flex:1;min-height:0;max-height:none;aspect-ratio:auto;
}
html[data-floating-hub] body[data-route="about"] .home-about-art :is(img,video),
html[data-floating-hub] body[data-route="app"] .app-story-art :is(img,video) {
 position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
html[data-floating-hub] :is(.about-preview-title,.home-about-caption,.app-story-hero-footer) {flex-shrink:0;}
/* Owner fullscreen revision: the film owns the viewport; title and controls overlay it. */
html[data-floating-hub] body[data-route="about"] .home-about-scene {position:relative;display:block;height:100svh;min-height:0;}
html[data-floating-hub] body[data-route="about"] .home-about-art {height:100svh;width:100%;}
html[data-floating-hub] body[data-route="about"] .about-preview-title {
 position:absolute;z-index:3;top:calc(var(--floating-clearance) + var(--space-4));left:var(--page-gutter);
 max-width:14ch;padding:0;margin:0;color:var(--scene-ink);
 font-size:clamp(30px,3.6vw,54px);text-shadow:0 2px 16px var(--scene-surface);
}
html[data-floating-hub] body[data-route="about"] .home-about-art::after {
 display:block;inset:0;z-index:1;
 background:linear-gradient(180deg,color-mix(in srgb,var(--scene-surface) 65%,transparent),transparent 48%);
}
html[data-floating-hub] body[data-route="about"] .home-about-caption {
 position:absolute;z-index:3;bottom:max(var(--space-4),env(safe-area-inset-bottom));right:var(--space-5);padding:0;
}
html[data-floating-hub] body[data-route="about"] .home-about-caption [data-study-motion] {
 padding:var(--space-3) var(--space-4);background:color-mix(in srgb,var(--paper) 88%,transparent);
 color:var(--ink);border-radius:var(--radius-sm);
}
