/* Shared text scale: keep component font sizes here, after legacy styles. */
:root {
  --text-body: 1rem;
  --text-small: .875rem;
  --text-faq: 1.125rem;
  --text-form-heading: 1.4375rem;
  --service-blue: #1255b0;
  --service-orange: #9a3412;
  --service-amber: #854d0e;
  --service-cyan: #0e6675;
  --accent-readable: var(--service-blue);
}
body[data-service="chimney"], .service-card[data-service-card="chimney"] { --accent-readable: var(--service-orange); }
body[data-service="dryer-vent"], .service-card[data-service-card="dryer-vent"] { --accent-readable: var(--service-amber); }
body[data-service="air-duct"], .service-card[data-service-card="air-duct"] { --accent-readable: var(--service-cyan); }

body, .service-content p, .service-features li, .benefit strong, .benefit p, .process-card p, .process-step p, .feature-card p, .feature-card ul, .quote-card > p, .quote-copy p, .why-copy > p, .estimate-copy > p, .estimate-point span, .faq-answer, .final-cta-copy p, .footer-description, .footer-brand p, .footer-links a, .footer-contact-item, .footer-column h3 {
  font-size: var(--text-body);
  line-height: 1.6;
}

.form-field label, .field label, .contact-option label, .form-consent label, .form-note, .lead-disclaimer, .team-signin, .footer-bottom, .service-card .text-link, .eyebrow, .section-heading .kicker, .hero-badge, .hero-proof, .hero-trust-item, .trust-bar-copy span, .trust-item span, .breadcrumb, .estimate-point strong {
  font-size: var(--text-small);
  line-height: 1.6;
}

.form-control, .control, .form-status, .btn, .header-cta, .mobile-cta .btn {
  font-size: var(--text-body);
  line-height: 1.6;
}

.faq-question {
  font-size: var(--text-faq);
  line-height: 1.6;
}

[data-lead-form] input:not([type=checkbox]):not([type=radio]), [data-lead-form] select, [data-lead-form] textarea, [data-lead-form] .form-status {
  font-size: var(--text-body);
  line-height: 1.6;
}

[data-lead-form] label, [data-lead-form] .lead-error, [data-lead-form] .contact-fieldset legend, #quote-form .form-note {
  font-size: var(--text-small);
  line-height: 1.6;
}

/* Flexible controls accommodate user text enlargement. */
[data-lead-form] input:not([type=checkbox]):not([type=radio]),
[data-lead-form] select, [data-lead-form] textarea {
  min-height: 3.125rem;
  padding: .65rem .875rem;
  line-height: 1.5;
}
[data-lead-form] select { padding-right: 2.25rem; }
[data-lead-form] textarea { min-height: 7rem; }
.btn, .header-cta { white-space: normal; padding-block: .75rem; text-align: center; }
.field, .form-field { min-width: 0; }
.service-content, .feature-card, .process-card, .process-step, .quote-card { overflow-wrap: anywhere; }

/* Reflow with the text size as well as the viewport width. */
[data-lead-form] .form-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
}
.benefits-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.benefit { grid-template-columns: 45px minmax(0, 1fr); overflow-wrap: anywhere; }
.process-grid, .feature-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.process-card, .process-step, .quote-card, .quote-copy { min-width: 0; }
.quote-copy { overflow-wrap: anywhere; }
.feature-icon { width: 3rem; height: 3rem; white-space: nowrap; }
.process-card h3 { font-size: var(--text-faq); line-height: 1.4; }
#quote .quote-card > h3 { font-size: var(--text-form-heading); line-height: 1.4; }
select.form-control {
  background-position: calc(100% - 1rem) center, calc(100% - .6875rem) center;
  background-size: .3125rem .3125rem, .3125rem .3125rem;
}

/* Opaque text surfaces keep contrast independent of decorative gradients. */
.service-card { background: #fff; }
.service-art { flex-shrink: 0; }
.service-card::after { display: none; }
.service-card .service-icon-bubble { flex: 0 0 50px; margin-bottom: 1rem; }
.section--dark .gradient-text, .section--dark .eyebrow { color: #8bd4ff; }
.final-cta-copy p { color: #fff; }
.final-cta::before, .final-cta::after { display: none; }
.estimate-point span { color: #475569; }
.quote-card .lead-consent label, .quote-card .lead-disclaimer,
.quote-card .form-consent label, .quote-card > p { color: #cbd5e1; }
.quote-card .lead-error, .quote-card .form-status.error { color: #ffb4ab; }
.quote-card .form-status.success { color: #86efac; }
.quote-card [aria-invalid=true] { border-color: #ffb4ab!important; outline-color: #ffb4ab; }
[data-lead-form] .control, [data-lead-form] .form-control,
[data-lead-form] .control:focus, [data-lead-form] .form-control:focus {
  color: #fff;
  background-color: #172d43;
}
[data-lead-form] input::placeholder, [data-lead-form] textarea::placeholder { color: #cbd5e1; opacity: 1; }
[data-lead-form] select option { background: #172d43; color: #fff; }
.service-card:focus-visible { outline-color: var(--accent-readable); }
.btn--primary:focus-visible, .btn-primary:focus-visible, .header-cta:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 7px #071426;
}

/* Header and secondary actions need readable surfaces independent of the hero media. */
.header-phone { background: var(--service-blue); color: #fff; }
.hero-actions .btn--dark-outline, .hero-actions .btn--dark-outline:hover,
.hero-actions .btn-secondary, .hero-actions .btn-secondary:hover { background: #172d43; color: #fff; }
.header-phone:focus-visible { outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 7px #071426; }

#process .section-heading .kicker { color: #8bd4ff; }

/* Unselected contact choices remain readable over the quote-card glow. */
.quote-card .contact-option label { color: #cbd5e1; }

/* Three independent services fill the desktop row after the service split. */
@media (min-width: 1101px) { .services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
