
:root{
  --bg:#02091e;
  --white:#f7f9fc;
  --muted:#b9c8dc;
  --blue:#218eea;
  --cyan:#25bdf2;
  --line:rgba(93,146,221,.22);
}
*{box-sizing:border-box}
html,body{
  margin:0;
  min-height:100%;
  background:var(--bg);
  color:var(--white);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
a{color:inherit}
body{min-height:100vh}
.site-shell{
  min-height:100vh;
  background:
    radial-gradient(circle at 86% 46%, rgba(28,91,184,.18), transparent 34%),
    linear-gradient(rgba(2,9,30,.04), rgba(2,9,30,.04)),
    url("/background.jpg") center/cover no-repeat fixed;
}
.site-header{
  position:relative;
  z-index:10;
  width:min(1420px,calc(100% - 72px));
  margin:0 auto;
  height:78px;
  display:flex;
  align-items:center;
  gap:22px;
}
.brand-home{
  display:inline-flex;
  align-items:center;
  line-height:0;
  text-decoration:none;
}
.brand-home img{
  width:58px;
  height:auto;
  display:block;
}
.nav{
  display:flex;
  align-items:center;
  gap:24px;
}
.products-menu{position:relative}
.products-menu summary{
  list-style:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  color:var(--white);
  font-size:15px;
  font-weight:560;
  letter-spacing:.02em;
  user-select:none;
}
.products-menu summary::-webkit-details-marker{display:none}
.products-menu summary::after{
  content:"⌄";
  color:var(--cyan);
  font-size:16px;
  transform:translateY(-2px);
  transition:transform .16s ease;
}
.products-menu[open] summary::after{transform:rotate(180deg) translateY(-1px)}
.products-menu summary:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:6px;
  border-radius:4px;
}
.product-dropdown{
  position:absolute;
  left:0;
  top:48px;
  width:340px;
  padding:8px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(3,11,29,.98);
  box-shadow:0 24px 65px rgba(0,0,0,.38);
  backdrop-filter:blur(16px);
}
.product-item{
  display:block;
  padding:13px 14px;
  border-radius:9px;
  text-decoration:none;
  transition:background .15s ease;
}
.product-item:hover,.product-item:focus-visible{background:rgba(39,128,235,.11);outline:none}
.product-name{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  color:var(--white);font-size:15px;font-weight:620;
}
.product-meta{margin-top:4px;color:var(--muted);font-size:12px;line-height:1.35}
.product-item.disabled{opacity:.45;cursor:default;pointer-events:none}

.home-hero{
  width:min(1420px,calc(100% - 72px));
  min-height:calc(100vh - 78px);
  display:flex;align-items:center;
  padding:20px 0 90px;
  margin:0 auto;
}
.home-stack{width:min(910px,72vw);transform:translateY(-2vh)}
.brand-row{display:flex;align-items:center;gap:28px}
.d-mark{width:clamp(125px,12vw,190px);height:auto;flex:0 0 auto}
.separator{width:2px;height:clamp(155px,13.5vw,205px);flex:0 0 auto;background:linear-gradient(to bottom, rgba(33,142,234,.92), rgba(37,189,242,.72));border-radius:999px;opacity:.9}
.wordmark{width:clamp(430px,43vw,650px);max-width:calc(100vw - 310px);height:auto;display:block}
.accent{width:118px;height:2px;margin:42px 0 25px;background:linear-gradient(90deg,#15b9f0,#2ecf9c 58%,transparent);border-radius:999px}
.tagline{margin:0;color:var(--white);font-size:clamp(28px,2.6vw,42px);font-weight:350;letter-spacing:-.015em;line-height:1.15}

/* Run page */
.run-page{min-height:calc(100vh - 78px)}
.run-hero,.run-section,.run-footer{
  width:min(1180px,calc(100% - 72px));
  margin:0 auto;
}
.run-hero{padding:70px 0 76px}

.run-wordmark-img{
  width:min(460px,72vw);
  height:auto;
  display:block;
}
.run-lede{
  margin:28px 0 0;
  max-width:860px;
  color:var(--muted);
  font-size:18px;
  line-height:1.7;
}
.status-strip{
  margin-top:26px;
  display:inline-flex;
  gap:10px;
  align-items:center;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(13,35,75,.42);
  color:#d8e7f8;
  font-size:14px;
}
.status-strip strong{
  color:#7dbdff;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:11px;
}
.run-section{padding:84px 0;border-top:1px solid var(--line)}
.section-kicker{margin:0 0 12px;color:#75b6ff;font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase}
.section-title{margin:0;max-width:760px;font-size:clamp(34px,4vw,54px);line-height:1.08;letter-spacing:-.025em;font-weight:460}
.section-copy{margin:20px 0 0;max-width:830px;color:var(--muted);font-size:17px;line-height:1.68}
.feature-grid{margin-top:38px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.feature-card{min-height:185px;padding:24px;border:1px solid var(--line);border-radius:16px;background:rgba(5,18,43,.64)}
.feature-number{color:var(--blue);font-family:"SFMono-Regular",Consolas,monospace;font-size:12px;font-weight:700}
.feature-card h3{margin:34px 0 8px;font-size:22px;font-weight:550}
.feature-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.58}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}
.principles{margin:8px 0 0;padding:0;list-style:none}
.principles li{padding:17px 0;border-bottom:1px solid var(--line);color:var(--muted);line-height:1.5}
.principles strong{color:var(--white);font-weight:570}
.run-footer{
  padding:40px 0 56px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:center;
}
.product-lockup{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-decoration:none;
}
.product-lockup .small{
  color:#d4deea;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:650;
}
.product-lockup img{
  width:150px;
  height:auto;
  display:block;
}
.product-lockup .tiny{
  color:#d4deea;
  font-size:12px;
  font-weight:600;
}

@media (max-width:840px){
  .site-shell{background-attachment:scroll}
  .site-header{width:min(100% - 36px,720px);height:72px;gap:16px}
  .brand-home img{width:50px}
  .product-dropdown{left:0;width:min(330px,calc(100vw - 36px))}
  .home-hero{width:min(100% - 40px,680px);min-height:calc(100vh - 72px);align-items:flex-start;padding-top:12vh;padding-bottom:56px}
  .home-stack{width:100%;transform:none}
  .brand-row{gap:18px}
  .d-mark{width:clamp(92px,25vw,135px)}
  .separator{width:1.5px;height:clamp(115px,29vw,155px)}
  .wordmark{width:min(58vw,450px);max-width:none}
  .accent{margin-top:34px}
  .tagline{max-width:520px;font-size:clamp(25px,7vw,36px)}
  .run-hero,.run-section,.run-footer{width:min(100% - 40px,720px)}
  .feature-grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr;gap:32px}
}
@media (max-width:520px){
  .site-header{width:calc(100% - 26px);gap:12px}
  .brand-home img{width:44px}
  .home-hero{width:calc(100% - 30px);padding-top:10vh}
  .brand-row{gap:12px}
  .separator{height:clamp(90px,28vw,120px)}
  .wordmark{width:56vw}
  .accent{width:92px;margin:28px 0 21px}
  .run-hero,.run-section,.run-footer{width:calc(100% - 30px)}
  }
