:root{--pl-black:#000;--pl-white:#fff;--pl-panel-gray:#c8c8c8;--pl-line-gray:#434343;--pl-corner-plus-offset:calc(-6px - 6.5px);--pl-mono:"Space Mono", monospace;--pl-display:"Bebas Neue", sans-serif}.pl-white-overlay{background:var(--pl-panel-gray);z-index:9050;pointer-events:none;opacity:1;position:fixed;inset:0}.pl-overlay{z-index:9100;pointer-events:none;visibility:hidden;flex-direction:column;display:flex;position:fixed;inset:0}.pl-overlay.active{pointer-events:all;visibility:visible}.pl-belt{background:var(--pl-panel-gray);will-change:transform;transform-origin:50%;background-clip:padding-box;flex:1;width:100%;margin-bottom:-1px;padding-bottom:1px;transform:scaleY(0)}.pl-belt:last-child{margin-bottom:0}.pl-flying-plus{z-index:9500;opacity:1;pointer-events:none;will-change:left, top, opacity, transform;width:.813rem;height:.813rem;position:fixed;transform:translate(-50%,-50%)}.pl-flying-plus svg{display:block}.pl-overlay-center{z-index:9350;contain:layout paint;pointer-events:none;visibility:hidden;perspective:800px;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pl-overlay-logo-wrap{width:clamp(10rem,22vw,17.5rem);height:clamp(10.25rem,22.3vw,17.75rem);position:relative}.pl-logo-black-box{background:var(--pl-panel-gray);z-index:0;opacity:0;will-change:transform, opacity, left, top, width, height;border:1.5px solid #0000000f;border-radius:2px;position:absolute;inset:0}.pl-logo-corner-plus{z-index:10;will-change:transform, opacity;width:.813rem;height:.813rem;position:absolute}.pl-logo-corner-plus svg{width:.813rem;height:.813rem;position:static}.pl-logo-corner-plus.tl{top:var(--pl-corner-plus-offset);left:var(--pl-corner-plus-offset)}.pl-logo-corner-plus.tr{top:var(--pl-corner-plus-offset);right:var(--pl-corner-plus-offset)}.pl-logo-corner-plus.bl{bottom:var(--pl-corner-plus-offset);left:var(--pl-corner-plus-offset)}.pl-logo-corner-plus.br{bottom:var(--pl-corner-plus-offset);right:var(--pl-corner-plus-offset)}.pl-border-svg{z-index:5;pointer-events:none;opacity:0;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.pl-t-path{opacity:0;z-index:500;will-change:transform, opacity;width:100%;height:100%;position:absolute;inset:0}.pl-overlay-page-label{text-transform:uppercase;color:var(--pl-black);opacity:0;white-space:nowrap;z-index:600;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pl-overlay-counter{opacity:0;z-index:9400;justify-content:center;align-items:center;gap:1px;display:flex;position:fixed;bottom:5rem;left:50%;transform:translate(-50%)}.pl-slot-reel{width:.75rem;height:.938rem;display:block;position:relative;overflow:hidden}.pl-slot-strip{will-change:transform;display:block}.pl-slot-digit{height:1rem;color:var(--pl-line-gray);letter-spacing:0;text-align:center;font-size:1rem;line-height:1rem;display:block}.pl-overlay-tagline{opacity:1;align-items:center;gap:.063rem;margin-top:2.5rem;display:flex}.pl-tag-word{text-transform:uppercase;color:#111;opacity:0;transition:opacity .5s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1);transform:translateY(6px)}.pl-tag-word.visible{opacity:1;transform:translateY(0)}.pl-tag-dot{color:#0000004d;opacity:0;margin:0 .5rem;font-size:1.125rem;transition:opacity .4s .15s}.pl-tag-dot.visible{opacity:1}.pl-trans-overlay{z-index:9200;pointer-events:none;visibility:hidden;flex-direction:column;display:flex;position:fixed;inset:0}.pl-trans-overlay.active{pointer-events:all;visibility:visible}.pl-trans-center{z-index:9250;pointer-events:none;visibility:hidden;perspective:800px;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pl-trans-label{text-transform:uppercase;color:#111;opacity:0;transform:translateY(6px)}

/* orthogamer-offline-reveal */
/* ── PRELOAD: gray cover + logo + counter (matches orthogamer.com) ── */
html:not([data-orthogamer-preload-done="true"]) .pl-white-overlay{
  opacity:1!important;
  display:block!important;
  visibility:visible!important;
  background:var(--pl-panel-gray)!important;
  pointer-events:all!important;
  z-index:9050!important;
  position:fixed!important;
  inset:0!important;
}
/* Page stays hidden until preload fully fades out */
html:not([data-orthogamer-preload-done="true"]) body>div:has(>main),
html:not([data-orthogamer-preload-done="true"]) body>div:has(>main)>main{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html[data-orthogamer-preload-done="true"] body>div:has(>main),
html[data-orthogamer-preload-done="true"] body>div:has(>main)>main{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
/* Hide all preload layers after the fade completes */
html[data-orthogamer-preload-done="true"] .pl-white-overlay,
html[data-orthogamer-preload-done="true"] .pl-overlay,
html[data-orthogamer-preload-done="true"] .pl-overlay-center,
html[data-orthogamer-preload-done="true"] .pl-trans-overlay,
html[data-orthogamer-preload-done="true"] .pl-trans-center,
html[data-orthogamer-preload-done="true"] .pl-overlay-counter,
html[data-orthogamer-preload-done="true"] .pl-flying-plus{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
  opacity:0!important;
}
/* Do NOT hide React's Preloader DOM — orthogamer.com's ui.js owns the real
   intro (flying pluses → T logo → counter → expand). Local boot only
   unlocks the page when that sequence finishes (or runs a fallback). */
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] main,
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .hero-section,
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #sticky-wrap,
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .site-header{pointer-events:auto!important}
/* Keep Menu/Sound inverting over light panels; leave the color logo unblended. */
#sticky-wrap{mix-blend-mode:normal!important}
#nav.site-header,
.site-header{
  mix-blend-mode:normal!important;
}
.header-controls,
#nav .header-controls,
#nav .flex.items-center.gap-2{
  mix-blend-mode:difference!important;
}
/* Hero + static SSR sections that stay invisible without the intro timeline */
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .hero-section [style*="visibility:hidden"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .hero-section [style*="visibility: hidden"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .home-about [style*="visibility:hidden"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .home-about [style*="visibility: hidden"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #vision-section [style*="visibility:hidden"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #vision-section [style*="visibility: hidden"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #keyfacts-section [style*="visibility:hidden"]:not(.awards-logo-list *),
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #keyfacts-section [style*="visibility: hidden"]:not(.awards-logo-list *){visibility:visible!important}
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .hero-section [style*="opacity:0"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .hero-section [style*="opacity: 0"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .home-about [style*="opacity:0"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] .home-about [style*="opacity: 0"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #vision-section [style*="opacity:0"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #vision-section [style*="opacity: 0"],
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #keyfacts-section [style*="opacity:0"]:not(.awards-logo-list *),
html[data-orthogamer-preload-done="true"][data-orthogamer-ready="true"] #keyfacts-section [style*="opacity: 0"]:not(.awards-logo-list *){opacity:1!important;filter:none!important}
/* Featured Learning logos cycle via GSAP opacity. Force-reveal would stack them all. */
#keyfacts-section .awards-logo-list > img{
  opacity:0;
  pointer-events:none;
}
#keyfacts-section .awards-logo-list > img:first-child{opacity:1}
/* Let GSAP/ScrollTrigger own work → services pin, video fade, and card motion */
#work-section,#orthogamer-services,#orthogamer-services video,#orthogamer-services img#c,.svc-card{filter:none}
/* Keep closed desktop menu panel from being force-shown */
#desktopMenuRef{opacity:0;visibility:hidden}
html[data-offline-menu="open"] #desktopMenuRef{opacity:1!important;visibility:visible!important;clip-path:circle(150% at 95% 5%)!important;pointer-events:auto!important}
html[data-offline-menu="open"] .menu-wrapper.fixed{opacity:1!important;visibility:visible!important;pointer-events:auto!important;display:flex!important}
/* Fallback contrast for header controls over the white menu */
html[data-offline-menu="open"] #sound-toggle,
html[data-offline-menu="open"] .main-toggle,
html[data-offline-menu="open"] .menu-toggle{
  color:#111!important;
  border-color:#111!important;
}
html[data-offline-menu="open"] #sound-toggle{
  background:rgba(17,17,17,.08)!important;
}
html[data-offline-menu="open"] .main-toggle .bg-current,
html[data-offline-menu="open"] .menu-toggle .bg-current,
html[data-offline-menu="open"] .main__humburger span{
  background-color:#111!important;
}
svg.pl-t-path{
  opacity:0!important;
  visibility:hidden!important;
}
.pl-brand-logo{
  position:absolute;
  inset:10%;
  width:80%;
  height:80%;
  object-fit:contain;
  z-index:500;
  pointer-events:none;
  opacity:0;
  transform:scale(.92);
  animation:plBrandIn .55s .35s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes plBrandIn{
  to{opacity:1;transform:scale(1)}
}
.site-header .logo img,
a.logo img{
  width:auto!important;
  height:2.75rem!important;
  max-height:3rem;
}