:root {
  --ink: #0c1424;
  --muted: #5e6879;
  --line: #dfe4ec;
  --paper: #f7f9fc;
  --white: #ffffff;
  --navy: #07111f;
  --cyan: #22d3ee;
  --blue: #4f46e5;
  --violet: #8b5cf6;
  --radius: 26px;
  --shadow: 0 30px 80px rgba(7, 17, 31, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "DM Sans", sans-serif;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font: inherit; }
.container { width: min(1180px, calc(100% - 44px)); margin-inline: auto; }
.section-pad { padding: 118px 0; }

.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  transition: .3s ease;
}
.site-header.scrolled {
  background: rgba(247,249,252,.86);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.nav-wrap {
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand img { width: 166px; }
.nav-links { display: flex; align-items: center; gap: 32px; font-weight: 600; font-size: 14px; }
.nav-links > a:not(.nav-cta) { color: #394457; }
.nav-links > a:not(.nav-cta):hover { color: var(--blue); }
.nav-cta {
  background: var(--ink);
  color: white;
  padding: 13px 18px;
  border-radius: 999px;
}
.nav-cta span, .btn span { margin-left: 8px; }
.menu-toggle { display: none; background: none; border: 0; padding: 10px; }
.menu-toggle span { display:block; width:25px; height:2px; background:var(--ink); margin:6px; transition:.3s; }

.hero {
  min-height: 100vh;
  padding-top: 165px;
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(circle at 8% 20%, rgba(34,211,238,.12), transparent 24%),
    radial-gradient(circle at 90% 20%, rgba(139,92,246,.13), transparent 26%),
    linear-gradient(180deg, #fbfcff 0%, #f5f8fc 100%);
}
.hero-grid { display:grid; grid-template-columns: 1.02fr .98fr; gap:70px; align-items:center; }
.eyebrow { display:flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:.15em; font-size:12px; font-weight:700; color:#48556a; }
.eyebrow span { width:27px; height:1px; background:linear-gradient(90deg,var(--cyan),var(--blue)); }
.hero h1, .section-head h2, .product h2, .contact h2 {
  font-family:"Manrope",sans-serif;
  letter-spacing:-.045em;
}
.hero h1 { font-size:clamp(52px,6vw,82px); line-height:.99; max-width:720px; margin:25px 0; }
.hero h1 em { font-style:normal; background:linear-gradient(90deg,#0ea5e9,#4f46e5 55%,#8b5cf6); -webkit-background-clip:text; color:transparent; }
.hero-copy > p { font-size:19px; line-height:1.7; max-width:610px; color:var(--muted); }
.hero-actions { display:flex; gap:14px; margin-top:35px; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:16px 22px; font-weight:700; transition:.25s ease; }
.btn.primary { background:var(--ink); color:white; box-shadow:0 13px 30px rgba(7,17,31,.18); }
.btn.primary:hover { transform:translateY(-3px); background:#182238; }
.btn.ghost { border:1px solid var(--line); background:rgba(255,255,255,.7); }
.btn.ghost:hover { border-color:#aeb7c6; }
.hero-note { display:flex; align-items:center; gap:14px; margin-top:36px; color:#6d7685; font-size:14px; }
.avatar-stack { display:flex; }
.avatar-stack span { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; margin-left:-8px; border:2px solid white; background:#dff9fd; font-size:11px; font-weight:800; color:#0f6473; }
.avatar-stack span:first-child { margin-left:0; background:#e9e7ff; color:#3f36ba; }
.avatar-stack span:last-child { background:#0c1424; color:#fff; }

.visual-shell {
  background:rgba(255,255,255,.78);
  border:1px solid rgba(15,23,42,.1);
  border-radius:34px;
  box-shadow:var(--shadow);
  overflow:hidden;
  transform:rotate(1.2deg);
}
.shell-top { height:54px; display:flex; align-items:center; gap:8px; padding:0 18px; border-bottom:1px solid var(--line); }
.shell-top span { width:9px; height:9px; border-radius:50%; background:#ccd3df; }
.shell-top small { margin-left:auto; margin-right:auto; color:#929baa; }
.idea-map { height:475px; position:relative; overflow:hidden; background:radial-gradient(circle at center,rgba(79,70,229,.12),transparent 32%),linear-gradient(#fff,#f4f8fd); }
.idea-map:before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(15,23,42,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.035) 1px,transparent 1px); background-size:42px 42px; }
.idea-map svg { position:absolute; inset:0; width:100%; height:100%; }
.idea-map path { fill:none; stroke:#bfc7d4; stroke-width:1.2; stroke-dasharray:5 7; }
.core-mark { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:160px; height:160px; border-radius:38px; background:#07111f; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:0 25px 55px rgba(7,17,31,.28); }
.core-mark img { width:54px; margin-bottom:10px; }
.core-mark strong { font-family:Manrope; font-size:21px; }
.core-mark small { color:#9ea8b8; margin-top:3px; }
.map-label { position:absolute; padding:11px 16px; background:white; border:1px solid var(--line); border-radius:14px; font-weight:700; box-shadow:0 12px 25px rgba(15,23,42,.08); z-index:2; }
.top-left { left:46px; top:54px; }.top-right { right:48px; top:58px; }.bottom-left { left:48px; bottom:55px; }.bottom-right { right:45px; bottom:55px; }
.floating-chip { position:absolute; background:#fff; border:1px solid var(--line); border-radius:999px; padding:9px 13px; font-size:12px; box-shadow:0 9px 22px rgba(15,23,42,.08); z-index:3; }
.chip-one { left:40%; top:15%; }.chip-two { right:7%; top:44%; }.chip-three { left:9%; top:52%; }
.hero-orb { position:absolute; border-radius:50%; filter:blur(1px); z-index:-1; }
.orb-one { width:180px; height:180px; right:-80px; top:170px; background:linear-gradient(135deg,rgba(34,211,238,.2),rgba(79,70,229,.1)); }
.orb-two { width:120px; height:120px; left:-50px; bottom:150px; background:rgba(139,92,246,.12); }
.scroll-line { display:flex; align-items:center; gap:15px; margin-top:80px; color:#8a94a3; text-transform:uppercase; font-size:10px; letter-spacing:.16em; }
.scroll-line i { height:1px; width:80px; background:#bbc3cf; }

.section-head { display:grid; grid-template-columns:70px 170px 1fr; align-items:start; margin-bottom:70px; }
.section-index { font-size:13px; color:#8590a0; }
.kicker { margin:0; text-transform:uppercase; letter-spacing:.15em; font-size:12px; font-weight:700; }
.section-head h2 { font-size:clamp(38px,5vw,64px); line-height:1.08; margin:0; max-width:800px; }
.about { background:white; }
.about-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:85px; }
.about-statement p { font-size:22px; line-height:1.6; margin:0 0 24px; color:#3e495b; }
.about-cards { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.principle-card { padding:30px 24px; border-right:1px solid var(--line); }
.principle-card:last-child { border-right:0; }
.principle-card > span { font-size:12px; color:#8b96a6; }
.principle-card h3 { font-family:Manrope; font-size:21px; margin:40px 0 12px; }
.principle-card p { color:var(--muted); line-height:1.65; }

.approach { background:var(--navy); color:#fff; position:relative; overflow:hidden; }
.approach:before { content:""; position:absolute; width:600px;height:600px;border-radius:50%; background:radial-gradient(circle,rgba(79,70,229,.35),transparent 67%); right:-150px; top:-200px; }
.section-head.light .section-index,.section-head.light .kicker { color:#8290a5; }
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; position:relative; }
.process-card { min-height:330px; border:1px solid rgba(255,255,255,.11); border-radius:24px; padding:25px; background:rgba(255,255,255,.035); backdrop-filter:blur(10px); transition:.3s; }
.process-card:hover { transform:translateY(-7px); background:rgba(255,255,255,.07); }
.process-no { color:#78869c; font-size:12px; }
.process-icon { width:54px;height:54px;border-radius:18px;display:grid;place-items:center;margin:65px 0 28px;background:linear-gradient(135deg,rgba(34,211,238,.18),rgba(139,92,246,.2));font-size:24px;color:#8deafa; }
.process-card h3 { font-family:Manrope;font-size:24px;margin:0 0 10px; }
.process-card p { color:#a9b2c2; line-height:1.65; margin:0; }

.product { background:linear-gradient(180deg,#f6f9fd,#fff); }
.product-grid { display:grid; grid-template-columns:1fr .9fr; gap:100px; align-items:center; }
.eyebrow.dark { color:#647084; }
.product h2 { font-size:clamp(50px,6vw,76px); margin:22px 0 8px; }
.product h2 span { background:linear-gradient(90deg,#08a9bd,#4f46e5);-webkit-background-clip:text;color:transparent; }
.product .lead { font-size:25px; line-height:1.4; color:#293549; }
.product-copy > p:not(.lead) { color:var(--muted); font-size:17px; line-height:1.7; }
.feature-list { list-style:none; padding:0; margin:32px 0; }
.feature-list li { display:flex; gap:15px; margin:20px 0; }
.feature-list i { font-style:normal;width:28px;height:28px;border-radius:9px;background:#dff9fd;color:#058092;display:grid;place-items:center;font-weight:800;flex:none; }
.feature-list strong { display:block; margin-bottom:4px; }
.feature-list small { color:#768193; font-size:14px; }
.phone-stage { min-height:650px; position:relative; display:grid; place-items:center; }
.phone { position:relative; width:315px; padding:13px; background:#0a1120; border-radius:48px; box-shadow:0 40px 80px rgba(12,20,36,.25); z-index:3; }
.phone img { width:100%; border-radius:37px; }
.phone-bar { position:absolute; width:100px;height:25px;background:#0a1120;border-radius:0 0 16px 16px;left:50%;top:8px;transform:translateX(-50%);z-index:2; }
.stage-ring { position:absolute;border-radius:50%;border:1px solid #d8deea; }
.ring-one { width:520px;height:520px; }.ring-two { width:410px;height:410px;border-color:#cad4e4; }
.metric-card { position:absolute;z-index:5;background:white;border:1px solid var(--line);border-radius:18px;padding:15px 18px;box-shadow:0 18px 40px rgba(15,23,42,.13); }
.metric-card b,.metric-card span { display:block; }
.metric-card b { font-size:13px; }.metric-card span { font-size:12px;color:#7a8494;margin-top:3px; }
.metric-a { left:0;top:28%; }.metric-b { right:-5px;bottom:24%; }

.founder { background:#eef2f8; }
.founder-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:80px; align-items:center; }
.founder-panel { background:var(--ink);color:white;border-radius:28px;padding:45px;display:flex;align-items:center;gap:28px; }
.founder-monogram { width:112px;height:112px;border-radius:34px;display:grid;place-items:center;background:linear-gradient(135deg,#22d3ee,#4f46e5 60%,#8b5cf6);font-family:Manrope;font-size:34px;font-weight:800; }
.founder-panel span { color:#9fa9b9;font-size:13px;text-transform:uppercase;letter-spacing:.12em; }
.founder-panel h2 { font-family:Manrope;font-size:34px;margin:8px 0 0; }
.founder-copy .quote { font-family:Manrope;font-size:30px;line-height:1.45;letter-spacing:-.02em;margin:0 0 22px; }
.founder-copy p:last-child { color:var(--muted);font-size:17px;line-height:1.7; }

.contact { background:white; }
.contact-card { background:linear-gradient(135deg,#07111f,#101b32);color:white;border-radius:36px;padding:70px;display:grid;grid-template-columns:1.1fr .9fr;gap:80px;position:relative;overflow:hidden; }
.contact-card:after { content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:-90px;top:-100px;background:radial-gradient(circle,rgba(34,211,238,.3),transparent 70%); }
.contact h2 { font-size:clamp(40px,5vw,62px);line-height:1.05;margin:18px 0; }
.contact-card > div:first-child p:last-child { color:#aeb7c6;line-height:1.65;font-size:17px; }
.contact-actions { position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center; }
.email-link { background:white;color:var(--ink);padding:23px;border-radius:20px;position:relative; }
.email-link small,.email-link strong { display:block; }
.email-link small { color:#7b8696;text-transform:uppercase;letter-spacing:.12em;font-size:10px;margin-bottom:7px; }
.email-link strong { font-size:20px; }
.email-link > span { position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:23px; }
.social-row { display:flex;align-items:center;justify-content:space-between;margin-top:22px;color:#8f9caf;font-size:13px; }
.social-row div { display:flex;gap:9px; }
.social-row a { width:35px;height:35px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;font-size:11px; }
.disabled { opacity:.65; pointer-events:none; }

footer { background:#fff;padding:0 0 35px; }
.footer-grid { border-top:1px solid var(--line);padding-top:38px;display:grid;grid-template-columns:1fr auto auto;align-items:end;gap:45px; }
.footer-grid img { width:145px; }
.footer-grid > div:first-child p { color:#8791a0;font-size:13px;margin:10px 0 0; }
.footer-links { display:flex;gap:22px;font-size:13px;font-weight:600; }
.copyright { font-size:12px;color:#8c96a5;margin:0; }

.reveal { opacity:0;transform:translateY(22px);transition:opacity .75s ease,transform .75s ease; }
.reveal.visible { opacity:1;transform:none; }
.delay-1 { transition-delay:.12s; }.delay-2 { transition-delay:.22s; }.delay-3 { transition-delay:.32s; }
.cursor-glow { position:fixed;width:380px;height:380px;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(34,211,238,.07),transparent 68%);transform:translate(-50%,-50%); }

@media (max-width: 980px) {
  .section-pad { padding:90px 0; }
  .hero-grid,.product-grid,.founder-grid,.contact-card,.about-grid { grid-template-columns:1fr; }
  .hero { padding-top:135px; }
  .hero-copy { text-align:center; }
  .hero-copy .eyebrow,.hero-actions,.hero-note { justify-content:center; }
  .hero-copy > p { margin-inline:auto; }
  .visual-shell { max-width:650px;margin:auto; }
  .section-head { grid-template-columns:55px 130px 1fr; }
  .process-grid { grid-template-columns:repeat(2,1fr); }
  .product-grid { gap:30px; }
  .product-copy { max-width:690px; }
  .phone-stage { min-height:620px; }
  .founder-grid { gap:35px; }
  .contact-card { gap:35px; }
  .footer-grid { grid-template-columns:1fr auto; }
  .copyright { grid-column:1/-1; }
}
@media (max-width: 720px) {
  .container { width:min(100% - 28px,1180px); }
  .nav-wrap { height:72px; }
  .brand img { width:145px; }
  .menu-toggle { display:block;z-index:3; }
  .nav-links { position:fixed;inset:0;background:#f7f9fc;display:flex;flex-direction:column;justify-content:center;gap:28px;font-size:21px;transform:translateX(100%);transition:.35s; }
  .nav-links.open { transform:none; }
  .menu-toggle.active span:first-child { transform:translateY(4px) rotate(45deg); }
  .menu-toggle.active span:last-child { transform:translateY(-4px) rotate(-45deg); }
  .hero h1 { font-size:47px; }
  .hero-copy > p { font-size:17px; }
  .idea-map { height:390px; }
  .core-mark { width:130px;height:130px;border-radius:32px; }
  .map-label { font-size:12px;padding:9px 11px; }
  .top-left{left:20px}.top-right{right:20px}.bottom-left{left:20px}.bottom-right{right:20px}
  .floating-chip { display:none; }
  .section-head { display:block;margin-bottom:40px; }
  .section-index { display:block;margin-bottom:15px; }
  .section-head .kicker { margin-bottom:20px; }
  .about-cards { grid-template-columns:1fr; }
  .principle-card { border-right:0;border-bottom:1px solid var(--line);padding-inline:0; }
  .principle-card h3 { margin-top:22px; }
  .process-grid { grid-template-columns:1fr; }
  .process-card { min-height:auto; }
  .process-icon { margin:35px 0 20px; }
  .phone-stage { min-height:560px; }
  .phone { width:270px; }
  .stage-ring.ring-one { width:390px;height:390px; }
  .stage-ring.ring-two { width:320px;height:320px; }
  .metric-a { left:0;top:20%; }.metric-b { right:0;bottom:18%; }
  .founder-panel { padding:28px;flex-direction:column;align-items:flex-start; }
  .founder-copy .quote { font-size:24px; }
  .contact-card { padding:38px 24px;border-radius:25px; }
  .contact h2 { font-size:40px; }
  .email-link strong { font-size:16px; }
  .social-row { align-items:flex-start;gap:15px;flex-direction:column; }
  .footer-grid { grid-template-columns:1fr;align-items:start;gap:25px; }
  .footer-links { flex-wrap:wrap; }
  .copyright { grid-column:auto; }
  .cursor-glow { display:none; }
}
