/* Shared C&I visual style, with residential enquiry and project layouts. */
:root {
  --navy: #0a0630;
  --navy-2: #142235;
  --ink: #142235;
  --muted: #596b80;
  --yellow: #ffbf00;
  --cream: #f6f7f8;
  --line: #e2e6ea;
  --green: #20cd63;
}
body { font-size: 16px; line-height: 1.6; }
::selection { background: #ffe6a0; color: var(--navy); }
input, select { caret-color: var(--navy); }
section[id] { scroll-margin-top: 100px; }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid var(--navy);
  outline-offset: 4px;
}
.page-shell { width: min(1180px, calc(100% - 48px)); }
.site-header {
  position: sticky;
  height: auto;
  min-height: 76px;
  padding-block: 12px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  backdrop-filter: none;
  grid-template-columns: 230px 1fr auto;
  gap: 24px;
}
.brand { width: 220px; }
.desktop-nav { justify-content: center; gap: 8px; font-size: 14px; }
.desktop-nav a {
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid #c7cfda;
  border-radius: 999px;
  white-space: nowrap;
  opacity: 1;
}
.desktop-nav a:hover { background: var(--cream); border-color: var(--ink); color: var(--ink); }
.button, .text-link, .rebate-card > a, .faq-heading > a {
  border: 1.5px solid var(--ink);
  border-radius: 999px;
  background: transparent;
  color: var(--ink);
  box-shadow: none;
  min-height: 48px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  text-align: center;
  transition: background-color 160ms ease-out, color 160ms ease-out, border-color 160ms ease-out;
}
.button:hover { transform: none; box-shadow: none; }
.button-small, .site-header .button-small { color: var(--ink); border-color: var(--ink); }
.button-primary, .cta-ribbon .button-primary, .assessment-form .button-primary {
  background: transparent;
  color: var(--ink);
  box-shadow: none;
  border: 1.5px solid var(--ink);
}
.button-primary:is(:hover, :focus-visible, :active),
.button[href="#assessment"]:is(:hover, :focus-visible, :active),
.rebate-card > a:is(:hover, :focus-visible, :active) {
  background: var(--yellow);
  color: var(--ink);
  border-color: var(--yellow);
  box-shadow: none;
}
.button[href*="wa.me"]:is(:hover, :focus-visible, :active),
.site-header .button-small:is(:hover, :focus-visible, :active),
.faq-heading > a:is(:hover, :focus-visible, :active) {
  background: var(--green);
  color: var(--ink);
  border-color: var(--green);
}
.button[href="#assessment"], .assessment-form > button[type="submit"] {
  background: var(--yellow);
  border-color: var(--yellow);
  color: var(--ink);
}
.button[href="#assessment"]:is(:hover, :focus-visible, :active),
.assessment-form > button[type="submit"]:is(:hover, :focus-visible, :active):not(:disabled) {
  background: #e6ad00;
  border-color: #e6ad00;
}
.text-link { display: inline-flex; align-items: center; justify-content: center; }
.text-link:hover { background: #fff; }
.text-link span, .faq-heading > a span { color: inherit; }
.hero { background: var(--cream); color: var(--ink); min-height: 0; }
.hero-image { background-image: url('/assets/residential-hero.webp'); background-position: center; opacity: 1; transform: none; }
.hero-shade { background: linear-gradient(90deg, #f6f7f8f5 0%, #f6f7f8e8 38%, #f6f7f87a 65%, #f6f7f830 100%); }
.hero-content {
  min-height: 0;
  padding-top: 64px;
  padding-bottom: 64px;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.8fr);
  align-items: center;
  gap: 64px;
}
.hero-copy { padding-top: 0; }
.eyebrow, .section-kicker, .section-kicker.light {
  color: var(--muted);
  text-transform: none;
  letter-spacing: 0;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 700;
  margin-bottom: 16px;
}
.eyebrow span { display: none; }
h1 { color: var(--navy); font-size: clamp(36px, 4vw, 56px); line-height: 1.12; letter-spacing: -0.025em; }
h1 em { color: inherit; }
.hero-lead { color: var(--muted); font-size: 17px; margin: 24px 0 28px; max-width: 52ch; }
.hero-actions { gap: 12px; flex-wrap: wrap; }
.hero-points { color: var(--muted); gap: 12px 20px; font-size: 14px; margin-top: 24px; }
.hero-points b { color: var(--muted); }
.rebate-card {
  background: #fff;
  border: 1px solid var(--navy);
  border-radius: 8px;
  backdrop-filter: none;
  box-shadow: none;
  align-self: center;
  margin: 0;
  padding: 28px;
}
.rebate-topline, .rebate-card > p, .deadline-row small { color: var(--muted); letter-spacing: 0; text-transform: none; }
.rebate-amount { color: var(--navy); font-size: 40px; letter-spacing: -0.025em; }
.deadline-row { border-color: var(--line); }
.calendar-icon { border-radius: 6px; }
.rebate-card > a { display: flex; font-size: 14px; margin-top: 20px; }
.coverage-bar { background: #fff; border-bottom: 1px solid var(--line); }
.coverage-inner { min-height: 80px; gap: 24px; }
.coverage-inner p, .locations span { font-size: 14px; }
.locations { gap: 20px; }
.locations i { width: 5px; height: 5px; box-shadow: none; background: var(--muted); }
.proof-strip { min-height: 120px; gap: 24px; }
.proof-strip strong { font-size: 25px; letter-spacing: -0.025em; color: var(--navy); }
.proof-strip span { color: var(--muted); text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 400; }
.accreditations img { filter: none; }
.section, .savings-section, .lead-section, .office-section { padding-block: 80px; }
.section-heading { margin-bottom: 32px; }
.section-heading h2, .savings-copy h2, .lead-copy h2, .faq-heading h2, .office-layout h2 {
  font-size: clamp(26px, 2.4vw, 34px);
  line-height: 1.25;
  letter-spacing: -0.025em;
  color: var(--navy);
}
.section-heading h2::after, .savings-copy h2::after, .lead-copy h2::after, .faq-heading h2::after, .office-layout h2::after {
  content: '';
  display: block;
  width: 40px;
  height: 3px;
  background: var(--yellow);
  margin-top: 20px;
}
.split-heading { grid-template-columns: 0.8fr 2fr; align-items: start; gap: 64px; }
.split-heading > p, .centered-heading > p, .section-intro { font-size: 16px; line-height: 1.7; }
.benefits-section, .programme-section > .page-shell, .tariff-section > .page-shell,
.how-section > .page-shell, .system-section > .page-shell, .residential-track-section > .page-shell,
.trust-section > .page-shell {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 2fr);
  gap: 32px 64px;
  align-items: start;
}
.benefits-section > .section-heading,
.programme-section .section-heading, .tariff-section .section-heading,
.how-section .section-heading, .system-section .section-heading,
.residential-track-section .section-heading, .trust-section > .page-shell > .section-heading {
  display: block;
  grid-column: 1;
  grid-row: 1 / span 4;
  text-align: left;
  margin: 0;
}
.benefits-section .section-heading > p, .programme-section .section-heading > p,
.tariff-section .section-heading > p, .how-section .section-heading > p,
.system-section .section-heading > p, .residential-track-section .section-heading > p,
.trust-section .section-heading > p { margin-top: 24px; }
.benefit-grid, .programme-grid, .regional-note, .tariff-rate-grid, .tariff-takeaway,
.tariff-source, .process-list, .system-option-grid, .battery-threshold-panel,
.hybrid-ready-note, .residential-gallery, .residential-track-cta, .why-us-grid,
.authority-panel, .trusted-heading, .project-grid, .why-us-cta { min-width: 0; grid-column: 2; }
.benefit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.benefit-card, .benefit-card:nth-child(3) {
  min-height: 0;
  grid-column: auto;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  padding: 24px 0 0;
  overflow: visible;
  background: transparent;
}
.benefit-card:hover { transform: none; box-shadow: none; }
.card-number { position: static; color: #8b6500; margin-bottom: 16px; font-size: 14px; }
.benefit-icon { margin-bottom: 24px; }
.benefit-card h3 { font-size: 21px; line-height: 1.3; letter-spacing: -0.02em; }
.benefit-card > p { font-size: 14px; }
.card-tag { position: static; margin-top: 24px; border: 0; padding: 0; color: var(--muted); letter-spacing: 0; text-transform: none; font-size: 14px; }
.cta-ribbon { background: var(--cream); border-block: 1px solid var(--line); }
.cta-ribbon-inner { min-height: 120px; padding-block: 24px; }
.cta-ribbon-inner div span { color: var(--muted); letter-spacing: 0; text-transform: none; }
.cta-ribbon-inner div strong { font-size: 20px; letter-spacing: -0.02em; }
.savings-section { background: #fff; color: var(--ink); }
.savings-layout, .lead-layout, .faq-layout, .office-layout { grid-template-columns: minmax(0, 0.8fr) minmax(0, 2fr); gap: 64px; align-items: start; }
.savings-copy .section-intro { color: var(--muted); margin: 24px 0 32px; }
.savings-copy label { color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 14px; }
.range-value { font-size: 36px; color: var(--navy); letter-spacing: -0.025em; }
.range-value small, .range-labels { color: var(--muted); }
.bill-range { accent-color: var(--navy); height: 8px; }
.estimate-card { background: var(--cream); border-radius: 8px; padding: 32px; box-shadow: none; }
.estimate-card::before { display: none; }
.estimate-header { letter-spacing: 0; text-transform: none; font-size: 14px; }
.estimate-primary strong { font-size: clamp(32px, 3.2vw, 46px); letter-spacing: -0.025em; }
.estimate-grid { border: 0; gap: 24px; }
.estimate-grid > div { border: 0; padding: 0; min-height: 0; }
.estimate-grid small { color: var(--muted); font-size: 14px; text-transform: none; letter-spacing: 0; }
.estimate-grid b { color: var(--navy); font-size: 20px; }
.estimate-card > p { color: var(--muted); font-size: 14px; line-height: 1.6; }
.programme-section { background: var(--cream); }
.programme-grid { gap: 24px; }
.programme-grid article { background: transparent; border: 0; border-top: 1px solid #c7cfda; border-radius: 0; padding: 24px 0 0; min-height: 0; grid-template-columns: 28px 1fr; gap: 16px; }
.programme-step, .deadline-programme .programme-step { width: 28px; height: 28px; background: transparent; color: #8b6500; border-radius: 0; }
.programme-grid small { color: var(--muted); text-transform: none; letter-spacing: 0; font-size: 14px; }
.programme-grid h3 { font-size: 23px; letter-spacing: -0.02em; }
.programme-grid p { font-size: 14px; }
.programme-grid .deadline-programme { background: transparent; border-color: #c7cfda; }
.deadline-programme small, .deadline-programme p { color: var(--muted); }
.regional-note { margin-top: 8px; border-radius: 8px; }
.regional-note span { color: var(--muted); letter-spacing: 0; text-transform: none; }
.energy-house-visual { border-radius: 8px 8px 0 0; box-shadow: none; }
.energy-house-visual figcaption { backdrop-filter: none; border-radius: 6px; }
.energy-visual-legend { background: var(--cream); color: var(--ink); border: 1px solid var(--line); border-radius: 0 0 8px 8px; }
.energy-visual-legend article { border-color: var(--line); }
.energy-visual-legend p { color: var(--muted); font-size: 14px; }
.energy-summary-grid { gap: 24px; margin-top: 32px; }
.energy-summary-grid article { border-top: 1px solid var(--line); background: transparent; padding: 24px 0 0; }
.energy-summary-grid p { font-size: 14px; }
.tariff-section { background: var(--cream); color: var(--ink); }
.tariff-heading > p, .tariff-heading > p b { color: var(--muted); }
.tariff-rate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.tariff-rate-card { border-radius: 8px; background: #fff; padding: 24px; }
.high-rate-card { border: 1px solid #c7cfda; }
.rate-card-top span, .high-rate-card .rate-card-top span, .rate-number small, .high-rate-card .rate-number small { color: var(--muted); letter-spacing: 0; text-transform: none; font-size: 14px; }
.rate-number b { color: var(--navy); font-size: 48px; letter-spacing: -0.025em; }
.rate-breakdown span, .high-rate-card .rate-breakdown span { color: var(--muted); font-size: 14px; }
.tariff-rate-card > p, .high-rate-card > p { color: var(--muted); font-size: 14px; }
.export-rate-card { grid-column: 1 / -1; background: transparent; border: 0; border-top: 1px solid #c7cfda; border-radius: 0; padding: 24px 0 0; }
.export-label { color: var(--muted); font-size: 14px; letter-spacing: 0; text-transform: none; }
.export-rate-card h3 { color: var(--navy); font-size: 24px; letter-spacing: -0.02em; }
.export-rate-card > p, .export-rate-card > p b { color: var(--muted); font-size: 14px; }
.export-equation { border-color: var(--line); }
.export-equation span { color: var(--navy); }
.export-equation b { color: #8b6500; letter-spacing: 0; text-transform: none; font-size: 14px; }
.tariff-takeaway { margin-top: 0; border-radius: 8px; grid-template-columns: 1fr; gap: 12px; padding: 24px; }
.tariff-takeaway > span { font-size: 14px; letter-spacing: 0; text-transform: none; }
.tariff-takeaway p { font-size: 16px; }
.tariff-source { color: var(--muted); font-size: 14px; margin: 0; }
.process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; border: 0; }
.process-list li, .process-list li:not(:first-child) { padding: 24px 0 0; border: 0; border-top: 1px solid var(--line); min-height: 0; }
.process-list li::after { display: none; }
.process-list > li > span { border: 0; color: #8b6500; border-radius: 0; place-items: start; width: auto; height: auto; margin-bottom: 20px; font-size: 14px; }
.process-list h3 { font-size: 20px; letter-spacing: -0.02em; }
.process-list p { font-size: 16px; }
.system-section { background: var(--cream); color: var(--ink); }
.system-heading > p { color: var(--muted); }
.system-option { background: #fff; border-radius: 8px; padding: 24px; }
.option-top span { letter-spacing: 0; text-transform: none; font-size: 14px; }
.option-top b { background: var(--cream); color: var(--ink); }
.option-visual { border-radius: 6px; margin-block: 24px; }
.option-visual figcaption { backdrop-filter: none; border-radius: 6px; }
.system-option h3 { font-size: 24px; letter-spacing: -0.02em; }
.option-subtitle, .hybrid-option .option-subtitle { color: var(--muted); font-size: 14px; }
.system-option li { font-size: 14px; }
.best-for, .hybrid-option .best-for { background: var(--cream); border-radius: 6px; padding: 16px; }
.best-for small { color: var(--muted); text-transform: none; letter-spacing: 0; font-size: 14px; }
.battery-threshold-panel { background: transparent; border: 0; border-top: 1px solid #c7cfda; border-radius: 0; grid-template-columns: 1fr; padding: 24px 0 0; margin-top: 0; gap: 24px; }
.threshold-kicker { color: var(--muted); font-size: 14px; text-transform: none; letter-spacing: 0; }
.threshold-copy h3 { color: var(--navy); font-size: 24px; letter-spacing: -0.02em; }
.threshold-grid > div { background: transparent; border-radius: 0; padding: 12px 0; }
.threshold-grid span { color: #8b6500; }
.threshold-grid p, .threshold-grid b { color: var(--muted); font-size: 14px; }
.hybrid-ready-note, .residential-track-cta, .why-us-cta { background: transparent; color: var(--ink); border: 0; border-top: 1px solid #c7cfda; border-radius: 0; min-height: 0; padding: 24px 0 0; margin-top: 0; flex-wrap: wrap; }
.hybrid-ready-note div span, .residential-track-cta div span, .why-us-cta div span { color: var(--muted); font-size: 14px; text-transform: none; letter-spacing: 0; }
.hybrid-ready-note div strong, .residential-track-cta div strong, .why-us-cta div strong { color: var(--navy); font-size: 19px; letter-spacing: -0.02em; }
.residential-track-section { background: #fff; }
.residential-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 180px; gap: 12px; }
.residential-project { border-radius: 6px; }
.residential-project.featured-home { grid-area: auto; grid-column: auto; }
.featured-home .residential-project-copy { inset: auto 18px 17px; }
.featured-home .residential-project-copy strong { font-size: 19px; }
.residential-project:hover, .project-card:hover { transform: none; box-shadow: none; }
.residential-proof-section { background: #fff; padding-block: 40px 0; }
.residential-proof-layout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 2fr); gap: 48px; align-items: center; }
.residential-proof-intro h2 { color: var(--navy); font-size: 24px; line-height: 1.25; margin-bottom: 12px; max-width: 20ch; }
.residential-proof-intro a { display: inline-flex; gap: 8px; padding-block: 8px; min-height: 44px; color: var(--navy); font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.residential-proof-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; min-width: 0; }
.residential-proof-gallery .residential-project { height: 176px; min-width: 0; }
.residential-proof-gallery .residential-project-copy { inset: auto 12px 12px; display: block; }
.residential-proof-gallery .residential-project-copy > span { display: none; }
.residential-proof-gallery .residential-project-copy strong { font-size: 18px; }
.residential-proof-gallery .residential-project-copy small { font-size: 14px; }
.trust-section { background: var(--cream); }
.why-us-grid { border: 0; border-radius: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 0; }
.why-us-grid article { border: 0; border-top: 1px solid #c7cfda; padding: 24px 0 0; min-height: 0; }
.why-us-grid strong { font-size: 28px; letter-spacing: -0.02em; }
.why-us-grid span { color: #8b6500; text-transform: none; letter-spacing: 0; font-size: 14px; }
.why-us-grid p { font-size: 16px; }
.authority-panel { background: transparent; border-radius: 0; grid-template-columns: 1fr; padding: 24px 0; gap: 24px; }
.authority-intro > span { color: var(--muted); font-size: 14px; letter-spacing: 0; text-transform: none; }
.authority-intro h3 { font-size: 24px; letter-spacing: -0.02em; }
.authority-intro p { font-size: 16px; }
.authority-logo-grid > div { background: transparent; border-radius: 0; padding: 0; align-items: center; text-align: center; min-height: 0; }
.authority-logo-grid img { width: 160px; max-width: 100%; height: 72px; flex-shrink: 0; object-fit: contain; object-position: center; margin-bottom: 16px; }
.authority-logo-grid strong { margin: 0; }
.authority-logo-grid span { font-size: 14px; }
.trusted-heading { flex-wrap: wrap; margin: 0; }
.trusted-heading p { font-size: 16px; }
.project-grid, .why-us-cta { grid-column: 1 / -1; }
.project-card { border-radius: 6px; border-color: var(--line); box-shadow: none; }
.project-copy { padding: 24px; }
.project-copy h3 { font-size: 20px; }
.lead-section { background: #fff; padding-block: 48px 80px; }
.lead-copy > p { color: var(--muted); font-size: 16px; }
.lead-copy li { font-weight: 400; font-size: 16px; }
.assessment-form { width: 100%; max-width: none; background: var(--cream); border-radius: 8px; box-shadow: none; padding: 32px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; }
.form-top, .consent-row, .assessment-form > button, .form-note { grid-column: 1 / -1; }
.form-top { margin: 0 0 4px; text-transform: none; letter-spacing: 0; padding-bottom: 20px; font-size: 16px; }
.form-top b { background: transparent; color: var(--muted); font-size: 14px; padding: 0; }
.assessment-form > label:not(.consent-row) { color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 14px; margin: 0; font-weight: 600; }
.assessment-form input:not([type="checkbox"]), .assessment-form select { width: 100%; height: 50px; color: var(--ink); background: #fff; border: 1px solid #c7cfda; border-radius: 6px; margin-top: 8px; padding: 0 14px; font-weight: 400; }
.assessment-form input::placeholder { color: var(--muted); }
.assessment-form input:focus-visible, .assessment-form select:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; box-shadow: none; }
.consent-row { color: var(--muted); font-size: 14px; margin: 4px 0; }
.assessment-form > button { justify-self: start; width: auto; max-width: 100%; }
.assessment-form > p:not(.form-note), .assessment-form > .full-button { grid-column: 1 / -1; }
.assessment-form > .full-button { justify-self: start; width: auto; }
.button:disabled { opacity: 0.65; cursor: wait; }
.assessment-form .form-note { color: var(--muted); font-size: 14px; text-align: left; margin: 0; }
.form-note a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.error-message { font-size: 14px; line-height: 1.5; }
.phone-hint { color: var(--muted); font-size: 14px; line-height: 1.5; font-weight: 400; margin-top: 8px; }
.phone-error { color: #b42318; font-size: 14px; font-weight: 400; margin-top: 8px; }
.phone-error[hidden] { display: none; }
.assessment-form input[aria-invalid="true"] { border-color: #b42318; }
.faq-section { background: var(--cream); }
.faq-heading { position: static; }
.faq-list summary { color: var(--navy); font-size: 16px; min-height: 72px; }
.faq-list summary span { background: transparent; color: var(--navy); }
.faq-list details > p { font-size: 16px; margin-right: 36px; }
.office-section { color: var(--ink); background: #fff; }
.office-layout > div:first-child > p:last-child { color: var(--muted); font-size: 16px; }
.office-grid { border: 0; gap: 24px; }
.office-grid div { border: 0; border-top: 1px solid var(--line); padding: 20px 0 0; min-height: 88px; }
.office-grid span { color: #8b6500; font-size: 14px; }
.office-grid b { color: var(--navy); font-size: 16px; }
.office-grid .office-name { display: flex; align-items: center; gap: 10px; }
.office-grid .office-name span { color: inherit; font-size: inherit; line-height: 1.35; margin: 0; }
.office-grid .state-flag { display: block; width: 32px; height: 16px; flex-shrink: 0; object-fit: contain; outline: 1px solid rgb(20 34 53 / 12%); }
.office-layout > .button { margin-top: -32px; }
.privacy-section { background: var(--cream); color: var(--ink); padding-block: 32px; }
.privacy-details { border-color: var(--line); }
.privacy-details > summary { font-size: 14px; }
.privacy-details > summary span { color: var(--muted); }
.privacy-content { color: var(--muted); font-size: 14px; max-width: 800px; }
.privacy-content h3 { color: var(--navy); font-size: 17px; }
footer { background: #fff; border-top: 1px solid var(--line); padding-top: 56px; }
.footer-grid { gap: 32px; }
.footer-brand img { width: 220px; }
.footer-brand p { color: var(--muted); }
.footer-grid h2 { color: var(--navy); font-size: 14px; letter-spacing: 0; text-transform: none; }
.footer-grid > div:not(.footer-brand) > span { color: var(--muted); font-size: 14px; }
.footer-grid > div:not(.footer-brand) a { display: table; border: 1px solid #c7cfda; border-radius: 999px; padding: 10px 16px; min-height: 44px; margin-block: 8px; font-size: 14px; color: var(--ink); }
.footer-grid a:hover { background: var(--cream); color: var(--ink) !important; border-color: var(--ink); }
.footer-grid a[href*="wa.me"]:hover { background: var(--green); border-color: var(--green); }
.footer-grid a[href="#assessment"]:hover { background: var(--yellow); border-color: var(--yellow); }
.footer-whatsapp span { color: inherit; }
.footer-bottom { color: var(--muted); letter-spacing: 0; text-transform: none; font-size: 14px; border-color: var(--line); margin-top: 40px; }
.floating-whatsapp { color: var(--ink); background: #fff; border: 1.5px solid var(--ink); box-shadow: none; padding: 10px 18px; min-height: 48px; font-weight: 600; }
.floating-whatsapp .whatsapp-logo { display: block; width: 28px; height: 28px; flex-shrink: 0; object-fit: contain; }
.floating-whatsapp:hover { background: var(--green); border-color: var(--green); }
@media (max-width: 1150px) {
  .site-header { grid-template-columns: 1fr auto; padding-inline: 24px; gap: 12px; }
  .desktop-nav { display: flex; grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; }
  .site-header > .button { grid-column: 2; grid-row: 1; }
  section[id] { scroll-margin-top: 144px; }
}
@media (max-width: 1000px) {
  .hero-content { gap: 32px; }
  .section, .savings-section, .lead-section, .office-section { padding-block: 64px; }
  .benefits-section, .programme-section > .page-shell, .tariff-section > .page-shell,
  .how-section > .page-shell, .system-section > .page-shell, .residential-track-section > .page-shell,
  .trust-section > .page-shell, .savings-layout, .lead-layout, .faq-layout, .office-layout { grid-template-columns: 1fr; gap: 32px; }
  .benefits-section > .section-heading, .programme-section .section-heading,
  .tariff-section .section-heading, .how-section .section-heading, .system-section .section-heading,
  .residential-track-section .section-heading, .trust-section > .page-shell > .section-heading { grid-column: auto; grid-row: auto; max-width: 680px; }
  .benefit-grid, .programme-grid, .regional-note, .tariff-rate-grid, .tariff-takeaway,
  .tariff-source, .process-list, .system-option-grid, .battery-threshold-panel,
  .hybrid-ready-note, .residential-gallery, .residential-track-cta, .why-us-grid,
  .authority-panel, .trusted-heading, .project-grid, .why-us-cta { grid-column: auto; }
  .split-heading { grid-template-columns: 1fr 1.2fr; gap: 32px; }
  .energy-visual-legend article:nth-child(-n+3) { border-color: var(--line); }
  .why-us-grid article:nth-child(2), .why-us-grid article:nth-child(3), .why-us-grid article:nth-child(4) { border: 0; border-top: 1px solid #c7cfda; }
  .office-layout > .button { grid-column: 1; margin-top: 0; }
}
@media (max-width: 720px) {
  .page-shell { width: calc(100% - 40px); }
  .site-header { padding: 10px 16px; gap: 8px; }
  .brand { width: 188px; }
  .site-header > .button { min-height: 44px; padding: 10px 14px; font-size: 14px; }
  .desktop-nav { gap: 6px; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; }
  .desktop-nav a { min-height: 40px; padding: 8px 12px; font-size: 14px; flex-shrink: 0; }
  .hero-content { grid-template-columns: 1fr; padding-top: 40px; padding-bottom: 40px; gap: 32px; }
  .hero-copy { padding-top: 0; }
  .hero-image { height: 220px; background-position: 78% center; }
  .hero-shade { background: linear-gradient(180deg, transparent 140px, var(--cream) 220px); }
  .hero-content { padding-top: 252px; }
  h1 { font-size: clamp(32px, 8.5vw, 42px); line-height: 1.15; }
  .hero-lead { font-size: 16px; }
  .hero-actions { flex-direction: row; align-items: stretch; gap: 12px; }
  .hero-actions .button, .hero-actions .text-link { width: auto; max-width: 100%; align-self: auto; }
  .hero-points { display: flex; flex-wrap: wrap; }
  .rebate-card { padding: 24px; }
  .section, .savings-section, .lead-section, .office-section { padding-block: 48px; }
  .section-heading h2, .savings-copy h2, .lead-copy h2, .faq-heading h2, .office-layout h2 { font-size: 28px; }
  .split-heading { grid-template-columns: 1fr; gap: 20px; }
  .benefit-grid, .programme-grid, .tariff-rate-grid, .process-list, .system-option-grid, .why-us-grid { grid-template-columns: 1fr; gap: 28px; }
  .benefit-card:nth-child(3) { padding: 24px 0 0; }
  .cta-ribbon-inner { min-height: 0; gap: 20px; padding-block: 24px; }
  .estimate-card, .system-option { padding: 24px; }
  .estimate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .estimate-primary strong { font-size: clamp(30px, 9vw, 38px); }
  .programme-grid article { grid-template-columns: 28px 1fr; padding: 24px 0 0; }
  .programme-step { width: 28px; height: 28px; }
  .regional-note > div { padding: 20px; }
  .energy-visual-legend article, .energy-visual-legend article:nth-child(3), .energy-visual-legend article:nth-child(-n+3) { border-color: var(--line); }
  .process-list li, .process-list li:not(:first-child), .process-list li:nth-child(3) { display: block; padding: 24px 0 0; border: 0; border-top: 1px solid var(--line); }
  .process-list > li > span { margin-bottom: 16px; }
  .battery-threshold-panel { padding: 24px 0 0; }
  .hybrid-ready-note, .residential-track-cta, .why-us-cta { padding: 24px 0 0; min-height: 0; gap: 20px; }
  .residential-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 190px; gap: 10px; }
  .residential-project.featured-home { grid-column: auto; }
  .residential-project-copy { inset: auto 10px 12px; gap: 6px; }
  .residential-project-copy strong { font-size: 16px; }
  .residential-project-copy > span { font-size: 9px; }
  .residential-project-copy small { font-size: 9px; }
  .why-us-grid article { border: 0 !important; border-top: 1px solid #c7cfda !important; }
  .authority-panel { padding: 0; }
  .authority-logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .authority-logo-grid > div { min-height: 0; }
  .project-copy { padding: 20px; }
  .assessment-form { grid-template-columns: 1fr; padding: 24px 20px; gap: 20px; }
  .form-top { align-items: center; gap: 12px; font-size: 14px; }
  .form-top b { flex-shrink: 0; }
  .assessment-form > button { width: 100%; }
  .office-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand, .footer-grid > div:last-child { grid-column: 1 / -1; }
  .floating-whatsapp { min-height: 44px; padding: 8px 14px; left: auto; right: 16px; font-size: 14px; }
}
@media (max-width: 380px) {
  .site-header { padding-inline: 12px; }
  .brand { width: 156px; }
  .site-header > .button { padding-inline: 10px; font-size: 14px; }
  .button, .text-link { padding-inline: 18px; }
  .form-top { flex-wrap: wrap; }
  .residential-gallery { grid-auto-rows: 180px; }
}
@media (max-width: 1000px) {
  .residential-proof-layout { grid-template-columns: 1fr; gap: 20px; }
  .residential-proof-intro h2 { max-width: none; }
}
@media (max-width: 700px) {
  .residential-proof-section { padding-top: 32px; }
  .residential-proof-gallery { gap: 10px; }
  .residential-proof-gallery .residential-project { height: 150px; }
  .residential-proof-gallery .residential-project-copy { inset: auto 8px 10px; }
  .residential-proof-gallery .residential-project-copy strong { font-size: 14px; }
  .residential-proof-gallery .residential-project-copy small { font-size: 10px; }
  .lead-section { padding-block: 32px 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .button, .text-link, .rebate-card > a, .faq-heading > a { transition: none; }
}

/* Clear reading roles and mobile contact/navigation. */
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
.hero-lead { max-width: 54ch; font-size: 18px; line-height: 1.65; }
.section-heading h2, .savings-copy h2, .lead-copy h2, .faq-heading h2, .office-layout h2 { font-weight: 650; }
.benefit-card p, .programme-grid article > p, .system-option li, .best-for p,
.threshold-grid p, .threshold-grid b, .project-copy p, .energy-visual-legend p,
.energy-takeaways p, .export-rate-card > p, .lead-copy li { font-size: 16px; line-height: 1.65; }
.split-heading > p, .section-intro, .lead-copy > p { max-width: 65ch; }
.assessment-form input:not([type="checkbox"]), .assessment-form select { font: inherit; font-size: 16px; min-height: 52px; }
.assessment-form input[type="checkbox"] { width: 20px; height: 20px; flex-shrink: 0; }
.consent-row { align-items: flex-start; min-height: 44px; line-height: 1.5; cursor: pointer; }
input[type="range"] { min-height: 44px; cursor: pointer; }
.estimate-primary strong, .range-value, .rate-number b { font-variant-numeric: tabular-nums; }
.mobile-navigation, .mobile-actions { display: none; }
@media (max-width: 720px) {
  html { scroll-padding-top: 84px; }
  body { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
  section[id] { scroll-margin-top: 84px; }
  .site-header { grid-template-columns: 1fr auto; min-height: 68px; padding: 12px 20px; }
  .brand { width: min(48vw, 200px); }
  .desktop-nav, .site-header > .button { display: none; }
  .mobile-navigation { display: block; }
  .mobile-navigation summary { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid #c7cfda; border-radius: 999px; color: var(--ink); font-size: 16px; font-weight: 600; cursor: pointer; list-style: none; }
  .mobile-navigation summary::-webkit-details-marker { display: none; }
  .mobile-navigation summary svg { width: 20px; height: 20px; }
  .mobile-nav-links { position: absolute; left: 0; right: 0; top: calc(100% - 1px); display: grid; padding: 16px 20px 20px; gap: 10px; background: #fff; border-bottom: 1px solid var(--line); }
  .mobile-nav-links a { display: flex; align-items: center; min-height: 48px; padding: 10px 16px; border: 1px solid #c7cfda; border-radius: 999px; color: var(--ink); font-size: 16px; font-weight: 600; text-decoration: none; }
  .mobile-nav-links a:hover { background: var(--cream); }
  .floating-whatsapp { display: none; }
  .mobile-actions { position: fixed; z-index: 50; inset: auto 0 0; display: grid; grid-template-columns: 1.15fr 1fr; gap: 10px; padding: 12px max(16px, env(safe-area-inset-right, 0px)) calc(12px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); background: #fff; border-top: 1px solid var(--line); }
  .mobile-actions .button { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; padding: 10px 12px; font-size: 14px; white-space: nowrap; }
  .mobile-actions img { flex-shrink: 0; }
  body:has(input:focus, select:focus, textarea:focus, dialog[open]) .mobile-actions { display: none; }
  .hero-image { height: 176px; background-image: url('/assets/residential-hero-mobile.webp'); }
  .hero-shade { background: linear-gradient(180deg, transparent 112px, var(--cream) 176px); }
  .hero-content { padding-top: 204px; gap: 24px; padding-bottom: 32px; }
  h1 { font-size: clamp(32px, 8.8vw, 40px); font-weight: 700; }
  .hero-lead { font-size: 16px; margin-block: 20px 24px; }
  .hero-actions { flex-direction: column; gap: 10px; }
  .hero-actions .button, .hero-actions .text-link { width: 100%; min-height: 48px; font-size: 16px; }
  .hero-points { margin-top: 20px; gap: 8px 16px; }
  .rebate-card { padding: 20px; }
  .section-heading h2, .savings-copy h2, .lead-copy h2, .faq-heading h2, .office-layout h2 { font-size: 28px; line-height: 1.22; }
  .section-heading h2::after, .savings-copy h2::after, .lead-copy h2::after { margin-top: 16px; }
  .proof-strip { gap: 20px; padding-block: 24px; }
  .coverage-inner { padding-block: 20px; gap: 12px; }
  .residential-proof-gallery { display: flex; overflow-x: auto; scroll-snap-type: x proximity; gap: 16px; padding-bottom: 12px; }
  .residential-proof-gallery .residential-project { flex: 0 0 80%; min-width: 0; height: 190px; scroll-snap-align: start; }
  .residential-proof-gallery .residential-project-copy strong { font-size: 20px; }
  .residential-proof-gallery .residential-project-copy small, .residential-project-copy small { font-size: 14px; }
  .residential-gallery { grid-template-columns: 1fr; grid-auto-rows: 220px; }
  .residential-project-copy strong { font-size: 20px; }
  .lead-copy li > span { flex-shrink: 0; }
  .lead-copy > p { margin-bottom: 20px; }
  .assessment-form { padding: 24px 20px; }
  .assessment-form > label:not(.consent-row) { font-size: 16px; }
  .form-top { align-items: flex-start; font-size: 16px; }
  .form-top b { font-size: 14px; }
  .faq-list summary { min-height: 64px; padding: 18px 20px; font-size: 16px; }
  .faq-list details > p { margin: 0; padding: 0 20px 20px; font-size: 16px; }
  .authority-logo-grid span { font-size: 14px; }
  .footer-grid > div:not(.footer-brand) a { font-size: 14px; max-width: 100%; overflow-wrap: anywhere; }
}
@media (max-width: 360px) {
  .page-shell { width: calc(100% - 32px); }
  .mobile-actions { gap: 8px; padding-inline: 12px; }
  .mobile-actions .button { font-size: 13px; padding-inline: 8px; }
  .estimate-grid { gap: 16px; }
}

.rebate-topline, .rebate-card > p, .deadline-row small { font-size: 14px; line-height: 1.5; }
@media (max-width: 720px) {
  section[id] { scroll-margin-top: 0; }
  .residential-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 220px; }
  .residential-project-copy > div { min-width: 0; }
  .residential-project-copy small { line-height: 1.35; letter-spacing: 0; text-transform: none; overflow-wrap: anywhere; }
}

.form-instructions, .remark-field { grid-column: 1 / -1; }
.form-instructions, .company-hint { color: var(--muted); font-size: 14px; line-height: 1.5; }
.company-hint { display: block; margin-top: 8px; font-weight: 400; }
.assessment-form input:disabled { background: #eef0f2; color: var(--muted); cursor: not-allowed; }
.assessment-form textarea { width: 100%; min-height: 100px; padding: 12px 14px; margin-top: 8px; border: 1px solid #c7cfda; border-radius: 6px; resize: vertical; font: inherit; background: #fff; color: var(--ink); }