/* Approved focused presentation. Brand tokens remain the source of color. */
.hero,.hero.service-hero{min-height:0;padding-bottom:72px}
.hero-copy h1,.service-hero .hero-copy h1{max-width:none;text-wrap:balance}
.hero-copy .heading-line{display:block}
.hero-copy h1{font-size:clamp(40px,4.2vw,60px);line-height:1.08}
h2,h3{ text-wrap:balance }
.hero-lead{max-width:42ch}
.portrait-media img,.home-editorial img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:center}
.home-editorial{order:0}
.editorial-split{gap:80px}
.editorial-copy h2{max-width:19ch}
.editorial-copy p{max-width:65ch}
.team-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);gap:64px;align-items:center}
.team-video{margin:0;overflow:hidden;background:var(--ink)}
.team-video video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.team-copy{max-width:65ch}
.team-copy h2{max-width:none}
.section-intro{max-width:65ch}
.service-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}
.service-choice{display:block;min-width:0}
.service-image{overflow:hidden;aspect-ratio:4/3;background:var(--paper);border-radius:var(--radius)}
.service-image img{display:block;width:100%;height:100%;object-fit:cover}
.service-label{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px}
.service-choice h3{font-size:24px;text-wrap:initial}
.service-label>span{font-size:24px}
.service-choice:hover h3{color:var(--focus)}
.process-list h3{font-size:24px}
.process-list p{font-size:16px;max-width:35ch}
.scope-row h3{font-size:25px}
.scope-row p{font-size:16px}
.questions-layout h2{max-width:16ch}
.faq-list p{font-size:16px;line-height:1.65}
.faq-list summary{font-size:15px}
.closing-grid{display:grid;grid-template-columns:1fr;gap:16px;justify-items:start}
.closing h2{font-size:40px;text-wrap:balance}
.closing p{margin:12px 0 0;max-width:55ch}
.closing .button{justify-self:start}
[data-sf-native] .sf-header{margin-bottom:24px}
[data-sf-native] .sf-heading{font-family:var(--font-display);font-size:28px;line-height:1.15;letter-spacing:-.035em;font-weight:700;text-wrap:balance}
[data-sf-native] .sf-intro{font-size:14px;line-height:1.6;color:var(--muted);margin-top:14px}
[data-sf-native] .sf-legend{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
[data-sf-native] .sf-field{grid-column:1/-1}
[data-sf-native] .sf-file{padding:12px;border:1px solid var(--line);background:var(--paper);max-width:100%}
[data-sf-native] .sf-followup{display:grid;gap:14px;margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}
[data-sf-native] .sf-followup h3{font-size:22px}
.hero .hero-photo{object-position:50% 50%}
@media(min-width:701px){
  [data-sf-native] .sf-field[data-width="50"]{grid-column:span 1}
  [data-sf-native] .sf-field[data-width="100"]{grid-column:1/-1}
}
@media(max-width:1100px){.editorial-split{gap:48px}.hero-copy h1{font-size:44px}.service-choice h3{font-size:22px}}
@media(max-width:900px){.hero-copy h1{font-size:38px}.editorial-split{gap:32px}.team-layout{gap:32px}.scope-row h3{font-size:22px}}
@media(max-width:700px){
  .hero,.hero.service-hero{padding:116px 0 40px}
  .hero-copy,.service-hero .hero-copy{min-height:280px}
  .hero-photo,.hero-shade,.hero::after,.service-hero .hero-photo,.service-hero .hero-shade,.service-hero::after{height:460px}
  .hero-grid,.hero.service-hero .hero-grid{gap:32px}
  .hero-copy h1{font-size:38px;max-width:none}
  .hero-copy .heading-line{display:block}
  .hero-lead{max-width:34ch}
  .editorial-split{gap:30px}
  .team-layout{grid-template-columns:1fr;gap:30px}
  .portrait-media,.home-editorial{order:0}
  .editorial-copy h2{font-size:32px;max-width:none}
  .service-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 16px}
  .service-label{align-items:flex-start;gap:6px;padding-top:12px}
  .service-choice h3{font-size:18px;line-height:1.3}
  .service-label>span{font-size:18px}
  .scope-row h3{font-size:24px}
  .process-list h3{font-size:24px}
  .closing-grid{grid-template-columns:1fr;gap:16px}
  .closing h2{font-size:32px}
  .closing .button{justify-self:start}
  [data-sf-native] .sf-heading{font-size:28px}
}
@media(max-width:359px){.hero-copy h1{font-size:34px}.hero-copy .eyebrow{font-size:9px}.inquiry{padding-inline:20px}}

.hero-copy .heading-line + .heading-line::before{content:none}
/* Stack the quote form before it can cover the centered subject on tablets. */
@media(min-width:701px) and (max-width:900px){
  .hero,.hero.service-hero{padding:140px 0 50px;background:var(--paper)}
  .hero-grid,.hero.service-hero .hero-grid{grid-template-columns:1fr;gap:32px}
  .hero-copy,.service-hero .hero-copy{min-height:300px;max-width:540px}
  .hero-photo,.hero-shade,.hero::after,.service-hero .hero-photo,.service-hero .hero-shade,.service-hero::after{height:500px}
  .hero .inquiry{width:min(100%,580px);justify-self:center}
}
/* Preserve the manufacturer's product proportions inside the square frame. */
[data-page=battery-backup] .portrait-media{aspect-ratio:1;overflow:hidden}
[data-page=battery-backup] .portrait-media img{height:100%;aspect-ratio:auto;object-fit:contain;transform:scale(1.35) translateY(-11%)}

/* Keep the charger on the text side of the homepage composition. */
[data-page=home] .hero-photo,[data-page=ev-charger-installation] .hero-photo{transform:scaleX(-1)}
/* Small interactions keep the content readable and available throughout. */
.service-image img{transition:transform 360ms cubic-bezier(.22,1,.36,1)}
.button,.sf-primary,.service-label>span{transition:transform 220ms ease-out,background-color 220ms ease-out,color 220ms ease-out}
@media(hover:hover){
  .service-choice:hover .service-image img{transform:scale(1.035)}
  .service-choice:hover .service-label>span{transform:translate(2px,-2px)}
  .button:hover,.sf-primary:not(:disabled):hover{transform:translateY(-2px)}
}
.button:active,.sf-primary:not(:disabled):active{transform:translateY(0)}
.service-choice:focus-visible{outline:3px solid var(--focus);outline-offset:6px}
[data-sf-native] .sf-control{transition:border-color 180ms ease-out,background-color 180ms ease-out}
[data-sf-native] .sf-control:focus{background-color:var(--surface)}
@keyframes form-arrive{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.smart-form-mount[data-sf-state=details]>.sf-header,.smart-form-mount[data-sf-state=details]>.sf-form{animation:form-arrive 320ms ease-out both}
@keyframes form-loading{from{opacity:.35}to{opacity:.8}}
.smart-form-mount:empty::before,.smart-form-mount[data-sf-state=loading]::after{content:"";display:block;height:4px;width:72px;margin-top:20px;background:var(--accent);animation:form-loading 900ms ease-out infinite alternate}
@media(prefers-reduced-motion:reduce){
  .service-image img,.button,.sf-primary,.service-label>span,[data-sf-native] .sf-control{transition:none}
  .smart-form-mount[data-sf-state=details]>.sf-header,.smart-form-mount[data-sf-state=details]>.sf-form,.smart-form-mount:empty::before,.smart-form-mount[data-sf-state=loading]::after{animation:none}
  .service-choice:hover .service-image img,.service-choice:hover .service-label>span,.button:hover,.sf-primary:not(:disabled):hover{transform:none}
}
