/* RTP parent theme: mirrors rooftoppowerco.com (the master) so Rooftop Power, RTP Roofing and RTP HVAC read as one company.
   Values measured from the live solar site 2026-10-02 (Roboto, #1b1e34 navy, #101a2b top bar, 8px buttons, uppercase 14px/700 labels).
   ONE thing differs per business: the accent. HVAC = warm red. (Roofing = light blue, solar = lime.) Change only the --accent* tokens below. */
:root{
  --accent:#d92d34;          /* HVAC thermostat red (white text 4.8:1) */
  --accent-hi:#ff6a70;       /* accent text on dark photo / navy */
  --accent-lo:#b8242a;       /* pressed */
  --accent-ink:#ffffff;      /* text on an accent button */
  --accent-wash:#fdeeee;     /* tinted card header */
  --topbar:#101a2b;
  --topbar-ink:#aeb6c6;
  --field-border:#e6ebf1;
  --btn-radius:8px;
  --color-action:var(--accent);
  --color-action-hi:var(--accent-hi);
  --color-action-lo:var(--accent-lo);
}

/* top utility bar (solar: phone, email, address) */
.topbar{background:var(--topbar);color:var(--topbar-ink);font-size:.78rem;line-height:1}
.topbar__row{display:flex;align-items:center;gap:26px;min-height:40px}
.topbar a,.topbar span{display:inline-flex;align-items:center;gap:8px;color:var(--topbar-ink);text-decoration:none;white-space:nowrap}
.topbar a:hover{color:#fff}
.topbar svg{width:14px;height:14px;color:var(--accent-hi);flex:none}
@media(max-width:900px){.topbar{display:none}}

/* header: uppercase nav, same rhythm as solar */
.header__row{min-height:70px}
.nav a{font-size:.8125rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.nav a:hover,.nav a[aria-current=page]{color:var(--color-mid-blue)}
.header__tel{font-size:.9063rem}
.header__cta .btn{padding:12px 22px}

/* buttons: solar shape, uppercase, soft accent glow */
.btn{border-radius:var(--btn-radius);font-size:.875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:15px 26px;min-height:0}
.btn-cta{background:var(--accent);color:var(--accent-ink);box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 40%,transparent)}
.btn-cta:hover{background:var(--accent-hi);color:var(--accent-ink)}
.btn-cta:active{background:var(--accent-lo)}
.btn-line--light{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.7)}
.btn-line{border-width:2px}

/* hero: kicker, uppercase 900 headline with the accent on the last line */
.hero__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;min-height:640px;padding-block:72px 72px;align-items:center}
.hero__copy{max-width:640px}
.hero .kick{margin:0 0 6px;font-size:clamp(1.25rem,1rem + 1vw,1.875rem);font-weight:600;letter-spacing:.02em;color:#fff;line-height:1.3;text-shadow:0 2px 24px rgba(10,12,28,.35)}
.hero h1{max-width:none;text-transform:uppercase;font-weight:900;font-size:clamp(2.5rem,1.2rem + 4.6vw,5.25rem);line-height:1;letter-spacing:-.018em}
.hero h1 .hl{display:block;color:var(--accent-hi)}
.hero .lead{max-width:48ch}

/* estimate card (solar form card: tinted head, accent rule, uppercase labels) */
.est--card{max-width:440px;justify-self:end;width:100%;padding:0;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-lg);background:#fff}
.est--card .est__head{padding:22px 26px 18px;background:var(--accent-wash);border-bottom:3px solid var(--accent)}
.est--card .est__head h2{font-size:1.3125rem;font-weight:700;letter-spacing:-.01em;margin:0 0 6px;color:var(--color-navy)}
.est--card .est__head p{margin:0;font-size:.9375rem;color:var(--color-ink-2)}
.est--card .est__body{padding:20px 26px 24px}
.field span{font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--color-navy);margin-bottom:6px}
.field span small{font-size:.6875rem;font-weight:500;letter-spacing:.05em;color:var(--color-muted);margin-left:4px}
.field input,.field select,.field textarea{min-height:48px;border:1px solid var(--field-border);border-radius:8px;box-shadow:inset 0 1px 0 rgba(0,0,0,.08);font-size:.9063rem}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);outline:3px solid color-mix(in srgb,var(--accent) 28%,transparent)}
.est--card .btn{width:100%}
.est--card .fine{text-align:center}
.hero{overflow:hidden}
.hero + .strip{padding-top:0}
@media(max-width:900px){
  .hero__grid{grid-template-columns:1fr;gap:28px;min-height:0;padding-block:40px 40px}
  .est--card{justify-self:stretch;max-width:none}
}

/* mobile call bar */
@media(max-width:700px){.callbar a+a{background:var(--accent);color:var(--accent-ink)}}

/* legal pages + form consent line */
.prose h2{font-size:1.375rem;margin:34px 0 10px}
.prose h2:first-of-type{margin-top:22px}
.prose p,.prose li{max-width:70ch}
.prose ul{margin:0 0 16px;padding-left:1.25em}
.prose li{margin-bottom:8px}
.consent{line-height:1.5;margin:6px 0 14px}