:root {
  color-scheme: dark;
  --bg: #02070e;
  --bg-soft: #06111c;
  --panel: rgba(8, 24, 39, .72);
  --panel-strong: rgba(8, 25, 42, .93);
  --line: rgba(140, 238, 255, .14);
  --line-strong: rgba(140, 238, 255, .28);
  --text: #f4fbff;
  --muted: #96b1be;
  --muted-2: #6f8c99;
  --cyan: #84efff;
  --cyan-strong: #42d5ef;
  --blue: #6674ff;
  --green: #78efbf;
  --radius: 28px;
  --shadow: 0 36px 110px rgba(0, 0, 0, .42);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 50% -12%, rgba(39, 168, 205, .2), transparent 31rem),
    radial-gradient(circle at 7% 28%, rgba(80, 91, 230, .14), transparent 28rem),
    linear-gradient(180deg, #04101a 0, #02070e 36rem, #02070e 100%);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button, input { font: inherit; }

.skip-link {
  position: fixed;
  z-index: 100;
  left: 16px;
  top: 12px;
  padding: 10px 14px;
  border-radius: 12px;
  background: #fff;
  color: #06111c;
  transform: translateY(-160%);
  transition: transform .18s ease;
}
.skip-link:focus { transform: translateY(0); }

.site-shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }

.site-nav {
  position: sticky;
  z-index: 50;
  top: 0;
  border-bottom: 1px solid rgba(255,255,255,.055);
  background: rgba(3, 10, 17, .72);
  backdrop-filter: blur(22px) saturate(130%);
}
.nav-inner {
  min-height: 70px;
  display: flex;
  align-items: center;
  gap: 28px;
}
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; font-weight: 900; letter-spacing: -.02em; }
.brand img { width: 35px; height: 35px; display: block; flex: 0 0 auto; object-fit: contain; image-rendering: auto; filter: none; }
.brand-stack { display: grid; line-height: 1; gap: 3px; }
.brand-name { font-size: 14px; letter-spacing: .02em; }
.brand-sub { font-size: 8px; text-transform: uppercase; letter-spacing: .19em; color: #7fa2b0; }
.nav-links { display: flex; align-items: center; gap: 25px; margin-left: auto; color: #93aeb9; font-size: 12px; font-weight: 750; }
.nav-links a { transition: color .16s ease; }
.nav-links a:hover, .nav-links a:focus-visible { color: #fff; }
.nav-actions { display: flex; align-items: center; gap: 8px; }
.nav-signin { padding: 10px 12px; color: #c5d8df; font-size: 12px; font-weight: 800; }
.nav-primary, .button-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(154, 245, 255, .54);
  border-radius: 999px;
  background: linear-gradient(135deg, #83eff8, #61d8f0 46%, #6877ff);
  color: #031019;
  box-shadow: 0 11px 30px rgba(57, 151, 225, .2), inset 0 1px rgba(255,255,255,.72);
  font-size: 12px;
  font-weight: 950;
  transition: transform .17s ease, filter .17s ease, box-shadow .17s ease;
}
.nav-primary { min-height: 39px; padding: 0 16px; }
.nav-primary:hover, .button-primary:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 16px 38px rgba(57,151,225,.28); }
.nav-menu { display: none; margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.035); color: #d8f5ff; cursor: pointer; }

.hero {
  position: relative;
  padding: 104px 0 80px;
}
.hero:before {
  content: "";
  position: absolute;
  inset: -120px -10vw auto;
  height: 500px;
  pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(83, 219, 246, .10), transparent 64%);
  filter: blur(10px);
}
.hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(520px, 1.08fr);
  gap: 74px;
  align-items: center;
}
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 22px;
  padding: 7px 11px;
  border: 1px solid rgba(119, 235, 255, .14);
  border-radius: 999px;
  background: rgba(10, 33, 50, .54);
  color: #a8edf7;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(120,239,191,.72); }
.hero h1 {
  margin: 0;
  max-width: 680px;
  font-size: clamp(52px, 6.3vw, 88px);
  line-height: .93;
  letter-spacing: -.065em;
  text-wrap: balance;
}
.hero h1 span {
  background: linear-gradient(105deg, #fff 12%, #9cf3ff 52%, #7a83ff 96%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-copy {
  max-width: 640px;
  margin: 26px 0 0;
  color: #a5bec9;
  font-size: clamp(16px, 1.55vw, 20px);
  line-height: 1.65;
  text-wrap: pretty;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.button-primary { min-height: 48px; padding: 0 21px; font-size: 13px; }
.button-secondary {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 19px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: #d4e5eb;
  font-size: 13px;
  font-weight: 850;
  transition: background .17s ease, border-color .17s ease, transform .17s ease;
}
.button-secondary:hover { transform: translateY(-1px); border-color: rgba(145,238,255,.22); background: rgba(255,255,255,.06); }
.hero-note { margin-top: 18px; color: #6f8e9b; font-size: 11px; line-height: 1.5; }

.product-stage { position: relative; min-height: 550px; perspective: 1100px; }
.stage-glow { position: absolute; inset: 14% 7% 0; background: radial-gradient(ellipse, rgba(72,207,236,.19), transparent 67%); filter: blur(34px); }
.product-window {
  position: relative;
  margin: 18px 0 0;
  overflow: hidden;
  border: 1px solid rgba(149, 238, 255, .18);
  border-radius: 30px;
  background: linear-gradient(150deg, rgba(8, 29, 47, .97), rgba(3, 13, 24, .98));
  box-shadow: var(--shadow), inset 0 1px rgba(255,255,255,.07);
  transform: rotateY(-5deg) rotateX(2deg);
  transform-origin: center;
}
.window-bar { min-height: 54px; display: flex; align-items: center; gap: 9px; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.055); background: rgba(255,255,255,.018); }
.window-dot { width: 7px; height: 7px; border-radius: 50%; background: #31515f; }
.window-dot:nth-child(2){ background:#386e7e; }.window-dot:nth-child(3){background:#43a2b4;}
.window-label { margin-left: 8px; color: #72909d; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.window-user { margin-left: auto; width: 27px; height: 27px; border-radius: 9px; background: linear-gradient(135deg, rgba(132,239,255,.22), rgba(100,115,255,.22)); border: 1px solid rgba(142,239,255,.15); }
.window-content { padding: 24px; }
.preview-head { display: flex; gap: 18px; align-items: end; justify-content: space-between; }
.preview-kicker { color: #70ddeb; font-size: 9px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.preview-title { margin: 5px 0 0; font-size: 24px; letter-spacing: -.04em; }
.preview-status { min-width: max-content; padding: 7px 9px; border-radius: 999px; border: 1px solid rgba(126,232,255,.12); color: #87aab6; font-size: 8px; font-weight: 800; }
.preview-feature {
  position: relative;
  min-height: 248px;
  margin-top: 20px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid rgba(127, 232, 255, .10);
  border-radius: 23px;
  background:
    radial-gradient(circle at 75% 20%, rgba(76, 188, 219, .14), transparent 37%),
    linear-gradient(145deg, rgba(11, 37, 57, .94), rgba(5, 18, 31, .95));
}
.preview-feature:after { content:""; position:absolute; width:210px; height:210px; right:-65px; bottom:-90px; border:1px solid rgba(111,231,255,.12); border-radius:50%; box-shadow:0 0 0 30px rgba(111,231,255,.025),0 0 0 62px rgba(111,231,255,.018); }
.preview-feature h3 { margin: 4px 0 8px; max-width: 300px; font-size: 30px; line-height: 1; letter-spacing: -.055em; }
.preview-feature p { max-width: 320px; margin: 0; color: #8ba9b5; font-size: 11px; line-height: 1.55; }
.preview-meter { width: min(320px, 73%); margin-top: 24px; }
.preview-meter-label { display:flex; justify-content:space-between; color:#87a5b1; font-size:8px; font-weight:800; }
.preview-meter-track { height: 6px; margin-top: 8px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.055); }
.preview-meter-fill { width: 72%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--cyan-strong),var(--blue)); box-shadow:0 0 18px rgba(77,213,239,.3); }
.preview-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-top: 11px; }
.preview-tile { min-height: 77px; padding: 12px; border:1px solid rgba(255,255,255,.055); border-radius:16px; background:rgba(255,255,255,.025); }
.preview-tile i { display:block; width:18px; height:18px; margin-bottom:12px; border-radius:6px; background:linear-gradient(135deg,rgba(111,235,255,.5),rgba(92,104,255,.55)); box-shadow:0 0 18px rgba(91,207,235,.12); }
.preview-tile b { display:block; font-size:8px; }.preview-tile span{display:block;margin-top:3px;color:#678590;font-size:7px;}
.floating-card {
  position: absolute;
  z-index: 3;
  display: grid;
  gap: 3px;
  min-width: 148px;
  padding: 13px 14px;
  border: 1px solid rgba(138,238,255,.17);
  border-radius: 18px;
  background: rgba(5, 19, 31, .91);
  box-shadow: 0 25px 60px rgba(0,0,0,.4);
  backdrop-filter: blur(16px);
}
.floating-card b { font-size: 10px; }.floating-card span { color:#7795a2;font-size:8px; }
.float-one { right: -10px; top: 55px; }.float-two { left: -15px; bottom: 45px; }
.float-symbol { width:28px;height:28px;display:grid;place-items:center;margin-bottom:5px;border-radius:9px;background:rgba(99,218,239,.1);color:#9af0fa;font-weight:950; }

.trust-strip { padding: 0 0 84px; }
.trust-row { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06); }
.trust-item { padding: 22px 20px; border-right: 1px solid rgba(255,255,255,.055); }
.trust-item:last-child { border-right: 0; }
.trust-item b { display:block; color:#dff8ff;font-size:12px; }.trust-item span{display:block;margin-top:5px;color:#678693;font-size:9px;line-height:1.45;}

.section { padding: 108px 0; }
.section-header { max-width: 760px; margin-bottom: 46px; }
.section-kicker { color: #79deec; font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.section h2 { margin: 12px 0 0; font-size: clamp(38px, 5vw, 64px); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }
.section-lead { max-width: 680px; margin: 18px 0 0; color:#8faab6;font-size:15px;line-height:1.7; }

.feature-cards { display:grid;grid-template-columns:repeat(3,1fr);gap:14px; }
.feature-card { position:relative; min-height:280px; overflow:hidden; padding:26px; border:1px solid rgba(255,255,255,.065);border-radius:24px;background:linear-gradient(155deg,rgba(10,30,47,.72),rgba(4,15,26,.78));box-shadow:inset 0 1px rgba(255,255,255,.025); }
.feature-card:before { content:"";position:absolute;width:180px;height:180px;right:-78px;top:-80px;border-radius:50%;background:radial-gradient(circle,rgba(89,208,235,.13),transparent 68%); }
.feature-icon { width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(127,235,255,.12);border-radius:14px;background:rgba(112,229,247,.06);color:#95f1fb;font-size:17px;font-weight:950; }
.feature-card h3 { margin:52px 0 9px;font-size:20px;letter-spacing:-.025em; }.feature-card p{margin:0;color:#819eaa;font-size:12px;line-height:1.65;}
.feature-meta { position:absolute;left:26px;bottom:24px;color:#597682;font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase; }

.experience-wrap { display:grid;grid-template-columns: .72fr 1.28fr;gap:42px;align-items:stretch; }
.experience-tabs { display:grid;align-content:start;gap:7px; }
.experience-tab { width:100%;padding:17px 18px;border:1px solid transparent;border-radius:16px;background:transparent;color:#728f9b;text-align:left;cursor:pointer;transition:.16s ease; }
.experience-tab b { display:block;color:inherit;font-size:13px; }.experience-tab span{display:block;margin-top:5px;font-size:9px;line-height:1.45;opacity:.72;}
.experience-tab.active { border-color:rgba(121,230,249,.14);background:rgba(75,185,213,.065);color:#e4faff; }
.experience-panel { min-height:420px;padding:34px;border:1px solid rgba(137,233,255,.10);border-radius:28px;background:linear-gradient(145deg,rgba(7,26,42,.88),rgba(3,13,23,.9));box-shadow:var(--shadow); }
.panel-top { display:flex;align-items:center;gap:8px;color:#6d8c98;font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase; }.panel-top:before{content:"";width:7px;height:7px;border-radius:50%;background:#6ce7b4;box-shadow:0 0 12px rgba(108,231,180,.55);}
.experience-panel h3 { max-width:520px;margin:58px 0 12px;font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.05em; }
.experience-panel>p { max-width:560px;margin:0;color:#88a5b1;font-size:13px;line-height:1.7; }
.panel-demo { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:44px; }
.demo-card { min-height:108px;padding:15px;border:1px solid rgba(255,255,255,.06);border-radius:17px;background:rgba(255,255,255,.025); }
.demo-card b {display:block;font-size:10px;}.demo-card span{display:block;margin-top:5px;color:#688591;font-size:8px;line-height:1.5;}.demo-bar{height:4px;margin-top:22px;border-radius:999px;background:linear-gradient(90deg,#56dcec,var(--blue));opacity:.8;}

.engineering-grid { display:grid;grid-template-columns:1.1fr .9fr;gap:14px; }
.engineering-main, .engineering-side { border:1px solid rgba(255,255,255,.065);border-radius:28px;background:rgba(6,20,33,.68); }
.engineering-main { padding:34px; }.engineering-side{padding:28px;display:grid;align-content:space-between;gap:24px;}
.code-window { margin-top:32px;overflow:hidden;border:1px solid rgba(116,222,242,.1);border-radius:20px;background:#030a11; }
.code-head { display:flex;gap:6px;align-items:center;padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.055); }.code-head i{width:6px;height:6px;border-radius:50%;background:#31505d;}.code-title{margin-left:6px;color:#55717d;font-size:8px;font-weight:800;}
.code-lines{padding:21px;font:10px/1.8 "SFMono-Regular",Consolas,monospace;color:#70909d;}.code-lines em{font-style:normal;color:#83eafa}.code-lines strong{color:#9eabff;font-weight:600}.code-lines .dim{color:#405965}
.tech-chips { display:flex;flex-wrap:wrap;gap:8px;margin-top:26px; }.tech-chip{padding:8px 10px;border:1px solid rgba(126,231,249,.09);border-radius:999px;background:rgba(255,255,255,.025);color:#7898a4;font-size:9px;font-weight:800;}
.metric {padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.06);}.metric:last-child{padding-bottom:0;border-bottom:0}.metric b{display:block;font-size:26px;letter-spacing:-.04em;}.metric span{display:block;margin-top:6px;color:#718e99;font-size:9px;line-height:1.5;}

.security-card { position:relative;display:grid;grid-template-columns:1fr .9fr;gap:50px;overflow:hidden;padding:46px;border:1px solid rgba(123,230,249,.12);border-radius:32px;background:linear-gradient(145deg,rgba(7,29,45,.88),rgba(4,13,24,.92)); }
.security-card:after { content:"";position:absolute;width:430px;height:430px;right:-160px;top:-200px;border-radius:50%;background:radial-gradient(circle,rgba(74,216,239,.14),transparent 65%);pointer-events:none; }
.security-list { position:relative;display:grid;gap:10px;align-content:center; }.security-item{display:flex;gap:12px;align-items:flex-start;padding:15px;border:1px solid rgba(255,255,255,.055);border-radius:16px;background:rgba(255,255,255,.022);}.security-check{width:25px;height:25px;flex:0 0 auto;display:grid;place-items:center;border-radius:8px;background:rgba(93,225,184,.08);color:#80edbd;font-weight:950}.security-item b{display:block;font-size:10px}.security-item span{display:block;margin-top:4px;color:#718e99;font-size:8px;line-height:1.5}

.final-cta { padding: 80px 0 120px; }
.cta-card { position:relative;overflow:hidden;padding:70px 42px;text-align:center;border:1px solid rgba(131,234,251,.13);border-radius:34px;background:linear-gradient(145deg,rgba(10,39,59,.88),rgba(4,15,27,.93));box-shadow:var(--shadow); }
.cta-card:before{content:"";position:absolute;inset:-80% -10% auto;height:340px;background:radial-gradient(ellipse,rgba(90,221,245,.18),transparent 62%);pointer-events:none;}.cta-card>*{position:relative}.cta-card h2{max-width:800px;margin:0 auto;font-size:clamp(40px,5.4vw,66px);line-height:.98;letter-spacing:-.055em}.cta-card p{max-width:620px;margin:18px auto 0;color:#8da9b5;font-size:14px;line-height:1.65}.cta-card .hero-actions{justify-content:center;margin-top:28px;}

.site-footer { border-top:1px solid rgba(255,255,255,.055);padding:30px 0 38px;color:#5f7d89;font-size:9px; }
.footer-row {display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-links{display:flex;gap:18px}.footer-links a:hover{color:#a9c7d2}

.reveal { opacity:0; transform:translateY(16px); transition:opacity .55s ease,transform .55s ease; }.reveal.visible{opacity:1;transform:none}

@media (max-width: 1040px) {
  .hero-grid { grid-template-columns: 1fr; gap: 52px; }
  .hero-copy { max-width: 760px; }
  .product-stage { width:min(760px,100%); min-height:0; margin-inline:auto; }
  .product-window { transform:none; }
  .float-one { right:10px; }.float-two{left:10px;}
  .feature-cards { grid-template-columns:1fr 1fr; }.feature-card:last-child{grid-column:1/-1;min-height:230px;}
  .engineering-grid,.security-card{grid-template-columns:1fr;}
}
@media (max-width: 780px) {
  .site-shell { width:min(100% - 28px,1180px); }
  .nav-links,.nav-actions{display:none}.nav-menu{display:grid;place-items:center}.site-nav.open .nav-links{display:grid;position:absolute;left:14px;right:14px;top:64px;gap:0;padding:8px;border:1px solid rgba(130,232,249,.12);border-radius:18px;background:rgba(3,13,22,.98);box-shadow:0 25px 60px rgba(0,0,0,.42)}.site-nav.open .nav-links a{padding:13px 12px;border-radius:10px}.site-nav.open .nav-links a:hover{background:rgba(255,255,255,.035)}
  .hero{padding-top:76px}.hero h1{font-size:clamp(48px,13vw,72px)}
  .trust-row{grid-template-columns:1fr 1fr}.trust-item:nth-child(2){border-right:0}.trust-item:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.055)}
  .feature-cards,.experience-wrap{grid-template-columns:1fr}.feature-card:last-child{grid-column:auto}.experience-tabs{grid-template-columns:1fr 1fr}.experience-tab{padding:14px}.experience-tab span{display:none}
  .security-card{padding:30px}.section{padding:82px 0}.product-stage{overflow:visible}.floating-card{display:none}
}
@media (max-width: 560px) {
  .hero-actions{display:grid}.button-primary,.button-secondary{width:100%}.hero-note{text-align:center}
  .window-content{padding:17px}.preview-grid{grid-template-columns:1fr 1fr}.preview-feature{min-height:220px}.preview-title{font-size:20px}.preview-status{display:none}
  .trust-row{grid-template-columns:1fr}.trust-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.055)!important}.trust-item:last-child{border-bottom:0!important}
  .experience-tabs{grid-template-columns:1fr}.experience-panel{padding:24px;min-height:390px}.panel-demo{grid-template-columns:1fr}.demo-card{min-height:84px}.experience-panel h3{margin-top:40px}
  .engineering-main,.engineering-side{padding:24px}.code-lines{font-size:8px;overflow-x:auto}.security-card{padding:24px;gap:30px}.cta-card{padding:54px 22px}.footer-row{align-items:flex-start;flex-direction:column}.footer-links{flex-wrap:wrap}
}
@media (prefers-reduced-motion: reduce) {
  html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none}.product-window{transform:none}
}


/* v234Z R76: authenticated public-site bridge + deeper product capability story. */
.nav-session {
  max-width: 150px;
  overflow: hidden;
  color: #678692;
  font-size: 9px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.is-authenticated .nav-signin { color: #a9edf6; }

.capability-section { padding-top: 70px; }
.capability-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.capability-card {
  position: relative;
  min-height: 350px;
  overflow: hidden;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 26px;
  background:
    radial-gradient(circle at 100% 0, rgba(72, 197, 226, .10), transparent 34%),
    linear-gradient(150deg, rgba(8, 29, 45, .82), rgba(3, 14, 24, .86));
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.capability-card-wide {
  grid-column: 1 / -1;
  min-height: 400px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, .88fr);
  gap: 42px;
  align-items: center;
}
.capability-copy { position: relative; z-index: 1; }
.capability-label {
  display: block;
  color: #70ddeb;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.capability-card h3 {
  max-width: 620px;
  margin: 13px 0 10px;
  font-size: clamp(27px, 3vw, 39px);
  line-height: 1.02;
  letter-spacing: -.045em;
}
.capability-card:not(.capability-card-wide) h3 { font-size: 27px; }
.capability-card p {
  max-width: 650px;
  margin: 0;
  color: #86a2ae;
  font-size: 12px;
  line-height: 1.68;
}
.capability-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  margin-bottom: 22px;
  border: 1px solid rgba(123, 232, 251, .13);
  border-radius: 14px;
  background: rgba(107, 222, 242, .06);
  color: #91eff9;
  font-size: 16px;
  font-weight: 950;
}
.capability-pills { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 23px; }
.capability-pills span {
  padding: 7px 9px;
  border: 1px solid rgba(119,224,243,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  color: #73919d;
  font-size: 8px;
  font-weight: 850;
}
.artwork-demo {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 14px;
  align-items: center;
  padding: 20px;
  border: 1px solid rgba(126, 232, 250, .10);
  border-radius: 23px;
  background: rgba(1, 9, 16, .52);
}
.artwork-source { display: grid; gap: 8px; color: #6f8d99; font-size: 8px; font-weight: 850; }
.artwork-source span { color: #a4c3ce; }
.artwork-source small { color: #4e6b77; font-size: 7px; }
.artwork-frame {
  aspect-ratio: 4 / 5;
  border-radius: 15px;
  border: 1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(circle at 65% 25%, rgba(118, 238, 255, .37), transparent 24%),
    linear-gradient(145deg, rgba(84, 106, 255, .56), rgba(7, 30, 45, .75) 54%, rgba(50, 210, 223, .18));
  box-shadow: 0 20px 45px rgba(0,0,0,.32);
}
.artwork-frame-source { filter: saturate(.72) contrast(.9); transform: scale(.93); opacity: .7; }
.artwork-frame-ready { box-shadow: 0 20px 55px rgba(60,192,222,.15), inset 0 1px rgba(255,255,255,.08); }
.artwork-flow { display: grid; justify-items: center; gap: 7px; color: #5d7b87; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.artwork-flow i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: rgba(91, 219, 239, .08); color: #82e9f4; font-style: normal; }

.price-demo, .music-demo, .stat-demo, .offline-demo, .profile-demo {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 27px;
}
.price-demo { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.price-demo div { padding: 12px; border: 1px solid rgba(255,255,255,.055); border-radius: 13px; background: rgba(255,255,255,.025); }
.price-demo span, .price-demo b { display: block; }
.price-demo span { color: #607f8b; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.price-demo b { margin-top: 4px; font-size: 15px; }
.price-demo button { grid-column: 1 / -1; min-height: 34px; border: 1px solid rgba(103,221,241,.12); border-radius: 12px; background: rgba(79,190,213,.07); color: #8fe9f3; font-size: 8px; font-weight: 900; }
.music-demo { display: flex; gap: 12px; align-items: center; padding: 11px; border: 1px solid rgba(255,255,255,.055); border-radius: 15px; background: rgba(255,255,255,.025); }
.music-art { width: 54px; height: 54px; flex: 0 0 auto; border-radius: 12px; background: linear-gradient(145deg,#6c74ff,#38d3e8 55%,#092536); box-shadow: 0 12px 28px rgba(47,177,210,.17); }
.music-lines { min-width:0; display:grid; gap:5px; }.music-lines b{font-size:9px}.music-lines span{color:#688691;font-size:7px}.music-lines small{color:#83dce7;font-size:9px;letter-spacing:.15em}
.stat-demo { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }.stat-demo div{padding:13px 8px;text-align:center;border:1px solid rgba(255,255,255,.055);border-radius:13px;background:rgba(255,255,255,.025)}.stat-demo b{display:block;font-size:18px}.stat-demo span{display:block;margin-top:4px;color:#607c88;font-size:7px;text-transform:uppercase;letter-spacing:.08em}
.offline-demo, .profile-demo { display:flex;align-items:center;gap:11px;padding:14px;border:1px solid rgba(255,255,255,.055);border-radius:14px;background:rgba(255,255,255,.025) }.offline-demo i{width:9px;height:9px;border-radius:50%;background:#76e7b8;box-shadow:0 0 14px rgba(118,231,184,.55)}.offline-demo b,.profile-demo b{font-size:9px}.offline-demo span,.profile-demo span{margin-left:auto;color:#607e89;font-size:7px}.profile-demo i{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,rgba(115,235,249,.24),rgba(102,111,255,.26));border:1px solid rgba(130,232,249,.12)}.profile-demo div{display:grid;gap:3px}.profile-demo span{margin:0}.profile-demo em{margin-left:auto;color:#79e8b8;font-style:normal}
.workflow-strip { margin-top: 14px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 22px; border:1px solid rgba(255,255,255,.06);border-radius:18px;background:rgba(255,255,255,.022);color:#688590;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em }.workflow-strip span{display:flex;align-items:center;gap:8px}.workflow-strip b{width:24px;height:24px;display:grid;place-items:center;border:1px solid rgba(113,225,244,.10);border-radius:8px;color:#82e6f1;font-size:7px}.workflow-strip i{color:#3f5a66;font-style:normal}

@media (max-width: 1040px) {
  .capability-card-wide { grid-template-columns: 1fr; }
  .artwork-demo { max-width: 660px; width: 100%; }
}
@media (max-width: 780px) {
  .nav-session { display: none; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-card-wide { grid-column: auto; }
  .capability-card { min-height: 330px; padding: 24px; }
  .price-demo, .music-demo, .stat-demo, .offline-demo, .profile-demo { left:24px;right:24px;bottom:23px; }
  .workflow-strip { display:grid; grid-template-columns:1fr; overflow:visible; justify-content:stretch; gap:8px; }
  .workflow-strip span{min-width:0; justify-content:flex-start}
  .workflow-strip i{display:none}
}
@media (max-width: 560px) {
  .artwork-demo { grid-template-columns: 1fr 36px 1fr; gap: 7px; padding: 13px; }
  .capability-card-wide { min-height: auto; }
  .capability-card-wide .artwork-demo { margin-top: 8px; }
  .capability-card:not(.capability-card-wide) h3 { font-size: 24px; }
}

/* v234Z R77 — public Game Zone showcase + session-polish pass. */
[hidden] { display: none !important; }

.nav-session {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 150px;
  padding: 7px 10px;
  overflow: hidden;
  border: 1px solid rgba(120,239,191,.13);
  border-radius: 999px;
  background: rgba(120,239,191,.045);
  color: #bdeed7;
  font-size: 9px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-session:before { content:""; flex:0 0 auto; width:6px; height:6px; border-radius:50%; background:#78efbf; box-shadow:0 0 10px rgba(120,239,191,.58); }
.is-authenticated .nav-signin {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
  border: 1px solid rgba(132,239,255,.23);
  border-radius: 999px;
  background: rgba(93,211,235,.075);
  color: #baf5ff;
}

.public-game-showcase { overflow: hidden; }
.public-game-grid {
  display: grid;
  grid-template-columns: 1.32fr .88fr .88fr;
  grid-template-rows: repeat(2,minmax(185px,auto));
  gap: 14px;
}
.public-game-card {
  position: relative;
  display: grid;
  grid-template-columns: 112px minmax(0,1fr);
  gap: 17px;
  align-items: center;
  min-height: 185px;
  padding: 19px;
  overflow: hidden;
  border: 1px solid rgba(137,235,255,.1);
  border-radius: 25px;
  background: linear-gradient(145deg,rgba(12,35,52,.76),rgba(5,16,28,.9));
  box-shadow: 0 22px 58px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.035);
  transition: transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.public-game-card:before { content:""; position:absolute; width:230px; height:230px; left:-90px; top:-90px; border-radius:50%; background:radial-gradient(circle,rgba(78,218,243,.13),transparent 69%); pointer-events:none; }
.public-game-card:hover,.public-game-card:focus-visible { transform:translateY(-3px); border-color:rgba(139,240,255,.26); background:linear-gradient(145deg,rgba(15,44,64,.9),rgba(6,20,34,.94)); box-shadow:0 28px 65px rgba(0,0,0,.29),0 0 32px rgba(58,187,221,.065); }
.public-game-card-featured { grid-row:1 / span 2; grid-template-columns:1fr; align-content:end; min-height:384px; padding:25px; }
.public-game-card-featured .public-game-art { width:100%; height:198px; }
.public-game-art { position:relative; z-index:1; display:grid; place-items:center; width:108px; height:108px; border:1px solid rgba(255,255,255,.07); border-radius:22px; background:radial-gradient(circle at 50% 34%,rgba(94,229,251,.12),rgba(255,255,255,.02) 65%); }
.public-game-art img { max-width:88%; max-height:88%; object-fit:contain; filter:drop-shadow(0 14px 20px rgba(0,0,0,.35)); }
.public-game-card > div:last-child { position:relative; z-index:1; min-width:0; }
.public-game-card small { display:block; color:#78ddec; font-size:8px; font-weight:950; letter-spacing:.14em; text-transform:uppercase; }
.public-game-card h3 { margin:6px 0 0; color:#f5fdff; font-size:18px; letter-spacing:-.025em; }
.public-game-card p { margin:8px 0 0; color:#88a5b1; font-size:10px; line-height:1.56; }
.public-game-card span { display:inline-block; margin-top:12px; color:#9cefff; font-size:9px; font-weight:950; }
.public-game-card-featured h3 { font-size:27px; }
.public-game-card-featured p { max-width:520px; font-size:11px; }
.public-game-footer { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:15px; padding:15px 17px; border:1px solid rgba(129,236,255,.09); border-radius:20px; background:rgba(255,255,255,.025); }
.public-game-footer b { display:block; color:#effcff; font-size:11px; }
.public-game-footer div>span { display:block; margin-top:4px; color:#7896a2; font-size:9px; }
.public-game-footer .button-primary { min-height:42px; padding-inline:17px; white-space:nowrap; }

@media(max-width:980px){
  .public-game-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}.public-game-card-featured{grid-column:1/-1;grid-row:auto;grid-template-columns:180px minmax(0,1fr);min-height:220px}.public-game-card-featured .public-game-art{width:170px;height:170px}.public-game-card-featured h3{font-size:22px}
}
@media(max-width:650px){
  .public-game-grid{grid-template-columns:1fr}.public-game-card,.public-game-card-featured{grid-column:auto;grid-template-columns:82px minmax(0,1fr);min-height:130px;padding:14px}.public-game-card-featured .public-game-art,.public-game-art{width:78px;height:78px;border-radius:18px}.public-game-card-featured h3,.public-game-card h3{font-size:17px}.public-game-card p,.public-game-card-featured p{font-size:9px}.public-game-footer{align-items:flex-start;flex-direction:column}.nav-session{max-width:112px}
}


/* v234Z R79 — mobile public-home horizontal viewport lock.
   The product homepage intentionally has no horizontal panning surface on phones.
   Game Zone keeps its own horizontal carousel because it is a different document. */
@media (max-width: 780px) {
  html.public-home-root,
  body.public-home-page {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    overscroll-behavior-x: none;
  }
  body.public-home-page {
    touch-action: pan-y pinch-zoom;
  }
  body.public-home-page main,
  body.public-home-page .site-nav,
  body.public-home-page .site-footer {
    max-width: 100%;
    overflow-x: clip;
  }
}

/* v234Z R81 — desktop public Game Zone balance pass.
   R77's desktop layout gave Defenders a two-row featured slot while the other
   games were compressed.  Keep the mobile treatment, but make desktop/tablet
   presentation symmetrical and artwork-first. */
@media (min-width: 651px) {
  .public-game-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 16px;
    align-items: stretch;
  }
  .public-game-card,
  .public-game-card-featured {
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr;
    grid-template-rows: 158px minmax(0, 1fr);
    align-content: start;
    min-height: 356px;
    padding: 18px;
    gap: 16px;
  }
  .public-game-card .public-game-art,
  .public-game-card-featured .public-game-art {
    width: 100%;
    height: 158px;
    border-radius: 22px;
    overflow: hidden;
  }
  .public-game-card .public-game-art img,
  .public-game-card-featured .public-game-art img {
    max-width: 82%;
    max-height: 82%;
  }
  .public-game-card h3,
  .public-game-card-featured h3 {
    font-size: 21px;
    line-height: 1.05;
  }
  .public-game-card p,
  .public-game-card-featured p {
    max-width: none;
    font-size: 10.5px;
    line-height: 1.58;
  }
  .public-game-card span { margin-top: auto; }
}
@media (min-width: 651px) and (max-width: 1100px) {
  .public-game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .public-game-card,
  .public-game-card-featured {
    grid-template-columns: 150px minmax(0, 1fr);
    grid-template-rows: auto;
    min-height: 210px;
    align-items: center;
  }
  .public-game-card .public-game-art,
  .public-game-card-featured .public-game-art { width: 150px; height: 150px; }
}