:root {
  --bg: #07131d;
  --bg-soft: #0b1b27;
  --panel: #0e2230;
  --panel-2: #102a3a;
  --text: #eef5f7;
  --muted: #9fb2bd;
  --line: rgba(222, 238, 244, 0.14);
  --accent: #70c4c7;
  --accent-2: #b8e3df;
  --max: 1180px;
  --radius: 18px;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.22);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }

.skip-link {
  position: fixed; left: 1rem; top: -4rem; z-index: 9999;
  background: var(--text); color: var(--bg); padding: .7rem 1rem; border-radius: 10px;
}
.skip-link:focus { top: 1rem; }

.site-header {
  position: sticky; top: 0; z-index: 1000;
  border-bottom: 1px solid var(--line);
  background: rgba(7, 19, 29, .86);
  backdrop-filter: blur(18px);
}
.nav-wrap {
  width: min(calc(100% - 2rem), var(--max)); margin: 0 auto;
  min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
}
.brand { display: inline-flex; align-items: center; gap: .75rem; text-decoration: none; font-weight: 760; letter-spacing: .035em; }
.brand-mark { width: 32px; height: 32px; border: 1px solid rgba(184,227,223,.55); border-radius: 50%; position: relative; display: inline-block; }
.brand-mark::before, .brand-mark::after { content:""; position:absolute; inset:7px; border:1px solid rgba(112,196,199,.55); border-radius:50%; }
.brand-mark::after { width: 2px; height: 12px; border:0; background: var(--accent); left: 15px; top: 4px; transform: rotate(42deg); transform-origin: 50% 100%; box-shadow: 0 0 18px rgba(112,196,199,.35); }
.nav-links { display:flex; align-items:center; gap:1.35rem; }
.nav-links a { color:var(--muted); text-decoration:none; font-size:.94rem; }
.nav-links a:hover, .nav-links a[aria-current="page"] { color:var(--text); }
.nav-cta { border:1px solid var(--line); padding:.55rem .8rem; border-radius:999px; }
.menu-btn { display:none; background:none; color:var(--text); border:1px solid var(--line); border-radius:10px; padding:.45rem .65rem; }

main { overflow:hidden; }
.shell { width:min(calc(100% - 2rem), var(--max)); margin:0 auto; }
.hero { position:relative; min-height: calc(100svh - 72px); display:grid; align-items:center; padding: 6rem 0; border-bottom:1px solid var(--line); }
.hero::before {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.65;
  background-image:
    linear-gradient(rgba(112,196,199,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112,196,199,.035) 1px, transparent 1px),
    radial-gradient(circle at 72% 46%, rgba(112,196,199,.16), transparent 0 26%, transparent 40%);
  background-size: 48px 48px, 48px 48px, auto;
}
.hero-grid { position:relative; display:grid; grid-template-columns: 1.12fr .88fr; align-items:center; gap:4.5rem; }
.eyebrow { color:var(--accent-2); text-transform:uppercase; letter-spacing:.17em; font-size:.74rem; font-weight:700; margin-bottom:1.25rem; }
h1, h2, h3 { line-height:1.08; margin:0 0 1rem; letter-spacing:-.025em; }
h1 { font-size:clamp(3.4rem, 8vw, 7.2rem); max-width: 920px; }
.hero h1 .sub { display:block; font-size:clamp(1.55rem, 3.7vw, 3.15rem); color:var(--accent-2); font-weight:520; margin-top:1.2rem; }
.lead { font-size:clamp(1.08rem, 1.8vw, 1.35rem); color:var(--muted); max-width: 690px; }
.tagline { margin:1.35rem 0 0; font-size:1.05rem; letter-spacing:.08em; color:var(--text); }
.actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:46px; padding:.72rem 1rem; border-radius:999px; text-decoration:none; font-weight:700; border:1px solid transparent; }
.btn-primary { color:#062029; background:var(--accent-2); }
.btn-secondary { border-color:var(--line); color:var(--text); background:rgba(255,255,255,.02); }
.btn:hover { transform:translateY(-1px); }

.mission-orb { width:min(100%, 450px); aspect-ratio:1; margin:auto; position:relative; border-radius:50%; border:1px solid rgba(184,227,223,.2); box-shadow: inset 0 0 80px rgba(112,196,199,.04), var(--shadow); }
.mission-orb::before, .mission-orb::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(112,196,199,.16); }
.mission-orb::before { inset:12%; }
.mission-orb::after { inset:30%; }
.orb-axis-x, .orb-axis-y { position:absolute; background:rgba(112,196,199,.17); }
.orb-axis-x { height:1px; left:8%; right:8%; top:50%; }
.orb-axis-y { width:1px; top:8%; bottom:8%; left:50%; }
.sweep { position:absolute; inset:50% 50% 50% 50%; width:40%; height:1px; background:linear-gradient(90deg,var(--accent),transparent); transform-origin:left center; animation:sweep 8s linear infinite; }
.sweep::after { content:""; width:8px; height:8px; border-radius:50%; background:var(--accent-2); position:absolute; right:26%; top:-4px; box-shadow:0 0 22px var(--accent); }
.orb-label { position:absolute; padding:.38rem .55rem; border:1px solid var(--line); border-radius:999px; font-size:.7rem; letter-spacing:.08em; color:var(--muted); background:rgba(7,19,29,.75); }
.l1{left:4%;top:21%}.l2{right:0;top:36%}.l3{left:11%;bottom:19%}.l4{right:8%;bottom:11%}
@keyframes sweep { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}.sweep{animation:none}.btn:hover{transform:none} }

.section { padding:6rem 0; border-bottom:1px solid var(--line); }
.section-narrow { padding:4.25rem 0; }
.section-head { max-width:780px; margin-bottom:3rem; }
h2 { font-size:clamp(2.1rem, 4.2vw, 4rem); }
h3 { font-size:1.18rem; }
.kicker { color:var(--accent); text-transform:uppercase; letter-spacing:.15em; font-size:.72rem; font-weight:760; margin-bottom:.85rem; }
.muted { color:var(--muted); }

.problem-grid, .pillar-grid, .app-grid, .footer-grid { display:grid; gap:1rem; }
.problem-grid { grid-template-columns:repeat(3,1fr); }
.card { border:1px solid var(--line); background:linear-gradient(180deg,rgba(16,42,58,.58),rgba(11,27,39,.42)); border-radius:var(--radius); padding:1.45rem; }
.card .num { font-size:.72rem; color:var(--accent); letter-spacing:.15em; margin-bottom:1.5rem; }
.card p { color:var(--muted); margin-bottom:0; }

.flow { display:grid; grid-template-columns:repeat(5,1fr); gap:.6rem; margin-top:2.8rem; }
.flow-step { min-height:145px; border:1px solid var(--line); border-radius:16px; padding:1.15rem; display:flex; flex-direction:column; justify-content:space-between; background:rgba(255,255,255,.015); }
.flow-step span:first-child { color:var(--accent); font-size:.7rem; letter-spacing:.13em; }
.flow-step strong { font-size:1rem; }
.flow-step.human { border-color:rgba(184,227,223,.5); background:rgba(112,196,199,.055); }
.flow-note { color:var(--muted); font-size:.9rem; margin-top:1rem; }

.pillar-grid { grid-template-columns:repeat(3,1fr); }
.pillar { padding:1.35rem 0; border-top:1px solid var(--line); }
.pillar p { color:var(--muted); margin:.5rem 0 0; }

.quote-band { padding:6.5rem 0; text-align:center; background:radial-gradient(circle at center, rgba(112,196,199,.07), transparent 55%); }
.quote-band blockquote { margin:0 auto; font-size:clamp(2.5rem,6vw,5.8rem); line-height:1.03; letter-spacing:-.04em; max-width:1000px; font-weight:720; }
.quote-band blockquote span { color:var(--accent-2); }
.quote-band p { color:var(--muted); max-width:730px; margin:1.7rem auto 0; }

.app-grid { grid-template-columns:repeat(2,1fr); }
.app-card { min-height:260px; position:relative; overflow:hidden; }
.app-card::after { content:""; position:absolute; width:220px; height:220px; border:1px solid rgba(112,196,199,.09); border-radius:50%; right:-90px; bottom:-100px; }
.status-chip { display:inline-flex; border:1px solid var(--line); color:var(--accent-2); border-radius:999px; padding:.28rem .55rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:1rem; }

.split { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.definition-list { margin:0; }
.definition-list div { padding:1rem 0; border-top:1px solid var(--line); }
.definition-list dt { color:var(--text); font-weight:750; }
.definition-list dd { color:var(--muted); margin:.25rem 0 0; }

.page-hero { padding:7rem 0 4.5rem; border-bottom:1px solid var(--line); }
.page-hero h1 { font-size:clamp(3rem,7vw,6rem); max-width:900px; }
.page-hero .lead { max-width:780px; }

.notice { border:1px solid rgba(230,200,120,.35); background:rgba(230,200,120,.06); padding:1rem 1.2rem; border-radius:14px; color:#e9dca9; }
.contact-panel { max-width:760px; }
.contact-types { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1.5rem; }
.contact-types span { border:1px solid var(--line); border-radius:999px; padding:.45rem .65rem; color:var(--muted); }

.site-footer { padding:3rem 0; }
.footer-grid { grid-template-columns:1.6fr .8fr .8fr; }
.footer-links { display:grid; gap:.45rem; }
.footer-links a { color:var(--muted); text-decoration:none; }
.footer-links a:hover { color:var(--text); }
.footer-meta { margin-top:2.5rem; padding-top:1.25rem; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:1rem; color:var(--muted); font-size:.85rem; }

@media (max-width: 900px) {
  .hero-grid, .split { grid-template-columns:1fr; }
  .hero { min-height:auto; padding:5rem 0; }
  .mission-orb { width:min(78vw,390px); }
  .flow { grid-template-columns:repeat(2,1fr); }
  .pillar-grid { grid-template-columns:repeat(2,1fr); }
  .problem-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-grid > :first-child { grid-column:1/-1; }
  .menu-btn { display:block; }
  .nav-links { display:none; position:absolute; top:72px; left:0; right:0; background:#081722; border-bottom:1px solid var(--line); padding:1rem; flex-direction:column; align-items:flex-start; }
  .nav-links.open { display:flex; }
}
@media (max-width: 620px) {
  .shell { width:min(calc(100% - 1.25rem), var(--max)); }
  .hero { padding:4rem 0; }
  h1 { font-size:clamp(3rem,17vw,5rem); }
  .section { padding:4.2rem 0; }
  .flow, .pillar-grid, .app-grid, .footer-grid { grid-template-columns:1fr; }
  .footer-grid > :first-child { grid-column:auto; }
  .footer-meta { flex-direction:column; }
  .brand { font-size:.92rem; }
  .mission-orb { width:88vw; max-width:340px; }
}


/* =========================================================
   BG-WEB-002 — Visual & Content Refinement
   Quiet mission-control aesthetic; no external assets.
   ========================================================= */
:root {
  --bg-deep: #050e16;
  --bg-mid: #0a1823;
  --accent-warm: #d8e9c9;
  --measure: 70ch;
}

body {
  background:
    radial-gradient(circle at 86% 5%, rgba(112,196,199,.055), transparent 24rem),
    linear-gradient(180deg, var(--bg-deep), var(--bg) 18rem, var(--bg));
}

.site-header { background: rgba(5,14,22,.82); }
.nav-wrap { min-height: 76px; }
.nav-links a { transition: color .18s ease, border-color .18s ease, background .18s ease; }
.nav-cta { padding-inline: 1rem; background: rgba(255,255,255,.018); }
.nav-cta:hover { border-color: rgba(184,227,223,.36); background: rgba(112,196,199,.045); }

.hero { min-height: min(900px, calc(100svh - 76px)); padding: 5.5rem 0 6.25rem; }
.hero::after {
  content:""; position:absolute; inset:auto 0 0; height:180px; pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(5,14,22,.45));
}
.hero-grid { z-index:1; }
.hero h1 { max-width: 760px; text-wrap: balance; }
.hero h1 .sub { max-width: 640px; line-height: 1.02; }
.hero .lead { max-width: 650px; }
.tagline { font-weight: 690; color: var(--accent-warm); }
.hero-status {
  display:flex; flex-wrap:wrap; gap:.55rem 1.15rem; margin-top:1.55rem; color:var(--muted);
  font-size:.76rem; text-transform:uppercase; letter-spacing:.11em;
}
.hero-status span { display:inline-flex; align-items:center; gap:.5rem; }
.hero-status span::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px rgba(112,196,199,.35); }

.mission-orb { box-shadow: inset 0 0 90px rgba(112,196,199,.035), 0 32px 90px rgba(0,0,0,.24); }
.mission-orb::before, .mission-orb::after { border-color: rgba(112,196,199,.2); }
.orb-label { backdrop-filter: blur(8px); color:#bfd0d8; }

.section { position:relative; padding: 6.75rem 0; }
.section::before {
  content:""; position:absolute; left:50%; top:0; transform:translateX(-50%); width:min(calc(100% - 2rem), var(--max));
  height:1px; background:linear-gradient(90deg,transparent,rgba(112,196,199,.08),transparent); opacity:.8;
}
.section-head { max-width: 820px; margin-bottom:3.4rem; }
.section-head .lead, .page-hero .lead, .split .lead { max-width: var(--measure); }
h2 { text-wrap: balance; max-width: 950px; }
.page-hero h1 { text-wrap: balance; }
.kicker, .eyebrow { font-feature-settings:"ss01" 1; }

.card {
  background:
    linear-gradient(180deg,rgba(17,43,58,.64),rgba(7,19,29,.42));
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.card:hover { transform: translateY(-2px); border-color: rgba(184,227,223,.24); background:linear-gradient(180deg,rgba(20,48,64,.72),rgba(7,19,29,.46)); }
.card h3 { color:#f4f8f9; }
.card .num { margin-bottom:1.25rem; }

.flow { position:relative; }
.flow::before { content:""; position:absolute; left:4%; right:4%; top:50%; height:1px; background:linear-gradient(90deg,transparent,rgba(112,196,199,.13),transparent); z-index:0; }
.flow-step { position:relative; z-index:1; backdrop-filter: blur(8px); }
.flow-step strong { max-width: 14ch; }
.flow-step.human strong { color:var(--accent-warm); }

.pillar { min-height:145px; }
.pillar h3 { margin-bottom:.7rem; }
.pillar p { max-width: 34ch; }

.quote-band { position:relative; overflow:hidden; padding:7.5rem 0; }
.quote-band::before {
  content:""; position:absolute; width:720px; height:720px; border:1px solid rgba(112,196,199,.06); border-radius:50%;
  left:50%; top:50%; transform:translate(-50%,-50%); box-shadow:0 0 0 120px rgba(112,196,199,.012),0 0 0 240px rgba(112,196,199,.008);
}
.quote-band .shell { position:relative; }
.quote-band blockquote { max-width: 920px; }
.quote-band p { max-width: 680px; }

.status-strip {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid var(--line); border-radius:16px; overflow:hidden;
  margin-top:2rem; background:var(--line); max-width:820px;
}
.status-strip > div { padding:1rem 1.1rem; background:rgba(7,19,29,.82); }
.status-strip span { display:block; color:var(--accent); font-size:.66rem; letter-spacing:.13em; text-transform:uppercase; margin-bottom:.25rem; }
.status-strip strong { font-size:.9rem; font-weight:650; }

.stage-panel {
  border:1px solid var(--line); background:linear-gradient(180deg,rgba(16,42,58,.42),rgba(7,19,29,.28)); border-radius:var(--radius); padding:1.5rem;
}
.stage-panel .kicker { margin-bottom:.6rem; }
.stage-panel p:last-child { margin-bottom:0; }

.page-hero { position:relative; padding:8rem 0 5.5rem; overflow:hidden; }
.page-hero::before {
  content:""; position:absolute; width:520px; height:520px; border:1px solid rgba(112,196,199,.055); border-radius:50%; right:-170px; top:-180px;
  box-shadow:0 0 0 90px rgba(112,196,199,.01),0 0 0 180px rgba(112,196,199,.006); pointer-events:none;
}
.page-hero .shell { position:relative; }

.contact-types span { background:rgba(255,255,255,.015); }

.site-footer { padding:3.5rem 0 2.2rem; background:rgba(4,12,18,.28); }
.site-footer .brand-mark { width:28px; height:28px; }
.footer-meta { align-items:center; }

@media (max-width: 900px) {
  .hero { padding-top:4.75rem; }
  .flow::before { display:none; }
  .status-strip { grid-template-columns:1fr; }
  .status-strip > div + div { border-top:1px solid var(--line); }
}

@media (max-width: 620px) {
  .nav-wrap { min-height:68px; }
  .nav-links { top:68px; padding:1rem .75rem 1.25rem; }
  .nav-links a { width:100%; padding:.62rem .45rem; font-size:1rem; }
  .nav-cta { border-radius:12px; }
  .menu-btn { min-height:40px; padding:.42rem .72rem; }
  .hero { padding:3.8rem 0 4.6rem; }
  .hero-grid { gap:3.25rem; }
  h1 { font-size:clamp(3rem,15.5vw,4.65rem); }
  .hero h1 .sub { font-size:clamp(1.45rem,7.8vw,2.1rem); margin-top:.9rem; }
  .hero .lead { font-size:1.03rem; }
  .hero-status { gap:.55rem .9rem; font-size:.67rem; }
  .mission-orb { width:min(82vw,320px); }
  .orb-label { font-size:.59rem; padding:.3rem .42rem; }
  .section { padding:4.6rem 0; }
  .section-head { margin-bottom:2.3rem; }
  h2 { font-size:clamp(2.15rem,11vw,3.25rem); }
  .quote-band { padding:5.25rem 0; }
  .quote-band blockquote { font-size:clamp(2.35rem,13vw,4rem); }
  .page-hero { padding:5.2rem 0 3.9rem; }
  .page-hero h1 { font-size:clamp(2.7rem,13vw,4.2rem); }
  .flow-step { min-height:118px; }
  .app-card { min-height:220px; }
  .actions .btn { width:100%; }
}