/* Single entry point for the Blitz landing page (apps/web/components/landing-blitz).
One keeps the cascade deterministic: Bootstrap first, then the design's
own style.css, then the self-hosted Dazzed faces. Loaded by the landing page
component only, so /chat-v2, /preview and /dashboard never see it. */
@import url("bootstrap.min.css");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url("style.css");
@import url("showreel.css");
@import url("../fonts/stylesheet.css");
/* apps/web/app/globals.css paints dark for the app routes, and the
landing page is light, so the surface still has to be reclaimed on
itself — a wrapper cannot repaint the canvas behind it. This is the one rule
here that is deliberately global; it is harmless on other routes because
navigation away from the landing page is a full document load (see the
comment on the CTA in landing-blitz.tsx), so this stylesheet is gone by then.
The page wash and grid now hang off .blitz-landing, not body. */
body {
background: var(--page-bg) !important;
color: var(--text) !important;
}
/* Tailwind v4 (app/globals.css) emits utilities whose names collide with the
Bootstrap classes this design is built on: `.collapse` becomes
visibility:collapse (which blanked the whole navbar), `.container` picks up
Tailwind's breakpoint max-widths, and `.w-100`/`.h-100` mean 25rem rather
than 100%. globals.css is bundled by Next and lands after this file, so
source order can't settle it — restore Bootstrap's meaning explicitly.
Scoped under .blitz-landing: this file used to assume "only the landing page
loads landing.css", which was wrong — React hoists the into and
keeps it there for the whole session, so a client-side hop to /chat-v2 took
Bootstrap's .container/.w-100/.h-100 with it. */
.blitz-landing .collapse {
visibility: visible !important;
}
.blitz-landing .container {
max-width: 1180px !important;
}
.blitz-landing .w-100 {
width: 100% !important;
}
.blitz-landing .h-100 {
height: 100% !important;
}
.blitz-landing .gap-3 {
gap: 1rem !important;
}
/* Scroll-spy state (useActiveSection in landing-blitz.tsx). style.css only
styles .nav-link and its :hover, so the active section's link needs its own
rule — same accent as hover, plus a short underline so it reads as "you are
here" rather than "your cursor is here". */
.blitz-landing .navbar-nav .nav-link.active {
color: var(--main-color);
position: relative;
}
.blitz-landing .navbar-nav .nav-link.active::after {
content: "";
position: absolute;
left: 9px;
right: 9px;
bottom: 2px;
height: 2px;
border-radius: 2px;
background: var(--main-color);
}