/* Preview colour refresh. Geometry, content and CTA markup stay in their modules. */
:root{--blue:var(--cr-blue-700);--deep:var(--cr-midnight);--ink:var(--cr-midnight);--graphite:var(--cr-neutral-600);--on-ink:var(--cr-neutral-300);--on-blue:var(--cr-blue-100);--line:var(--cr-neutral-200);--border:var(--cr-neutral-400)}
body{background:var(--cr-white);color:var(--cr-midnight)}
a:not(.btn):not(.logo):not(.footer-brand):not(:has(img)){text-decoration-color:currentColor;text-underline-offset:.22em}
.link,.pm-link,.roomie-section__link,.article-body a,.article-byline a,.legal a,.sci-section a:not(.btn):not(.sci-card){color:var(--cr-link);text-decoration:underline}
.link:hover,.pm-link:hover,.roomie-section__link:hover,.article-body a:hover,.article-byline a:hover{color:var(--cr-link-hover)}
:focus-visible{outline:3px solid var(--cr-blue-700);outline-offset:4px}
.btn,.nav .btn,.inline-form .btn,.nav-actions .btn,.btn[aria-busy=true]{background:var(--cr-electric-blue);color:var(--cr-midnight)}
@media(hover:hover) and (pointer:fine){.btn:not(:disabled):not([aria-disabled=true]):not([aria-busy=true]):hover{background:var(--cr-blue-400);color:var(--cr-midnight)}}
.btn:not(:disabled):not([aria-disabled=true]):not([aria-busy=true]):active{background:var(--cr-blue-300);color:var(--cr-midnight)}
.btn:disabled,.btn[aria-disabled=true]{background:var(--cr-neutral-100);color:var(--cr-neutral-600);border-color:var(--cr-neutral-400)}
.btn__signal{background:#0297DE;color:var(--cr-midnight)}
.btn:focus-visible{outline-color:var(--cr-blue-700)}
/* Secondary actions stay visibly quiet without altering their markup. */
.btn-ghost,.btn-light{background:transparent;color:var(--cr-midnight);border-color:var(--cr-neutral-400);box-shadow:none}

.home-refined .hero{background:var(--cr-midnight);color:var(--cr-white)}
.home-refined .hero-description{color:var(--cr-neutral-300)}
.home-refined .hero .o{color:#0297DE}
.hero-film{background:var(--cr-midnight);border-radius:var(--r-card)}
.hero-film video{background:var(--cr-midnight);border:1px solid var(--cr-midnight-3)}
.home-refined>.nav{background:var(--cr-midnight);color:var(--cr-white);border-color:var(--cr-midnight-3)}
.home-refined>.nav .logo img{content:url('/assets/logo/coachroom-ai-horizontal-inverse.svg')}
.home-refined>.nav .control-link,.home-refined>.nav .language-switch>summary,.home-refined>.nav .mobile-menu>summary{color:var(--cr-white)}

/* Scope the dark interaction surface to links outside the white dropdowns. */
.home-refined>.nav :is(.nav-route-links,.nav-actions)>.control-link{--control-link-hover:rgb(255 255 255 / .1)}
.home-refined>.nav :is(.nav-route-links,.nav-actions)>.control-link:is(:hover,:focus-visible,:active,[aria-current=page]){background:var(--control-link-hover);color:var(--cr-white)}
.home-refined>.nav :is(.language-switch,.mobile-menu) nav a:focus-visible{outline-color:var(--cr-blue-700)}
.home-refined>.nav .btn__signal{background:#0297DE}
.home-refined>.nav :is(.language-switch,.mobile-menu) nav{background:var(--cr-white);color:var(--cr-midnight)}
.home-refined>.nav :is(.language-switch,.mobile-menu) nav a{color:var(--cr-blue-700)}
.home-refined>.nav :focus-visible,.on-ink :focus-visible,.on-blue :focus-visible{outline-color:var(--cr-blue-400)}
.on-blue{background:var(--cr-midnight);color:var(--cr-white)}
.on-blue .lead,.on-blue .muted{color:var(--cr-neutral-300)}
.on-ink .link,.on-blue .link,.home-blog .control-link{color:var(--cr-blue-300);text-decoration:underline}
/* The lower editorial band follows the light surface direction. */
.home-blog{background:var(--cr-neutral-50);color:var(--cr-midnight);border-top-color:var(--cr-neutral-200)}
.home-blog :is(h2,h3,.home-blog-title){color:var(--cr-midnight)}
.home-blog :is(p,.home-blog-meta){color:var(--cr-neutral-600)}
.home-blog .control-link{color:var(--cr-blue-700)}
.article-body a.btn{color:var(--cr-midnight);text-decoration:none}
.home-blog{--ink:var(--cr-midnight);--graphite:var(--cr-neutral-600);--line:var(--cr-neutral-200)}
.home-blog-byline{color:var(--cr-neutral-600)}
.home-blog-byline a:focus-visible{outline-color:var(--cr-blue-700)}
.home-refined>.nav :is(.language-switch,.mobile-menu)>summary{background:var(--cr-midnight-2);border-color:var(--cr-neutral-400)}
.home-refined>.nav :is(.language-switch,.mobile-menu)>summary:hover{background:var(--cr-midnight-3)}
.roomie-section h2 span,.home-refined #invitation .o{color:#016FA3}
.sep{color:var(--cr-neutral-500)}
.stat a.doi{color:var(--cr-blue-300)}
.home-blog .o{color:#016FA3}
.d .sep{color:var(--cr-neutral-500)}
.practice-modes .pm-btn:not(.pm-ghost),.d .d-btn,.script-choice{background:var(--cr-electric-blue);color:var(--cr-midnight)}
.practice-modes .pm-btn:not(.pm-ghost):hover,.d .d-btn:hover,.script-choice:hover{background:var(--cr-blue-400);color:var(--cr-midnight)}
.sci-section .stat a.doi{color:var(--cr-blue-300)}
.practice-modes .pm-tp .vr-script-link{color:var(--cr-blue-300);text-decoration:underline}
main a.control-link,.vr-home .vr-report-link{color:var(--cr-blue-700);text-decoration:underline}
main a.control-link:hover,.vr-home .vr-report-link:hover{color:var(--cr-blue-800)}
.on-ink a.control-link,.on-blue a.control-link,.practice-modes .pm-tp a.vr-script-link{color:var(--cr-blue-300)}
/* v4 composition, with existing website copy and action markup. */
.home-refined .hero{padding-block:72px 104px}
.home-refined .hero>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:center}
.home-refined .hero-top{min-width:0}
.home-refined .hero h1{font-size:clamp(40px,4.72vw,68px);line-height:1.05;letter-spacing:-.025em;max-width:13ch}
.home-refined .hero-description{font-size:20px;line-height:1.55;margin-top:26px;max-width:42ch}
.home-refined .hero-film{margin:0;min-width:0;border:1px solid var(--cr-blue-700);border-radius:22px;overflow:hidden}
.home-refined .hero-film video{border:0;border-radius:0}
.home-refined .vr-home{background:var(--cr-neutral-50)}
/* Darker Electric Blue keeps the existing body size readable (AA). */
.home-refined .statement{background:#0275B0;color:var(--cr-white)}
.home-refined .statement :is(h2,p,.o){color:inherit}
.home-refined .founder-section{background:var(--cr-neutral-50)}
@media(max-width:1000px){
 .home-refined .hero>.wrap{gap:32px}
}
@media(max-width:767px){
 .home-refined .hero{padding-block:32px 64px}
 .home-refined .hero>.wrap{grid-template-columns:1fr;gap:36px}
 .home-refined .hero h1{font-size:40px;max-width:16ch}
 .home-refined .hero-description{font-size:17px;margin-top:24px}
 .home-refined .hero-film{border-radius:16px}
}
.home-refined .founder-section .o{color:#016FA3}
.home-refined #progress{scroll-margin-top:120px;background:transparent}

/* Responsive poster stays visible until the first video frame is playing. */
.hero-film-media{position:relative;aspect-ratio:16/9}
.hero-film-media video{display:block;width:100%;height:100%}
.hero-film-poster{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-film-poster img{display:block;width:100%;height:100%;object-fit:cover}
.hero-film-media.is-playing .hero-film-poster{visibility:hidden}
/* Signals and colored control states use the same Midnight foreground. */
.btn .btn__signal,.nav .btn .btn__signal,.invite-closing .btn .btn__signal{color:var(--cr-midnight)}
.nav .btn-invite-outline .btn__signal{background:#0297DE}
/* The invitation stays available in every viewport and at every scroll position. */
body>.nav{position:sticky;top:0;z-index:100}
.nav [data-cta-position="header"]{visibility:visible;pointer-events:auto}
/* Orange is a graphic accent; small accent text uses Midnight for AA. */
:root{--cr-accent-text:var(--cr-midnight)}
/* Exact logo orange needs a white surface for large-text AA (3.08:1). */
.home-refined :is(.founder-section,.home-blog,#invitation){background:var(--cr-white)}
.roomie-section h2 span{background:var(--cr-white)}
.roomie-section h2 span{background:transparent;color:var(--cr-midnight)}
.vr-step-number{color:var(--cr-midnight)}

/* Shared header geometry; primary colours and states come from the shared button. */
.nav .btn{border-color:transparent;box-shadow:none}
