/* Homepage lower sections only. Header through feature strip retain existing styles. */
.homepage .home-work{grid-template-columns:1.03fr 1fr;grid-template-rows:minmax(0,1fr) 12px;gap:5px 24px;padding:10px 31px 6px;min-height:0}
.homepage .home-services,.homepage .transformation{display:grid;grid-template-rows:30px minmax(0,1fr);min-height:0;position:relative}
.homepage .home-work .section-title{margin:0;text-align:center;align-self:start}
.homepage .home-work .service-grid{height:100%;min-height:0;grid-template-rows:repeat(2,minmax(0,1fr));gap:9px}
.homepage .home-work .service-card{grid-template-rows:minmax(0,1fr) 32px;min-height:0}
.homepage .home-work .service-card img{height:100%;width:100%;min-height:0;object-fit:cover}
.homepage .home-work .service-card h3,.homepage .before-after-pair .tag{height:32px;min-height:32px;line-height:1.05;font-size:13px;font-weight:900;font-style:italic;color:#fff;border-radius:9px;background:linear-gradient(#0093fc,#003ba1 40%,#001b53);box-shadow:0 1px 3px #142943,0 0 5px #007aff60;padding:5px 6px;margin:0;display:flex;align-items:center;justify-content:center;text-align:center}
.homepage .before-after-pair{height:100%;min-height:0;grid-row:2;align-self:stretch}
.homepage .before-after-pair img{height:100%;width:100%;object-fit:cover}
.homepage .before-after-pair .tag{bottom:0;left:0;width:100%}
.homepage .before-after-pair>div:last-of-type .tag{right:0;left:0}
.homepage .comparison-details{position:absolute;right:0;bottom:-15px;font-size:9px;margin:0;line-height:12px}
.homepage .home-work .asset-note{text-align:left;font-size:9px;line-height:12px;margin:0}
.homepage .comparison-details[open]{top:30px;bottom:auto;left:10px;padding:9px}
.homepage .contact-banner{isolation:isolate;position:relative;display:grid;grid-template-columns:minmax(390px,1fr) minmax(0,1.1fr) minmax(290px,.85fr);align-items:center;gap:18px;min-height:126px;padding:12px 25px 20px 20px;background:linear-gradient(110deg,#005b89,#002139 24%,#000c17 50%,#001528);border-top:1px solid #55dfff;border-bottom:1px solid #44caff;border-radius:0 0 18px 18px;box-shadow:inset 0 -2px 10px #009bff70}
.homepage .contact-banner:before{content:'';position:absolute;left:0;top:0;bottom:0;width:180px;z-index:-1;background:url('roller.png') left top/210px auto no-repeat;mask-image:linear-gradient(90deg,#000 55%,transparent 100%);pointer-events:none}
.homepage .contact-banner:after{content:'';position:absolute;left:0;top:0;bottom:0;width:220px;z-index:-2;background:repeating-linear-gradient(135deg,#81eaff38 0 1px,transparent 1px 7px),linear-gradient(125deg,#49d5ff,#0089d4 65%,#00253b);clip-path:polygon(0 0,100% 0,38% 100%,0 100%)}
.homepage .banner-message{padding-left:140px;min-width:0}
.homepage .contact-banner h2{font-size:26px;line-height:.98;letter-spacing:-.7px;margin:0 0 7px;color:#f4f7fb;font-style:italic;text-shadow:1px 2px #747d87,2px 3px #000}
.homepage .contact-banner p{font-size:13px;line-height:1.4;white-space:normal;margin:0}
.homepage .contact-banner .banner-message p a{padding:2px 5px;white-space:normal;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.homepage .banner-areas{min-width:0;text-align:center;padding:9px 0;border-left:1px solid #2398d144;border-right:1px solid #2398d144}
.homepage .contact-banner .banner-areas p{font-size:12px;line-height:1.4;white-space:nowrap;color:#dcecf8}
.homepage .banner-areas strong{color:#87d8ff;font-size:12px}
.homepage .banner-areas b{color:#008fff;padding:0 3px}
.homepage .contact-banner .banner-contact{display:flex;flex-direction:column;gap:8px;padding:0;border:0;min-width:0}
.homepage .contact-banner .phone{font-size:27px;padding:9px 12px;border-radius:16px;white-space:nowrap;box-shadow:0 0 9px #008fff,inset 0 0 8px #20d6ff}
.homepage .contact-banner .email{font-size:12px;white-space:nowrap;text-align:center;line-height:1.2}
.homepage .banner-credit{position:absolute;right:25px;bottom:4px;font-size:9px;line-height:11px;color:#aac4d7;text-decoration:underline}
@media(min-width:1200px) and (min-height:820px){
.homepage .site-shell{height:auto;display:grid;grid-template-rows:112px auto auto}
.homepage main{grid-template-rows:max(335px,calc((100dvh - 425px)*.5744680851)) 65px 208px;min-height:0}
}
@media(max-width:1399px){
.homepage .contact-banner{grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:8px 20px;padding-bottom:24px}
.homepage .banner-message{grid-column:1;grid-row:1;padding-left:145px}
.homepage .banner-areas{grid-column:1;grid-row:2;border:0;padding:0 0 0 145px;text-align:left}
.homepage .banner-contact{grid-column:2;grid-row:1/3}
.homepage .contact-banner .banner-areas p{white-space:normal}
}
@media(min-width:901px) and (max-width:1199px), (min-width:901px) and (max-height:819px){.homepage .home-work{height:220px}}
@media(max-width:900px){
.homepage .home-work{display:block;height:auto;padding:18px 20px}
.homepage .home-services,.homepage .transformation{grid-template-rows:34px minmax(0,1fr)}
.homepage .home-work .service-grid{height:240px}
.homepage .before-after-pair{height:240px}
.homepage .comparison-details{position:static;margin:8px 0}
.homepage .comparison-details[open]{position:relative;top:auto;left:auto}
.homepage .contact-banner{grid-template-columns:1fr;padding:18px 20px 27px 120px;gap:12px}
.homepage .banner-message,.homepage .banner-areas,.homepage .banner-contact{grid-column:1;grid-row:auto;padding-left:0}
.homepage .banner-areas{text-align:left}
.homepage .contact-banner .banner-contact{align-items:flex-start}
.homepage .contact-banner:before{width:130px;background-size:190px auto}
.homepage .contact-banner:after{width:160px}
.homepage .contact-banner .email{white-space:normal;overflow-wrap:anywhere;text-align:left}
}
@media(max-width:520px){
.homepage .home-work .service-grid{height:375px}
.homepage .contact-banner{padding-left:85px;padding-right:12px}
.homepage .contact-banner:before{width:95px;background-size:165px auto}
.homepage .contact-banner:after{width:115px}
.homepage .contact-banner h2{font-size:24px}
.homepage .contact-banner .phone{font-size:22px}
.homepage .contact-banner .email{font-size:11px}
}
/* Additional homepage header adjustment: 15% smaller logo, 18px border inset. */
.homepage header{height:100px;min-height:100px;padding:18px 18px 0;align-items:flex-start}
.homepage .brand{width:263.5px}
.homepage nav{margin-top:15px}
@media(min-width:1200px) and (min-height:820px){.homepage .site-shell{grid-template-rows:100px auto auto}}
@media(min-width:901px) and (max-width:1199px), (min-width:901px) and (max-height:819px){.homepage .brand{width:238px}}
@media(max-width:900px){.homepage header{height:auto;min-height:0;align-items:center;padding-bottom:0}.homepage .brand{width:238px}.homepage nav{margin-top:0}.homepage .hero{padding-top:10px}}
@media(max-width:520px){.homepage .brand{width:208.25px}}
/* Anchor the copy below the logo rather than vertically centering an oversized block. */
.homepage .hero{align-items:flex-start}
@media(min-width:1200px) and (min-height:820px){.homepage main{grid-template-rows:minmax(max-content,max(335px,calc((100dvh - 425px)*.5744680851))) 65px 208px}}
/* Fit the two longer service labels without altering any button geometry. */
.homepage .home-services .service-card:nth-child(4) h3,
.homepage .home-services .service-card:nth-child(6) h3{font-size:10px}
/* Final review proportions: image visibility takes priority over viewport fitting. */
.homepage main{grid-template-rows:auto auto auto}
.homepage .site-shell{height:auto}
.homepage .features{min-height:0;height:42px;padding:5px 25px;gap:0}
.homepage .features>div{gap:10px}
.homepage .features img{width:30px;height:30px}
.homepage .features strong{font-size:11px;line-height:1.1}
.homepage .home-work{height:auto;min-height:0;padding:16px 31px 10px;grid-template-rows:minmax(0,1fr) 12px;gap:7px 24px}
.homepage .home-services,.homepage .transformation{grid-template-rows:36px minmax(0,1fr)}
.homepage .home-work .service-grid{height:282px;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px}
.homepage .home-work .service-card{grid-template-rows:minmax(0,1fr) 32px}
.homepage .home-work .service-card img{height:100%;width:100%;object-fit:cover;min-height:0}
.homepage .before-after-pair{height:282px;min-height:0}
.homepage .home-work .service-card h3{height:32px;min-height:32px;font-size:13px}
.homepage .home-work .service-card:nth-child(4) h3,
.homepage .home-work .service-card:nth-child(6) h3{font-size:10px}
@media(max-width:900px){
.homepage .features{grid-template-columns:repeat(4,minmax(0,1fr));height:auto;padding:6px 10px;gap:0}
.homepage .features>div{gap:6px;border-right:1px solid #4e72b5}
.homepage .features>div:last-child{border:0}
.homepage .features img{width:25px;height:25px}
.homepage .features strong{font-size:10px}
.homepage .home-work{padding:18px 20px}
.homepage .home-work .service-grid{height:282px}
.homepage .before-after-pair{height:282px}
}
@media(max-width:520px){
.homepage .features>div{flex-direction:column;gap:3px;text-align:center}
.homepage .features strong{font-size:9px}
.homepage .home-work .service-grid{height:250px;gap:7px}
.homepage .home-work .service-card h3{font-size:11px}
.homepage .home-work .service-card:nth-child(4) h3,
.homepage .home-work .service-card:nth-child(6) h3{font-size:9px}
.homepage .before-after-pair{height:250px}
}
/* New supplied concept artwork; retain original pixels and proportions. */
.homepage .kitchen-photo{object-fit:contain;object-position:right center}
.homepage .laptop{object-fit:contain;mix-blend-mode:normal}
.homepage .contact-banner:before{background-image:url('images/contact_blue_roller.webp');background-position:right center;background-size:auto 100%;mask-image:linear-gradient(90deg,#000 0%,#000 76%,transparent 100%)}
.homepage .before-after-pair img{object-fit:contain;background:#001524}
@media(max-width:900px){.homepage .kitchen-photo{object-fit:contain;object-position:right top}}
/* Homepage-only transformation framing and chrome lettering. */
.homepage .before-after-pair img{object-fit:cover;object-position:50% 50%;background:none}
.homepage .hero h1,.homepage .contact-banner h2,.interior-page .page-intro h1{
 background-image:linear-gradient(180deg,#ffffff 0%,#f4f7fa 15%,#aeb9c7 38%,#f9fcff 47%,#6e7c8e 51%,#c0cad5 65%,#ffffff 82%,#8b98a8 100%);
 background-size:100% 1em;background-repeat:repeat-y;background-clip:text;-webkit-background-clip:text;
 color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;-webkit-text-stroke:.35px #d5dce4;
 filter:drop-shadow(1px 2px 0 #26313e) drop-shadow(0 2px 2px #000);
}
.homepage .hero h1 span{-webkit-text-fill-color:#fff;-webkit-text-stroke:0}
/* Final supplied cabinet pair and compact, legible bottom phone CTA. */
.homepage .before-after-pair img{object-fit:cover;object-position:50% 50%}
.homepage .contact-banner .phone{width:78%;min-width:max-content;max-width:100%;align-self:center;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:33.75px;line-height:1.1;padding:10px 12px;white-space:nowrap}
.homepage .contact-banner .banner-contact{align-items:center}
.homepage .contact-banner .banner-contact .email{text-align:center;align-self:center}
@media(max-width:1199px){.homepage .contact-banner .phone{font-size:31.25px}}
@media(max-width:520px){.homepage .contact-banner .phone{font-size:27.5px;padding:10px 9px;gap:6px}}
.homepage .contact-banner .phone{font-family:'Arial Narrow',Arial,sans-serif}
/* Final homepage-only logo alignment and optical button centering. */
@media(min-width:901px){.homepage header .brand{left:24px}}
.homepage .nav-cta,.homepage .contact-banner .phone{display:inline-flex;align-items:center;justify-content:center;text-align:center;position:relative}
.homepage .nav-cta .button-content,.homepage .contact-banner .phone .button-content{display:inline-flex;align-items:center;justify-content:center;gap:.23em;line-height:inherit;margin:0;padding:0;white-space:nowrap;transform:none}
.homepage .nav-cta:before,.homepage .nav-cta:after,.homepage .contact-banner .phone:before,.homepage .contact-banner .phone:after{content:none}
/* Consistent content centering; optical offsets never change button geometry. */
.homepage .nav-cta,.homepage .hero-copy>.button,.homepage .contact-banner .phone,
.homepage .home-work .service-card h3,.homepage .before-after-pair .tag{
 display:inline-flex;align-items:center;justify-content:center;text-align:center;
}
.homepage .nav-cta .button-content,.homepage .hero-copy>.button .button-content,
.homepage .contact-banner .phone .button-content,.homepage .label-content{
 margin:0;padding:0;line-height:inherit;position:relative;
}
.homepage .hero-copy>.button .button-content{display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap;transform:translateY(-2px)}
.homepage .nav-cta .button-content{transform:none}
/* Preserve the phone's approved visible alignment exactly. */
.homepage .contact-banner .phone .button-content{transform:translate(-.035em,-4px)}
.homepage .label-content{display:block;max-width:100%;text-align:center;transform:none}
/* Remove the disclaimer row; keep space solely for the existing comparison control. */
.homepage .home-work{grid-template-rows:auto;row-gap:0}
.homepage .transformation{grid-template-rows:36px minmax(0,1fr) 12px}
.homepage .comparison-details:not([open]){position:static;grid-row:3;justify-self:end;margin:0;line-height:12px;text-align:right}
