:root{
  --bg:#08080a;
  --surface:#111113;
  --surface2:#171719;
  --text:#f5f5f7;
  --muted:#8b8b90;
  --soft:#b7b7bc;
  --border:rgba(255,255,255,.09);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
button{font:inherit}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1000;
  opacity:.012;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")
}
.header{
  position:fixed;z-index:500;top:0;left:0;right:0;height:76px;
  padding:0 32px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid transparent;transition:.35s;
}
.header.scrolled{
  background:rgba(8,8,10,.78);
  backdrop-filter:blur(24px) saturate(130%);
  border-color:var(--border);
}
.logo{
  font-size:14px;font-weight:600;letter-spacing:-.35px;
}
.logo span{font-weight:400;color:#8a8a90;margin-left:3px}
.header nav{display:flex;gap:34px;margin-left:100px}
.header nav a,.header-button{font-size:12px;color:#a2a2a7;transition:.25s}
.header nav a:hover{color:#fff}
.header-button{
  padding:10px 14px;border:1px solid var(--border);border-radius:999px;
  background:rgba(255,255,255,.035);
}
.header-button:hover{background:rgba(255,255,255,.08);color:#fff}
.menu{display:none;background:none;border:0}.menu i{display:block;width:21px;height:1px;background:#fff;margin:6px}
.mobile-menu{display:none}

/* HERO */
.hero{
  min-height:100svh;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%,rgba(72,82,105,.11),transparent 30%),
    #08080a;
  display:flex;align-items:center;justify-content:center;
}
#ambient{position:absolute;inset:0;width:100%;height:100%}
.hero-glow{
  position:absolute;width:700px;height:700px;left:50%;top:43%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(120,135,165,.055),transparent 65%);
  pointer-events:none;
}
.hero-content{
  position:relative;z-index:2;width:min(calc(100% - 48px),var(--max));
  text-align:center;margin-top:15px;
}
.hero-pill{
  display:inline-flex;padding:8px 12px;border:1px solid var(--border);
  border-radius:999px;background:rgba(255,255,255,.035);
  color:#a5a5aa;font-size:11px;letter-spacing:.1px;
}
.hero h1{
  margin:32px 0 22px;
  font-size:clamp(64px,9vw,122px);
  line-height:.98;letter-spacing:-.055em;font-weight:600;
}
.hero h1 span{color:#8d8d93}
.hero-content>p{
  color:#8d8d92;font-size:18px;line-height:1.55;
  max-width:620px;margin:0 auto;
}
.hero-actions{display:flex;justify-content:center;gap:10px;margin-top:34px}
.primary,.secondary{
  display:inline-flex;align-items:center;gap:20px;padding:12px 16px;border-radius:999px;
  font-size:13px;transition:.25s;
}
.primary{background:#f5f5f7;color:#050505}
.primary:hover{transform:translateY(-2px);background:#fff}
.primary span,.secondary span{font-size:15px}
.secondary{border:1px solid var(--border);color:#d5d5da;background:rgba(255,255,255,.035)}
.secondary:hover{background:rgba(255,255,255,.08)}
.hero-note{
  position:absolute;bottom:28px;left:32px;color:#67676d;font-size:10px;
  letter-spacing:.2px;
}

/* INTRO */
.intro{
  min-height:720px;padding:150px 0;display:grid;
  grid-template-columns:1fr 3fr;gap:60px;width:min(calc(100% - 48px),var(--max));margin:auto;
}
.section-label{font-size:11px;color:#66666c;letter-spacing:.1px}
.intro-copy{opacity:0;transform:translateY(30px);transition:1s}
.intro-copy.visible{opacity:1;transform:none}
.intro h2,.section-heading h2,.showcase h2,.cta h2,.inner-content h1,.inner-light h2{
  font-weight:600;letter-spacing:-.055em;line-height:1.02;
}
.intro h2{font-size:clamp(52px,7vw,92px);margin:0}
.intro h2 span,.showcase h2 span,.cta h2 span,.inner-content h1 span,.inner-light h2 span{color:#707077}
.intro p{max-width:500px;color:#88888e;font-size:17px;line-height:1.65;margin:42px 0 0}

/* CAPABILITIES */
.capabilities{padding:120px 0 150px;background:#0c0c0e}
.section-heading{
  width:min(calc(100% - 48px),var(--max));margin:auto;
  opacity:0;transform:translateY(30px);transition:1s;
}
.section-heading.visible{opacity:1;transform:none}
.section-heading h2{font-size:clamp(55px,7vw,90px);margin:18px 0 10px}
.section-heading p{margin:0;color:#77777d;font-size:15px}
.cap-grid{
  width:min(calc(100% - 48px),var(--max));margin:60px auto 0;
  display:grid;grid-template-columns:repeat(2,1fr);gap:12px;
}
.cap-card{
  min-height:330px;padding:27px;border:1px solid var(--border);border-radius:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  display:flex;flex-direction:column;justify-content:space-between;
  position:relative;overflow:hidden;
  opacity:0;transform:translateY(30px);transition:opacity .8s,transform .8s,background .35s,border-color .35s;
}
.cap-card.visible{opacity:1;transform:none}
.cap-card:hover{background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));border-color:rgba(255,255,255,.17)}
.cap-card:after{
  content:"";position:absolute;width:240px;height:240px;border-radius:50%;
  right:-110px;top:-110px;background:radial-gradient(circle,rgba(150,160,180,.09),transparent 68%);
}
.cap-icon{
  width:38px;height:38px;border:1px solid var(--border);border-radius:12px;
  display:grid;place-items:center;color:#aaa;font-size:15px;background:rgba(255,255,255,.025)
}
.cap-card h3{font-size:31px;letter-spacing:-.035em;font-weight:500;margin:0 0 10px}
.cap-card p{max-width:390px;color:#7d7d83;font-size:14px;line-height:1.65;margin:0}
.arrow{position:absolute;right:27px;bottom:27px;color:#7c7c82;font-size:17px}
.cap-card.wide{grid-column:span 2;min-height:270px}

/* SHOWCASE */
.showcase{
  min-height:850px;display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;text-align:center;
  background:#08080a;
}
.showcase-orb{
  position:absolute;width:650px;height:650px;border-radius:50%;
  background:
    radial-gradient(circle at 36% 32%,rgba(255,255,255,.17),rgba(125,140,170,.055) 16%,transparent 52%),
    radial-gradient(circle,rgba(100,115,145,.035),transparent 67%);
  filter:blur(.3px);
  box-shadow:0 0 150px rgba(100,120,160,.025);
  animation:breath 7s ease-in-out infinite;
}
@keyframes breath{50%{transform:scale(1.05);opacity:.8}}
.showcase-content{position:relative;z-index:2;opacity:0;transform:translateY(30px);transition:1s}
.showcase-content.visible{opacity:1;transform:none}
.showcase h2{font-size:clamp(58px,8vw,108px);margin:22px 0}
.showcase p{color:#85858b;font-size:16px}

/* PRINCIPLES */
.principles{
  width:min(calc(100% - 48px),var(--max));margin:auto;padding:110px 0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
}
.principle{
  padding:35px 0;border-top:1px solid var(--border);
  opacity:0;transform:translateY(25px);transition:1s;
}
.principle.visible{opacity:1;transform:none}
.principle span{font-size:11px;color:#66666c}.principle h3{font-size:27px;font-weight:500;margin:50px 0 12px;letter-spacing:-.025em}
.principle p{color:#77777d;font-size:14px;line-height:1.6;max-width:250px}

/* CTA */
.cta{
  min-height:780px;padding:130px 0;display:flex;flex-direction:column;justify-content:center;
  width:min(calc(100% - 48px),var(--max));margin:auto;position:relative;
  opacity:0;transform:translateY(30px);transition:1s;
}
.cta.visible{opacity:1;transform:none}
.cta-glow{position:absolute;width:600px;height:600px;right:-100px;top:50%;transform:translateY(-50%);background:radial-gradient(circle,rgba(120,140,175,.05),transparent 65%);pointer-events:none}
.cta h2{font-size:clamp(64px,8vw,110px);margin:25px 0 15px}
.cta p{color:#85858b;font-size:16px}
.contact-buttons{display:flex;gap:10px;margin-top:30px}

/* FOOTER */
.footer{border-top:1px solid var(--border);padding:32px 0}
.footer-inner{width:min(calc(100% - 48px),var(--max));margin:auto;display:flex;justify-content:space-between;align-items:center;color:#65656b;font-size:10px}

/* INNER */
.inner{background:#08080a}.inner-hero{min-height:72vh;display:flex;align-items:end;padding:140px 0 100px;position:relative;overflow:hidden}.inner-orb{position:absolute;width:650px;height:650px;right:-120px;top:20%;border-radius:50%;background:radial-gradient(circle,rgba(110,125,160,.08),transparent 65%);filter:blur(1px)}
.inner-content{width:min(calc(100% - 48px),var(--max));margin:auto;position:relative;z-index:2}
.inner-content h1{font-size:clamp(65px,8vw,110px);margin:25px 0}
.inner-content p{max-width:620px;color:#85858b;font-size:17px;line-height:1.65}
.inner-light{background:#f5f5f7;color:#0b0b0d;padding:140px 0;min-height:500px}
.inner-light-grid{width:min(calc(100% - 48px),var(--max));margin:auto;display:grid;grid-template-columns:1fr 3fr;gap:60px}
.dark{color:#7a7a80}.inner-light h2{font-size:clamp(55px,7vw,90px);margin:0}.inner-light p{color:#66666b;max-width:560px;font-size:16px;line-height:1.7;margin-top:35px}
.direct-grid{width:min(calc(100% - 48px),var(--max));margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.direct-grid a{min-height:280px;padding:30px;border:1px solid #dedee2;border-radius:24px;display:flex;flex-direction:column;justify-content:space-between;background:#f5f5f7;transition:.3s}
.direct-grid a:hover{background:#0b0b0d;color:#fff;border-color:#0b0b0d}.direct-grid small{color:#77777d;font-size:10px;letter-spacing:.1px}.direct-grid strong{font-size:29px;font-weight:500;letter-spacing:-.03em}

/* MOBILE */
@media(max-width:800px){
 .header{height:68px;padding:0 18px}.header nav,.header-button{display:none}.menu{display:block}.mobile-menu{display:flex;position:fixed;z-index:490;top:68px;left:0;right:0;padding:28px 20px 34px;background:rgba(8,8,10,.96);backdrop-filter:blur(22px);border-bottom:1px solid var(--border);flex-direction:column;gap:22px;transform:translateY(-110%);transition:.35s}.mobile-menu.open{transform:none}.mobile-menu a{font-size:27px;letter-spacing:-.03em}
 .hero{min-height:720px}.hero-content{width:calc(100% - 36px)}.hero h1{font-size:18vw}.hero-content>p{font-size:15px}.hero-actions{flex-wrap:wrap}.hero-note{left:18px}
 .intro{width:calc(100% - 36px);display:block;padding:105px 0 125px}.intro .section-label{margin-bottom:40px}.intro h2{font-size:15vw}.intro p{font-size:15px}
 .capabilities{padding:100px 0 110px}.section-heading,.cap-grid{width:calc(100% - 36px)}.section-heading h2{font-size:15vw}.cap-grid{grid-template-columns:1fr}.cap-card,.cap-card.wide{grid-column:auto;min-height:270px}.cap-card h3{font-size:28px}
 .showcase{min-height:650px}.showcase-orb{width:420px;height:420px}.showcase h2{font-size:15vw}
 .principles{width:calc(100% - 36px);grid-template-columns:1fr;padding:85px 0;gap:0}.principle{padding:27px 0}.principle h3{margin:25px 0 10px}
 .cta{width:calc(100% - 36px);min-height:650px}.cta h2{font-size:16vw}.contact-buttons{flex-wrap:wrap}
 .footer-inner{width:calc(100% - 36px);display:block;line-height:2.5}.footer-inner>*{display:block}
 .inner-hero{min-height:64vh;padding:110px 0 75px}.inner-content{width:calc(100% - 36px)}.inner-content h1{font-size:15vw}.inner-light{padding:105px 0}.inner-light-grid{width:calc(100% - 36px);grid-template-columns:1fr;gap:30px}.inner-light h2{font-size:15vw}.direct-grid{width:calc(100% - 36px);grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
