/* VirtuGrid warm theme — 27 Sep 2026
   Loaded after each page's inline <style>. Remaps the colour tokens to a warm
   cream base, keeps a dark warm hero and footer, drops the monospace labels,
   and adds the photo components. Brand cyan/violet stay; teal is darkened for
   text so every pair clears WCAG 2.2 AA. */

:root{
  --ink:#FBF6EE;      /* page background (cream) */
  --ink2:#F4EBDD;     /* alternate band (sand) */
  --paper:#FFFFFF;    /* cards */
  --line:#E6DBC9;     /* hairlines */
  --fog:#5C5347;      /* body copy, muted */
  --chalk:#1F1A14;    /* headings, strong text */
  --cyan:#0A6F64;     /* brand teal, darkened for text on cream */
  --violet:#5B3FC4;
  --sun:#F2B04A;      /* warm accent (fills only) */
  --sun-ink:#8A4B08;  /* warm accent for text */
  --shadow:0 12px 34px rgba(84,58,24,.09);
}
body{background:var(--ink);color:var(--chalk)}

/* ---------- type: softer, no code-style labels ---------- */
.eyebrow,.kicker,.step .n,.card .n,.mode .ml,.quote-sec cite,.map-tip span,.a11y-opt .state,
#usmap .stdc text,.lang,.plain li:before{font-family:"Inter",system-ui,sans-serif!important}
.eyebrow,.kicker{text-transform:none;letter-spacing:.01em;font-size:14px;font-weight:600;color:var(--sun-ink)}
.mode .ml{text-transform:none;letter-spacing:0;font-size:13.5px;font-weight:600}
.quote-sec cite{text-transform:none;letter-spacing:.02em}
.step .n,.card .n{font-size:13px;font-weight:700;color:var(--sun-ink);letter-spacing:.02em}
.lang{letter-spacing:0;color:var(--cyan)!important;border-color:rgba(10,111,100,.45)}
.lang:hover{background:rgba(10,111,100,.08)}
h1,h2,h3{color:var(--chalk)}

/* ---------- buttons: rounder, bigger, warm ---------- */
.btn{border-radius:999px;padding:12px 22px;font-size:15px}
.btn-primary{background:var(--cyan);color:#fff}
.btn-primary:hover{filter:none;background:#085a51}
.btn-ghost{border-radius:999px}
.skip{background:var(--cyan);color:#fff}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #B86A0C;outline-offset:3px}

/* ---------- nav ---------- */
nav{background:rgba(251,246,238,.94);border-bottom:1px solid var(--line)}
.nav-links{color:var(--fog)}
.nav-links a:hover{color:var(--chalk)}
.brand{color:var(--chalk)}
.a11y-btn{color:var(--cyan);border-color:rgba(10,111,100,.45)}
.a11y-panel{box-shadow:var(--shadow)}

/* ---------- hero: warm photo, dark overlay on the text side ---------- */
.hero{
  --chalk:#FFF8EE;--fog:#F1E6D6;--cyan:#FFC870;--line:rgba(255,255,255,.22);
  color:var(--chalk);
  background:
    linear-gradient(90deg,rgba(22,16,10,.92) 0%,rgba(22,16,10,.8) 42%,rgba(22,16,10,.3) 78%,rgba(22,16,10,.15) 100%),
    var(--hero-img,url(/media/photos/home-sunset-1800.jpg)) center/cover no-repeat;
  padding:96px 0 88px;
}
.hero h1,.hero h2,.hero h3{color:var(--chalk)}
.hero .eyebrow{color:#FFD697}
.hero .btn-primary{background:var(--sun);color:#231809}
.hero .btn-primary:hover{background:#FFC265}
.hero .btn-ghost{color:var(--chalk);border-color:rgba(255,255,255,.5)}
.hero .hero-motto{border-left-color:var(--sun)}
.hero .vid-frame{border-color:rgba(255,255,255,.25);box-shadow:0 18px 50px rgba(0,0,0,.35);background:#000}
@media(max-width:860px){
  .hero{background:
    linear-gradient(180deg,rgba(22,16,10,.84),rgba(22,16,10,.9)),
    var(--hero-img,url(/media/photos/home-sunset-1800.jpg)) center/cover no-repeat;}
}
/* anything form-like inside the hero gets a light card */
.hero .quiz{--chalk:#1F1A14;--fog:#5C5347;--cyan:#0A6F64;--line:#E6DBC9;--paper:#fff;--ink:#FBF6EE;color:var(--chalk);background:#fff}

/* ---------- sections and cards ---------- */
section.block{border-top:0}
section.block.alt,section.block:nth-of-type(even){background:var(--ink2)}
.step,.mode,.ben,.plain,.calc,.quiz,.card,.threeway .w,.state-pick select{background:var(--paper);border-color:var(--line);box-shadow:var(--shadow)}
.step,.mode,.ben,.plain,.calc,.card{border-radius:22px}
.ben{background:var(--paper)}
.ben .ic{color:var(--cyan)}
.mode.you{background:linear-gradient(180deg,#FFF1DB,#fff);border-color:#EBC27F}
.mode.you .ml{color:var(--sun-ink)}
.qopt{background:var(--ink);color:var(--chalk)}
.qopt:hover{border-color:var(--cyan);background:#EEF7F5}
.qfields input,.qfields select{background:#fff;color:var(--chalk);border-color:#B9AB94}
.quiz-prog{background:#EFE5D6}
.quiz-prog span{background:linear-gradient(90deg,var(--sun),var(--cyan))}
.calc-save{background:linear-gradient(135deg,#FFF1DB,#E6F4F1);border-color:#E6C38A}
.calc input[type=range]{accent-color:var(--cyan)}
.together{background:var(--ink2)}
.final{background:linear-gradient(135deg,#FFF1DB,#E6F4F1);border:0;border-radius:28px}
.plain li:before{color:var(--sun-ink)}
.qa button,.qa h3{color:var(--chalk)}

/* ---------- map ---------- */
#usmap .st path,#usmap .st circle{fill:#E7DCCB;stroke:#FBF6EE}
#usmap .st.live path,#usmap .st.live circle{fill:#1A9C8C}
#usmap .st.soon path,#usmap .st.soon circle{fill:#8E74E8}
#usmap .st:hover path,#usmap .st:focus path,#usmap .st:hover circle,#usmap .st:focus circle{fill:#F2C27A;filter:none}
#usmap .st.live:hover path,#usmap .st.live:focus path{fill:#0A6F64;filter:none}
#usmap .st.soon:hover path,#usmap .st.soon:focus path{fill:#5B3FC4;filter:none}
#usmap .stdc text{fill:var(--chalk)}
.ml-dot.live{background:#1A9C8C;box-shadow:none}
.ml-dot.soon{background:#8E74E8;box-shadow:none}
.ml-dot.wait{background:#E7DCCB;border-color:#B9AB94}
.map-tip{background:#fff;box-shadow:var(--shadow)}

/* ---------- photos ---------- */
.photo{margin:0;border-radius:22px;overflow:hidden;background:#EADFCD;box-shadow:var(--shadow)}
.photo img{display:block;width:100%;height:100%;object-fit:cover}
.photo-band{margin-top:40px;aspect-ratio:21/8}
@media(max-width:760px){.photo-band{aspect-ratio:4/3}}
.mode .mode-img{margin:-32px -32px 22px;aspect-ratio:16/9;overflow:hidden;border-radius:21px 21px 0 0}
.mode .mode-img img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:480px){.mode .mode-img{margin:-24px -24px 18px}}
.photo-quote{position:relative;background:
  linear-gradient(0deg,rgba(22,16,10,.74),rgba(22,16,10,.58)),
  url(/media/photos/family-couch-1800.jpg) center/cover no-repeat!important}
.photo-quote p,.photo-quote cite{color:#FFF8EE!important}
.photo-quote p .em{color:#FFD697!important}
.photo-quote .mark{color:#FFD697!important;opacity:.8}
.final.final-photo{background:
  linear-gradient(90deg,rgba(22,16,10,.88),rgba(22,16,10,.66)),
  url(/media/photos/family-play-1800.jpg) center 35%/cover no-repeat;
  --chalk:#FFF8EE;--fog:#F1E6D6;color:var(--chalk)}
.final.final-photo h2,.final.final-photo p{color:var(--chalk)}
.final.final-photo .kicker{color:#FFD697}
.final.final-photo .btn-primary{background:var(--sun);color:#231809}

/* ---------- compliance notes ---------- */
.rate-note{margin-top:16px;padding:14px 16px;border-radius:14px;background:#FFF7EA;border:1px solid #EBD3A8;font-size:13.5px;color:#4A3F31;line-height:1.55}
.rate-note b{color:#1F1A14}
.rate-note a{color:#0A6F64}

/* ---------- footer: warm dark ---------- */
footer{
  --chalk:#FFF8EE;--fog:#DCCFBC;--cyan:#86E4D8;--line:#3B3026;
  background:#1E1813;color:var(--fog);border-top:0}
footer .brand{color:var(--chalk)}
footer .brand .b{color:#86E4D8}
footer a{color:var(--fog)}
footer .disclaimer a{color:#86E4D8}
.foot-col a:hover{color:#FFD697}

/* keep the high-contrast accessibility option truly high-contrast */
html.a11y-contrast body,html.a11y-contrast section.block,html.a11y-contrast .together,html.a11y-contrast nav{background:#000!important}
html.a11y-contrast .step,html.a11y-contrast .mode,html.a11y-contrast .ben,html.a11y-contrast .plain,html.a11y-contrast .calc,html.a11y-contrast .quiz,html.a11y-contrast .card{background:#0b0b0b!important}
html.a11y-contrast .eyebrow,html.a11y-contrast .kicker,html.a11y-contrast .step .n{color:#ffd697}

/* links inside notes must not rely on colour alone */
.rate-note a{text-decoration:underline;text-underline-offset:2px}
/* legal pages: their inline CSS hard-codes pale body text for the old dark theme */
body > .wrap p, body > .wrap li, main.wrap p, main.wrap li{color:#3E362C}

/* equipment photo (supplied by SOLRITE) */
.photo-battery{margin-top:32px;max-width:880px;aspect-ratio:3/2;background:#e9e6e1}
.photo-battery img{object-fit:cover}
.photo-credit{margin-top:10px;font-size:12.5px;color:var(--fog)}

/* website chat widget (virtugrid-ai): no cyan/violet gradient, warm brand look, smaller on phones (27 Oct 2026) */
.vgc-btn{background:#0A6F64!important;color:#fff!important;box-shadow:0 8px 22px rgba(84,58,24,.28)!important}
.vgc-btn:hover{background:#085a51!important}
.vgc-head{background:#1E1813!important}
@media(max-width:560px){.vgc-btn{right:12px!important;bottom:12px!important;padding:10px 14px!important;font-size:13.5px!important}}