/* WattWise Battery — single overrides layer (ww-overrides, last layer wins).
 * Palette: theme.json is the ONLY source (--ww-* tokens); zero hex below.
 * Root causes fixed here:
 * 1) .ww-block/.ww-block--hero/.ww-home-hero in ww-components cap every band
 *    at --ww-shell-width. Overrides must live in the final layer, not rely on
 *    double-class specificity (later layers always beat earlier ones).
 * 2) No background clobber on heroes: navy + gradient + wave + gold border
 *    is the design; only width/bleed/padding are re-asserted. */
@layer ww-overrides {
/* ---------- global guardrails ---------- */
html{overflow-x:clip}
body{font-family:var(--ww-font);background:var(--ww-paper);color:var(--ww-ink)}
:is(.ww-site-main,.calculator-page) :is(table){display:block;overflow-x:auto}
/* ---------- header: dark band, white links, single gold CTA ---------- */
.ww-site-header{background:var(--ww-header-surface);border-bottom:1px solid var(--ww-header-surface)}
.ww-site-header :is(a,.ww-brand,.ww-brand__wordmark){color:var(--ww-surface)}
.ww-header-cta{background:var(--ww-accent);color:var(--ww-ink);font-weight:800}
/* ---------- full-bleed contract: viewport-wide bands, 1200px content ---------- */
.ww-block--hero.ww-home-hero,
.ww-home-hero,
.ww-page-hero,
.ww-archive-intro,
.ww-calculator-intro,
.ww-content-hero,
.ww-site-footer{
	width:100vw;max-width:none;margin-inline:calc(50% - 50vw);border-radius:0;border-left:none;border-right:none}
.ww-site-footer{margin-top:32px}
/* content inside bleeds caps at 1200 */
.ww-home-hero__inner,.ww-bleed__inner{max-width:1200px;margin-inline:auto;padding-inline:32px}
.ww-page-hero__inner{max-width:var(--ww-shell-width);margin-inline:auto;padding-inline:32px}
/* Reading columns: literal-first so a dead token can never full-bleed prose.
   (Layers lose to unlayered rules, never to each other — this sits in the
   final layer with main-qualified specificity.) */
.ww-site-main > .ww-content-narrow,.ww-content-narrow{
	max-width:1200px;max-width:var(--ww-reading,1200px);
	width:100%;margin-left:auto;margin-right:auto;
	padding-left:32px;padding-right:32px;padding-bottom:80px;
	box-sizing:border-box}
.ww-shell--reading{max-width:1200px;max-width:var(--ww-reading,1200px)}
/* ---------- home hero: keep designed navy + wave, restore gold base ---------- */
.ww-block--hero.ww-home-hero,.ww-home-hero{
	display:block;width:100vw;max-width:none;margin-inline:calc(50% - 50vw);padding:0;border-radius:0;
	background-color:var(--ww-navy);
	background-image:linear-gradient(90deg,var(--ww-hero-scrim-strong) 0%,var(--ww-hero-scrim-soft) 58%,transparent 100%),url('../img/hero-wave.svg');
	background-position:center;background-size:cover;
	border-bottom:4px solid var(--ww-accent)}
.ww-home-hero h1,.ww-home-hero h2{color:var(--ww-surface)}
.ww-home-hero .ww-lede{color:color-mix(in srgb,var(--ww-surface) 84%,var(--ww-muted))}
/* Page heroes are light tint bands (base), never the dark home band:
   ink title + body-copy lede + accent-deep eyebrow. */
.ww-page-hero h1,.ww-page-hero__copy h1{color:var(--ww-ink)}
.ww-page-hero .ww-lede{color:var(--ww-body-copy);margin-left:auto;margin-right:auto;text-align:center;text-wrap:balance}
.ww-page-hero h1{text-wrap:balance}
.ww-page-hero .ww-eyebrow{color:var(--ww-accent-deep)}
.ww-eyebrow{color:var(--ww-accent-deep);font-size:0.72rem;font-weight:800;letter-spacing:0.12em;text-transform:uppercase}
.ww-home-hero .ww-eyebrow{color:var(--ww-accent)}
.ww-page-hero__media img,.ww-hero__media img{max-height:300px;object-fit:contain}
/* ---------- grids: 3 -> 2 -> 1 (card type ramp lives in ww-components) ---------- */
.ww-grid--cards,.ww-grid--guides,.ww-home-grid{display:grid;gap:24px;grid-template-columns:repeat(3,minmax(0,1fr))}
/* ---------- tables / forms ---------- */
table{width:100%;border-collapse:collapse}
th{background:var(--ww-tint);color:var(--ww-navy)}
input,select,textarea{max-width:100%}
button,.ww-button,.button{min-height:44px}
/* ---------- footer ---------- */
.ww-site-footer{background:var(--ww-tint);border-top:2px solid var(--ww-navy)}
/* ---------- responsive ---------- */
@media(max-width:1040px){.ww-site-nav{display:none}.ww-menu-toggle{display:inline-flex}}
@media(max-width:1040px){.ww-grid--cards,.ww-grid--guides,.ww-home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.ww-grid--cards,.ww-grid--guides,.ww-home-grid{grid-template-columns:minmax(0,1fr)}.ww-shell,.ww-shell--wide,.ww-site-main > .ww-content-narrow,.ww-content-narrow{padding-inline:20px}.ww-home-hero__inner,.ww-bleed__inner,.ww-page-hero__inner{padding-inline:20px}.ww-home-hero{padding-block:40px}}
}