:root{
--bg:#080a0b;
--ink:#111416;
--cream:#f4f0e8;
--white:#fff;
--muted:rgba(255,255,255,.62);
--dark-muted:rgba(17,20,22,.58);
--line:rgba(255,255,255,.13);
--dark-line:rgba(17,20,22,.13);
--brand:#08a7d5;
--brand-deep:#05779a;
--accent:#f39a31;
--aura:rgba(8,167,213,.24);
--aura-2:rgba(243,154,49,.2);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:auto}
body{font-family:"DM Sans",sans-serif;background:var(--bg);color:var(--white);overflow-x:hidden}
body:has(.mobile-menu.open){overflow:hidden}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
button{border:0}
.site-header{position:fixed;top:0;left:0;right:0;height:72px;z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid rgba(255,255,255,.11);background:rgba(6,8,9,.16);backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%);transition:.5s}
.site-header.scrolled{height:60px;background:rgba(6,8,9,.78)}
.logo{display:flex;align-items:center;gap:11px;font-family:Manrope,sans-serif;font-weight:800;font-size:16px;letter-spacing:-.055em}
.logo img{height:30px;width:auto;display:block;object-fit:contain}
.logo-fallback{display:flex;align-items:center;gap:10px}
.logo-orbit{width:28px;height:28px;border:1px solid rgba(255,255,255,.8);border-radius:50%;position:relative}
.logo-orbit:before{content:"";position:absolute;width:9px;height:9px;top:8px;left:8px;border-radius:50%;background:var(--brand);box-shadow:8px 3px 0 var(--accent)}
.nav{display:flex;align-items:center;gap:31px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.17em}
.nav a{opacity:.72;transition:.3s}
.nav a:hover{opacity:1}
.header-cta{padding:11px 16px;border-radius:100px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 9px 28px rgba(0,0,0,.15);backdrop-filter:blur(14px);opacity:1!important}
.header-cta:hover{background:rgba(255,255,255,.92);color:#0b0e0f;transform:translateY(-1px)}
.menu-toggle{display:none;color:#fff;background:none;font-size:22px;cursor:pointer}
.mobile-menu{display:none}
.hero{height:100svh;min-height:700px;position:relative;overflow:hidden}
.hero-slides,.hero-slide,.hero-image{position:absolute;inset:0}
.hero-slide{opacity:0;visibility:hidden}
.hero-slide.active{opacity:1;visibility:visible}
.hero-image{inset:-4%;background-size:cover;background-position:center;transform:scale(1.08)}
.hero-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,10,.84),rgba(5,8,10,.34) 49%,rgba(5,8,10,.1)),linear-gradient(0deg,rgba(5,8,10,.7),transparent 47%)}
.slide-1 .hero-image{background-image:url("https://images.unsplash.com/photo-1587595431973-160d0d94add1?auto=format&fit=crop&w=2400&q=90")}
.slide-2 .hero-image{background-image:url("https://images.unsplash.com/photo-1526392060635-9d6019884377?auto=format&fit=crop&w=2400&q=90")}
.slide-3 .hero-image{background-image:url("https://images.unsplash.com/photo-1516026672322-bc52d61a55d5?auto=format&fit=crop&w=2400&q=90")}
.slide-4 .hero-image{background-image:url("https://images.unsplash.com/photo-1548013146-72479768bada?auto=format&fit=crop&w=2400&q=90")}
.hero-content{position:absolute;z-index:3;left:8vw;bottom:14vh;width:min(870px,82vw)}
.hero-kicker{display:flex;align-items:center;gap:11px;text-transform:uppercase;letter-spacing:.27em;font-size:9px;font-weight:800;margin-bottom:25px;opacity:0}
.hero-kicker i{width:30px;height:1px;background:linear-gradient(90deg,var(--brand),var(--accent));display:block}
.hero-title{font-family:Manrope,sans-serif;font-size:clamp(58px,8.6vw,142px);line-height:.87;letter-spacing:-.085em;font-weight:700;max-width:920px;overflow:hidden}
.hero-title-line{display:block;overflow:hidden}
.hero-title-word{display:inline-block;transform:translateY(120%)}
.hero-description{font-size:15px;line-height:1.7;max-width:510px;margin-top:31px;color:rgba(255,255,255,.76);opacity:0}
.hero-actions{display:flex;gap:11px;margin-top:31px;opacity:0}
.cta{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:48px;padding:13px 19px;border-radius:100px;text-transform:uppercase;letter-spacing:.15em;font-size:9px;font-weight:800;overflow:hidden;cursor:pointer;isolation:isolate;transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .35s}
.cta:before{content:"";position:absolute;inset:0;opacity:0;transition:.45s cubic-bezier(.16,1,.3,1);z-index:-1}
.cta:hover{transform:translateY(-2px)}
.cta-primary{color:#0a0c0d;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.9);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 35px rgba(0,0,0,.16);backdrop-filter:blur(15px)}
.cta-primary:before{background:linear-gradient(90deg,var(--brand),var(--accent))}
.cta-primary:hover:before{opacity:1}
.cta-primary:hover{color:#fff}
.cta-secondary{color:#fff;border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 12px 35px rgba(0,0,0,.12);backdrop-filter:blur(18px) saturate(135%)}
.cta-secondary:before{background:linear-gradient(120deg,rgba(8,167,213,.24),rgba(243,154,49,.2))}
.cta-secondary:hover:before{opacity:1}
.cta-line{width:12px;height:1px;background:currentColor;position:relative;transition:.35s}
.cta-line:after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-right:1px solid currentColor;border-top:1px solid currentColor;transform:rotate(45deg)}
.cta:hover .cta-line{transform:translateX(3px)}
.hero-meta{position:absolute;z-index:4;right:4vw;bottom:8vh;display:flex;align-items:center;gap:19px;font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.slide-number{font-family:Manrope;font-size:18px;color:#fff;letter-spacing:-.04em}
.slide-progress{width:110px;height:1px;background:rgba(255,255,255,.2);position:relative}
.slide-progress-fill{position:absolute;inset:0 auto 0 0;width:25%;background:linear-gradient(90deg,var(--brand),var(--accent));transform-origin:left}
.hero-scroll{position:absolute;z-index:4;left:4vw;bottom:6vh;display:flex;align-items:center;gap:14px;font-size:8px;text-transform:uppercase;letter-spacing:.24em;writing-mode:vertical-rl;transform:rotate(180deg);color:rgba(255,255,255,.54)}
.hero-scroll:before{content:"";height:52px;width:1px;background:linear-gradient(var(--brand),transparent)}
.slider-controls{position:absolute;right:4vw;bottom:14vh;z-index:5;display:flex;gap:7px}
.slider-control{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.045);color:#fff;backdrop-filter:blur(16px);display:grid;place-items:center;cursor:pointer;transition:.35s}
.slider-control:hover{background:rgba(255,255,255,.9);color:#111;transform:translateY(-2px)}
.slider-control svg{width:13px;height:13px}
.marquee{height:57px;background:linear-gradient(90deg,#0799c6,#08a7d5 45%,#f39a31);color:#081012;display:flex;align-items:center;overflow:hidden}
.marquee-track{display:flex;white-space:nowrap;animation:marquee 26s linear infinite;font-family:Manrope;font-size:10px;font-weight:800;letter-spacing:.19em;text-transform:uppercase}
.marquee-item{display:flex;align-items:center;gap:24px;padding-right:24px}
.marquee-dot{width:4px;height:4px;background:#081012;border-radius:50%}
@keyframes marquee{to{transform:translateX(-50%)}}
.intro{background:var(--cream);color:var(--ink);padding:145px 8vw 150px;position:relative}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:end}
.eyebrow{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.25em;display:flex;align-items:center;gap:12px;margin-bottom:28px}
.eyebrow:before{content:"";width:29px;height:1px;background:linear-gradient(90deg,var(--brand),var(--accent))}
.intro h2{font-family:Manrope;font-size:clamp(44px,6vw,86px);line-height:.94;letter-spacing:-.075em;font-weight:650}
.brand-text{color:var(--brand)}
.intro-copy{font-size:15px;line-height:1.8;max-width:500px;color:var(--dark-muted)}
.intro-copy strong{color:var(--ink)}
.intro-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:68px;padding-top:27px;border-top:1px solid var(--dark-line)}
.stat-number{font-family:Manrope;font-size:34px;letter-spacing:-.06em}
.stat-label{font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:rgba(17,20,22,.48);margin-top:5px}
.experiences{background:#0f1214;padding:132px 4vw 150px}
.section-heading{display:flex;justify-content:space-between;align-items:end;margin:0 4vw 56px}
.section-heading h2{font-family:Manrope;font-size:clamp(46px,6vw,84px);line-height:.9;letter-spacing:-.075em}
.section-heading p{max-width:300px;color:rgba(255,255,255,.44);font-size:12px;line-height:1.7}
.experience-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:17px}
.experience-card{position:relative;height:600px;overflow:hidden;background:#222;border-radius:2px}
.experience-card:nth-child(1){grid-column:span 7}
.experience-card:nth-child(2){grid-column:span 5}
.experience-card:nth-child(3){grid-column:span 5}
.experience-card:nth-child(4){grid-column:span 7}
.card-image{position:absolute;inset:0;background-size:cover;background-position:center;transition:1.1s cubic-bezier(.16,1,.3,1)}
.experience-card:hover .card-image{transform:scale(1.07)}
.card-1 .card-image{background-image:url("https://images.unsplash.com/photo-1531968455001-5c5272a41129?auto=format&fit=crop&w=1600&q=88")}
.card-2 .card-image{background-image:url("https://images.unsplash.com/photo-1526392060635-9d6019884377?auto=format&fit=crop&w=1600&q=88")}
.card-3 .card-image{background-image:url("https://images.unsplash.com/photo-1516026672322-bc52d61a55d5?auto=format&fit=crop&w=1600&q=88")}
.card-4 .card-image{background-image:url("https://images.unsplash.com/photo-1548013146-72479768bada?auto=format&fit=crop&w=1600&q=88")}
.experience-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.05) 70%)}
.card-content{position:absolute;z-index:2;left:30px;right:30px;bottom:29px}
.card-index{font-size:8px;letter-spacing:.2em;color:rgba(255,255,255,.54);margin-bottom:12px}
.card-title{font-family:Manrope;font-size:clamp(31px,3.5vw,55px);line-height:.92;letter-spacing:-.065em}
.card-info{display:flex;align-items:center;justify-content:space-between;margin-top:20px}
.card-info span:first-child{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.59)}
.card-arrow{width:38px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:grid;place-items:center;transition:.35s;font-size:14px;line-height:1}
.experience-card:hover .card-arrow{background:#fff;color:#111;transform:translateY(-2px)}
.services{background:#e9e4da;color:#111;padding:135px 8vw}
.services-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:10vw}
.services-title{font-family:Manrope;font-size:clamp(45px,6vw,82px);line-height:.91;letter-spacing:-.075em}
.services-list{border-top:1px solid var(--dark-line)}
.service{display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:20px;padding:27px 0;border-bottom:1px solid var(--dark-line);transition:.35s}
.service:hover{padding-left:12px}
.service-number{font-size:9px;color:rgba(0,0,0,.4)}
.service-name{font-family:Manrope;font-size:20px;font-weight:600;letter-spacing:-.03em}
.service-detail{font-size:8px;text-transform:uppercase;letter-spacing:.15em;color:rgba(0,0,0,.45)}
.qa{background:#121719;color:#fff;padding:135px 8vw 150px;position:relative;overflow:hidden}
.qa:before{content:"";position:absolute;inset:-20% -10%;background:radial-gradient(circle at 25% 45%,rgba(8,167,213,.12),transparent 32%),radial-gradient(circle at 78% 55%,rgba(243,154,49,.1),transparent 28%);pointer-events:none}
.qa-head{display:flex;justify-content:space-between;gap:60px;align-items:end;margin-bottom:60px;position:relative}
.qa-head h2{font-family:Manrope;font-size:clamp(44px,6vw,82px);line-height:.9;letter-spacing:-.075em}
.qa-head p{max-width:300px;color:rgba(255,255,255,.45);font-size:12px;line-height:1.7}
.qa-list{position:relative;border-top:1px solid var(--line)}
.qa-item{border-bottom:1px solid var(--line)}
.qa-question{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;background:none;color:#fff;text-align:left;cursor:pointer}
.qa-question span{font-family:Manrope;font-size:clamp(18px,2vw,25px);letter-spacing:-.035em}
.qa-symbol{width:28px;height:28px;border:1px solid rgba(255,255,255,.16);border-radius:50%;display:grid;place-items:center;flex:none;position:relative;transition:.35s}
.qa-symbol:before,.qa-symbol:after{content:"";position:absolute;background:currentColor}
.qa-symbol:before{width:8px;height:1px}
.qa-symbol:after{width:1px;height:8px;transition:.35s}
.qa-item.open .qa-symbol{background:rgba(255,255,255,.9);color:#101314}
.qa-item.open .qa-symbol:after{transform:scaleY(0)}
.qa-answer{height:0;overflow:hidden}
.qa-answer-inner{padding:0 55px 25px 0;color:rgba(255,255,255,.5);font-size:13px;line-height:1.8;max-width:760px}
.contact{color:#111;padding:150px 8vw 130px;position:relative;overflow:hidden;background:#eef3f2}
.contact:before{content:"";position:absolute;inset:-25%;background:radial-gradient(circle at 12% 30%,rgba(8,167,213,.23),transparent 25%),radial-gradient(circle at 84% 78%,rgba(243,154,49,.2),transparent 25%),radial-gradient(circle at 58% 35%,rgba(255,255,255,.9),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.72),rgba(223,234,232,.62));filter:blur(8px)}
.contact:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.38),rgba(255,255,255,.08) 44%,rgba(255,255,255,.32));pointer-events:none}
.contact-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:start}
.contact h2{font-family:Manrope;font-size:clamp(52px,7.4vw,112px);line-height:.86;letter-spacing:-.08em}
.contact h2 em{font-style:normal;color:var(--brand)}
.contact-copy{font-size:15px;line-height:1.75;color:rgba(17,20,22,.62);max-width:540px}
.contact-details{display:grid;gap:13px;margin-top:34px}
.contact-detail{display:flex;align-items:flex-start;gap:12px;font-size:12px;color:rgba(17,20,22,.72)}
.contact-detail svg{width:15px;height:15px;flex:none;margin-top:1px;stroke:var(--brand);stroke-width:1.4;fill:none}
.contact-form{padding:28px;border:1px solid rgba(17,20,22,.12);background:rgba(255,255,255,.34);box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 25px 70px rgba(17,20,22,.08);backdrop-filter:blur(22px) saturate(125%);border-radius:3px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
.field label{font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:rgba(17,20,22,.48)}
.field input,.field select,.field textarea{width:100%;border:0;border-bottom:1px solid rgba(17,20,22,.16);background:transparent;color:#111;padding:10px 0 12px;outline:0;border-radius:0;transition:.25s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand)}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#111 50%),linear-gradient(135deg,#111 50%,transparent 50%);background-position:calc(100% - 7px) 52%,calc(100% - 2px) 52%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:20px}
.field textarea{min-height:105px;resize:vertical}
.form-submit{margin-top:24px;width:100%;justify-content:center}
.form-note{margin-top:12px;font-size:8px;letter-spacing:.07em;color:rgba(17,20,22,.38);text-align:center}
.success-message{display:none;margin-top:14px;padding:12px;border:1px solid rgba(8,167,213,.22);background:rgba(8,167,213,.07);font-size:10px;color:#14647a}
.philosophy{min-height:82vh;background:#0a0d0f;display:grid;place-items:center;text-align:center;padding:100px 8vw;position:relative;overflow:hidden}
.philosophy:before,.philosophy:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.philosophy:before{width:50vw;height:50vw;background:radial-gradient(circle,rgba(8,167,213,.13),transparent 64%);left:-15%;top:-20%}
.philosophy:after{width:50vw;height:50vw;background:radial-gradient(circle,rgba(243,154,49,.11),transparent 64%);right:-15%;bottom:-20%}
.philosophy-inner{position:relative;z-index:2}
.philosophy-kicker{font-size:9px;letter-spacing:.27em;text-transform:uppercase;color:var(--brand);margin-bottom:33px}
.philosophy h2{font-family:Manrope;font-size:clamp(46px,7.3vw,112px);line-height:.88;letter-spacing:-.08em;max-width:1100px}
.philosophy h2 span{font-style:italic;color:rgba(255,255,255,.43)}
.philosophy p{max-width:560px;margin:34px auto 0;color:rgba(255,255,255,.5);line-height:1.75;font-size:13px}
.site-footer{background:#07090a;color:#fff;padding:76px 4vw 28px}
.footer-main{display:grid;grid-template-columns:1.55fr 1fr 1fr 1fr;gap:50px;padding-bottom:68px}
.footer-brand .logo{font-size:20px}
.footer-brand-logo{height:34px!important}
.footer-slogan{margin-top:18px;max-width:320px;font-family:Manrope;font-size:24px;line-height:1.06;letter-spacing:-.055em;color:rgba(255,255,255,.7)}
.footer-column-title{font-size:8px;text-transform:uppercase;letter-spacing:.23em;color:rgba(255,255,255,.36);margin-bottom:20px}
.footer-links{display:flex;flex-direction:column;gap:11px;font-size:11px;color:rgba(255,255,255,.62)}
.footer-links a:hover{color:#fff}
.footer-bottom{padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:20px;font-size:8px;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.34)}
.credits{background:#050607;color:rgba(255,255,255,.5);min-height:41px;padding:0 20px;display:flex;align-items:center;justify-content:center;border-top:1px solid rgba(255,255,255,.07);font-size:8px;letter-spacing:.12em;text-transform:uppercase;text-align:center}
.credits a{color:rgba(255,255,255,.82);margin-left:5px}
.reveal{opacity:0;transform:translateY(45px)}
@media(max-width:950px){
.nav{display:none}
.menu-toggle{display:block}
.mobile-menu{position:fixed;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:25px;background:rgba(5,8,9,.94);backdrop-filter:blur(22px);opacity:0;visibility:hidden;transition:.35s;z-index:900}
.mobile-menu.open{opacity:1;visibility:visible}
.mobile-menu a{font-family:Manrope;font-size:28px;letter-spacing:-.05em}
.hero-content{left:7vw}
.hero-meta{right:7vw}
.hero-scroll{display:none}
.intro-grid,.services-grid,.contact-grid{grid-template-columns:1fr;gap:65px}
.intro{padding:110px 7vw}
.experiences{padding:110px 5vw}
.section-heading{margin:0 2vw 43px;display:block}
.section-heading p{margin-top:24px}
.experience-grid{display:block}
.experience-card{height:520px;margin-bottom:15px}
.services{padding:110px 7vw}
.qa{padding:110px 7vw}
.qa-head{display:block}
.qa-head p{margin-top:24px}
.contact{padding:115px 7vw}
.footer-main{grid-template-columns:1fr 1fr}
.footer-brand{grid-column:span 2}
}
@media(max-width:580px){
.site-header{height:62px;padding:0 5vw}
.logo{font-size:14px}
.logo img{height:26px}
.hero{min-height:720px}
.hero-content{left:7vw;bottom:16vh;width:86vw}
.hero-title{font-size:18vw}
.hero-description{font-size:13px}
.hero-actions{flex-direction:column;align-items:flex-start}
.hero-actions .cta{width:215px}
.hero-meta{bottom:5vh}
.slider-controls{right:7vw;bottom:9vh}
.marquee{height:53px}
.intro-stats{gap:10px}
.stat-number{font-size:26px}
.experience-card{height:460px}
.card-content{left:23px;right:23px;bottom:23px}
.service{grid-template-columns:35px 1fr auto}
.service-name{font-size:17px}
.qa-question{padding:21px 0}
.qa-answer-inner{padding-right:15px}
.contact-grid{gap:50px}
.contact-form{padding:20px}
.form-grid{grid-template-columns:1fr}
.field.full{grid-column:auto}
.footer-main{grid-template-columns:1fr}
.footer-brand{grid-column:auto}
.footer-bottom{flex-direction:column}
.credits{line-height:1.5;padding:10px 18px}
}
