/* solar-installation.css — page-specific rules, prefix `si-`. Loaded after styles.css. */

/* Hero: mist information panel + install photography, mirroring the homepage hero geometry. */
.si-hero{display:grid;grid-template-columns:37.5% 1fr;margin:0 26px;min-height:560px;max-width:1600px}
.si-hero-panel{background:var(--mist);border-radius:var(--radius);padding:clamp(34px,3.4vw,52px) clamp(26px,3.45vw,53px) 26px;display:flex;flex-direction:column}
.si-hero h1{font-size:clamp(30px,2.55vw,42px);letter-spacing:-.04em;line-height:1.12}
.si-hero-copy{font-size:clamp(16px,1.3vw,19px);line-height:1.5;margin-top:16px;color:var(--muted);max-width:44ch}
.si-hero-cta{margin-top:23px;align-self:flex-start;min-height:52px;min-width:192px}
.si-hero-links{margin-top:auto;padding-top:28px}
.si-hero-links a{display:flex;align-items:center;gap:21px;padding:10px 0;min-height:64px;border-top:1px solid #adc2be;text-decoration:none;font-size:16px;transition:color .2s}
.si-hero-links a:hover{color:var(--focus)}
.si-hero-links .row-arrow{width:20px;height:20px;margin-left:auto;transition:transform .2s}
.si-hero-links a:hover .row-arrow{transform:translateX(3px)}
.si-hero-links a:focus-visible{outline-offset:1px}
.si-hero-photo{margin:0;min-width:0;border-radius:var(--radius);overflow:hidden}
.si-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}

/* Scope section: explanatory copy beside the included / quoted-separately ledger. */
.si-standard{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(50px,8vw,130px);align-items:start}
.si-ledger{background:#fff;padding:32px 34px;border:1px solid var(--line);border-radius:var(--radius)}
.si-ledger-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.si-ledger-head h3{font-size:21px}
.si-ledger-head span{font-size:11px;white-space:nowrap;color:var(--muted)}
.si-ledger h4{margin:26px 0 4px;font-size:13px;font-weight:500;line-height:1.5;letter-spacing:0}
.si-ledger-incl h4{color:var(--focus);margin-top:0}
.si-ledger-extra h4{color:var(--muted)}
.si-ledger ul{list-style:none;margin:0;padding:0}
.si-ledger li{display:flex;gap:14px;align-items:flex-start;border-top:1px solid var(--line);padding:13px 0;font-size:15px;line-height:1.55}
.si-ledger li svg{width:17px;height:17px;margin-top:4px}
.si-ledger-incl li svg{color:var(--focus)}
.si-ledger-extra li svg{color:var(--muted)}
.si-ledger>.fine-print{border-top:1px solid var(--ink);margin-top:14px;padding-top:16px;max-width:none}

/* Four-photo site review: paper cards on the mist band. */
.si-review{background:var(--mist);padding:88px 0}
.si-review .section-heading>p{max-width:44ch}
.si-photo-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.si-photo-cards>li{background:var(--paper);border-radius:var(--radius);padding:26px 24px 14px;display:flex;flex-direction:column}
.si-photo-cards .icon-disc{background:var(--mist);margin-bottom:20px}
.si-photo-cards h3{font-size:19px}
.si-photo-cards>li>p{font-size:14px;color:var(--muted);line-height:1.6;margin:10px 0 18px;max-width:30ch}
.si-photo-cards details{margin-top:auto;border-top:1px solid var(--line)}
.si-photo-cards summary{font-size:13px;min-height:46px}
.si-photo-cards summary svg{width:16px;height:16px;color:var(--muted)}
.si-photo-cards details ul{list-style:none;margin:0;padding:0 0 14px}
.si-photo-cards details li{display:flex;gap:10px;font-size:13px;color:var(--muted);line-height:1.55;padding:4px 0}
.si-photo-cards details li svg{width:15px;height:15px;margin-top:3px;color:var(--focus)}
.si-review-note{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px 40px;margin-top:38px;padding-top:26px;border-top:1px solid #b9cdc6}
.si-review-note p{font-size:14px;color:var(--muted);line-height:1.7;max-width:62ch}
.si-review-note .text-link{font-size:14px}

/* Install day: wide commissioning photograph, then a four-step sequence. */
.si-day-photo{margin:0 0 46px;border-radius:var(--radius);overflow:hidden}
.si-day-photo img{aspect-ratio:2.55/1;object-fit:cover;object-position:50% 45%}
.si-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;list-style:none;margin:0;padding:0}
.si-steps>li{border-top:1px solid #a9bdb8;padding-top:22px}
.si-steps h3{font-size:21px}
.si-steps>li>p{font-size:14px;color:var(--muted);line-height:1.7;margin-top:12px;max-width:35ch}

/* Workmanship warranty: copy beside a document-style cover card. */
.si-warranty{background:#edf1ee;padding:85px 0}
.si-warranty-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(45px,8vw,125px);align-items:center}
.si-cover{padding:35px 39px;background:var(--paper);box-shadow:0 16px 34px #24463c10;border-radius:3px}
.si-cover-top{display:flex;justify-content:space-between;align-items:center;gap:20px}
.si-cover-top>span:last-child{font-size:12px;color:var(--muted)}
.si-cover h3{font-size:32px;margin:35px 0 25px}
.si-cover ul{list-style:none;padding:0;margin:0}
.si-cover li{display:flex;gap:12px;align-items:center;font-size:13px;border-top:1px solid var(--line);padding:13px 0}
.si-cover li svg{width:17px;height:17px;color:var(--focus)}
.si-cover>p{border-top:1px solid var(--line);font-size:12px;color:var(--muted);padding-top:18px}

@media(max-width:1200px){
.si-hero{grid-template-columns:42% 1fr;min-height:520px;margin-inline:18px}
.si-hero-panel{padding:40px 25px 22px}
.si-hero h1{font-size:33px}
.si-hero-copy{font-size:17px}
.si-hero-links a{font-size:15px;gap:14px}
.si-standard{gap:55px}
.si-ledger{padding:27px}
.si-photo-cards{grid-template-columns:1fr 1fr;gap:18px}
.si-steps{grid-template-columns:1fr 1fr;gap:25px 32px}
.si-warranty-grid{gap:55px}
}

@media(max-width:900px){
.si-hero{grid-template-columns:47% 1fr;min-height:480px}
.si-hero-panel{padding:35px 22px 20px}
.si-hero h1{font-size:29px}
.si-hero-copy{font-size:16px}
.si-hero-cta{min-height:48px;min-width:0;padding:10px 23px}
.si-hero-links a{font-size:14px;gap:12px;min-height:58px}
.si-standard{gap:35px}
.si-photo-cards h3{font-size:18px}
.si-steps h3{font-size:19px}
.si-cover{padding:28px}
.si-cover h3{font-size:28px}
.si-cover li{font-size:12px}
}

@media(max-width:650px){
.si-hero{display:flex;flex-direction:column;margin-inline:12px;min-height:0}
.si-hero-panel{padding:30px 26px 23px;border-radius:12px 12px 0 0}
.si-hero h1{font-size:clamp(28px,7.4vw,38px);line-height:1.15}
.si-hero-copy{font-size:16px;margin-top:14px}
.si-hero-cta{margin-top:22px;min-height:48px}
.si-hero-links{margin-top:24px;padding-top:0}
.si-hero-photo{height:260px;border-radius:0 0 12px 12px;flex-shrink:0}
.si-hero-photo img{object-position:50% 45%}
.si-standard{grid-template-columns:1fr;gap:32px}
.si-ledger{padding:24px 21px}
.si-ledger-head{flex-direction:column;align-items:flex-start;gap:5px;margin-bottom:16px}
.si-ledger li{font-size:14px}
.si-review{padding:55px 0}
.si-photo-cards{grid-template-columns:1fr;gap:14px}
.si-photo-cards>li{padding:24px 22px 12px}
.si-photo-cards>li>p{max-width:none}
.si-review-note{margin-top:30px;padding-top:22px}
.si-review-note p{font-size:13px}
.si-day-photo{margin-bottom:32px}
.si-day-photo img{aspect-ratio:16/10}
.si-steps{grid-template-columns:1fr;gap:26px}
.si-steps>li{padding:23px 0 0 48px;position:relative}
.si-steps .step-number{position:absolute;left:0;top:23px;width:30px;height:30px;font-size:12px;margin-bottom:0}
.si-steps h3{font-size:20px;line-height:1.45}
.si-steps>li>p{font-size:14px;margin-top:8px;max-width:none}
.si-warranty{padding:55px 0}
.si-warranty-grid{grid-template-columns:1fr;gap:40px}
.si-cover{padding:28px 24px}
.si-cover h3{font-size:29px;margin-block:27px}
.si-cover li{font-size:13px}
}