*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Inter",sans-serif;background:#f5f5f2;color:#111;overflow-x:hidden}
img{width:100%;display:block}a{color:inherit;text-decoration:none}
:root{--black:#101010;--dark:#151515;--white:#fff;--accent:#27b472;--accent-dark:#1a8a57;--indigo:#606db3;--indigo-dark:#333c66;--indigo-light:#9aa3d6;--light:#f5f5f2;--container:1400px}
.container{width:min(var(--container),calc(100% - 80px));margin:auto}
.navbar{position:fixed;top:0;left:0;width:100%;height:90px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;z-index:1000;color:#fff;transition:background .4s ease,height .4s ease}
.navbar.scrolled{background:rgba(18,22,46,.92);backdrop-filter:blur(15px);height:70px}
.logo{font-size:21px;font-weight:900;letter-spacing:-1px}.logo span{color:var(--accent)}
.nav-links{display:flex;gap:35px}.nav-links a{font-size:13px;text-transform:uppercase;letter-spacing:1px;position:relative}
.nav-links a:after{content:"";position:absolute;bottom:-8px;left:0;width:0;height:2px;background:var(--accent);transition:width .3s}.nav-links a:hover:after{width:100%}
.nav-cta{padding:13px 22px;border:1px solid rgba(255,255,255,.5);font-size:12px;text-transform:uppercase;letter-spacing:1px;transition:.3s}.nav-cta:hover{background:var(--accent);color:#000;border-color:var(--accent)}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:25px}
.hero{height:100vh;min-height:700px;position:relative;display:flex;align-items:center;overflow:hidden;color:#fff;background:#0a1220}
.hero-slides{position:absolute;inset:0}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s cubic-bezier(.6,0,.2,1)}
.hero-slide.active{opacity:1}
.hero-background{position:absolute;inset:0;overflow:hidden;background:#0c1420}
.hero-illustration{position:absolute;inset:0;width:100%;height:100%;transform:scale(1.1);transition:transform 6.4s linear}
.hero-background img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 6.4s linear}
.hero-slide.active .hero-illustration,.hero-slide.active .hero-background img{transform:scale(1.18)}
.hero-color-panel{position:absolute;inset:0;z-index:2;clip-path:polygon(0 0,46% 0,38% 100%,0 100%);transition:clip-path 1.6s cubic-bezier(.6,0,.2,1);opacity:.78}
.hero-color-panel.panel-a{background:linear-gradient(135deg,#1c2140,var(--indigo) 140%)}
.hero-color-panel.panel-b{background:linear-gradient(135deg,#242c52,var(--indigo) 140%)}
.hero-color-panel.panel-c{background:linear-gradient(135deg,#1c2140,#4a5590 140%)}
.hero-color-panel.panel-d{background:linear-gradient(135deg,#242c52,#7480c2 140%)}
@keyframes panelWipe{0%{clip-path:polygon(0 0,46% 0,38% 100%,0 100%)}40%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}70%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}100%{clip-path:polygon(0 0,46% 0,38% 100%,0 100%)}}
.hero-color-panel.wiping{animation:panelWipe 2.2s cubic-bezier(.6,0,.2,1)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,8,14,.55),transparent 22%);z-index:1;pointer-events:none}
.hero-content{position:relative;z-index:3;width:min(1200px,calc(100% - 80px));margin:auto;height:1px}
.hero-slide-text{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;opacity:0;visibility:hidden;transition:opacity .8s ease}
.hero-slide-text.active{opacity:1;visibility:visible}
.hero-label{font-size:13px;letter-spacing:3px;margin-bottom:25px;color:rgba(255,255,255,.85)}.hero h1{font-size:clamp(38px,5.4vw,84px);line-height:.95;letter-spacing:-3px;max-width:900px}.hero h1 span{display:block;color:var(--accent)}
.hero p{margin-top:35px;max-width:520px;font-size:18px;line-height:1.6;color:rgba(255,255,255,.8)}
.hero-buttons{margin-top:40px;display:flex;gap:15px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:17px 28px;text-transform:uppercase;font-size:12px;letter-spacing:1px;font-weight:700;transition:.3s}
.btn-primary{background:var(--accent);color:#000}.btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}.btn-outline:hover{background:#fff;color:#000}
.hero-tabs{position:absolute;bottom:0;left:0;width:100%;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(8,10,14,.55);backdrop-filter:blur(6px);border-top:1px solid rgba(255,255,255,.12)}
.hero-tab{position:relative;text-align:left;background:none;border:0;border-right:1px solid rgba(255,255,255,.12);padding:16px 20px 18px;cursor:pointer;overflow:hidden}
.hero-tab:last-child{border-right:0}
.hero-tab-label{display:block;font-size:12px;letter-spacing:.3px;line-height:1.3;color:rgba(255,255,255,.55);transition:color .3s}
.hero-tab.active .hero-tab-label{color:#fff}
.hero-tab-progress{position:absolute;top:0;left:0;height:2px;width:0;background:var(--accent)}
.hero-tab.active .hero-tab-progress{animation:heroTabFill 6s linear forwards}
@keyframes heroTabFill{from{width:0}to{width:100%}}
.chat-bubble{position:fixed;right:28px;bottom:28px;width:54px;height:54px;border-radius:50%;background:var(--accent);color:#000;display:flex;align-items:center;justify-content:center;z-index:500;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .3s}
.chat-bubble:hover{transform:scale(1.08)}
.chat-bubble svg{width:24px;height:24px}
.section{padding:140px 0}.section-label{font-size:11px;letter-spacing:3px;font-weight:700;color:#777;margin-bottom:30px}
.intro{background:var(--light)}.intro-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:100px}.intro h2{font-size:clamp(50px,6vw,90px);line-height:.95;letter-spacing:-4px}.intro h2 span{display:block;color:#999}.intro-text{padding-top:10px}.intro-text p{font-size:18px;line-height:1.7;margin-bottom:25px;color:#555}
.text-link{display:inline-flex;gap:15px;font-weight:700;border-bottom:1px solid;padding-bottom:7px}
.stats-section{background:var(--dark);color:#fff;padding:80px 0;position:relative;overflow:hidden}
.timeline-section{background:var(--dark);color:#fff;padding:120px 0;position:relative;overflow:hidden}
.timeline-grid-bg{position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(39,180,114,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(39,180,114,.07) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,black 20%,transparent 80%)}
.timeline-section .container{position:relative;z-index:1}
.timeline-title{text-align:center;font-size:clamp(30px,4vw,48px);line-height:1.2;letter-spacing:-1px;max-width:640px;margin:0 auto 100px}
.timeline-title span{color:var(--accent)}
.timeline{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.timeline-track{position:absolute;top:31px;left:16.66%;right:16.66%;height:2px;background:rgba(255,255,255,.15);z-index:0;overflow:visible}
.timeline-track-fill{position:absolute;inset:0;background:var(--accent);transform:scaleX(0);transform-origin:left}
.timeline-pulse{position:absolute;top:50%;left:0;width:8px;height:8px;background:var(--accent);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 14px 4px rgba(39,180,114,.7);animation:travelX 3.2s linear infinite}
.timeline-item{position:relative;z-index:1;text-align:center;opacity:0;transform:translateY(40px)}
.timeline-icon{width:64px;height:64px;border-radius:50%;background:var(--dark);border:1.5px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;position:relative;z-index:2;color:var(--accent);animation:iconPulse 2.6s ease-in-out infinite}
.timeline-icon:before{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(39,180,114,.5);animation:ringExpand 2.6s ease-out infinite}
.timeline-icon svg{width:26px;height:26px}
.timeline-item.item-2 .timeline-icon,.timeline-item.item-2 .timeline-icon:before{animation-delay:.5s}
.timeline-item.item-3 .timeline-icon,.timeline-item.item-3 .timeline-icon:before{animation-delay:1s}
.timeline-item:hover .timeline-icon{transform:scale(1.08);box-shadow:0 0 24px 4px rgba(39,180,114,.35);transition:transform .3s ease,box-shadow .3s ease}
.timeline-marker{font-weight:800;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.timeline-item p{color:#aaa;font-size:16px;line-height:1.6;max-width:280px;margin:0 auto}
@keyframes travelX{0%{left:0%}100%{left:100%}}
@keyframes travelY{0%{top:0%}100%{top:100%}}
@keyframes iconPulse{0%,100%{box-shadow:0 0 0 0 rgba(39,180,114,.4)}50%{box-shadow:0 0 0 12px rgba(39,180,114,0)}}
@keyframes ringExpand{0%{transform:scale(.8);opacity:1}100%{transform:scale(1.6);opacity:0}}
@media(max-width:760px){
    .timeline{grid-template-columns:1fr;gap:56px;padding-left:10px}
    .timeline-track{top:10px;bottom:10px;left:31px;right:auto;width:2px;height:auto}
    .timeline-track-fill{transform:scaleY(0);transform-origin:top}
    .timeline-pulse{top:0;left:50%;animation-name:travelY}
    .timeline-item{text-align:left;padding-left:88px;min-height:64px}
    .timeline-icon{position:absolute;left:0;top:0;margin:0}
    .timeline-item p{margin:0}
}
@media(prefers-reduced-motion:reduce){
    .timeline-pulse,.timeline-icon,.timeline-icon:before{animation:none}
    .timeline-pulse{display:none}
}
.stats-anim{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.stats-anim .pulse{display:none}}
.stats-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr)}.stat{padding:30px;border-left:1px solid rgba(255,255,255,.15)}.stat strong{display:block;font-size:70px;line-height:1;color:var(--accent)}.stat span{display:block;margin-top:10px;color:#aaa;text-transform:uppercase;letter-spacing:2px;font-size:11px}
.services{background:#fff}.section-header h2{font-size:clamp(50px,6vw,90px);line-height:.95;letter-spacing:-4px;max-width:900px}.section-header h2 span{display:block;color:#aaa}
.services-grid{margin-top:80px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ddd;box-shadow:0 40px 80px -30px rgba(16,16,16,.25)}.service-card{padding:45px;min-height:350px;background:#fff;position:relative;overflow:hidden;transition:color .4s,box-shadow .45s cubic-bezier(.4,0,.2,1),transform .45s cubic-bezier(.4,0,.2,1)}.service-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--indigo-dark),#20264a);transform:translateY(100%);transition:transform .5s cubic-bezier(.7,0,.2,1);z-index:0}.service-card:hover{color:#fff;transform:translateY(-10px);box-shadow:0 35px 60px -20px rgba(16,16,16,.4),0 12px 25px rgba(16,16,16,.15);z-index:2}.service-card:hover:before{transform:translateY(0)}.service-card>*{position:relative;z-index:1}.service-number{color:var(--accent);font-size:13px;margin-bottom:70px}.service-card h3{font-size:32px;line-height:1;max-width:250px}.service-card p{margin-top:20px;color:#888;line-height:1.6}.service-card:hover p{color:#c7cae0}.service-card a{position:absolute;bottom:35px;font-size:12px;text-transform:uppercase;letter-spacing:1px}
.service-popup{position:absolute;top:24px;right:24px;z-index:2;display:flex;align-items:center;gap:8px;background:var(--accent);color:#000;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:11px 18px;border-radius:40px;opacity:0;transform:translateY(-12px) scale(.85);transition:opacity .35s ease,transform .4s cubic-bezier(.34,1.56,.64,1);pointer-events:none;box-shadow:0 14px 30px rgba(0,0,0,.3)}
.service-popup svg{width:13px;height:13px}
.service-card:hover .service-popup{opacity:1;transform:translateY(0) scale(1)}
@media(prefers-reduced-motion:reduce){.service-popup{transition:opacity .2s ease}}
.image-section{height:80vh;min-height:600px;position:relative;overflow:hidden;color:#fff}.parallax-image{position:absolute;inset:-15% 0}.parallax-image img{width:100%;height:120%;object-fit:cover}.image-section:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.15))}.image-caption{position:absolute;z-index:2;bottom:80px;left:8%}.image-caption span{font-size:11px;letter-spacing:3px}.image-caption h2{margin-top:20px;font-size:clamp(50px,7vw,110px);line-height:.9;letter-spacing:-5px}.image-caption em{color:var(--accent);font-style:normal}
.projects{background:var(--light)}.projects-header{display:flex;justify-content:space-between;align-items:end;margin-bottom:70px}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.project-card{overflow:hidden}.project-card.large{grid-column:span 2}.project-image{overflow:hidden;height:550px;position:relative;background:linear-gradient(135deg,#1c2140,#333c66 60%,#242c52)}.project-image:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(39,180,114,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(39,180,114,.08) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}.project-card:not(.large) .project-image{height:450px}.project-image img{height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}.project-card:hover .project-image img{transform:scale(1.08)}.project-info{padding:25px 0 40px}.project-info span{font-size:10px;letter-spacing:2px;color:#777}.project-info h3{margin-top:10px;font-size:28px}.project-info a{display:inline-block;margin-top:20px;font-size:12px;text-transform:uppercase;font-weight:700}
.more-projects-label{font-size:11px;letter-spacing:3px;font-weight:700;color:#777;margin:90px 0 35px}
.featured-strip{position:relative;overflow:hidden;width:100%;height:520px}
.featured-strip-bg{position:absolute;inset:0}
.strip-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1.1s ease,transform 6s ease}
.strip-bg.active{opacity:1;transform:scale(1.12)}
.featured-strip-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(5,8,14,.1),rgba(5,8,14,.82))}
.feature-columns{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);height:100%}
.feature-col{position:relative;display:block;border-right:1px solid rgba(255,255,255,.14);color:#fff}
.feature-col:last-child{border-right:0}
.feature-col-label{position:absolute;left:24px;bottom:26px;right:24px;transition:opacity .3s ease}
.feature-col-label span{font-size:10px;letter-spacing:2px;color:rgba(255,255,255,.75);display:block}
.feature-col-label h3{margin-top:8px;font-size:17px;line-height:1.25;font-weight:700}
.feature-col-panel{position:absolute;inset:0;opacity:0;transform:translateY(14px);transition:opacity .45s ease,transform .45s ease;padding:24px;display:flex;flex-direction:column;justify-content:flex-end}
.feature-col.active .feature-col-panel{opacity:1;transform:translateY(0)}
.feature-col.active .feature-col-label{opacity:0}
.feature-col-panel span{font-size:10px;letter-spacing:2px;color:rgba(255,255,255,.85)}
.feature-col-panel h3{margin-top:10px;font-size:21px;line-height:1.25;font-weight:700}
.feature-col-panel .arrow{margin-top:18px;width:34px;height:34px;border:1px solid rgba(255,255,255,.6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;transition:transform .3s}
.feature-col.active .feature-col-panel .arrow{transform:translateX(3px)}
.feature-col-panel.panel-a{background:linear-gradient(160deg,rgba(51,60,102,.92),rgba(124,134,209,.92))}
.feature-col-panel.panel-b{background:linear-gradient(160deg,rgba(59,70,128,.92),rgba(135,144,219,.92))}
.feature-col-panel.panel-c{background:linear-gradient(160deg,rgba(26,138,87,.92),rgba(39,180,114,.92))}
.feature-col-panel.panel-d{background:linear-gradient(160deg,rgba(26,138,87,.92),rgba(39,180,114,.92))}
.statement{background:var(--dark);color:#fff;position:relative;overflow:hidden}
.statement-bg{position:absolute;inset:0;z-index:0}
.statement-bg img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scaleX(-1)}
.statement-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--dark) 0%,var(--dark) 28%,rgba(21,21,21,.82) 42%,rgba(21,21,21,.35) 60%,rgba(21,21,21,.05) 78%,transparent 92%)}
.statement .container{position:relative;z-index:1}
.statement-title{font-size:clamp(46px,6.4vw,92px);line-height:.95;letter-spacing:-4px;max-width:650px}.statement-title span{display:block;color:var(--accent)}
.cta{min-height:600px;background:linear-gradient(160deg,#1c2140 0%,#20264a 55%,#12162e 100%);color:#fff;display:flex;align-items:center;text-align:center}.cta-content{display:flex;align-items:center;flex-direction:column}.cta h2{font-size:clamp(50px,7vw,100px);line-height:.9;letter-spacing:-5px;max-width:1000px}.cta p{margin:30px 0;color:#aaa;font-size:18px}
footer{background:#0c0c0c;color:#fff;padding-top:90px;position:relative;overflow:hidden}
footer:before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(39,180,114,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(39,180,114,.06) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.footer-grid{position:relative;z-index:1;display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px;padding-bottom:80px}.footer-grid .logo img{height:40px;width:auto;object-fit:contain;display:block}.footer-grid p{color:#888;margin-top:20px;max-width:300px;line-height:1.6}.footer-grid h4{margin-bottom:20px}.footer-grid>div>a:not(.logo){display:block;color:#888;margin-bottom:12px}.footer-bottom{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.1);padding:25px 0;text-align:center;color:#666;font-size:11px}
.reveal{opacity:0;transform:translateY(60px)}
/* Projects page — inspired layout */
.project-hero{position:relative; height:56vh; min-height:420px; display:flex; align-items:flex-end; color:#fff; overflow:hidden}
.project-hero .hero-media{position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.45) contrast(1.05);}
.project-hero .hero-overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,12,18,.4), rgba(10,12,18,.8));}
.hero-content-wrap{position:relative; z-index:4; width:100%}
.hero-content-inner{display:flex; align-items:flex-end; justify-content:space-between; gap:28px; padding:44px 32px 72px;}
.project-meta{max-width:820px}
.project-meta .kicker{color:var(--green-light); margin-bottom:8px}
.project-meta h1{font-size:clamp(28px,4.2vw,44px); margin-bottom:12px}
.project-meta .intro-lead{color:rgba(255,255,255,.9); max-width:700px}
.project-side{width:320px}
.project-side-panel{background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06); padding:22px; border-radius:6px}
.project-side-panel .meta-row{display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.03)}
.project-side-panel .meta-row strong{font-size:12px; color:rgba(255,255,255,.85)}
.project-side-panel .meta-row span{font-size:13px; color:rgba(255,255,255,.95); max-width:160px; text-align:right}

.project-body{padding:80px 0}
.project-body-grid{display:grid; grid-template-columns:1.4fr .9fr; gap:40px; align-items:start}
.project-content h2{font-size:24px; margin-bottom:8px}
.project-content h3{font-size:18px; margin-top:18px}
.project-content p{color:var(--text); margin-bottom:16px}
.project-gallery .gallery-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
.gallery-item{background:#fff; overflow:hidden}
.gallery-item img{width:100%; height:100%; object-fit:cover; display:block}

@media(max-width:900px){
	.hero-content-inner{flex-direction:column; align-items:flex-start}
	.project-side{width:100%}
	.project-body-grid{grid-template-columns:1fr; gap:28px}
	.project-hero{height:48vh}
}

/* Improvements: spacing, caption and hover effects */
.project-meta h1 em{font-style:normal; color:var(--green-light)}
.project-side-panel a.btn{width:100%; text-align:center}
.gallery-item{border-radius:6px; overflow:hidden; box-shadow:0 8px 24px rgba(15,20,30,0.08); transition:transform .35s ease, box-shadow .35s ease}
.gallery-item:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(15,20,30,0.12)}
.project-side-panel{position:relative}
@media(min-width:1000px){.project-side-panel{position:sticky; top:96px}}

.project-hero .kicker{font-size:12px; letter-spacing:.18em; text-transform:uppercase}
.project-meta .intro-lead{font-size:15.5px}

/* small-screen adjustments */
@media(max-width:520px){
	.hero-content-inner{padding:28px 18px 48px}
	.project-meta h1{font-size:20px}
}
@media(max-width:900px){.nav-links,.nav-cta{display:none}.menu-toggle{display:block}.intro-grid{grid-template-columns:1fr;gap:50px}.stats-grid{grid-template-columns:repeat(2,1fr)}.services-grid{grid-template-columns:1fr}.projects-grid{grid-template-columns:1fr}.project-card.large{grid-column:span 1}.project-image,.project-card:not(.large) .project-image{height:400px}.projects-header{display:block}.projects-header .text-link{margin-top:30px}.footer-grid{grid-template-columns:1fr}.hero-tabs{grid-template-columns:repeat(4,minmax(160px,1fr));overflow-x:auto}.hero-tab-label{font-size:11px}.featured-strip{height:440px}.feature-columns{grid-template-columns:repeat(4,minmax(200px,1fr));overflow-x:auto;-webkit-overflow-scrolling:touch}}
@media(max-width:600px){.container{width:calc(100% - 40px)}.navbar{padding:0 20px}.hero-content{width:calc(100% - 40px)}.hero h1{letter-spacing:-3px}.hero-tabs{grid-template-columns:none;grid-auto-flow:column;overflow-x:auto;-webkit-overflow-scrolling:touch}.hero-tab{min-width:60vw;padding:12px 16px 14px}.hero-tab-label{font-size:10.5px}.stats-grid{grid-template-columns:1fr}.stat{border-left:none;border-bottom:1px solid rgba(255,255,255,.15)}.section{padding:90px 0}.chat-bubble{right:18px;bottom:18px;width:48px;height:48px}.featured-strip{height:400px}.feature-columns{grid-auto-flow:column}.feature-col{min-width:70vw}}

/* ============================================================
   INTERIOR PAGES — shares navbar/footer/tokens with index.html
   ============================================================ */
.mobile-open{display:flex!important;position:fixed;inset:90px 0 0 0;background:rgba(8,10,14,.98);flex-direction:column;align-items:flex-start;padding:40px;gap:22px;backdrop-filter:blur(10px)}
.mobile-open a{font-size:22px}

/* Page header (dark hero band for interior pages) */
.page-header{background:var(--black);color:#fff;padding:170px 0 90px;position:relative;overflow:hidden}
.page-header-bg{position:absolute;inset:0;z-index:0}
.page-header-bg img{width:100%;height:100%;object-fit:cover;object-position:70% center}
.page-header-bg:before{content:"";position:absolute;inset:0;background:var(--indigo);mix-blend-mode:color;opacity:.55}
.page-header-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--black) 0%,var(--black) 28%,rgba(16,16,16,.86) 42%,rgba(16,16,16,.45) 58%,rgba(16,16,16,.1) 75%,transparent 92%)}
.page-header:before{content:"";position:absolute;inset:0;z-index:1;background-image:linear-gradient(rgba(39,180,114,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(39,180,114,.06) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.page-header .container{position:relative;z-index:2}
.breadcrumb{position:relative;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:28px}
.breadcrumb a{color:rgba(255,255,255,.45);transition:color .3s}
.breadcrumb a:hover{color:var(--accent)}
.page-header h1{position:relative;font-size:clamp(38px,5.6vw,76px);line-height:1.15;letter-spacing:-3px;max-width:920px}
.page-header h1 .accent{color:var(--accent)}
.type-line{display:block;overflow:hidden;white-space:nowrap;width:0}
.type-line.line-2{border-right:3px solid transparent}
.type-line.line-3{border-right:3px solid transparent}
.page-header.typing-play .type-line.line-1{animation:typeLine1 1.1s steps(21,end) forwards}
.page-header.typing-play .type-line.line-2{animation:typeLine2 1s steps(20,end) 1.3s forwards}
.page-header.typing-play .type-line.line-3{animation:typeLine3 .7s steps(21,end) 2.3s forwards}
@keyframes typeLine1{from{width:0}to{width:100%}}
@keyframes typeLine2{from{width:0}to{width:100%}}
@keyframes typeLine3{from{width:0}to{width:100%}}
@keyframes caretBlink{0%,100%{border-color:transparent}50%{border-color:var(--accent)}}
@media(prefers-reduced-motion:reduce){
    .type-line{width:100%!important;animation:none!important}
    .type-line.line-2{border-right-color:transparent!important}
}
.page-header .lead{position:relative;margin-top:28px;max-width:620px;font-size:18px;line-height:1.65;color:rgba(255,255,255,.72)}

/* Generic section furniture reused across interior pages */
.eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:700;color:#777;margin-bottom:22px}
.eyebrow .tri{width:8px;height:8px;border-radius:50%;background:var(--accent);display:inline-block}
.section-title{font-size:clamp(30px,3.6vw,46px);line-height:1.05;letter-spacing:-1.5px;max-width:760px}
.section-sub{margin-top:18px;max-width:640px;color:#666;font-size:16px;line-height:1.7}

/* Value / team / quality grids */
.value-grid,.team-grid,.quality-grid{margin-top:60px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ddd;border:1px solid #ddd}
.value-card,.team-card,.quality-card{background:#fff;padding:40px}
.value-card .vn,.quality-card .qc{color:var(--accent);font-size:12px;font-weight:700;letter-spacing:1px;margin-bottom:18px;display:block}
.value-card h3{font-size:21px;margin-bottom:12px}
.value-card p,.quality-card p{color:#666;line-height:1.65;font-size:15px}
.team-card{text-align:center;padding:50px 30px}
.team-avatar{width:76px;height:76px;border-radius:50%;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:20px;letter-spacing:.5px}
.team-card h4{font-size:18px;margin-bottom:6px}
.team-card .role{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#888}

/* Story / split content blocks */
.split-block{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.split-block img{border-radius:2px}
.split-block video{width:100%;display:block;border-radius:2px;aspect-ratio:4/5;object-fit:cover;max-height:640px}
.split-block .cap{margin-top:16px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#888}
.split-block p{color:#555;line-height:1.75;font-size:16px;margin-bottom:20px;text-align:justify}
.mvv-row{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:40px}
.mvv-row h4{font-size:14px;letter-spacing:1px;text-transform:uppercase;color:var(--accent-dark);margin-bottom:10px}
.mvv-row p{font-size:14.5px;color:#666;line-height:1.6}

/* Service detail (services.html anchored sections) */
.service-detail{padding:120px 0;border-top:1px solid #e2e2df}
.service-detail:first-of-type{border-top:none}
.service-detail-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:80px;align-items:start}
.spec-list{list-style:none;margin-top:10px}
.spec-list li{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid #eee;font-size:15px;line-height:1.6;color:#444}
.spec-list li strong{color:#111}
.spec-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-top:7px}
.side-card{background:var(--light);border:1px solid #e2e2df;padding:30px}
.side-card h4{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#888;margin-bottom:18px}
.sc-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #e2e2df;font-size:13.5px}
.sc-row span:first-child{color:#888}
.sc-row span:last-child{color:#111;font-weight:600;text-align:right}
.side-card .btn{width:100%;justify-content:center;margin-top:22px}
.service-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:60px}
.service-nav a{padding:11px 20px;border:1px solid #ddd;font-size:12px;text-transform:uppercase;letter-spacing:1px;transition:.3s}
.service-nav a:hover,.service-nav a.active{background:var(--black);color:#fff;border-color:var(--black)}
.process-grid{margin-top:60px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#ddd;border:1px solid #ddd}
.proc-step{background:#fff;padding:36px 30px}
.proc-step .pn{font-size:11px;letter-spacing:1.5px;color:var(--accent-dark);font-weight:700;margin-bottom:16px;text-transform:uppercase}
.proc-step h4{font-size:18px;margin-bottom:10px}
.proc-step p{font-size:14px;color:#666;line-height:1.6}

/* Projects filter + gallery */
.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:50px 0 60px}
.filter-btn{padding:10px 22px;border:1px solid #ccc;background:none;font-size:12px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:.3s}
.filter-btn:hover{border-color:#111}
.filter-btn.active{background:#111;color:#fff;border-color:#111}
.project-card[hidden]{display:none}
.project-card .project-image{position:relative}
.project-tag{position:absolute;top:18px;left:18px;z-index:2;background:rgba(10,10,10,.75);color:#fff;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;padding:8px 14px;backdrop-filter:blur(4px)}

/* Contact page */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:start;margin-top:20px}
.info-row{display:flex;gap:18px;padding:22px 0;border-bottom:1px solid #e2e2df}
.info-row:first-child{padding-top:0}
.info-ic{flex:none;width:44px;height:44px;border-radius:50%;background:var(--light);display:flex;align-items:center;justify-content:center;color:var(--accent-dark)}
.info-label{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#888;margin-bottom:6px}
.info-value{font-size:15.5px;color:#111;font-weight:500}
.map-frame{margin-top:30px;height:280px;border:1px solid #e2e2df;overflow:hidden}
.map-frame iframe{width:100%;height:100%;border:0}
.contact-form{background:var(--light);border:1px solid #e2e2df;padding:44px}
.field{margin-bottom:22px}
.field label{display:block;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#777;margin-bottom:10px}
.field input,.field select,.field textarea{width:100%;padding:14px 16px;border:1px solid #ccc;background:#fff;font-family:inherit;font-size:14.5px;color:#111}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.field textarea{min-height:120px;resize:vertical}
.contact-form .btn{width:100%;justify-content:center;border:0;cursor:pointer;font-family:inherit}

@media(max-width:900px){.value-grid,.team-grid,.quality-grid{grid-template-columns:1fr}.split-block{grid-template-columns:1fr;gap:40px}.mvv-row{grid-template-columns:1fr}.service-detail-grid{grid-template-columns:1fr;gap:50px}.process-grid{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr;gap:50px}.page-header{padding:150px 0 70px}}