@charset "UTF-8";
:root{--ink:#12343f;--deep:#073c4b;--accent:#057e88;--light:#c2e9e8;--wash:#f0f5f6;--line:#cfdbde;--muted:#546b72}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:108px}body{margin:0;color:var(--ink);font:400 16px/1.95 "Yu Gothic",Meiryo,sans-serif;background:white}a{color:inherit;text-decoration:none}h1,h2,h3,p,figure{margin:0}a:focus-visible,summary:focus-visible{outline:3px solid #d28015;outline-offset:5px}.wrap{width:min(1200px,calc(100% - 72px));margin-inline:auto}.skip{position:fixed;top:-100px;left:16px;background:white;z-index:100;padding:15px}.skip:focus{top:12px}.demo-bar{padding:9px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#edf2f8;color:#213d58;font-size:12px}.demo-bar a{display:flex;gap:10px;align-items:center}.demo-bar img{object-fit:contain;background:transparent}.demo-bar a span{margin-left:10px;border-left:1px solid #b8c6d9;padding-left:12px}.sample-header{background:#fff;position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:94px}.sample-brand{font-size:26px;line-height:1.5;font-weight:700;letter-spacing:.025em}.sample-brand small{display:block;font:500 12px Arial,sans-serif;letter-spacing:.14em;margin-top:4px}.nav nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:700}.nav-cta{border:1px solid var(--ink);padding:13px 20px}.sample-hero{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:var(--deep)}.hero-photo{position:absolute;inset:0;z-index:-2}.editable-photo{display:block;width:100%;max-width:100%;height:auto;object-fit:cover}.hero-photo img{height:100%;object-fit:cover}.sample-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#031820e8,#03182095 50%,#03182018);z-index:-1}.hero-content{padding-block:88px 75px}.eyebrow{font:600 12px/1.6 Arial,sans-serif;letter-spacing:.18em;color:var(--accent);margin-bottom:22px}.sample-hero .eyebrow{color:var(--light)}h1{font-size:clamp(34px,4.8vw,68px);line-height:1.6;letter-spacing:.045em}.hero-copy{max-width:580px;margin-top:25px;font-size:18px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:44px;padding:17px 25px;min-height:62px;background:white;color:var(--deep);font-weight:700;font-size:15px;transition:background .2s}.button:hover{background:var(--light)}.button span{font-size:24px;font-weight:400}.sample-hero .button{margin-top:32px}.hero-bottom{border-top:1px solid #ffffff66;display:flex;align-items:center;justify-content:space-between;padding-block:22px;font-size:13px}.hero-bottom a{font:500 12px Arial,sans-serif;letter-spacing:.14em}.section{padding-block:100px}h2{font-size:clamp(28px,3.2vw,43px);line-height:1.7;letter-spacing:.03em}h3{font-size:22px;line-height:1.6}.introduction{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px}.introduction figure img{aspect-ratio:5/4}.introduction figcaption{font-size:12px;color:var(--muted);margin-top:10px}.body-copy{margin-top:25px;color:var(--muted)}.fine{font-size:12px;color:var(--muted);margin-top:22px}.services{background:var(--wash)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:43px}.section-heading>p{color:var(--muted);font-size:16px}.service-list{border-top:1px solid var(--line)}.service-list details{border-bottom:1px solid var(--line)}.service-list summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:65px 1fr 25px;gap:20px;align-items:center;padding:29px 0}.service-list summary::-webkit-details-marker{display:none}.service-no{font:400 25px Arial;color:var(--accent)}.toggle{font:400 26px Arial;transition:transform .2s}details[open] .toggle{transform:rotate(45deg)}.service-list details>p{padding:0 50px 28px 85px;max-width:900px;color:var(--muted)}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.gallery-grid img{aspect-ratio:4/3}.gallery-grid figcaption{font-size:18px;font-weight:700;line-height:1.7;margin-top:17px}.gallery-grid figcaption>span{font:500 13px Arial;color:var(--accent);margin-right:15px}.gallery-grid small{display:block;font-size:12px;font-weight:400;color:var(--muted);margin-top:8px}.process{background:var(--deep);color:white}.process .eyebrow{color:var(--light)}.process-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:75px}.process-grid>div>p:last-child{margin-top:24px;color:#d9e3e7}.process ol{padding:0;margin:0;list-style:none}.process li{border-top:1px solid #ffffff4a;padding-block:25px;display:flex;gap:25px}.process li>span{font:500 16px Arial;color:var(--light);padding-top:9px}.process h3{font-size:20px;margin-bottom:7px}.process li p{color:#d9e3e7}.company-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:65px}.company dl{margin:0}.company dl>div{display:grid;grid-template-columns:110px 1fr;gap:25px;padding:22px 0;border-bottom:1px solid var(--line)}.company dl>div:first-child{border-top:1px solid var(--line)}.company dt{font-weight:700;font-size:14px}.company dd{margin:0;color:var(--muted);font-size:15px}.sample-contact{background:var(--accent);color:white}.sample-contact .eyebrow,.sample-contact .fine{color:#fff}.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:55px;align-items:center}.contact-grid h2{font-size:34px}.contact-grid p:not(.eyebrow){margin-top:18px}.contact-grid>div:last-child{justify-self:end}.sample-footer{padding-block:38px;display:flex;flex-wrap:wrap;gap:22px;justify-content:space-between;align-items:center}.sample-footer>a:nth-child(2){font-size:14px}.sample-footer>p{width:100%;padding-top:20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.admin-bar .sample-header{top:32px}
/* Metal: a restrained, dark manufacturing identity. */
.design-industrial{--ink:#182736;--deep:#101d2c;--accent:#1558ba;--light:#accfff;--wash:#f0f3f7}.design-industrial .sample-brand{letter-spacing:.07em}.design-industrial .sample-hero{border-bottom:7px solid #2770c4}.design-industrial .gallery-grid{grid-template-columns:1.4fr 1fr 1fr}.design-industrial .gallery-grid img{aspect-ratio:1/1}.design-industrial .hero-content{padding-block:104px 85px}
/* Scaffolding: compact, bold, construction-led composition. */
.design-bold{--ink:#142339;--deep:#101d30;--accent:#bc4618;--light:#ffd6b9;--wash:#f3f4f6}.design-bold .sample-hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center}.design-bold .hero-photo{position:relative;grid-column:2;grid-row:1;height:680px;z-index:0}.design-bold .sample-hero:before{display:none}.design-bold .hero-content{grid-column:1;grid-row:1;width:auto;padding:60px 55px;margin:0}.design-bold h1{font-size:clamp(34px,4.2vw,62px);line-height:1.6}.design-bold .hero-bottom{grid-column:1/-1;width:100%;padding-inline:55px;background:#bc4618}.design-bold .introduction{grid-template-columns:1fr 1.2fr}.design-bold .service-list summary{padding-block:34px}.design-bold .service-no{font-size:38px;font-weight:700}.design-bold .gallery-grid{gap:12px}.design-bold .sample-contact{background:var(--deep)}
/* Homes: calm editorial typography with a full-width photograph. */
.design-editorial{--ink:#283831;--deep:#24392f;--accent:#477655;--light:#e0ecdf;--wash:#f2f5f1}.design-editorial h1,.design-editorial h2,.design-editorial .sample-brand{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:600}.design-editorial .sample-hero{display:flex;flex-direction:column;background:white;color:var(--ink)}.design-editorial .sample-hero:before{display:none}.design-editorial .hero-content{order:0;text-align:center;padding-block:64px 48px}.design-editorial .hero-copy{margin-inline:auto}.design-editorial .sample-hero .eyebrow{color:var(--accent)}.design-editorial .sample-hero .button{background:var(--deep);color:white}.design-editorial .hero-photo{position:relative;order:1;z-index:0;height:580px;margin-inline:36px}.design-editorial .hero-bottom{order:2;color:var(--muted);border-color:var(--line)}.design-editorial .introduction figure img{aspect-ratio:4/5}.design-editorial .gallery-grid{grid-template-columns:1.3fr 1fr;align-items:start}.design-editorial .gallery-grid figure:first-child{grid-row:span 2}.design-editorial .gallery-grid figure:first-child img{aspect-ratio:3/4}.design-editorial .gallery-grid figure:not(:first-child) img{aspect-ratio:2/1}.design-editorial .process{background:var(--wash);color:var(--ink)}.design-editorial .process .eyebrow,.design-editorial .process li>span{color:var(--accent)}.design-editorial .process li{border-color:var(--line)}.design-editorial .process p,.design-editorial .process li p{color:var(--muted)}
/* Electrical: a precise split view with a compact service grid. */
.design-grid{--ink:#102e44;--deep:#07273d;--accent:#066a9a;--light:#a2e4fa;--wash:#edf5fa}.design-grid .sample-hero .hero-photo{left:45%}.design-grid .sample-hero:before{background:linear-gradient(90deg,#07273d 38%,#07273dda 50%,#07273d10 80%)}.design-grid .hero-content{padding-block:90px}.design-grid .hero-copy{max-width:450px}.design-grid .service-list{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;border:0}.design-grid .service-list details{border:1px solid var(--line);background:white;padding:24px;align-self:start}.design-grid .service-list summary{grid-template-columns:1fr 25px;padding:0;gap:18px}.design-grid .service-no{grid-column:1/-1}.design-grid .service-list h3{font-size:20px}.design-grid .service-list details>p{padding:22px 0 0}.design-grid .gallery-grid figure:nth-child(2){margin-top:50px}
/* Landscape: asymmetrical photography, generous space and a forest palette. */
.design-landscape{--ink:#253f35;--deep:#1b3b2b;--accent:#356543;--light:#e0ebca;--wash:#f3f6f0}.design-landscape h1,.design-landscape h2,.design-landscape .sample-brand{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:600}.design-landscape .sample-hero{min-height:720px;display:grid;align-items:center}.design-landscape .hero-photo{left:38%;top:35px;bottom:35px;right:35px}.design-landscape .sample-hero:before{background:linear-gradient(90deg,#1b3b2b 18%,#1b3b2bd9 43%,transparent 75%)}.design-landscape .hero-content{padding-block:80px}.design-landscape .hero-copy{max-width:420px}.design-landscape .hero-bottom{position:relative}.design-landscape .introduction{padding-block:120px;grid-template-columns:1fr 1.15fr}.design-landscape .introduction figure img{aspect-ratio:1/1}.design-landscape .gallery-grid{grid-template-columns:1fr 1.2fr 1fr;align-items:center}.design-landscape .gallery-grid img{aspect-ratio:3/4}.design-landscape .gallery-grid figure:nth-child(2) img{aspect-ratio:3/5}
@media(max-width:1000px){.wrap{width:calc(100% - 48px)}.nav nav>a:not(.nav-cta){display:none}.demo-bar p{display:none}.introduction,.company-grid,.process-grid{gap:40px}.section-heading{display:block}.section-heading>p{margin-top:22px}.hero-copy{font-size:16px}.contact-grid{gap:25px}.button{gap:20px}.design-bold .hero-content{padding-inline:28px}.design-grid .service-list{gap:12px}.design-grid .service-list details{padding:18px}.gallery-grid{gap:18px}.contact-grid h2{font-size:30px}}
@media(max-width:782px){.admin-bar .sample-header{top:46px}}
@media(max-width:700px){html{scroll-padding-top:85px}.wrap{width:calc(100% - 36px)}.nav{min-height:80px;gap:12px}.sample-brand{font-size:22px}.sample-brand small{font-size:12px;letter-spacing:.05em}.nav-cta{font-size:12px;padding:10px}.demo-bar{padding:8px 18px}.demo-bar a{gap:6px;font-size:12px}.demo-bar a span{padding-left:8px;margin-left:4px}.hero-content,.design-industrial .hero-content,.design-grid .hero-content{padding-block:52px 48px}h1,.design-bold h1{font-size:clamp(30px,8.5vw,46px);line-height:1.6;letter-spacing:.025em}.hero-copy{max-width:none;margin-top:24px}.hero-bottom{font-size:12px;padding-block:18px}.hero-bottom a{display:none}.button{font-size:14px;padding:15px 20px;min-height:58px}.section{padding-block:62px}h2{font-size:28px}.introduction,.design-bold .introduction,.design-landscape .introduction,.company-grid,.process-grid,.contact-grid{grid-template-columns:1fr;gap:30px}.introduction figure img{aspect-ratio:4/3}.section-heading{margin-bottom:30px}.service-list summary{grid-template-columns:36px 1fr 20px;gap:15px;padding-block:24px}.service-list h3{font-size:21px}.service-list details>p{padding:0 0 25px 51px}.gallery-grid,.design-industrial .gallery-grid,.design-landscape .gallery-grid,.design-editorial .gallery-grid{grid-template-columns:1fr;gap:28px}.gallery-grid img,.design-industrial .gallery-grid img,.design-landscape .gallery-grid img,.design-landscape .gallery-grid figure:nth-child(2) img,.design-editorial .gallery-grid figure:first-child img,.design-editorial .gallery-grid figure:not(:first-child) img{aspect-ratio:4/3}.gallery-grid figcaption{font-size:18px}.process li{gap:20px}.company dl>div{grid-template-columns:88px 1fr;gap:18px}.contact-grid>div:last-child{justify-self:stretch}.contact-grid .button{display:flex}.sample-footer{align-items:flex-start;flex-direction:column}.design-bold .sample-hero{display:flex;flex-direction:column;align-items:stretch}.design-bold .hero-content{order:0;padding:48px 18px}.design-bold .hero-photo{order:1;height:330px}.design-bold .hero-bottom{order:2;padding-inline:18px}.design-bold .service-no{font-size:28px}.design-editorial .hero-content{padding-block:46px 32px}.design-editorial .hero-photo{height:330px;margin-inline:18px}.design-editorial .introduction figure img{aspect-ratio:4/3}.design-grid .service-list{grid-template-columns:1fr}.design-grid .service-list details{padding:24px}.design-grid .service-list summary{grid-template-columns:35px 1fr 25px}.design-grid .service-no{grid-column:auto}.design-grid .gallery-grid figure:nth-child(2){margin:0}.design-grid .sample-hero .hero-photo{left:0}.design-grid .sample-hero:before{background:#07273dbb}.design-landscape .sample-hero{min-height:660px}.design-landscape .hero-photo{inset:0}.design-landscape .sample-hero:before{background:#1b3b2ba8}.design-landscape .hero-content{padding-block:54px}.design-landscape .introduction{padding-block:62px}}
@media(max-width:600px){.admin-bar .sample-header{top:0}}
@media(max-width:360px){.demo-bar a span{display:none}.nav{flex-wrap:wrap;padding-block:12px}.nav-cta{padding:8px}.sample-brand{font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
h1{text-wrap:balance}
@media(max-width:700px){.design-landscape h1,.design-editorial h1{font-size:clamp(26px,7.1vw,36px)}}
