@font-face{font-family:Manrope;src:url("../assets/fonts/manrope-regular.ttf") format("truetype");font-display:swap}
@font-face{font-family:Orbitron;src:url("../assets/fonts/orbitron-bold.ttf") format("truetype");font-weight:700;font-display:swap}

  500;600;700;800&family=Orbitron:wght@500;600;700&display=swap');

  :root {
    --bg: #020407;
    --bg-soft: #071018;
    --panel: #0b1520;
    --ink: #f0f4fa;
    --muted: #9aa6b9;
    --dim: #738094;
    --blue: #75b8ff;
    --blue-deep: #397eff;
    --line: rgba(153, 187, 231, 0.18);
    --orange: #ff9a42;
    --font: Manrope, system-ui, sans-serif;
    --display: Orbitron, "Arial Black", sans-serif;
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }

  html, body {
    background: var(--bg);
    color: var(--ink);
    font: 400 9.6pt/1.35 var(--font);
    -webkit-font-smoothing: antialiased;
  }

  body {
    background:
      radial-gradient(ellipse 70% 40% at 50% -10%, rgba(57, 126, 255, 0.16), transparent 60%),
      radial-gradient(ellipse 40% 30% at 100% 40%, rgba(61, 58, 128, 0.08), transparent),
      var(--bg);
  }

  .page {
    width: 8.5in;
    min-height: 11in;
    margin: 0 auto;
    padding: 0.34in 0.5in 0.28in;
  }

  header.brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 12px;
  }

  header.brand .left {
    display: flex;
    align-items: center;
    gap: 14px;
  }

  header.brand img {
    height: 32px;
    width: auto;
    display: block;
  }

  header.brand .meta {
    font-size: 8.5pt;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--dim);
    line-height: 1.45;
  }

  header.brand .meta strong {
    display: block;
    color: var(--blue);
    font-weight: 700;
    letter-spacing: 0.18em;
    font-size: 8pt;
    margin-bottom: 2px;
  }

  header.brand .doc-label {
    text-align: right;
    font-size: 8pt;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--muted);
  }

  header.brand .doc-label b {
    display: block;
    color: var(--ink);
    font-family: var(--display);
    font-weight: 600;
    font-size: 11pt;
    letter-spacing: 0.04em;
    margin-bottom: 3px;
  }

  h1 {
    font-family: var(--display);
    font-size: 13.5pt;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.25;
    margin: 2px 0 2px;
    background: linear-gradient(180deg, #fff 10%, #d1dfeb 45%, #8fa6bd 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .tagline {
    font-size: 8.5pt;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--blue);
    font-weight: 700;
    margin-bottom: 10px;
  }

  .glance {
    background: linear-gradient(155deg, rgba(22, 37, 50, 0.75), rgba(5, 9, 16, 0.9));
    border: 1px solid rgba(123, 157, 187, 0.28);
    border-radius: 8px;
    padding: 10px 13px;
    margin-bottom: 12px;
    position: relative;
  }

  .glance::before {
    content: "";
    position: absolute;
    inset: -1px 18% auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, #b2dbff, transparent);
  }

  .glance .label {
    font-size: 7.5pt;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--blue);
    margin-bottom: 6px;
  }

  .glance p {
    color: #c8d6e5;
    font-size: 8.8pt;
    line-height: 1.35;
  }

  h2 {
    font-family: var(--display);
    font-size: 10pt;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: #d9e8f5;
    margin: 6px 0 2px;
    padding-top: 0;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  h2::before {
    content: "";
    width: 18px;
    height: 1px;
    background: var(--blue);
    flex: none;
  }

  p, li {
    color: #b8c5d4;
    font-size: 8.8pt;
    line-height: 1.35;
  }

  p { margin-bottom: 5px; }
  p strong, li strong { color: #e8eef6; font-weight: 700; }

  ul {
    margin: 2px 0 5px 0;
    padding-left: 0;
    list-style: none;
  }

  ul li {
    position: relative;
    padding-left: 16px;
    margin-bottom: 2px;
  }

  ul li::before {
    content: "▸";
    position: absolute;
    left: 0;
    color: var(--blue);
    font-size: 8pt;
    top: 1px;
  }

  .grid-3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    margin: 6px 0 8px;
  }

  .pkg {
    background: linear-gradient(160deg, rgba(22, 37, 50, 0.55), rgba(5, 9, 16, 0.85));
    border: 1px solid rgba(123, 157, 187, 0.22);
    border-radius: 7px;
    padding: 7px 9px;
  }

  .pkg.featured {
    border-color: rgba(114, 182, 238, 0.55);
    background: linear-gradient(160deg, rgba(25, 68, 95, 0.4), rgba(7, 16, 27, 0.9));
  }

  .pkg .name {
    font-family: var(--display);
    font-size: 10pt;
    color: #d9e8f5;
    font-weight: 500;
    margin-bottom: 2px;
  }

  .pkg .price {
    font-size: 9pt;
    color: #eaf2fa;
    font-weight: 700;
    margin-bottom: 2px;
  }

  .pkg .price .old {
    color: #7d8999;
    text-decoration: line-through;
    font-weight: 500;
    margin-right: 6px;
  }

  .pkg .bf {
    font-size: 7.5pt;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--orange);
    font-weight: 700;
    margin-bottom: 4px;
  }

  .pkg .mo {
    font-size: 8.5pt;
    color: #9eb3c8;
    margin-bottom: 7px;
  }

  .pkg ul li {
    font-size: 8pt;
    margin-bottom: 1px;
    color: #a8b8c9;
  }

  .note {
    font-size: 8.5pt;
    color: var(--dim);
    margin: 2px 0 6px;
  }

  .two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
  }

  .sig-block {
    break-inside: avoid;
    page-break-inside: avoid;
    margin-top: 8px;
    padding: 8px 11px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(11, 21, 32, 0.6);
  }

  .sig-block .label {
    font-size: 7.5pt;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--blue);
    font-weight: 800;
    margin-bottom: 6px;
  }

  .sig-lines {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 12px;
  }

  .sig-line {
    border-top: 1px solid rgba(153, 187, 231, 0.28);
    padding-top: 6px;
    font-size: 8pt;
    color: var(--dim);
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  footer.doc-foot {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 7.5pt;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--dim);
  }

  footer.doc-foot span.blue { color: var(--blue); }

  .placeholder {
    color: #9ec6ef;
    font-style: italic;
  }

  /* Screen-only page break hints */
  .break { break-before: page; page-break-before: always; }

  /* ========== PRINT: clean light (best for paper) ========== */
  @media print {
    @page {
      size: letter;
      margin: 0.45in 0.5in 0.4in;
    }

    html, body {
      background: #fff !important;
      color: #111827 !important;
      font-size: 10pt;
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
    }

    body {
      background: #fff !important;
    }

    .page {
      width: auto;
      min-height: 0;
      margin: 0;
      padding: 0;
    }

    header.brand {
      border-bottom-color: #d1d9e4;
    }

    header.brand .meta,
    header.brand .doc-label,
    header.brand .meta strong,
    .tagline,
    .glance .label,
    h2,
    footer.doc-foot span.blue {
      color: #1e5a9c !important;
      -webkit-text-fill-color: #1e5a9c;
    }

    header.brand .doc-label b,
    h1 {
      background: none;
      -webkit-background-clip: initial;
      background-clip: initial;
      color: #0b1220 !important;
      -webkit-text-fill-color: #0b1220;
      filter: none;
    }

    .glance {
      background: #f4f7fb !important;
      border-color: #c5d4e6;
    }

    .glance::before { display: none; }

    .glance p, p, li, .pkg .mo, .pkg ul li {
      color: #374151 !important;
    }

    p strong, li strong, .pkg .name, .pkg .price {
      color: #111827 !important;
    }

    .pkg {
      background: #f8fafc !important;
      border-color: #d0dbeb;
    }

    .pkg.featured {
      border-color: #6ba5d7;
      background: #eef5fc !important;
    }

    .pkg .bf { color: #c45e12 !important; }

    ul li::before { color: #2f78c4; }

    .note, footer.doc-foot, .sig-line, header.brand .meta {
      color: #6b7280 !important;
    }

    .sig-block {
    break-inside: avoid;
    page-break-inside: avoid;
      background: #f8fafc !important;
      border-color: #d0dbeb;
    }

    .sig-line { border-top-color: #c5d4e6; }

    footer.doc-foot { border-top-color: #d1d9e4; }

    .placeholder {
      color: #1e5a9c !important;
      background: #eef5fc;
      padding: 0 2px;
    }

    h2 { margin-top: 12px; }
    .break { break-before: page; page-break-before: always; }
  }
