/* Canvas Interior Design & Finishing — shared styles */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-stretch:75% 100%;font-display:swap;src:url(fonts/bricolage-grotesque.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/plex-mono-400.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/plex-mono-500.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/plex-sans.woff2) format('woff2')}

*,*::before,*::after{box-sizing:border-box}
:root{--gx:48px}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#121211}
a{color:inherit;text-decoration:none}a:hover{color:#D5001C}
img{display:block;max-width:100%}
.d{font-family:"Bricolage Grotesque",sans-serif;font-stretch:75%;font-weight:750;text-transform:uppercase;letter-spacing:-0.01em;line-height:.9;margin:0;overflow-wrap:break-word}
.m{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.grid{background-image:linear-gradient(rgba(237,234,226,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(237,234,226,.06) 1px,transparent 1px);background-size:80px 80px}
.gridl{background-image:linear-gradient(rgba(18,18,17,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(18,18,17,.06) 1px,transparent 1px);background-size:80px 80px}
.btn{transition:background .2s}
.btn:hover{color:#fff;background:#B00017!important}
.ghost:hover{color:#fff;border-color:#fff!important}
.card img{transition:transform .6s}
.card:hover img{transform:scale(1.04)}
ul.l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
ul.l li{padding:14px 0;border-bottom:1px solid #CBC9C0;display:flex;gap:14px;align-items:baseline}
.f{background:transparent;border:0;border-bottom:1px solid #8E8C85;padding:12px 0;font:17px "IBM Plex Sans",sans-serif;color:#121211;width:100%;border-radius:0}
.f:focus{outline:none;border-bottom-color:#D5001C}
select.f{appearance:none;-webkit-appearance:none;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23121211' stroke-width='1.6'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 4px center;padding-right:24px}
.qf{appearance:none;-webkit-appearance:none;border-radius:0}
:focus-visible{outline:2px solid #D5001C;outline-offset:3px}
.skip{position:absolute;left:-9999px;top:8px;background:#D5001C;color:#fff;padding:10px 16px;z-index:50}
.skip:focus{left:8px}
.is-hidden{display:none!important}
.form-note{font-size:14px;line-height:1.5;margin:0}

/* Header + mobile menu */
.menu-btn{display:none;background:transparent;border:1px solid rgba(237,234,226,.35);color:#F7F7F4;width:48px;height:44px;cursor:pointer;align-items:center;justify-content:center}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:20px;height:2px;background:currentColor;position:relative;content:"";transition:transform .2s}
.menu-btn span::before{position:absolute;top:-6px}.menu-btn span::after{position:absolute;top:6px}
.menu-btn[aria-expanded="true"] span{background:transparent}
.menu-btn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}

@media (max-width:1080px){
  .menu-btn{display:flex}
  .hdr{flex-wrap:wrap!important}
  .hdr-nav{display:none!important;order:3;width:100%;flex-direction:column;gap:0!important;padding:8px 0 4px}
  .hdr-nav a{padding:14px 0!important;border-bottom:1px solid rgba(237,234,226,.12)!important;font-size:18px}
  .hdr-nav a[aria-current]{color:#D5001C}
  .hdr.open .hdr-nav{display:flex!important}
  .hdr-tel{display:none}
}
@media (max-width:760px){
  :root{--gx:20px}
  .hdr-cta .btn{display:none!important}
  .span2{grid-column:auto!important}
  .hero-wrap{padding-top:56px!important}
  .hero-form{justify-self:stretch!important;max-width:none!important;padding:24px!important}
  .stat{border-right:0!important;border-bottom:1px solid #CBC9C0}
  .sector{padding-left:0!important;border-right:0!important;border-bottom:1px solid #CBC9C0}
  .enq{padding:28px 20px!important}
  .big-q{font-size:96px!important}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* round 2: sticky header, logo, call card */
.page-wrap{overflow:clip!important}
.site-hdr{position:sticky!important;top:0;z-index:30!important;background:rgba(18,18,17,.96)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hdr{padding-top:12px!important;padding-bottom:12px!important}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{height:52px;width:auto}
.logo:hover{opacity:.9}
.hdr-cta{display:flex;align-items:stretch;gap:12px}
.call-card,.addr-card{display:flex;align-items:center;gap:12px;padding:8px 16px 8px 8px;border:1px solid rgba(237,234,226,.16);background:rgba(237,234,226,.04)}
.call-card{border-color:rgba(213,0,28,.55);background:linear-gradient(90deg,rgba(213,0,28,.16),rgba(213,0,28,.02))}
.call-ic,.addr-ic{position:relative;width:42px;height:42px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#fff}
.call-ic{background:#D5001C}
.call-ic::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid rgba(213,0,28,.6);animation:ring 2.2s ease-out infinite}
@keyframes ring{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.35);opacity:0}}
.addr-ic{border:1px solid rgba(237,234,226,.3);color:#D5001C}
.call-txt{display:flex;flex-direction:column;gap:4px;line-height:1.2}
.call-lbl{font-size:10px!important;color:#A9A79F}
.call-card .call-lbl{color:#FF8A95}
.call-nums{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;font-weight:600;font-size:16px;letter-spacing:.01em;white-space:nowrap}
.call-sep{color:#D5001C}
.addr-txt{font-size:13px;color:#EDEAE2}
.addr-card:hover .addr-txt{color:#D5001C}
.phone-btn{display:none;width:44px;height:44px;border-radius:50%;background:#D5001C;color:#fff;align-items:center;justify-content:center;flex-shrink:0}
.phone-btn:hover{color:#fff;background:#B00017}
@media (max-width:1320px){.addr-card{display:none}}
@media (max-width:1080px){
  .hdr{gap:12px!important}
  .phone-btn{display:flex;margin-left:auto}
  .hdr-cta{display:none;order:4;width:100%;flex-direction:column;padding-bottom:12px}
  .hdr.open .hdr-cta{display:flex}
  .hdr.open .addr-card{display:flex}
  .logo img{height:44px}
}
@media (max-width:420px){.logo img{height:38px}}

/* round 3: no box around the call card */
.call-card{border:0!important;background:none!important;padding-left:0!important}

/* round 4: unboxed address card, social icons */
.addr-card{border:0!important;background:none!important;padding-left:8px!important}
.soc{display:inline-flex;align-items:center;gap:10px;font-weight:500}
.soc-ic{width:34px;height:34px;border-radius:50%;background:#D5001C;color:#fff;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s,color .2s}
.soc:hover{color:#F7F7F4}
.soc:hover .soc-ic{background:#F7F7F4;color:#D5001C}

/* round 5: floating liquid-glass header */
:root{--hdr-h:97px}
.site-hdr{background:transparent!important;border-bottom:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding:12px var(--gx) 0;margin-bottom:calc(-1 * var(--hdr-h));pointer-events:none}
.site-hdr .hdr{pointer-events:auto;max-width:1392px!important;padding:10px 14px 10px 22px!important;border-radius:24px;
  background:linear-gradient(180deg,rgba(40,40,38,.42),rgba(18,18,17,.52));
  -webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(255,255,255,.05),0 12px 36px rgba(0,0,0,.28);
  transition:background .35s,border-color .35s,box-shadow .35s,color .35s}
.logo-dark{display:none!important}
.site-hdr.on-light{color:#121211!important}
.site-hdr.on-light .hdr{background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(247,247,244,.5));border-color:rgba(255,255,255,.8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 36px rgba(18,18,17,.12)}
.site-hdr.on-light .logo-light{display:none!important}
.site-hdr.on-light .logo-dark{display:block!important}
.site-hdr.on-light .addr-txt{color:#3E3F3B}
.site-hdr.on-light .call-lbl{color:#5E5F5A}
.site-hdr.on-light .call-card .call-lbl{color:#D5001C}
.site-hdr.on-light .addr-ic{border-color:rgba(18,18,17,.2)}
.site-hdr.on-light .menu-btn{color:#121211;border-color:rgba(18,18,17,.25)}
.site-hdr.on-light .hdr-nav a{border-bottom-color:rgba(18,18,17,.1)}
.menu-btn{border-radius:14px}
@media (max-width:1080px){:root{--hdr-h:72px}.site-hdr{padding-top:10px}.site-hdr .hdr{padding:8px 10px 8px 16px!important;border-radius:20px}}
.hero-wrap{padding-top:calc(64px + var(--hdr-h))!important}
main>section:first-child>div[style*="padding: 120px"]{padding-top:calc(64px + var(--hdr-h))!important}
@media (max-width:760px){.hero-wrap,main>section:first-child>div[style*="padding: 120px"]{padding-top:calc(40px + var(--hdr-h))!important}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.site-hdr .hdr{background:rgba(18,18,17,.92)}.site-hdr.on-light .hdr{background:rgba(247,247,244,.95)}}

/* round 6: partner logo marquee */
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{list-style:none;margin:0;padding:0;display:flex;gap:20px;width:max-content;animation:marq 42s linear infinite}
.marquee-rev .marquee-track{animation-direction:reverse;animation-duration:50s}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(calc(-50% - 10px))}}
.pl{display:flex;align-items:center;gap:14px;padding:22px 34px;min-width:250px;background:rgba(247,247,244,.7);border:1px solid #D9D7CF;color:#121211;opacity:.62;filter:grayscale(1);transition:opacity .3s,color .3s,border-color .3s}
.pl:hover{opacity:1;color:#D5001C;border-color:#D5001C}
.pl-t{display:flex;flex-direction:column;line-height:1}
.pl-n{font-size:22px;font-weight:700}
.pl-s{font:500 10px "IBM Plex Mono",monospace;letter-spacing:.18em;text-transform:uppercase;margin-top:5px}
.pl-d .pl-n{font-family:"Bricolage Grotesque",sans-serif;font-stretch:75%;font-weight:800;letter-spacing:.04em;font-size:26px}
.pl-sans .pl-n{font-family:"IBM Plex Sans",sans-serif;font-weight:600;letter-spacing:-.01em}
.pl-m .pl-n{font-family:"IBM Plex Mono",monospace;font-weight:500;letter-spacing:.2em;font-size:19px}
@media (max-width:760px){.pl{min-width:200px;padding:16px 22px}.pl-n{font-size:18px}.pl-d .pl-n{font-size:21px}.marquee-track{animation-duration:30s}.marquee-rev .marquee-track{animation-duration:36s}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none!important;flex-wrap:wrap;width:auto;justify-content:center}.marquee-track .pl[aria-hidden],.marquee-track[aria-hidden]{display:none}.marquee{-webkit-mask-image:none;mask-image:none;padding:0 var(--gx)}}

/* round 7: bigger tap targets for phone/email links on phones */
@media (max-width:760px){main a[href^="tel:"]:not(.phone-btn),main a[href^="mailto:"]{display:inline-block;padding:8px 0;min-height:44px}}
/* open phone menu: denser glass so links stay readable */
.site-hdr .hdr.open{background:linear-gradient(180deg,rgba(30,30,28,.86),rgba(18,18,17,.92))}
.site-hdr.on-light .hdr.open{background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(247,247,244,.94))}

/* round 7: home page on phones */
.h-hint{display:none}
@media (max-width:760px){
  .h-sec{padding-top:72px!important;padding-bottom:72px!important}
  .h-sec>div{gap:32px!important}
  .h-sec h2.d{font-size:clamp(30px,9vw,40px)!important;line-height:.98!important}
  /* hero: one clean screen */
  .h-hero{min-height:100svh!important;display:flex;flex-direction:column;justify-content:flex-end}
  .h-hero .hero-wrap{padding-bottom:40px!important;width:100%}
  .h-hero .hero-wrap>div{gap:22px!important}
  .h-shade{background:linear-gradient(180deg,rgba(18,18,17,.35) 0%,rgba(18,18,17,.25) 35%,rgba(18,18,17,.92) 78%,#121211 100%)!important}
  .h-hero h1{font-size:clamp(40px,12.5vw,54px)!important}
  .h-hero p{font-size:17px!important}
  .h-more,.h-steps,.h-hide{display:none!important}
  .h-btns{flex-direction:column}
  .h-btns a{justify-content:center;text-align:center;padding:16px 20px!important}
  /* statement + compact stats row */
  .h-stmt>div{gap:22px!important}
  .h-stmt p{font-size:16px!important}
  .h-stats{grid-template-columns:repeat(3,1fr)!important;margin-top:8px!important}
  .h-stats .stat{padding:20px 4px!important;border-bottom:0!important;border-right:1px solid #CBC9C0!important;gap:6px!important;align-items:center}
  .h-stats .stat:last-child{border-right:0!important}
  .h-stats .stat .d{font-size:38px!important}
  .h-stats .stat .m{font-size:9.5px!important;letter-spacing:.1em}
  /* swipe rails for services and projects */
  .h-hint{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:#8E8C85;margin-bottom:-18px}
  .h-rail{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px!important;margin:0 calc(-1*var(--gx));padding:0 var(--gx) 6px;scroll-padding:0 var(--gx);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .h-rail::-webkit-scrollbar{display:none}
  .h-rail>.card{flex:0 0 82%;scroll-snap-align:start}
  .h-svc .h-rail>.card{height:440px!important}
  .h-svc .card h3{font-size:32px!important}
  .h-svc .card p{font-size:14px!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .h-proj .card>div:first-child{height:300px!important}
  .h-proj .card .d{font-size:24px!important}
  .h-sec>div>div:first-child>a{padding:12px 18px!important}
  /* process as a compact timeline */
  .h-line{display:none}
  .h-proc .h-step{flex-direction:row!important;flex-wrap:wrap;gap:6px 16px!important;padding-bottom:6px}
  .h-proc .h-step>span{width:44px!important;height:44px!important;font-size:13px!important}
  .h-proc .h-step h3{font-size:26px!important;align-self:center}
  .h-proc .h-step p{flex-basis:100%;padding-left:60px;font-size:14px!important}
  .h-proc>div>div:last-child{gap:22px!important}
  .h-proc>div>div:first-child p{font-size:15px}
  /* about */
  .h-about>div>div:first-child{height:260px!important}
  .h-about>div>div:first-child>div{left:14px!important;bottom:14px!important;padding:14px 16px!important}
  .h-about>div>div:first-child .d{font-size:20px!important}
  .h-about p{font-size:16px!important}
  /* partners: one row */
  .h-part{padding:64px 0 72px!important}
  .h-part .marquee-rev{display:none}
  .h-part .marquee{margin-top:36px!important}
  /* cta */
  .h-cta>div>div:last-child{flex-direction:column;width:100%}
  .h-cta>div>div:last-child a{justify-content:center}
}

/* round 8: modern pill buttons + glass chip (home), glass phone menu */
a.call-ic:hover{color:#fff}
.h-chip{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;padding:9px 16px 9px 12px;border-radius:999px;color:#EDEAE2;font-size:11px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.h-dot{width:8px;height:8px;border-radius:50%;background:#D5001C;box-shadow:0 0 0 4px rgba(213,0,28,.25)}
.h-pill{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 8px 8px 26px;min-height:56px;border-radius:999px;font-weight:600;font-size:15px;transition:transform .25s,background .25s,box-shadow .25s,border-color .25s}
.h-arr{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .25s}
.h-pill:hover{transform:translateY(-2px)}
.h-pill:hover .h-arr{transform:rotate(45deg)}
.h-pill-red{background:#D5001C;color:#fff;box-shadow:0 10px 30px rgba(213,0,28,.35),inset 0 1px 0 rgba(255,255,255,.25)}
.h-pill-red .h-arr{background:#fff;color:#D5001C}
.h-pill-red:hover{color:#fff;background:#E0061F}
.h-pill-glass{color:#F7F7F4;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.h-pill-glass .h-arr{background:rgba(255,255,255,.14);color:#fff}
.h-pill-glass:hover{color:#fff;border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.14)}
.h-pill-dark{background:#121211;color:#F7F7F4}
.h-pill-dark .h-arr{background:#D5001C;color:#fff}
.h-pill-dark:hover{color:#fff;background:#2A2A28}
.h-pill-white{background:#fff;color:#121211}
.h-pill-white .h-arr{background:#121211;color:#fff}
.h-pill-white:hover{color:#121211}
@media (max-width:760px){
  .h-btns{gap:10px!important}
  .h-btns .h-pill{justify-content:space-between;padding:6px 6px 6px 22px!important}
  .h-cta>div>div:last-child .h-pill{justify-content:space-between}
  .h-hero .h-chip{font-size:10px}
}
/* glass phone menu */
@media (max-width:1080px){
  .site-hdr .hdr.open{background:linear-gradient(180deg,rgba(40,40,38,.5),rgba(18,18,17,.62))!important;
    -webkit-backdrop-filter:blur(34px) saturate(190%)!important;backdrop-filter:blur(34px) saturate(190%)!important;
    border-color:rgba(255,255,255,.22)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 24px 60px rgba(0,0,0,.4)!important}
  .site-hdr.on-light .hdr.open{background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(247,247,244,.7))!important;border-color:rgba(255,255,255,.9)!important;box-shadow:inset 0 1px 0 #fff,0 24px 60px rgba(18,18,17,.18)!important}
  .hdr.open .hdr-nav{gap:6px!important;padding:14px 0 10px}
  .hdr.open .hdr-nav a{border:0!important;border-radius:16px;padding:14px 16px!important;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)!important;text-shadow:0 1px 2px rgba(0,0,0,.25)}
  .hdr.open .hdr-nav a[aria-current]{background:rgba(213,0,28,.18);border-color:rgba(213,0,28,.35)!important;color:#fff}
  .site-hdr.on-light .hdr.open .hdr-nav a{background:rgba(255,255,255,.55);border-color:rgba(18,18,17,.06)!important;text-shadow:none}
  .site-hdr.on-light .hdr.open .hdr-nav a[aria-current]{background:rgba(213,0,28,.1);color:#D5001C}
  .hdr.open .hdr-cta{gap:8px!important}
  .hdr.open .call-card,.hdr.open .addr-card{border-radius:18px;padding:10px 14px 10px 10px!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.08)!important}
  .site-hdr.on-light .hdr.open .call-card,.site-hdr.on-light .hdr.open .addr-card{background:rgba(255,255,255,.55)!important;border-color:rgba(18,18,17,.06)!important}
  .hdr.open .call-nums{font-size:17px}
}
@media (max-width:760px){.h-hero .h-chip{white-space:nowrap;letter-spacing:.08em;font-size:9.5px;padding:8px 14px 8px 10px}}

/* round 9: header call pill, centred pills on phones, preview call sheet */
@media (max-width:1080px){.phone-btn{width:auto!important;height:42px!important;padding:0 16px 0 14px;border-radius:999px!important;gap:8px;font-weight:600;font-size:14px;box-shadow:0 6px 18px rgba(213,0,28,.35)}}
.phone-btn span{display:none}
@media (max-width:1080px){.phone-btn span{display:inline}}
@media (max-width:360px){.phone-btn span{display:none}.phone-btn{width:42px!important;padding:0!important;justify-content:center}}
@media (max-width:760px){.h-pill{position:relative;justify-content:center!important;padding:8px 56px!important;text-align:center}.h-pill .h-arr{position:absolute;right:8px;top:50%;margin-top:-20px}}
.call-sheet{position:fixed;left:12px;right:12px;bottom:12px;z-index:100;padding:18px;border-radius:24px;color:#F7F7F4;background:rgba(24,24,22,.72);-webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);border:1px solid rgba(255,255,255,.18);box-shadow:0 20px 50px rgba(0,0,0,.45);font-family:"IBM Plex Sans",sans-serif;max-width:440px;margin:0 auto}
.call-sheet p{margin:0 0 12px;font-size:14px;color:#C9C6BD;line-height:1.45}
.call-sheet strong{display:block;font-size:26px;letter-spacing:.02em;margin-bottom:12px;color:#fff}
.call-sheet .cs-row{display:flex;gap:8px}
.call-sheet button,.call-sheet a{flex:1;min-height:46px;border-radius:999px;border:0;font:600 15px "IBM Plex Sans",sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center}
.call-sheet .cs-copy{background:#D5001C;color:#fff}.call-sheet .cs-close{background:rgba(255,255,255,.12);color:#fff}

/* round 9: home hero redesign */
.hx-hero{position:relative;background:#121211;color:#F7F7F4;overflow:hidden;min-height:min(100svh,980px);display:flex}
.hx-slides,.hx-slides img,.hx-shade{position:absolute;inset:0;width:100%;height:100%}
.hx-slides img{object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1.2s ease,transform 7s ease}
.hx-slides img.on{opacity:1;transform:scale(1)}
.hx-shade{background:linear-gradient(90deg,rgba(14,14,13,.88) 0%,rgba(14,14,13,.55) 45%,rgba(14,14,13,.15) 100%),linear-gradient(180deg,rgba(14,14,13,.35) 0%,rgba(14,14,13,0) 30%,rgba(14,14,13,.2) 60%,rgba(14,14,13,.9) 100%)}
.hx-wrap{position:relative;width:100%;max-width:1440px;margin:0 auto;padding:calc(64px + var(--hdr-h)) var(--gx) 40px!important;display:flex;flex-direction:column;justify-content:flex-end;gap:56px}
.hx-copy{display:flex;flex-direction:column;gap:22px;max-width:720px}
.hx-eyebrow{color:#D6D3CA;font-size:12px;line-height:1.7;letter-spacing:.22em;position:relative;padding-bottom:14px}
.hx-eyebrow::after{content:"";position:absolute;left:0;bottom:0;width:40px;height:2px;background:#D5001C}
.hx-h1{font-stretch:100%!important;font-weight:800!important;letter-spacing:-.01em!important;line-height:.9!important;font-size:clamp(52px,8.4vw,132px)}
.hx-red{color:#E0061F}
.hx-dot{color:#fff}
.hx-sub{display:block;margin-top:.28em;font-size:.36em;font-stretch:75%;font-weight:700;letter-spacing:.06em;color:transparent;-webkit-text-stroke:1.2px #F7F7F4}
.hx-lead{margin:0;font-size:19px;line-height:1.5;color:#E2DFD6;max-width:420px}
.hx-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:6px}
.hx-cta{display:inline-flex;align-items:center;gap:14px;min-height:58px;padding:0 30px;border-radius:999px;background:#D5001C;color:#fff;font-weight:600;font-size:17px;box-shadow:0 14px 34px rgba(213,0,28,.4),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .25s,background .25s}
.hx-cta:hover{color:#fff;background:#E0061F;transform:translateY(-2px)}
.hx-cta svg{transition:transform .25s}.hx-cta:hover svg{transform:translateX(4px)}
.hx-play{display:inline-flex;align-items:center;gap:12px;color:#F7F7F4;font-size:15px;line-height:1.25;font-weight:500}
.hx-ring{width:52px;height:52px;border-radius:50%;border:1.5px solid rgba(255,255,255,.75);display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .25s,border-color .25s}
.hx-play:hover{color:#fff}.hx-play:hover .hx-ring{background:#D5001C;border-color:#D5001C}
.hx-dots{display:flex;gap:8px;margin-top:10px}
.hx-dots button{width:22px;height:4px;border-radius:4px;border:0;padding:0;background:rgba(255,255,255,.3);cursor:pointer;transition:width .3s,background .3s}
.hx-dots button.on{width:36px;background:#D5001C}
.hx-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:980px}
.hx-tile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:20px 10px 16px;border-radius:20px;color:#F7F7F4;background:rgba(30,30,28,.38);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.14);transition:transform .25s,border-color .25s,background .25s}
.hx-tile:hover{color:#fff;transform:translateY(-3px);border-color:rgba(213,0,28,.7);background:rgba(213,0,28,.18)}
.hx-ti{color:#fff;display:flex}
.hx-tt{font-size:14.5px;line-height:1.3;font-weight:500}
.hx-ta{opacity:.85;display:flex}
/* stats strip */
.hx-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:1344px;margin:0 auto;padding:30px var(--gx);background:#F7F7F4}
.hx-stat{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;color:#121211;padding:4px 8px;border-right:1px solid #DEDCD4}
.hx-stat:last-child{border-right:0}
.hx-stat svg{color:#5E5F5A;margin-bottom:4px}
.hx-stat strong{font:800 26px/1.05 "Bricolage Grotesque",sans-serif}
.hx-stat span{font-size:13.5px;color:#5E5F5A}
section.hx-stats{max-width:none}
/* featured projects */
.hx-proj{background:#F7F7F4;padding:56px 0 96px}
.hx-head{max-width:1344px;margin:0 auto 26px;padding:0 var(--gx);display:flex;justify-content:space-between;align-items:end;gap:16px}
.hx-kicker{color:#D5001C;display:flex;align-items:center;gap:14px;font-size:12px}
.hx-kicker::after{content:"";width:56px;height:1.5px;background:#D5001C}
.hx-h2{margin:10px 0 0;font:800 clamp(30px,4.4vw,56px)/1.02 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em;color:#121211}
.hx-all{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border-radius:999px;background:#ECEAE3;font-weight:600;font-size:15px;white-space:nowrap;transition:background .25s}
.hx-all:hover{background:#121211;color:#fff}
.hx-rail{max-width:1344px;margin:0 auto;padding:0 var(--gx);display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hx-card{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 1px 0 rgba(18,18,17,.06),0 12px 30px rgba(18,18,17,.07);transition:transform .3s,box-shadow .3s}
.hx-card:hover{color:#121211;transform:translateY(-4px);box-shadow:0 20px 40px rgba(18,18,17,.12)}
.hx-img{position:relative;display:block;aspect-ratio:4/3.4;overflow:hidden;background:#121211}
.hx-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.hx-card:hover .hx-img img{transform:scale(1.05)}
.hx-badge{position:absolute;top:12px;left:12px;font:500 10px "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;padding:5px 9px;border-radius:999px;background:rgba(247,247,244,.85);color:#121211;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hx-cap{display:flex;flex-direction:column;gap:3px;padding:14px 16px 16px}
.hx-cap strong{font-size:17px;font-weight:600}
.hx-cap span{font-size:14px;color:#6A6B65}
@media (max-width:1080px){.hx-tiles{max-width:none}}
@media (max-width:760px){
  .hx-hero{min-height:auto}
  .hx-wrap{padding:calc(36px + var(--hdr-h)) var(--gx) 22px!important;gap:30px}
  .hx-shade{background:linear-gradient(90deg,rgba(14,14,13,.8) 0%,rgba(14,14,13,.35) 70%,rgba(14,14,13,.15) 100%),linear-gradient(180deg,rgba(14,14,13,.3) 0%,rgba(14,14,13,.05) 30%,rgba(14,14,13,.35) 62%,rgba(14,14,13,.95) 100%)}
  .hx-copy{gap:16px}
  .hx-eyebrow{font-size:11px;padding-bottom:12px}
  .hx-h1{font-size:clamp(46px,15vw,64px)}
  .hx-lead{font-size:17px;max-width:300px}
  .hx-actions{gap:16px}
  .hx-cta{min-height:54px;padding:0 24px;font-size:16px}
  .hx-ring{width:46px;height:46px}
  .hx-tiles{gap:8px}
  .hx-tile{padding:14px 4px 12px;border-radius:16px;gap:8px}
  .hx-ti svg{width:26px;height:26px}
  .hx-tt{font-size:12px}
  .hx-ta svg{width:14px;height:14px}
  .hx-stats{padding:22px 6px}
  .hx-stat{padding:2px 4px;gap:3px}
  .hx-stat svg{width:22px;height:22px;margin-bottom:2px}
  .hx-stat strong{font-size:17px}
  .hx-stat span{font-size:11px}
  .hx-proj{padding:40px 0 64px}
  .hx-head{margin-bottom:18px}
  .hx-h2{font-size:30px}
  .hx-all{min-height:40px;padding:0 16px;font-size:14px}
  .hx-rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gx);gap:12px;scrollbar-width:none;padding-bottom:10px}
  .hx-rail::-webkit-scrollbar{display:none}
  .hx-card{flex:0 0 62%;scroll-snap-align:start;border-radius:16px}
  .hx-cap strong{font-size:15px}.hx-cap span{font-size:12.5px}
}
@media (max-width:400px){.hx-tt{font-size:11px}.hx-stat strong{font-size:15px}.hx-stat span{font-size:10px}}
@media (prefers-reduced-motion:reduce){.hx-slides img{transition:none;transform:none}}

/* round 9b: desktop hero layout + phone tweaks */
@media (min-width:1081px){
  .hx-hero{min-height:min(100svh,940px)}
  .hx-wrap{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:end;gap:48px!important;padding-bottom:56px!important}
  .hx-h1{font-size:clamp(56px,6.4vw,104px)}
  .hx-tiles{grid-template-columns:repeat(2,1fr);justify-self:end;width:100%;max-width:460px}
  .hx-tile{flex-direction:row;text-align:left;justify-content:flex-start;padding:20px;gap:14px}
  .hx-tile .hx-ta{margin-left:auto}
}
@media (max-width:760px){
  .hx-h2{font-size:26px;white-space:nowrap}
  .hx-card{flex-basis:46%}
  .hx-img{aspect-ratio:1/1}
  .hx-cap{padding:10px 12px 12px}
}

/* round 10: top bar always stays on one row, whatever the phone width */
@media (max-width:1080px){
  .site-hdr .hdr>.logo{flex:0 0 auto}
  .site-hdr .hdr>.logo img{height:44px!important;width:auto!important;max-width:none}
  .phone-btn,.menu-btn{flex-shrink:0}
}
@media (max-width:440px){
  .site-hdr .hdr{gap:10px!important;padding:8px 8px 8px 14px!important}
  .site-hdr .hdr>.logo img{height:38px!important}
  .phone-btn{width:44px!important;height:44px!important;padding:0!important;justify-content:center}
  .phone-btn span{display:none!important}
  .menu-btn{width:44px;height:44px}
}
@media (max-width:340px){
  .site-hdr .hdr>.logo img{height:32px!important}
  .site-hdr .hdr{gap:8px!important}
  .phone-btn,.menu-btn{width:40px!important;height:40px!important}
}
@media (min-width:390px) and (max-width:440px){
  .site-hdr .hdr{gap:8px!important}
  .phone-btn{width:auto!important;padding:0 14px 0 12px!important;gap:6px}
  .phone-btn span{display:inline!important}
}

/* round 11: hero tiles removed; desktop hero copy spans full width */
@media (min-width:1081px){.hx-wrap{grid-template-columns:1fr!important}}

/* round 12: section-header pills keep the arrow beside the text on phones */
@media (max-width:760px){
  .h-sec>div>div:first-child>.h-pill{position:static;padding:6px 6px 6px 20px!important;justify-content:space-between!important;gap:14px;min-height:52px}
  .h-sec>div>div:first-child>.h-pill .h-arr{position:static;margin:0}
}
.hx-city{line-height:1.05}

/* round 13: real project photos, project gallery */
.pcard{font:inherit;color:inherit;text-align:left;background:none;border:0;padding:0;margin:0;cursor:pointer;width:100%}
.pcard:hover{color:#D5001C}
.pcard:focus-visible{outline:2px solid #D5001C;outline-offset:6px}
.onsite{margin-top:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:40px;align-items:center;border-top:1px solid #CBC9C0;padding-top:56px}
.onsite-txt{display:flex;flex-direction:column;gap:20px;max-width:520px}
.onsite-btn{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;width:auto;min-height:48px;padding:0 22px;border-radius:999px;background:#121211;color:#F7F7F4;font-weight:600}
.onsite-btn:hover{background:#D5001C;color:#fff}
.onsite-img{height:clamp(280px,60vw,460px);overflow:hidden;background:#121211;border-radius:20px}
.onsite-img img{width:100%;height:100%;object-fit:cover}
.lb{position:fixed;inset:0;z-index:100;background:rgba(10,10,9,.96);color:#F7F7F4;display:flex;flex-direction:column;opacity:0;transition:opacity .2s}
.lb.on{opacity:1}
.lb-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px}
.lb-t{font:500 12px "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase}
.lb-c{color:#A9A79F;margin-left:12px}
.lb-stage{flex:1;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;padding:0 64px 24px}
.lb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px;user-select:none;-webkit-user-drag:none}
.lb button{font:inherit;color:inherit;cursor:pointer}
.lb-x,.lb-p,.lb-n{width:48px;height:48px;border-radius:50%;border:1px solid rgba(237,234,226,.25);background:rgba(247,247,244,.08);display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lb-x:hover,.lb-p:hover,.lb-n:hover{background:#D5001C;border-color:#D5001C}
.lb-p,.lb-n{position:absolute;top:50%;transform:translateY(-50%)}
.lb-p{left:10px}.lb-n{right:10px}
.lb-one .lb-p,.lb-one .lb-n{display:none}
@media (max-width:760px){
  .lb-stage{padding:0 8px 88px}
  .lb-p,.lb-n{top:auto;bottom:20px;transform:none}
  .lb-p{left:calc(50% - 60px)}.lb-n{right:calc(50% - 60px)}
}
.pcard[id],.onsite{scroll-margin-top:110px}