/* release.css: every rule that stage main.css adds to or changes in production
   main.css (production main.css 2026-07-15, sha256 b4730519...; stage main.css
   2026-10-23). Loaded right after main.css on the release pages only (the
   homepage and /repair/), so production main.css stays byte-identical.
   Rules are verbatim and in stage order. Do not edit main.css for release
   pages; edit this file. */

/* ── SHARED HERO GRID BACKGROUND ──
   Dotted-grid overlay rendered on every hero. The ::before is inside the
   hero's own stacking context (hero is position:relative + overflow:hidden)
   so it CAN NOT bleed over the fixed <nav> above the hero. z-index:0 keeps
   it behind every direct child; z-index:1 lifts real content above it.
   Nav z-index is 1000 (see .nav), so even if a page miscalculates the
   stacking context the nav always wins. */
.page-hero::before,
.hp-hero::before,
.t2 .hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 40px 40px;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 70% 30%, #000 30%, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 80% at 70% 30%, #000 30%, transparent 75%);
}
.page-hero > *:not(.page-hero-glow),
.hp-hero > *,
.t2 .hero > * { position: relative; z-index: 1; }
.page-hero > .page-hero-glow { z-index: 1; }

/* ── BREADCRUMB Y NORMALIZATION ──
   Normalizes the breadcrumb first-link Y position across every page type.
   Pre-normalization: T2 hub + T3v2 + repair-root + sv-elev reported first-
   link top = Y=109; T3 + T4 + cross-ctd = Y=93. The 16px drift was flagged
   by qa-harness/header_consistency_check.py check #3. The templates have
   been updated to `padding-top:.25rem`, but this rule overrides any older
   stage/prod HTML (notably hand-maintained pages like /services/elevator-
   systems/) that still ships `padding-top:1.25rem` inline. */
nav.crumb[aria-label="Breadcrumb"],
nav.rx3-crumb[aria-label="Breadcrumb"] { padding-top: .25rem !important; }

/* ── NAV CTA ALWAYS WHITE ──
   Two competing overrides turned the "Get a Quote" button non-white:
     1. .nav-links a { color: var(--text-muted) } — only hits pages where
        the CTA sits inside .nav-links (older variant).
     2. .rx3-pg a { color: #4d9eff } — inlined on T1/T2hub-v2/T3v2 pages
        where .rx3-pg wraps the whole document including <nav>.
   Both have specificity (0,1,1). nav.nav a.btn-primary is (0,2,2) and
   wins over both in every nav markup variant (CTA inside or outside
   .nav-links, whether or not .rx3-pg wraps the page). */
nav.nav a.btn-primary,
nav.nav a.btn-primary:hover { color: #fff; }


/* .reveal + .rx-reveal: default-visible without JS; hide only when the inline
   head script set html.js (so IntersectionObserver has definitely bound).
   Fixes a bug where a JS failure left every section blank. */
.reveal, .rx-reveal { opacity: 1; transform: none; transition: opacity .6s ease, transform .6s ease; }
html.js .reveal:not(.visible), html.js .rx-reveal:not(.visible) { opacity: 0; transform: translateY(20px); }
html.js .reveal.visible, html.js .rx-reveal.visible { opacity: 1; transform: none; }

/* Repeated from main.css so the transition shorthand above does not reset
   the stagger delays (in main.css they follow .reveal). */
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }
.reveal-delay-4 { transition-delay: .4s; }

@media (prefers-reduced-motion: reduce) {
  html.js .reveal:not(.visible), html.js .rx-reveal:not(.visible),
  html.js .reveal.visible, html.js .rx-reveal.visible {
    opacity: 1; transform: none; transition: none;
  }
}

/* ── TAP TARGETS 44px (header, breadcrumb, footer, mobile action bar) ──
   Release pages only. Each link gets a 44px hit area without moving
   anything: block links add padding and take it back with negative margin;
   inline links add vertical padding, which does not affect inline layout.
   The only visible change: the mobile action bar buttons grow from 41.7px
   to 44px tall. */
nav.nav a.nav-logo { padding: 4px 0; margin: -4px 0; }
nav.nav .nav-hamburger { padding: 14px 11px; margin: -6px -3px; }
nav.nav .nav-links > a { padding: 11px 4px; margin: -11px -4px; }
nav.nav .has-dropdown > a { padding: 14px 0; }
nav[aria-label="Breadcrumb"] a { padding: 14px 6px; margin: 0 -6px; }
footer a { padding: 15px 4px; margin: 0 -4px; }
footer .footer-contact-item > a, footer .footer-bottom-links > a { display: block; padding: 13px 4px; margin: -13px -4px; }
nav.mcta a { min-height: 44px; }
