/* quickscene.css — QuickScene's per-site stylesheet (Oct 19 2026).
 *
 * Loaded ONLY on the quickscene deploy: site_config row css_file = "/quickscene.css"
 * → the root layout renders <link rel="stylesheet" href="/quickscene.css">.
 * FullRender has css_file = null and never loads this file.
 *
 * It is applied AFTER the app's compiled Tailwind/globals bundle, so anything
 * here overrides the FullRender look for QuickScene only. Empty of rules on
 * purpose for now (Steven: "site looks good … so we can change how things look
 * more later") — add QuickScene-specific overrides here when the time comes,
 * e.g. brand color (site_config brand_color_primary is #0E7C66):
 *
 *   :root { --qs-brand: #0E7C66; }
 *   .btn-pill-purple { background: var(--qs-brand); }
 */

/* ── Hero headline −6px (Oct 19 2026 — Steven: "Ultra-Realistic Video In Just a
 * Minute reduce size by 6px"). FullRender sizes: 30px under 640px (28px on the
 * compact landing variant), Tailwind text-[44px] from 640px, text-[50px] from
 * 768px. The leading `html` raises specificity above globals.css's !important
 * rules so this wins regardless of stylesheet order. */
@media (max-width: 639.98px) {
  html section.hero-section-mp4 .hero-copy-col .hero-h1 { font-size: 24px !important; }
  html section.hero-section-mp4 .hero-copy-col .hero-h1.hero-h1--compact { font-size: 22px !important; }
}
@media (min-width: 640px) and (max-width: 767.98px) {
  html section.hero-section-mp4 .hero-copy-col .hero-h1 { font-size: 38px !important; }
}
@media (min-width: 768px) {
  html section.hero-section-mp4 .hero-copy-col .hero-h1 { font-size: 44px !important; }
}
