/* Dark theme (Julian 2026-10-23: "Invert the color scheme ... match the color scheme of the most recent version of the
   launch video Sebastian sent ... the black with floating glass card aesthetic"). Matched to WERZ RC4 (10/23 08:52):
   neutral charcoal page with a soft central light, frosted glass cards with a light hairline, white/silver type, emphasis
   in white; Julian 10/23: keep the blue buttons, highlights and blue text. Loaded last; it only re-colours.
   Earlier versions: qa/2026-10-23-dark/dark_blueblack.css (blue-black), dark_rc4mono.css (all-white accents). */
:root{--ink:#eceef1;--muted:#979da6;--paper:#0c0e11;--accent:#2f8cff;--accent-dark:#1673e8;--line:rgba(255,255,255,.1);
  --glass:linear-gradient(150deg,rgba(255,255,255,.075),rgba(255,255,255,.025));--glass-border:rgba(255,255,255,.15);
  --shadow:0 34px 80px -26px rgba(0,0,0,.85),0 10px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.09);
  --glow:0 0 22px rgba(255,255,255,.35),0 0 2px rgba(255,255,255,.4);color-scheme:dark}
body{background:radial-gradient(ellipse 70% 60% at 55% 42%,rgba(255,255,255,.065),transparent 70%),radial-gradient(ellipse 45% 40% at 82% 12%,rgba(200,215,230,.035),transparent 70%),#0c0e11}
::selection{background:#2f8cff40}
:focus-visible{outline-color:#2f8cff}
.glass{backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%)}

/* Blue pill buttons (Julian 10/23: keep the blue buttons) */
:is(#original-hero,#original-closing) .oh-button-dark,:is(#original-hero,#original-closing) .oh-button-light,.inquiry-submit,.play-recording,.case-study-toggle{
  background:linear-gradient(135deg,#2f8cff,#1468d8);color:#fff;border-color:rgba(255,255,255,.22);box-shadow:0 8px 26px rgba(47,140,255,.3),inset 0 1px 0 rgba(255,255,255,.3)}
:is(#original-hero,#original-closing) .oh-button-dark:hover,:is(#original-hero,#original-closing) .oh-button-light:hover,.inquiry-submit:hover:not(:disabled),.play-recording:hover,.case-study-toggle:hover{
  background:linear-gradient(135deg,#1468d8,#0f57b9);color:#fff;box-shadow:0 10px 32px rgba(47,140,255,.4),inset 0 1px 0 rgba(255,255,255,.3)}

/* Header pill + footer */
.site-nav{border-color:rgba(255,255,255,.14);background:rgba(22,24,28,.55);box-shadow:0 14px 34px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08);-webkit-backdrop-filter:blur(18px) saturate(130%)}
.wordmark img{filter:brightness(0) invert(1);opacity:.94}
.nav-contact:hover{color:#5aa6ff}
.site-footer{color:#80868f}.site-footer>span:last-child{color:#6b7179}
.skip-link{background:#16181c;color:var(--ink)}

/* Sample cards and their recording window */
.sample-tile{background:linear-gradient(150deg,rgba(255,255,255,.075),rgba(255,255,255,.025));border-color:rgba(255,255,255,.15);box-shadow:0 34px 60px -22px rgba(0,0,0,.85),0 6px 14px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.09)}
.sample-grid:not(.is-carousel)>.sample-tile.is-hovered{box-shadow:0 46px 80px -22px rgba(0,0,0,.9),0 0 0 1px rgba(120,175,255,.35);border-color:rgba(255,255,255,.26)}
.sample-carousel.is-carousel .carousel-arrow:hover{color:#5aa6ff;box-shadow:0 16px 30px -14px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.1)}
.sample-expand{color:#d4d7dc}
.sample-viewer-frame{background:#111316}
.sample-loading{color:#80868f}
.recording-dialog{border-color:rgba(255,255,255,.15);background:linear-gradient(150deg,rgba(32,34,38,.9),rgba(14,16,19,.94));color:var(--ink);box-shadow:0 50px 150px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.05),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(28px) saturate(130%);-webkit-backdrop-filter:blur(28px) saturate(130%)}
.recording-dialog::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(16px) saturate(.8)}
.icon-button{color:#c3c7cd}.icon-button:hover{background:rgba(255,255,255,.08)}
.close-recording{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.15)}
.recording-toolbar{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.time-label{color:#979da6}
.recording-transport input{accent-color:#2f8cff}
.layer-toggle{color:#979da6}.layer-toggle[aria-pressed=true]{background:rgba(47,140,255,.16);color:#8cc2ff;border-color:rgba(47,140,255,.3)}.layer-toggle:hover{background:rgba(255,255,255,.07)}
.recording-footer{color:#80868f}.recording-footer>span:last-child{color:#6b7179}

/* Hero (its own token block) and the closing card */
:is(#original-hero,#original-closing){--ink:#eceef1;--muted:#979da6;--paper:#0c0e11;--line:rgba(255,255,255,.1);--accent:#2f8cff;--accent-dark:#1673e8;
  --glass:linear-gradient(150deg,rgba(255,255,255,.075),rgba(255,255,255,.025));--glass-border:rgba(255,255,255,.15);
  --shadow:0 34px 80px -26px rgba(0,0,0,.85),0 10px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.09)}
:is(#original-hero,#original-closing) em,#original-closing h2 em{color:#2f8cff;text-shadow:0 0 28px rgba(47,140,255,.35)}
:is(#original-hero,#original-closing) :focus-visible{outline-color:#2f8cff}
/* Hero hand (Higgsfield black-background re-render, opaque frames): black reads as the page, the hand and glow add on top */
#original-hero .oh-hero-render,#original-hero .oh-hero-sticky{mix-blend-mode:screen}  /* the sticky box isolates its content, so it screens onto the page too */
#original-hero .oh-hero-orb-one{background:radial-gradient(circle,rgba(255,255,255,.07),rgba(255,255,255,.025) 46%,transparent 70%)}
#original-hero .oh-hero-orb-two{background:radial-gradient(circle,rgba(220,228,238,.045),transparent 70%)}
#original-hero .oh-hero-orbit{border-color:rgba(255,255,255,.07)}
#original-hero .oh-hero-orbit-two{border-color:rgba(255,255,255,.05)}
#original-hero .oh-hero-progress{background:rgba(255,255,255,.1)}
#original-hero .oh-hero-progress-fill{background:linear-gradient(90deg,#5aa6ff,#2f8cff)}
#original-hero .oh-hero-bottom{color:#80868f}
#original-hero .oh-scroll-link{color:#c3c7cd}
#original-hero .oh-motion-toggle{color:#80868f}
#original-closing{background:radial-gradient(ellipse at 80% 35%,rgba(255,255,255,.07),transparent 62%),linear-gradient(130deg,rgba(255,255,255,.075),rgba(255,255,255,.025));box-shadow:var(--shadow);backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%)}

/* Case study player */
.case-study-card{border-color:rgba(255,255,255,.15);box-shadow:0 34px 80px -26px rgba(0,0,0,.85),0 10px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.09)}
.case-study-card video{background:#0c0e11}
.case-study-controls{color:var(--ink)}
.case-study-icon:hover{background:rgba(255,255,255,.08)}
.case-study-seek,.case-study-volume{accent-color:#2f8cff}
.case-study-status{color:#979da6}
.case-study-player:fullscreen{background:#0c0e11}

/* Contact page */
.inquiry-field label{color:#c3c7cd}.inquiry-field label span{color:#80868f}
.inquiry-field input,.inquiry-field select,.inquiry-field textarea{border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:var(--ink);box-shadow:inset 0 2px 5px rgba(0,0,0,.25)}
.inquiry-field select:invalid{color:#80868f}
.inquiry-field select option{color:#eceef1;background:#16181c}
.inquiry-field input::placeholder,.inquiry-field textarea::placeholder{color:#6b7179}
.inquiry-field input:focus,.inquiry-field select:focus,.inquiry-field textarea:focus{border-color:#4f9dff;background-color:rgba(255,255,255,.08)}
.inquiry-hint{color:#80868f}
.inquiry-status{color:#8cc2ff}
[data-state="error"] .inquiry-status{color:#ff8a7a}