@charset "UTF-8";
/* FURNACE REPAIR — page layer (W16). Safety-first hero and card are preserved exactly (site.css);
   this layer restores authority AFTER safety: warm symptom field, photo band, dark heat decision band. */

.svc-fr .fr-hero h1 { font-weight: 850; letter-spacing: -0.035em; }

/* "No safety emergency" strip — first CTA, stays after safety */
.svc-fr .fr-after { padding: 0 0 88px; }
.svc-fr .after-strip { border: 0; border-left: 6px solid var(--heat); background: var(--p-warm); border-radius: 14px; padding: 26px 32px; }
.svc-fr .after-strip h2 { font-size: 1.55rem; }
.svc-fr .after-strip p { color: var(--p-sub); }

/* Symptoms + furnace diagram on a warm field */
.svc-fr .fr-problems { background: var(--p-warm); padding: 104px 0; }
.svc-fr .fr-problems .sec-head { max-width: 820px; }
.svc-fr .fr-diagram { background: #fff; border-radius: 18px; padding: 28px; box-shadow: 0 1px 2px rgba(23,33,58,.05); }
.svc-fr .fr-diagram figcaption { font-size: 1.35rem; letter-spacing: -0.015em; }
.svc-fr .prob-list { border-top: 2px solid var(--ink); }
.svc-fr .prob { padding: 26px 0; border-bottom-color: var(--p-warm-line); grid-template-columns: 48px 1fr; }
.svc-fr .prob svg { width: 36px; height: 36px; padding: 6px; border-radius: 10px; background: #fff; }
.svc-fr .prob h3 { font-size: 1.32rem; font-weight: 800; letter-spacing: -0.015em; }
.svc-fr .prob p { font-size: 1.02rem; line-height: 1.62; }

/* Safe checks vs professional — white field, two confident panels */
.svc-fr .fr-checks { background: #fff; padding: 104px 0; }
.svc-fr .vs-grid { border-radius: 20px; }
.svc-fr .vs-you { background: var(--p-warm); padding: 40px 42px; }
.svc-fr .vs-you li { border-top-color: var(--p-warm-line); }
.svc-fr .vs-you li::before { border-color: var(--heat); color: var(--heat); }
.svc-fr .vs-pro { padding: 40px 42px; }
.svc-fr .vs-grid h3 { font-size: 1.5rem; font-weight: 800; }

/* Repair visit — wide photographic band, then visit + cost */
.svc-fr .frv { padding: 0 0 104px; background: #fff; }
.frv-photo { position: relative; height: 560px; overflow: hidden; }
.frv-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.frv-photo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: linear-gradient(90deg, #A8304A, #E4677F 45%, #6FA0EE 60%, #1D5BC7); }
.frv-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 72px; align-items: start; padding-top: 80px; }
.svc-fr .frv .fr-visit-text, .svc-fr .frv .fr-cost { grid-area: auto; }
.svc-fr .frv .fr-visit-text > p { font-size: 1.06rem; }
.svc-fr .frv .tick-list li { border-top: 1px solid #E6E0D5; padding-top: 12px; padding-bottom: 12px; }
.svc-fr .frv .tick-list li:first-child { border-top: 0; }
.svc-fr .fr-often { background: var(--p-warm); border-left: 4px solid var(--heat); border-radius: 0 14px 14px 0; padding: 26px 28px; }
.svc-fr .fr-often h3, .svc-fr .fr-often p { color: var(--p-text); }
.svc-fr .fr-cost { position: sticky; top: 108px; border-top: 0; padding: 34px 32px; background: var(--ink); color: #C9D2E5; border-radius: 18px; }
.svc-fr .fr-cost h2 { color: #fff; font-size: 1.7rem; letter-spacing: -0.02em; line-height: 1.12; }
.svc-fr .fr-cost li { color: #D5DCEB; }
.svc-fr .fr-cost .callout { background: rgba(255,255,255,.07); color: #fff; }
.svc-fr .fr-cost .callout svg { color: var(--heat-soft); }

/* Repair or replace — dark heat decision band */
.svc-fr .fr-decide { position: relative; overflow: hidden; background: linear-gradient(135deg, #17213A 0%, #2A2447 55%, #4A2340 100%); color: #C9D2E5; padding: 136px 0 112px; }
.frd-flow { top: 26px; opacity: .85; }
.svc-fr .fr-decide h2 { color: #fff; font-size: clamp(2.3rem, 1.5rem + 2.6vw, 3.6rem); letter-spacing: -0.035em; }
.svc-fr .fr-decide .sec-head > p { color: #D5DCEB; font-size: 1.15rem; }
.svc-fr .fr-decide .factor-list li { border-top-color: rgba(255,255,255,.14); }
.svc-fr .fr-decide .factor-list strong { color: #fff; font-size: 1.18rem; }
.svc-fr .fr-decide .factor-list li:first-child strong { color: var(--heat-soft); }
.svc-fr .fr-decide .factor-list span { color: #C9D2E5; }
.svc-fr .replace-panel { border-top: 0; border-radius: 20px; box-shadow: 0 30px 60px rgba(0,0,0,.28); padding: 40px 38px; }
.svc-fr .replace-panel::before { content: ""; display: block; width: 56px; height: 4px; border-radius: 2px; margin-bottom: 20px; background: linear-gradient(90deg, #A8304A, #E4677F); }
.svc-fr .replace-panel h3 { font-size: 1.6rem; font-weight: 800; }

/* FAQ + aside */
.svc-fr .faq-aside { background: var(--p-warm); padding: 104px 0; }
.svc-fr .faq-list { border-top: 2px solid var(--ink); }
.svc-fr .faq-list details { border-bottom-color: var(--p-warm-line); }
.svc-fr .faq-list summary::after { color: var(--heat); }
.svc-fr .faq-list h3 { font-size: 1.25rem; font-weight: 800; }
.svc-fr .faq-aside .cta-card { box-shadow: none; border-radius: 18px; }

/* Closing — light, warm, calm */
.svc-fr .fr-closing { background: linear-gradient(180deg, #FBEFF1 0%, #fff 100%); color: var(--p-text); padding: 96px 0 104px; }
.svc-fr .fr-closing h2 { color: var(--ink); }
.svc-fr .fr-closing p { color: var(--p-sub); }

@media (max-width: 1024px) {
  .frv-photo { height: 420px; }
  .frv-grid { grid-template-columns: 1fr; gap: 40px; padding-top: 56px; }
  .svc-fr .fr-cost { position: static; }
}
@media (max-width: 720px) {
  .svc-fr .fr-after { padding-bottom: 56px; }
  .svc-fr .after-strip { padding: 22px 20px; }
  .svc-fr .fr-problems, .svc-fr .fr-checks, .svc-fr .faq-aside { padding: 64px 0; }
  .svc-fr .vs-you, .svc-fr .vs-pro { padding: 28px 22px; }
  .frv-photo { height: 240px; }
  .svc-fr .frv { padding-bottom: 64px; }
  .frv-grid { padding-top: 40px; }
  .svc-fr .fr-cost { padding: 28px 22px; }
  .svc-fr .fr-decide { padding: 96px 0 64px; }
  .svc-fr .replace-panel { padding: 28px 22px; }
  .svc-fr .fr-closing { padding: 64px 0 72px; }
}
.svc-fr .replace-panel { color: var(--p-text); }
.svc-fr .replace-panel .cta-note { color: var(--p-sub); }

/* W16-R — FAQ: heading column + list (matches the AC Repair / Maintenance FAQ axis); call card sits under the heading */
.svc-fr .faq-aside-grid { grid-template-columns: 340px 1fr; gap: 28px 72px; }
.svc-fr .faq-aside-grid > div:first-child { display: contents; }
.svc-fr .faq-aside-grid h2 { grid-column: 1; grid-row: 1; align-self: start; margin: 0; }
.svc-fr .faq-aside-grid .faq-list { grid-column: 2; grid-row: 1 / span 2; }
.svc-fr .faq-aside-grid .cta-card { grid-column: 1; grid-row: 2; position: static; align-self: start; }
@media (max-width: 1024px) {
  .svc-fr .faq-aside-grid { grid-template-columns: 1fr; }
  .svc-fr .faq-aside-grid h2, .svc-fr .faq-aside-grid .faq-list, .svc-fr .faq-aside-grid .cta-card { grid-column: 1; grid-row: auto; }
}

/* W16-R — Furnace Repair
   Problems: the diagram becomes a horizontal stage (drawing + legend) above a two-column problem list,
   removing the tall dead area beside the long list. Visit: cost becomes a quieter warm card so the
   visit explanation stays primary. */
.svc-fr .fr-prob-grid { grid-template-columns: 1fr; gap: 44px; }
.svc-fr .fr-diagram { position: static; display: grid; grid-template-columns: minmax(0, 440px) 1fr; grid-template-rows: auto 1fr; gap: 0 56px; align-items: center; padding: 32px 40px; }
.svc-fr .fr-diagram svg { grid-column: 1; grid-row: 1 / span 2; }
.svc-fr .fr-diagram figcaption { grid-column: 2; grid-row: 1; align-self: end; font-size: 1.6rem; margin-bottom: 18px; }
.svc-fr .fr-diagram .dg-legend { grid-column: 2; grid-row: 2; align-self: start; margin: 0; gap: 14px 28px; }
.svc-fr .fr-diagram .dg-legend li { font-size: 1rem; }
.svc-fr .prob-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 56px; }
.svc-fr .fr-cost { background: var(--p-warm); color: var(--p-text); border-top: 4px solid var(--heat); border-radius: 0 0 16px 16px; }
.svc-fr .fr-cost h2 { color: var(--ink); font-size: 1.45rem; }
.svc-fr .fr-cost li { color: var(--p-text); }
.svc-fr .fr-cost .callout { background: #fff; color: var(--ink); }
.svc-fr .fr-cost .callout svg { color: var(--heat); }
@media (min-width: 1025px) { .frv-grid { grid-template-columns: 1.35fr .65fr; } }
@media (max-width: 1024px) {
  .svc-fr .fr-diagram { grid-template-columns: 1fr; padding: 24px; }
  .svc-fr .fr-diagram svg, .svc-fr .fr-diagram figcaption, .svc-fr .fr-diagram .dg-legend { grid-column: 1; grid-row: auto; }
  .svc-fr .fr-diagram figcaption { margin: 0 0 14px; order: -1; }
  .svc-fr .fr-diagram .dg-legend { margin-top: 18px; }
  .svc-fr .prob-list { grid-template-columns: 1fr; }
}
.svc-fr .faq-aside-grid { grid-template-columns: 360px 1fr; }
.svc-fr .faq-aside-grid .cta-card { padding: 30px 26px; }
.svc-fr .faq-aside-grid .cta-card .btn { white-space: nowrap; font-size: 1rem; padding-left: 16px; padding-right: 16px; }
@media (max-width: 1024px) { .svc-fr .faq-aside-grid { grid-template-columns: 1fr; } }
@media (max-width: 1024px) { .svc-fr .fr-diagram svg { max-width: 420px; justify-self: center; } }
@media (max-width: 720px) { .svc-fr .fr-diagram .dg-legend { grid-template-columns: 1fr; } .svc-fr .fr-diagram { padding: 20px 18px; } }