:root{--ink:#123c68;--text:#344c63;--muted:#5b6e82;--paper:#fff;--warm:#f0f4f8;--sand:#e0e9f2;--line:#d3dfeb;--copper:#145aa6;--light-copper:#bbd6f2}
::selection{background:#c6dff6;color:#123c68}
.button:hover{background:#0b477e;border-color:#0b477e}
.site-header{height:116px}
.brand{gap:16px}
.brand img{width:84px;height:84px;object-fit:contain}
.brand strong{font-size:37px;font-weight:600;letter-spacing:.035em;color:#145aa6}
.brand small{font-size:15px;letter-spacing:.24em;margin-top:7px;color:#145aa6}
.site-header .brand>span{flex-direction:row;align-items:baseline;gap:12px;white-space:nowrap}
.site-header .brand strong,.site-header .brand small{font-family:var(--heading);font-size:clamp(40px,4vw,60px);font-weight:600;letter-spacing:.025em;line-height:1;margin-top:0}
#site-nav{font-size:16px;gap:25px}
#site-nav .button{font-size:15px;padding-inline:17px;gap:19px}
.hero{padding:36px 0 42px}
.hero-grid{grid-template-columns:.86fr 1.24fr;gap:54px}
.hero h1{font-size:clamp(64px,5.7vw,82px);line-height:1.01}
.hero-description{max-width:40ch}
.hero-figure{align-self:center;display:block}
.hero-figure>a{height:auto;aspect-ratio:2.1788;min-height:0;display:block;overflow:hidden}
.hero-figure img{object-fit:cover;object-position:50% 50%!important}
.hero-figure figcaption{padding:18px 21px;background:white}
.hero-figure figcaption strong{font-size:18px}
.hero-caption-detail{display:block}
.housing-project-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:start}
.housing-project-grid .project-card:nth-child(2){margin-top:96px}
.housing-project-grid .project-cover{aspect-ratio:1.46}
.housing-project-grid .project-cover img{object-position:50% 48%}
.housing-project-grid .project-info h3{font-size:39px}
.housing-project-grid .project-scope{font-size:17px}
.selected-section .early-work-preview{margin-top:68px}
.wider-portfolio{padding-top:0}
.wider-portfolio .selected-grid{row-gap:45px}
.project-index .housing-index{margin-top:30px;margin-bottom:75px}
.housing-index .project-grid{margin-top:30px}
.project-index .archive-register{margin-top:70px}
.project-index .project-index-feature{margin-top:70px}
.project-hero-wide img{height:auto!important;max-height:none!important;object-fit:contain;aspect-ratio:2.1788}
.project-hero-contain img{object-fit:contain!important;background:#eef3f7;max-height:650px}
.project-scale{background:var(--warm);border-left:4px solid var(--copper);padding:25px 29px;margin-bottom:34px}
.project-scale strong{font-family:var(--heading);font-size:64px;line-height:1;display:block;color:var(--ink);font-weight:500}
.project-scale p{font-size:18px;margin-top:11px;color:var(--ink)}
.project-scale small{display:block;color:var(--muted);font-size:14px;margin-top:9px}
.project-overview h2{max-width:24ch;margin-bottom:26px}
.project-hero-contain>a{background:#eef3f7}
.project-hero-contain .gallery-open-label{right:auto;left:18px}
.project-gallery-single .gallery-grid{grid-template-columns:minmax(0,1fr);max-width:800px}
.project-gallery-single .gallery-item>a{aspect-ratio:1}
.project-gallery-single .gallery-item img{object-fit:contain;aspect-ratio:1}
.project-gallery-single .image-arrow{right:auto;left:16px}
.company-wide-photo img{height:auto;aspect-ratio:2.1788;object-position:50% 50%!important}
.company-preview figure img{object-fit:cover;object-position:50% 45%;aspect-ratio:1.22}
#civil .service-detail-image{aspect-ratio:2.1788;align-self:start}
#civil .service-detail-image img{height:auto;aspect-ratio:2.1788;object-fit:contain}
.contact-band{color:#e0ebf5}
.site-footer{background:#f5f8fb}
.maintenance-row:before{background:var(--line)}
.service-row:first-child{border-color:var(--line)}
dialog{background:#102d4a}
dialog::backdrop{background:#071729eb}
.gallery-stage>button:hover,.gallery-toolbar>button:hover{background:#1d527f}
dialog :focus-visible,.contact-band :focus-visible{outline-color:#c5e0ff}
.footer-main .brand img{width:72px;height:72px}
.footer-main .brand strong{font-size:33px}
.footer-main .brand small{font-size:13px}
@media(max-width:1150px) and (min-width:1051px){.brand img{width:74px;height:74px}.brand strong{font-size:32px}.brand small{font-size:13px}.brand{gap:12px}#site-nav{gap:18px;font-size:15px}.hero-grid{gap:35px}.hero h1{font-size:68px}}
@media(min-width:1051px) and (max-width:1279px){.site-header .brand>span{flex-direction:column;align-items:flex-start;gap:3px}.site-header .brand strong{font-size:40px}.site-header .brand small{font-size:35px}}
@media(max-width:1050px){
  .site-header{height:104px}
  .brand img{width:74px;height:74px}.brand strong{font-size:33px}.brand small{font-size:13px}.brand{gap:13px}
  .site-header .brand strong,.site-header .brand small{font-size:clamp(28px,4vw,40px)}
  .menu-toggle{display:flex!important;align-items:center;gap:12px;background:white;border:1px solid var(--line);font-size:14px;min-height:44px;padding:10px 13px}
  .menu-lines{display:block;width:20px;height:12px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
  #site-nav{position:absolute;display:none;top:100%;left:0;right:0;background:white;padding:18px var(--gutter) 28px;border-bottom:2px solid var(--ink);box-shadow:none;font-size:21px;align-items:stretch;gap:3px}
  .js #site-nav.is-open{display:flex;flex-direction:column}
  #site-nav>a:not(.button){padding-block:9px;min-height:48px}
  #site-nav>.button{margin-top:18px;justify-content:space-between}
  #site-nav>.mobile-phone{display:flex!important;font-size:18px;margin-top:7px}
  html:not(.js) .site-header{height:auto}
  html:not(.js) .header-inner{padding-block:18px;flex-wrap:wrap}
  html:not(.js) #site-nav{display:flex;position:static;width:100%;padding:10px 0 0;box-shadow:none;border:0;flex-wrap:wrap;gap:10px 24px}
  html:not(.js) .menu-toggle{display:none!important}
  .hero-grid{gap:32px;grid-template-columns:.9fr 1.15fr}
  .hero h1{font-size:60px}
  .hero-description{font-size:17px}
  .hero-figure figcaption strong{font-size:16px}.hero-caption-detail{display:none}
  .housing-project-grid{gap:32px}.housing-project-grid .project-info h3{font-size:33px}
}
@media(max-width:700px){
  .site-header{height:98px}
  .header-inner{gap:12px}
  .brand img{width:66px;height:66px}.brand{gap:11px}.brand strong{font-size:30px}.brand small{font-size:12px;letter-spacing:.23em;margin-top:6px}
  .site-header .brand>span{flex-direction:column;align-items:flex-start;gap:3px}
  .site-header .brand strong{font-size:30px}
  .site-header .brand small{font-size:28px;letter-spacing:.01em}
  .menu-toggle{min-width:44px;width:44px;height:44px;padding:10px;justify-content:center}
  .menu-toggle [data-menu-label]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  #site-nav{font-size:20px}
  .hero{padding-top:26px;padding-bottom:27px}
  .hero-grid{display:block}
  .hero h1{font-size:56px;max-width:12ch}
  .hero-copy{padding-bottom:28px}
  .hero-copy .eyebrow{font-size:11px}
  .hero-description{font-size:17px;line-height:1.55}
  .hero-actions{gap:12px;flex-direction:row;align-items:center;flex-wrap:wrap}
  .hero-actions .button{font-size:14px;padding-inline:14px;gap:14px}
  .hero-actions .text-link{font-size:14px;gap:10px}
  .hero-figure>a{height:auto;aspect-ratio:2.1788;min-height:0}
  .hero-figure figcaption{padding:15px 16px}
  .hero-figure figcaption strong{font-size:16px}
  .hero-figure img{object-position:50% 50%!important}
  .housing-project-grid{grid-template-columns:1fr;gap:34px}
  .housing-project-grid .project-card:nth-child(2){margin-top:0}
  .housing-project-grid .project-cover{aspect-ratio:1.45}
  .housing-project-grid .project-info h3{font-size:33px}
  .housing-project-grid .project-scope{font-size:16px}
  .selected-section .early-work-preview{margin-top:44px}
  .wider-portfolio{padding-top:0}
  .housing-index .project-grid{margin-top:25px}
  .project-index .housing-index{margin-bottom:45px}
  .project-index .archive-register,.project-index .project-index-feature{margin-top:45px}
  .project-hero-wide img{height:auto!important;max-height:none!important}
  .project-hero-contain img{height:auto!important;max-height:520px!important}
  .project-scale{padding:21px 23px;margin-bottom:27px}.project-scale strong{font-size:58px}.project-scale p{font-size:17px}
  .company-wide-photo img{height:auto;aspect-ratio:2.1788}
  .footer-main .brand img{width:66px;height:66px}.footer-main .brand strong{font-size:30px}.footer-main .brand small{font-size:12px}
}
@media(max-width:360px){.brand img{width:59px;height:59px}.brand strong{font-size:27px}.brand small{font-size:11px}.brand{gap:9px}.hero h1{font-size:51px}}
@media(max-width:360px){.site-header .brand strong{font-size:27px}.site-header .brand small{font-size:25px}}
