@font-face{font-family:'Fraunces';font-style:normal;font-weight:900;font-display:swap;src:url('/static/fonts/fraunces-900.woff2') format('woff2')}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:900;font-display:swap;src:url('/static/fonts/fraunces-italic-900.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500 800;font-display:swap;src:url('/static/fonts/plus-jakarta-sans.woff2') format('woff2')}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url('/static/fonts/space-mono-700.woff2') format('woff2')}

/* AUTO-GENERATED FROM /srv/gopenguin/brands/BRANDS.json — edit ONLY BRANDS.json then run: sudo python3 /srv/gopenguin/bin/gen_brands.py */
:root { --ink:#231815; --cream:#FFFDF9; --ink-soft:#4A3A34; --ink-line:rgba(35,24,21,0.10); --shadow:6px 6px 0 #231815; --shadow-lg:10px 10px 0 #231815; --shadow-md:4px 5px 0 #231815; }
body.brand-gopenguin { --brand-bg:#FDEBD8; --brand-acc:#FF4B72; --brand-acc2:#00B4D8; --brand-arch:#FF8533; --brand-hill:#68A357; }
body.brand-pinscore  { --brand-bg:#FBF3E4; --brand-acc:#FF4D6D; --brand-acc2:#00B4D8; --brand-arch:#FFD166; --brand-hill:#5EA853; }
body.brand-findor    { --brand-bg:#FDECE0; --brand-acc:#FF6B2B; --brand-acc2:#2563EB; --brand-arch:#FF8533; --brand-hill:#64A655; }
body.brand-reevia    { --brand-bg:#FEF2DC; --brand-acc:#E11D48; --brand-acc2:#F59E0B; --brand-arch:#F59E0B; --brand-hill:#62A354; }
body.theme-dark { --ink:#FFFDF9 !important; --cream:#1E252C !important; --brand-bg:#1E252C !important; --ink-soft:#B6B0A4 !important; --ink-line:rgba(255,253,249,0.10) !important; --shadow:6px 6px 0 #FFFDF9 !important; --shadow-lg:10px 10px 0 #FFFDF9 !important; --shadow-md:4px 5px 0 #FFFDF9 !important; }
body.brand-gopenguin, body.brand-pinscore, body.brand-findor, body.brand-reevia, body.theme-dark { font-family:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif; background:var(--brand-bg); color:var(--ink); }
.brand-mark { width:56px; height:64px; display:inline-flex; align-items:center; }
.brand-mark img, .brand-mark svg { width:100%; height:100%; display:block; }
.brand-lockup { display:inline-flex; align-items:center; gap:12px; font-family:"Fraunces","Times New Roman",serif; font-style:italic; font-weight:900; }
.brand-lockup .name { font-size:30px; line-height:1; color:var(--ink); }
.brand-eyebrow { font-family:"Space Mono",monospace; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--brand-acc); font-size:14px; }
.theme-toggle { width:44px; height:44px; border-radius:999px; background:var(--cream); border:3px solid var(--ink); box-shadow:4px 5px 0 var(--brand-acc); cursor:pointer; padding:0; display:inline-flex; align-items:center; justify-content:center; color:var(--ink); transition:transform .15s,box-shadow .15s; }
.theme-toggle:hover { transform:translate(-2px,-2px); box-shadow:6px 7px 0 var(--brand-acc); }
.theme-toggle .icon-sun { display:block; }
.theme-toggle .icon-moon { display:none; }
.theme-toggle svg { width:20px; height:20px; }
body.theme-dark .theme-toggle .icon-sun { display:none; }
body.theme-dark .theme-toggle .icon-moon { display:block; }

/* ============================================================
   Go Penguin Solutions · UNIFIED DESIGN SYSTEM · v2 (readable)
   ============================================================ */
:root {
  --ink:        #231815;
  --cream:      #FFFDF9;
  --ink-soft:   #4A3A34;
  --ink-line:   rgba(35, 24, 21, 0.10);
  --shadow:     6px 6px 0 #231815;
  --shadow-lg:  10px 10px 0 #231815;
  --shadow-md:  4px 5px 0 #231815;
}
body.brand-gopenguin { --brand-bg: #FDEBD8; --brand-acc: #FF4B72; --brand-acc2: #00B4D8; --brand-arch: #FF8533; --brand-hill: #68A357; }
body.brand-pinscore  { --brand-bg: #FBF3E4; --brand-acc: #FF4D6D; --brand-acc2: #00B4D8; --brand-arch: #FFD166; --brand-hill: #5EA853; }
body.brand-findor    { --brand-bg: #FDECE0; --brand-acc: #FF6B2B; --brand-acc2: #2563EB; --brand-arch: #FF8533; --brand-hill: #64A655; }
body.brand-reevia    { --brand-bg: #FEF2DC; --brand-acc: #E11D48; --brand-acc2: #F59E0B; --brand-arch: #F59E0B; --brand-hill: #62A354; }

/* =====================================================
   🌙 THEME DARK: full color-scheme flip
   ===================================================== */
body.theme-dark,
body.theme-dark.brand-gopenguin,
body.theme-dark.brand-pinscore,
body.theme-dark.brand-findor,
body.theme-dark.brand-reevia {
  --ink:        #FFFDF9;
  --ink-soft:   #B6B0A4;
  --cream:      #1E252C;
  --ink-line:   rgba(255, 253, 249, 0.10);
  --shadow:     6px 6px 0 #FFFDF9;
  --shadow-lg:  10px 10px 0 #FFFDF9;
  --shadow-md:  4px 5px 0 #FFFDF9;
}
body.theme-dark.brand-gopenguin,
body.theme-dark.brand-pinscore,
body.theme-dark.brand-findor,
body.theme-dark.brand-reevia {
  --brand-bg:   #0F141A;
}
body.theme-dark { background: var(--brand-bg) !important; color: var(--ink) !important; }

body.brand-gopenguin, body.brand-pinscore, body.brand-findor, body.brand-reevia,
body.theme-dark {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  background: var(--brand-bg);
  color: var(--ink);
}

/* Brand mark + lockup */
.brand-mark { width: 56px; height: 64px; display: inline-flex; align-items: center; }
.brand-mark img, .brand-mark svg { width: 100%; height: 100%; display: block; }
.brand-lockup { display: inline-flex; align-items: center; gap: 12px; font-family: 'Fraunces', 'Times New Roman', serif; font-style: italic; font-weight: 900; }
.brand-lockup .name { font-size: 30px; line-height: 1; color: var(--ink); }
.brand-eyebrow { font-family: 'Space Mono', monospace; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brand-acc); font-size: 14px; }

/* Theme toggle button */
.theme-toggle {
  width: 44px; height: 44px; border-radius: 999px; background: var(--cream); border: 3px solid var(--ink);
  box-shadow: 4px 5px 0 var(--brand-acc); cursor: pointer; padding: 0; display: inline-flex; align-items: center; justify-content: center;
  color: var(--ink); transition: transform .15s, box-shadow .15s;
}
.theme-toggle:hover { transform: translate(-2px, -2px); box-shadow: 6px 7px 0 var(--brand-acc); }
.theme-toggle .icon-sun { display: block; }
.theme-toggle .icon-moon { display: none; }
.theme-toggle svg { width: 20px; height: 20px; }
body.theme-dark .theme-toggle .icon-sun { display: none; }
body.theme-dark .theme-toggle .icon-moon { display: block; }


:root {
  --ink: #231815 !important;
  --coal: #231815 !important;
  --panel: var(--cream) !important;
  --line: rgba(35,24,21,0.10) !important;
  --silver: #FFFDF9 !important;
  --white: #FFFDF9 !important;
  --mute: #4A3A34 !important;
  --dim: #4A3A34 !important;
  --accent: var(--brand-acc) !important;
  --accent-deep: var(--brand-acc) !important;
  --accent-soft: var(--cream) !important;
  --accent2: var(--brand-acc2) !important;
  --font-display: 'Fraunces', 'Times New Roman', serif !important;
  --font-body: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  --font-mono: 'Space Mono', 'Menlo', monospace !important;
}
body { background: var(--brand-bg) !important; color: var(--ink) !important; font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important; font-weight: 500; line-height: 1.5; -webkit-font-smoothing: antialiased; position: relative; }

/* Sunrise arch: pushed even further right + thinner so the headline column stays clear */
body::before { content: "" !important; position: fixed !important; right: -38vw !important; top: -22vh !important; width: 56vw !important; height: 140vh !important; border-radius: 50% !important; background: linear-gradient(180deg, var(--brand-arch) 0%, var(--brand-acc) 60%, var(--brand-acc) 100%) !important; opacity: 0.18 !important; z-index: -1 !important; pointer-events: none !important; }
/* Green hill: clean horizon, deep below content so head/face/descriptions don't bleed */
body::after { content: "" !important; position: fixed !important; left: -16vw !important; right: -16vw !important; bottom: -34vh !important; height: 22vh !important; border-radius: 50% 50% 0 0 !important; background: var(--brand-hill) !important; border-top: 7px solid var(--ink) !important; z-index: -1 !important; pointer-events: none !important; }
body.theme-dark::after { border-top-color: var(--ink); }
body > * { position: relative; z-index: 0; }
body::before, body::after { z-index: -1 !important; }
html { background: var(--brand-bg) !important; scroll-behavior: smooth; }

::selection { background: var(--brand-acc); color: var(--cream); }
::-webkit-scrollbar-track { background: var(--brand-bg); }
::-webkit-scrollbar-thumb { background: rgba(35,24,21,0.18); border: 2px solid var(--brand-bg); }
::-webkit-scrollbar-thumb:hover { background: var(--brand-acc); }
body.theme-dark ::-webkit-scrollbar-track { background: var(--brand-bg); }
body.theme-dark ::-webkit-scrollbar-thumb { background: rgba(255,253,249,0.18); border: 2px solid var(--brand-bg); }
a { color: var(--ink); }
img { display: block; max-width: 100%; }


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .brand-h1, .section-title, .page-title, .why-title, .features-title, .pricing-title, .hero-headline, .message, .headline, .msg, .workspace-title, .dashboard-title, .stat-label, .cta-text {
  font-family: 'Fraunces', 'Times New Roman', serif !important;
  font-style: italic !important; font-weight: 900 !important;
  color: var(--ink) !important; letter-spacing: -0.02em !important;
  line-height: 1.06 !important; text-transform: none !important;
  font-size: clamp(38px, 4.6vw, 96px) !important;
  position: relative !important; z-index: 5 !important;
  text-shadow: 0 1px 0 var(--cream), 0 0 8px rgba(255,253,249,0.45) !important;
}
body.theme-dark h1, body.theme-dark h2, body.theme-dark h3, body.theme-dark h4,
body.theme-dark .brand-h1, body.theme-dark .section-title, body.theme-dark .headline {
  text-shadow: 0 1px 0 rgba(0,0,0,0.55), 0 0 12px rgba(0,0,0,0.55) !important;
}
h1.huge, .brand-h1.huge { font-size: clamp(56px, 6.4vw, 132px) !important; }
h2, .h2, .section-title, .headline { font-size: clamp(28px, 3.0vw, 64px) !important; }
.sec-head h1 { font-size: clamp(28px, 3.0vw, 64px) !important; }
h3, .h3 { font-size: clamp(20px, 1.7vw, 32px) !important; line-height: 1.18 !important; }
h3 em, .accent, .hl, .underline-accent { color: var(--brand-acc) !important; font-style: italic !important; }
p, li, span, td, th, dt, dd, label, small, div.text, .body-text, .copy, .desc, .blurb, .text-muted {
  color: var(--ink) !important; font-family: 'Plus Jakarta Sans', sans-serif !important; line-height: 1.6; font-weight: 500; opacity: 1 !important;
}
.text-muted, .muted, small, .helper { color: var(--ink-soft) !important; opacity: 1 !important; }
body.theme-dark .text-muted, body.theme-dark .muted, body.theme-dark small { color: var(--ink-soft) !important; }

.eyebrow, .kicker, .brand-eyebrow, .mono, .tag, h1 .eyebrow, h2 .eyebrow, .eyebrow-line, .label-mono {
  font-family: 'Space Mono', monospace !important; font-weight: 700 !important; letter-spacing: 0.14em !important;
  text-transform: uppercase !important; color: var(--brand-acc) !important; font-size: 13px !important;
  position: relative; z-index: 5;
}
em, .accent, .hl { color: var(--brand-acc) !important; font-style: italic !important; }
.apple-reveal { opacity: 0; transform: translateY(40px) skewY(7deg); transform-origin: 0 100% !important; transition: opacity 0.9s cubic-bezier(0.16,1,0.3,1), transform 0.9s cubic-bezier(0.16,1,0.3,1) !important; will-change: opacity, transform; }
.apple-reveal.apple-in { opacity: 1 !important; transform: translateY(0) skewY(0) !important; }
.reveal { opacity: 0; transform: translateY(34px); transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1) !important; }
.reveal.in, .reveal.revealed { opacity: 1 !important; transform: translateY(0) !important; }


.nav, header nav, .navbar, .nav-bar, .topbar, .public-nav, .lnav, .sidebar, .side-nav, .rail, aside.sidebar, .top-nav, .workspace-nav, .app-nav {
  background: rgba(255,253,249,0.92) !important;
  backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important;
  border-bottom: 4px solid var(--ink) !important;
  border-radius: 0 !important; position: relative !important; z-index: 7 !important;
}
body.theme-dark .nav, body.theme-dark .navbar, body.theme-dark .sidebar, body.theme-dark .side-nav, body.theme-dark .top-nav, body.theme-dark .workspace-nav, body.theme-dark .app-nav {
  background: rgba(31,37,44,0.92) !important;
  border-bottom-color: var(--ink) !important;
}
.nav a, header nav a, .navbar a, .nav-link, .sidebar a, .side-nav a, .rail a, .public-nav a, .nk, aside.sidebar a, .top-nav a {
  color: var(--ink) !important; font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 700 !important;
}
.asset-pill { background: var(--brand-bg) !important; border-color: var(--ink) !important; color: var(--ink) !important; }
.nav-toggle span { background: var(--ink) !important; }
.nav.scrolled, .navbar.scrolled { background: var(--cream) !important; box-shadow: 0 4px 0 var(--ink); }
body.theme-dark .nav.scrolled { background: rgba(31,37,44,0.96) !important; }
.hero-bg, .hero-overlay, .hero-grid { background: none !important; }
.hero-bg img, .hero-overlay img { display: none !important; }
.hero, section.hero, .hero-section, header.hero, .hero-bg {
  position: relative !important; overflow: visible !important; background: transparent !important; z-index: 4;
}
.hero > * { position: relative; z-index: 1; }
.brag-stage-hero, .brag-stage-feat, video.brag-unboxed-vid { position: relative !important; z-index: 5 !important; }


.btn, button:not(.theme-toggle), .btn-primary, .btn-ghost, .btn-cta, .cta-button, .button, .brand-cta, a.button, a.btn, .public-cta, .workspace-cta, .nav-cta {
  font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 800 !important; letter-spacing: 0.04em !important;
  text-transform: none !important; border-radius: 18px !important; border: 4px solid var(--ink) !important;
  padding: 14px 28px !important; cursor: pointer !important;
  transition: transform 0.15s, box-shadow 0.15s !important; position: relative; z-index: 6;
}
.btn-primary, .btn-cta, .brand-cta, a.btn:not(.btn-ghost), .btn:not(.btn-ghost), .public-cta, .workspace-cta, .nav-cta { background: var(--brand-acc) !important; color: var(--cream) !important; box-shadow: 6px 6px 0 var(--ink) !important; }
.btn-primary:hover, .brand-cta:hover, a.btn:not(.btn-ghost):hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--ink); }
.btn-ghost { background: var(--cream) !important; color: var(--ink) !important; box-shadow: 4px 5px 0 var(--brand-acc) !important; }
.btn-ghost:hover { transform: translate(-2px, -2px); box-shadow: 6px 7px 0 var(--brand-acc); }
body.theme-dark .btn-primary, body.theme-dark .brand-cta, body.theme-dark a.btn:not(.btn-ghost) { color: #0F141A !important; }
body.theme-dark .btn-ghost { color: var(--ink) !important; }
.card, .panel, .feature, .feature-card, .product, .tier, .pricing-tier, article.card, .why-card, .vc, .validation-card, .box, .slot, .kpi, .stat-card, .metric, .result-card, .info-card, .call-card, .workspace-card, .overview-card, .stats-card, .lead-card, .login-card, .auth-card, .plan-card {
  background: var(--cream) !important; border: 4px solid var(--ink) !important;
  border-radius: 22px !important; box-shadow: 8px 8px 0 var(--brand-acc) !important;
  color: var(--ink) !important; padding: 28px !important;
  transition: transform 0.2s, box-shadow 0.2s;
}
body.theme-dark .card, body.theme-dark .panel, body.theme-dark .feature, body.theme-dark .feature-card, body.theme-dark .product, body.theme-dark .tier, body.theme-dark article.card, body.theme-dark .why-card, body.theme-dark .slot, body.theme-dark .kpi, body.theme-dark .workspace-card, body.theme-dark .login-card, body.theme-dark .auth-card, body.theme-dark .plan-card {
  background: var(--cream) !important; color: var(--ink) !important; border-color: var(--ink) !important; box-shadow: 8px 8px 0 var(--brand-acc) !important;
}
body.theme-dark .stat-card, body.theme-dark .kpi { background: #252D36 !important; }
.card:hover, .panel:hover, .feature:hover, .feature-card:hover, .product:hover, .tier:hover, .pricing-tier:hover, article.card:hover, .why-card:hover, .vc:hover, .box:hover, .slot:hover, .kpi:hover, .workspace-card:hover { transform: translate(-2px, -2px); box-shadow: 10px 10px 0 var(--ink); }
.panel-coal, .section-coal, .dark, .callout, .callout-card, .shadow-card, .msg-card, .lead-card, .page-404, .empty-state, .not-found, .error-page, .no-content {
  background: var(--cream) !important; color: var(--ink) !important; border: 4px solid var(--ink) !important; border-radius: 22px !important; box-shadow: 8px 8px 0 var(--brand-acc) !important;
}
body.theme-dark .panel-coal, body.theme-dark .section-coal, body.theme-dark .dark, body.theme-dark .page-404, body.theme-dark .empty-state, body.theme-dark .not-found {
  background: var(--cream) !important; color: var(--ink) !important;
}
.feature-block, .vs-card, .testimonial, .review-card, .comparison, .pricing-table, .data-table, table.data-table, table { background: var(--cream) !important; border: 4px solid var(--ink) !important; border-radius: 22px !important; box-shadow: 8px 8px 0 var(--brand-acc) !important; color: var(--ink); }
table tbody tr:nth-child(odd) { background: var(--cream) !important; }
table tbody tr:nth-child(even) { background: rgba(35,24,21,0.04) !important; }
table th, table td { color: var(--ink) !important; }
.section, section, .section-coal, .coal-section, .dark-section { background: transparent !important; color: var(--ink); }
.section-coal .container, .coal-section .container, .dark-section .container, .panel-coal, .bg-coal, .panel-dark, .dark-bg { background: transparent !important; }


input, textarea, select, .input, .field input, .field textarea, .auth-card input, .form-control, .form-input, .otp-input, .msg-input {
  background: var(--cream) !important; color: var(--ink) !important;
  border: 3px solid var(--ink) !important; border-radius: 14px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 600 !important; padding: 12px 16px !important;
}
body.theme-dark input, body.theme-dark textarea, body.theme-dark select, body.theme-dark .auth-card input, body.theme-dark .form-control {
  background: var(--cream) !important; color: var(--ink) !important; border-color: var(--ink) !important;
}
input:focus, textarea:focus, .form-control:focus { outline: none; border-color: var(--brand-acc) !important; box-shadow: 0 0 0 4px rgba(255,75,114,0.18); }
.pill, .tag, .badge, .chip, .sticker, .stamp, .label, .status-pill { background: var(--cream) !important; color: var(--ink) !important; border: 3px solid var(--ink) !important; border-radius: 999px !important; font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 800 !important; padding: 6px 14px !important; }
body.theme-dark .pill, body.theme-dark .tag, body.theme-dark .badge, body.theme-dark .chip, body.theme-dark .status-pill { color: var(--ink) !important; }
footer, .footer, .f-bottom, site-footer, .public-footer { background: var(--cream) !important; color: var(--ink) !important; border-top: 4px solid var(--ink) !important; position: relative; z-index: 4; }
body.theme-dark footer, body.theme-dark .footer, body.theme-dark .public-footer, body.theme-dark .f-bottom { background: #13191F !important; color: var(--ink) !important; border-top-color: var(--ink) !important; }
.grain { display: none !important; }
.brand-mark { width: 56px !important; height: 64px !important; display: inline-flex !important; align-items: center; }
.brand-lockup .name { font-style: italic; font-weight: 900; font-family: 'Fraunces', serif; }
.statement, blockquote, .quote { border-left: 5px solid var(--brand-acc) !important; background: var(--cream) !important; padding: 16px 22px !important; border-radius: 0 14px 14px 0 !important; font-family: 'Fraunces', serif !important; font-style: italic !important; }
body.theme-dark .statement, body.theme-dark blockquote, body.theme-dark .quote { color: var(--ink) !important; }
.brag-floating-bar, .brag-floating-ctls, .brag-spk-btn, .brag-pill-btn { display: none !important; }
*::placeholder { color: var(--ink-soft) !important; opacity: 0.7 !important; }


/* ============================================================
   READABILITY PATCH — loaded last, after the brand-override block.
   Fixes: cream-on-cream body text, brand-orange/pink accents on
   cream (2.5-3.2:1), cream button labels on brand accent
   (2.8-3.2:1), ink-on-ink text inside ink panels, and panels that
   kept legacy dark backgrounds.
   Tokens are re-declared on body (not :root) so dark mode flips
   with --ink / --cream instead of being hard-coded.
   ============================================================ */

/* 1. Text tokens: --white/--silver/--dim/--mute were still cream
      (values meant for the old dark theme) on a cream page. */
body[data-brand-name] {
  --white:  var(--ink) !important;
  --silver: var(--ink-soft) !important;
  --dim:    var(--ink-soft) !important;
  --mute:   var(--ink-soft) !important;
  --coal:   var(--cream) !important;
  --panel:  var(--cream) !important;
}

/* 2. Per-brand accent that is legible as TEXT on the brand surface
      (brand-acc stays untouched for fills, borders, shadows). */
body.brand-gopenguin { --acc-text: #B8174F; --btn-fg: #231815; }
body.brand-pinscore { --acc-text: #BF1238; --btn-fg: #231815; }
body.brand-findor   { --acc-text: #A83A00; --btn-fg: #231815; }
body.brand-reevia   { --acc-text: #BE123C; --btn-fg: #FFFDF9; }

body.theme-dark { --acc-text: var(--brand-acc); }
body.theme-dark.brand-reevia { --acc-text: #FF6B8B; }

/* 3. Accent-coloured text: use the legible variant. */
body[data-brand-name] .kicker,
body[data-brand-name] .eyebrow,
body[data-brand-name] .brand-eyebrow,
body[data-brand-name] .mono,
body[data-brand-name] .label-mono,
body[data-brand-name] .p-tag,
body[data-brand-name] .price-tag,
body[data-brand-name] .plan-box h4,
body[data-brand-name] .p-stat strong,
body[data-brand-name] .lu-note .mono,
body[data-brand-name] .lu-note a,
body[data-brand-name] .f-bottom .mono,
body[data-brand-name] .vs-cat,
body[data-brand-name] .hero-topline .kicker,
body[data-brand-name] .accent,
body[data-brand-name] .hl,
body[data-brand-name] h3 em {
  color: var(--acc-text) !important;
}

/* 4. Solid buttons: label colour must contrast with the accent fill. */
body[data-brand-name] .btn-primary,
body[data-brand-name] .btn-cta,
body[data-brand-name] .brand-cta,
body[data-brand-name] a.btn,
body[data-brand-name] button.btn,
body[data-brand-name] .nav-cta,
body[data-brand-name] .public-cta,
body[data-brand-name] .workspace-cta,
body[data-brand-name] button[type="submit"],
body[data-brand-name] input[type="submit"] {
  color: var(--btn-fg) !important;
}

/* 5. Panels that still paint the legacy ink/dark background while
      their text is forced to ink -> ink on ink. Cream surface. */
body[data-brand-name] .stats,
body[data-brand-name] .p-stat,
body[data-brand-name] .plan-box,
body[data-brand-name] .lu-card,
body[data-brand-name] .mobile-menu,
body[data-brand-name] .cta-panel,
body[data-brand-name] .includes,
body[data-brand-name] .vs,
body[data-brand-name] .vs-row,
body[data-brand-name] .product,
body[data-brand-name] .why,
body[data-brand-name] .why-card,
body[data-brand-name] .price-card,
body[data-brand-name] .brag-stage-hero,
body[data-brand-name] .brag-stage-feat,
body[data-brand-name] pre,
body[data-brand-name] input,
body[data-brand-name] textarea,
body[data-brand-name] select {
  background: var(--cream) !important;
  background-image: none !important;
  color: var(--ink) !important;
}

body[data-brand-name] .stats,
body[data-brand-name] .p-stat,
body[data-brand-name] .plan-box,
body[data-brand-name] .lu-card,
body[data-brand-name] .cta-panel,
body[data-brand-name] .includes,
body[data-brand-name] .vs,
body[data-brand-name] .price-card,
body[data-brand-name] input,
body[data-brand-name] textarea,
body[data-brand-name] select {
  border-color: var(--ink) !important;
}

/* 6. .stat-label is caught by the huge Fraunces heading group
      (rendered 45px italic); restore it as a small mono label. */
body[data-brand-name] .stat-label {
  font-family: 'Space Mono', Menlo, monospace !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  color: var(--ink-soft) !important;
}

/* 7. Smallest mono labels were 8-9.5px. */
body[data-brand-name] .lu-card span,
body[data-brand-name] .p-stat span,
body[data-brand-name] .chip,
body[data-brand-name] .f-bottom .mono,
body[data-brand-name] .nav .name span { font-size: 11px !important; }

/* 9. Product cards repaint their own dark gradient with higher
      specificity than #5. */
body[data-brand-name] #features .product,
body[data-brand-name] #products .product,
body[data-brand-name] .product,
body[data-brand-name] .p-head,
body[data-brand-name] .p-body {
  background: var(--cream) !important;
  background-image: none !important;
  border-color: var(--ink) !important;
}

/* 10. Nav surface: keep one surface + ink text in both themes. */
body[data-brand-name] .nav,
body[data-brand-name] .navbar,
body[data-brand-name] .public-nav,
body[data-brand-name] .nav-links,
body[data-brand-name] .nav-inner {
  background: var(--cream) !important;
  border-color: var(--ink) !important;
}
body[data-brand-name] .nav a:not(.btn):not(.nav-cta),
body[data-brand-name] .nav-links a:not(.btn):not(.nav-cta),
body[data-brand-name] .brand-name b,
body[data-brand-name] .brand-name i,
body[data-brand-name] .brand-name span,
body[data-brand-name] .nav .name span {
  color: var(--ink) !important;
}

/* 11. Comparison header cell kept a dark fill in dark mode. */
body[data-brand-name] .vs-head .new,
body[data-brand-name] .vs-row .new {
  background: var(--cream) !important;
  color: var(--ink) !important;
}

/* 12. Emphasised stat digits use the brand accent. */
body[data-brand-name] .stat-num em,
body[data-brand-name] .stat-num strong {
  color: var(--acc-text) !important;
}

/* 13. Button labels: solid, ghost and their arrow spans.
       Placed after 10 so .nav a.btn keeps the button label colour. */
body[data-brand-name] .btn-ghost,
body[data-brand-name] a.btn-ghost {
  background: var(--cream) !important;
  color: var(--ink) !important;
}
body[data-brand-name] .btn span,
body[data-brand-name] .btn-primary span,
body[data-brand-name] .nav-cta span,
body[data-brand-name] a.btn:not(.btn-ghost) span,
body[data-brand-name] button.btn span {
  color: inherit !important;
}
body[data-brand-name] .btn-primary,
body[data-brand-name] .btn-cta,
body[data-brand-name] .brand-cta,
body[data-brand-name] .nav-cta,
body[data-brand-name] .public-cta,
body[data-brand-name] .workspace-cta,
body[data-brand-name] a.btn:not(.btn-ghost),
body[data-brand-name] button.btn:not(.btn-ghost) {
  color: var(--btn-fg) !important;
}


body[data-brand-name] .brand span {
  font-size: 11px !important;
  color: var(--ink-soft) !important;
}

/* 8. Skip link: sat inset -9999px with ink on accent. */
body[data-brand-name] .skip-link {
  background: var(--cream) !important;
  color: var(--ink) !important;
  border: 3px solid var(--ink) !important;
}


/* Reevia classic story-video layer */
body.brand-reevia{--story-ink:#231815;--story-paper:#FFFDF9;--story-cream:#FEF2DC;--story-coral:#E11D48}
.story-stage{position:relative;width:100%;margin:28px auto 24px;border:4px solid var(--story-ink);border-radius:22px;background:var(--story-paper);box-shadow:10px 10px 0 var(--story-coral);overflow:hidden;isolation:isolate}
.story-video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--story-cream)!important;border:0!important;border-radius:17px}

.video-toggle{position:absolute!important;right:18px!important;top:18px!important;bottom:auto!important;z-index:4!important;display:inline-flex;align-items:center;justify-content:center;min-width:132px;min-height:46px;padding:10px 16px;border:3px solid var(--story-ink)!important;border-radius:999px!important;background:var(--story-paper)!important;color:var(--story-ink)!important;font-family:'Space Mono',monospace!important;font-size:11px!important;font-weight:700!important;letter-spacing:.1em;text-transform:uppercase;box-shadow:4px 4px 0 var(--story-coral)!important;cursor:pointer}
.video-toggle:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--story-coral)!important}.video-toggle:focus-visible{outline:4px solid #00A6C7;outline-offset:4px}
.video-toggle::before{content:'Ⅱ';margin-right:8px}.video-toggle[aria-pressed="true"]::before{content:'▶'}
.product-story-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.7fr);gap:30px;align-items:start}.product-story-copy .p-feats{margin-top:18px}
.status-banner,.onboarding-card,.dashboard-grid .card,.danger-zone{box-shadow:7px 7px 0 var(--brand-acc)!important}.progress{border:2px solid var(--ink)!important;border-radius:999px!important}.progress span{background:var(--brand-acc)!important}.step-box{background:var(--cream)!important;color:var(--ink)!important;border:3px solid var(--ink)!important;border-radius:14px!important}.step-box.step-done{box-shadow:4px 4px 0 var(--brand-acc)!important}
@media(max-width:760px){.story-stage{margin-top:20px;border-width:3px;border-radius:16px;box-shadow:6px 6px 0 var(--story-coral);display:flex;flex-direction:column}.story-video{border-radius:12px}.video-toggle{position:static!important;right:auto!important;top:auto!important;bottom:auto!important;align-self:flex-start;margin:10px 12px 12px;min-width:0;min-height:40px;padding:8px 12px;font-size:9px!important;box-shadow:3px 3px 0 var(--story-coral)!important}.product-story-copy{grid-template-columns:1fr}.hero .story-stage{margin-inline:0}}
@media(prefers-reduced-motion:reduce){.story-video{object-fit:cover}.video-toggle{display:inline-flex}}

/* Auth pages: keep the classic card readable */
.auth-card h1{font-size:clamp(34px,3.4vw,54px)!important;margin-bottom:10px!important}
.auth-card .sub{color:var(--ink-soft)!important;font-size:16px!important}
.auth-card label{color:var(--ink)!important;font-size:12px!important;letter-spacing:.1em!important}
.auth-card input:not([type="checkbox"]):not([type="hidden"]){background:var(--cream)!important;color:var(--ink)!important;border:3px solid var(--ink)!important;border-radius:12px!important;padding:14px 16px!important;font-size:16px!important;font-family:'Plus Jakarta Sans',sans-serif!important;box-shadow:3px 3px 0 var(--brand-acc)!important}
.auth-card input:not([type="checkbox"]):focus{outline:3px solid var(--brand-acc)!important;outline-offset:2px!important}
.auth-card button{width:100%!important;background:var(--brand-acc)!important;color:#FFFDF9!important;font-family:'Plus Jakarta Sans',sans-serif!important;font-weight:800!important;font-size:16px!important;border:4px solid var(--ink)!important;border-radius:16px!important;padding:15px 24px!important;box-shadow:6px 6px 0 var(--ink)!important;cursor:pointer!important}
.auth-card button:hover{transform:translate(-2px,-2px)!important;box-shadow:8px 8px 0 var(--ink)!important}
.auth-card .auth-footer,.auth-card .auth-footer a{color:var(--ink)!important}
.auth-card .form-note,.auth-card .check span{color:var(--ink-soft)!important}
.auth-card .plan-box{background:var(--cream)!important;color:var(--ink)!important;border:4px solid var(--ink)!important}
.auth-card .plan-box p,.auth-card .plan-box span,.auth-card .plan-box h4{color:var(--ink)!important}

/* Flashed notices (login errors, confirmations) must never blend into the page */
.notice{background:var(--cream)!important;color:var(--ink)!important;border:3px solid var(--ink)!important;border-left:10px solid var(--brand-acc)!important;border-radius:14px!important;box-shadow:5px 5px 0 var(--brand-acc)!important;font-weight:700!important;font-size:16px!important}
.notice a{color:var(--brand-acc)!important;text-decoration:underline!important}
.auth-wrap{padding-left:16px!important;padding-right:16px!important}

/* Reevia promo band */
.promo-band{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px;align-items:center;margin-top:6px}
.promo-band .promo-media{margin:0}
.promo-video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--story-cream)!important;border:0!important;border-radius:17px}
.promo-copy .kicker{display:inline-block}
.promo-copy h2{margin:12px 0 14px}
.promo-copy p{max-width:46ch}
.promo-note{font-family:'Space Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-top:16px}
@media(max-width:860px){.promo-band{grid-template-columns:1fr;gap:22px}.promo-copy p{max-width:none}}
@media(max-width:760px){.promo-band .promo-media{border-width:3px;border-radius:16px;box-shadow:6px 6px 0 var(--story-coral)}.promo-video{border-radius:12px}}
