@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/poppins-Medium.woff") format("woff")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600 800;font-display:swap;src:url("../fonts/poppins-Bold.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/inter-Regular.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/inter-Medium.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/inter-SemiBold.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/inter-Bold.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/inter-Bold.woff") format("woff")}
/* =========================================================
   GreenCube Energies - site stylesheet
   Tokens: panel navy (cells), busbar silver, cool paper,
   saffron sun (actions), leaf green (savings).
   Type: Archivo, using its width axis for personality.
   ========================================================= */
:root{
  --cell:#0E2A47; --cell-2:#16395E; --cell-3:#1F4C78;
  --busbar:#C8D3DE; --paper:#F4F7FA; --white:#FFFFFF;
  --ink:#2A3947; --muted:#5D6D7D; --line:#E1E7EC;
  --sun:#F2B21B; --sun-deep:#D99A00; --leaf:#1F7F55; --leaf-soft:#E5F3EC;
  --danger:#B3261E;
  --r-sm:6px; --r-md:10px; --r-lg:16px;
  --wrap:1320px; --gutter:clamp(16px,3vw,40px);
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --font-head:"Poppins","Inter",system-ui,sans-serif; --sky:#1E9BE9; --saffron:#F57C1F; --night:#071A2E;
  --shadow:0 18px 40px -24px rgba(14,42,71,.45);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:17px;line-height:1.6;color:var(--ink);background:var(--white);font-stretch:100%}
img{max-width:100%;display:block}
a{color:var(--cell-3);text-underline-offset:3px}
a:hover{color:var(--cell)}
:focus-visible{outline:3px solid var(--sun);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-999px;top:8px;background:var(--sun);color:var(--cell);padding:8px 14px;z-index:100;font-weight:700}
.skip:focus{left:8px}

/* ---------- type ---------- */
h1,h2,h3,h4{font-stretch:118%;font-weight:750;line-height:1.12;letter-spacing:-.012em;color:var(--cell);margin:0 0 .5em}
h1{font-size:clamp(2.1rem,4.6vw,3.6rem)}
h2{font-size:clamp(1.65rem,3vw,2.45rem)}
h3{font-size:clamp(1.15rem,1.6vw,1.35rem);font-stretch:110%}
h4{font-size:1.05rem;font-stretch:105%}
p{margin:0 0 1em;max-width:68ch}
.lead{font-size:clamp(1.05rem,1.4vw,1.22rem);color:var(--muted);max-width:60ch}
.small{font-size:.88rem;color:var(--muted)}
.kicker{display:block;font-size:.95rem;font-weight:600;color:var(--leaf);margin-bottom:.4em;font-stretch:100%}
.on-dark .kicker{color:var(--sun)}
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4{color:var(--white)}
.on-dark,.on-dark p{color:#D7E1EB}
.on-dark .lead{color:#C6D3E0}
.on-dark a{color:var(--sun)}

/* ---------- layout ---------- */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.band{padding:clamp(56px,8vw,104px) 0}
.band.tight{padding:clamp(40px,5vw,64px) 0}
.band.paper{background:var(--paper)}
.band.navy{background:var(--cell)}
.band.navy-2{background:var(--cell-2)}
.grid{display:grid;gap:clamp(18px,2.4vw,32px)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center}
.split.top{align-items:start}
.head{max-width:760px;margin-bottom:clamp(28px,4vw,48px)}
.head.row{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.stack>*+*{margin-top:12px}
@media (max-width:960px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(2,minmax(0,1fr))}.split{grid-template-columns:1fr}}
@media (max-width:620px){.g2,.g3,.g4{grid-template-columns:1fr}body{font-size:16px}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:var(--r-sm);font:inherit;font-weight:700;font-stretch:108%;font-size:1rem;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.btn-sun{background:var(--sun);color:var(--cell)}
.btn-sun:hover{background:var(--sun-deep);color:var(--cell)}
.btn-line{border-color:var(--cell);color:var(--cell);background:transparent}
.btn-line:hover{background:var(--cell);color:var(--white)}
.on-dark .btn-line{border-color:#9FB3C8;color:var(--white)}
.on-dark .btn-line:hover{background:var(--white);color:var(--cell)}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.textlink{font-weight:700;text-decoration:none;border-bottom:2px solid var(--sun);color:var(--cell)}
.on-dark .textlink{color:var(--white)}

/* ---------- header ---------- */
.topbar{background:var(--cell);color:#D7E1EB;font-size:.9rem}
.topbar .wrap{display:flex;justify-content:space-between;gap:16px;min-height:38px;align-items:center;flex-wrap:wrap}
.topbar a{color:var(--white);text-decoration:none;font-weight:600}
.topbar .offer a{color:var(--sun)}
.topbar .contacts{display:flex;gap:18px}
header.site{position:sticky;top:0;z-index:1100;background:rgba(255,255,255,.97);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;gap:24px;min-height:72px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--cell);flex-shrink:0}
.logo svg{width:38px;height:38px}
.logo b{display:block;font-stretch:120%;font-weight:800;font-size:1.12rem;line-height:1}
.logo small{display:block;font-size:.72rem;color:var(--muted);font-weight:500;letter-spacing:.02em}
nav.main{margin-left:auto}
nav.main>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
nav.main>ul>li{position:relative}
nav.main>ul>li>a,nav.main>ul>li>button{display:flex;align-items:center;gap:6px;padding:10px 12px;font:inherit;font-weight:600;font-size:.97rem;color:var(--ink);text-decoration:none;background:none;border:0;cursor:pointer;border-radius:var(--r-sm)}
nav.main>ul>li>a:hover,nav.main>ul>li>button:hover,nav.main>ul>li>button[aria-expanded="true"]{background:var(--paper);color:var(--cell)}
nav.main a[aria-current="page"]{color:var(--cell);box-shadow:inset 0 -2px 0 var(--sun)}
.chev{width:10px;height:10px;transition:transform .15s}
button[aria-expanded="true"] .chev{transform:rotate(180deg)}
.dropdown{position:absolute;top:calc(100% + 6px);left:0;min-width:270px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow);padding:8px;list-style:none;margin:0;display:none}
.dropdown.open{display:block}
.dropdown a{display:block;padding:9px 12px;border-radius:var(--r-sm);text-decoration:none;color:var(--ink);font-size:.95rem}
.dropdown a span{display:block;font-size:.82rem;color:var(--muted)}
.dropdown a:hover{background:var(--paper)}
.head-cta{display:flex;gap:10px;align-items:center}
.head-cta .login{font-weight:600;text-decoration:none;color:var(--cell);padding:10px}
.menu-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:var(--r-sm);width:46px;height:46px;cursor:pointer}
.menu-toggle span{display:block;width:20px;height:2px;background:var(--cell);margin:4px auto}
@media (max-width:1120px){
  .menu-toggle{display:block}
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:1px solid var(--line);max-height:calc(100vh - 110px);overflow:auto;padding:8px var(--gutter) 20px;margin:0}
  nav.main.open{display:block}
  nav.main>ul{flex-direction:column}
  nav.main>ul>li>a,nav.main>ul>li>button{width:100%;justify-content:space-between;padding:14px 8px;border-bottom:1px solid var(--line);border-radius:0}
  .dropdown{position:static;box-shadow:none;border:0;padding:0 0 8px 8px}
  .head-cta .btn{display:none}
  .head-cta{order:2}
}
@media (max-width:620px){.topbar .offer{display:none}.logo small{display:none}}

/* ---------- the solar panel motif ---------- */
.panel{--cols:6;display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:3px;padding:10px;background:#9AA9B8;border-radius:8px;box-shadow:var(--shadow);aspect-ratio:var(--ar,6/10)}
.panel i{position:relative;background:linear-gradient(160deg,var(--cell-3),var(--cell) 70%);border-radius:2px;overflow:hidden}
.panel i::before{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,transparent 31%,rgba(200,211,222,.55) 31%,rgba(200,211,222,.55) 33%,transparent 33%,transparent 66%,rgba(200,211,222,.55) 66%,rgba(200,211,222,.55) 68%,transparent 68%)}
.panel i::after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(255,214,102,.0),rgba(255,214,102,.55));opacity:0;transition:opacity .6s}
.panel.lit i::after{opacity:1;transition-delay:calc(var(--d) * 45ms)}
.panel.lit.fade i::after{opacity:.18;transition:opacity 1.6s ease;transition-delay:calc(1.2s + var(--d) * 20ms)}
@media (prefers-reduced-motion:reduce){.panel i::after{transition:none!important}}

/* ---------- hero (home) ---------- */
.hero{position:relative;background:var(--cell);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:center;padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(56px,7vw,96px)}
.hero h1{color:var(--white);font-stretch:122%}
.hero .lead{color:#C6D3E0}
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:22px 0 0}
.chips li{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(200,211,222,.35);border-radius:999px;color:var(--white);font-size:.92rem;font-weight:600}
.chips svg{width:16px;height:16px;color:var(--sun);flex-shrink:0}
.hero-visual{position:relative;max-width:440px;justify-self:end;width:100%}
.hero-visual .panel{transform:perspective(1100px) rotateY(-14deg) rotateX(6deg);--ar:6/8}
.billcard{position:absolute;left:-18%;bottom:-6%;background:var(--white);border-radius:var(--r-md);padding:16px 18px;box-shadow:var(--shadow);width:min(270px,70%)}
.billcard .row{display:flex;justify-content:space-between;gap:10px;font-size:.92rem;padding:6px 0;border-bottom:1px dashed var(--line)}
.billcard .row:last-of-type{border:0}
.billcard strong{font-stretch:112%}
.billcard .after strong{color:var(--leaf)}
.billcard .note{font-size:.74rem;color:var(--muted);margin:8px 0 0}
@media (max-width:960px){.hero .wrap{grid-template-columns:1fr}.hero-visual{justify-self:center;max-width:360px;margin-top:12px}.billcard{left:-6%}}

/* ---------- page hero (inner) ---------- */
.page-hero{background:var(--cell);position:relative;overflow:hidden}
.page-hero .wrap{padding-top:clamp(40px,6vw,76px);padding-bottom:clamp(40px,6vw,76px);position:relative;z-index:1}
.page-hero h1{color:var(--white);max-width:20ch}
.page-hero .lead{color:#C6D3E0}
.page-hero::after{content:"";position:absolute;right:-60px;top:-40px;width:420px;height:420px;opacity:.16;background:
 repeating-linear-gradient(90deg,transparent 0 62px,#9AA9B8 62px 65px),repeating-linear-gradient(0deg,transparent 0 92px,#9AA9B8 92px 95px);transform:rotate(-8deg)}
.crumbs{font-size:.88rem;margin-bottom:18px;color:#9FB3C8}
.crumbs a{color:#C6D3E0;text-decoration:none}
.crumbs a:hover{color:var(--white)}

/* ---------- stats strip ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(200,211,222,.25)}
.stats div{padding:26px 20px 0 0}
.stats b{display:block;font-size:clamp(2rem,3.4vw,2.8rem);font-stretch:125%;font-weight:800;color:var(--white);line-height:1}
.stats span{color:#B9C8D7;font-size:.95rem}
.stats.light{border-color:var(--line)}
.stats.light b{color:var(--cell)}
.stats.light span{color:var(--muted)}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ---------- comparison (bill today vs with solar) ---------- */
.compare{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--white)}
.compare>div{padding:clamp(20px,3vw,32px)}
.compare .after{background:var(--leaf-soft)}
.compare h3{margin-bottom:14px}
.compare dl{margin:0;display:grid;grid-template-columns:1fr auto;gap:10px 16px}
.compare dt{color:var(--muted)}
.compare dd{margin:0;font-weight:700;text-align:right;font-stretch:110%}
.compare .after dd{color:var(--leaf)}
.compare .total{border-top:1px solid var(--line);padding-top:10px;font-size:1.15rem}
@media (max-width:620px){.compare{grid-template-columns:1fr}}

/* ---------- service list (home) ---------- */
.svc-list{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--cell)}
.svc{display:block;padding:26px 24px 28px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.svc:nth-child(3n+2),.svc:nth-child(3n+3){padding-left:24px;border-left:1px solid var(--line)}
.svc h3{display:flex;justify-content:space-between;gap:12px}
.svc p{color:var(--muted);margin-bottom:10px}
.svc .proof{font-size:.88rem;font-weight:600;color:var(--leaf)}
.svc:hover h3{color:var(--cell-3);text-decoration:underline;text-decoration-color:var(--sun);text-decoration-thickness:3px;text-underline-offset:5px}
@media (max-width:960px){.svc-list{grid-template-columns:1fr 1fr}.svc:nth-child(3n+2),.svc:nth-child(3n+3){padding-left:0;border-left:0}.svc:nth-child(2n){padding-left:24px;border-left:1px solid var(--line)}}
@media (max-width:620px){.svc-list{grid-template-columns:1fr}.svc:nth-child(2n){padding-left:0;border-left:0}}

/* ---------- timeline (real sequence) ---------- */
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,5),1fr);counter-reset:step;position:relative}
.timeline::before{content:"";position:absolute;top:21px;left:22px;right:22px;height:2px;background:repeating-linear-gradient(90deg,var(--sun) 0 10px,transparent 10px 16px)}
.timeline li{position:relative;padding-right:18px}
.timeline li::before{counter-increment:step;content:counter(step);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--cell);color:var(--sun);font-weight:800;font-stretch:120%;position:relative;margin-bottom:14px;border:3px solid var(--white)}
.on-dark .timeline li::before{border-color:var(--cell)}
.timeline h4{margin-bottom:4px}
.timeline p{font-size:.94rem;color:var(--muted)}
.on-dark .timeline p{color:#B9C8D7}
@media (max-width:860px){.timeline{grid-template-columns:1fr;gap:6px}.timeline::before{top:0;bottom:0;left:21px;right:auto;width:2px;height:auto;background:repeating-linear-gradient(180deg,var(--sun) 0 10px,transparent 10px 16px)}.timeline li{display:grid;grid-template-columns:44px 1fr;gap:0 16px}.timeline li::before{grid-row:span 2;margin:0}}

/* ---------- photo slots ---------- */
.photo{position:relative;margin:0;border-radius:var(--r-md);overflow:hidden;background:var(--cell);aspect-ratio:var(--ar,4/3)}
.photo:has(img[src*="ill=1"])::after{content:"Illustrative image";position:absolute;top:8px;right:8px;z-index:2;font:600 11px/1 Inter,Arial,sans-serif;color:#fff;background:rgba(14,42,71,.72);padding:4px 7px;border-radius:6px;pointer-events:none}
.photo::before{content:"";position:absolute;inset:0;background:
 linear-gradient(160deg,rgba(31,76,120,.0),rgba(14,42,71,.65)),
 repeating-linear-gradient(90deg,transparent 0 46px,rgba(154,169,184,.55) 46px 49px),
 repeating-linear-gradient(0deg,transparent 0 70px,rgba(154,169,184,.55) 70px 73px),
 linear-gradient(135deg,var(--cell-3),var(--cell));}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.photo figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:14px 16px;color:var(--white);font-size:.9rem;background:linear-gradient(transparent,rgba(9,24,40,.85))}
.photo figcaption b{display:block;font-stretch:112%;font-size:1rem}

/* ---------- gallery / carousel ---------- */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,32%);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin}
.rail>*{scroll-snap-align:start}
@media (max-width:620px){.rail{grid-auto-columns:82%}}
.rail-nav{display:flex;gap:8px}
.rail-nav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--white);cursor:pointer;font-size:1.1rem;color:var(--cell)}
.on-dark .rail-nav button{background:transparent;color:var(--white);border-color:rgba(200,211,222,.4)}

/* ---------- result card ---------- */
.result{display:grid;grid-template-columns:1fr 1.2fr;border-radius:var(--r-lg);overflow:hidden;background:var(--white);box-shadow:var(--shadow)}
.result .body{padding:clamp(22px,3vw,36px)}
.result .figures{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:18px 0}
.result .figures b{display:block;font-size:1.7rem;font-stretch:120%;color:var(--cell);line-height:1.1}
.result .figures b.good{color:var(--leaf)}
.result .figures span{font-size:.88rem;color:var(--muted)}
@media (max-width:760px){.result{grid-template-columns:1fr}}

/* ---------- project cards ---------- */
.proj{text-decoration:none;color:var(--ink);display:block}
.proj .photo{margin-bottom:12px}
.proj h3{margin-bottom:4px}
.proj .meta{display:flex;gap:14px;flex-wrap:wrap;font-size:.9rem;color:var(--muted)}
.proj .meta b{color:var(--cell)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.filters button{padding:9px 16px;border-radius:999px;border:1px solid var(--line);background:var(--white);font:inherit;font-weight:600;font-size:.93rem;cursor:pointer;color:var(--ink)}
.filters button[aria-pressed="true"]{background:var(--cell);color:var(--white);border-color:var(--cell)}

/* ---------- quotes / testimonials ---------- */
.quote{margin:0;padding:24px 0 0;border-top:2px solid var(--sun)}
.quote p{font-size:1.06rem;color:var(--ink)}
.quote footer{font-size:.92rem;color:var(--muted)}
.quote footer b{color:var(--cell)}
.on-dark .quote p{color:var(--white)}
.on-dark .quote footer{color:#B9C8D7}
.on-dark .quote footer b{color:var(--sun)}
.rating{display:flex;align-items:center;gap:14px}
.stars{color:var(--sun);letter-spacing:2px;font-size:1.2rem}
.video-tile{position:relative}
.video-tile .play{position:absolute;z-index:3;left:50%;top:44%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:var(--sun);display:grid;place-items:center}
.video-tile .play svg{width:20px;height:20px;margin-left:3px;color:var(--cell)}

/* ---------- brand tiles ---------- */
.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.brands div{background:var(--white);padding:22px 18px;min-height:96px;display:flex;flex-direction:column;justify-content:center}
.brands b{font-stretch:120%;font-size:1.15rem;color:var(--cell)}
.brands span{font-size:.85rem;color:var(--muted)}

/* ---------- feature list ---------- */
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ticks li{position:relative;padding-left:30px}
.ticks li::before{content:"";position:absolute;left:0;top:.35em;width:18px;height:18px;border-radius:50%;background:var(--leaf-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3 3 7-7' fill='none' stroke='%231F7F55' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.on-dark .ticks li::before{background-color:rgba(255,255,255,.12)}
.ticks.cols{grid-template-columns:1fr 1fr;gap:12px 28px}
@media (max-width:620px){.ticks.cols{grid-template-columns:1fr}}
.feature h3{display:flex;gap:12px;align-items:center}
.feature .ico{width:42px;height:42px;border-radius:var(--r-sm);background:var(--paper);display:grid;place-items:center;flex-shrink:0;color:var(--cell)}
.on-dark .feature .ico{background:rgba(255,255,255,.08);color:var(--sun)}
.feature .ico svg{width:22px;height:22px}
.feature p{color:var(--muted)}
.on-dark .feature p{color:#B9C8D7}
.box{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:clamp(20px,2.6vw,30px)}
.box.paper{background:var(--paper);border-color:transparent}
.box.navy{background:var(--cell);border:0}
.note{border-left:4px solid var(--sun);background:#FFF8E6;padding:14px 18px;border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:.94rem;color:#4A3B12}

/* ---------- tables ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md)}
table.data{border-collapse:collapse;width:100%;font-size:.95rem;min-width:520px}
table.data th,table.data td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
table.data th{background:var(--paper);font-stretch:108%;color:var(--cell)}
table.data tr:last-child td{border-bottom:0}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;font-weight:700;font-stretch:108%;color:var(--cell);position:relative;font-size:1.05rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;border-right:2px solid var(--cell);border-bottom:2px solid var(--cell);transform:translateY(-70%) rotate(45deg);transition:transform .15s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{color:var(--muted);padding-bottom:16px;margin:0}

/* ---------- forms ---------- */
.form{display:grid;gap:14px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:620px){.form .two{grid-template-columns:1fr}}
.form label{display:block;font-weight:600;font-size:.93rem;margin-bottom:6px;color:var(--ink)}
.on-dark .form label{color:var(--white)}
.form input,.form select,.form textarea{width:100%;min-height:48px;padding:11px 14px;border:1px solid #B8C5D3;border-radius:var(--r-sm);font:inherit;font-size:1rem;background:var(--white);color:var(--ink)}
.form textarea{min-height:110px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:3px solid rgba(242,178,27,.6);border-color:var(--sun-deep)}
.form .err{color:var(--danger);font-size:.86rem;margin-top:4px;display:none}
.form .invalid input,.form .invalid select{border-color:var(--danger)}
.form .invalid .err{display:block}
.form .consent{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;color:var(--muted)}
.on-dark .form .consent{color:#B9C8D7}
.form .consent input{width:18px;min-height:18px;margin-top:3px}
.form-done{display:none;padding:22px;border-radius:var(--r-md);background:var(--leaf-soft);color:var(--ink)}
.form-done h3{color:var(--leaf)}
.sent .form-done{display:block}
.sent .form{display:none}

/* ---------- estimate output ---------- */
.estimate{display:none;margin-top:18px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);background:var(--white)}
.estimate.show{display:block}
.estimate .grid4{display:grid;grid-template-columns:repeat(2,1fr)}
.estimate .grid4 div{padding:16px 18px;border-bottom:1px solid var(--line)}
.estimate .grid4 div:nth-child(odd){border-right:1px solid var(--line)}
.estimate b{display:block;font-size:1.45rem;font-stretch:118%;color:var(--cell)}
.estimate b.good{color:var(--leaf)}
.estimate span{font-size:.86rem;color:var(--muted)}
.estimate p{padding:12px 18px;margin:0;font-size:.8rem;color:var(--muted);max-width:none}

/* ---------- CTA band ---------- */
.cta-band{background:var(--sun)}
.cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding-top:42px;padding-bottom:42px}
.cta-band h2{margin:0;color:var(--cell);max-width:24ch}
.cta-band p{margin:6px 0 0;color:#3A2F0C}
.cta-band .btn-line{border-color:var(--cell)}

/* ---------- group band ---------- */
.group-band{background:var(--leaf);color:var(--white)}
.group-band .wrap{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-top:26px;padding-bottom:26px}
.group-band p{margin:0;color:var(--white);font-weight:600;font-size:1.06rem}
.group-band a{color:var(--white);font-weight:700}

/* ---------- app / portal mock ---------- */
.phone{width:min(300px,80%);margin:0 auto;border-radius:34px;background:#0A1C30;padding:12px;box-shadow:var(--shadow)}
.phone .screen{background:var(--paper);border-radius:24px;padding:18px 16px;min-height:520px}
.phone .screen h4{font-size:.95rem}
.phone .tile{background:var(--white);border-radius:12px;padding:12px 14px;margin-bottom:10px;font-size:.85rem;color:var(--muted)}
.phone .tile b{display:block;color:var(--cell);font-size:1.25rem;font-stretch:118%}
.steps-bar{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:8px}
.steps-bar i{height:6px;border-radius:3px;background:var(--line)}
.steps-bar i.done{background:var(--leaf)}
.steps-bar i.now{background:var(--sun)}

/* ---------- article ---------- */
.article{max-width:740px}
.article h2{margin-top:1.6em}
.article ul,.article ol{padding-left:1.2em}
.article li{margin-bottom:.4em}
.byline{display:flex;gap:12px;align-items:center;font-size:.92rem;color:#C6D3E0}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--sun);color:var(--cell);display:grid;place-items:center;font-weight:800;font-stretch:120%}

/* ---------- job list ---------- */
.job{display:grid;grid-template-columns:1fr auto;gap:12px 24px;padding:22px 0;border-bottom:1px solid var(--line);align-items:center}
.job h3{margin:0 0 4px}
.job .meta{color:var(--muted);font-size:.92rem;display:flex;gap:16px;flex-wrap:wrap}
@media (max-width:620px){.job{grid-template-columns:1fr}}

/* ---------- login ---------- */
.tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:22px}
.tabs button{flex:1;padding:14px;background:none;border:0;border-bottom:3px solid transparent;font:inherit;font-weight:700;color:var(--muted);cursor:pointer}
.tabs button[aria-selected="true"]{color:var(--cell);border-bottom-color:var(--sun)}

/* ---------- footer ---------- */
footer.site{background:#0A1F36;color:#B9C8D7;font-size:.95rem}
footer.site .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding:64px 0 40px}
footer.site h4{color:var(--white);font-size:1rem;margin-bottom:14px}
footer.site ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
footer.site a{color:#D7E1EB;text-decoration:none}
footer.site a:hover{color:var(--sun)}
footer.site .logo{color:var(--white)}
footer.site .logo small{color:#9FB3C8}
footer.site address{font-style:normal;margin:16px 0}
footer.site .social{display:flex;gap:10px;margin-top:14px}
footer.site .social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(200,211,222,.3);display:grid;place-items:center}
footer.site .social svg{width:18px;height:18px}
footer.site .base{border-top:1px solid rgba(200,211,222,.18);padding:20px 0 28px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.86rem}
@media (max-width:960px){footer.site .cols{grid-template-columns:1fr 1fr}}
@media (max-width:620px){footer.site .cols{grid-template-columns:1fr}}

/* ---------- floating actions (mobile) ---------- */
.float-wa{position:fixed;right:18px;bottom:18px;z-index:60;width:56px;height:56px;border-radius:50%;background:#1FA855;display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.45)}
.float-wa svg{width:28px;height:28px;color:#fff}
.mobile-bar{display:none}
@media (max-width:760px){
  .float-wa{display:none}
  .mobile-bar{display:grid;grid-template-columns:1fr 1fr 1.3fr;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--white);border-top:1px solid var(--line);box-shadow:0 -6px 20px -12px rgba(0,0,0,.3)}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:56px;font-weight:700;text-decoration:none;color:var(--cell);font-size:.93rem}
  .mobile-bar a.go{background:var(--sun)}
  body{padding-bottom:56px}
}
.hide-sm{}
@media (max-width:620px){.hide-sm{display:none}}

/* ---------- fixes: buttons and light boxes inside dark bands ---------- */
.on-dark a.btn-sun,a.btn-sun{color:var(--cell)}
.on-dark a.btn-line{color:var(--white)}
.on-dark a.btn-line:hover{color:var(--cell)}
.cta-band a.btn-line{color:var(--cell)}
.cta-band a.btn-line:hover{color:var(--white)}
.on-dark .box:not(.navy),.on-dark .box:not(.navy) p{color:var(--ink)}
.on-dark .box:not(.navy) h2,.on-dark .box:not(.navy) h3{color:var(--cell)}
.on-dark .box:not(.navy) .form label{color:var(--ink)}
.on-dark .box:not(.navy) .form .consent{color:var(--muted)}
.on-dark .box:not(.navy) a:not(.btn){color:var(--cell-3)}
.on-dark .billcard span{color:var(--muted)}
.on-dark .billcard strong{color:var(--ink)}
.on-dark .billcard .after strong{color:var(--leaf)}
.on-dark .billcard .note{color:var(--muted)}
.on-dark .timeline li::before{background:var(--sun);color:var(--cell);border-color:var(--cell)}
.band.navy-2 .timeline li::before{border-color:var(--cell-2)}
.hero .wrap.hero-stats{display:block;padding-top:0;padding-bottom:48px}
.feature h4{display:flex;gap:10px;align-items:center}
.feature h4 svg{width:22px;height:22px;color:var(--leaf);flex-shrink:0}
.split.wide-right{grid-template-columns:.85fr 1.15fr}
.compare dd{white-space:nowrap}
@media (max-width:960px){.split.wide-right{grid-template-columns:1fr}}
.mobile-bar svg{width:18px;height:18px}
@media (max-width:620px){.hero-visual{max-width:260px}.billcard{left:-14%;bottom:-10%;width:78%}.hero-visual .panel{transform:none}}
.form .two{align-items:end}
/* ---------- brand logo (image) ---------- */
.logo img{height:52px;width:auto}
footer.site .logo img{height:62px}
@media (max-width:620px){.logo img{height:42px}}
/* header fit with Home link */
.btn{white-space:nowrap}
header.site .wrap{gap:18px}
nav.main>ul>li>a,nav.main>ul>li>button{padding:10px 10px}
@media (max-width:1260px){
  .menu-toggle{display:block}
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:1px solid var(--line);max-height:calc(100vh - 110px);overflow:auto;padding:8px var(--gutter) 20px;margin:0}
  nav.main.open{display:block}
  nav.main>ul{flex-direction:column}
  nav.main>ul>li>a,nav.main>ul>li>button{width:100%;justify-content:space-between;padding:14px 8px;border-bottom:1px solid var(--line);border-radius:0}
  .dropdown{position:static;box-shadow:none;border:0;padding:0 0 8px 8px}
  .head-cta{order:2}
}
@media (max-width:620px){.head-cta .btn{display:none}}
/* ---------- hidden items (filters) ---------- */
[hidden]{display:none!important}

/* ---------- blog cards with topic illustrations ---------- */
.post-card{display:block;text-decoration:none;color:var(--ink)}
.thumb{border-radius:var(--r-md);overflow:hidden;margin-bottom:14px;border:1px solid var(--line)}
.thumb svg{display:block;width:100%;height:auto}
.post-card h3{margin-bottom:6px}
.post-card:hover h3{text-decoration:underline;text-decoration-color:var(--sun);text-decoration-thickness:3px;text-underline-offset:4px}
.article-layout{grid-template-columns:minmax(0,1fr) 340px}
.article-layout aside{position:sticky;top:96px}
@media (max-width:960px){.article-layout{grid-template-columns:1fr}.article-layout aside{position:static}}

/* ---------- job filters ---------- */
.job-filters{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px;margin-bottom:10px}
.jf-row{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;padding:6px 0}
.jf-label{font-weight:700;color:var(--cell);font-size:.95rem}
.job-filters .filters{margin:0}
.jf-search{width:100%;max-width:420px;min-height:44px;padding:10px 14px;border:1px solid #B8C5D3;border-radius:var(--r-sm);font:inherit}
.empty{padding:28px 0}
@media (max-width:620px){.jf-row{grid-template-columns:1fr;gap:6px}}
/* ---------- honeypot (spam trap) ---------- */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- social strip on home ---------- */
.social-strip{background:var(--cell-2)}
.social-strip .wrap{display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap;padding-top:36px;padding-bottom:36px}
.social-strip h2{color:var(--white);margin:0 0 4px;font-size:clamp(1.3rem,2.2vw,1.7rem)}
.social-strip p{color:#C6D3E0;margin:0}
.social-btns{display:flex;gap:10px;flex-wrap:wrap}
.social-btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px;border-radius:var(--r-sm);background:var(--white);color:var(--cell);font-weight:700;text-decoration:none}
.social-btn svg{width:20px;height:20px}
.social-btn.instagram svg{color:#C13584}.social-btn.linkedin svg{color:#0A66C2}.social-btn.youtube svg{color:#E62117}.social-btn.facebook svg{color:#1877F2}
.social-btn:hover{background:var(--sun);color:var(--cell)}

/* ---------- downloads ---------- */
.dl-list{display:grid;gap:10px}
.dl{display:flex;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-md);text-decoration:none;color:var(--ink);background:var(--white)}
.dl .ico{width:42px;height:42px;border-radius:var(--r-sm);background:var(--paper);display:grid;place-items:center;color:var(--cell);flex-shrink:0}
.dl .ico svg{width:22px;height:22px}
.dl b{display:block;color:var(--cell)}.dl small{color:var(--muted)}
.dl:hover{border-color:var(--sun)}

/* ---------- job details ---------- */
.job-desc{margin-top:8px}.job-desc summary{cursor:pointer;font-weight:600;color:var(--cell-3);font-size:.92rem}
.job-desc p{font-size:.95rem;color:var(--muted);margin:8px 0 0}
/* ---------- authorised dealer logos ---------- */
.dealer-band{background:var(--white);border-bottom:1px solid var(--line)}
.dealer-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px 40px;flex-wrap:wrap;padding-top:22px;padding-bottom:22px}
.dealer-band p{margin:0;display:flex;flex-direction:column}
.dealer-band p b{font-stretch:115%;font-size:1.15rem;color:var(--cell)}
.dealer-band p span{color:var(--muted);font-size:.92rem}
.dealer-logos{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.dealer-logo{display:grid;place-items:center;min-width:170px;height:72px;padding:10px 22px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--white)}
.dealer-logo img.avaada{height:44px;width:auto}
.dealer-logo img.havells{height:30px;width:auto}
.brand-logo{gap:6px;align-items:flex-start}
.brands .brand-logo img.avaada{height:38px;width:auto}
.brands .brand-logo img.havells{height:24px;width:auto;margin:7px 0}
.brands .brand-logo span{font-size:.85rem;color:var(--leaf);font-weight:600}
.dealer-cards img.avaada{height:52px;width:auto;margin-bottom:14px}
.dealer-cards img.havells{height:34px;width:auto;margin:9px 0 23px}
.footer-dealers{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px}
.footer-dealers span{font-size:.85rem;color:#9FB3C8;width:100%}
.footer-dealers img{height:26px;width:auto}
.footer-dealers img[alt="Avaada"]{height:36px}
/* ---------- regional Instagram pages ---------- */
.social-strip .regional{flex-basis:100%;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:0;padding-top:14px;border-top:1px solid rgba(200,211,222,.25);color:#C6D3E0}
.social-strip .regional a{display:inline-flex;align-items:center;gap:8px;color:var(--white);font-weight:600;text-decoration:none}
.social-strip .regional a:hover{color:var(--sun)}
.social-strip .regional svg{width:18px;height:18px;color:#F58FB6}
.footer-regional{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:14px;font-size:.9rem}
.footer-regional span{width:100%;color:#9FB3C8;font-size:.85rem}
.social-strip .regional{max-width:none}
/* ---------- news ticker (home) ---------- */
.ticker{display:flex;align-items:stretch;background:var(--paper);border-bottom:1px solid var(--line);min-height:46px;overflow:hidden}
.tk-head{flex-shrink:0;display:flex;align-items:center;padding:0 18px;background:var(--leaf);color:var(--white);font-weight:700;font-stretch:110%;font-size:.95rem}
.tk-viewport{flex:1;overflow:hidden;display:flex;align-items:center;mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent)}
.tk-track{display:flex;gap:48px;list-style:none;margin:0;padding:0 24px;white-space:nowrap;width:max-content}
.ticker.run .tk-track{animation:tk var(--tk-dur,30s) linear infinite}
.ticker.paused .tk-track,.ticker:hover .tk-track,.ticker:focus-within .tk-track{animation-play-state:paused}
@keyframes tk{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk-track li{display:flex;align-items:center;gap:10px;font-size:.95rem;color:var(--ink)}
.tk-track a{color:var(--cell);font-weight:600;text-decoration:underline;text-decoration-color:var(--sun);text-underline-offset:3px}
.tk-track a:hover{color:var(--cell-3)}
.tk-badge{background:var(--sun);color:var(--cell);font-weight:700;font-size:.75rem;padding:2px 8px;border-radius:999px}
.tk-pause{flex-shrink:0;width:46px;border:0;border-left:1px solid var(--line);background:var(--white);color:var(--cell);font-weight:800;cursor:pointer;letter-spacing:-1px}
.tk-pause[aria-pressed="true"]{background:var(--sun)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (prefers-reduced-motion:reduce){.tk-viewport{overflow-x:auto}.ticker .tk-track{animation:none!important}.tk-pause{display:none}}
/* ---------- brand logo tiles ---------- */
.brands .brand-tile{background:var(--white);padding:18px;min-height:110px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;text-decoration:none;color:inherit}
.brands .brand-tile b{font-stretch:120%;font-size:1.15rem;color:var(--cell)}
.brands .brand-tile span{font-size:.85rem;color:var(--muted)}
.brands .brand-tile .dealer-tag{color:var(--leaf);font-weight:600}
.brands .brand-tile.has-logo img{max-height:48px;max-width:150px;width:auto;height:auto;object-fit:contain}
.brands .brand-tile.has-logo img[alt^="ISO"]{max-height:64px}
.brands .brand-tile.has-logo img[alt="Havells"]{max-height:26px;margin:11px 0}
a.brand-tile:hover{box-shadow:inset 0 -3px 0 var(--sun)}
.brands{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
@media (max-width:620px){
  .dealer-logos{width:100%;gap:12px}
  .dealer-logo{min-width:0;flex:1;height:64px;padding:8px 12px}
  .dealer-logo img.avaada{height:36px}.dealer-logo img.havells{height:22px}
  .estimate b{font-size:1.15rem}
}

/* =========================================================
   2026-10 refresh: wider layout, calmer type, shorter pages,
   swipe rows on phones.
   ========================================================= */
:root{--paper:#F3F7F6;--head:#163A5C;--r-md:12px;--r-lg:18px;--shadow:0 14px 34px -22px rgba(14,42,71,.35)}
body{font-size:16px;line-height:1.65;color:var(--ink);font-feature-settings:"cv11","ss01"}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:700;letter-spacing:-.015em;color:var(--head);font-stretch:normal}
h1{font-size:clamp(1.85rem,3.3vw,2.85rem);line-height:1.12}
h2{font-size:clamp(1.4rem,2.2vw,2rem);line-height:1.18}
h3{font-size:clamp(1.04rem,1.25vw,1.18rem);line-height:1.3}
h4{font-size:1rem}
p{max-width:72ch}
.lead{font-size:clamp(1rem,1.2vw,1.1rem);line-height:1.6}
.small{font-size:.86rem}
.kicker{display:inline-block;font-size:.9rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--leaf);background:none;padding:0;border-radius:0;margin-bottom:.4em}
.on-dark .kicker{color:#FFD873;background:rgba(242,178,27,.14)}
.on-dark,.on-dark p{color:#D3DEE8}
*{font-stretch:normal!important}

/* spacing */
.band{padding:clamp(36px,4.6vw,64px) 0}
.band.tight{padding:clamp(26px,3vw,40px) 0}
.head{margin-bottom:clamp(18px,2.4vw,28px);max-width:820px}
.head .lead{margin-bottom:0}
.grid{gap:clamp(14px,1.8vw,24px)}
.split{gap:clamp(24px,4vw,56px)}
.split>*,.grid>*,.result>*,.hero .wrap>*{min-width:0}
.btn-row{margin-top:18px}
.btn{min-height:46px;padding:11px 20px;font-weight:600;font-size:.97rem;border-radius:8px}
.textlink{font-weight:600}

/* cards: features become soft cards so rows read clearly */
.feature{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 18px 6px}
.band:not(.paper):not(.on-dark) .feature{background:var(--paper);border-color:transparent}
.on-dark .feature{background:rgba(255,255,255,.05);border-color:rgba(200,211,222,.16)}
.feature h3{font-size:1.02rem;margin-bottom:.4em}
.feature .ico{width:38px;height:38px;border-radius:10px;background:var(--leaf-soft);color:var(--leaf)}
.feature p{font-size:.94rem}
.ticks{gap:8px}
.ticks li{font-size:.97rem}

/* header and topbar */
.topbar{font-size:.84rem}
.topbar .wrap{min-height:34px}
header.site .wrap{min-height:66px}
nav.main>ul>li>a,nav.main>ul>li>button{font-weight:500;font-size:.95rem;color:#33424F}
.logo img{height:46px}

/* inner page hero: shorter */
.page-hero .wrap{padding-top:clamp(28px,4vw,52px);padding-bottom:clamp(30px,4vw,52px)}
.page-hero h1{max-width:26ch}
.page-hero .lead{max-width:70ch}
.crumbs{margin-bottom:12px;font-size:.84rem}

/* stats */
.stats div{padding:18px 18px 0 0}
.stats b{font-family:var(--font-head);font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:700}
.stats span{font-size:.88rem}

/* services: 3 or 4 compact columns */
.svc-list{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;border-top:0}
.svc,.svc:nth-child(n){padding:18px 18px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);transition:border-color .15s,transform .15s,box-shadow .15s}
.band.paper .svc{background:var(--white)}
.svc:hover{border-color:var(--sun);transform:translateY(-2px);box-shadow:var(--shadow)}
.svc h3{font-size:1.05rem;margin-bottom:.35em}
.svc p{font-size:.93rem;margin-bottom:8px}
.svc .proof{font-size:.82rem}

/* timeline: compact cards in a row */
.timeline li::before{width:36px;height:36px;font-size:.9rem;margin-bottom:10px}
.timeline::before{top:17px}
.timeline h4{font-size:.98rem}
.timeline p{font-size:.88rem;margin:0}

/* result / case cards */
.result .figures{gap:12px 20px;margin:14px 0}
.result .figures b{font-family:var(--font-head);font-size:1.4rem;font-weight:700}
.result .body{padding:clamp(18px,2.4vw,28px)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,24px)}
.duo .card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column}
.duo .card .photo{border-radius:0;aspect-ratio:16/8}
.duo .card .body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.duo .card .figures{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:10px 0 12px}
.duo .card .figures b{display:block;font-family:var(--font-head);font-weight:700;font-size:1.15rem;color:var(--head);line-height:1.15}
.duo .card .figures b.good{color:var(--leaf)}
.duo .card .figures span{font-size:.78rem;color:var(--muted);line-height:1.3;display:block}
.duo .card .small{margin-top:auto}
@media (max-width:860px){.duo{grid-template-columns:1fr}.duo .card .figures{grid-template-columns:repeat(2,1fr)}}

/* projects, quotes */
.proj .photo{margin-bottom:10px}
.proj h3{font-size:1.02rem}
.proj .meta{font-size:.85rem;gap:10px}
.quote{padding:18px 18px 14px;border:1px solid var(--line);border-top:3px solid var(--sun);border-radius:var(--r-md);background:var(--white)}
.quote p{font-size:.97rem;line-height:1.6}
.band.paper .quote{background:var(--white)}

/* brands compact */
.brands .brand-tile{min-height:88px;padding:14px 16px}

/* forms */
.form{gap:12px}
.form label{font-weight:500;font-size:.88rem;color:#3A4957}
.form input,.form select,.form textarea{min-height:46px;border-color:#C9D4DE;border-radius:8px;font-size:.98rem}
.box{border-radius:var(--r-lg)}

/* FAQ in two columns on wide screens */
.faq summary{font-family:var(--font-head);font-weight:600;font-size:.99rem;padding:14px 36px 14px 0;color:var(--head)}
.faq details p{font-size:.95rem}
.faq-wide .wrap{display:block}
.faq-wide .faq{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;border-top:0}
.faq-wide .faq details:nth-child(-n+2){border-top:1px solid var(--line)}
@media (max-width:860px){.faq-wide .faq{grid-template-columns:1fr}.faq-wide .faq details:nth-child(2){border-top:0}}

/* CTA band */
.cta-band .wrap{padding-top:28px;padding-bottom:28px}
.cta-band h2{font-size:clamp(1.25rem,2vw,1.6rem)}

/* footer: compact */
footer.site{font-size:.9rem}
footer.site .cols{gap:28px;padding:44px 0 28px}
footer.site h4{font-family:var(--font-head);font-size:.95rem;margin-bottom:10px}
footer.site ul{gap:6px}
footer.site .fcol summary{list-style:none;cursor:default}
footer.site .fcol summary::-webkit-details-marker{display:none}
footer.site .base{padding:16px 0 22px;font-size:.82rem}
.group-band .wrap{padding-top:18px;padding-bottom:18px}
.group-band p{font-size:.97rem}
.social-strip .wrap{padding-top:24px;padding-bottom:24px}

/* compact strip (portal promo on home) */
.strip{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;background:var(--paper);border-radius:var(--r-lg);padding:20px 24px}
.strip h3{margin:0 0 4px}
.strip p{margin:0;color:var(--muted)}
.strip ul{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:8px 0 0;font-size:.9rem;color:var(--ink)}
.strip ul li::before{content:"\2713  ";color:var(--leaf);font-weight:700}

/* gallery rail on home: shorter thumbnails */
.rail.thumbs{grid-auto-columns:minmax(200px,19%)}
.rail.thumbs .photo{aspect-ratio:4/3}

/* ---------- tablets ---------- */
@media (max-width:960px){
  .hero .wrap{padding-top:32px;padding-bottom:28px}
}

/* ---------- phones: strict mobile layout ---------- */
@media (max-width:620px){
  body{font-size:15.5px}
  h1{font-size:1.72rem}
  h2{font-size:1.32rem}
  .band{padding:30px 0}
  .band.tight{padding:22px 0}
  .head{margin-bottom:14px}
  .head.row{gap:8px}
  .lead{font-size:.98rem}
  .btn-row{gap:10px}
  .btn-row .btn{flex:1 1 auto}
  /* swipe rows instead of long stacks */
  .grid.g3:not(#galgrid):not(#postgrid),.grid.g4,.svc-list,.timeline,.m-rail{
    display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:80%;
    overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;gap:12px;
    margin-right:calc(-1 * var(--gutter));padding-right:var(--gutter);padding-bottom:8px;scrollbar-width:none}
  .grid.g3:not(#galgrid):not(#postgrid)::-webkit-scrollbar,.grid.g4::-webkit-scrollbar,.svc-list::-webkit-scrollbar,.timeline::-webkit-scrollbar,.m-rail::-webkit-scrollbar{display:none}
  .grid.g3>*,.grid.g4>*,.svc-list>*,.timeline>*,.m-rail>*{scroll-snap-align:start}
  .swipe-hint{display:flex}
  #galgrid,#postgrid{grid-template-columns:1fr 1fr;gap:10px}
  #postgrid .post-card h3{font-size:.92rem}
  #postgrid .post-card p{display:none}
  /* timeline as swipe cards */
  .timeline{grid-auto-columns:62%}
  .timeline::before{display:none}
  .timeline li{display:block;padding:14px;border-radius:var(--r-md);background:rgba(255,255,255,.06);border:1px solid rgba(200,211,222,.18)}
  .band:not(.on-dark) .timeline li{background:var(--paper);border-color:transparent}
  .timeline li::before{margin:0 0 8px}
  .feature{padding:14px 14px 4px}
  .ticks.cols{grid-template-columns:1fr 1fr;gap:8px 14px}
  .ticks li{font-size:.9rem;padding-left:26px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stats div{padding:12px 10px 0 0}
  .page-hero .wrap{padding-top:22px;padding-bottom:24px}
  .page-hero .btn-row{display:none}
  .split{gap:20px}
  .result .figures{grid-template-columns:1fr 1fr}
  .table-wrap{margin-right:0}
  table.data{font-size:.88rem;min-width:0}
  table.data th,table.data td{padding:9px 10px}
  .faq summary{font-size:.95rem;padding:12px 30px 12px 0}
  .cta-band .wrap{padding-top:22px;padding-bottom:22px}
  .cta-band .btn-row .btn{flex:1}
  .social-strip .wrap{padding-top:20px;padding-bottom:20px;gap:12px}
  .social-btns{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .group-band .wrap{padding-top:14px;padding-bottom:14px;gap:8px}
  .group-band p{font-size:.9rem}
  /* footer collapses into tap-to-open groups */
  footer.site .cols{grid-template-columns:1fr;gap:0;padding:28px 0 8px}
  footer.site .cols>div:first-child{padding-bottom:16px}
  footer.site .fcol{border-top:1px solid rgba(200,211,222,.16)}
  footer.site .fcol summary{cursor:pointer;padding:14px 0;position:relative}
  footer.site .fcol summary h4{margin:0}
  footer.site .fcol summary::after{content:"+";position:absolute;right:4px;top:10px;font-size:1.3rem;color:var(--sun)}
  footer.site .fcol[open] summary::after{content:"\2212"}
  footer.site .fcol ul{grid-template-columns:1fr 1fr;gap:8px 12px;padding-bottom:14px}
  footer.site address{margin:10px 0}
  footer.site .base{flex-direction:column;gap:6px}
  .strip{padding:16px}
  .duo .card .photo{aspect-ratio:16/9}
  .rail.thumbs{grid-auto-columns:46%}
}
.swipe-hint{display:none;align-items:center;gap:6px;font-size:.8rem;color:var(--muted);margin:-6px 0 10px}
.on-dark .swipe-hint{color:#AFC0D0}
@media (prefers-reduced-motion:reduce){.svc{transition:none}}

/* ---------- hero with animated solar scene ---------- */
.hero{background:radial-gradient(120% 90% at 85% 0%,#1D4A76 0%,#0E2A47 55%,#0B2340 100%)}
.hero .wrap{grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);padding-top:clamp(30px,4vw,56px);padding-bottom:clamp(18px,2.5vw,30px)}
.hero h1{color:#fff;margin-bottom:.4em}
.hero .lead{color:#C9D6E2;margin-bottom:0}
.hero .chips{margin-top:16px;gap:8px}
.hero .chips li{font-size:.85rem;font-weight:500;padding:6px 11px;background:rgba(255,255,255,.04)}
.hero-visual{max-width:600px;justify-self:end}
.hero .wrap.hero-stats{padding-bottom:30px}
.scene-wrap{position:relative}
.solar-scene{display:block;width:100%;height:auto;overflow:visible}
.solar-scene .rays{animation:sg-spin 36s linear infinite}
.solar-scene .glow{animation:sg-pulse 4.5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.solar-scene .beams path{stroke-dasharray:3 10;animation:sg-beam 1.1s linear infinite}
.solar-scene .beams path:nth-child(2){animation-delay:-.4s}.solar-scene .beams path:nth-child(3){animation-delay:-.8s}
.solar-scene .shine{animation:sg-shine 5.5s ease-in-out infinite}
.solar-scene .cloud{animation:sg-cloud 38s linear infinite}
.solar-scene .win{animation:sg-win 3.2s ease-in-out infinite}
.solar-scene .win.w2{animation-delay:-1.4s}
.solar-scene .led{animation:sg-led 1.6s steps(2,start) infinite}
@keyframes sg-spin{to{transform:rotate(360deg)}}
@keyframes sg-pulse{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.12);opacity:1}}
@keyframes sg-beam{to{stroke-dashoffset:-26}}
@keyframes sg-shine{0%{transform:translateX(0)}65%,100%{transform:translateX(560px)}}
@keyframes sg-cloud{from{transform:translate(-80px,150px)}to{transform:translate(660px,150px)}}
@keyframes sg-win{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes sg-led{to{opacity:.25}}
.solar-scene.paused *,.scene-wrap .solar-scene.paused *{animation-play-state:paused}
.gen-chip{position:absolute;left:4%;top:2%;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:rgba(9,28,50,.72);border:1px solid rgba(200,211,222,.22);backdrop-filter:blur(6px);color:#D3DEE8;padding:7px 12px;border-radius:999px;font-size:.8rem}
.gen-chip b{color:#fff;font-weight:600;font-variant-numeric:tabular-nums}
.gen-chip .sep{opacity:.4}
.gen-chip .dot{width:8px;height:8px;border-radius:50%;background:#3DDC84;box-shadow:0 0 0 0 rgba(61,220,132,.6);animation:sg-ping 2s infinite}
@keyframes sg-ping{70%{box-shadow:0 0 0 8px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
.hero .billcard{left:auto;right:2%;bottom:-2%;width:min(250px,48%);padding:12px 14px}
.hero .billcard .row{font-size:.84rem;padding:5px 0}
@media (prefers-reduced-motion:reduce){.solar-scene *,.gen-chip .dot{animation:none!important}}
@media (max-width:960px){.hero .wrap{grid-template-columns:1fr}.hero-visual{justify-self:stretch;max-width:560px;margin:0 auto}}
@media (max-width:620px){
  .hero .wrap{padding-top:22px;gap:14px}
  .hero .chips{display:grid;grid-template-columns:1fr 1fr}
  .hero .chips li{font-size:.76rem;padding:6px 8px;border-radius:10px}
  .hero-visual{max-width:none;width:100%}
  .hero .billcard{position:relative;right:auto;bottom:auto;left:auto;width:100%;margin-top:-6px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
  .hero .billcard .row{flex-direction:column;border:0;padding:0;gap:0;font-size:.76rem}
  .hero .billcard .row strong{font-size:.86rem}
  .gen-chip{font-size:.7rem;padding:5px 9px;gap:5px}
  .hero .wrap.hero-stats{padding-bottom:20px}
}
/* home helpers */
.grid.mini{gap:10px;margin-top:14px}
.grid.mini .feature{padding:12px 14px 2px}
.grid.mini .feature p{margin-bottom:10px}
.strip.dark{background:rgba(255,255,255,.06);border:1px solid rgba(200,211,222,.18);margin-top:22px}
.strip.dark h3{color:#fff;font-size:1rem}
.strip.dark p{color:#C9D6E2;font-size:.9rem}
@media (max-width:620px){.grid.g2.mini{grid-template-columns:1fr 1fr}.grid.mini .feature h4{font-size:.86rem}.grid.mini .feature p{font-size:.78rem}}
/* fixes after review */
.hero .billcard{position:relative;right:auto;left:auto;bottom:auto;width:100%;margin-top:4px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px 16px}
.hero .billcard .row{flex-direction:column;border:0;padding:0;gap:2px}
.hero .billcard .row strong{font-size:.98rem}
.svc-list{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:960px){.svc-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
.duo .card .body>*{align-self:flex-start}
.duo .card .body>.figures{align-self:stretch}
.duo .card .photo{aspect-ratio:16/7}
.band.paper #homegal + *, .proj .photo{aspect-ratio:16/10}
.rail.thumbs{grid-auto-columns:minmax(200px,calc((100% - 72px)/5))}
.scene-wrap{overflow:hidden;border-radius:14px}
@media (max-width:620px){
  .svc-list{grid-template-columns:none;grid-auto-columns:80%}
  .svc,.svc:nth-child(n){padding:16px;border-left:1px solid var(--line)}
  .compare{grid-template-columns:1fr 1fr}
  .compare>div{padding:14px 12px}
  .compare h3{font-size:.92rem;margin-bottom:8px}
  .compare dl{grid-template-columns:1fr;gap:0}
  .compare dt{font-size:.74rem;margin-top:6px}
  .compare dd{text-align:left;font-size:.92rem;white-space:normal}
  .compare .total{border-top:0;padding-top:0;font-size:.95rem}
  .compare dt.total{border-top:1px solid var(--line);padding-top:8px;margin-top:10px}
}
@media (max-width:620px){.form .two{grid-template-columns:1fr 1fr;gap:10px}.form label{font-size:.82rem}}
@media (max-width:620px){.wrap.grid.g3,.wrap.grid.g4{margin-right:auto;padding-right:var(--gutter)}}
@media (max-width:620px){.grid.g2:has(>.photo){grid-template-columns:1fr 1fr;gap:8px}.grid.g2>.photo{aspect-ratio:1/1}}

@media (max-width:620px){.wrap.grid.g3:not(#galgrid):not(#postgrid),.wrap.grid.g4:not(#galgrid){margin-right:auto;padding-right:var(--gutter)}}

/* ---------- WhatsApp chat bubble ---------- */
.float-wa{border:0;cursor:pointer;transition:transform .15s}
.float-wa:hover{transform:scale(1.06)}
.float-wa::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(31,168,85,.45);animation:wa-ring 2.6s ease-out infinite}
@keyframes wa-ring{70%{box-shadow:0 0 0 14px rgba(31,168,85,0)}100%{box-shadow:0 0 0 0 rgba(31,168,85,0)}}
.wa-badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:10px;background:#E5372D;color:#fff;font-size:.72rem;font-weight:700;display:grid;place-items:center;border:2px solid #fff}
.wa-teaser{position:fixed;right:86px;bottom:26px;z-index:61;max-width:240px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:14px 14px 4px 14px;box-shadow:var(--shadow);padding:10px 14px;font:inherit;cursor:pointer;animation:wa-in .3s ease}
.wa-teaser b{display:block;font-size:.82rem;color:var(--head)}.wa-teaser span{font-size:.85rem;color:var(--ink)}
.wa-chat{position:fixed;right:18px;bottom:88px;z-index:70;width:min(370px,calc(100vw - 24px));height:min(560px,calc(100vh - 120px));display:flex;flex-direction:column;background:#EFEAE2;border-radius:16px;overflow:hidden;box-shadow:0 24px 60px -18px rgba(9,24,40,.55);opacity:0;transform:translateY(12px) scale(.98);transform-origin:bottom right;transition:opacity .18s,transform .18s}
.wa-chat.open{opacity:1;transform:none}
.wa-head{display:flex;align-items:center;gap:10px;background:#075E54;color:#fff;padding:12px 12px 12px 14px}
.wa-av{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center;flex-shrink:0;overflow:hidden}
.wa-av img{width:30px;height:30px}
.wa-who{flex:1;min-width:0}.wa-who b{display:block;font-size:.98rem;line-height:1.2;font-family:var(--font)}
.wa-st{display:flex;align-items:center;gap:6px;font-size:.78rem;color:#D7F5E9}
.wa-st i{width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 2px rgba(37,211,102,.25)}
.wa-chat.away .wa-st i{background:#F2B21B}
.wa-x{background:none;border:0;color:#fff;font-size:1.7rem;line-height:1;width:40px;height:40px;cursor:pointer;border-radius:50%}
.wa-x:hover{background:rgba(255,255,255,.12)}
.wa-body{flex:1;overflow-y:auto;padding:12px 12px 6px;background:#EFEAE2 radial-gradient(rgba(7,94,84,.06) 1px,transparent 1.2px) 0 0/16px 16px}
.wa-day{text-align:center;margin:2px auto 10px;font-size:.72rem;color:#54656F;background:#E1F2FB;width:max-content;padding:3px 10px;border-radius:8px}
.wa-msg{display:flex;flex-direction:column;max-width:84%;margin-bottom:8px;animation:wa-in .2s ease}
.wa-msg p{margin:0;padding:8px 10px 4px;border-radius:10px;font-size:.92rem;line-height:1.45;color:#111B21;box-shadow:0 1px .5px rgba(11,20,26,.13);max-width:none}
.wa-msg.them p{background:#fff;border-top-left-radius:2px}
.wa-msg.me{margin-left:auto;align-items:flex-end}
.wa-msg.me p{background:#D9FDD3;border-top-right-radius:2px}
.wa-msg a{color:#027EB5}
.wa-t{font-size:.66rem;color:#667781;margin-top:-1px;padding:0 6px 2px}
.wa-t .ticks{font-style:normal;color:#53BDEB;letter-spacing:-3px;margin-left:3px}
.wa-msg.typing p{display:flex;gap:4px;padding:12px 14px}
.wa-msg.typing i{width:7px;height:7px;border-radius:50%;background:#9AA5AB;animation:wa-dot 1s infinite}
.wa-msg.typing i:nth-child(2){animation-delay:.15s}.wa-msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes wa-dot{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}
@keyframes wa-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wa-topics{display:flex;gap:6px;overflow-x:auto;padding:6px 10px 8px;scrollbar-width:none}
.wa-topics::-webkit-scrollbar{display:none}
.wa-topics button{flex-shrink:0;border:1px solid #B7E4CF;background:#fff;color:#075E54;border-radius:999px;padding:7px 12px;font:inherit;font-size:.82rem;font-weight:600;cursor:pointer}
.wa-topics button:hover{background:#E7F8EE}
.wa-input{display:flex;gap:8px;align-items:flex-end;padding:8px 10px;background:#F0F2F5}
.wa-input textarea{flex:1;resize:none;border:0;border-radius:20px;padding:10px 14px;font:inherit;font-size:.95rem;min-height:42px;max-height:110px;background:#fff;color:#111B21;line-height:1.35}
.wa-input textarea:focus{outline:2px solid #25D366}
.wa-input button{width:42px;height:42px;border-radius:50%;border:0;background:#00A884;color:#fff;display:grid;place-items:center;cursor:pointer;flex-shrink:0}
.wa-input button svg{width:20px;height:20px}
.wa-foot{display:flex;align-items:center;gap:6px;margin:0;padding:6px 12px 10px;background:#F0F2F5;font-size:.74rem;color:#54656F;max-width:none}
.wa-foot svg{width:14px;height:14px;color:#25D366}
.wa-foot .wa-link{margin-left:auto}
.wa-link{background:none;border:0;padding:0;font:inherit;font-size:.78rem;color:#027EB5;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.wa-cb{display:grid;gap:8px;padding:10px 12px;background:#F0F2F5}
.wa-cb p{margin:0;max-width:none}.wa-cb p b{display:block;font-size:.9rem;color:#111B21}.wa-cb p span{font-size:.8rem;color:#54656F}
.wa-cb input{min-height:42px;border:1px solid #D1D7DB;border-radius:10px;padding:8px 12px;font:inherit;font-size:.95rem}
.wa-cb-row{display:flex;justify-content:space-between;align-items:center}
.wa-cb-send{border:0;background:#00A884;color:#fff;border-radius:999px;padding:9px 16px;font:inherit;font-weight:600;cursor:pointer}
.mobile-bar a svg{width:18px;height:18px}
@media (max-width:760px){
  .wa-chat{right:0;left:0;bottom:0;width:100%;height:min(82vh,620px);border-radius:16px 16px 0 0;transform-origin:bottom center;transform:translateY(24px)}
  .wa-chat.open{transform:none}
  .wa-teaser{display:none}
}
@media (prefers-reduced-motion:reduce){.float-wa::after,.wa-msg,.wa-teaser{animation:none}.wa-chat{transition:none}}

/* ---------- home: solution scenes slideshow ---------- */
.scenes{position:relative;isolation:isolate;overflow:hidden;background:#071a2c;color:#fff;min-height:clamp(540px,calc(100svh - 150px),860px);display:flex}
.scene-media{position:absolute;inset:0;z-index:-2}
.scene-bg{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .9s ease}
.scene-bg.is-on{opacity:1}
.scene-bg img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;display:block}
.scene-bg picture{position:absolute;inset:0}.scene-bg .scene-fx{position:absolute;inset:0;object-fit:cover;object-position:62% 50%}
.scene-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,22,38,.92) 0%,rgba(7,22,38,.78) 26%,rgba(7,22,38,.18) 46%,rgba(7,22,38,0) 60%),linear-gradient(0deg,rgba(7,22,38,.92) 0%,rgba(7,22,38,.35) 20%,rgba(7,22,38,0) 34%)}
.scene-ui{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:22px;padding-top:clamp(26px,4vh,48px);padding-bottom:20px;width:100%}
.scene-left{max-width:440px;display:flex;flex-direction:column;gap:14px}
.scene-intro h1{color:#fff;font-size:clamp(1.75rem,2.3vw,2.3rem);margin:.15em 0 .3em}
.scene-intro .lead{color:#D5E0EA;font-size:.98rem;margin:0}
.scene-copies{position:relative}
.scene-copy{background:rgba(9,29,49,.72);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:18px 18px 16px;backdrop-filter:blur(8px)}
.scene-copy.is-on{animation:sceneIn .5s ease}
@keyframes sceneIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.scene-num{font-size:.78rem;letter-spacing:.14em;color:var(--sun);font-weight:700}
.scene-copy h2{color:#fff;font-size:1.45rem;margin:.25em 0 .35em}
.scene-flow{font-size:.84rem;font-weight:600;color:#BFE7D2;margin:0 0 .5em;line-height:1.5}
.scene-flow i{font-style:normal;color:var(--sun);margin:0 2px}
.scene-text{font-size:.93rem;color:#E3EBF2;margin:0 0 .6em;line-height:1.55}
.scene-points{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:4px;font-size:.88rem;color:#E3EBF2}
.scene-points li{display:flex;gap:7px;align-items:flex-start}.scene-points svg{width:16px;height:16px;flex:none;margin-top:3px;color:var(--sun)}
.scene-copy .btn-row{margin:0;gap:8px}.scene-copy .btn{padding:10px 16px;font-size:.92rem}
.scene-bottom{display:flex;flex-direction:column;gap:10px}
.scene-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.scene-tab{position:relative;overflow:hidden;text-align:left;border:1px solid rgba(255,255,255,.25);background:rgba(9,29,49,.62);color:#fff;border-radius:10px;padding:12px 14px 14px;cursor:pointer;backdrop-filter:blur(8px);font:inherit}
.scene-tab small{display:block;font-size:.7rem;letter-spacing:.12em;opacity:.7}
.scene-tab b{display:block;font-size:.98rem;margin-top:3px;font-weight:700}
.scene-tab:hover{border-color:rgba(255,255,255,.55)}
.scene-tab.is-on{background:var(--sun);border-color:var(--sun);color:var(--cell)}
.scene-tab .bar{position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--cell)}
.scenes.playing .scene-tab.is-on .bar{animation:sceneBar var(--scene-ms,7000ms) linear forwards}
@keyframes sceneBar{to{width:100%}}
.scene-ctrl{display:flex;align-items:center;gap:8px}
.scene-ctrl button{width:38px;height:38px;border-radius:8px;border:1px solid rgba(255,255,255,.35);background:rgba(9,29,49,.55);color:#fff;font-size:1.3rem;line-height:1;cursor:pointer;display:grid;place-items:center}
.scene-ctrl button:hover{background:rgba(255,255,255,.15)}
.pz{width:12px;height:13px;border-left:4px solid #fff;border-right:4px solid #fff;box-sizing:border-box}
.scene-ctrl [aria-pressed="true"] .pz{border:0;width:0;height:0;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent}
.scene-note{margin-left:auto;font-size:.75rem;color:#B9C7D4}
@media (min-width:821px){.scene-bottom{flex-direction:row;align-items:center;gap:14px;padding-right:72px}.scene-tabs{flex:1;min-width:0}.scene-ctrl{flex:none;flex-wrap:wrap;width:132px;justify-content:center;gap:6px}.scene-note{margin:0;width:100%;text-align:center}}
.trustbar{padding:22px 0 18px}
.trustbar .chips{margin:0 0 14px;justify-content:center}
.scards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.scard{display:flex;flex-direction:column;border-radius:var(--r-md);overflow:hidden;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.scard:hover{transform:translateY(-2px);box-shadow:var(--shadow);color:var(--ink)}
.scard img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.scard-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:3px}
.scard-body small{font-size:.72rem;letter-spacing:.1em;color:var(--leaf);font-weight:700;text-transform:uppercase}
.scard-body b{font-family:var(--font-head);color:var(--cell);font-size:1rem;line-height:1.3}
.scard-body span{font-size:.8rem;color:var(--muted)}
@media (min-width:821px) and (max-height:960px){.scene-intro .lead{display:none}.scene-points{display:none}.scene-tab{padding:9px 12px 11px}.scene-ui{padding-top:22px;gap:14px}}
@media (min-width:821px) and (max-height:760px){.scene-text{display:none}}
@media (max-width:1100px){.scene-tabs{grid-template-columns:repeat(5,minmax(120px,1fr));overflow-x:auto;scrollbar-width:none}.scards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:820px){
  .scenes{display:flex;flex-direction:column;min-height:0;background:var(--cell)}
  .scene-ui,.scene-left{display:contents}
  .scene-intro{order:1;padding:18px var(--gutter) 14px}
  .scene-intro h1{font-size:1.6rem}
  .scene-intro .lead{font-size:.95rem}
  .scene-media{order:2;position:relative;inset:auto;z-index:0;aspect-ratio:1672/940}
  .scene-bg img{object-position:50% 50%}
  .scene-shade{display:none}
  .scene-copies{order:3;padding:14px var(--gutter) 0}
  .scene-bottom{order:4;padding:12px var(--gutter) 18px}
  .scene-copy{background:transparent;border:0;padding:0;backdrop-filter:none}
  .scene-copy h2{font-size:1.25rem}
  .scene-tabs{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:2px}
  .scene-tab{flex:0 0 auto;scroll-snap-align:start;padding:9px 12px 11px}
  .scene-tab b{font-size:.88rem}
  .scards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px}
  .scard{flex:0 0 78%;scroll-snap-align:start}
}
@media (prefers-reduced-motion:reduce){.scene-bg{transition:none}.scene-copy.is-on{animation:none}.scenes.playing .scene-tab.is-on .bar{animation:none}}
.trustbar .chips li{color:var(--ink,#123);background:#fff;border-color:rgba(20,52,38,.18)}
.trustbar .chips svg{color:var(--green,#1a7f4b)}

/* check your roof */
.roof{display:grid;grid-template-columns:minmax(320px,440px) 1fr;gap:24px;align-items:start}
.roof>*,.roof-steps>*{min-width:0}.roof-steps{display:grid;gap:16px}.roof-search input,.roof-cap input{min-width:0;width:100%}.roof .btn-row{flex-wrap:wrap}
.roof-search{display:flex;gap:8px;margin:10px 0}
.roof-search input{flex:1;min-height:48px;padding:10px 14px;border:1px solid #B8C5D3;border-radius:var(--r-sm);font:inherit}
.roof-mapbox{position:sticky;top:90px}.roof-mapwrap{position:relative;z-index:0;isolation:isolate}.roof-cross{position:absolute;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;pointer-events:none;z-index:500}.roof-cross span{position:absolute;inset:0;border:2px solid #F2B21B;border-radius:50%;box-shadow:0 0 0 2px rgba(0,0,0,.35)}.roof-cross span::before,.roof-cross span::after{content:"";position:absolute;background:#F2B21B;left:50%;top:50%}.roof-cross span::before{width:2px;height:60px;margin:-30px 0 0 -1px}.roof-cross span::after{width:60px;height:2px;margin:-1px 0 0 -30px}.roof-cross.hide{display:none}.roof-bar{position:absolute;left:10px;right:10px;bottom:12px;display:flex;gap:8px;justify-content:center;flex-wrap:wrap;z-index:500}.roof-bar .btn{box-shadow:0 2px 8px rgba(0,0,0,.35);padding:10px 14px}.roof-bar .btn[aria-pressed=true]{background:#0E2A47;color:#fff}.roof-map.locked{touch-action:none}.roof-chip{background:rgba(14,42,71,.9);color:#fff;border-radius:999px;padding:8px 12px;font-size:13px;align-self:center}
.roof-map{height:min(74vh,680px);min-height:420px;border-radius:14px;overflow:hidden;background:#dfe7e3}
.roof-status{min-height:1.4em;color:var(--cell-3);font-weight:600}
.roof [hidden]{display:none!important}
.roof-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:10px 0}
.roof-grid>div{background:var(--paper);border-radius:12px;padding:12px}
.roof-grid b{display:block;font-size:1.25rem;color:var(--head,#163A5C)}.roof-grid b.good{color:#1a7f4b}
.roof-grid span{font-size:.88rem;color:var(--muted)}
.linkbtn{background:none;border:0;padding:0;font:inherit;cursor:pointer;color:var(--cell-3);text-decoration:underline}
.roof-human{border:2px solid #F2B21B}.roof-find .err,.roof-find .field .err{display:none}.roof-billtype{margin:14px 0 6px}.roof-billtype .field{margin-bottom:10px}.roof-billrow{display:grid;grid-template-columns:1fr 150px;gap:8px}.roof-billrow select{min-width:0}.roof-find .two{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 6px;align-items:end}.roof-find .two .field{display:flex;flex-direction:column;justify-content:flex-end}.roof-find .field label{display:block;font-weight:700;color:var(--cell,#174E3B);margin-bottom:6px;font-size:.95rem}.roof-find .field input,.roof-find .field select{display:block;width:100%;min-height:50px;padding:10px 14px;border:2px solid #B8C5D3;border-radius:10px;font:inherit;font-size:1.05rem;background:#fff;color:var(--ink)}.roof-find .field input:focus,.roof-find .field select:focus{border-color:#F2B21B;outline:none;box-shadow:0 0 0 3px rgba(242,178,27,.25)}.roof-find .btn-row{display:grid;gap:10px;margin-top:12px}.roof-find .btn-row .btn{min-height:52px;font-size:1.05rem}@media (max-width:480px){.roof-find .two{grid-template-columns:1fr}}.btn.busy{position:relative;color:transparent!important;pointer-events:none}.btn.busy::after{content:"";position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border:3px solid rgba(0,0,0,.25);border-top-color:#0E2A47;border-radius:50%;animation:roofspin .8s linear infinite}@keyframes roofspin{to{transform:rotate(360deg)}}.btn.busy[data-busy]::before{content:attr(data-busy);position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);color:#0E2A47;font-size:.9rem;padding-left:34px;text-align:left}.pac-container{z-index:1200!important;font-family:inherit}.roof-pac{flex:1;min-height:48px;--gmp-mat-color-surface:#fff;--gmp-mat-color-on-surface:#1b2a38;font-family:inherit}gmp-place-autocomplete{width:100%}.roof-cap img{display:block;border:1px solid #B8C5D3;border-radius:8px;background:#fff;margin:8px 0}.roof-cap input{letter-spacing:.2em;text-transform:uppercase;font-weight:700}
.roof-loc{display:flex;align-items:center;gap:10px;margin:8px 0}.roof-loc .btn{min-height:48px}.roof-find.dim{opacity:.45;pointer-events:none}
.roof-scanbox{margin-top:14px;padding-top:10px;border-top:1px dashed #D5E8DE}.roof-scanbox h3{margin:0 0 8px;font-size:1.1rem;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.roof-notes{margin:6px 0 8px 18px;color:#465C55}.roof-toggles label{margin-right:12px;font-weight:600}.roof-discom{margin:12px 0 4px;padding:10px 12px;background:#F4F7F9;border-radius:8px}.roof-discom select{margin-left:6px;max-width:100%;padding:6px 8px;border:1px solid #B8C5D3;border-radius:6px;font:inherit}.roof-scanstatus{background:#FDECE4;border:1px solid #E8762B;border-radius:8px;padding:8px 10px}.roof-app{margin:12px 0;padding:14px 16px;border:2px solid #F2B21B;border-radius:12px;background:#FFFBEF}.roof-app h4{margin:0 0 6px}.roof-app ul{margin:0 0 10px 18px}.roof-app-cta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}.roof-studio{margin:12px 0;padding:12px 14px;border:1px solid #DCE4EC;border-radius:10px;background:#FAFCFE}.roof-studio h4{margin:0 0 4px}.roof-slider{display:flex;align-items:center;gap:12px;margin:8px 0}.roof-slider input[type=range]{flex:1;min-width:0;accent-color:#F2B21B;height:28px}.roof-slider b{white-space:nowrap;color:#174E3B}.roof-sketch{margin:12px 0}.roof-cover{margin:4px 0 8px;padding:8px 10px;background:#FFF7E0;border-radius:8px}.roof-cover label{margin-right:12px}.roof-fix{margin:10px 0 0;padding:10px 12px;background:#EEF6F1;border-radius:8px}.roof-fix ul{margin:6px 0 4px 18px}.roof-fix .pill{background:#fff;border:1px solid #B8D2C3;margin:2px 0}.roof-sun{margin:12px 0;padding:10px 12px;background:#FFF9E8;border-radius:10px}.roof-sun h4{margin:0 0 6px}.roof-sun table{border-collapse:collapse}.roof-sun td,.roof-sun th{padding:2px 8px 2px 0;text-align:left}.roof-3d{margin:10px 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.roof-sketch img{width:100%;height:auto;border:1px solid #DCE4EC;border-radius:8px}.roof-more{margin:10px 0;padding:10px 12px;background:#FFF7E0;border-radius:8px}.roof-more ul{margin:6px 0 0 18px}.roof-legend{display:inline-block;width:14px;height:14px;border-radius:3px;vertical-align:-2px;margin-right:4px}.roof-lock{background:#FFF7E0;border-left:3px solid #F2B21B;padding:8px 10px;border-radius:6px}.roof-spin{display:inline-block;width:14px;height:14px;border:2px solid #C8D3DC;border-top-color:#174E3B;border-radius:50%;animation:roofspin .8s linear infinite;vertical-align:-2px;margin-right:6px}.roof-grid b.red{color:#D32F2F}.roof-ai-note{background:#FFF7E0;border-left:3px solid #F2B21B;padding:8px 10px;border-radius:6px}
.roof-handle{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid #F2B21B;box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:grab}
.roof-toast{position:absolute;left:50%;top:14px;transform:translateX(-50%);background:rgba(14,42,71,.92);color:#fff;padding:8px 14px;border-radius:999px;font-size:13px;z-index:600;max-width:90%;text-align:center;pointer-events:none}
.roof-bar .btn.btn-sun{min-height:46px}
@media (max-width:900px){.roof{grid-template-columns:1fr}.roof-mapbox{position:static;order:-1}.roof-map{height:58vh;min-height:320px}}

/* festive wishes and offers (home) */
.festive-band{--f1:#0E2A47;--f2:#16395E;--fa:#F2B21B;background:linear-gradient(135deg,var(--f1),var(--f2));color:#fff;position:relative;overflow:hidden}
.festive-band.theme-diwali{--f1:#3b1306;--f2:#7c2d12;--fa:#FFC23D}
.festive-band.theme-navratri{--f1:#4a0d3a;--f2:#9d174d;--fa:#FDE68A}
.festive-band.theme-kite{--f1:#0c4a6e;--f2:#0284c7;--fa:#FDE68A}
.festive-band.theme-tricolour{--f1:#0E2A47;--f2:#14532d;--fa:#FF9933}
.festive-band.theme-holi{--f1:#4c1d95;--f2:#be185d;--fa:#FDE68A}
.festive-band::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 20%,rgba(255,255,255,.12) 0 2px,transparent 3px) 0 0/46px 46px;pointer-events:none}
.fest-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:stretch;position:relative}
.fest-grid.no-wish{grid-template-columns:1fr}
.fest-card{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:16px 18px}
.fest-art svg{width:96px;height:96px;filter:drop-shadow(0 8px 18px rgba(0,0,0,.35))}
.fest-img{width:96px;height:96px;object-fit:cover;border-radius:12px}
.fest-text .kicker{color:var(--fa)}
.fest-text h2{color:#fff;margin:6px 0 8px;font-size:clamp(1.6rem,2.6vw,2.3rem)}
.fest-text p{color:rgba(255,255,255,.88);margin:0 0 10px}
.fest-sign{font-style:italic;color:var(--fa)!important}
.fest-offers{background:#fff;color:var(--ink);border-radius:16px;padding:14px 18px;display:grid;gap:10px;align-content:start}
.fest-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.fest-head h3{margin:0}
.g-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink);font-size:.9rem}
.g-badge b{font-size:1.05rem}.g-badge .stars{color:#F2B21B;letter-spacing:1px}
.fest-count{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;background:#FFF7E0;border:1px solid #F7D27A;border-radius:12px;padding:10px 14px}
.fest-count b{font-size:1.8rem;color:#B45309;line-height:1}.fest-count span{font-size:.92rem}.fest-count a{font-size:.88rem;font-weight:600}
.fest-offer{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.fest-offer p{margin:2px 0;font-size:.93rem;color:var(--muted)}.fest-offer small{color:var(--muted)}
.fest-offer .btn{flex:none}
@media (max-width:900px){.fest-grid{grid-template-columns:1fr}.fest-card{grid-template-columns:72px 1fr;padding:12px 14px}.fest-art svg,.fest-img{width:72px;height:72px}.fest-offer{flex-direction:column;align-items:flex-start}.fest-count{grid-template-columns:auto 1fr}.fest-count a{grid-column:1/-1}}
/* price table */
.price-table td.good{color:#1a7f4b;font-weight:600}
.price-table th[scope],.price-table tbody th{white-space:nowrap}
/* GreenCube holomark over videos */
.gc-vmark{position:relative;display:block;max-width:100%}
.gc-vmark>video,.gc-vmark>iframe{display:block;width:100%}
.gc-vmark-badge{position:absolute;right:2%;bottom:12%;width:clamp(90px,16%,220px);aspect-ratio:600/230;background:rgba(255,255,255,.8) url(../img/logo.png) center 40%/88% auto no-repeat;border-radius:8px;pointer-events:none;box-shadow:0 1px 6px rgba(0,0,0,.15)}
.gc-vmark-badge::after{content:"";position:absolute;left:8%;right:8%;bottom:9%;height:3px;border-radius:2px;background:linear-gradient(90deg,#00A86B,#009EDB,#7C4DFF,#FF4081,#F5A623)}
/* phone app download */
.app-box b{display:block;margin-bottom:6px}.app-box .app-dl{display:block;margin:6px 0;padding:10px 12px;border-radius:8px;background:#0E2A47;color:#fff!important;text-decoration:none;font-weight:600}.app-box .app-dl[data-ios]{background:#33475B}.app-box details{margin-top:6px;font-size:.9em}.app-box ol{padding-left:18px;margin:6px 0}
/* areas we have installed in (from portal applications) */
.areas{margin-top:22px}.areas h3{margin:0 0 8px;font-size:1.05rem}.areas p{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 6px}
.areas .chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #DCE3EA;border-radius:999px;padding:4px 11px;font-size:.88rem}
.areas .chip small{color:#1F7F55;font-weight:700}

/* ---------- Latest guides strip (home page) ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.guides .head.row{margin-bottom:22px}
.guide-card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow,none);transition:transform .2s ease,box-shadow .2s ease}
.guide-card:hover{transform:translateY(-3px)}
.guide-card .guide-img{display:block}
.guide-card .thumb{border:0;border-radius:0;margin:0;aspect-ratio:8/5;background:var(--paper)}
.guide-card .thumb img{display:block;width:100%;height:100%;object-fit:cover}
.guide-body{display:flex;flex-direction:column;gap:6px;padding:18px 20px 20px;flex:1}
.guide-meta{margin:0}
.guide-card h3{margin:0;font-size:1.12rem;line-height:1.3}
.guide-card h3 a{color:var(--head);text-decoration:none}
.guide-card:hover h3 a{text-decoration:underline;text-decoration-color:var(--sun);text-decoration-thickness:3px;text-underline-offset:4px}
.guide-body>.small{margin:0 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.guide-body>.textlink{margin-top:auto;align-self:flex-start}
@media (max-width:960px){.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.guide-body{padding:14px 16px 16px}}
@media (max-width:620px){.guide-grid{grid-template-columns:1fr}.guides .head.row{margin-bottom:14px}}

/* ---------- Google rating badge and "via Google" testimonials ---------- */
.g-badge{background:var(--white);white-space:nowrap}
.g-badge .stars{font-size:1rem}
a.g-badge:hover{border-color:var(--sun);background:#FFF8E6}
.head.row .g-badge{align-self:center}
.quote footer .when{color:var(--muted);font-size:.85rem}
.via-g{display:inline-flex;align-items:center;gap:5px;margin-left:8px;padding:2px 9px;border:1px solid var(--line);border-radius:999px;font-size:.78rem;font-weight:600;color:var(--ink);background:var(--white);vertical-align:middle}
.via-g svg{width:13px;height:13px}
.on-dark .via-g{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:var(--white)}

/* ===== Solar Site Check (v12.6): light, airy wizard; button colour = its job; colour follows the state ===== */
.sc-band{background:linear-gradient(180deg,#e7f0ea,#f3f7f4 320px);padding:18px 0 28px}
.sc{--sc-fg:#1f2f3a;--sc-muted:#5f7182;--sc-line:#dfe6ec;--sc-card:#fff;--sc-mint:#e9f7ef;--sc-sand:#f6efdc;--go:#5BAA85;--go-d:#2E6B52;--act:#5C9EAD;--act-d:#2F6F7C;--info:#6F93C4;--info-d:#3F6397;--warn:#D08A8A;--warn-d:#8F4A4A;--sun:#E9C46A;--sc-shadow:0 12px 32px rgba(31,47,58,.10);color:var(--sc-fg)}
.sc-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:10px}.sc-head h1{font-size:1.7rem;margin:0}.sc-tag{margin:2px 0 0;color:var(--sc-muted)}
.sc-steps{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:10px;margin:0 -4px;padding-left:4px}.sc-steps::-webkit-scrollbar{display:none}
.sc-steps button{flex:0 0 auto;display:flex;align-items:center;gap:8px;font:600 13px/1 inherit;font-family:inherit;color:var(--sc-muted);padding:9px 12px;border-radius:999px;background:var(--sc-card);border:1px solid var(--sc-line);white-space:nowrap;cursor:default}.sc-steps button:not(:disabled){cursor:pointer}
.sc-steps button i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;background:var(--sc-line);color:var(--sc-fg)}
.sc-steps button.on{background:var(--go);color:#fff;border-color:var(--go)}.sc-steps button.on i{background:#fff;color:var(--go-d)}.sc-steps button.done{color:var(--go-d);background:var(--sc-mint);border-color:transparent}.sc-steps button.done i{background:var(--go);color:#fff}
.sc-main{display:grid;grid-template-columns:minmax(300px,440px) 1fr;gap:18px;align-items:start}
@media(max-width:860px){.sc-main{grid-template-columns:1fr}.sc-stage{order:-1}.sc[data-stage=none] .sc-stage{display:none}.sc-sticky{bottom:66px}}
.sc-card{background:var(--sc-card);border-radius:18px;padding:22px;box-shadow:var(--sc-shadow);min-width:0}
.sc-card h1{font-size:1.45rem;line-height:1.2;margin:0 0 6px}.sc-card p{margin:0 0 10px;color:var(--sc-muted)}.sc-card p.ok,.sc-card .ok{color:var(--go-d);font-weight:700}
.sc-field{display:block;margin:12px 0}.sc-field>span{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--sc-fg)}.sc-field input,.sc-field select{width:100%;box-sizing:border-box;font:inherit;font-size:17px;padding:13px 14px;border:2px solid var(--sc-line);border-radius:12px;background:#fff;color:var(--sc-fg)}.sc-field input:focus,.sc-field select:focus{outline:none;border-color:var(--go)}.sc-field input.error{border-color:var(--warn);background:#fdf5f5}
.sc-row{display:flex;gap:10px;align-items:flex-end}.sc-row>*{flex:1;min-width:0}.sc-row .btn{flex:0 0 auto;width:auto;margin:0}.sc-field .sc-row{align-items:stretch}.sc-field .sc-row input{flex:1}
.sc-cap{border:2px dashed var(--sc-line);border-radius:12px;background:#fff;display:block;max-width:100%;height:auto}
.sc .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 16px/1.2 inherit;font-family:inherit;min-height:50px;padding:10px 18px;border-radius:14px;border:0;cursor:pointer;width:100%;box-sizing:border-box;transition:background .25s,color .25s,transform .08s,box-shadow .25s;text-decoration:none}.sc .btn:active{transform:scale(.985)}
.sc .btn.go{background:var(--go);color:#fff;box-shadow:0 6px 16px rgba(91,170,133,.25)}.sc .btn.go:hover{background:var(--go-d)}
.sc .btn.act{background:var(--act);color:#fff;box-shadow:0 6px 16px rgba(92,158,173,.25)}.sc .btn.act:hover{background:var(--act-d)}
.sc .btn.info{background:var(--info);color:#fff}.sc .btn.info:hover{background:var(--info-d)}
.sc .btn.ghost{background:#fff;border:2px solid var(--sc-line);color:var(--sc-fg)}.sc .btn.ghost:hover{background:var(--sc-mint)}
.sc .btn.warn{background:#fff;border:2px solid var(--warn);color:var(--warn-d)}.sc .btn.inc{background:#fff;border:2px solid var(--go);color:var(--go-d)}
.sc .btn:disabled{opacity:.45;box-shadow:none;cursor:not-allowed}.sc .btn+.btn{margin-top:8px}
.sc .sc-row{display:flex;gap:10px;align-items:stretch}.sc .sc-row>input{flex:1 1 auto;min-width:0;width:auto}.sc .sc-row .btn{flex:0 0 auto;width:auto;min-width:110px;margin:0}
.sc .btn.busy{opacity:.85;pointer-events:none}.sc .btn.busy::before{content:"";width:16px;height:16px;border:2.5px solid rgba(255,255,255,.55);border-top-color:#fff;border-radius:50%;animation:roofspin .8s linear infinite}.sc .btn.ghost.busy::before,.sc .btn.inc.busy::before,.sc .btn.warn.busy::before{border-color:rgba(0,0,0,.15);border-top-color:currentColor}
.sc .btn.done{background:var(--go)!important;color:#fff!important;border-color:var(--go)!important}
.sc .btn.error{background:#f6e4e4!important;color:var(--warn-d)!important;border:2px solid var(--warn)!important;animation:scshake .35s}
@keyframes scshake{20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
.sc .linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--info-d);text-decoration:underline;cursor:pointer}
.sc-chips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.sc-chip{font-size:13px;font-weight:600;padding:8px 12px;border-radius:999px;background:var(--sc-mint);color:var(--go-d);display:inline-flex;gap:6px;align-items:center}.sc-chip.todo{background:transparent;border:1.5px solid var(--sc-line);color:var(--sc-muted)}.sc-chip.busy{background:#fff3d6;color:#8a5a00}.sc-chip.busy::before{content:"";width:10px;height:10px;border:2px solid #e2a21b;border-top-color:transparent;border-radius:50%;animation:roofspin .8s linear infinite}.sc-chip.err{background:#f6e4e4;color:var(--warn-d)}
.sc-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--sc-muted);margin:12px 0}.sc-consent input{width:22px;height:22px;margin-top:2px;accent-color:var(--go);flex:0 0 auto}
.sc-consent2{background:var(--sc-sand);border-radius:12px;padding:10px 12px;margin:10px 0}
.sc-kinds{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:10px 0 14px}.sc-kind{border:2px solid var(--sc-line);border-radius:14px;padding:12px;text-align:left;cursor:pointer;background:#fff;color:var(--sc-fg);font:600 15px/1.3 inherit;font-family:inherit;display:flex;gap:10px;align-items:center;min-height:64px}.sc-kind em{font-style:normal;font-size:26px}.sc-kind.on{border-color:var(--go);background:var(--sc-mint)}.sc-kind small{display:block;font-weight:500;color:var(--sc-muted);font-size:12px}
.sc-stage{min-width:0}.sc-map{position:relative;border-radius:18px;overflow:hidden;min-height:460px;background:#dfe6ea;box-shadow:var(--sc-shadow)}.sc-map .leaflet-top.leaflet-left{top:auto;bottom:84px}.sc-mapel{position:absolute;inset:0}
@media(max-width:860px){.sc-map{min-height:44vh;border-radius:0 0 18px 18px}}
.sc-cross{position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%);border:3px solid var(--sun);border-radius:50%;box-shadow:0 0 0 2px rgba(0,0,0,.3);pointer-events:none;z-index:5}.sc-cross::before,.sc-cross::after{content:"";position:absolute;background:var(--sun);left:50%;top:-10px;width:3px;height:64px;transform:translateX(-50%)}.sc-cross::after{transform:translateX(-50%) rotate(90deg)}
.sc-tools{position:absolute;left:12px;right:12px;bottom:12px;display:flex;gap:8px;z-index:6;align-items:center;flex-wrap:wrap;justify-content:flex-end}.sc-tools .btn{width:auto;flex:0 0 auto;min-height:44px;margin:0;padding:8px 16px;font-size:15px}.sc-tools .btn.ghost{background:rgba(255,255,255,.94);border-color:transparent}.sc-tools .sc-pinbtn{min-width:150px}
.sc-nav{display:flex;gap:4px;align-items:center;margin-right:auto;background:rgba(255,255,255,.7);border-radius:12px;padding:3px}.sc-nav .btn{min-width:40px;min-height:40px;padding:0 10px;font-size:18px;line-height:1;background:#fff;border:0}.sc-dpad{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-left:4px}.sc-dpad .btn{min-width:30px;min-height:19px;padding:0;font-size:11px;border-radius:6px}.sc-dpad .btn:nth-child(1){grid-column:2}.sc-dpad .btn:nth-child(2){grid-column:1;grid-row:2}.sc-dpad .btn:nth-child(3){grid-column:3;grid-row:2}.sc-dpad .btn:nth-child(4){grid-column:2;grid-row:3}
@media(max-width:600px){.sc-dpad{display:none}.sc-tools [data-sc-lock]{display:none}.sc-credit{display:none}.sc-tools{flex-wrap:nowrap}.sc-tools{left:8px;right:8px;bottom:8px;gap:6px}.sc-tools .btn{padding:8px 12px;font-size:14px;min-height:46px}.sc-tools .sc-pinbtn{min-width:0;flex:1 1 auto}.sc-nav{margin-right:0;padding:2px}.sc-nav .btn{min-width:46px;min-height:46px;font-size:22px}.sc-map .sc-top{top:8px;left:8px}.sc-top span{font-size:12px;padding:7px 10px}}
.sc-opt{font-style:normal;font-weight:500;color:var(--sc-muted)}.sc kbd{display:inline-block;border:1px solid var(--sc-line);border-bottom-width:2px;border-radius:5px;padding:0 5px;font:600 12px/1.6 inherit;background:#fff;margin:0 1px}
.sc-top{position:absolute;left:12px;top:12px;max-width:calc(100% - 24px);display:flex;gap:6px;flex-wrap:wrap;z-index:6}.sc-top span{background:rgba(255,255,255,.94);color:#1f2f3a;font-size:13px;font-weight:600;padding:8px 12px;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.12)}.sc-top .sc-tog{cursor:pointer;opacity:.55}.sc-top .sc-tog.on{opacity:1}
.sc-veil{position:absolute;inset:0;display:grid;place-items:center;text-align:center;background:linear-gradient(160deg,rgba(231,240,234,.97),rgba(243,247,244,.94));padding:24px;z-index:7}.sc-veil h3{font-size:1.3rem;margin:0 0 6px}.sc-veil p{color:var(--sc-muted);max-width:40ch;margin:0 auto}.sc-lock{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#fff;box-shadow:var(--sc-shadow);margin-bottom:12px;font-size:28px}
.sc-toast{position:absolute;left:50%;top:14px;transform:translateX(-50%);background:rgba(31,47,58,.9);color:#fff;padding:8px 14px;border-radius:999px;font-size:14px;z-index:8;max-width:90%}
.sc-credit{margin:8px 0 0}
.sc-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:0 0 10px}.sc-tile{background:var(--sc-mint);border-radius:14px;padding:14px}.sc-tile b{display:block;font-size:1.4rem;line-height:1.15;color:var(--go-d)}.sc-tile span{font-size:13px;color:var(--sc-muted)}.sc-tile.sun{background:var(--sc-sand)}.sc-tile.sun b{color:#7a5a1e}.sc-tile em{font-style:normal;display:block;font-size:12px}
.sc-max{display:flex;gap:10px;align-items:center;background:var(--sc-sand);border-radius:14px;padding:12px 14px;margin:0 0 10px;color:#5a4a20;font-weight:600}.sc-max em{font-style:normal;font-size:1.15rem;font-weight:700}
.sc-tabs{display:flex;gap:4px;margin:12px 0 8px;overflow-x:auto;scrollbar-width:none}.sc-tabs button{flex:0 0 auto;font:700 14px/1 inherit;font-family:inherit;padding:10px 14px;border-radius:999px;border:0;background:transparent;color:var(--sc-muted);cursor:pointer}.sc-tabs button.on{background:var(--go-d);color:#fff}
.sc-pane{min-height:60px}.sc-adj{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sc-adj .btn{min-height:56px;font-size:15px;flex-direction:column;gap:2px;padding:8px;margin:0}.sc-adj .btn small{font-weight:500;color:var(--sc-muted);font-size:12px}
.sc-sticky{position:sticky;bottom:10px;margin-top:14px;background:var(--sc-card);border:2px solid var(--go);border-radius:14px;padding:10px;display:flex;align-items:center;gap:10px;box-shadow:var(--sc-shadow)}.sc-sticky b{flex:1;font-size:15px}.sc-sticky .btn{width:auto;min-height:46px;margin:0}
.sc-slider{display:flex;align-items:center;gap:12px;margin:8px 0}.sc-slider input{flex:1;accent-color:var(--act);height:30px;min-width:0}.sc-slider b{white-space:nowrap;color:var(--go-d)}
.sc-cover{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.sc-cover label{border:2px solid var(--sc-line);border-radius:14px;padding:12px;cursor:pointer;font-size:14px;display:block}.sc-cover label b{display:block}.sc-cover label small{display:block;color:var(--sc-muted)}.sc-cover label.on{border-color:var(--go);background:var(--sc-mint)}
.sc-suntab{width:100%;border-collapse:collapse;font-size:14px}.sc-suntab td,.sc-suntab th{padding:6px 8px;text-align:left;border-bottom:1px solid var(--sc-line)}.sc-suntab th{color:var(--sc-muted);font-weight:600}
.sc-leg{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:3px}.sc-sketch{margin:0 0 10px}.sc-sketch img{width:100%;height:auto;border:1px solid var(--sc-line);border-radius:10px}
.sc-pill{display:inline-block;background:#fff;border:1px solid #B8D2C3;border-radius:999px;padding:3px 10px;margin:2px 0;font-size:13px}
.sc-notes{margin:0 0 0 18px;color:#465C55}.sc-busy{background:var(--sc-sand);border-radius:8px;padding:8px 10px;font-size:14px}.sc-spin{display:inline-block;width:14px;height:14px;border:2px solid #C8D3DC;border-top-color:#174E3B;border-radius:50%;animation:roofspin .8s linear infinite;vertical-align:-2px;margin-right:6px}
.sc-actions{display:grid;gap:8px;margin-top:10px}.sc-actions .btn{margin:0}
.sc-handle{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid #4C9A75;box-shadow:0 2px 6px rgba(0,0,0,.3);box-sizing:border-box}
.fade{animation:scfade .35s ease}@keyframes scfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.fade{animation:none}.sc .btn.error{animation:none}}

/* ===== SiteScan — Stage 2 design studio (v12.7) ===== */
.ss-body{margin:0;background:#eef3f0}
.ss{--fg:#1f2f3a;--muted:#5f7182;--line:#dfe6ec;--card:#fff;--mint:#e9f7ef;--sand:#f6efdc;--go:#5BAA85;--go-d:#2E6B52;--act:#5C9EAD;--act-d:#2F6F7C;--info:#6F93C4;--warn:#D08A8A;--warn-d:#8F4A4A;--shadow:0 10px 28px rgba(31,47,58,.12);color:var(--fg);font:16px/1.45 system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
.ss-top{display:flex;align-items:center;gap:12px;padding:10px max(14px,env(safe-area-inset-right,0px)) 10px max(14px,env(safe-area-inset-left,0px));background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;flex-wrap:wrap}
.ss-back{color:var(--act-d);text-decoration:none;font-weight:600;white-space:nowrap}
.ss-title{flex:1;min-width:0;line-height:1.15}.ss-title b{display:block;font-size:1.05rem;color:var(--go-d)}.ss-title span{font-size:12px;color:var(--muted)}
.ss-topact{display:flex;gap:8px;flex-wrap:wrap}
.ss .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 15px/1.2 inherit;min-height:44px;padding:8px 14px;border-radius:12px;border:0;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s;text-decoration:none}
.ss .btn.go{background:var(--go);color:#fff}.ss .btn.go:hover{background:var(--go-d)}.ss .btn.act{background:var(--act);color:#fff}
.ss .btn.ghost{background:#fff;border:2px solid var(--line);color:var(--fg)}.ss .btn.ghost:hover{background:var(--mint)}.ss .btn.ghost.on{background:var(--go);color:#fff;border-color:var(--go)}
.ss .btn.inc{background:#fff;border:2px solid var(--go);color:var(--go-d)}.ss .btn.inc.on{background:var(--go);color:#fff}
.ss .btn.warn{background:#fff;border:2px solid var(--warn);color:var(--warn-d)}.ss .btn.warn.on{background:var(--warn);color:#fff}
.ss .btn:disabled{opacity:.5;cursor:not-allowed}.ss .btn.busy::before{content:"";width:14px;height:14px;border:2.5px solid rgba(0,0,0,.18);border-top-color:currentColor;border-radius:50%;animation:roofspin .8s linear infinite}
.ss .btn.done{background:var(--go)!important;color:#fff!important;border-color:var(--go)!important}.ss .btn.error{background:#f6e4e4!important;color:var(--warn-d)!important;border:2px solid var(--warn)!important}
.ss .linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--act-d);text-decoration:underline;cursor:pointer}
.ss-main{flex:1;display:grid;grid-template-columns:1fr minmax(320px,400px);gap:12px;padding:12px max(12px,env(safe-area-inset-right,0px)) 12px max(12px,env(safe-area-inset-left,0px));min-height:0}
.ss-stage{display:flex;flex-direction:column;gap:8px;min-width:0}
.ss-views{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}.ss-views::-webkit-scrollbar{display:none}
.ss-views button{flex:0 0 auto;font:700 14px/1 inherit;padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer;min-height:42px}
.ss-views button.on{background:var(--go-d);color:#fff;border-color:var(--go-d)}
.ss-viewport{position:relative;flex:1;min-height:300px;border-radius:16px;overflow:hidden;background:#dfe6ea;box-shadow:var(--shadow)}
.ss-view{position:absolute;inset:0;display:none}.ss-view.on{display:block}
.ss-map,.ss-model{position:absolute;inset:0}.ss-earthwrap{position:absolute;inset:0}.ss-earthwrap iframe{width:100%;height:100%;border:0}
.ss-sketch{position:absolute;inset:0;overflow:auto;background:#fff;display:grid;place-items:center;padding:10px}.ss-sketch img{max-width:100%;height:auto}
.ss-maptools{position:absolute;left:10px;bottom:10px;right:10px;display:flex;gap:6px;flex-wrap:wrap;z-index:6;align-items:center}
.ss-maptools .btn{min-height:40px;padding:6px 12px;background:rgba(255,255,255,.95);border-color:transparent}
.ss-tog{background:rgba(255,255,255,.95);border-radius:999px;padding:8px 12px;font-size:13px;font-weight:600;cursor:pointer;opacity:.55;user-select:none}.ss-tog.on{opacity:1}
.ss-toast{position:absolute;left:50%;top:12px;transform:translateX(-50%);background:rgba(31,47,58,.92);color:#fff;padding:8px 14px;border-radius:999px;font-size:14px;z-index:9;max-width:90%}
.ss-side{display:flex;flex-direction:column;gap:10px;min-width:0}
.ss-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ss-num{background:var(--card);border-radius:12px;padding:10px;box-shadow:var(--shadow)}.ss-num b{display:block;font-size:1.1rem;line-height:1.2;color:var(--go-d)}.ss-num span{font-size:11px;color:var(--muted)}
.ss-acc{background:var(--card);border-radius:14px;box-shadow:var(--shadow);overflow:auto;flex:1;min-height:240px}
.ss-sec{border-bottom:1px solid var(--line)}.ss-sechead{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:0;padding:14px;font:700 15px inherit;color:var(--fg);cursor:pointer;min-height:50px}
.ss-sechead i{font-style:normal;color:var(--muted);font-size:18px}.ss-sec.open .ss-sechead{color:var(--go-d)}.ss-secbody{padding:0 14px 14px}.ss-sec:not(.open) .ss-secbody{display:none}
.ss-field{display:block;margin:10px 0}.ss-field>span{display:block;font-size:12px;font-weight:600;margin-bottom:4px}
.ss-field select,.ss-field input[type=number]{width:100%;box-sizing:border-box;font:inherit;padding:10px;border:2px solid var(--line);border-radius:10px;background:#fff;color:var(--fg)}
.ss-seg{display:flex;gap:6px;margin:8px 0;flex-wrap:wrap}.ss-seg button{flex:1 1 auto;min-width:92px;min-height:42px;border:2px solid var(--line);background:#fff;border-radius:10px;font:600 14px inherit;cursor:pointer;color:var(--fg)}.ss-seg button.on{background:var(--go);color:#fff;border-color:var(--go)}
.ss-slider{display:flex;align-items:center;gap:10px}.ss-slider input{flex:1;accent-color:var(--act);height:30px;min-width:0}.ss-slider b{white-space:nowrap;font-size:13px;color:var(--go-d)}
.ss-pad{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,44px);gap:4px;justify-content:center;margin:8px 0}
.ss-pad .btn{min-height:44px;padding:0;font-size:16px}.ss-pad .btn:nth-child(1){grid-column:2;grid-row:1}.ss-pad .btn:nth-child(2){grid-column:1;grid-row:2}.ss-pad .btn:nth-child(3){grid-column:3;grid-row:2}.ss-pad .btn:nth-child(4){grid-column:2;grid-row:3}
.ss-rot{display:flex;gap:6px;margin:8px 0}.ss-rot .btn{flex:1;min-height:42px;padding:0;font-size:14px}
.ss-two{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.ss-two .btn{min-height:46px;font-size:14px}
.ss-objs{margin:6px 0 6px 2px;padding-left:16px}.ss-objs li{margin:4px 0}
.ss-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:0}.ss-dot.inc{background:var(--go)}.ss-dot.exc{background:var(--warn-d)}.ss-dot.good{background:#4F8FE0}.ss-dot.fair{background:#E0A52A}.ss-dot.poor{background:#9AA7B4}.ss-dot.off{background:#7b8894}
.ss-bars{display:flex;align-items:flex-end;gap:3px;height:70px;margin:6px 0}.ss-bars span{flex:1;background:linear-gradient(180deg,#8ec5a6,#5BAA85);border-radius:3px 3px 0 0;min-height:3px}
.ss-busy{background:var(--sand);border-radius:8px;padding:8px 10px;margin:10px 14px 0;font-size:13px}
.ss-gate{flex:1;display:grid;place-items:center;padding:20px}
.ss-gatecard{background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;max-width:620px}
.ss-gatecard h1{font-size:1.4rem;margin:0 0 8px;color:var(--go-d)}.ss-list{margin:10px 0 14px;padding-left:18px}.ss-list li{margin:6px 0}
.ss-prices{display:grid;gap:8px;margin:12px 0}.ss-prices .btn{width:100%}
@media(min-width:901px){.ss{height:100vh;overflow:hidden}.ss-main{min-height:0;overflow:hidden}.ss-stage{min-height:0}.ss-side{min-height:0;overflow:hidden}.ss-acc{min-height:0}}
@media(max-width:900px){.ss-main{grid-template-columns:1fr}.ss-viewport{min-height:46vh}.ss-nums{grid-template-columns:repeat(3,1fr)}.ss-top{position:sticky}.ss-acc{overflow:visible}}
@media(max-width:420px){.ss-num b{font-size:.95rem}.ss-maptools{gap:4px}.ss-maptools .btn{padding:6px 9px}}
.sc-door{background:var(--sc-mint);border:2px solid var(--go);border-radius:14px;padding:14px;margin:0 0 10px}
.sc-door.locked{background:var(--sc-sand);border-color:#d9b36a}
.sc-door b{display:block;font-size:1.05rem;margin-bottom:4px}.sc-door .btn{width:100%;margin-top:6px}
.sc-door.app{background:#eef4fb;border-color:#5C9EAD}
/* SiteScan: open it in the app (v12.8) */
.ss-appsteps{background:#f5f8f6;border:1px solid #dfe6ec;border-radius:12px;padding:12px 14px;margin:12px 0}
.ss-appsteps h2{font-size:1rem;margin:0 0 6px;color:#174E3B}
.ss-appsteps ol{margin:0;padding-left:20px}.ss-appsteps li{margin:4px 0}
[data-ss-appgate] .ss-gatecard .btn.go{width:100%;max-width:420px}
.sc-objrows{display:grid;gap:6px;margin:6px 0 10px}
.sc-objrow{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--sc-line);border-radius:10px;padding:8px 10px}
.sc-objrow span{flex:1;min-width:0;font-size:14px}
.sc-objrow .btn{width:auto;flex:0 0 auto;min-height:40px;padding:6px 14px;font-size:14px;margin:0}

/* ---- trimming the outline, the usable-area question, and the mounting chooser (v12.9) ---- */
.sc-trim{background:#eef5f1;border:1px solid var(--go);border-radius:12px;padding:10px 12px;margin:0 0 10px}
.sc-trim b{display:block;color:#174E3B}
.sc-trim p{margin:2px 0 8px}
.sc-ask{background:var(--sc-sand);border:1px solid #d9b36a;border-radius:12px;padding:12px;margin:12px 0}
.sc-ask b{display:block;margin-bottom:2px;font-size:1.02rem}
.sc-ask p{margin:0 0 8px}
.sc-mounts{margin:0 0 12px}
.sc-mounts>b{display:block;font-size:1.02rem;color:#174E3B}
.sc-mounts>p{margin:2px 0 8px}
.sc-mount{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;background:#fff;border:1px solid var(--sc-line);border-radius:12px;padding:10px 12px;margin:0 0 8px}
.sc-mount.on{border-color:var(--go);background:#eef5f1;box-shadow:inset 0 0 0 1px var(--go)}
.sc-mountl{min-width:0}
.sc-mountl b{display:block}
.sc-mountl span{display:block;margin-top:2px}
.sc-best{display:inline-block;background:var(--go);color:#fff;border-radius:999px;padding:1px 8px;font-size:11px;font-style:normal;font-weight:700;margin-left:6px;vertical-align:1px}
.sc-mountn{flex:0 0 auto;text-align:right;min-width:104px}
.sc-mountn b{display:block;font-size:1.3rem;line-height:1.1;color:#174E3B}
.sc-mountn span{display:block;font-size:12px;color:var(--sc-muted);margin-bottom:6px}
.sc-mountn em{font-style:normal;font-size:12px;font-weight:700;color:var(--go)}
.sc-mountn .btn{width:auto;min-height:38px;padding:6px 14px;font-size:14px;margin:0}
@media(max-width:420px){.sc-mount{flex-direction:column;gap:6px}.sc-mountn{text-align:left;display:flex;align-items:center;gap:10px}.sc-mountn b{font-size:1.15rem}.sc-mountn span{margin:0}}

/* The Solar Site Check is a focused flow: its own sticky action is the only one at the bottom, so the
   site's quick-action bar and the floating chat button stay out of the way of the map tools and the tabs. */
.sc-page .mobile-bar{display:none!important}
.sc-page .float-wa{display:none}
@media(max-width:560px){.sc-tabs{flex-wrap:wrap;overflow:visible}.sc-tabs button{padding:9px 12px;font-size:13px}}
/* The wizard carries its own step bar, so the site header scrolls away with the page instead of covering
   the card (on a phone a sticky header hides the tabs you are trying to press). */
.sc-page header.site{position:static}
.sc-tabs{scroll-margin-top:16px}
/* The sticky "Continue" bar follows the card, but only its button takes taps — everything it floats over
   (the tabs, the panes) stays reachable. The site's quick-action bar is hidden here, so it sits low again. */
@media(max-width:860px){.sc-page .sc-sticky{bottom:10px}}
.sc-sticky{pointer-events:none}
.sc-sticky .btn{pointer-events:auto}
.sc-tabs{scroll-margin-bottom:90px}
/* The trim and the yes/no question wrap their buttons instead of pushing the card wider than the phone. */
.sc .sc-trim .sc-row,.sc .sc-ask .sc-row{flex-wrap:wrap}
.sc .sc-trim .sc-row .btn,.sc .sc-ask .sc-row .btn{flex:1 1 auto;min-width:0;white-space:nowrap}
/* v12.18 Site Check: three sizes side by side, and measured / assumed labels */
.roof-opts{margin:14px 0}.roof-opts h3{margin:0 0 8px;font-size:1.1rem}.opts3{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.opt{border:1.5px solid #DCE4EC;border-radius:12px;padding:12px;background:#fff}.opt.on{border-color:#1D8054;box-shadow:0 0 0 2px #E5F3EC}.opt h4{margin:0 0 2px;font-size:1rem}.opt .opt-kw{display:block;font-size:1.5rem;color:#174E3B;margin-bottom:6px}
.opt dl{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0 0 8px;font-size:.92rem}.opt dt{color:#5d6d7d}.opt dd{margin:0;text-align:right}.opt dd small{display:block;font-size:.78rem;color:#1D8054}.opt.muted{background:#F7F9FB}
.nt{display:inline-block;font-style:normal;font-size:.72rem;line-height:1.4;padding:0 6px;border-radius:999px;margin-left:4px;vertical-align:1px;background:#EEF2F6;color:#3f5568}.nt-measured{background:#E5F3EC;color:#17603E}.nt-from{background:#E8EEF7;color:#0B57A6}.nt-assumed{background:#FFF2CC;color:#7a5a00}
/* v12.18 finishing touches for the website */
:where(a,button,.btn,summary,input,select,textarea):focus-visible{outline:3px solid rgba(242,178,27,.85);outline-offset:2px}
::selection{background:#F2B21B55}
img{max-width:100%;height:auto}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* v12.26 testimonials from real customer ratings */
.q-ver{display:block;font:600 12px/1.3 Inter,Arial,sans-serif;color:var(--ink-2,#3b5168);margin-bottom:6px}.q-stars{color:#E0A100;letter-spacing:1px}

/* =========================================================
   v12.26 home page: photo hero with the instant estimate, segment cards, stats band, reviews; one slim top bar
   ========================================================= */
.topbar .wrap:has(.news-line){flex-wrap:nowrap}.topbar .wrap:has(.news-line) .offer{flex:none;white-space:nowrap}.topbar .wrap:has(.news-line) .contacts{flex:none}.topbar .wrap:has(.news-line) .contacts .hide-sm{display:none}
.topbar .news-line{flex:1 1 auto;margin:0 0 0 18px;display:flex;align-items:center;gap:8px;min-width:0;font-size:.86rem;white-space:nowrap;overflow:hidden}
.topbar .news-line a{color:#fff;font-weight:500;text-overflow:ellipsis;overflow:hidden;min-width:0}
.nl-badge{flex:none;background:var(--leaf);color:#fff;font-weight:600;font-size:.74rem;padding:2px 8px;border-radius:999px}
@media (max-width:980px){.topbar .news-line{display:none}}
.hx{position:relative;color:#fff;background:var(--night);overflow:hidden;isolation:isolate}
.hx-media{position:absolute;inset:0;z-index:-1}
.hx-bg{position:absolute;inset:0;opacity:0;transition:opacity .7s ease}.hx-bg.is-on{opacity:1}
.hx-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.hx-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,26,46,.86) 0%,rgba(7,26,46,.62) 34%,rgba(7,26,46,.08) 62%,rgba(7,26,46,0) 100%),linear-gradient(0deg,rgba(7,26,46,.55),transparent 30%)}
.hx-bg img{filter:saturate(1.18) brightness(1.06) contrast(1.04)}
.hx-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,440px);gap:clamp(24px,5vw,72px);align-items:center;padding-top:clamp(40px,7vw,96px);padding-bottom:clamp(40px,7vw,96px)}
.hx-tag{display:inline-flex;align-items:center;gap:8px;margin:0 0 18px;font-weight:600;font-size:.95rem;color:#FFE08A}
.hx-dot{width:10px;height:10px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 6px rgba(242,178,27,.22)}
.hx h1{color:#fff;font-size:clamp(2.2rem,4.2vw,3.5rem);line-height:1.08;letter-spacing:-.022em;margin:0 0 18px;max-width:19ch;text-wrap:balance;text-shadow:0 2px 24px rgba(7,26,46,.45)}
.hx-lead{font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6;color:#E6EEF6;max-width:50ch;margin:0 0 26px;text-shadow:0 1px 12px rgba(7,26,46,.5)}
.btn-lg{padding:16px 28px;font-size:1.05rem}
.btn-glass{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.55);backdrop-filter:blur(6px)}
.btn-glass:hover,.btn-glass:focus-visible{background:#fff;color:var(--cell)}
.hx-proof{list-style:none;margin:34px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px 34px}
.hx-proof li{display:flex;flex-direction:column}.hx-proof b{font-family:var(--font-head);font-size:1.7rem;line-height:1.1;color:var(--sun)}.hx-proof span{font-size:.86rem;color:#C9D7E5}
.hx-calc{background:#fff;color:var(--ink);border-radius:22px;padding:22px 22px 18px;box-shadow:0 30px 70px -30px rgba(0,0,0,.65);border-top:6px solid var(--sun)}
.hx-segs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:#EEF3F8;border-radius:12px;padding:4px;margin-bottom:18px}
.hx-seg{border:0;background:none;border-radius:9px;padding:9px 4px;font:600 .84rem/1.2 var(--font);color:var(--muted);cursor:pointer}
.hx-seg.is-on{background:#fff;color:var(--cell);box-shadow:0 2px 8px -3px rgba(14,42,71,.35)}
.hx-seg:focus-visible{outline:3px solid var(--sky);outline-offset:1px}
.hx-bill{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.hx-bill label{font-weight:600;font-size:.95rem;color:var(--cell)}
.hx-bill output{font-family:var(--font-head);font-size:1.6rem;font-weight:700;color:var(--cell)}
.hx-calc input[type=range]{width:100%;margin:10px 0 6px;accent-color:var(--sun);height:28px;cursor:pointer}
/* the signature element: a row of solar cells that light up as the bill (and the system) grows */
.hx-cells{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;margin:4px 0 16px}
.hx-cells i{display:block;aspect-ratio:1.6;border-radius:3px;background:linear-gradient(135deg,#1D4F80,#0E2A47);position:relative;overflow:hidden;transition:background .35s ease}
.hx-cells i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 48%,rgba(255,255,255,.25) 50%,transparent 52%),linear-gradient(0deg,transparent 48%,rgba(255,255,255,.18) 50%,transparent 52%)}
.hx-cells i.lit{background:linear-gradient(135deg,#FFD24A,#F2A20B)}
.hx-out{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}
.hx-out div{background:#F4F7FA;border-radius:12px;padding:10px 12px}
.hx-out dt{font-size:.8rem;color:var(--muted);margin:0}
.hx-out dd{margin:2px 0 0;font-family:var(--font-head);font-weight:700;font-size:1.22rem;color:var(--cell);line-height:1.2}
.hx-out .hx-sub{background:#E6F6EE}.hx-out .hx-sub dd{color:var(--leaf)}
.hx-go{display:flex;justify-content:center;width:100%}
.hx-note{font-size:.78rem;color:var(--muted);margin:10px 0 0;text-align:center}
@media (max-width:900px){.hx-grid{grid-template-columns:1fr}.hx h1{max-width:none}.hx-shade{background:linear-gradient(180deg,rgba(7,26,46,.82),rgba(7,26,46,.9))}.hx-proof{margin-top:24px}}
@media (max-width:420px){.hx-seg{font-size:.76rem}.hx-out dd{font-size:1.05rem}}
@media (prefers-reduced-motion:reduce){.hx-bg,.hx-cells i{transition:none}}
.seg-band .lead{max-width:60ch}
.seg-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.seg-card{position:relative;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:#fff;color:var(--ink);text-decoration:none;box-shadow:0 14px 34px -22px rgba(14,42,71,.55);border-bottom:5px solid var(--acc,var(--sun))}
.seg-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.seg-body{display:flex;flex-direction:column;gap:6px;padding:16px 18px 18px;flex:1}
.seg-body b{font-family:var(--font-head);font-size:1.12rem;color:var(--cell);line-height:1.25}
.seg-body>span{font-size:.93rem;color:var(--muted)}
.seg-go{margin-top:auto;padding-top:8px;font-style:normal;font-weight:600;color:var(--acc-ink,var(--cell))}
.seg-card:hover .seg-go,.seg-card:focus-visible .seg-go{text-decoration:underline}
.seg-card:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.seg-home{--acc:var(--sun);--acc-ink:#9A6A00}.seg-business{--acc:var(--sky);--acc-ink:#0F6CB0}.seg-factory{--acc:var(--leaf);--acc-ink:var(--leaf)}.seg-farm{--acc:var(--saffron);--acc-ink:#B5560C}
@media (max-width:1000px){.seg-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.seg-grid{grid-template-columns:1fr}}
.stat-band{background:linear-gradient(100deg,#F2B21B,#F8C843 55%,#F57C1F);padding:clamp(22px,3vw,34px) 0}
.stat-band .stats{margin:0;border:0}.stat-band .stats b{color:var(--night)}.stat-band .stats span{color:#3D2A00}
.rev-band{background:linear-gradient(180deg,#FFF8E6,#fff 70%)}
.rev-band .head{align-items:flex-end}
.rev-cities{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-wrap:wrap;gap:8px}
.rev-cities li{background:#fff;border:1px solid #F1D98D;color:#7A5600;border-radius:999px;padding:4px 12px;font-size:.86rem;font-weight:600}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rev-grid .quote{height:100%;margin:0;background:#fff;border-radius:18px;border:1px solid #F0E3BC;box-shadow:0 14px 30px -24px rgba(122,86,0,.6)}
@media (max-width:900px){.rev-grid{grid-template-columns:1fr}}
.rev-more{margin:18px 0 0}
.rev-empty{background:#fff;border:1px dashed #E8C766;border-radius:18px;padding:22px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.rev-empty p{margin:0;max-width:60ch}
/* v12.26 offers on the home page: three bright cards instead of one white list */
.fest-grid.no-wish .fest-offers{background:none;padding:0;color:#fff;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.fest-grid.no-wish .fest-head,.fest-grid.no-wish .fest-count,.fest-grid.no-wish .fest-offers>.textlink{grid-column:1/-1}
.fest-grid.no-wish .fest-head h3{color:#fff;font-size:clamp(1.3rem,2vw,1.6rem);margin:0}
.fest-grid.no-wish .fest-offer{flex-direction:column;align-items:flex-start;justify-content:space-between;background:#fff;color:var(--ink);border-radius:16px;padding:18px;border-top:5px solid var(--sun);height:100%}
.fest-grid.no-wish .fest-offer:nth-of-type(2){border-top-color:var(--sky)}.fest-grid.no-wish .fest-offer:nth-of-type(3){border-top-color:var(--leaf)}
.fest-grid.no-wish .fest-offer b{font-family:var(--font-head);font-size:1.08rem;color:var(--cell)}
.fest-grid.no-wish .fest-offers>.textlink{color:#FFE08A;justify-self:start}
@media (max-width:900px){.fest-grid.no-wish .fest-offers{grid-template-columns:1fr}}
.hx-bill{flex-wrap:wrap}.hx-bill output{white-space:nowrap}
@media (max-width:600px){.hx-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hx-proof b{font-size:1.25rem}.hx-proof span{font-size:.74rem;line-height:1.3}.hx .btn-row .btn{width:100%}}
/* v12.26 the GreenCube story and labelled sample reviews */
.story{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,64px);align-items:center}
.story-photo{border-radius:22px;box-shadow:0 24px 50px -30px rgba(14,42,71,.6)}
.story-photo img{width:100%;height:100%;object-fit:cover}
.story-steps{list-style:none;counter-reset:st;margin:22px 0 26px;padding:0;display:grid;gap:16px}
.story-steps li{counter-increment:st;display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:start}
.story-steps li::before{content:counter(st);grid-row:span 2;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:700 1.05rem var(--font-head);color:var(--cell);background:var(--sun)}
.story-steps li:nth-child(2)::before{background:var(--sky);color:#fff}.story-steps li:nth-child(3)::before{background:var(--leaf);color:#fff}.story-steps li:nth-child(4)::before{background:var(--saffron);color:#fff}
.story-steps b{font-family:var(--font-head);color:var(--cell);font-size:1.08rem}.story-steps span{color:var(--muted)}
@media (max-width:900px){.story{grid-template-columns:1fr}.story-photo{--ar:16/10!important}}
.rev-sample{position:relative;height:100%;margin:0;background:#fff;border-radius:18px;border:1px solid #F0E3BC;box-shadow:0 14px 30px -24px rgba(122,86,0,.6)}
.rev-tag{display:inline-block;margin-left:6px;font:600 .68rem/1 var(--font);color:#8A6A1A;background:#FFF4D6;border-radius:999px;padding:3px 7px;vertical-align:1px}
.rev-note{font-size:.86rem;color:var(--muted);margin:14px 0 0}