@charset "UTF-8";
:root { --ink:#182026; --paper:#f1f3f2; --white:#fff; --muted:#657078; --line:#d0d7d7; --blue:#00658e; --amber:#f3c66a; --gutter:clamp(24px,5.5vw,110px); --radius:24px; color-scheme:light; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:95px; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.65 Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; } button,input { font:inherit; } button,summary { cursor:pointer; }
img { display:block; max-width:100%; } h1,h2,h3,p,figure { margin:0; } h1,h2,h3 { font-weight:500; line-height:1.1; } p+p { margin-top:20px; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible { outline:3px solid var(--blue); outline-offset:6px; }
.dark :focus-visible,.hero :focus-visible,.site-header :focus-visible { outline-color:var(--amber); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; z-index:100; top:12px; left:24px; padding:12px 20px; background:var(--amber); color:var(--ink); transform:translateY(-170%); }
.skip-link:focus { transform:none; }
.site-header { position:fixed; z-index:40; top:14px; left:14px; right:14px; padding:22px calc(var(--gutter) - 14px); display:flex; align-items:center; justify-content:space-between; color:white; border-radius:24px 24px 0 0; transition:background .25s,padding .25s,border-radius .25s; }
.site-header.scrolled { background:#152027f5; padding-top:12px; padding-bottom:12px; border-radius:16px; box-shadow:0 6px 24px #15202718; }
.brand { display:flex; align-items:center; gap:20px; flex-shrink:0; } .brand img { width:70px; height:47px; object-fit:contain; border-radius:4px; }
.brand>span { font-size:11px; line-height:1.8; letter-spacing:1px; color:#f0f1ef; } .brand b { font-size:10px; font-weight:400; color:#bbc7cc; letter-spacing:1.4px; }
.site-header nav { display:flex; align-items:center; gap:clamp(28px,3vw,52px); }
.site-header nav a { font-size:14px; padding:12px 0; position:relative; }
.site-header nav a:not(.nav-cta)::after { content:''; height:2px; width:100%; background:var(--amber); position:absolute; bottom:3px; left:0; transform:scaleX(0); transform-origin:left; transition:transform .2s; }
.site-header nav a:hover::after,.site-header nav .active::after { transform:scaleX(1); }
.site-header .nav-cta { display:flex; align-items:center; gap:22px; background:white; color:var(--ink); border-radius:100px; padding:14px 23px; transition:background .2s; } .site-header .nav-cta:hover { background:var(--amber); }
.button-dot { display:block; width:7px; height:7px; background:currentColor; border-radius:50%; flex-shrink:0; transition:transform .2s; }
.menu-toggle { display:none; color:white; background:none; border:0; gap:15px; align-items:center; min-height:44px; } .menu-toggle i { width:23px; height:11px; border-top:1px solid currentColor; border-bottom:1px solid currentColor; }
.hero { position:relative; margin:14px; border-radius:var(--radius); overflow:hidden; min-height:750px; height:calc(100svh - 28px); max-height:1160px; background:#152027; color:white; display:flex; flex-direction:column; padding:130px calc(var(--gutter) - 14px) 28px; }
.hero-picture,.hero-picture img,.hero-video,.hero-shade { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-picture img { object-position:60% center; } .hero-video { opacity:0; transition:opacity .4s; object-position:60% center; } .hero-video.playing { opacity:1; }
.hero-shade { background:linear-gradient(90deg,#14202ad9,#111e2777 70%),linear-gradient(0deg,#0c172b99,transparent 65%); }
.hero-rule { position:absolute; top:118px; bottom:85px; left:calc(var(--gutter) - 14px); width:1px; background:#ffffff21; pointer-events:none; }
.hero-topline { position:relative; display:flex; justify-content:space-between; gap:20px; font-size:11px; letter-spacing:1.7px; padding-bottom:22px; border-bottom:1px solid #ffffff40; }
.hero-content { position:relative; flex:1; display:flex; flex-direction:column; justify-content:center; padding:40px 0 55px; }
.hero-kicker { font-size:15px; margin-bottom:24px; color:#d2dde1; }
.hero h1 { font-size:clamp(64px,7.8vw,150px); line-height:1.02; letter-spacing:-.059em; max-width:1400px; } .hero h1>span { color:#f0f3f2; } .hero h1 em { color:var(--amber); font-style:normal; }
.hero-lower { display:flex; align-items:flex-end; justify-content:space-between; gap:36px; margin-top:45px; } .hero-lower>p { font-size:16px; line-height:1.65; color:#e2e9e9; } .hero-lower>p>span { display:block; font-size:12px; color:#c3cdd1; margin-top:15px; }
.hero-actions { display:flex; gap:28px; align-items:center; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:35px; border:1px solid transparent; min-height:54px; padding:17px 25px; border-radius:100px; line-height:1.3; font-size:14px; font-weight:500; transition:transform .2s,background .2s,box-shadow .2s; }
.button:hover { transform:translateY(-2px); box-shadow:0 5px 18px #00000015; } .button:hover .button-dot { transform:scale(1.35); }
.amber { background:var(--amber); color:var(--ink); } .amber:hover { background:#ffdb8c; } .charcoal { background:var(--ink); color:white; } .charcoal:hover { background:#344752; }
.text-link { display:inline-block; font-size:14px; position:relative; padding:8px 0 6px; line-height:1.5; border-bottom:1px solid #738088; transition:color .2s; }
.text-link::after { content:''; position:absolute; width:100%; height:1px; bottom:-1px; left:0; background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.text-link:hover { color:var(--blue); } .text-link:hover::after { transform:scaleX(1); } .light:hover { color:var(--amber); }
.hero-bottom { position:relative; display:flex; justify-content:space-between; align-items:center; gap:18px; border-top:1px solid #ffffff40; padding-top:22px; font-size:11px; letter-spacing:1.2px; }
.scroll-link { display:flex; align-items:center; gap:13px; font-size:14px; letter-spacing:0; min-height:36px; }
.scroll-track { height:25px; width:16px; border:1px solid #d2dde180; border-radius:12px; position:relative; } .scroll-track::after { content:''; position:absolute; top:5px; left:7px; width:1px; height:6px; background:var(--amber); animation:scroll 2s infinite; }
.media-credit { font-size:11px; letter-spacing:0; color:#d2dde1; } .video-toggle { background:#182026aa; border:1px solid #b8c8cf; color:white; padding:9px 15px; border-radius:100px; font-size:12px; }
.sector-strip { padding:29px var(--gutter) 35px; display:flex; align-items:center; gap:30px; justify-content:space-between; border-bottom:1px solid var(--line); }
.eyebrow { font-size:11px; letter-spacing:1.5px; font-weight:500; line-height:1.5; } .sector-strip p { font-size:16px; color:#47545b; } .sector-strip p span { color:#92a0a5; margin:0 12px; }
.section { padding:clamp(76px,8vw,145px) var(--gutter); max-width:1920px; margin:auto; } .section-label { display:flex; align-items:center; gap:20px; font-size:11px; letter-spacing:1.6px; margin-bottom:48px; }
.section-label>span { color:var(--blue); letter-spacing:0; } .display { font-size:clamp(38px,4.1vw,78px); line-height:1.08; letter-spacing:-.048em; } .muted { color:var(--muted); } .lead { font-size:clamp(22px,1.9vw,32px); line-height:1.35; letter-spacing:-.025em; }
.company-grid { display:grid; grid-template-columns:1fr 1fr; gap:7vw; align-items:start; } .company-intro>.lead { margin-top:38px; } .company-intro>p:not(.lead) { max-width:530px; color:#59666d; margin-top:22px; } .company-intro>.text-link { margin-top:23px; }
.structure-panel { background:#1d2931; color:white; border-radius:24px; overflow:hidden; padding:24px; position:relative; }
.study-top { display:flex; gap:15px; justify-content:space-between; align-items:center; color:#b5cad4; } .study-top>span:last-child { font-size:10px; letter-spacing:.8px; }
.structure-viewport { position:relative; height:330px; background-image:linear-gradient(#66849615 1px,transparent 1px),linear-gradient(90deg,#66849615 1px,transparent 1px); background-size:32px 32px; overflow:hidden; border-radius:12px; margin:20px 0; }
.structure-fallback { position:absolute; top:40px; left:15%; width:70%; height:270px; transition:opacity .2s; } .three-ready .structure-fallback { opacity:0; }
.structure-canvas { position:absolute; inset:0; cursor:grab; } .structure-canvas canvas { display:block; width:100%; height:100%; } .study-axis { position:absolute; bottom:18px; left:20px; color:#93acb9; font-size:10px; letter-spacing:2px; }
.enable-3d { position:absolute; bottom:14px; right:16px; color:#e6eff1; border:1px solid #7695a3; background:#233640; padding:9px 14px; border-radius:100px; font-size:12px; min-height:38px; }
.study-controls label { display:flex; justify-content:space-between; gap:15px; font-size:14px; } .study-controls output { color:var(--amber); }
.study-controls input { width:100%; accent-color:var(--amber); margin:20px 0 7px; min-height:24px; } .phase-labels { display:flex; justify-content:space-between; font-size:11px; color:#b5c5cd; } .structure-panel>p:not(.sr-only) { font-size:12px; color:#adbec7; margin-top:22px; line-height:1.6; }
.principles { display:grid; grid-template-columns:repeat(3,1fr); gap:48px; border-top:1px solid var(--line); padding-top:32px; margin-top:85px; } .principles h3 { font-size:24px; letter-spacing:-.02em; margin:20px 0 15px; } .principles p { color:#59666d; max-width:360px; }
.dark { background:var(--ink); color:#eef2f1; } .dark .section-label>span { color:#8ec9dd; } .dark .muted { color:#a1b0b8; }
.capabilities { border-radius:32px; margin:0 14px; padding-left:calc(var(--gutter) - 14px); padding-right:calc(var(--gutter) - 14px); }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:45px; margin-bottom:60px; } .section-heading>p { color:#626f76; max-width:350px; } .dark .section-heading>p { color:#a9b8bf; }
.capability-layout { display:grid; grid-template-columns:1fr 1fr; gap:7vw; align-items:start; } .capability-visual { position:sticky; top:115px; }
.service-images { position:relative; aspect-ratio:4/4.3; overflow:hidden; border-radius:20px; background:#334249; }
.service-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.035); transition:opacity .4s,transform .8s; }
.service-image.selected { opacity:1; transform:scale(1); } .service-image-label { display:flex; justify-content:space-between; gap:20px; padding:18px 0; font-size:10px; letter-spacing:1px; color:#c7d1d5; }
.capability-list details { border-top:1px solid #52626c; } .capability-list details:last-child { border-bottom:1px solid #52626c; }
.capability-list summary { display:flex; gap:20px; align-items:center; padding:26px 0; min-height:85px; list-style:none; transition:color .2s; }
summary::-webkit-details-marker { display:none; } .capability-list h3 { font-size:clamp(22px,2.15vw,35px); line-height:1.22; letter-spacing:-.025em; flex:1; }
.capability-list summary:hover,.capability-list details[open]>summary { color:var(--amber); } .row-number { font-size:11px; color:#b0bec5; } .plus { width:16px; height:16px; position:relative; flex-shrink:0; }
.plus::before,.plus::after { content:''; position:absolute; top:7px; left:0; width:16px; height:1px; background:currentColor; transition:transform .2s; } .plus::after { transform:rotate(90deg); } details[open]>summary .plus::after { transform:none; }
.detail-copy { padding:0 24px 28px 35px; color:#b6c4cb; } .detail-copy a { display:inline-block; color:#f4d48d; border-bottom:1px solid #a68849; padding:8px 0; margin-top:12px; font-size:14px; }
.project-register { border-bottom:1px solid var(--line); } .project-register details { border-top:1px solid var(--line); }
.project-register summary { list-style:none; padding:32px 0; display:grid; grid-template-columns:.65fr 1.4fr .5fr; align-items:center; gap:35px; }
.project-register h3 { font-size:clamp(25px,2.7vw,43px); line-height:1.14; letter-spacing:-.035em; } .project-register .eyebrow { color:#596970; }
.project-detail-label { display:flex; gap:18px; align-items:center; justify-content:space-between; font-size:14px; color:#4c626e; }
.project-register summary:hover h3 { color:var(--blue); } .project-facts { margin-left:25%; padding:0 0 32px; max-width:690px; color:#5a6971; }
.project-facts dl { margin:20px 0 0; } .project-facts dl>div { display:grid; grid-template-columns:150px 1fr; gap:20px; padding:10px 0; border-top:1px solid #dbe1e1; font-size:14px; } .project-facts dt { color:#586a73; } .project-facts dd { margin:0; color:var(--ink); }
.project-archive { display:flex; align-items:center; gap:45px; padding:30px; background:#e4e9e7; border-radius:20px; margin-top:45px; }
.archive-title { min-width:220px; } .archive-title p { font-size:13px; color:#526168; margin-top:14px; } .archive-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:14px; flex:1; }
.archive-grid img { width:100%; max-width:110px; aspect-ratio:1; object-fit:cover; border-radius:8px; filter:saturate(.8); transition:filter .2s,transform .2s; } .archive-grid img:hover { filter:saturate(1); transform:translateY(-3px); }
.project-note { display:flex; justify-content:space-between; gap:35px; margin-top:24px; } .project-note p { color:#5d6b72; font-size:12px; max-width:510px; }
.approach { display:grid; grid-template-columns:1fr 1fr; background:#e5eae8; border-radius:32px; margin:0 14px; overflow:hidden; }
.process-media { min-height:950px; position:relative; overflow:hidden; } .process-media>img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.process-media::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#1320288c,transparent 55%); pointer-events:none; }
.process-media>.media-credit { position:absolute; z-index:1; bottom:24px; left:30px; }
.detail-frame { position:absolute; z-index:1; inset:50px; border:1px solid #ffffff50; pointer-events:none; } .detail-frame span { position:absolute; top:20px; left:20px; color:#eef2f1; font-size:11px; letter-spacing:1.6px; text-shadow:0 1px 10px black; }
.process-content { padding:80px clamp(30px,4vw,80px); } .process-content .display { font-size:clamp(38px,3.7vw,68px); }
.process-line { height:1px; background:#aabbbf; margin:38px 0 30px; overflow:hidden; } .process-line span { display:block; width:100%; height:1px; background:var(--blue); transform-origin:left; transform:scaleX(.1); }
.process { list-style:none; margin:0; padding:0; } .process li { display:flex; gap:25px; padding:23px 0; border-bottom:1px solid #c5cecd; } .process li>span { font-size:12px; color:#3f6576; padding-top:3px; } .process h3 { font-size:24px; letter-spacing:-.025em; margin-bottom:12px; } .process p { font-size:15px; color:#55666c; }
.careers-layout { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:center; } .careers-layout .lead { margin-top:35px; } .careers-layout>div>p:not(.lead) { margin-top:24px; max-width:440px; color:#596970; } .careers-layout .button { margin-top:30px; }
.people-photo { position:relative; } .people-photo>img { width:100%; aspect-ratio:4/4.3; object-fit:cover; border-radius:24px; }
.people-photo figcaption { font-size:10px; letter-spacing:1px; color:#576b74; display:flex; justify-content:space-between; gap:20px; margin-top:17px; } .people-photo figcaption>span:last-child { letter-spacing:0; }
.contact { position:relative; margin:0 14px; border-radius:32px; padding-left:calc(var(--gutter) - 14px); padding-right:calc(var(--gutter) - 14px); overflow:hidden; }
.contact-grid-lines { position:absolute; inset:0; background-image:linear-gradient(#7196a516 1px,transparent 1px),linear-gradient(90deg,#7196a516 1px,transparent 1px); background-size:110px 110px; pointer-events:none; }
.contact>.section-label,.contact-top,.contact-grid { position:relative; }
.contact-top { display:grid; grid-template-columns:1.3fr 1fr; gap:10vw; align-items:end; } .contact-kicker { color:#b6c4ca; font-size:14px; margin-bottom:23px; }
.contact .display { font-size:clamp(64px,7.5vw,140px); letter-spacing:-.06em; } .contact h2 em { font-style:normal; color:var(--amber); }
.contact-intro p { max-width:360px; font-size:18px; color:#becbd1; } .contact-intro .button { margin-top:30px; }
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:40px; border-top:1px solid #52636e; padding-top:32px; margin-top:85px; }
.contact-grid h3 { font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:#adbfc6; margin-bottom:20px; }
.contact-grid a:not(.text-link) { display:block; width:fit-content; min-height:36px; } .contact-grid a:hover { color:var(--amber); } .contact-value { font-size:clamp(18px,1.55vw,26px); letter-spacing:-.02em; overflow-wrap:anywhere; }
.contact-grid address { font-style:normal; font-size:16px; } .contact-grid .text-link { margin-top:10px; }
.footer { padding:65px var(--gutter) 24px; } .footer-main { display:flex; gap:35px; justify-content:space-between; align-items:center; } .footer-main p { font-size:14px; color:#5e6e76; } .footer nav { display:flex; gap:35px; font-size:14px; } .footer nav a { padding:10px 0; } .footer nav a:hover { color:var(--blue); }
.footer-bottom { border-top:1px solid var(--line); margin-top:45px; padding-top:22px; display:flex; justify-content:space-between; gap:25px; color:#60717b; font-size:11px; letter-spacing:1px; }
.reveal { opacity:1; transform:none; } .motion-enabled .reveal { transition:opacity .65s,transform .65s; } .motion-enabled .reveal.pending { opacity:.15; transform:translateY(24px); }
@keyframes scroll { 0%,100% { transform:translateY(0); opacity:1; } 70% { transform:translateY(5px); opacity:.3; } }
@media(min-width:1921px) { .hero,.site-header,.sector-strip,.footer { padding-left:max(var(--gutter),calc((100vw - 1690px)/2)); padding-right:max(var(--gutter),calc((100vw - 1690px)/2)); } .capabilities,.contact { margin:0 auto; } }
@media(max-width:1100px) { .brand>span { display:none; } .hero-lower { align-items:flex-start; flex-direction:column; gap:30px; } .hero-lower>p br { display:none; } .hero-lower>p>span { margin-top:8px; } .sector-strip { flex-wrap:wrap; gap:15px 25px; } .sector-strip>.eyebrow { display:none; } .hero-index { display:none; } .company-grid { gap:5vw; } .structure-panel { padding:20px; } .study-top>span:last-child { display:none; } .structure-viewport { height:280px; } .principles { gap:30px; } .capability-layout { gap:5vw; } .project-register summary { grid-template-columns:.7fr 1.4fr .55fr; gap:24px; } .project-archive { display:block; } .archive-title { display:flex; justify-content:space-between; gap:25px; margin-bottom:24px; } .archive-title p { margin-top:0; } .archive-grid img { max-width:110px; } .process-content { padding:65px 32px; } .process-media { min-height:950px; } .contact-grid { grid-template-columns:1fr 1.2fr; } .contact-grid>div:last-child { grid-column:1/-1; } }
@media(max-width:760px) {
 html { scroll-padding-top:88px; } .site-header { padding:18px 23px; top:10px; left:10px; right:10px; border-radius:20px 20px 0 0; } .site-header.scrolled { padding:10px 20px; } .brand img { width:61px; height:41px; } .site-header nav { gap:22px; } .site-header .nav-cta { display:none; }
 .hero { margin:10px; border-radius:20px; min-height:830px; height:auto; padding:110px 24px 25px; } .hero-topline { font-size:10px; letter-spacing:1.2px; } .hero-topline>span:last-child { display:none; } .hero-rule { left:24px; top:100px; bottom:80px; }
 .hero-content { padding:80px 0 70px; } .hero-kicker { font-size:14px; margin-bottom:25px; } .hero h1 { font-size:clamp(52px,9.7vw,74px); letter-spacing:-.052em; line-height:1.05; } .hero-lower { margin-top:35px; gap:28px; } .hero-actions { gap:22px; } .hero-lower>p { font-size:15px; } .hero-bottom { gap:12px; } .media-credit { font-size:10px; max-width:120px; text-align:right; } .video-toggle { font-size:11px; padding:8px 10px; }
 .sector-strip { padding:20px var(--gutter) 24px; gap:8px; } .sector-strip p { font-size:14px; line-height:2; } .sector-strip p span { margin:0 6px; }
 .section-label { margin-bottom:32px; font-size:10px; gap:14px; } .display { font-size:clamp(38px,6.2vw,48px); } .company-grid,.careers-layout { grid-template-columns:1fr; gap:45px; } .company-intro>.lead { margin-top:28px; } .structure-panel { padding:22px; } .structure-viewport { height:320px; } .study-top>span:last-child { display:block; }
 .principles { grid-template-columns:1fr; gap:30px; padding-top:30px; margin-top:45px; } .principles article { display:grid; grid-template-columns:1fr 1.35fr; gap:0 25px; } .principles article>.eyebrow { grid-column:1; } .principles h3 { grid-column:1; margin:15px 0 0; font-size:22px; } .principles p { grid-column:2; grid-row:1/3; align-self:center; }
 .capabilities,.contact { margin:0 10px; border-radius:24px; padding-left:calc(var(--gutter) - 10px); padding-right:calc(var(--gutter) - 10px); } .section-heading { display:block; margin-bottom:35px; } .section-heading>p { margin-top:22px; } .capability-layout { grid-template-columns:1fr; gap:25px; } .capability-visual { position:static; } .service-images { aspect-ratio:4/3; border-radius:16px; } .service-image-label { font-size:9px; gap:10px; } .capability-list summary { padding:22px 0; } .capability-list h3 { font-size:24px; } .detail-copy { padding-left:34px; padding-right:10px; }
 .project-register summary { grid-template-columns:1fr auto; gap:18px; padding:26px 0; } .project-register .eyebrow { grid-column:1/-1; } .project-register h3 { font-size:30px; } .project-detail-label { font-size:12px; } .project-facts { margin-left:0; } .project-facts dl>div { grid-template-columns:130px 1fr; gap:15px; }
 .project-archive { padding:22px; margin-top:30px; } .archive-title { display:block; } .archive-title p { margin-top:12px; } .archive-grid { grid-template-columns:repeat(3,1fr); gap:15px; } .archive-grid img { max-width:130px; } .project-note { display:block; } .project-note .text-link { margin-top:15px; }
 .approach { margin:0 10px; grid-template-columns:1fr; border-radius:24px; } .process-media { min-height:450px; } .process-content { padding:65px calc(var(--gutter) - 10px); } .detail-frame { inset:35px; } .process-content .display { font-size:42px; } .process li { gap:20px; } .process h3 { font-size:24px; }
 .careers-layout .lead { margin-top:28px; } .people-photo>img { aspect-ratio:4/3; border-radius:20px; } .people-photo figcaption { font-size:9px; }
 .contact-top { grid-template-columns:1fr; gap:38px; } .contact .display { font-size:clamp(62px,11vw,90px); } .contact-intro p { font-size:16px; } .contact-grid { margin-top:50px; gap:30px; } .contact-value { font-size:19px; }
 .footer-main { flex-wrap:wrap; gap:25px; } .footer-main nav { width:100%; order:3; } .footer-main>.text-link { order:4; } .footer-bottom { font-size:10px; }
}
@media(max-width:480px) {
 .menu-toggle:not([hidden]) { display:flex; } .site-header nav { position:absolute; top:77px; left:0; right:0; padding:10px 24px; background:#18262c; display:flex; justify-content:space-between; border-radius:0 0 16px 16px; }
 .js-enabled .site-header nav { display:none; } .js-enabled .site-header nav.open { display:flex; flex-direction:column; align-items:stretch; gap:0; padding:16px 24px 24px; animation:menu-in .2s ease; }
 .js-enabled .site-header nav.open a { padding:14px 0; font-size:22px; } .js-enabled .site-header nav.open .nav-cta { display:flex; font-size:14px; padding:15px 20px; margin-top:14px; }
 .hero { min-height:850px; padding-top:105px; } .hero-content { padding-top:70px; padding-bottom:55px; } .hero h1 { font-size:clamp(43px,9.3vw,53px); } .hero-kicker { font-size:13px; } .hero-actions { flex-wrap:wrap; gap:14px 25px; } .hero-lower { margin-top:32px; } .hero-bottom { flex-wrap:wrap; } .scroll-link { font-size:12px; } .video-toggle { margin-left:auto; } .hero-rule { bottom:85px; }
 .display { font-size:38px; } .principles article { display:block; } .principles p { margin-top:16px; } .structure-panel { padding:18px; } .study-top>span:last-child { display:none; } .structure-viewport { height:260px; } .study-controls label { font-size:12px; gap:10px; }
 .project-register summary { display:block; } .project-register h3 { margin:16px 0 20px; } .project-detail-label { max-width:180px; } .project-facts dl>div { grid-template-columns:100px 1fr; } .project-archive { padding:18px; } .archive-grid { gap:10px; } .archive-grid img { max-width:100px; }
 .process-media { min-height:360px; } .detail-frame { inset:24px; } .detail-frame span { font-size:9px; left:14px; top:14px; } .process-content .display { font-size:38px; }
 .people-photo>img { aspect-ratio:1.1; } .people-photo figcaption { display:block; } .people-photo figcaption span { display:block; margin-top:6px; }
 .contact .display { font-size:59px; } .contact-grid { grid-template-columns:1fr; } .contact-grid>div:last-child { grid-column:auto; } .contact-grid>div { padding-bottom:25px; border-bottom:1px solid #52636e; } .footer-main>p { margin-left:auto; font-size:12px; } .footer nav { justify-content:space-between; } .footer-bottom { flex-direction:column; gap:10px; }
}
@keyframes menu-in { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } .hero-picture img,.process-media>img { transform:none!important; } .motion-enabled .reveal.pending { opacity:1; transform:none; } .process-line span { transform:none!important; } }

.structure-panel[data-phase='0'] .structure-fallback g:first-child { opacity:.12; }
.structure-panel[data-phase='2'] .structure-fallback g:first-child { stroke:#e9c776; }

/* Engineering folio: measured grids, drawing ticks and photographic plates. */
:root { --paper:#f4f7f8; --ink:#12252f; --muted:#526b78; --line:#c5d4dc; --blue:#00658e; --radius:8px; }
body { background-image:linear-gradient(#00658e08 1px,transparent 1px),linear-gradient(90deg,#00658e08 1px,transparent 1px); background-size:40px 40px; }
.section-label,.eyebrow,.hero-topline,.hero-index,.plate-marker,.process-tag,.location-footer,.register-heading,.study-top,.phase-labels { font-family:'Courier New',monospace; font-size:12px; letter-spacing:.08em; }
.section-label { position:relative; gap:18px; padding-bottom:15px; border-bottom:1px solid var(--line); }
.section-label::after { content:'+'; position:absolute; right:-4px; bottom:-11px; font:20px/1 'Courier New',monospace; color:var(--blue); }
.dark .section-label { border-color:#547284; } .dark .section-label::after { color:#8acade; }
.hero,.site-header { border-radius:8px; } .site-header.scrolled { border-radius:6px; }
.hero::after { content:''; position:absolute; inset:0; background-image:linear-gradient(#9ec6d70a 1px,transparent 1px),linear-gradient(90deg,#9ec6d70a 1px,transparent 1px); background-size:80px 80px; pointer-events:none; }
.hero-content,.hero-bottom,.hero-topline { z-index:1; }
.hero-topline { font-size:12px; } .hero-rule { background:#c7e6f44a; }
.hero-topline::before { content:'+'; position:absolute; left:-7px; bottom:-13px; color:#a4cad8; font:24px/1 monospace; }
.hero-topline::after { content:''; position:absolute; right:0; bottom:-5px; width:1px; height:9px; background:#adc8d5; }
.hero-bottom { font-size:12px; } .media-credit { font-size:12px; }
.sector-strip { background:#f4f7f8; } .sector-strip .eyebrow { color:#345d73; }
.trusted { padding-top:55px; padding-bottom:55px; }
.trusted-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.trusted-heading .section-label { border:0; margin-bottom:12px; padding:0; color:#376479; } .trusted-heading .section-label::after { display:none; }
.trusted h2 { font-size:clamp(28px,3vw,44px); letter-spacing:-.04em; } .trusted-heading>p { font-size:14px; color:#526b78; }
.brand-grid { padding:0; margin:0; list-style:none; display:grid; grid-template-columns:repeat(8,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.brand-grid li { display:grid; place-items:center; min-height:125px; background:#fff; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .25s; }
.brand-grid img { width:106px; height:79px; object-fit:contain; transition:transform .25s; }
.brand-grid li:hover { background:#e8f1f6; } .brand-grid li:hover img { transform:translateY(-3px); }
.company { padding-top:75px; }
.structure-panel { border-radius:4px; border:1px solid #55798a; background:#12374c; box-shadow:8px 8px 0 #dce6eb; }
.structure-viewport { border-radius:0; border:1px solid #648d9d; background-size:28px 28px; }
.principles { gap:0; border:1px solid var(--line); padding:0; background:#f9fbfc; }
.principles article { padding:30px; border-right:1px solid var(--line); position:relative; }
.principles article:last-child { border-right:0; } .principles article::before { content:'+'; position:absolute; top:-12px; left:-7px; font:24px/1 monospace; color:#698c9d; }
.capabilities,.contact { border-radius:6px; background-color:#122f40; background-image:linear-gradient(#95bfd110 1px,transparent 1px),linear-gradient(90deg,#95bfd110 1px,transparent 1px); background-size:48px 48px; }
.service-images { border-radius:2px; border:1px solid #7796a6; padding:8px; background:#122f40; }
.service-images::after { content:''; position:absolute; z-index:2; inset:12px; border:1px solid #c5dcea66; pointer-events:none; }
.service-image-label { font-size:12px; line-height:1.5; flex-wrap:wrap; }
.capability-list details { border-color:#688391; } .capability-list summary { transition:color .25s,padding .25s,background .25s; }
.capability-list summary:hover { padding-left:10px; background:#ffffff05; }
.capability-list .row-number { font-family:monospace; font-size:12px; }
.project-gallery { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:36px 28px; margin-bottom:70px; }
.project-plate { min-width:0; grid-column:span 2; } .project-plate:nth-child(-n+2) { grid-column:span 3; }
.plate-image { position:relative; background:#dae5eb; border:1px solid #aac0cd; padding:10px; }
.plate-image::before,.plate-image::after { content:''; position:absolute; z-index:1; pointer-events:none; }
.plate-image::before { inset:5px; border:1px solid #7fa0b370; }
.plate-image::after { top:0; left:0; width:22px; height:22px; border-top:2px solid var(--blue); border-left:2px solid var(--blue); }
.plate-image img { width:100%; height:auto; aspect-ratio:1.15; object-fit:cover; transition:filter .35s; }
.project-plate:nth-child(-n+2) .plate-image img { aspect-ratio:1.28; }
.project-plate:hover img { filter:saturate(1.1); } .plate-marker { position:absolute; top:22px; left:22px; background:#f4f7f8; border:1px solid #adc5d1; color:#254d65; width:35px; height:35px; display:grid; place-items:center; }
.project-plate figcaption { display:flex; align-items:baseline; justify-content:space-between; gap:15px; margin-top:16px; font-size:16px; color:#254554; }
.project-plate figcaption>span:last-child { font:12px/1.5 'Courier New',monospace; color:#536e7b; white-space:nowrap; }
.register-heading { display:flex; justify-content:space-between; gap:24px; padding:16px 0; color:#41667b; border-top:1px solid var(--line); }
.project-register summary { padding:26px 0; } .project-register h3 { font-size:clamp(24px,2.3vw,36px); }
.project-register details { transition:background .3s; } .project-register details[open] { background:#e9f0f5; }
.project-register details[open] summary,.project-register details[open] .project-facts { padding-left:20px; padding-right:20px; }
.project-note p { font-size:14px; }
.approach { border-radius:6px; background:#e8f0f5; border:1px solid #bfced8; }
.detail-frame { inset:35px; border-color:#e3edf5a0; } .detail-frame::before { content:'+'; position:absolute; top:-14px; left:-10px; font:28px monospace; color:#dce9f0; }
.process-content { background-image:linear-gradient(#0c5b830b 1px,transparent 1px),linear-gradient(90deg,#0c5b830b 1px,transparent 1px); background-size:24px 24px; }
.process-content .display { font-size:clamp(36px,3.5vw,64px); }
.process li { position:relative; border-color:#acbfcc; padding:24px 14px 24px 0; transition:background .3s,transform .3s; }
.process li::after { content:''; position:absolute; bottom:-1px; left:0; width:100%; height:2px; background:#00658e; transform:scaleX(0); transform-origin:left; transition:transform .8s; }
.process li.step-active::after,.process li:hover::after { transform:scaleX(1); }
.process li:hover { background:#ffffff60; transform:translateX(4px); }
.process .process-number { font:16px/1.5 'Courier New',monospace; min-width:36px; height:36px; border:1px solid #8cabbc; display:grid; place-items:center; padding:0; color:#234f67; transition:background .3s,color .3s; }
.process li.step-active .process-number { background:#00658e; color:white; border-color:#00658e; }
.process-tag { display:block; color:#466c80; font-size:12px; margin-bottom:9px; }
.process p { font-size:16px; } .process-line { margin-top:30px; }
.people-photo>img { border-radius:2px; border:10px solid #dce6ec; outline:1px solid #acc1ce; }
.people-photo figcaption { font-size:12px; }
.contact-grid-lines { background-size:48px 48px; }
.contact-grid h3 { font-family:monospace; font-size:12px; }
.location-panel { position:relative; margin-top:65px; padding-top:30px; border-top:1px solid #547284; }
.location-heading { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:28px; }
.location-heading .eyebrow { color:#b6d3e3; } .location-heading h3 { font-size:clamp(26px,3vw,40px); margin-top:12px; letter-spacing:-.035em; }
.map-frame { border:1px solid #8aa9bb; background:#dce6ec; padding:8px; }
.map-frame iframe { display:block; width:100%; height:420px; border:0; }
.location-footer { display:flex; justify-content:space-between; gap:22px; padding-top:18px; color:#b8cdd8; font-size:12px; }
.footer { padding-bottom:36px; background:#edf3f6; border-top:1px solid #bccfd9; margin-top:14px; }
.footer-bottom { font-size:12px; } .developer-credit { letter-spacing:0; padding:3px 0; border-bottom:1px solid #adc1cc; color:#345669; }
.developer-credit strong { font-weight:600; color:#133c55; } .developer-credit:hover { color:var(--blue); }
.reading-progress { display:none; position:fixed; z-index:90; top:0; left:0; width:100%; height:4px; background:#0b283c26; pointer-events:none; }
.js-enabled .reading-progress { display:block; } .reading-progress span { display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:left; background:#0076a7; }
.whatsapp-float { position:fixed; z-index:45; bottom:calc(22px + env(safe-area-inset-bottom)); right:24px; display:flex; align-items:center; justify-content:center; gap:10px; height:58px; min-width:58px; border-radius:50px; padding:0 18px; background:#0d6944; color:white; border:1px solid #72b397; box-shadow:0 6px 24px #071e3833; transition:transform .25s,background .25s; }
.whatsapp-label { font-size:14px; } .whatsapp-float:hover { transform:translateY(-4px); background:#095536; }
@media(max-width:1100px) { .brand-grid { grid-template-columns:repeat(4,1fr); } .principles article { padding:24px; } .project-plate figcaption { flex-wrap:wrap; gap:4px; } }
@media(max-width:760px) {
 .hero,.site-header,.site-header.scrolled,.capabilities,.contact,.approach { border-radius:6px; }
 .hero-topline { font-size:12px; letter-spacing:.04em; } .hero-bottom .media-credit { font-size:12px; max-width:140px; }
 .trusted { padding-top:45px; padding-bottom:35px; } .trusted-heading { align-items:start; } .trusted-heading>p { font-size:12px; } .brand-grid li { min-height:105px; } .brand-grid img { width:min(106px,90%); height:70px; }
 .company { padding-top:60px; } .section-label { font-size:12px; }
 .principles { display:block; } .principles article { display:block; border-right:0; border-bottom:1px solid var(--line); padding:26px; } .principles article:last-child { border-bottom:0; } .principles h3 { margin:16px 0; }
 .structure-panel { padding:18px; border-radius:2px; } .study-top { font-size:12px; }
 .project-gallery { gap:28px; grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:45px; }
 .project-plate,.project-plate:nth-child(-n+2) { grid-column:span 1; } .project-plate:first-child { grid-column:1/-1; }
 .project-plate figcaption { font-size:14px; display:block; } .project-plate figcaption>span { display:block; } .project-plate figcaption>span:last-child { margin-top:5px; }
 .plate-image { padding:6px; } .plate-marker { top:16px; left:16px; }
 .project-plate .plate-image img,.project-plate:nth-child(-n+2) .plate-image img { aspect-ratio:1; }
 .project-plate:first-child .plate-image img { aspect-ratio:1.2; }
 .register-heading>span:last-child { display:none; } .process-content { padding:55px 24px; }
 .service-image-label { font-size:12px; } .people-photo figcaption { font-size:12px; }
 .location-heading { display:block; } .location-heading .text-link { margin-top:15px; } .map-frame iframe { height:330px; } .location-footer { flex-direction:column; gap:8px; }
 .footer { padding-bottom:100px; } .footer-bottom { font-size:12px; }
 .whatsapp-float { right:18px; bottom:calc(18px + env(safe-area-inset-bottom)); width:56px; height:56px; padding:0; } .whatsapp-label { display:none; }
}
@media(max-width:480px) {
 .brand-grid { grid-template-columns:repeat(2,1fr); } .brand-grid li { min-height:105px; } .trusted-heading { display:block; } .trusted-heading>p { margin-top:16px; font-size:14px; } .trusted-heading>p br { display:none; }
 .project-gallery { gap:24px 14px; } .plate-marker { width:28px; height:28px; font-size:12px; top:13px; left:13px; }
 .project-plate figcaption { font-size:14px; } .project-register h3 { font-size:28px; } .process-content .display { font-size:36px; }
 .process li { gap:15px; } .process h3 { font-size:23px; } .process .process-number { min-width:32px; height:32px; font-size:14px; }
 .study-top>span:last-child { display:none; } .location-footer { font-size:12px; } .footer-bottom { gap:14px; }
}
@media(prefers-reduced-motion:reduce) { .process li:hover { transform:none; } .process li::after { transform:scaleX(1); } .brand-grid li:hover img,.whatsapp-float:hover { transform:none; } }
@media(max-width:760px) { .hero-bottom { flex-wrap:wrap; padding-right:72px; justify-content:flex-start; } .hero-bottom .video-toggle { margin:0; } .hero-bottom .media-credit { text-align:left; max-width:none; } }
.hero-index { padding-right:150px; }
