:root { --ink:#071a26; --copper:#c96e38; --cream:#f4f0e8; --line:rgba(255,255,255,.16); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--cream); font-family:Arial,Helvetica,sans-serif; } a { color:inherit; text-decoration:none; }
.site-header { height:86px; padding:0 clamp(24px,5vw,76px); display:flex; align-items:center; justify-content:space-between; position:absolute; inset:0 0 auto; z-index:5; color:white; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:13px; font-size:18px; letter-spacing:.12em; font-weight:700; }.brand b { color:#ff6500; }.brand img { width:42px; height:42px; object-fit:contain; }
nav { display:flex; align-items:center; gap:34px; font-size:12px; font-weight:700; letter-spacing:.12em; }.nav-cta { border:1px solid rgba(255,255,255,.45); padding:13px 20px; }
.hero { min-height:720px; height:100vh; max-height:940px; position:relative; overflow:hidden; color:white; background:linear-gradient(110deg,#061823 0%,#0a2736 55%,#123849 100%); display:grid; align-items:center; padding:90px clamp(24px,8vw,120px) 30px; }
.hero-grid { position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:84px 84px; mask-image:linear-gradient(90deg,#000,transparent 62%); }
.hero-content { position:relative; z-index:2; max-width:750px; }.eyebrow,.section-tag { color:var(--copper); font-size:11px; letter-spacing:.26em; font-weight:800; margin:0 0 25px; }
h1 { font-size:clamp(54px,7.2vw,106px); line-height:.91; letter-spacing:-.055em; margin:0; font-weight:800; } h1 em { font-family:Georgia,serif; font-weight:400; color:#e4d9ca; }
.hero-copy { max-width:540px; margin:34px 0 0; color:#c4d0d5; font-size:17px; line-height:1.65; }.hero-actions { display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
.button { min-height:54px; padding:0 25px; display:inline-flex; align-items:center; gap:28px; font-size:12px; font-weight:800; letter-spacing:.08em; }.button.primary { background:var(--copper); color:white; }.button.ghost { border:1px solid rgba(255,255,255,.35); }
.hero-structure { position:absolute; right:1.5%; bottom:2%; width:54%; height:82%; opacity:.96; border:1px solid rgba(127,181,200,.22); background:linear-gradient(135deg,rgba(12,47,62,.45),rgba(5,25,36,.05)); overflow:hidden; clip-path:polygon(8% 0,100% 0,100% 92%,92% 100%,0 100%,0 8%); }
.blueprint-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(112,176,198,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(112,176,198,.07) 1px,transparent 1px);background-size:34px 34px}.drawing-title{position:absolute;left:34px;top:24px;z-index:3;display:grid;gap:5px;padding-left:13px;border-left:3px solid #ff6500}.drawing-title b{font-size:10px;letter-spacing:.18em;color:#ff6500}.drawing-title span{font-size:7px;letter-spacing:.22em;color:#9db7c2}
.axis{position:absolute;display:block;z-index:1}.axis:before,.axis:after{content:"";position:absolute;width:7px;height:7px;border:1px solid #ff6500;border-radius:50%;background:#08202c}.axis-v1,.axis-v2{top:10%;bottom:8%;border-left:1px dashed rgba(169,211,224,.22)}.axis-v1{left:28%}.axis-v2{left:73%}.axis-v1:before,.axis-v2:before{left:-4px;top:-5px}.axis-v1:after,.axis-v2:after{left:-4px;bottom:-5px}.axis-h1,.axis-h2{left:7%;right:5%;border-top:1px dashed rgba(169,211,224,.22)}.axis-h1{top:31%}.axis-h2{top:73%}.axis-h1:before,.axis-h2:before{left:-4px;top:-4px}.axis-h1:after,.axis-h2:after{right:-4px;top:-4px}
.beam { position:absolute; display:block; z-index:2; background:linear-gradient(90deg,#173c4b,#285466,#122f3d); box-shadow:0 0 0 1px rgba(185,222,233,.18),8px 8px 0 rgba(0,0,0,.14); }.beam.one { width:42px; height:118%; left:27%; top:-7%; transform:rotate(14deg); }.beam.two { width:34px; height:118%; left:70%; top:-7%; transform:rotate(-10deg); }.beam.three { height:38px; width:112%; left:-7%; top:54%; transform:rotate(-7deg); border-top:4px solid #ff6500; }
.glass { position:absolute; display:block; z-index:1; border:1px solid rgba(145,196,210,.32); background:linear-gradient(135deg,rgba(92,162,185,.2),rgba(255,255,255,.02)); box-shadow:inset 0 0 35px rgba(63,135,160,.09); }.g1 { inset:16% 73% 48% 6%; }.g2 { inset:14% 29% 49% 32%; }.g3 { inset:12% 5% 50% 75%; }.g4{inset:61% 10% 7% 37%}
.dimension{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;color:#92b2bf;font-size:7px;letter-spacing:.12em}.dimension i{display:block;position:relative;background:rgba(154,203,218,.5)}.dim-top{left:11%;right:8%;top:9%}.dim-top i{height:1px;flex:1}.dim-top i:before{content:"";position:absolute;inset:-3px auto auto 0;width:1px;height:7px;background:#ff6500}.dim-top i:last-child:before{left:auto;right:0}.dim-side{right:3%;top:20%;bottom:12%;flex-direction:column}.dim-side i{width:1px;flex:1}.dim-side i:before{content:"";position:absolute;left:-3px;top:0;width:7px;height:1px;background:#ff6500}.dim-side i:last-child:before{top:auto;bottom:0}
.detail-ring{position:absolute;z-index:5;right:16%;top:38%;width:104px;height:104px;border:1px solid #ff6500;border-radius:50%;display:grid;place-content:center;text-align:center;background:rgba(6,24,35,.78);box-shadow:0 0 0 8px rgba(255,101,0,.05)}.detail-ring span{color:#ff6500;font:700 18px Georgia}.detail-ring b{font-size:7px;line-height:1.5;letter-spacing:.15em}.plan-note{position:absolute;z-index:5;display:flex;align-items:center;gap:8px;color:#b3cad3}.plan-note b{width:22px;height:22px;display:grid;place-items:center;border:1px solid #ff6500;border-radius:50%;color:#ff6500;font-size:8px}.plan-note span{font-size:6px;line-height:1.5;letter-spacing:.13em}.note-a{left:8%;bottom:12%}.note-b{right:13%;bottom:11%}.project-code{position:absolute;z-index:5;left:34px;bottom:28px;font-size:6px;letter-spacing:.25em;color:#7395a3}
.scroll-cue { position:absolute; right:6%; bottom:6%; font-size:10px; letter-spacing:.25em; display:flex; align-items:center; gap:16px; writing-mode:vertical-rl; }.scroll-cue span{color:#ff6500;font-size:20px}
.services,.process { padding:120px clamp(24px,7vw,110px); }.services{position:relative;overflow:hidden}.services:before{content:"04";position:absolute;right:-2vw;top:15px;font-size:clamp(180px,24vw,360px);font-weight:900;line-height:1;color:rgba(7,26,38,.025);letter-spacing:-.09em;pointer-events:none}.section-heading{display:grid;grid-template-columns:1.15fr .75fr;gap:80px;align-items:end;margin-bottom:70px;position:relative}.service-intro>p{line-height:1.8;color:#647079;max-width:500px;margin:0 0 30px}.service-intro>div{display:grid;grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:10px 18px;border-top:1px solid #ccc5ba;padding-top:22px}.service-intro b{font-size:32px;color:#ff6500}.service-intro span{font-size:9px;line-height:1.4;letter-spacing:.16em;font-weight:800;color:#69747a}
h2 { margin:0; font-size:clamp(48px,6vw,82px); line-height:.98; letter-spacing:-.04em; }h2 i{font-family:Georgia,serif;font-weight:400;color:var(--copper)}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.service-card{min-height:430px;display:grid;grid-template-columns:.82fr 1.18fr;overflow:hidden;background:#fff;border:1px solid #d2ccc2;transition:transform .3s,box-shadow .3s}.service-card:hover{transform:translateY(-5px);box-shadow:0 24px 50px rgba(7,26,38,.1)}.service-art{position:relative;overflow:hidden;min-height:100%;background:linear-gradient(145deg,#0c2836,#061823)}.service-art:after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,transparent 45%,rgba(255,255,255,.08) 45.3% 46%,transparent 46.3%)}.service-art>span{position:absolute;width:125%;height:18px;left:-12%;top:52%;background:#ff6500;transform:rotate(-17deg);box-shadow:0 120px 0 rgba(255,255,255,.09)}.service-art i{position:absolute;display:block;background:#1b4353;border-left:1px solid rgba(255,255,255,.16);transform:skew(-15deg)}.service-art i:nth-of-type(1){left:18%;top:-10%;width:28px;height:125%}.service-art i:nth-of-type(2){right:20%;top:-5%;width:18px;height:115%;transform:skew(12deg)}.service-art i:nth-of-type(3){left:42%;top:0;width:2px;height:100%;background:rgba(255,255,255,.25)}.service-02 .service-art>span{top:35%;transform:rotate(21deg)}.service-03 .service-art>span{top:68%;transform:rotate(8deg)}.service-04 .service-art>span{top:42%;transform:rotate(-35deg)}
.service-body{padding:34px 34px 30px;display:flex;flex-direction:column}.service-kicker{display:flex;gap:15px;align-items:center;font-size:9px;letter-spacing:.18em;font-weight:800;color:#798086}.service-kicker span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#ff6500;color:white;letter-spacing:0}.service-card h3{font-size:clamp(24px,2vw,31px);line-height:1.05;letter-spacing:-.035em;margin:30px 0 16px}.service-card p{font-size:13px;color:#667179;line-height:1.7;margin:0}.service-card ul{list-style:none;padding:20px 0 0;margin:20px 0;border-top:1px solid #e0dbd2;display:grid;gap:8px}.service-card li{font-size:11px;font-weight:700;color:#34444d}.service-card li:before{content:"+";color:#ff6500;margin-right:9px}.service-card a{margin-top:auto;padding-top:20px;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.14em;font-weight:800}.service-card a b{width:38px;height:38px;display:grid;place-items:center;background:var(--ink);color:white;font-size:15px;transition:.2s}.service-card a:hover b{background:#ff6500}.service-01{background:var(--ink);color:white;border-color:var(--ink)}.service-01 .service-body p,.service-01 .service-kicker{color:#9cafb8}.service-01 .service-body ul{border-color:rgba(255,255,255,.15)}.service-01 .service-body li{color:#d9e0e3}.service-01 .service-body a b{background:#ff6500}
.service-cta{margin-top:18px;background:#ff6500;color:white;min-height:118px;padding:26px 34px;display:flex;align-items:center;justify-content:space-between;gap:30px}.service-cta div{display:grid;gap:7px}.service-cta div span{font-size:10px;letter-spacing:.12em;opacity:.8}.service-cta div b{font-size:20px}.service-cta>a{border:1px solid rgba(255,255,255,.5);padding:17px 20px;display:flex;gap:35px;font-size:10px;letter-spacing:.12em;font-weight:800;white-space:nowrap}
.projects{padding:120px clamp(24px,7vw,110px);background:#071a26;color:white}.projects-heading{display:grid;grid-template-columns:1.2fr .65fr;gap:70px;align-items:end;margin-bottom:65px}.projects-heading>div:last-child{display:grid;grid-template-columns:1fr auto;gap:8px 20px;align-items:end;border-left:1px solid rgba(255,255,255,.17);padding-left:30px}.projects-heading>div:last-child span{font-size:8px;letter-spacing:.2em;color:#ff6500}.projects-heading>div:last-child b{grid-row:1/3;grid-column:2;font:400 62px Georgia;color:#ff6500}.projects-heading>div:last-child p{margin:0;color:#8fa4ad;font-size:13px;line-height:1.7}.project-gallery{display:grid;grid-template-columns:1.12fr .88fr;grid-template-rows:520px 420px 500px;gap:18px}.project{margin:0;position:relative;overflow:hidden;background:#0d2b39}.project-large{grid-row:span 2}.project-wide{grid-column:1/-1}.project img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease,filter .6s ease}.project:hover img{transform:scale(1.025);filter:saturate(1.05)}.project:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(3,16,23,.88) 100%);pointer-events:none}.project figcaption{position:absolute;z-index:2;inset:auto 0 0;padding:30px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.project figcaption>span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:7px;letter-spacing:.22em;color:#ff8a49}.project figcaption div{margin-right:auto}.project h3{font-size:clamp(21px,2.1vw,32px);margin:0 0 9px;letter-spacing:-.025em}.project figcaption b{font-size:7px;letter-spacing:.18em;color:#a9bbc2}.projects-footer{display:flex;align-items:center;justify-content:space-between;gap:40px;padding-top:34px}.projects-footer p{max-width:580px;color:#8fa4ad;font-size:13px;line-height:1.8}.projects-footer a{border:1px solid rgba(255,255,255,.28);padding:17px 20px;display:flex;gap:30px;font-size:8px;letter-spacing:.14em;font-weight:800;white-space:nowrap}.projects-footer a span{color:#ff6500}
.about{display:grid;grid-template-columns:1fr 1fr;background:var(--ink);color:white}.about-visual{min-height:700px;position:relative;overflow:hidden;background:linear-gradient(145deg,#102e3b,#071a26)}.facade-lines{position:absolute;inset:-15%;background-image:linear-gradient(118deg,transparent 0 24%,rgba(255,255,255,.08) 24.2% 25%,transparent 25.2% 48%,rgba(255,255,255,.18) 48.2% 49.5%,transparent 49.7%),linear-gradient(15deg,transparent 0 48%,rgba(255,101,0,.72) 48.2% 49.2%,transparent 49.4%);transform:scale(1.25)}.quality-seal{position:absolute;right:30px;bottom:35px;border:1px solid rgba(255,255,255,.35);border-radius:50%;width:130px;height:130px;display:grid;place-content:center;text-align:center;font-size:9px;line-height:1.7;letter-spacing:.18em;transform:rotate(-8deg)}.quality-seal b{color:#ff6500}.about-copy{padding:100px clamp(38px,7vw,110px);display:flex;flex-direction:column;justify-content:center}.about-copy>p:not(.section-tag){color:#9badb5;line-height:1.85;max-width:590px;margin:34px 0}.values{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.17);padding-top:28px}.values div{display:flex;gap:12px}.values b{color:#ff6500;font-size:11px}.values span{font-size:13px;line-height:1.4}
.process{background:#ece7de}.process>h2{margin-bottom:70px}.process-line{display:grid;grid-template-columns:repeat(4,1fr);position:relative}.process-line:before{content:"";position:absolute;top:18px;left:0;right:0;height:1px;background:#b9b3aa}.process-line div{padding:0 35px 0 0;position:relative}.process-line b{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:white;font-size:10px;position:relative}.process-line div:first-child b{background:#ff6500}.process-line h3{margin:28px 0 12px}.process-line p{color:#6b7479;font-size:14px;line-height:1.7}
.faq{padding:110px clamp(24px,7vw,110px);display:grid;grid-template-columns:.72fr 1.28fr;gap:90px;background:#f4f0e8}.faq-heading>p:last-child{color:#65727a;font-size:14px;line-height:1.8;margin:28px 0 0;max-width:430px}.faq-list{border-top:1px solid #c5bfb5}.faq-list details{border-bottom:1px solid #c5bfb5}.faq-list summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 0;font-size:16px;font-weight:800}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{width:30px;height:30px;display:grid;place-items:center;border:1px solid #a9a39a;color:#ff6500;flex:0 0 auto;transition:transform .2s}.faq-list details[open] summary span{transform:rotate(45deg);background:#ff6500;color:white;border-color:#ff6500}.faq-list details p{margin:0;padding:0 60px 26px 0;color:#647179;font-size:14px;line-height:1.8}.faq-list details p a{color:#d95608;font-weight:800}
.contact{display:grid;grid-template-columns:.85fr 1.15fr;background:#0a2230;color:white}.contact-copy{padding:110px clamp(32px,6vw,90px)}.contact-copy>p:not(.section-tag){color:#93a7b0;line-height:1.8;max-width:540px;margin:30px 0 45px}.contact-details{display:grid;grid-template-columns:1fr 1fr;gap:28px}.contact-details a,.contact-details address{font-style:normal;font-size:15px;line-height:1.55}.contact-details span{display:block;color:#ff6500;font-size:9px;letter-spacing:.18em;margin-bottom:8px}.contact-form{background:#f5f1e9;color:var(--ink);padding:100px clamp(32px,6vw,85px);display:grid;grid-template-columns:1fr 1fr;gap:28px}.contact-form label{font-size:9px;font-weight:800;letter-spacing:.15em}.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;border:0;border-bottom:1px solid #bdb8ae;background:transparent;padding:14px 0;font:15px Arial;color:var(--ink);outline:none;border-radius:0}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#ff6500}.contact-form .full{grid-column:1/-1}.contact-form textarea{resize:vertical}.contact-form button{grid-column:1/-1;border:0;background:#ff6500;color:white;height:58px;padding:0 25px;display:flex;justify-content:space-between;align-items:center;font-weight:800;letter-spacing:.08em;cursor:pointer}.honey{position:absolute!important;left:-9999px!important}.contact-form button:hover,.button.primary:hover{background:#e85800}
footer{background:#061721;color:#aebcc2;display:flex;align-items:center;justify-content:space-between;padding:30px clamp(24px,6vw,90px);font-size:10px;letter-spacing:.1em}footer .brand{color:white}.footer-brand img{width:34px;height:34px}.mobile-call{display:none}
@media (max-width:1100px){nav{gap:20px}.service-grid{grid-template-columns:1fr}.service-card{grid-template-columns:.7fr 1.3fr}.projects-heading{grid-template-columns:1fr}.project-gallery{grid-template-rows:430px 340px 420px}.about{grid-template-columns:1fr}.about-visual{min-height:440px}.faq{grid-template-columns:1fr;gap:55px}.contact{grid-template-columns:1fr}.process-line{grid-template-columns:1fr 1fr;gap:45px 0}.section-heading{grid-template-columns:1fr;gap:28px}.hero-structure{width:65%;opacity:.45}}
@media (max-width:700px){nav a:not(.nav-cta){display:none}.site-header{height:74px}.brand span{font-size:14px}.brand img{width:34px;height:34px}.nav-cta{padding:10px 13px}.hero{min-height:720px;padding-top:100px}.hero-structure{width:88%;height:65%;right:-28%;bottom:4%;opacity:.3}.drawing-title,.dimension,.plan-note,.project-code{display:none}.detail-ring{right:18%;top:38%;transform:scale(.72)}.hero-copy{font-size:15px}h1{font-size:51px}.button{width:100%;justify-content:space-between}.scroll-cue{display:none}.services,.process,.projects,.faq{padding:80px 22px}.service-grid{grid-template-columns:1fr}.service-card{min-height:580px;grid-template-columns:1fr;grid-template-rows:180px 1fr}.service-body{padding:27px 24px}.service-card h3{margin-top:22px}.service-cta{align-items:flex-start;flex-direction:column;padding:26px 24px}.service-cta>a{width:100%;justify-content:space-between}.service-intro>div{grid-template-columns:auto 1fr auto 1fr}.projects-heading>div:last-child{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.17);padding-top:22px}.project-gallery{grid-template-columns:1fr;grid-template-rows:none}.project,.project-large,.project-wide{grid-column:auto;grid-row:auto;height:360px}.project figcaption{padding:22px}.projects-footer{align-items:flex-start;flex-direction:column}.projects-footer a{width:100%;justify-content:space-between;white-space:normal}.about-copy{padding:80px 24px}.about-visual{min-height:360px}.values{gap:12px}.values div{display:block}.values b{display:block;margin-bottom:8px}.process-line{grid-template-columns:1fr}.process-line:before{display:none}.faq-list summary{font-size:14px}.faq-list details p{padding-right:0}.contact-copy,.contact-form{padding:75px 24px}.contact-details,.contact-form{grid-template-columns:1fr}.contact-form .full,.contact-form button{grid-column:auto}footer{align-items:flex-start;gap:22px;flex-direction:column}.mobile-call{display:grid;place-items:center;position:fixed;z-index:10;right:18px;bottom:18px;width:52px;height:52px;border-radius:50%;background:#ff6500;color:white;font-size:22px;box-shadow:0 8px 24px rgba(0,0,0,.3)}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.service-card{transition:none}}