@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('./assets/fonts/fraunces-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('./assets/fonts/plus-jakarta-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root{--ink:#18301e;--deep:#1f3d26;--deep2:#173120;--green:#4f8452;--leaf:#8ead69;--sun:#b89a4e;--cream:#f5f8f1;--line:#dae4d6;--text:#4b5a4d;--mute:#697b6b;--ease:cubic-bezier(.22,.8,.26,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--cream);font-family:"Plus Jakarta Sans",Arial,sans-serif;-webkit-font-smoothing:antialiased;font-size:15px}
a{text-decoration:none;color:inherit}
button{font:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid #a4b982;outline-offset:4px}
img{display:block;max-width:100%}
.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}
.concept-bar{height:37px;background:#1d3823;color:#f2f7ed;display:flex;gap:18px;padding:0 max(30px,calc((100% - 1420px)/2));align-items:center;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:.04em}
.concept-chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.green-pulse{width:7px;height:7px;display:inline-block;border-radius:50%;background:#a4d084;box-shadow:0 0 0 3px rgba(164,208,132,.13)}
.concept-aux{color:#c2d4bc;font-weight:600;text-transform:none;letter-spacing:0}
.concept-aux span{padding:0 10px;color:#91ae89}
.site-link{font-size:10px;color:#d3e5c9}
.site-link:hover{text-decoration:underline}
.header{padding:23px 34px 18px}
.header-inner{height:74px;max-width:1430px;margin:auto;border-radius:42px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 22px 0 30px;background:#fff;border:1px solid #e9eee5;box-shadow:0 14px 35px rgba(31,61,38,.07)}
.brand{flex:none;display:block}.brand img{width:166px;height:auto}
.top-nav{display:flex;align-items:center;gap:clamp(12px,1.8vw,33px);margin:auto}
.top-nav a{font-size:12.5px;font-weight:700;color:#344736;white-space:nowrap;position:relative;padding:25px 0}
.top-nav a:after{position:absolute;content:"";bottom:16px;left:0;right:0;height:2px;border-radius:1px;background:transparent}
.top-nav a.current:after,.top-nav a:hover:after{background:var(--green)}
.header-contact{height:46px;padding:0 17px 0 20px;border-radius:26px;display:flex;align-items:center;gap:13px;background:var(--green);font-size:12px;font-weight:800;color:#fff;white-space:nowrap;transition:background .2s}
.header-contact:hover,.action-primary:hover{background:#3b6d3e}
.header-contact svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
.mobile-call{display:none}
.hero-wrap{max-width:1430px;margin:0 auto;padding:0 34px}
.hero-stage{position:relative;height:326px;background:#fff;border-radius:25px;overflow:hidden;border:1px solid #edf0e9;box-shadow:0 22px 50px rgba(28,50,29,.038)}
.hero-slide{position:absolute;inset:0;display:grid;grid-template-columns:53% 47%;gap:0;padding:18px 18px 18px 44px;opacity:0;transform:translateY(9px);visibility:hidden;pointer-events:none;transition:opacity .66s ease,transform .66s var(--ease),visibility 0s linear .66s;z-index:0}
.hero-slide.is-active{opacity:1;transform:translateY(0);visibility:visible;pointer-events:auto;transition:opacity .66s ease,transform .66s var(--ease);z-index:1}
.hero-content{min-width:0;padding:10px 24px 12px 0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.eyebrow{color:var(--green);font-size:10.5px;font-weight:800;letter-spacing:.11em;line-height:1.4;display:flex;align-items:center;gap:10px;margin-bottom:11px;white-space:nowrap}
.eyebrow-rule{height:3px;width:23px;background:var(--sun);border-radius:3px;flex:none}
.hero-content h1,.hero-content h2{font-size:clamp(38px,3.23vw,47px);font-weight:800;letter-spacing:-.045em;line-height:1.055;margin:0;color:var(--ink)}
.hero-content h1 em,.hero-content h2 em{font-family:Fraunces,Georgia,serif;font-style:italic;color:#4f8452;font-weight:500;letter-spacing:-.025em}
.hero-description{max-width:600px;font-size:14px;line-height:1.64;font-weight:500;color:var(--text);margin:14px 0 18px;text-wrap:pretty}
.hero-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.action-primary,.action-secondary{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:44px;padding:10px 17px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap;transition:background .2s,transform .2s,box-shadow .2s}
.action-primary{background:var(--green);color:#fff;box-shadow:0 6px 13px rgba(79,132,82,.1)}
.action-primary span{font-size:16px;font-weight:700;line-height:1}
.action-secondary{color:var(--green);background:#fff;border:1px solid #c0d0b8}
.action-secondary:hover{background:#f0f6ec}
.action-primary:hover,.action-secondary:hover{transform:translateY(-1px)}
.photo-side{position:relative;height:100%;min-width:0;overflow:hidden;border-radius:17px;background:#e5ede2}
.photo-side img{height:100%;width:100%;object-fit:cover;object-position:center 57%}
.photo-people img{object-position:center 43%}
.photo-label{position:absolute;left:18px;top:17px;border-radius:30px;padding:9px 13px;display:flex;gap:9px;align-items:center;background:rgba(255,255,255,.95);color:#23432b;font-size:10px;font-weight:800;box-shadow:0 6px 15px rgba(0,0,0,.06);white-space:nowrap}
.label-icon{background:#e5efe0;color:#568557;border-radius:50%;height:22px;width:22px;display:inline-grid;place-items:center;font-size:15px}
.photo-counter{position:absolute;right:18px;bottom:14px;background:#173120;color:#fff;border-radius:20px;padding:9px 13px;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.06em}
.photo-counter span{color:#a8c5a2}
.slide-navigation{display:flex;align-items:center;gap:36px;padding:13px 1px 12px;min-height:91px}
.story-label{flex:0 0 204px;display:flex;flex-direction:column;gap:5px}
.story-label-title{font-size:10px;letter-spacing:.12em;font-weight:800;color:#4f8452}
.story-label-sub{font-size:11.5px;color:#627261;font-weight:600}
.story-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;flex:1}
.story-tab{border:0;background:transparent;color:#778575;display:flex;align-items:center;gap:9px;text-align:left;position:relative;padding:10px 0 14px;min-width:0}
.story-tab-number{font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}
.story-tab-name{font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.story-tab.is-current{color:var(--deep)}
.progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#dce6d8;overflow:hidden;border-radius:5px}
.progress>span{display:block;width:0;height:100%;background:var(--green);border-radius:5px}
.story-tab.is-current .progress>span{animation:progress-fill 5s linear forwards}
.hero-wrap.is-paused .story-tab.is-current .progress>span{animation-play-state:paused}
@keyframes progress-fill{from{width:0}to{width:100%}}
.arrow-controls{display:flex;gap:7px;flex:none;align-items:center}
.arrow-btn,.pause-btn{background:#fff;border:1px solid #d6e3d2;display:grid;place-items:center;border-radius:50%;width:38px;height:38px;color:#3e6641;transition:background .18s}
.arrow-btn:hover,.pause-btn:hover{background:#e3eddf}
.arrow-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pause-btn{width:31px;height:31px;margin-left:4px;border-color:transparent;background:transparent}
.pause-icon{width:12px;height:14px;display:block;position:relative;border-left:3px solid currentColor;border-right:3px solid currentColor}
.pause-btn[aria-pressed="true"] .pause-icon{border:0;width:0;height:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}
.trust-row{max-width:1362px;margin:5px auto 0;padding:19px 25px;border-top:1px solid #d9e2d7;display:grid;grid-template-columns:1fr 1.1fr 1.05fr 1.05fr;align-items:center;gap:15px}
.trust-item{display:flex;gap:11px;align-items:center;min-width:0}
.trust-mark{width:34px;height:34px;border:1px solid #d4e2cd;border-radius:50%;flex:none;display:grid;place-items:center}
.trust-mark svg{width:18px;height:18px;fill:none;stroke:#4f8452;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.trust-item strong{font-size:11px;font-weight:800;display:block}
.trust-item small{font-size:10px;color:#798678;display:block;margin-top:3px}
.powered{display:flex;align-items:center;justify-content:flex-end;gap:12px;border-left:1px solid #d5e1d1;min-height:38px;padding-left:19px}
.powered span{font-weight:800;font-size:10px;letter-spacing:.1em;color:#6f8170;white-space:nowrap}
.powered img{width:145px;height:auto}
.concept-footer{max-width:1362px;margin:20px auto;padding:13px 25px;border-top:1px solid #e4ebe0;display:flex;justify-content:space-between;gap:15px;color:#8b998a;font-size:10px;line-height:1.6}
@media(max-width:1220px){.top-nav{gap:14px}.top-nav a{font-size:11.5px}.hero-content h1,.hero-content h2{font-size:41px}.hero-slide{grid-template-columns:52% 48%;padding-left:30px}.hero-description{font-size:12.8px}.hero-actions{gap:8px}.action-primary,.action-secondary{padding:10px 14px;font-size:11.5px}.story-label{flex-basis:160px}.powered img{width:120px}}
@media(max-width:1020px){.top-nav{display:none}.hero-content h1,.hero-content h2{font-size:36px}.hero-stage{height:330px}.hero-slide{padding-left:26px;grid-template-columns:54% 46%}.trust-row{grid-template-columns:repeat(2,1fr);row-gap:19px}.powered{justify-content:flex-start;border:0;padding:0}.story-label{display:none}.slide-navigation{gap:20px}}
@media(max-width:690px){
 .concept-bar{padding:0 19px;height:32px;font-size:9px}.concept-aux{display:none}.header{padding:14px 14px 12px}.header-inner{height:62px;border-radius:36px;padding:0 12px 0 20px}.brand img{width:148px}.header-contact{display:none}.mobile-call{background:var(--green);border-radius:50%;display:grid;place-items:center;width:40px;height:40px;color:#fff}.mobile-call svg{height:19px;width:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
 .hero-wrap{padding:0 14px}.hero-stage{height:580px;border-radius:20px}.hero-slide{display:flex;flex-direction:column;gap:0;padding:0 14px 13px;align-items:stretch}.hero-content{flex:none;justify-content:flex-start;padding:25px 10px 13px;min-height:333px}.eyebrow{font-size:9px;letter-spacing:.09em;margin-bottom:12px}.eyebrow-rule{width:16px;height:2px}.hero-content h1,.hero-content h2{font-size:clamp(32px,8vw,40px);line-height:1.075}.hero-description{font-size:12.5px;line-height:1.6;margin:12px 0 16px;max-width:470px}.hero-actions{gap:7px}.action-primary,.action-secondary{min-height:38px;padding:9px 14px;font-size:10px;gap:7px}.photo-side{flex:1;min-height:0;border-radius:13px}.photo-label{font-size:9px;left:11px;top:10px;padding:7px 10px;gap:6px}.label-icon{height:20px;width:20px;font-size:13px}.photo-counter{right:10px;bottom:9px;font-size:10px;padding:7px 10px}.photo-side img{object-position:center 47%}.photo-people img{object-position:center 42%}
 .slide-navigation{min-height:78px;gap:10px;padding:9px 1px 8px}.story-tabs{gap:10px}.story-tab{gap:6px;flex-direction:column;align-items:flex-start;padding:8px 0 12px}.story-tab-number{font-size:10px}.story-tab-name{font-size:9.5px;max-width:100%}.arrow-controls{gap:4px}.arrow-btn{width:29px;height:29px}.arrow-btn svg{height:15px;width:15px}.pause-btn{width:25px;height:25px;margin-left:0}
 .trust-row{margin:4px 14px 0;padding:18px 5px 5px;gap:20px 10px;grid-template-columns:repeat(2,minmax(0,1fr))}.trust-item{gap:8px}.trust-item strong{font-size:10px}.trust-item small{font-size:9px}.trust-mark{height:29px;width:29px}.trust-mark svg{height:15px;width:15px}.powered{justify-content:flex-start;gap:8px}.powered span{font-size:9px}.powered img{width:98px}.concept-footer{margin:15px 14px;padding:12px 0 30px;display:block}.concept-footer span{display:block;margin-bottom:3px}
}
@media(max-width:370px){.hero-stage{height:605px}.hero-content{min-height:349px}.hero-content h1,.hero-content h2{font-size:32px}.hero-description{font-size:12px}.hero-actions{flex-direction:column;align-items:flex-start}.hero-actions a{min-height:35px}.story-tab-name{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.story-tab.is-current .progress>span{width:100%}}

/* Contest scope: hero only; original Solar Shop header/menu and footer remain untouched. */
.hero-wrap{padding-top:30px;}
@media(max-width:690px){.hero-wrap{padding-top:18px;}}


/* Original Solar Shop header and highlight ticker are retained; only the hero is redesigned. */
.hero-wrap{padding-top:115px;}
@media (max-width:690px){.hero-wrap{padding-top:108px;}}
.hdr .bar{box-sizing:border-box;}
.tick{max-width:100%;}


/* Mobile hero: keep photography close to message, preserve CTA fit. */
@media (min-width:371px) and (max-width:690px) {
  .hero-stage { height: 530px; }
  .hero-content { min-height:285px; }
}


/* Three semantic slide icons in place of numeric navigation labels. */
.story-tab-icon{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:var(--green)}
.story-tab:not(.is-current) .story-tab-icon{color:#87988a}
.story-tab{gap:9px}
.hero-trust .hero-content h2{font-size:clamp(31px,2.58vw,37px);line-height:1.06}
.hero-trust .hero-description{font-size:12px;line-height:1.5;margin:8px 0 9px;max-width:585px}
.hero-trust .eyebrow{margin-bottom:8px}
.hero-proof{display:flex;align-items:stretch;gap:0;margin:0 0 10px;width:min(100%,485px);border:1px solid #d8e5d5;border-radius:12px;background:#f6faf3}
.proof-point{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:8px 13px 9px}
.proof-point+.proof-point{border-left:1px solid #d8e5d5}
.proof-point strong{font-weight:800;font-size:21px;line-height:1.05;letter-spacing:-.04em;color:#1f3d26}
.proof-point span{font-size:10px;font-weight:700;color:#586a5b;margin-top:4px;white-space:nowrap}
.proof-footnote{margin:6px 0 0;font-size:9px;line-height:1.3;font-weight:500;color:#718072}
.hero-trust .hero-actions{gap:8px}
.hero-trust .action-primary,.hero-trust .action-secondary{min-height:37px;padding:7px 14px;font-size:11px}
@media(min-width:691px) and (max-width:1100px){
 .hero-trust .hero-content h2{font-size:30px}
 .hero-trust .hero-description{font-size:11px}
 .proof-point{padding:7px 9px}
 .proof-point strong{font-size:19px}
 .proof-point span{font-size:9px}
}
@media(max-width:690px){
 .story-tab{flex-direction:row;align-items:center;flex-wrap:wrap;column-gap:5px;row-gap:3px;padding:9px 0 11px}
 .story-tab-icon{width:16px;height:16px}
 .story-tab-name{font-size:9px;max-width:calc(100% - 21px)}
 .hero-trust .hero-content{padding-top:20px;min-height:285px}
 .hero-trust .eyebrow{font-size:8px;margin-bottom:8px}
 .hero-trust .hero-content h2{font-size:29px;line-height:1.07}
 .hero-trust .hero-description{font-size:10.5px;line-height:1.4;margin:8px 0}
 .hero-proof{border-radius:9px;margin-bottom:8px}
 .proof-point{padding:6px 6px 7px}
 .proof-point strong{font-size:17px}
 .proof-point span{font-size:8px;margin-top:3px}
 .hero-trust .action-primary,.hero-trust .action-secondary{font-size:9.5px;padding:7px 9px;min-height:34px}
 .hero-trust .hero-actions{gap:6px}
 .proof-footnote{margin:4px 0 0;font-size:8px}
}
@media(max-width:370px){
 .story-tab-icon{width:14px;height:14px}
 .story-tab-name{font-size:8px}
 .hero-trust .hero-content{min-height:345px}
 .hero-trust .hero-description{font-size:10px}
}

/* Mobile final QA: place icon above label to avoid cramped/truncated names. */
@media(max-width:690px){
 .story-tab{flex-direction:column;align-items:flex-start;gap:3px;flex-wrap:nowrap;padding:7px 0 11px}
 .story-tab-icon{width:16px;height:16px}
 .story-tab-name{font-size:9.5px;max-width:100%;line-height:1.2}
 .hero-trust .hero-description{font-size:11px}
 .proof-point span{font-size:9px}
 .hero-trust .action-primary,.hero-trust .action-secondary{font-size:10.5px}
 .proof-footnote{font-size:8.8px}
}


@media(max-width:370px){
 .story-tab{min-height:57px}
 .story-tab-name{font-size:8.7px;white-space:normal;overflow:visible;line-height:1.12;max-width:100%;text-wrap:balance}
}

/* Sunlight cursor: a subtle brand-appropriate alternative to Solar Shop's
   original round ring. Scoped to our hero ONLY, for fine-pointer devices. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .hero-wrap.sunlight-cursor-enabled,
  .hero-wrap.sunlight-cursor-enabled *{cursor:none!important}
  .sunlight-cursor{
    position:fixed;z-index:9999;left:-100px;top:-100px;
    width:60px;height:60px;pointer-events:none;user-select:none;
    transform:translate(-50%,-50%);opacity:0;
    transition:opacity .18s ease;will-change:left,top;
    color:#B89A4E;
  }
  .sunlight-cursor.is-visible{opacity:1}
  .sunlight-cursor__rays{position:absolute;inset:0;width:100%;height:100%;fill:none;
    stroke:#B89A4E;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;
    opacity:.88;transform:scale(.8);
    transition:transform .26s cubic-bezier(.2,.75,.25,1),opacity .2s ease;
  }
  .sunlight-cursor__halo{
    position:absolute;inset:14px;border:1.7px solid #C6A255;border-radius:50%;
    background:rgba(242,208,131,.13);
    transition:inset .24s ease,background .24s ease,border-color .24s ease;
  }
  .sunlight-cursor__core{
    position:absolute;left:50%;top:50%;width:9px;height:9px;
    background:#C9A255;border:1px solid #F7EAD0;border-radius:50%;
    transform:translate(-50%,-50%);
    box-shadow:0 0 0 2px rgba(184,154,78,.11);
    transition:transform .2s ease,background .2s ease;
  }
  .sunlight-cursor__pulse{
    position:absolute;left:50%;top:50%;width:18px;height:18px;border-radius:50%;
    border:1.6px solid #C9A255;opacity:0;transform:translate(-50%,-50%) scale(.7);
  }
  .sunlight-cursor.is-action .sunlight-cursor__rays{transform:scale(1.04);opacity:1}
  .sunlight-cursor.is-action .sunlight-cursor__halo{inset:9px;border-color:#B89A4E;background:rgba(242,208,131,.19)}
  .sunlight-cursor.is-photo .sunlight-cursor__halo{background:rgba(255,245,220,.24);border-color:#E8C984}
  .sunlight-cursor.is-photo .sunlight-cursor__rays{stroke:#F0D28B;opacity:1}
  .sunlight-cursor.is-clicked .sunlight-cursor__rays{animation:sunlight-rays-click .4s ease-out}
  .sunlight-cursor.is-clicked .sunlight-cursor__core{transform:translate(-50%,-50%) scale(.7);background:#E4B952}
  .sunlight-cursor.is-clicked .sunlight-cursor__pulse{animation:sunlight-pulse-click .43s ease-out}
}
@keyframes sunlight-pulse-click{
  0%{opacity:.9;transform:translate(-50%,-50%) scale(.6)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(3.05)}
}
@keyframes sunlight-rays-click{
  0%{transform:scale(.68) rotate(-8deg)}
  52%{transform:scale(1.18) rotate(8deg)}
  100%{transform:scale(.8) rotate(0)}
}
@media (hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){
  .sunlight-cursor{display:none!important}
}


/* v8: Golden sunlight story progression — replaces green timeline, no gradients. */
.slide-navigation .story-tab .progress{
  height:3px;
  overflow:visible;
  border-radius:999px;
  background:#e4d9c5;
}
.slide-navigation .story-tab .progress > span{
  position:relative;
  background:#b99649;
  border-radius:999px;
}
.slide-navigation .story-tab.is-current .progress > span{
  box-shadow:0 0 5px rgba(195,151,59,.44);
}
.slide-navigation .story-tab.is-current .progress > span::after{
  content:"";
  position:absolute;
  right:-1px;
  top:-2px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#efd18c;
  box-shadow:0 0 7px 2px rgba(225,178,76,.45);
}
.slide-navigation .story-tab.is-current .story-tab-icon{color:#b99649}
@media (prefers-reduced-motion:reduce){
  .slide-navigation .story-tab.is-current .progress > span::after{display:none}
}


/* v8 tablet transition: keep a short two-column hero without clipping at 691–767px. */
@media(min-width:691px) and (max-width:767px){
 .hero-stage{height:358px}
 .hero-slide{padding:14px 14px 14px 20px;grid-template-columns:53% 47%}
 .hero-content{padding:6px 13px 6px 0}
 .hero-content h1,.hero-content h2{font-size:32px}
 .eyebrow{font-size:9px;letter-spacing:.065em;margin-bottom:7px;white-space:normal}
 .hero-description{font-size:11.5px;line-height:1.45;margin:9px 0 11px}
 .hero-actions{gap:6px}
 .action-primary,.action-secondary{min-height:36px;padding:8px 10px;font-size:10px;gap:6px}
 .photo-label{font-size:9px;left:10px;top:10px;padding:7px 9px;gap:6px}
 .label-icon{width:19px;height:19px;font-size:12px}
 .hero-trust .hero-content h2{font-size:28px}
 .hero-trust .hero-description{font-size:10px;line-height:1.4;margin:6px 0}
 .hero-trust .hero-proof{margin:0 0 7px}
 .hero-trust .proof-point{padding:5px 6px}
 .hero-trust .proof-point strong{font-size:17px}
 .hero-trust .proof-point span{font-size:8px}
 .hero-trust .action-primary,.hero-trust .action-secondary{font-size:9.5px;padding:6px 9px;min-height:32px}
 .hero-trust .proof-footnote{font-size:8px;margin-top:4px}
}


/* v9: Solar Shop image branding — bottom right on every hero photograph. */
.photo-brand{
  position:absolute;z-index:2;bottom:13px;right:13px;left:auto;
  display:flex;flex-direction:column;align-items:flex-end;gap:3px;
  width:max-content;max-width:calc(100% - 24px);
  padding:9px 11px 8px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(230,223,205,.84);
  border-radius:13px;
  box-shadow:0 4px 15px rgba(20,43,30,.12);
  pointer-events:none;
}
.photo-brand img{display:block;width:112px;height:auto;object-fit:contain}
.photo-brand span{font-size:9px;line-height:1.3;font-weight:750;color:#3a573e;text-align:right;white-space:nowrap}
@media(max-width:690px){
  .photo-brand{bottom:10px;right:10px;padding:7px 9px 7px;border-radius:11px;gap:2px}
  .photo-brand img{width:95px}
  .photo-brand span{font-size:8px}
}
@media(max-width:370px){
  .photo-brand{bottom:8px;right:8px;padding:6px 8px}
  .photo-brand img{width:87px}
  .photo-brand span{font-size:7.5px}
}


/* v10 no-background photo branding: direct logo/tagline, no card or backdrop. */
.photo-brand{
  background:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:0!important;
  gap:2px;
  filter:none;
}
.photo-brand img{
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 1px 1px rgba(255,255,255,.90)) drop-shadow(0 1px 3px rgba(255,255,255,.68));
}
.photo-brand span{
  color:#fff;
  font-weight:800;
  letter-spacing:.004em;
  text-shadow:0 1px 2px rgba(16,43,26,.96),0 1px 6px rgba(16,43,26,.75);
}


/* v11: user-selected transparent Solar Shop and Trilect logo — no background. */
.photo-brand img{
  width:200px;
  max-width:100%;
  height:auto;
  object-fit:contain;
}
.photo-brand span{font-size:9.3px}
@media(max-width:690px){
  .photo-brand img{width:168px}
  .photo-brand span{font-size:8px}
}
@media(max-width:370px){
  .photo-brand img{width:148px}
  .photo-brand span{font-size:7.5px}
}


/* v12: readable top-right frosted branding (hero photos only).
   The buyer's original transparent logo is not recoloured. */
.photo-brand{
  top:13px!important;
  right:13px!important;
  bottom:auto!important;
  left:auto!important;
  width:max-content;
  max-width:calc(100% - 24px);
  align-items:flex-end;
  gap:2px;
  padding:8px 10px 7px!important;
  background:rgba(255,255,255,.82)!important;
  border:1px solid rgba(255,255,255,.92)!important;
  border-radius:10px!important;
  box-shadow:0 2px 12px rgba(18,45,28,.10)!important;
  -webkit-backdrop-filter:blur(7px);
  backdrop-filter:blur(7px);
}
.photo-brand img{
  width:150px;
  height:auto;
  background:transparent!important;
  filter:none!important;
}
.photo-brand span{
  color:#23462D;
  font-size:8.5px;
  line-height:1.25;
  font-weight:800;
  letter-spacing:0;
  text-shadow:none!important;
}
/* Compact photo: move the original callout to the lower left so both
   independent labels are readable and never cover one another. */
@media (max-width:1100px){
  .photo-label{
    top:auto!important;
    bottom:11px!important;
    left:11px!important;
    max-width:calc(100% - 22px);
  }
  .photo-brand img{width:133px}
  .photo-brand span{font-size:8px}
}
@media (max-width:690px){
  .photo-brand{
    top:10px!important;
    right:10px!important;
    bottom:auto!important;
    padding:7px 8px 6px!important;
    border-radius:9px!important;
  }
  .photo-brand img{width:116px}
  .photo-brand span{font-size:7.5px}
  .photo-label{bottom:10px!important;left:10px!important}
}
@media (max-width:370px){
  .photo-brand{top:8px!important;right:8px!important;padding:6px 7px!important}
  .photo-brand img{width:108px}
  .photo-brand span{font-size:7px}
  .photo-label{bottom:8px!important;left:8px!important}
}

/* v13: compact Trilect partner and original Solar Shop photo branding. */
.story-powered{
  display:flex;align-items:center;gap:7px;min-width:0;margin:0 0 3px;
  color:#355340;
}
.story-powered span{font-size:8.5px;letter-spacing:.07em;font-weight:800;white-space:nowrap}
.story-powered img{display:block;width:107px;height:auto;object-fit:contain;flex:none;
  filter:drop-shadow(0 0 .35px rgba(15,31,22,.55))}
.story-label{gap:4px}
.story-label-title{color:#385d40;font-size:10.5px}
.story-label-sub{color:#546653;font-size:11.4px}
.photo-brand{
  top:auto!important;bottom:12px!important;right:12px!important;left:auto!important;
  padding:0!important;gap:2px!important;
  background:transparent!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.photo-brand img{
  width:138px;height:auto;object-fit:contain;
  background:transparent!important;
  filter:drop-shadow(0 0 2px rgba(255,255,255,.98)) drop-shadow(0 1px 2px rgba(255,255,255,.85))!important;
}
.photo-brand span{
  font-size:9px;line-height:1.28;font-weight:800;letter-spacing:.008em;
  color:#fff!important;text-align:right;
  text-shadow:0 1px 2px rgba(15,32,21,.95),0 1px 5px rgba(15,32,21,.88)!important;
}
/* Small and medium screens: the partner brand has its own slim row,
   while existing story tabs and controls keep their familiar positions. */
@media(max-width:1020px){
  .slide-navigation{
    display:grid;grid-template-columns:minmax(0,1fr) auto;
    column-gap:13px;row-gap:5px;align-items:center;
  }
  .story-label{display:flex;grid-column:1 / -1;grid-row:1;
    flex-direction:row;align-items:center;min-width:0;
    margin:0;padding:0 0 2px;gap:0}
  .story-label-title,.story-label-sub{display:none}
  .story-powered{margin:0;gap:7px}
  .story-powered span{font-size:8px}
  .story-powered img{width:93px}
  .story-tabs{grid-column:1;grid-row:2;min-width:0}
  .arrow-controls{grid-column:2;grid-row:2}
  .photo-brand img{width:121px}
  .photo-brand span{font-size:8.1px}
}
@media(max-width:690px){
  .slide-navigation{row-gap:3px;column-gap:9px}
  .story-label{padding:0}
  .story-powered img{width:85px}
  .story-powered span{font-size:7.6px}
  .photo-brand{top:auto!important;bottom:10px!important;right:10px!important}
  .photo-brand img{width:108px}
  .photo-brand span{font-size:7.8px}
  /* Move short photo callouts back to the top left; the bottom now
     belongs to the logo and the two corners never compete. */
  .photo-label{top:10px!important;bottom:auto!important;left:10px!important}
}
@media(max-width:370px){
  .story-powered img{width:78px}
  .photo-brand{top:auto!important;bottom:8px!important;right:8px!important}
  .photo-brand img{width:97px}
  .photo-brand span{font-size:7.2px}
  .photo-label{top:8px!important;bottom:auto!important;left:8px!important}
}


/* Tablet QA: top-left callout and bottom-right brand never collide. */
@media(min-width:691px) and (max-width:1100px){
  .photo-label{top:10px!important;bottom:auto!important;left:10px!important}
}


/* v14: keep the longer expert-installation navigation label readable on phones. */
@media(max-width:690px){
 .story-tab[data-go="2"] .story-tab-name{
   white-space:normal;
   overflow:visible;
   text-overflow:clip;
   overflow-wrap:normal;
   max-width:100%;
   line-height:1.2;
   text-wrap:balance;
 }
}
