@font-face{font-family:Sora;src:url('/assets/sora-variable.ttf') format('truetype');font-style:normal;font-weight:100 800;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/manrope-medium.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/manrope-semibold.ttf') format('truetype');font-style:normal;font-weight:600 800;font-display:swap}

:root{--paper:#f0ede5;--ink:#202d28;--muted:#5b655e;--accent:#c9633a;--olive:#233b30;--line:#c8cdc2}
body{font-size:16px;font-weight:500}
h1,h2,h3,.brand,.footer-brand{font-family:Sora,Arial,sans-serif}
h1,h2,h3{font-weight:650;letter-spacing:-.055em}
em{font-family:inherit;font-style:normal;font-weight:inherit;color:var(--accent)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline-width:3px}
.section-pad{padding:90px var(--gutter)}
.section-label{font-size:11px;letter-spacing:.12em;font-weight:700;gap:13px}
.tiny-cross{display:grid;place-items:center;width:28px;height:28px;font-size:23px;background:var(--accent);color:var(--paper)}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em}
.header{padding-top:24px;padding-bottom:24px;background:linear-gradient(#132d2780,#132d271a)}
.brand>span{font-size:17px;font-weight:700;letter-spacing:.015em}
.brand small{font-family:Manrope,sans-serif;font-size:8px;letter-spacing:.15em;font-weight:600}
.brand svg{width:43px;height:43px;stroke-width:1.8}
.nav{gap:27px;font-size:13px;font-weight:600}
.nav .nav-contact{background:var(--accent);border:0;padding:13px 18px;font-weight:700}
.nav .nav-contact:after{display:none}
.hero-topline{font-size:10px;font-weight:700;letter-spacing:.15em}
.hero-copy{bottom:156px;max-width:650px}
.hero-copy .eyebrow{font-size:11px;padding:7px 11px;background:#122d2799;border-left:3px solid #e29568;width:max-content}
.hero h1{font-size:clamp(59px,6.25vw,96px);font-weight:750;line-height:1.02;letter-spacing:-.065em;margin:20px 0 24px;text-transform:uppercase}
.hero h1 em{font-size:1em;line-height:inherit;letter-spacing:inherit;color:#eea475}
.hero-copy>p:not(.eyebrow){font-size:16px;line-height:1.65;max-width:410px}
.button{font-size:14px;font-weight:700;gap:40px;padding:16px 24px}
.button-light{background:var(--accent);color:#fff}
.button-light:hover{background:#df7f54}
.hero-bottom{padding-top:18px;bottom:25px}
.scroll-link{font-size:10px;font-weight:700;letter-spacing:.09em}
.hero-caption{font-size:9px;font-weight:600}
.hero-playback{gap:20px}
.hero-playback button{font-size:11px;padding:7px 0}
.hero-scene-label{font-size:10px;background:#213c31ad;padding:10px 14px;backdrop-filter:blur(6px);border-left:2px solid #eea475}

/* Studio: image, plan drawing and a strong typographic rhythm. */
.intro{background:#1d322b;color:var(--paper);position:relative;overflow:hidden}
.intro:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.12;background-image:linear-gradient(90deg,#a9b9a14d 1px,transparent 1px);background-size:20% 100%}
.intro>*{position:relative}
.studio-grid{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;margin-top:42px}
.studio-copy{max-width:540px}
.intro h2{font-size:clamp(36px,3.4vw,56px);line-height:1.16;font-weight:650;letter-spacing:-.05em}
.intro h2 em{font-size:1em;color:#e69464}
.studio-copy p{font-size:15px;line-height:1.85;color:#bbc6bc;max-width:440px;margin-top:20px}
.studio-copy .studio-lead{font-size:18px;line-height:1.7;color:#f0ede5;margin-top:28px}
.text-link{font-size:14px;font-weight:700;padding:12px 0;gap:35px;border-bottom-color:#97a28f}
.studio-visual{position:relative;min-width:0;margin:0 0 40px}
.studio-visual>img{width:100%;height:460px;object-fit:cover;object-position:55% center;filter:saturate(.85)}
.studio-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#13291ed9,transparent 60%);pointer-events:none}
.studio-visual figcaption{position:absolute;z-index:1;left:26px;top:25px;text-shadow:0 1px 12px #0e241eb3}
.studio-visual figcaption>span{font-size:10px;font-weight:700;letter-spacing:.13em;display:block;margin-bottom:12px}
.studio-visual figcaption>strong{font:600 22px/1.3 Sora,sans-serif;letter-spacing:-.04em}
.blueprint-card{position:absolute;z-index:2;width:66%;right:-22px;bottom:-40px;background:var(--paper);color:#334f40;padding:15px;box-shadow:0 18px 36px #071b1826;transform:rotate(-3deg)}
.blueprint-card>svg{display:block;width:100%;height:auto}
.blueprint-card>span{display:flex;justify-content:space-between;font-size:8px;font-weight:700;letter-spacing:.07em;border-top:1px solid #87977d55;padding-top:10px}
.blueprint-card i{font-style:normal;color:var(--accent)}
.visual-corner{position:absolute;z-index:3;bottom:18px;left:22px;color:#e49a70;font-size:42px;line-height:1}
.discipline-row{border-color:#9dad982e;margin-top:65px;padding-top:25px;gap:4vw;justify-content:space-between}
.discipline-row>span{font-family:Sora,sans-serif;font-size:clamp(18px,1.9vw,29px);font-weight:600;display:flex;align-items:center;gap:15px;letter-spacing:-.04em}
.discipline-row small{font:600 10px Manrope,sans-serif;color:#d78a60;align-self:flex-start;padding-top:7px}
.discipline-row i{font-size:26px;color:#cf8156;font-style:normal}

/* The restored 3D model remains the centre of the experience. */
.experience-sticky:before{content:'02';position:absolute;left:3vw;top:3%;font:750 290px/.9 Sora,sans-serif;color:#65795a0a;letter-spacing:-.08em;pointer-events:none}
.experience-top .section-label{font-size:11px}
.concept-tag{font-size:10px;background:#f3f0e9c9;padding:10px 13px}
.scene-copy{top:29%;max-width:360px}
.scene-copy .eyebrow{font-size:11px;color:var(--accent);margin-bottom:18px}
.scene-copy h2{font-size:clamp(34px,3.1vw,52px);line-height:1.15;font-weight:650;letter-spacing:-.05em}
.scene-copy h2 em{font-size:1em}
.scene-copy>p:last-child{font-size:14px;line-height:1.8;max-width:300px;margin-top:22px}
.scene-annotation{font-size:10px;padding:9px 12px;background:#f4f0e9b3;right:5%}
.scene-controls{gap:8px}
.phase{padding:15px 17px;min-width:132px;border:1px solid #aeb6a5;background:#f0ede5a6;font-size:12px;font-weight:700;color:#53614c}
.phase span{font-size:10px;margin-right:7px}
.phase.active{border:1px solid var(--accent);background:var(--accent);color:white}
.scene-hint{font-size:11px}
.motion-toggle{font-size:11px}
.scene-progress{height:4px}.scene-progress>span{background:var(--accent)}

/* Services: a construction photograph beside illustrated, readable chapters. */
.services{background:var(--paper)}
.section-heading{grid-template-columns:1.5fr 1fr;gap:20px 70px;align-items:end;margin-bottom:45px}
.section-heading .section-label{grid-column:1/-1;padding:0;margin-bottom:10px}
.section-heading h2{font-size:clamp(34px,3.3vw,52px);line-height:1.16}
.section-heading h2 em{font-size:1em}
.section-heading>p{max-width:410px;font-size:16px;line-height:1.75;padding:0;padding-left:40px;margin-left:auto}
.services-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:5vw;align-items:start}
.services-poster{margin:0;position:relative;height:600px;background:#354b3d;overflow:hidden}
.services-poster>img{width:100%;height:100%;object-fit:cover;object-position:48% center;filter:saturate(.7)}
.services-poster:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#193126ed,transparent 75%)}
.services-poster figcaption{position:absolute;z-index:1;bottom:30px;left:27px;right:20px;color:white}
.services-poster figcaption>span{font-size:10px;letter-spacing:.13em;font-weight:700}
.services-poster figcaption>strong{display:block;font:650 32px/1.18 Sora,sans-serif;letter-spacing:-.05em;margin-top:14px}
.poster-graphic{position:absolute;top:22px;left:22px;width:85px;color:#f6e6d2;padding:12px;background:#19382e80;z-index:1;border:1px solid #ffffff44}
.poster-graphic svg{display:block}
.service{border-top:1px solid #bfc7b8}
.service:last-child{border-bottom:1px solid #bfc7b8}
.service summary{padding:25px 0;gap:17px;position:relative}
.service-number{width:25px;font:600 11px Sora,sans-serif;color:var(--accent);flex-shrink:0}
.service-icon{width:44px;min-width:44px;height:44px;color:#5b735a}
.service-icon svg{width:100%;height:100%;display:block}
.service h3{font-size:clamp(19px,1.7vw,26px);font-weight:600;line-height:1.25;letter-spacing:-.04em;max-width:350px}
.service-symbol{width:34px;height:34px;background:#e1e5d9;border:0}
.service-symbol:before,.service-symbol:after{left:11px;top:16px;width:12px}
.service[open] .service-symbol{background:var(--accent)}
.service[open] .service-symbol:before,.service[open] .service-symbol:after{background:white}
.service[open] .service-icon{color:var(--accent)}
.service-body{margin-left:86px;padding:0 5px 28px 0;max-width:none}
.service-body p{font-size:15px;line-height:1.8}
.service-body>span{font-size:9px;font-weight:700;line-height:1.8;letter-spacing:.08em;color:var(--accent);margin-top:16px}

/* An interior interrupts the rhythm with a full-width architectural image. */
.vision-panel{height:620px}
.vision-panel>img{object-position:center 55%;transform:none}
.vision-overlay{background:linear-gradient(90deg,#10291ee8 0%,#142a2082 45%,#142a201a 100%)}
.vision-copy{max-width:640px}
.vision-copy h2{font-size:clamp(38px,4.2vw,68px);line-height:1.12;font-weight:650;margin:25px 0;letter-spacing:-.05em}
.vision-copy h2 em{font-size:1em;color:#e49a70}
.vision-copy p{font-size:17px;line-height:1.75}
.vision-copy .eyebrow{color:#e9ac84;font-size:11px}
.visual-note{font-size:9px}

/* Contact with a large architectural drawing, rather than an empty colour field. */
.contact{position:relative;overflow:hidden;background:#263d31}
.contact>*:not(.contact-art){position:relative;z-index:1}
.contact-art{position:absolute;width:570px;height:540px;right:-80px;top:80px;color:#a6bb8d;opacity:.22;pointer-events:none;transform:rotate(-8deg)}
.contact-art>svg{width:100%;height:100%}
.contact h2{font-size:clamp(36px,4vw,62px);line-height:1.2;font-weight:650;letter-spacing:-.05em;max-width:1000px;margin:45px 0 30px}
.contact h2 em{font-size:1em;color:#e49a70}
.contact-bottom{padding-bottom:48px}
.contact-bottom p{font-size:16px;line-height:1.75}
.contact-cta{padding:14px 24px;background:var(--accent);border:0;font-family:Sora,sans-serif;font-size:21px;font-weight:600;gap:45px}
.contact-cta>span{font-size:29px}
.contact-details a{font-size:15px;gap:12px}
.contact-details small{font-size:10px;color:#b9c7a8}
.availability{font-size:11px}
footer{background:#14281f;padding-top:30px}
.footer-brand{font-size:clamp(28px,5.4vw,83px);letter-spacing:-.04em;font-weight:700}
.footer-bottom{font-size:10px}.privacy-button{font-size:10px}
.demo-dialog h2{font-size:30px}.demo-dialog p{font-size:15px}

@media(max-width:1100px){
 .nav{gap:18px;font-size:12px}.brand>span{font-size:14px}.brand small{font-size:7px}
 .hero h1{font-size:7vw}.hero-copy{max-width:56%}.hero-copy>p:not(.eyebrow){font-size:15px}
 .studio-grid{gap:5vw}.studio-visual>img{height:440px}.blueprint-card{right:0;width:75%}
 .scene-copy{max-width:290px}.scene-copy h2{font-size:38px}.scene-copy>p:last-child{max-width:250px}
 .phase{min-width:120px;font-size:11px}
 .services-layout{grid-template-columns:.7fr 1.3fr;gap:35px}.service summary{gap:11px}.service-icon{width:36px;min-width:36px;height:36px}
 .service-body{margin-left:72px}.service h3{font-size:21px}.services-poster{height:650px}
 .section-heading{gap:22px 50px}.section-heading>p{grid-column:2;padding-left:0}
 .contact-details{gap:22px}.contact-details a{font-size:13px}
}
@media(max-width:720px){
 body{font-size:15px}.section-pad{padding:65px var(--gutter)}
 .header{padding-top:20px;padding-bottom:20px}.brand>span{font-size:13px}.brand svg{width:34px;height:34px}.brand small{font-size:6px}
 .nav{font-size:26px}.nav .nav-contact{font-size:14px;padding:14px 18px}
 .hero{height:100svh;min-height:850px}
 .hero-copy{max-width:88%;bottom:119px}
 .hero h1{font-size:clamp(41px,11.5vw,65px);line-height:1.04;letter-spacing:-.065em;margin:16px 0 19px}
 .hero h1 em{font-size:1em}
 .hero-copy .eyebrow{font-size:9px;padding:6px 9px}
 .hero-copy>p:not(.eyebrow){font-size:14px;line-height:1.65}
 .hero-copy .button{font-size:13px;padding:13px 20px;margin-top:22px}
 .hero-topline{font-size:8px;top:108px}
 .hero-bottom{bottom:26px;padding-top:18px;align-items:center}
 .hero-bottom .scroll-link{font-size:7px;max-width:140px;line-height:1.6}
 .hero-playback{gap:11px}.hero-playback button{font-size:10px}
 .hero-scene-label{font-size:8px;top:132px;padding:7px 10px}
 .studio-grid{grid-template-columns:1fr;gap:35px;margin-top:30px}
 .intro h2{font-size:36px;line-height:1.18}
 .studio-copy p{font-size:14px;line-height:1.8}.studio-copy .studio-lead{font-size:17px;margin-top:25px}
 .text-link{font-size:13px;gap:20px}
 .studio-visual{margin-bottom:65px}
 .studio-visual>img{height:350px}
 .studio-visual figcaption{left:20px;top:20px}.studio-visual figcaption>strong{font-size:21px}
 .blueprint-card{width:70%;right:7px;bottom:-50px;padding:10px}
 .blueprint-card>span{font-size:6px}
 .discipline-row{margin-top:5px;padding-top:15px;display:grid;grid-template-columns:1fr;gap:0}
 .discipline-row>span{font-size:24px;border-bottom:1px solid #9dad982e;padding:15px 0;gap:18px}
 .discipline-row>span:after{content:'↗';margin-left:auto;color:#cf8156;font-size:28px;font-family:Manrope,sans-serif}
 .discipline-row small{font-size:10px}
 .discipline-row>i{display:none}
 .section-label{font-size:10px}.tiny-cross{width:24px;height:24px;font-size:20px}
 .experience-top{top:25px}.experience-top .section-label{font-size:9px}
 .experience-sticky:before{font-size:210px;top:60px;left:0}
 .scene-copy{top:87px;max-width:100%}
 .scene-copy h2{font-size:31px;line-height:1.16}
 .scene-copy .eyebrow{font-size:10px;margin-bottom:13px}
 .scene-copy>p:last-child{font-size:13px;line-height:1.65;max-width:315px;margin-top:15px}
 .scene-annotation{font-size:8px;bottom:146px;right:6%;padding:7px 10px}
 .scene-controls{gap:5px}
 .phase{min-width:0;padding:11px 7px;font-size:10px;text-align:center}
 .phase span{display:block;font-size:9px;margin:0 0 3px}
 .motion-toggle{font-size:10px;margin-top:14px}
 .section-heading{grid-template-columns:1fr;gap:20px;margin-bottom:30px}
 .section-heading .section-label{grid-column:auto;margin-bottom:5px}
 .section-heading h2{font-size:34px;line-height:1.17}
 .section-heading>p{grid-column:auto;max-width:100%;font-size:15px;margin:0;padding:0}
 .services-layout{grid-template-columns:1fr;gap:30px}
 .services-poster{height:330px}
 .services-poster figcaption{bottom:23px;left:21px}
 .services-poster figcaption>strong{font-size:28px}.poster-graphic{width:72px;top:18px;left:18px}
 .service summary{gap:10px;padding:22px 0}
 .service-number{width:20px;font-size:10px}
 .service-icon{width:32px;min-width:32px;height:32px}
 .service h3{font-size:19px;line-height:1.3;max-width:none}
 .service-symbol{width:28px;height:28px}
 .service-symbol:before,.service-symbol:after{top:13px;left:9px;width:10px}
 .service-body{margin-left:0;padding:0 0 23px 30px}
 .service-body p{font-size:14px;line-height:1.8}
 .service-body>span{font-size:8px}
 .vision-panel{height:540px}
 .vision-panel>img{object-position:60% center}
 .vision-copy{right:var(--gutter)}
 .vision-copy h2{font-size:39px;line-height:1.14}
 .vision-copy p{font-size:15px}.vision-copy .eyebrow{font-size:9px}.visual-note{font-size:7px}
 .contact h2{font-size:33px;line-height:1.2;margin-top:35px}
 .contact h2 br{display:none}
 .contact-art{width:450px;height:420px;right:-180px;top:90px;opacity:.16}
 .contact-bottom p{font-size:15px}.contact-cta{font-size:20px;gap:35px;padding:14px 22px}
 .availability{font-size:9px}.contact-top .availability{font-size:8px}
 .contact-details a{font-size:14px}.contact-details small{font-size:10px}
 .footer-brand{font-size:7.4vw;letter-spacing:-.045em}
 .footer-bottom{font-size:9px}.privacy-button{font-size:9px}.footer-bottom>span:nth-child(2){font-size:8px}
}
@media(max-width:360px){.hero h1{font-size:39px}.hero-playback{gap:7px}.hero-playback button{font-size:9px}.service h3{font-size:17px}}

/* Small architectural details animate on entry and on direct interaction. */
.studio-visual.visible .blueprint-card>svg path:not([fill]){stroke-dasharray:1500;stroke-dashoffset:1500;animation:draw-plan 2.4s .2s ease forwards}
.blueprint-card{transition:transform .5s var(--ease)}
.studio-visual:hover .blueprint-card{transform:rotate(0) translateY(-5px)}
.service-icon{transition:transform .3s,color .3s}.service summary:hover .service-icon{transform:translateY(-3px);color:var(--accent)}
@keyframes draw-plan{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.studio-visual.visible .blueprint-card>svg path:not([fill]){stroke-dashoffset:0;stroke-dasharray:none;animation:none}.studio-visual:hover .blueprint-card,.service summary:hover .service-icon{transform:none}}
.reduced-motion .studio-visual.visible .blueprint-card>svg path:not([fill]){stroke-dashoffset:0;stroke-dasharray:none;animation:none}

/* Readability at laptop heights and browser zoom: two deliberate title lines. */
:root{--accent:#ac4625}
.hero-copy{width:min(650px,48vw);max-width:none}
.hero h1{font-size:clamp(40px,5.5vw,82px);line-height:1.06;letter-spacing:-.04em}
.hero-title-line{display:block;white-space:nowrap}
.hero h1 em{letter-spacing:inherit}
.hero-topline>span{background:#19322abf;padding:5px 8px}
.hero-scene-label{background:#213c31eb}
.intro h2,.scene-copy h2,.section-heading h2,.vision-copy h2,.contact h2{letter-spacing:-.035em}
.service h3{letter-spacing:-.025em}
.studio-visual figcaption{top:18px;left:18px;max-width:calc(100% - 36px);padding:14px 17px;background:#142b21e8;border-left:2px solid #e69464;text-shadow:none}
.studio-visual figcaption>span{font-size:10px;line-height:1.6}
.studio-visual figcaption>strong{font-size:21px;letter-spacing:-.025em}
.service-body>span{font-size:10px}
.blueprint-card>span{font-size:9px;line-height:1.5}
.footer-bottom,.privacy-button{font-size:11px}
.visual-note{background:#142b21cf;padding:5px 8px;line-height:1.5}
@media(min-width:721px) and (max-height:760px){
 .hero{min-height:720px}
 .hero-copy{bottom:125px}
 .hero h1{font-size:clamp(40px,4.8vw,74px);margin:16px 0 19px}
 .hero-copy .button{margin-top:23px}
 .hero-topline{top:120px}
}
@media(max-width:720px){
 .hero-copy{width:88%;max-width:88%;bottom:119px}
 .hero h1{font-size:clamp(37px,11.1vw,62px);letter-spacing:-.045em;line-height:1.08}
 .hero-topline>span{padding:3px 6px}
 .studio-visual figcaption{top:15px;left:15px;padding:12px 14px;max-width:calc(100% - 30px)}
 .studio-visual figcaption>strong{font-size:18px;line-height:1.35}
 .studio-visual figcaption>span{font-size:9px}
 .blueprint-card>span{font-size:7px}
 .service-body>span{font-size:9px}
 .footer-bottom,.privacy-button{font-size:10px}
 .footer-bottom>span:nth-child(2){font-size:9px}
 .visual-note{font-size:8px;max-width:88%}
}
