/* =========================================================
   FINAL PRODUCTION QA — ALL-SCREEN RESPONSIVE NORMALIZATION
   Approved Design C V1.5 visual language is preserved.
   This file only normalizes spacing, alignment, sizing,
   overflow, responsive grids, forms, header/footer and touch UX.
   ========================================================= */

:root{
  --qa-gutter:clamp(16px,3vw,28px);
  --qa-section:clamp(44px,5.2vw,72px);
  --qa-section-tight:clamp(34px,4.1vw,58px);
}

html{overflow-x:hidden;scroll-padding-top:76px}
body{overflow-x:clip;min-width:320px}
main{display:block;overflow:clip}
.container{width:min(1240px,calc(100% - (var(--qa-gutter) * 2)));margin-inline:auto}
.section{padding-block:var(--qa-section)}
section{position:relative}
img,svg,video,iframe{max-width:100%}
figure{max-width:100%}

/* Typography: predictable wrapping on every viewport */
h1,h2,h3{overflow-wrap:anywhere;text-wrap:balance}
p,li,a,span,strong,small,label{overflow-wrap:break-word}
h1{font-size:clamp(2.85rem,5.2vw,5.4rem)}
h2{font-size:clamp(2.2rem,3.9vw,4rem)}
.lead{font-size:clamp(1rem,1.45vw,1.12rem)}

/* Buttons and links */
.btn{max-width:100%;min-width:0;text-align:center;white-space:normal;padding-inline:clamp(15px,2vw,22px)}
.btn,.text-cta,.cta-phone,.header-phone,.footer-call,.mobile-call{touch-action:manipulation}
.btn:focus-visible,.text-cta:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(67,143,199,.28);outline-offset:3px}

/* Header — compact and safe at laptop/tablet widths */
.site-header,.header-inner{height:64px}
.header-inner{gap:clamp(14px,2vw,24px)}
.brand{width:78px;height:52px;overflow:visible;flex:0 0 78px}
.brand img{width:100%;height:100%;object-fit:contain;object-position:center}
.desktop-nav{gap:clamp(14px,1.65vw,24px)}
.desktop-nav a{font-size:.73rem;white-space:nowrap}
.header-actions{min-width:0}
.btn-header{white-space:nowrap}

/* Homepage hero — content-height, balanced, no blank bands */
.hero-c-v15{padding:calc(64px + clamp(24px,3vw,36px)) 0 clamp(20px,2.6vw,30px)}
.hero-v15-layout{grid-template-columns:minmax(0,.94fr) minmax(390px,1.06fr);gap:clamp(30px,4vw,56px);align-items:center}
.hero-v15-copy,.hero-v15-visual{min-width:0}
.hero-v15-copy h1{font-size:clamp(3rem,4.45vw,4.75rem);max-width:650px}
.hero-v15-copy>p{font-size:clamp(.94rem,1.1vw,1rem)}
.hero-v15-visual{height:clamp(300px,28vw,350px)}
.hero-v15-photo{inset:5px clamp(22px,2.5vw,34px) 12px clamp(18px,2vw,24px)}
.hero-v15-trust{margin-top:clamp(12px,1.8vw,20px)!important}
.trust-ribbon>div{min-width:0}
.trust-ribbon span{overflow-wrap:normal}

/* Homepage section rhythm */
.intro-c,.services-c,.projects-c,.craft-c,.applications-c,.proof-c,.faq-contact-c{padding-block:var(--qa-section)}
.build-remodel-c{padding-bottom:var(--qa-section)}
.areas-c{padding-block:var(--qa-section-tight)}
.intro-grid-c{grid-template-columns:72px minmax(0,1.04fr) minmax(340px,.96fr);gap:clamp(28px,3.5vw,46px)}
.intro-copy,.intro-stack{min-width:0}
.intro-stack{height:clamp(350px,34vw,410px)}
.stack-main{height:82%}.stack-small{height:45%}
.services-head-c{grid-template-columns:minmax(0,1.15fr) minmax(280px,.7fr);gap:clamp(26px,3vw,46px);margin-bottom:28px}
.service-row-c{grid-template-columns:54px 44px minmax(0,1fr) minmax(150px,190px) 40px;margin-inline:0!important;min-height:98px}
.service-row-c figure{height:80px}
.project-showcase-c{grid-template-columns:minmax(0,1.55fr) minmax(240px,.7fr);height:clamp(330px,31vw,390px);min-height:0}
.project-feature-c{height:100%}
.project-side-c{min-height:0;grid-template-rows:1fr 1fr}
.project-side-c figure{height:auto;min-height:0}
.build-grid-c,.proof-layout-c,.area-inner-c,.faq-contact-grid-c{min-width:0}
.build-card{min-height:clamp(260px,26vw,320px)}
.craft-grid-c article{min-width:0}
.application-shell-c{grid-template-columns:minmax(250px,.48fr) minmax(0,1.52fr);gap:clamp(24px,3vw,36px)}
.application-grid-c{height:auto;grid-template-rows:clamp(150px,14vw,180px) clamp(150px,14vw,180px)}
.application-grid-c figure{min-width:0;min-height:0}
.why-c,.process-c{height:100%}
.faq-contact-grid-c{grid-template-columns:minmax(290px,.72fr) minmax(0,1.28fr);gap:18px;align-items:stretch}
.faq-side-c,.estimate-card-c{min-width:0}

/* Shared inner-page hero and grids */
.inner-hero,.service-detail-hero,.projects-hero-v3,.area-page-hero,.contact-hero,.case-hero,.legal-hero{padding-top:calc(64px + clamp(36px,4.5vw,58px));padding-bottom:clamp(48px,5vw,68px)}
.inner-hero-grid,.service-detail-grid,.projects-v3-grid,.case-hero-grid{grid-template-columns:minmax(0,.96fr) minmax(380px,1.04fr);gap:clamp(34px,4.5vw,62px);align-items:center}
.inner-hero-grid>*,.service-detail-grid>*,.projects-v3-grid>*,.case-hero-grid>*{min-width:0}
.inner-hero-copy h1,.service-detail-copy h1,.case-hero-copy h1{font-size:clamp(2.9rem,4.8vw,5.15rem)}
.inner-hero-art,.service-hero-board{height:clamp(330px,31vw,390px)}
.inner-photo-main{inset:0 clamp(28px,3vw,38px) 26px clamp(34px,3.7vw,48px)}
.inner-photo-float{height:42%}
.service-hero-board figure{inset:24px 38px 18px 24px}

/* Inner section layouts */
.section-heading{margin-bottom:clamp(26px,3vw,36px)}
.split-heading{grid-template-columns:minmax(0,1.1fr) minmax(280px,.7fr);gap:clamp(30px,4vw,56px)}
.story-grid{grid-template-columns:minmax(180px,220px) minmax(0,1fr);gap:clamp(38px,5vw,72px)}
.principle-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.principle-card{min-height:0;height:100%}
.audience-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.audience-card{grid-template-columns:minmax(180px,.92fr) minmax(0,1.08fr);min-height:400px}
.proof-strip-inner{grid-template-columns:repeat(5,minmax(0,1fr))}
.cta-panel-inner{padding:clamp(28px,3vw,42px);gap:clamp(24px,4vw,42px)}
.service-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.service-directory-card{grid-template-columns:minmax(170px,42%) minmax(0,58%);min-height:250px}
.directory-media{min-height:250px}
.method-layout,.service-intro-grid,.technical-layout,.case-story-grid{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(36px,5vw,70px)}
.method-steps,.technical-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.application-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.related-gallery{min-width:0}
.faq-two-col{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(30px,5vw,64px);align-items:start}

/* Projects */
.project-grid-v3{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,18px)}
.project-card-v3{min-width:0}
.project-card-v3 figure{height:auto;aspect-ratio:4/3}
.project-card-v3 img{width:100%;height:100%;object-fit:cover}
.projects-hero-board{height:clamp(330px,32vw,420px)}
.project-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-type-grid a{min-width:0}

/* Service areas */
.area-hero-visual{height:clamp(300px,31vw,390px)}
.area-directory-grid{grid-template-columns:minmax(290px,.86fr) minmax(0,1.14fr);gap:20px}
.area-project-proof{grid-template-columns:minmax(250px,1fr) minmax(0,1fr);gap:clamp(22px,3vw,30px)}
.area-project-proof figure{height:auto;aspect-ratio:4/3}
.area-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Contact + forms */
.contact-main-grid{grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:clamp(20px,3vw,34px)}
.contact-side{min-width:0}
.contact-form-card{padding:clamp(24px,3vw,36px)}
.estimate-form-c{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.estimate-form-c label,.estimate-form-c input,.estimate-form-c select,.estimate-form-c textarea{min-width:0}
.estimate-form-c input,.estimate-form-c select,.estimate-form-c textarea{font-size:16px}
.upload-c{min-width:0;overflow:hidden}
.upload-c input[type=file]{max-width:100%;width:100%;font-size:.78rem}
.contact-quick-row>a,.contact-quick-row>div,.contact-side-cards>a,.contact-side-cards>div{min-width:0}

/* Footer */
.footer-top,.footer-grid,.footer-bottom{min-width:0}
.footer-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,3vw,34px)}
.footer-brand{min-width:0}.footer-brand>div{min-width:0}
.footer-bottom{align-items:center}

/* Wide desktop / zoom-out: never scale vertical heights with huge CSS width */
@media(min-width:1600px){
  :root{--qa-section:68px;--qa-section-tight:54px}
  .container{width:min(1320px,calc(100% - 64px))}
  .hero-v15-layout{grid-template-columns:minmax(0,.94fr) minmax(420px,1.06fr)}
  .hero-v15-copy h1{font-size:4.65rem}
  .hero-v15-visual{height:330px}
  .inner-hero-art,.service-hero-board{height:370px}
  .project-showcase-c{height:370px}
}

/* Laptop: switch to compact mobile navigation early enough to avoid header collision */
@media(max-width:1024px){
  :root{--header-h:60px}
  html{scroll-padding-top:70px}
  .site-header,.header-inner{height:60px}
  .desktop-nav,.btn-header{display:none!important}
  .brand{width:76px;height:50px;flex-basis:76px}
  .header-actions{margin-left:auto}
  .header-phone span{display:inline}
  .menu-toggle{display:block}
  .mobile-panel{position:fixed;display:grid;left:var(--qa-gutter);right:var(--qa-gutter);top:68px;padding:18px;max-height:calc(100dvh - 82px);overflow:auto;background:rgba(255,255,255,.985);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-10px);transition:.25s var(--ease)}
  .mobile-panel.is-open{opacity:1;visibility:visible;transform:none}
  .mobile-panel nav{display:grid}
  .mobile-panel nav a{padding:11px 2px;border-bottom:1px solid #e5f1f7;font-size:.82rem;font-weight:800}
  .mobile-panel nav a.is-active{color:var(--blue)}

  .hero-c-v15{padding-top:calc(60px + 28px)}
  .hero-v15-layout{grid-template-columns:minmax(0,.96fr) minmax(350px,1.04fr);gap:28px}
  .hero-v15-copy h1{font-size:clamp(2.8rem,5vw,4rem)}
  .hero-v15-visual{height:300px}

  .inner-hero,.service-detail-hero,.projects-hero-v3,.area-page-hero,.contact-hero,.case-hero,.legal-hero{padding-top:calc(60px + 40px);padding-bottom:54px}
  .inner-hero-grid,.service-detail-grid,.projects-v3-grid,.case-hero-grid{grid-template-columns:minmax(0,.92fr) minmax(350px,1.08fr);gap:32px}
  .principle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .proof-strip-inner{grid-template-columns:repeat(3,minmax(0,1fr))}
  .proof-strip-inner>div{border-bottom:1px solid #d8edf7}
  .proof-strip-inner>div:nth-child(3n){border-right:0}
  .service-card-grid{grid-template-columns:1fr}
  .service-directory-card{grid-template-columns:minmax(210px,38%) minmax(0,62%)}
  .project-grid-v3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-main-grid{grid-template-columns:1fr}
  .contact-side{position:static;top:auto;padding-right:0;max-width:760px}
}

/* Tablet */
@media(max-width:820px){
  :root{--qa-section:56px;--qa-section-tight:46px}
  .header-phone span{display:none}
  .header-phone{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px}

  .hero-v15-layout,.inner-hero-grid,.service-detail-grid,.projects-v3-grid,.case-hero-grid{grid-template-columns:1fr}
  .hero-v15-copy,.inner-hero-copy,.service-detail-copy{max-width:720px}
  .hero-v15-copy{text-align:center;margin-inline:auto}
  .hero-v15-copy h1,.hero-v15-copy>p{margin-left:auto;margin-right:auto}
  .hero-v15-actions{justify-content:center}
  .hero-v15-visual{height:290px;max-width:680px;width:100%;margin-inline:auto!important}
  .hero-v15-trust{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-v15-trust>div:nth-child(2){border-right:0}
  .hero-v15-trust>div:nth-child(-n+2){border-bottom:1px solid #e1eef6}

  .intro-grid-c{grid-template-columns:1fr}.intro-label{display:none}.intro-stack{max-width:680px;width:100%;margin-inline:auto}
  .services-head-c,.split-heading{grid-template-columns:1fr;gap:16px}
  .service-row-c{grid-template-columns:42px minmax(0,1fr) 38px}.service-icon-c,.service-row-c figure{display:none}
  .project-showcase-c{grid-template-columns:1fr;height:auto}.project-feature-c{height:330px}.project-side-c{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:170px}.project-side-c figure{height:170px}
  .build-grid-c,.proof-layout-c,.area-inner-c,.faq-contact-grid-c{grid-template-columns:1fr}
  .application-shell-c{grid-template-columns:1fr}.application-intro-c{max-width:680px}
  .faq-side-c{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.75fr);gap:14px}

  .inner-hero-art,.service-hero-board,.case-hero-image,.projects-hero-board{height:340px;max-width:700px;width:100%;margin-inline:auto}
  .story-grid,.method-layout,.service-intro-grid,.technical-layout,.case-story-grid,.faq-two-col{grid-template-columns:1fr;gap:28px}
  .audience-grid{grid-template-columns:1fr}.audience-card{min-height:0}
  .area-directory-grid,.area-project-proof{grid-template-columns:1fr}
  .area-service-grid{grid-template-columns:1fr}
  .project-type-grid{grid-template-columns:1fr 1fr}
  .cta-panel-inner{flex-direction:column;align-items:flex-start}.cta-panel-actions{width:100%;min-width:0;flex-direction:row;flex-wrap:wrap}.cta-panel-actions .btn{flex:1 1 220px}.cta-phone{min-height:46px;flex:1 1 190px}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Mobile */
@media(max-width:620px){
  :root{--qa-gutter:12px;--qa-section:46px;--qa-section-tight:40px;--header-h:58px}
  html{scroll-padding-top:66px}
  .site-header,.header-inner{height:58px}
  .header-inner{gap:9px}
  .brand{width:70px;height:47px;flex-basis:70px}
  .menu-toggle{width:40px;height:40px}
  .mobile-panel{top:65px;left:12px;right:12px;padding:15px}

  h1{font-size:clamp(2.45rem,12vw,3.45rem)}
  h2{font-size:clamp(2rem,9vw,2.9rem)}
  .eyebrow,.page-kicker{letter-spacing:.11em}
  .btn-lg{min-height:48px}

  .hero-c-v15{padding:calc(58px + 20px) 0 18px}
  .hero-v15-copy{text-align:left;margin:0}
  .hero-v15-copy h1{font-size:clamp(2.45rem,11.4vw,3.35rem);margin:13px 0 12px}
  .hero-v15-copy>p{margin:0 0 16px}
  .hero-v15-actions{justify-content:flex-start;gap:10px}
  .hero-v15-visual{height:220px}
  .hero-v15-photo{inset:0;border-width:5px}
  .hero-v15-frame{inset:14px 4px -4px 24px}
  .hero-v15-chip-c{display:none}
  .hero-v15-chip{max-width:145px}
  .hero-v15-chip strong{white-space:normal}
  .hero-v15-trust>div{min-height:60px;padding:9px}

  .section{padding-block:46px}
  .intro-c,.services-c,.projects-c,.craft-c,.applications-c,.proof-c,.faq-contact-c{padding-block:46px}
  .intro-stack{height:310px}.stack-main{height:255px;width:88%}.stack-small{height:142px;width:49%;border-width:6px}.stack-chip{right:5px;bottom:14px}
  .service-row-c{grid-template-columns:32px minmax(0,1fr) 32px;min-height:86px;padding:11px}.service-text-c h3{font-size:1.06rem}.service-text-c p{font-size:.72rem}
  .projects-head-c{align-items:flex-start;flex-direction:column}.projects-actions-c{width:100%;justify-content:flex-start}
  .project-feature-c{height:270px}.project-side-c{grid-template-rows:135px}.project-side-c figure{height:135px}
  .build-card{min-height:0;padding:27px 21px}
  .craft-grid-c{grid-template-columns:1fr 1fr}.craft-grid-c article{min-height:132px;padding:16px}
  .application-grid-c{grid-template-columns:1fr 1fr;grid-template-rows:190px 132px 132px;height:auto;overflow:visible}.application-grid-c figure:first-child{grid-column:1/3;grid-row:1}.application-grid-c figure:nth-child(2){grid-column:1;grid-row:2}.application-grid-c figure:nth-child(3){grid-column:2;grid-row:2}.application-grid-c figure:nth-child(4){grid-column:1;grid-row:3}.application-grid-c figure:nth-child(5){grid-column:2;grid-row:3}
  .why-c,.process-c{padding:21px 17px}.process-c ol{grid-template-columns:1fr 1fr}
  .faq-side-c{display:flex;flex-direction:column}.faq-c,.estimate-card-c{padding:22px 17px}.faq-callout-c{min-height:0}

  .inner-hero,.service-detail-hero,.projects-hero-v3,.area-page-hero,.contact-hero,.case-hero,.legal-hero{padding-top:calc(58px + 30px);padding-bottom:44px}
  .inner-hero-copy h1,.service-detail-copy h1,.case-hero-copy h1{font-size:clamp(2.45rem,11vw,3.3rem)}
  .inner-hero-actions{gap:10px}
  .inner-hero-art,.service-hero-board,.case-hero-image,.projects-hero-board{height:270px}
  .inner-photo-main{inset:0 18px 18px 24px;border-width:5px}.inner-photo-float{height:40%;border-width:4px}.inner-stat-card{right:-2px;top:16px;width:135px;padding:9px}
  .service-hero-board figure{inset:12px 22px 12px 10px;border-width:5px}.board-tile{width:58px;height:58px}.board-b{right:42px}.board-c{top:42px}.board-label{right:0;bottom:18px}
  .story-grid{gap:20px}.story-number{min-height:0;padding:20px}.story-number b{font-size:3.6rem}
  .principle-grid,.service-card-grid,.method-steps,.technical-grid,.application-detail-grid,.case-solution-grid,.project-grid-v3,.project-type-grid{grid-template-columns:1fr}
  .audience-card{grid-template-columns:1fr}.audience-photo{height:190px}.audience-copy{padding:24px 20px}
  .proof-strip-inner{grid-template-columns:1fr 1fr}.proof-strip-inner>div{min-height:84px;padding:14px}.proof-strip-inner>div:nth-child(2n){border-right:0}
  .service-directory-card{grid-template-columns:1fr}.directory-media{height:190px;min-height:190px}.directory-copy{padding:22px 19px}
  .related-gallery{grid-template-columns:1fr 1fr}
  .project-card-v3 figure{aspect-ratio:4/3;height:auto}
  .project-filter-pills{justify-content:flex-start;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.project-filter-pills::-webkit-scrollbar{display:none}.project-filter-pills button{flex:0 0 auto}
  .area-hero-visual{height:280px}.area-project-proof figure{aspect-ratio:4/3;height:auto}
  .contact-hero-card{min-height:300px;padding:24px 18px}.contact-hero-card ul{grid-template-columns:1fr}.contact-quick-row{display:grid}
  .estimate-form-c{grid-template-columns:1fr}.field-wide{grid-column:auto}.estimate-form-c textarea{min-height:110px}
  .upload-c>span{align-items:flex-start;flex-wrap:wrap}.upload-c small{display:block;width:100%;margin-left:28px}
  .case-meta{display:grid;grid-template-columns:1fr 1fr}.case-hero-image{border-width:5px}
  .legal-shell{padding:23px 17px}.not-found{min-height:72vh;padding:calc(58px + 52px) 0 58px}.not-found-inner{grid-template-columns:1fr;gap:22px}.not-found-number{font-size:5.5rem}

  .footer-top{align-items:flex-start;flex-direction:column;gap:18px}.footer-grid{grid-template-columns:1fr 1fr;gap:22px 18px}.footer-bottom{flex-direction:column;align-items:flex-start;gap:6px}.site-footer{padding-bottom:calc(82px + env(safe-area-inset-bottom))}
  .mobile-cta-bar{bottom:max(10px,env(safe-area-inset-bottom));left:10px;right:10px}
}

/* Very small phones */
@media(max-width:390px){
  :root{--qa-gutter:10px}
  .hero-v15-actions,.inner-hero-actions,.thankyou-actions{align-items:stretch;flex-direction:column}
  .hero-v15-actions .btn,.inner-hero-actions .btn,.thankyou-actions .btn{width:100%}
  .hero-v15-actions .text-cta,.inner-hero-actions .text-cta{align-self:flex-start}
  .hero-v15-visual{height:205px}
  .hero-v15-chip-b{display:none}
  .craft-grid-c{grid-template-columns:1fr}
  .process-c ol{grid-template-columns:1fr}
  .application-grid-c{grid-template-columns:1fr;grid-template-rows:190px repeat(4,140px)}
  .application-grid-c figure:first-child,.application-grid-c figure:nth-child(2),.application-grid-c figure:nth-child(3),.application-grid-c figure:nth-child(4),.application-grid-c figure:nth-child(5){grid-column:1;grid-row:auto}
  .proof-strip-inner{grid-template-columns:1fr}.proof-strip-inner>div{border-right:0!important}
  .footer-grid{grid-template-columns:1fr}
  .case-meta{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal].motion-ready{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}
}

/* Specificity fix: Services Hub has a page-specific desktop grid rule. */
@media(max-width:820px){
  .services-hero .inner-hero-grid{grid-template-columns:1fr!important}
  .services-hero .inner-hero-copy{width:auto!important;max-width:720px}
  .services-hero .service-hero-board{width:100%;justify-self:stretch}
}