/* DashRev v1 refinement: loaded after dashrev.css and changes appearance only.
   The graphite hero, expanded headlines and red CTA stay the same. This file:
   1. swaps glaring white/cream areas for warm stone tones with low contrast between surfaces
   2. runs five calm blocks (dark / light / dark / light / dark) instead of eight flips
   3. limits red to actions and small signature marks
   4. raises small body text to readable sizes */

:root{
  --rf-graphite:#0E1013; --rf-graphite-2:#15181D; --rf-graphite-3:#1C2026; --rf-dark-line:#2A3038;
  --rf-stone:#E9E6E0;   /* light section ground (was #F4F2EE / white) */
  --rf-stone-2:#F1EEE9; /* raised surface on stone: cards, form */
  --rf-stone-line:#D3CEC6;
  --rf-ink:#15171B; --rf-body:#3D424A; --rf-quiet:#5F6670;
  --rf-on-dark:#E7E8EA; --rf-on-dark-soft:#B4B9C0;
  --rf-red:#E3121B; --rf-red-press:#C51018;
}
body{background:var(--rf-stone);color:var(--rf-ink)}
p{color:inherit}

/* --- Block 1: hero and brand rail share one dark field --- */
.brands{background:var(--rf-graphite);border-bottom:1px solid var(--rf-dark-line);border-top:1px solid var(--rf-dark-line)}
.brand-strip-label{color:var(--rf-on-dark-soft)!important;font-size:14px!important;letter-spacing:.02em}
.brand-logo img{opacity:.88}
.brand-logo{height:46px!important}

/* --- Block 2: upgrade options on stone --- */
.section.white,.section{background:var(--rf-stone)}
.section-head>p{color:var(--rf-body);font-size:17px!important;line-height:1.65!important}
h2{color:var(--rf-ink)}
.upgrade-option{background:var(--rf-stone-2);border:1px solid var(--rf-stone-line);border-radius:10px;box-shadow:none}
.upgrade-option>img{border-radius:10px 10px 0 0}
.option-copy>p{color:var(--rf-body);font-size:16px;line-height:1.6}
.option-price,.option-price span{color:var(--rf-quiet)}
.option-price strong{color:var(--rf-ink)!important}
.option-link{color:var(--rf-ink)!important;text-decoration:underline;text-decoration-color:var(--rf-red);text-decoration-thickness:2px;text-underline-offset:5px}
.option-link svg{stroke:var(--rf-red)}
.included-strip p{color:var(--rf-body);font-size:16px}
.included-strip svg{stroke:var(--rf-red)}
.pricing-note,.small{color:var(--rf-quiet)}

/* --- Block 3: real installs go dark, so the photos pop and the page breathes --- */
.installation-gallery{background:var(--rf-graphite-2)!important;color:var(--rf-on-dark)}
.installation-gallery h2,.installation-gallery h3{color:#F4F2EE}
.installation-gallery .section-head>p,.installation-gallery .swipe-hint,.installation-gallery .installation-status{color:var(--rf-on-dark-soft)}
.installation-heading .eyebrow{color:var(--rf-on-dark-soft)}
.installation-heading h3 span{color:var(--rf-on-dark-soft)}
.comparison-pane{background:var(--rf-graphite-3);border:1px solid var(--rf-dark-line);color:var(--rf-on-dark)}
.comparison-pane header strong{color:#F4F2EE}
.tag{background:#2A3038!important;color:#D7DADF!important;letter-spacing:.08em}
.case-features,.case-features span{color:var(--rf-on-dark-soft)}
.case-features span::before{color:var(--rf-red)}
.installation-nav button{background:var(--rf-graphite-3);color:var(--rf-on-dark);border:1px solid var(--rf-dark-line)}
.installation-nav button[aria-pressed=true]{border-color:var(--rf-red);background:#20242B}
.installation-nav small{color:var(--rf-on-dark-soft)}

/* --- Block 4: vehicle check, fleet invite and FAQ share one stone field --- */
#vehicle{padding-bottom:40px}
.lede,.enquiry-intro>p{color:var(--rf-body)}
.form-panel{background:var(--rf-stone-2);border:1px solid var(--rf-stone-line);border-radius:12px;box-shadow:none}
input,select,textarea{background:#FAF9F6;border-color:#C9C3BA}
select:disabled{background:#ECE9E3;color:#6B717A}
.manual-check,.edit{color:var(--rf-ink)}
.result{background:#F6F3EE;border-color:var(--rf-stone-line)}

/* the fleet invite becomes a dark inset panel instead of a full-width black band */
.fleet-invitation{background:var(--rf-stone)!important;padding-block:24px!important}
.fleet-invitation .wrap{background:var(--rf-graphite);color:var(--rf-on-dark);border-radius:14px;padding:40px 44px;position:relative;overflow:hidden}
.fleet-invitation .wrap::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--rf-red)}
.fleet-invitation h2{color:#F4F2EE}
.fleet-invitation .text-link{color:#F4F2EE;text-decoration-color:var(--rf-red)}

#questions{padding-top:72px}
#questions summary{font-size:18px;color:var(--rf-ink)}
#questions details{border-color:var(--rf-stone-line)}
#questions details p{color:var(--rf-body);font-size:16px;line-height:1.65}

/* --- Block 5: dark footer bookends the page --- */
.footer{background:var(--rf-graphite);border-top:0;color:var(--rf-on-dark)}
.footer .small{color:var(--rf-on-dark-soft)}
.footer .footer-links a{color:#F4F2EE!important}

/* --- Type: calmer section headings, readable body --- */
@media(min-width:1101px){
  h2{font-size:42px;letter-spacing:-1.6px;line-height:1.08}
  .fleet-invitation h2{font-size:30px}
  .section{padding-block:104px}
  .product-intro{font-size:18px}
}
.eyebrow{color:var(--rf-red);letter-spacing:.14em;text-transform:uppercase;font-size:12px;font-weight:700}
.installation-gallery .eyebrow{color:#F07C80}

/* --- Red discipline: primary actions only --- */
.btn{background:var(--rf-red)}
.btn:hover{background:var(--rf-red-press)}
.btn.secondary{background:transparent;color:var(--rf-ink);border-color:#B7B1A8}
.product-hero .btn.secondary{color:#F4F2EE;border-color:#4A5059}

@media(max-width:760px){
  .brand-logo{height:34px!important}
  .fleet-invitation .wrap{padding:28px 24px;border-radius:12px}
  .section-head>p{font-size:16px!important}
}

/* --- Hosts & fleets page: same system --- */
.audience-label,.fleet-hero .audience-label{color:var(--rf-on-dark-soft)}
.host-benefit-list article{border-top-color:var(--rf-red)}
.host-benefit-list p{color:var(--rf-body);font-size:16px;line-height:1.6}
.host-benefit-list p a,.host-benefit-list .text-link,.guide a,.enquiry-intro a{color:var(--rf-ink);text-decoration:underline;text-decoration-color:var(--rf-red);text-underline-offset:4px}
.flow-step{border-top-color:var(--rf-stone-line)}
.flow-step b{color:var(--rf-red)}
.flow-step p{color:var(--rf-body);font-size:15px;line-height:1.6}
.guide{background:var(--rf-stone-2);border:1px solid var(--rf-stone-line);border-top:3px solid var(--rf-red);border-radius:0 0 10px 10px}
.guide li,.guide p{color:var(--rf-body)}
.guide li{border-color:var(--rf-stone-line)!important}
.add-row{background:transparent;border-color:#B7B1A8;color:var(--rf-ink)}
.add-row:hover{border-color:var(--rf-red)}
.fleet-edit{background:#FAF9F6;color:var(--rf-ink);border-color:#C9C3BA}
fieldset{border-color:var(--rf-stone-line)}
/* guest-guide callout sits inside the dark installs block */
.installation-gallery .guest-guide-callout{border-top-color:var(--rf-dark-line)}
.installation-gallery .guest-guide-callout h3{color:#F4F2EE}
.installation-gallery .guest-guide-callout p{color:var(--rf-on-dark-soft)}
.installation-gallery .guest-guide-callout .btn,.installation-gallery .guest-guide-callout .btn.secondary{background:transparent;color:#F4F2EE;border:1px solid #626870}
.installation-gallery .guest-guide-callout .btn:hover{border-color:var(--rf-red)}