/* OCS LLC brand standards v1.1 (19 Oct 2026). Loaded LAST on every page.
 * Core: Carbon #161616, White #FFFFFF, OCS Blue #00C0DF.
 * Support: Mist #F5F6F7 (surfaces), Slate #626A70 (secondary text).
 * Type: Manrope — Regular 400 body, Medium 500 labels/buttons, Semibold 600 headings.
 * Blue is for actions and graphic accents (with Carbon labels), not small text on White. */

:root {
  --ocs-carbon: #161616;
  --ocs-white: #ffffff;
  --ocs-blue: #00C0DF;
  --ocs-mist: #F5F6F7;
  --ocs-slate: #626A70;
  --ocs-carbon-2: #1F1F1F; /* raised Carbon surface */
  --ocs-font: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ---------- Type ---------- */
html, body, button, input, select, textarea { font-family: var(--ocs-font); }
body { font-weight: 400; }
h1, h2, h3, h4, h5, h6 { font-family: var(--ocs-font) !important; font-weight: 600 !important; letter-spacing: -0.015em; }
.font-extrabold, .font-black { font-weight: 600 !important; }
b, strong { font-weight: 600; }

/* ---------- Inner pages: top bar ---------- */
.site-nav { background: var(--ocs-carbon); color: #fff; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06); }
.site-brand { font-weight: 600; letter-spacing: 0.02em; }
.nav-menu > a, .nav-drop-btn { font-weight: 500; }
.nav-menu > a:hover, .nav-drop-btn:hover { opacity: 1; color: var(--ocs-blue); }
.nav-menu > a.nav-cta {
  background: var(--ocs-blue); color: var(--ocs-carbon) !important; font-weight: 500; box-shadow: none;
}
.nav-menu > a.nav-cta:hover { background: #fff; color: var(--ocs-carbon) !important; }
.nav-phone { font-weight: 500; }
.nav-drop-panel a { color: var(--ocs-carbon); font-weight: 500; }
.nav-drop-panel a:hover { background: var(--ocs-mist); color: var(--ocs-carbon); }
@media (max-width: 900px) {
  .nav-menu { background: var(--ocs-carbon); }
  .nav-menu > a.nav-cta { margin-top: 0.6rem; justify-content: center; }
}

/* ---------- Inner pages: heroes on a Carbon field ---------- */
.hero-mini { background: var(--ocs-carbon); }
.hero-photo::before { background: linear-gradient(135deg, rgba(22, 22, 22, 0.8) 0%, rgba(22, 22, 22, 0.5) 100%); }
.hero-mini h1, .hero-photo h1 { font-weight: 600 !important; }
.trust-row span { background: rgba(255, 255, 255, 0.1); font-weight: 500; }
.hero-cta-row .tel-link, .hero-photo .tel-link { color: #fff; font-weight: 500; }
/* Primary action in a hero: Blue with a Carbon label */
.hero-photo a.bg-white, .hero-mini a.bg-white, .hero-photo .btn-white, .hero-mini .btn-white {
  background: var(--ocs-blue) !important; color: var(--ocs-carbon) !important; font-weight: 500;
}

/* ---------- Blue actions, Carbon labels ---------- */
.bg-custom-cyan { background-color: var(--ocs-blue); }
a.bg-custom-cyan, button.bg-custom-cyan, .bg-custom-cyan.text-white:is(a, button) {
  color: var(--ocs-carbon) !important; font-weight: 500;
}
a.bg-custom-cyan:hover, button.bg-custom-cyan:hover { background-color: var(--ocs-carbon); color: #fff !important; }
.text-custom-cyan { color: var(--ocs-blue); } /* icons and accents only */

/* Large blue bands become Carbon fields; footer is Carbon */
.site-footer, footer.bg-custom-cyan { background: var(--ocs-carbon) !important; color: #fff; }
.site-footer a { color: #fff; }
.site-footer a:hover { color: var(--ocs-blue); }
section.bg-custom-cyan { background: var(--ocs-carbon) !important; color: #fff; }
section.bg-custom-cyan a.bg-white, section.bg-custom-cyan .btn-white,
section.bg-custom-cyan button[type="submit"] { background: var(--ocs-blue) !important; color: var(--ocs-carbon) !important; }

.cta-box { background: var(--ocs-carbon); color: #fff; border-radius: 12px; }
.cta-box h2 { color: #fff; }
.cta-box .btn-white { background: var(--ocs-blue); color: var(--ocs-carbon); font-weight: 500; }
.cta-box .btn-white:hover { background: #fff; }
.cta-box .tel-link { color: #fff; font-weight: 500; }

/* ---------- Text links and accents on White ---------- */
.breadcrumbs { color: var(--ocs-slate); }
.breadcrumbs a, .related-card a { color: var(--ocs-carbon); text-decoration: underline; text-decoration-color: var(--ocs-blue); text-underline-offset: 3px; }
main a[style*="#00C0DF"], main a[style*="#00c0df"] { color: var(--ocs-carbon) !important; text-decoration: underline; text-decoration-color: var(--ocs-blue); text-underline-offset: 3px; }
.review-card { background: var(--ocs-mist); border-left-color: var(--ocs-blue); }
.text-gray-500, .text-gray-600 { color: var(--ocs-slate) !important; }
.bg-gray-50 { background-color: var(--ocs-mist) !important; }

/* Mobile call/text bar */
.mobile-call-bar { background: var(--ocs-carbon) !important; color: #fff !important; font-weight: 500; }

/* ---------- Homepage (dark v4 theme on a Carbon field) ---------- */
:root { --bg: var(--ocs-carbon); --bg-alt: var(--ocs-carbon-2); --cyan: var(--ocs-blue); --cyan-dark: var(--ocs-carbon); }
.hero h1 { font-weight: 600 !important; letter-spacing: -0.025em; }
/* Buttons: sentence case, Medium, Blue with a Carbon label */
.btn-primary, .nav-cta, .nav.scrolled .nav-cta, .btn-ghost-dark, .q-next, .q-reveal, .q-reserve-yes, .q-reserve-no, .mobile-bar .bar-quote {
  text-transform: none !important; letter-spacing: 0 !important; font-weight: 500 !important; font-size: 0.95rem !important;
}
.btn-primary, .nav-cta, .nav.scrolled .nav-cta, .mobile-bar .bar-quote { background: var(--ocs-blue) !important; color: var(--ocs-carbon) !important; }
.btn-primary:hover, .nav-cta:hover { background: #fff !important; color: var(--ocs-carbon) !important; }
.q-next, .q-reveal, .q-reserve-yes { background: var(--ocs-blue) !important; color: var(--ocs-carbon) !important; border-color: var(--ocs-blue) !important; }
.q-next:hover, .q-reveal:hover, .q-reserve-yes:hover:not(:disabled) { background: #fff !important; color: var(--ocs-carbon) !important; border-color: #fff !important; }
.loc-role { color: var(--ocs-carbon) !important; }
.q-progress-bar span { background: var(--ocs-blue) !important; }
.q-chip.is-active { background: var(--ocs-blue); border-color: var(--ocs-blue); color: var(--ocs-carbon); }
.q-option input:checked + .q-option-body { border-color: var(--ocs-blue); }
.q-result-price { font-weight: 600 !important; }

/* ---------- No glow: flat surfaces, no colored halos or light leaks ---------- */
:root { --cyan-glow: transparent; }
.btn-primary, .btn-primary:hover, .q-next, .q-reveal, .nav-menu > a.nav-cta, a.bg-custom-cyan, button.bg-custom-cyan,
.feature-split a, .feature-split .btn, .cta-box .btn-white, .q-option input:checked + .q-option-body {
  box-shadow: none !important;
}
.btn-primary:hover, .q-next:hover, .q-reveal:hover { transform: none !important; }
.quote-sec { background: var(--ocs-carbon) !important; }
.valley-band { background: var(--ocs-carbon-2) !important; border: 1px solid rgba(255, 255, 255, 0.08); }
.cine-line, .scroll-progress { display: none !important; }
.cine-curtain-mark, html.cine-pre .cine-curtain-mark { animation: none !important; box-shadow: none !important; }
.related-card:hover { box-shadow: none; border-color: var(--ocs-carbon); }
.vbtn { box-shadow: none !important; color: var(--ocs-carbon) !important; font-weight: 500; }
.vbtn:hover { background: var(--ocs-carbon) !important; color: #fff !important; }
.area-pin:hover { box-shadow: none; transform: none; border-color: var(--ocs-carbon); }
.stat-card .num { color: var(--ocs-carbon); }
:root { --display: var(--ocs-font); --font: var(--ocs-font); }
.v4-facts b, .rating-big, .brand-stack .brand-name, .v4-est-steps li > span, .v4-est-steps b, .v4-faq summary, .q-gate-preview .locked-price, .q-result-price, .q-gate-preview .blur-price { font-weight: 600 !important; }

/* ---------- Estimate form: dark, flat, hairline — matches the section around it ---------- */
.quote-card {
  --ink: #fff; --ink-2: #fff; --body-c: rgba(255, 255, 255, 0.82); --muted: #A3AAAE; --faint: #8A9196;
  --line: rgba(255, 255, 255, 0.16); --bg-alt: #262626; --cyan-tint: rgba(0, 192, 223, 0.08);
  background: var(--ocs-carbon-2) !important; color: var(--body-c);
  border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 0; box-shadow: none; color-scheme: dark;
}
.quote-card a { color: #fff; text-decoration: underline; text-decoration-color: var(--ocs-blue); text-underline-offset: 3px; }
.quote-card .q-label { font-weight: 600; }
.q-progress-bar { background: rgba(255, 255, 255, 0.12); height: 3px; }
.q-progress-top span { font-weight: 500; }
.q-input, .q-select, .q-textarea, .q-range-select {
  background: var(--ocs-carbon) !important; color: #fff; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 0; box-shadow: none;
}
.q-input::placeholder, .q-textarea::placeholder { color: #8A9196; }
.q-input:focus, .q-select:focus, .q-textarea:focus { border-color: var(--ocs-blue); box-shadow: none; }
.q-select option { background: var(--ocs-carbon); color: #fff; }
.q-range-select:hover { background: var(--ocs-carbon) !important; border-color: rgba(255, 255, 255, 0.4); }
.q-range-select.has-selection { border-color: var(--ocs-blue); color: #fff; }
.q-option-body { border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 0; background: transparent; }
.q-option:hover .q-option-body { border-color: rgba(255, 255, 255, 0.4); }
.q-option input:checked + .q-option-body { border-color: var(--ocs-blue); background: rgba(0, 192, 223, 0.08); box-shadow: inset 3px 0 0 var(--ocs-blue); }
.q-option-body b { font-weight: 600; }
.q-chip { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 0; font-weight: 500; }
.q-chip:hover { border-color: rgba(255, 255, 255, 0.5); }
.q-chip.is-active { background: var(--ocs-blue); border-color: var(--ocs-blue); color: var(--ocs-carbon); }
.q-check { border-radius: 0; }
.q-check:hover { background: rgba(255, 255, 255, 0.05); }
.q-back { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 0; font-weight: 500; }
.q-back:hover { border-color: #fff; color: #fff; }
.q-next, .q-reveal { border-radius: 0 !important; }
.q-reveal:disabled { background: #3A3A3A !important; color: #8A9196 !important; border-color: #3A3A3A !important; }
.q-error { background: rgba(185, 28, 28, 0.14); color: #FFB4A8; border: 1px solid rgba(255, 140, 120, 0.35); border-radius: 0; }
.q-gate-lock { background: rgba(0, 192, 223, 0.12); color: var(--ocs-blue) !important; border-radius: 0; }
.q-gate-preview { background: var(--ocs-carbon); border: 1px dashed rgba(255, 255, 255, 0.24); border-radius: 0; }
.q-gate-preview .locked-price { color: #626A70; }
.q-result-eyebrow { color: var(--ocs-blue) !important; font-weight: 500; }
.q-result-price { color: #fff; }
.q-confidence { border-radius: 0; font-weight: 500; }
.q-confidence.is-high { background: rgba(22, 163, 74, 0.16); color: #7EE2A8; }
.q-confidence.is-medium { background: rgba(0, 192, 223, 0.12); color: var(--ocs-blue); }
.q-confidence.is-review, .q-confidence.is-low { background: rgba(245, 158, 11, 0.14); color: #FCD34D; }
.q-oversize-badge { background: rgba(245, 158, 11, 0.12); border-color: rgba(245, 158, 11, 0.4); color: #FCD34D; border-radius: 0; }
.q-next-steps { background: var(--ocs-carbon); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 0; }
.q-result-ctas { border-top-color: rgba(255, 255, 255, 0.12); }
.q-result-ctas a { border-radius: 0; font-weight: 500; }
.q-result-ctas .cta-call { background: var(--ocs-blue); color: var(--ocs-carbon); }
.q-result-ctas .cta-call:hover { background: #fff; }
.q-result-ctas .cta-text { border: 1px solid rgba(255, 255, 255, 0.24); color: #fff; }
.q-result-ctas .cta-text:hover { border-color: #fff; }
.q-submit-note.ok, .q-reserve-done b { color: #7EE2A8 !important; }
.q-submit-note.err, .q-reserve-msg.err { color: #FFB4A8 !important; }
.q-reserve { background: var(--ocs-carbon); border: 1px solid var(--ocs-blue); box-shadow: inset 3px 0 0 var(--ocs-blue); }
.q-reserve-no { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 0; }
.q-reserve-no:hover { border-color: #fff; }
.q-reserve-yes, .q-reserve-no { border-radius: 0; }
.q-reserve-yes:disabled { background: #3A3A3A !important; color: #8A9196 !important; border-color: #3A3A3A !important; opacity: 1; }
.q-reserve-link { color: #fff; }
gmp-place-autocomplete { color-scheme: dark; }
.quote-card .q-result-ctas a { text-decoration: none; }