/* ---------- blob mark ---------- */
  .blob{display:inline-block;}
  .blob svg{display:block;}

  /* ---------- header ---------- */
  header.top{
    display:flex;align-items:center;justify-content:space-between;
    padding:6px 4px 22px;
    flex-wrap:wrap; gap:14px;
  }
  .brand{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .logo-img{height:26px;width:auto;display:block;}
  .sub-pill{font-size:11px;color:var(--muted);font-weight:700;letter-spacing:.4px;text-transform:uppercase;
    background:#f2f2f2;border:1px solid var(--line);padding:5px 10px;border-radius:999px;}
  nav.tabs{display:flex;background:#fff;border-radius:999px;padding:4px;gap:2px;border:1px solid var(--line);}
  nav.tabs button{
    border:none;background:transparent;padding:9px 18px;border-radius:999px;
    font-family:inherit;font-weight:600;font-size:13.5px;color:var(--black);cursor:pointer;
    transition:background .18s ease, color .18s ease;
  }
  nav.tabs button.active{background:var(--orange);color:#fff;}

  /* ---------- section divider (manual motif: dashed line + dot) ---------- */
  .divider{display:flex;align-items:center;gap:0;margin:6px 0 26px;}
  .divider .rule{flex:1;height:0;border-top:2px dashed var(--purple);}
  .divider .dot{width:14px;height:14px;border-radius:50%;background:var(--purple);margin-left:-1px;flex-shrink:0;}

  h1.page-title{font-size:34px;font-weight:700;margin:0 0 4px;letter-spacing:-0.5px;}
  h1.page-title b{font-weight:900;}
  p.page-desc{color:var(--muted);font-size:15px;margin:0 0 18px;max-width:560px;line-height:1.5;}

  /* ---------- card ---------- */
  .card{
    background:var(--bg-card);
    border-radius:var(--radius);
    border:1px solid var(--line);
    padding:30px 28px;
    box-shadow:0 1px 2px rgba(17,17,17,.03), 0 12px 32px -16px rgba(17,17,17,.10);
  }