/* LOCKED MASTER VISUAL OVERRIDES
   Controlling visual reference: IMG_4829.jpeg
   Do not redesign these sections. */
:root{--shell:1180px;--cream:#fbf7ef;--warm:#fffdfa;--navy:#0a3263;--navy-2:#082850;--blue:#1a65a8;--line:#e5dfd5;--pale:#e8f3fc}
body{background:#fffdfa}
.shell{width:min(var(--shell),calc(100% - 52px))}

/* Header */
.master-header{height:84px;background:rgba(255,253,249,.97);border-bottom:0;backdrop-filter:none}
.master-header .header-inner{height:84px;grid-template-columns:235px 1fr auto;gap:18px}
.locked-brand{width:228px;height:108px;overflow:visible;align-self:start;margin-top:4px;z-index:5}
.locked-brand img{width:100%;height:100%;object-fit:contain;object-position:left top}
.master-header .primary-nav{gap:27px;font-size:12px;color:#102f51}
.master-header .primary-nav a{padding:11px 0;font-weight:600}
.master-header .primary-nav a.active:after,.master-header .primary-nav a:hover:after{right:0}
.master-header .header-cta{min-height:46px;padding-inline:20px;border-radius:7px;font-size:12px}

/* Locked hero */
.locked-hero{min-height:498px;background:var(--cream);overflow:hidden}
.locked-hero .hero-photo{inset:0 0 0 31%;background:#d8e0e2}
.locked-hero .hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.locked-hero .hero-photo:after{background:linear-gradient(90deg,rgba(251,247,239,.36),rgba(251,247,239,0) 28%),linear-gradient(0deg,rgba(7,40,80,.04),rgba(7,40,80,0) 55%)}
.locked-hero .hero-blend{background:linear-gradient(90deg,var(--cream) 0%,var(--cream) 31%,rgba(251,247,239,.98) 36%,rgba(251,247,239,.82) 42%,rgba(251,247,239,.38) 48%,rgba(251,247,239,0) 57%)}
.locked-hero .hero-inner{min-height:498px;align-items:center}
.locked-hero .hero-copy{width:42%;padding:48px 0 36px}
.locked-hero .eyebrow{font-size:10px;letter-spacing:.15em;margin-bottom:8px;color:#12518e}
.locked-hero .display-title{font-size:clamp(58px,6.15vw,76px);line-height:.90;letter-spacing:-.035em;margin:0 0 13px;color:#0b3264}
.locked-hero .hero-intro{font-size:12.5px;line-height:1.45;color:#233f58;max-width:380px;margin-bottom:14px}
.locked-hero .hero-intro strong{font-weight:700;color:#163a61}
.locked-hero .hero-points{gap:7px;font-size:12px;margin-top:10px}
.locked-hero .hero-points li span{width:18px;height:18px;font-size:9px}
.locked-hero .hero-actions{margin-top:17px;gap:10px}
.locked-hero .button{min-height:42px;font-size:11px;padding:0 18px}
.locked-hero .micro-proof{font-size:10px;margin-top:10px;color:#324f68}

/* Locked five-hub band */
.locked-services{padding:0 0 18px;background:#fffdfa}
.locked-services .services-layout{grid-template-columns:190px minmax(0,1fr);gap:22px;align-items:start}
.locked-services .mascot-column{align-items:flex-start;padding-top:2px}
.locked-mascot{position:relative;width:185px;height:418px;overflow:visible;background:transparent;display:flex;align-items:flex-start;justify-content:center}
.locked-mascot img{width:164px;height:auto;max-width:164px;object-fit:contain;transform:none;margin-top:0}
.locked-mascot:after{content:"Same\A Surfaces.\A A Brighter\A Tomorrow.";white-space:pre;position:absolute;right:-10px;top:236px;font-family:"Comic Sans MS","Bradley Hand",cursive;font-size:16px;line-height:1.05;color:#1462a6;transform:rotate(-7deg);font-weight:700}
.locked-services .services-content{padding-top:14px}
.locked-services .eyebrow{font-size:10px;margin-bottom:5px}
.locked-services .section-title{font-size:51px;line-height:.95;margin:0 0 7px}
.locked-services .section-lead{font-size:12px;line-height:1.45;margin-bottom:18px;color:#314c66}
.locked-services .service-cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.locked-services .service-card{min-height:244px;border-radius:7px;box-shadow:0 2px 7px rgba(17,52,86,.035);border-color:#e8e2d9}
.locked-services .service-card>img{aspect-ratio:1.66/1;object-fit:cover}
.locked-services .service-card-body{padding:10px 10px 11px}
.locked-services .service-card h3{font-size:15px;line-height:1.02;margin-bottom:6px}
.locked-services .service-card p{font-size:9.4px;line-height:1.35;color:#2f4861}
.locked-services .service-card span{font-size:9px;padding-top:8px}

/* Real results */
.locked-results{padding:0 0 8px;background:#fffdfa}
.locked-results .results-panel{grid-template-columns:190px 1fr;gap:22px;align-items:center;border:0;border-radius:8px;background:#fbf8f2;padding:13px 14px}
.locked-results .results-intro h2{font-size:31px;margin-bottom:5px}
.locked-results .results-intro p{font-size:10px;line-height:1.35;margin-bottom:8px;color:#314b64}
.locked-results .button.small{min-height:34px;font-size:9px;padding-inline:12px}
.locked-results .result-grid{gap:10px}
.locked-results .result-card{border:0;border-radius:6px;background:transparent;overflow:visible}
.locked-results .before-after{border-radius:6px;overflow:hidden;background:#ddd}
.locked-results .before-after img{aspect-ratio:1.8/1}
.locked-results .before-after span{left:6px;top:6px;font-size:7px;padding:3px 6px}
.locked-results .result-card figcaption{padding:5px 4px 0;font-size:9px;color:#244565}

/* Local trust + customer review area */
.locked-trust{padding:0 0 10px;background:#fffdfa}
.locked-trust .trust-panel{grid-template-columns:31% 69%;border-radius:8px;background:#fbf8f2;border-color:#ebe4da}
.locked-trust .trust-local{padding:16px 18px;border-color:#e6dfd5}
.locked-trust .trust-local .eyebrow{font-size:8px;margin-bottom:5px}
.locked-trust .trust-local h2{font-size:29px;line-height:.95;margin-bottom:6px}
.locked-trust .trust-local>p:not(.eyebrow){font-size:9.5px;line-height:1.35;color:#314a61}
.locked-trust .trust-icons{margin-top:14px;gap:4px}
.locked-trust .trust-icons b{font-size:17px}
.locked-trust .trust-icons span{font-size:7.5px;color:#2e4960}
.locked-trust .reviews-area{padding:14px 16px}
.locked-trust .reviews-head{margin-bottom:8px}
.locked-trust .reviews-head h2{font-size:0;margin:0}
.locked-trust .reviews-head h2:after{content:""}
.locked-trust .reviews-head .eyebrow{font-size:8px;margin-bottom:0}
.locked-trust .review-grid-two{grid-template-columns:1fr 1fr;gap:10px}
.locked-trust .review-card{min-height:124px;padding:10px 11px;border-radius:7px;background:#fff;border-color:#e7e1d8;display:grid;grid-template-columns:58px 1fr;gap:9px;align-items:center}
.locked-trust .review-character{width:58px;height:82px;display:grid;place-items:end center;overflow:hidden;align-self:end}
.locked-trust .review-character img{max-width:58px;max-height:80px;object-fit:contain}
.locked-trust .review-source-content{min-width:0}
.locked-trust .quote-mark{font-size:24px;color:#0d4c87}
.locked-trust .review-card p{font-size:9.2px;line-height:1.34;margin:4px 0 8px;color:#263f57}
.locked-trust .review-source-label{display:flex;align-items:center;gap:7px}
.locked-trust .source-badge{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800}
.locked-trust .google-badge{background:linear-gradient(135deg,#4285f4 0 25%,#34a853 25% 50%,#fbbc05 50% 75%,#ea4335 75%)}
.locked-trust .thumbtack-badge{background:#14a8e8}
.locked-trust .review-source-label strong{display:block;font-size:9px;color:#173b60}
.locked-trust .review-source-label small{display:block;font-size:7.5px;color:#66788a}

/* Keep the long approved SEO sections, but let the locked visual system lead. */
.technical-band{margin-top:14px}

/* Locked CTA/footer treatment */
.final-cta{background:linear-gradient(90deg,#e9f4fd,#dfeefa);border-color:#cfe0ee}
.final-cta-inner{min-height:96px;grid-template-columns:86px 1fr auto;gap:18px}
.final-mascot{height:96px;overflow:visible;align-self:end}
.final-mascot img{height:118px;width:auto;object-fit:contain;transform:none;margin-top:-14px}
.final-cta .eyebrow{display:none}
.final-cta h2{font-size:29px;margin-bottom:3px}
.final-cta p:not(.eyebrow){font-size:9.5px}
.final-actions .button{min-height:38px;font-size:9px;padding-inline:13px}
.site-footer{padding:10px 0 12px}
.footer-grid{grid-template-columns:175px 1fr auto;gap:18px}
.footer-brand{width:170px;height:70px;overflow:visible}
.footer-brand img{object-fit:contain}
.footer-grid nav{gap:18px;font-size:8px}
.footer-grid p{font-size:8px}

/* Desktop calibration to the 1024px locked master. */
@media (max-width:1120px) and (min-width:901px){
  .shell{width:calc(100% - 48px)}
  .master-header .header-inner{grid-template-columns:220px 1fr auto;gap:12px}
  .master-header .primary-nav{gap:20px;font-size:10.5px}
  .locked-brand{width:210px;height:102px}
  .locked-hero .hero-copy{width:43%}
  .locked-hero .display-title{font-size:61px}
  .locked-services .services-layout{grid-template-columns:185px 1fr;gap:16px}
  .locked-services .section-title{font-size:47px}
  .locked-services .service-card h3{font-size:13.5px}
  .locked-services .service-card p{font-size:8.8px}
  .locked-mascot:after{right:-4px;font-size:14px}
}

/* Mobile: preserve visual hierarchy without squeezing the page. */
@media (max-width:900px){
  .master-header{height:74px}
  .master-header .header-inner{height:74px;grid-template-columns:150px 1fr auto}
  .locked-brand{width:145px;height:78px;margin-top:0}
  .master-header .header-cta{display:none}
  .master-header .nav-toggle{display:block;grid-column:3}
  .master-header .primary-nav{top:74px}
  .locked-hero{min-height:0;display:flex;flex-direction:column;background:var(--cream)}
  .locked-hero .hero-photo{position:relative;inset:auto;order:2;height:300px;margin:0}
  .locked-hero .hero-photo img{object-position:center 42%}
  .locked-hero .hero-photo:after{background:linear-gradient(180deg,var(--cream),rgba(251,247,239,.24) 22%,rgba(251,247,239,0) 44%)}
  .locked-hero .hero-blend{display:none}
  .locked-hero .hero-inner{min-height:auto;order:1;display:block}
  .locked-hero .hero-copy{width:100%;padding:28px 0 22px}
  .locked-hero .display-title{font-size:clamp(50px,14vw,68px);line-height:.89}
  .locked-hero .hero-intro{font-size:12.5px;max-width:none}
  .locked-hero .hero-actions{flex-direction:row;align-items:center}
  .locked-hero .hero-actions .button{width:auto;flex:1}
  .locked-services{padding-top:24px}
  .locked-services .services-layout{display:grid;grid-template-columns:105px 1fr;gap:10px}
  .locked-services .mascot-column{display:block}
  .locked-mascot{width:104px;height:310px}
  .locked-mascot img{width:98px;max-width:98px}
  .locked-mascot:after{display:none}
  .locked-services .services-content{padding-top:4px}
  .locked-services .section-title{font-size:39px}
  .locked-services .section-lead{font-size:10.5px;margin-bottom:12px}
  .locked-services .service-cards{grid-template-columns:1fr;gap:7px}
  .locked-services .service-card{min-height:0;display:grid;grid-template-columns:94px 1fr}
  .locked-services .service-card>img{height:100%;min-height:88px;aspect-ratio:auto}
  .locked-services .service-card-body{padding:9px}
  .locked-services .service-card h3{font-size:14px}
  .locked-services .service-card p{font-size:9px}
  .locked-results .results-panel{grid-template-columns:1fr;padding:14px}
  .locked-results .result-grid{grid-template-columns:1fr;gap:9px}
  .locked-trust .trust-panel{grid-template-columns:1fr}
  .locked-trust .trust-local{border-right:0;border-bottom:1px solid #e6dfd5}
  .locked-trust .review-grid-two{grid-template-columns:1fr}
  .locked-trust .review-card{grid-template-columns:62px 1fr}
  .final-cta-inner{grid-template-columns:72px 1fr;padding:12px 0}
  .final-actions{grid-column:2;flex-wrap:wrap}
  .footer-grid{grid-template-columns:130px 1fr}
  .footer-brand{width:125px;height:60px}
  .footer-grid p{grid-column:1/3}
}

@media (max-width:520px){
  .shell{width:calc(100% - 28px)}
  .locked-hero .hero-actions{flex-direction:column}
  .locked-hero .hero-actions .button{width:100%}
  .locked-services .services-layout{grid-template-columns:88px 1fr;gap:8px}
  .locked-mascot{width:86px;height:275px}
  .locked-mascot img{width:82px;max-width:82px}
  .locked-services .section-title{font-size:35px}
  .locked-services .service-card{grid-template-columns:80px 1fr}
  .locked-services .service-card>img{min-height:82px}
}
/* Fidelity corrections after visual QA */
.locked-brand{width:220px;height:140px;margin-top:-5px}
.locked-mascot{height:404px;width:176px}
.locked-mascot img{width:128px;max-width:128px}
.locked-mascot:after{right:-18px;top:220px;font-size:14px}
@media (max-width:1120px) and (min-width:901px){
  .locked-brand{width:212px;height:134px;margin-top:-5px}
  .locked-mascot{height:395px;width:176px}
  .locked-mascot img{width:125px;max-width:125px}
  .locked-mascot:after{right:-16px;top:218px;font-size:13px}
}
@media (max-width:900px){
  .locked-brand{width:145px;height:92px;margin-top:-7px}
  .locked-hero .hero-photo picture,.locked-hero .hero-photo img{width:100%;height:100%;display:block}
  .locked-hero .hero-photo img{object-fit:cover;object-position:center 42%}
  .locked-mascot{width:92px;height:275px}
  .locked-mascot img{width:80px;max-width:80px}
}

/* Image-fit correction only: preserve the approved design while keeping the
   complete logo and brand character inside every viewport. */
.locked-brand,
.locked-mascot,
.final-mascot{
  flex-shrink:0;
}
.locked-brand{
  margin-top:0;
  padding-top:3px;
}
.locked-brand img,
.locked-mascot img,
.final-mascot img{
  object-fit:contain;
}
.locked-services .services-layout,
.locked-services .services-content,
.final-cta-inner,
.final-cta-inner > *,
.footer-grid,
.footer-grid > *{
  min-width:0;
}

@media (max-width:900px){
  .locked-brand{height:74px;margin-top:0;padding:3px 0}
  .locked-brand img{height:68px}
  .locked-services .services-layout{grid-template-columns:minmax(0,105px) minmax(0,1fr)}
  .locked-mascot{overflow:visible}
  .locked-mascot img{max-height:100%;object-position:center top}
  .final-cta{overflow:visible}
  .final-cta-inner{grid-template-columns:minmax(0,72px) minmax(0,1fr)}
  .final-mascot{overflow:visible}
  .final-mascot img{max-width:100%;object-position:center bottom}
  .final-actions{width:100%;min-width:0}
  .final-actions .button{min-width:0;max-width:100%;white-space:normal;text-align:center}
}

@media (max-width:520px){
  .locked-services .services-layout{grid-template-columns:minmax(0,88px) minmax(0,1fr)}
  .locked-mascot{width:88px}
  .locked-mascot img{width:78px;max-width:78px}
  .locked-services .section-title{font-size:clamp(30px,10vw,35px)}
  .final-cta-inner{grid-template-columns:minmax(0,64px) minmax(0,1fr)}
  .final-actions{grid-column:1/-1;grid-template-columns:1fr}
  .footer-grid nav{min-width:0;flex-wrap:wrap}
}

/* Approved review treatment: real attributed reviews in the locked layout. */
.locked-trust .reviews-head .eyebrow{display:flex;align-items:center;gap:7px}
.locked-trust .review-stars{color:#f2b331;font-size:14px;letter-spacing:1px;line-height:1}
.locked-trust .review-source-card{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:148px;padding:14px 15px 10px;overflow:hidden}
.locked-trust .review-source-card>.quote-mark{position:absolute;left:13px;top:13px;font-size:31px;line-height:.75}
.locked-trust .review-source-card>p{margin:7px 2px 8px 31px;font-size:10.5px;line-height:1.35;color:#183956}
.locked-trust .review-attribution{display:flex;align-items:flex-end;gap:10px;margin-top:auto;margin-left:22px;min-width:0}
.locked-trust .review-attribution .review-character{width:50px;height:52px;overflow:visible;display:flex;align-items:flex-end;justify-content:center}
.locked-trust .review-attribution .review-character img{width:auto;height:auto;max-width:50px;max-height:50px;object-fit:contain;object-position:center bottom}
.locked-trust .review-attribution .review-source-label{min-width:0;padding-bottom:4px}
.locked-trust .review-attribution .review-source-label strong{font-size:9.5px}
.locked-trust .review-attribution .review-source-label small{font-size:7.5px;white-space:normal}

/* Keep the approved JCA character proportions consistent with the reference. */
.locked-mascot img{object-position:center top}
.final-mascot img{object-position:center bottom}

@media (max-width:900px){
  .locked-trust .review-grid-two{grid-template-columns:1fr}
  .locked-trust .review-source-card{min-height:142px}
  .locked-trust .review-source-card>p{font-size:10px}
}
