:root { --navy:#23297a; --navy2:#151a52; --copper:#c89b6d; --ink:#1d2233; --mute:#5b6275; --line:#e2e5ee; --tint:#f1f2f8; --bg:#ffffff; }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body { margin:0; font-family:"Inter","Segoe UI",Arial,sans-serif; color:var(--ink); background:var(--bg); font-size:16px; line-height:1.6; }
  img { max-width:100%; display:block; }
  a { color:var(--navy); }
  .wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
  .eyebrow { font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--copper); }
  h1,h2,h3 { color:var(--navy2); line-height:1.15; margin:0; }
  h2 { font-size:32px; font-weight:700; letter-spacing:-.01em; }
  .lead { font-size:18px; color:#3a4157; }
  section { padding:80px 0; }
  .btn { display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius:6px; font-weight:600; font-size:15px; text-decoration:none; border:1.5px solid var(--navy); transition:.15s; }
  .btn.primary { background:var(--navy); color:#fff; }
  .btn.primary:hover { background:var(--navy2); }
  .btn.ghost { color:var(--navy); background:#fff; }
  .btn.ghost:hover { background:var(--tint); }

  /* nav */
  .topbar { background:var(--navy2); color:#c9cde4; font-size:13px; }
  .topbar .wrap { display:flex; justify-content:flex-end; gap:22px; padding-top:7px; padding-bottom:7px; }
  nav.main { position:sticky; top:0; z-index:10; background:#fff; border-bottom:1px solid var(--line); }
  nav.main .wrap { display:flex; align-items:center; justify-content:space-between; height:92px; }
  nav.main img { height:60px; }
  nav.main ul { list-style:none; display:flex; gap:30px; margin:0; padding:0; font-size:15px; font-weight:500; }
  nav.main ul a { text-decoration:none; color:var(--ink); }
  nav.main ul a.on { color:var(--navy); border-bottom:2px solid var(--copper); padding-bottom:4px; }
  nav.main .btn { padding:10px 18px; font-size:14px; }

  /* sticky in-page nav */
  .subnav { position:sticky; top:92px; z-index:9; background:rgba(255,255,255,.96); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
  .subnav .wrap { display:flex; align-items:center; gap:26px; height:54px; overflow-x:auto; white-space:nowrap; scrollbar-width:none; }
  .subnav .wrap::-webkit-scrollbar { display:none; }
  .subnav b { color:var(--navy2); font-size:14px; margin-right:6px; }
  .subnav a { text-decoration:none; color:var(--mute); font-size:14px; font-weight:500; }
  .subnav a:hover { color:var(--navy); }
  .subnav .dl { margin-left:auto; color:var(--navy); font-weight:600; }
  section[id], header[id] { scroll-margin-top:150px; }
  .ov figure { margin:0; }
  .ov figure img { border-radius:14px; width:100%; }
  .ov figcaption { font-size:13px; color:var(--mute); margin-top:10px; }
  /* hero */
  .hero { padding:56px 0 40px; background:linear-gradient(180deg,#f7f8fb 0%, #fff 100%); }
  .crumb { font-size:13px; color:var(--mute); margin-bottom:22px; }
  .crumb a { color:var(--mute); text-decoration:none; }
  .hero .grid { display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
  .hero h1 { font-size:52px; font-weight:700; letter-spacing:-.02em; margin:12px 0 14px; }
  .hero .sub { font-size:21px; color:var(--copper); font-weight:600; margin:0 0 18px; }
  .hero .pills { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 30px; }
  .hero .pills span { background:#fff; border:1px solid var(--line); border-radius:99px; padding:5px 13px; font-size:13px; font-weight:500; color:var(--navy); }
  .hero .ctas { display:flex; gap:12px; flex-wrap:wrap; }
  .hero .photo { background:linear-gradient(180deg,#e9ecf3 0%,#ffffff 100%); padding:28px; border-radius:14px; overflow:hidden; aspect-ratio:4/5; }
  .hero .photo img { width:100%; height:100%; object-fit:contain; }

  /* figure tiles (from datasheet v1) */
  .figs { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-top:44px; }
  .figs div { background:var(--tint); border-radius:10px; padding:18px 18px 16px; }
  .figs b { display:block; font-size:26px; font-weight:700; color:var(--navy); line-height:1.1; white-space:nowrap; }
  .figs i { display:block; width:26px; height:3px; background:var(--copper); margin:12px 0 9px; }
  .figs span { font-size:13px; color:var(--mute); }
  .fn { font-size:12px; color:var(--mute); margin-top:10px; }

  /* overview */
  .ov { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
  .ov p { margin:0 0 16px; }
  .ov .cad { background:linear-gradient(180deg,#eef0f5,#fff); border-radius:14px; padding:24px; }
  .ov figure img { max-height:620px; object-fit:cover; }

  /* features */
  .bgtint { background:#f7f8fb; }
  .head { max-width:720px; margin-bottom:44px; }
  .head h2 { margin-top:10px; }
  .head p { color:var(--mute); margin:14px 0 0; }
  .feats { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
  .feat { background:#fff; border:1px solid var(--line); border-radius:12px; padding:24px; }
  .feat .ic { width:44px; height:44px; border-radius:10px; background:var(--tint); display:grid; place-items:center; margin-bottom:16px; }
  .feat .ic svg { width:22px; height:22px; stroke:var(--navy); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .feat h3 { font-size:17px; font-weight:600; margin-bottom:8px; }
  .feat p { margin:0; font-size:14.5px; color:var(--mute); line-height:1.55; }

  /* steps */
  .steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; counter-reset:s; border-top:1px solid var(--line); }
  .step { padding:26px 24px 0 0; counter-increment:s; position:relative; }
  .step::before { content:"0" counter(s); display:block; font-size:14px; font-weight:700; color:var(--copper); margin-bottom:10px; }
  .step::after { content:""; position:absolute; top:-4px; left:0; width:8px; height:8px; border-radius:50%; background:var(--navy); }
  .step h3 { font-size:17px; font-weight:600; margin-bottom:6px; }
  .step p { margin:0; font-size:14.5px; color:var(--mute); }

  /* bands */
  .bands { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
  .band { border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; }
  .band .top { padding:20px 22px; border-bottom:1px solid var(--line); }
  .band .top b { font-size:24px; color:var(--navy2); }
  .band .top span { display:block; font-size:14px; color:var(--mute); margin-top:2px; }
  .band .top em { font-style:normal; float:right; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--copper); background:#faf3ec; padding:3px 8px; border-radius:4px; }
  .band dl { margin:0; padding:10px 22px 18px; font-size:14px; }
  .band dl div { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px dashed var(--line); }
  .band dl div:last-child { border-bottom:0; }
  .band dt { color:var(--mute); }
  .band dd { margin:0; font-weight:600; text-align:right; }
  .band .big { font-size:34px; font-weight:700; color:var(--navy); line-height:1; margin-top:14px; }
  .band .big small { font-size:15px; color:var(--mute); font-weight:500; }

  /* dual band */
  .dual { display:grid; grid-template-columns:.8fr 1.2fr; gap:56px; align-items:center; margin-top:72px; padding-top:72px; border-top:1px solid var(--line); scroll-margin-top:150px; }
  .dual .ph { background:linear-gradient(180deg,#e9ecf3 0%,#ffffff 100%); border-radius:14px; padding:24px; aspect-ratio:4/5; }
  .dual .ph img { width:100%; height:100%; object-fit:contain; }
  .dual h2 { margin:10px 0 16px; }
  .dual > div > p { margin:0 0 14px; color:#3a4157; }
  .dtab { width:100%; border-collapse:collapse; font-size:14px; margin-top:22px; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
  .dtab th { background:var(--navy2); color:#fff; text-align:left; font-weight:600; padding:10px 14px; }
  .dtab th:first-child { color:#c9cde4; font-weight:500; }
  .dtab td { padding:10px 14px; border-top:1px solid var(--line); font-weight:600; }
  .dtab td:first-child { color:var(--mute); font-weight:400; }
  .dtab tr:nth-child(even) td { background:#f7f8fb; }

  /* specs accordion */
  .specs { display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; align-items:start; }
  details { border:1px solid var(--line); border-radius:10px; background:#fff; }
  summary { list-style:none; cursor:pointer; padding:16px 20px; font-weight:600; color:var(--navy2); display:flex; justify-content:space-between; align-items:center; }
  summary::-webkit-details-marker { display:none; }
  summary::after { content:"+"; font-size:22px; font-weight:400; color:var(--copper); line-height:1; }
  details[open] summary::after { content:"–"; }
  details table { width:100%; border-collapse:collapse; font-size:14px; }
  details td { padding:9px 20px; border-top:1px solid var(--line); }
  details td:first-child { color:var(--mute); width:48%; }
  details td:last-child { font-weight:600; }

  /* at a glance list */
  .glance { list-style:none; padding:0; margin:22px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; font-size:15px; }
  .glance li { padding-left:22px; position:relative; }
  .glance li::before { content:""; position:absolute; left:0; top:11px; width:10px; height:2px; background:var(--copper); }

  /* applications */
  .apps { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .app { background:#fff; border:1px solid var(--line); border-top:3px solid var(--navy); border-radius:0 0 12px 12px; padding:24px; }
  .app h3 { font-size:17px; font-weight:600; margin-bottom:8px; }
  .app p { margin:0; font-size:14.5px; color:var(--mute); line-height:1.55; }
  .bandnote { margin-top:26px; font-size:14.5px; color:var(--mute); max-width:900px; }
  .bandnote b { color:var(--ink); }

  /* why */
  .why { display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:start; }
  .why p { margin:0 0 16px; }
  .why ol { list-style:none; margin:0; padding:0; counter-reset:w; }
  .why li { counter-increment:w; display:grid; grid-template-columns:44px 1fr; gap:4px 14px; padding:18px 0; border-bottom:1px solid var(--line); }
  .why li:first-child { padding-top:0; }
  .why li::before { content:"0" counter(w); grid-row:span 2; font-weight:700; color:var(--copper); font-size:15px; }
  .why li b { color:var(--navy2); font-size:16.5px; }
  .why li span { color:var(--mute); font-size:14.5px; }

  /* faq */
  .faq { display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; align-items:start; }
  .faq details p { margin:0; padding:0 20px 18px; font-size:14.5px; color:var(--mute); line-height:1.6; }

  /* gui */
  .gui { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  .gui figure { margin:0; }
  .gui img { border:1px solid var(--line); border-radius:10px; box-shadow:0 10px 30px rgba(21,26,82,.08); }
  .gui figcaption { margin-top:12px; font-size:14px; color:var(--mute); }
  .gui figcaption b { color:var(--ink); }

  /* cta */
  .cta { background:var(--navy2); color:#fff; border-radius:18px; padding:56px; display:grid; grid-template-columns:1.1fr .9fr; gap:48px; }
  .cta h2 { color:#fff; }
  .cta p { color:#c9cde4; }
  .cta .dl { display:flex; align-items:center; gap:16px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:16px 18px; margin-top:26px; text-decoration:none; color:#fff; }
  .cta .dl .pdf { width:44px; height:52px; border-radius:6px; background:var(--copper); display:grid; place-items:center; font-size:12px; font-weight:700; color:var(--navy2); }
  .cta .dl small { display:block; color:#aab0d0; }
  form { display:grid; gap:12px; }
  form .row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  input, select, textarea { width:100%; padding:12px 14px; border-radius:8px; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.07); color:#fff; font:inherit; font-size:15px; }
  input::placeholder, textarea::placeholder { color:#9aa0c4; }
  select { color:#c9cde4; }
  select option { color:#000; }
  form .bad { border-color:#ff8a7a !important; }
  .cfok { display:none; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:32px 28px; text-align:center; align-self:center; }
  .cfok b { display:block; color:#fff; font-size:20px; margin-bottom:8px; }
  .cfok p { margin:0; }
  form .btn { justify-content:center; background:var(--copper); border-color:var(--copper); color:var(--navy2); }

  footer { background:#0f1440; color:#aab0d0; padding:48px 0 28px; margin-top:80px; font-size:14px; }
  footer .grid { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:32px; }
  footer h4 { color:#fff; margin:0 0 12px; font-size:14px; }
  footer a { color:#aab0d0; text-decoration:none; display:block; margin-bottom:6px; }
  footer a.li { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; margin:16px 0 0; border-radius:8px; background:#0a66c2; color:#fff; transition:background .2s; }
  footer a.li:hover { background:#004182; }
  footer .copy { border-top:1px solid rgba(255,255,255,.1); margin-top:36px; padding-top:20px; display:flex; justify-content:space-between; font-size:13px; }

  .note { position:fixed; right:16px; bottom:16px; background:#fff8e6; border:1px solid #f0d9a0; color:#6b5210; font-size:12px; padding:8px 12px; border-radius:8px; z-index:20; }

  @media (max-width: 980px) {
    nav.main ul { display:none; }
    .hero .grid, .ov, .cta, .specs, .gui, .dual { grid-template-columns:1fr; }
    .dtab { font-size:13px; } .dtab th, .dtab td { padding:9px 10px; }
    .figs { grid-template-columns:repeat(3,1fr); }
    .feats, .bands, .apps { grid-template-columns:repeat(2,1fr); }
    .why, .faq { grid-template-columns:1fr; gap:32px; }
    .steps { grid-template-columns:repeat(2,1fr); gap:0 16px; }
    .hero h1 { font-size:40px; }
    footer .grid { grid-template-columns:1fr 1fr; }
  }
  @media (max-width: 600px) {
    .wrap { padding:0 16px; }
    section { padding:56px 0; }
    .hero h1 { font-size:32px; }
    .hero .sub { font-size:18px; }
    h2 { font-size:26px; }
    .figs { grid-template-columns:repeat(2,1fr); }
    .figs b { font-size:22px; }
    .feats, .bands, .steps, .apps, .glance { grid-template-columns:1fr; }
    .cta { padding:28px 20px; }
    form .row { grid-template-columns:1fr; }
    .topbar .wrap { justify-content:center; flex-wrap:wrap; gap:8px 16px; }
    footer .grid { grid-template-columns:1fr; }
    footer .copy { flex-direction:column; gap:6px; }
  }

nav.main .mnav { display:none; -webkit-appearance:none; appearance:none; flex:none; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:44px; height:44px; margin-left:4px; padding:0; border:0; border-radius:8px; background:transparent; color:#1d2233; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  nav.main .mnav span { display:block; flex:none; width:24px; min-width:24px; height:2px; border-radius:2px; background:#1d2233; transition:transform .2s, opacity .2s; }
  nav.main.open .mnav span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  nav.main.open .mnav span:nth-child(2) { opacity:0; }
  nav.main.open .mnav span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  nav.main ul li.mcta { display:none; }
  @media (max-width: 980px) {
    nav.main .wrap { gap:12px; }
    nav.main .btn { margin-left:auto; }
    nav.main .mnav { display:flex; }
    nav.main.open ul { display:flex; flex-direction:column; gap:0; position:absolute; left:0; right:0; top:100%; padding:6px 16px 18px; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 14px 28px rgba(15,20,64,.14); }
    nav.main.open ul li a { display:block; padding:14px 6px; border-bottom:1px solid var(--line); font-size:17px; }
    nav.main.open ul li a.on { border-bottom:1px solid var(--line); padding-bottom:14px; color:var(--navy); font-weight:700; }
  }
  @media (max-width: 600px) {
    nav.main .btn { display:none; }
    nav.main .mnav { margin-left:auto; }
    nav.main.open ul li.mcta { display:block; padding-top:14px; }
    nav.main.open ul li.mcta a { border:0; padding:13px 18px; border-radius:6px; background:var(--navy); color:#fff; text-align:center; font-weight:600; font-size:16px; }
  }

.gate { position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center; padding:16px; background:rgba(15,20,64,.62); backdrop-filter:blur(3px); }
  .gate.open { display:flex; }
  .gate .box { position:relative; width:100%; max-width:560px; max-height:calc(100vh - 32px); overflow:auto; background:#fff; border-radius:14px; box-shadow:0 30px 80px rgba(0,0,0,.35); font-family:"Inter","Segoe UI",Arial,sans-serif; color:#1d2233; }
  .gate .hd { display:flex; gap:16px; align-items:center; padding:24px 28px 18px; border-bottom:1px solid #e2e5ee; }
  .gate .hd .pdf { flex:none; width:44px; height:52px; border-radius:6px; background:#c89b6d; display:grid; place-items:center; font-size:12px; font-weight:700; color:#151a52; }
  .gate .hd b { display:block; color:#151a52; font-size:18px; line-height:1.25; }
  .gate .hd small { color:#5b6275; font-size:13px; }
  .gate .x { position:absolute; top:12px; right:14px; width:34px; height:34px; border:0; background:none; font-size:26px; line-height:1; color:#5b6275; cursor:pointer; border-radius:6px; }
  .gate .x:hover { background:#f1f2f8; }
  .gate form { display:grid !important; margin:0; gap:12px; padding:20px 28px 26px; }
  .gate p.in { margin:0 0 4px; font-size:14px; color:#5b6275; }
  .gate .row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .gate label.f { display:grid; gap:5px; font-size:13px; font-weight:600; color:#1d2233; }
  .gate label.f i { font-style:normal; color:#c0392b; }
  .gate input[type=text], .gate input[type=email], .gate select { width:100%; padding:11px 13px; border-radius:8px; border:1px solid #cfd3e0; background:#fff; color:#1d2233; font:inherit; font-size:15px; font-weight:400; }
  .gate input:focus, .gate select:focus { outline:2px solid rgba(35,41,122,.25); border-color:#23297a; }
  .gate .bad { border-color:#c0392b !important; }
  .gate .chk { display:flex; gap:10px; align-items:flex-start; font-size:13px; color:#5b6275; line-height:1.45; }
  .gate .chk input { flex:none; width:16px !important; height:16px; margin:2px 0 0; padding:0; accent-color:#23297a; }
  .gate .chk a { color:#23297a; }
  .gate p.pn { margin:0; font-size:12.5px; color:#5b6275; line-height:1.5; }
  .gate p.pn a { color:#23297a; }
  .gate .err { display:none; font-size:13px; color:#c0392b; }
  .gate button.go { margin-top:4px; padding:13px 22px; border-radius:6px; border:0; background:#23297a; color:#fff; font:inherit; font-weight:600; font-size:15px; cursor:pointer; }
  .gate button.go:hover { background:#151a52; }
  .gate .ok { display:none; padding:34px 28px 30px; text-align:center; }
  .gate .ok b { display:block; color:#151a52; font-size:19px; margin-bottom:8px; }
  .gate .ok p { margin:0 0 18px; color:#5b6275; font-size:14.5px; }
  .gate .ok a, .gate .ok button.lnk { color:#23297a; font-weight:600; background:none; border:0; padding:0; font:inherit; font-size:15px; cursor:pointer; }
  .gate .ok strong { color:#151a52; word-break:break-all; }
  .gate.done form { display:none; } .gate.done .ok { display:block; }
  @media (max-width:600px) { .gate .row { grid-template-columns:1fr; } .gate .hd, .gate form { padding-left:20px; padding-right:20px; } }
