/* =============================================================
   Lighthouse homepage — light colours for the components in home.css.
   html.bx-light is the default on every page (?theme=dark on "/" removes it).
   ============================================================= */
/* Hero */
html.bx-light .bx .bx-hero { background: radial-gradient(90% 60% at 50% 0%, #E2EBFA 0%, #EFF4FB 55%, var(--bx-bg) 100%); }

/* Customers + statement */
html.bx-light .bx .bx-statement.js .w { color: #C8D0DC; }
html.bx-light .bx .bx-num { border-color: var(--bx-blue-c); }
html.bx-light .bx .bx-aud h3 { color: var(--bx-text); }
html.bx-light .bx .bx-ticks li::before {
  background: var(--bx-blue-a)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563EB' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 11px no-repeat;
}

/* How it works */
html.bx-light .bx .bx-tab b { color: #64748B; }
html.bx-light .bx .bx-tab:hover b { color: #334155; }
html.bx-light .bx .bx-tab.on b { color: var(--bx-text); }
html.bx-light .bx .bx-stage, html.bx-light .bx .bx-ev { box-shadow: 0 40px 80px -40px rgba(15, 23, 42, 0.3); }

/* Explainability */
html.bx-light .bx .bx-trust b { color: var(--bx-text); }

/* Stats */
html.bx-light .bx .bx-stats { background: linear-gradient(180deg, #fff, transparent); }
html.bx-light .bx .bx-stats .v { color: var(--bx-text); }

/* Products index */
html.bx-light .bx .bx-index .row::before { inset: 0; background: linear-gradient(90deg, rgba(37, 99, 235, 0.07), transparent 70%); }
html.bx-light .bx .bx-index .t { color: #334155; }
html.bx-light .bx .bx-index .row:hover .t { color: var(--bx-text); }
html.bx-light .bx .bx-index .go { background: #fff; }
html.bx-light .bx .bx-index .row:hover .go { background: #2563EB; border-color: #2563EB; color: #fff; }

/* Integrations */
html.bx-light .bx .bx-int { background: radial-gradient(60% 60% at 75% 50%, rgba(37, 99, 235, 0.07), transparent 70%); }
html.bx-light .bx .bx-partners a { color: var(--bx-text); text-decoration-color: rgba(37, 99, 235, 0.5); }
html.bx-light .bx .bx-partners a:hover { color: #2563EB; }
html.bx-light .bx .bx-orbit .glow { background: radial-gradient(closest-side, rgba(37, 99, 235, 0.12), transparent); }
html.bx-light .bx .orb { border-color: rgba(15, 23, 42, 0.14); }
html.bx-light .bx .orb .lo { background: #fff; border: 1px solid var(--bx-line); box-shadow: 0 14px 30px -14px rgba(15, 23, 42, 0.3); }
html.bx-light .bx .bx-orbit .hub { background: #fff; border-color: var(--bx-blue-c); box-shadow: 0 0 80px -10px rgba(37, 99, 235, 0.3); }

/* Client stories */
html.bx-light .bx .bx-quote .av { color: #fff; }
html.bx-light .bx .bx-quote figcaption b { color: var(--bx-text); }
html.bx-light .bx .bx-cases .case { background: #fff; }
html.bx-light .bx .bx-cases .case { box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04); transition: transform 0.3s var(--ease), border-color 0.25s ease, box-shadow 0.3s ease; }
html.bx-light .bx .bx-cases .case:hover { border-color: var(--bx-blue-c); box-shadow: 0 18px 36px -18px rgba(37, 99, 235, 0.35); }
html.bx-light .bx .bx-cases .m { color: var(--bx-text); }
html.bx-light .bx .bx-industries .list a:hover { color: var(--bx-text); }

/* Final CTA */
html.bx-light .bx .bx-final { background: radial-gradient(70% 90% at 15% 0%, #E2EBFA, var(--bx-bg) 70%); }

/* "Who it's for": same scroll-lit effect as dark mode — unlit words pale, lit words dark, first sentence blue.
   Lit rules repeat the html.bx-light prefix so they beat the unlit rule. */
html.bx-light .bx .bx-statement.js .w { color: #7F8CA0; }
html.bx-light .bx .bx-statement.js .w.lit { color: var(--bx-text); }
html.bx-light .bx .bx-statement.js .w.lit.g { color: #2563EB; }

/* Hero photo: fills the framed column (rail to rail), copy inset on the left, hard bottom edge */
html.bx-light .bx .bx-hero { background: var(--bx-bg); text-align: left; padding-top: var(--nav-h); }
html.bx-light .bx .bx-hero-top {
  position: relative; isolation: isolate; overflow: hidden; max-width: var(--bx-max); margin-inline: auto;
  padding-block: clamp(72px, 8vw, 120px) clamp(80px, 9vw, 136px);
}
html.bx-light .bx .bx-hero-img { display: block; position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 70% 45%; }
html.bx-light .bx .bx-hero-top::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 40%, rgba(255, 255, 255, 0) 70%);
}
html.bx-light .bx .bx-hero-in { max-width: 960px; margin-inline: 0; }
html.bx-light .bx .bx-hero .bx-ctas { justify-content: flex-start; }
html.bx-light .bx .bx-hero .bx-lead { color: #1E293B; margin-left: 0; margin-right: 0; max-width: 560px; }
html.bx-light .bx .bx-hero .bx-display { font-size: clamp(2.5rem, 1.4rem + 3.6vw, 4.5rem); line-height: 1.02; max-width: 10.5em; text-wrap: balance; }
html.bx-light .bx .bx-hero .bx-mono.gold { color: #1D4ED8; }
html.bx-light .bx .bx-hero .bx-btn.ghost { background: rgba(255, 255, 255, 0.9); }
html.bx-light .bx .bx-track img { filter: none; }
@media (max-width: 760px) {
  html.bx-light .bx .bx-hero-top::after { background: rgba(255, 255, 255, 0.7); }
}