:root {
      --bg: #070707;
      --panel: #101010;
      --panel-2: #171717;
      --line: rgba(255, 49, 49, 0.52);
      --red: #ef1f24;
      --red-2: #b90f15;
      --gold: #ffd25b;
      --gold-2: #b86d16;
      --text: #f7f7f7;
      --muted: #cfcfcf;
      --soft: #8d8d8d;
      --blue: #20a3ff;
      --shadow: 0 0 26px rgba(237, 30, 36, 0.38);
      --radius: 8px;
      font-family: Arial, Helvetica, sans-serif;
    }

    * { box-sizing: border-box; }

    body {
      margin: 0;
      background:
        radial-gradient(circle at 50% 0%, rgba(236, 28, 36, 0.18), transparent 38rem),
        linear-gradient(180deg, #030303 0%, var(--bg) 52%, #0d0d0d 100%);
      color: var(--text);
      font-size: 16px;
      line-height: 1.6;
    }

    a { color: inherit; text-decoration: none; }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 20;
      background: rgba(4, 4, 4, 0.94);
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      backdrop-filter: blur(10px);
    }

    .topbar,
    .navrow,
    .wrap {
      width: min(1280px, calc(100% - 40px));
      margin: 0 auto;
    }

    .topbar {
      min-height: 76px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 220px;
    }

    .brand-mark {
      width: 52px;
      height: 52px;
      border-radius: 8px;
      display: grid;
      place-items: center;
      color: #fff;
      font-weight: 900;
      background: linear-gradient(135deg, #ff2828 0%, #a7090e 58%, #ffd35f 140%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.32), 0 10px 28px rgba(239,31,36,0.28);
    }

    .brand-word {
      font-size: 42px;
      font-weight: 900;
      letter-spacing: 0;
      line-height: 1;
      color: var(--red);
      text-shadow: 0 2px 0 #540000, 0 0 18px rgba(239,31,36,0.35);
    }

    .brand-word span { color: var(--gold); }

    .actions {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 13px;
      font-weight: 800;
      text-transform: uppercase;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 42px;
      padding: 0 22px;
      border-radius: 6px;
      border: 1px solid rgba(255,255,255,0.18);
      background: #151515;
      color: #fff;
      white-space: nowrap;
    }

    .btn.primary {
      border-color: rgba(255, 114, 114, 0.55);
      background: linear-gradient(180deg, #ff2b2b, #b20b12);
      box-shadow: 0 8px 22px rgba(222, 15, 22, 0.32);
    }

    .btn.gold {
      border-color: rgba(255, 210, 91, 0.7);
      color: #111;
      background: linear-gradient(180deg, #ffe18a, #e6a61f);
    }

    .nav-shell {
      background: #1a1a1a;
      border-top: 1px solid rgba(255,255,255,0.06);
    }

    .navrow {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 34px;
      min-height: 54px;
      color: #fff;
      font-weight: 800;
      font-size: 14px;
      text-transform: uppercase;
    }

    .navrow a {
      position: relative;
      padding: 17px 0;
    }

    .navrow a.active::after,
    .navrow a:hover::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 7px;
      height: 3px;
      border-radius: 2px;
      background: var(--blue);
      box-shadow: 0 0 10px rgba(32,163,255,0.8);
    }

    .hero {
      position: relative;
      min-height: 410px;
      overflow: hidden;
      border-bottom: 1px solid rgba(255, 210, 91, 0.22);
      background: #100000;
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image: url("/assets/neo79-hero-crop.png?v=202607021436");
      background-size: cover;
      background-position: center;
      filter: saturate(1.08) contrast(1.05);
    }

    .hero::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.68) 28%, rgba(0,0,0,0.16) 70%, rgba(0,0,0,0.12) 100%),
        linear-gradient(180deg, transparent 70%, rgba(7,7,7,0.95) 100%);
    }

    .hero-inner {
      position: relative;
      z-index: 2;
      width: min(1280px, calc(100% - 40px));
      margin: 0 auto;
      min-height: 410px;
      display: flex;
      align-items: center;
    }

    .hero-copy {
      width: min(610px, 100%);
      padding: 40px 42px;
      border: 1px solid rgba(255, 45, 45, 0.76);
      border-radius: var(--radius);
      background: rgba(5, 5, 5, 0.84);
      box-shadow: var(--shadow);
    }

    h1,
    h2,
    h3,
    p { margin-top: 0; }

    h1 {
      margin-bottom: 18px;
      font-size: clamp(36px, 4.3vw, 60px);
      line-height: 1.05;
      letter-spacing: 0;
      font-weight: 900;
      text-transform: uppercase;
    }

    .hero-copy h1 span { color: var(--gold); }

    .hero-copy p {
      color: #f0f0f0;
      font-size: 18px;
      max-width: 560px;
      margin-bottom: 26px;
    }

    .hero-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    .section {
      width: min(1280px, calc(100% - 40px));
      margin: 18px auto 0;
    }

    .main-panel {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 18px;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: rgba(12,12,12,0.94);
      box-shadow: var(--shadow);
    }

    .media-frame {
      aspect-ratio: 1200 / 627;
      min-height: 0;
      border-radius: 7px;
      overflow: hidden;
      border: 1px solid rgba(255, 210, 91, 0.22);
      background:
        linear-gradient(135deg, rgba(239,31,36,0.16), transparent 48%),
        #0d0d0d;
      position: relative;
    }

    .media-frame::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image: url("/assets/neo79-hero-crop.png?v=202607021436");
      background-size: cover;
      background-position: center;
      opacity: 0.86;
      transform: scale(1.04);
    }

    .media-frame.overview::before {
      background-image: url("/assets/neo79-platform-overview-card.png");
      background-position: center;
    }

    .media-frame.payment::before {
      background-image: url("/assets/neo79-secure-payment-card.png");
      background-position: center;
    }

    .category-visual {
      aspect-ratio: 1280 / 398;
      min-height: 0;
      margin: 18px 0;
      border-radius: 7px;
      border: 1px solid rgba(255, 210, 91, 0.22);
      background-image:
        linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.36)),
        url("/assets/neo79-categories-strip.png");
      background-size: cover;
      background-position: center;
      box-shadow: inset 0 -50px 80px rgba(0,0,0,0.45);
    }

    .media-card {
      position: absolute;
      left: 24px;
      bottom: 24px;
      width: min(390px, calc(100% - 48px));
      padding: 20px;
      border-radius: 7px;
      background: rgba(0,0,0,0.76);
      border: 1px solid rgba(255,255,255,0.14);
    }

    .media-card strong {
      display: block;
      color: var(--gold);
      font-size: 24px;
      line-height: 1.2;
      margin-bottom: 8px;
    }

    .media-card span {
      color: #eee;
      display: block;
      font-size: 14px;
    }

    .content-block {
      padding: 10px 4px 8px 0;
    }

    .content-block h2,
    .section-title h2 {
      color: var(--red);
      font-size: 28px;
      line-height: 1.2;
      margin-bottom: 14px;
      font-weight: 900;
    }

    .content-block p {
      color: #e7e7e7;
      margin-bottom: 14px;
    }

    .check-list {
      display: grid;
      gap: 11px;
      margin: 20px 0 0;
      padding: 0;
      list-style: none;
    }

    .check-list li {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 12px;
      align-items: start;
      padding: 12px;
      border-radius: 6px;
      background: rgba(255,255,255,0.045);
      border: 1px solid rgba(255,255,255,0.07);
    }

    .check-list i,
    .mini-icon {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border-radius: 6px;
      color: var(--gold);
      font-style: normal;
      font-weight: 900;
      background: linear-gradient(180deg, rgba(239,31,36,0.48), rgba(98,8,11,0.72));
      border: 1px solid rgba(255, 82, 82, 0.4);
    }

    .feature-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
    }

    .feature-card,
    .article-card,
    .faq-card,
    .step-card,
    .promo-card {
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: var(--radius);
      background: linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.022));
      box-shadow: 0 14px 30px rgba(0,0,0,0.22);
    }

    .feature-card {
      min-height: 148px;
      padding: 18px;
    }

    .feature-card h3 {
      margin: 12px 0 6px;
      font-size: 18px;
      line-height: 1.25;
      color: #fff;
    }

    .feature-card p,
    .faq-card p,
    .step-card p,
    .promo-card p {
      color: var(--muted);
      margin-bottom: 0;
      font-size: 14px;
    }

    .split {
      display: grid;
      grid-template-columns: 0.94fr 1.06fr;
      gap: 18px;
    }

    .panel {
      padding: 26px;
      border-radius: var(--radius);
      border: 1px solid rgba(255, 49, 49, 0.38);
      background: rgba(13, 13, 13, 0.92);
    }

    .panel.gold-line {
      border-color: rgba(255, 210, 91, 0.34);
      background:
        linear-gradient(135deg, rgba(255, 210, 91, 0.08), transparent 46%),
        rgba(13,13,13,0.94);
    }

    .step-row {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      margin-top: 18px;
    }

    .step-card {
      padding: 18px;
      min-height: 170px;
    }

    .step-num {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      margin-bottom: 14px;
      color: #111;
      font-weight: 900;
      background: var(--gold);
    }

    .step-card h3,
    .promo-card h3,
    .article-card h3,
    .faq-card h3 {
      font-size: 18px;
      line-height: 1.25;
      margin-bottom: 8px;
    }

    .category-strip {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 12px;
    }

    .category {
      min-height: 96px;
      border: 1px solid rgba(255, 210, 91, 0.28);
      border-radius: var(--radius);
      background:
        linear-gradient(180deg, rgba(239,31,36,0.16), rgba(255,255,255,0.02)),
        #111;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 9px;
      text-align: center;
      font-weight: 900;
    }

    .category svg {
      width: 28px;
      height: 28px;
      color: var(--gold);
    }

    .promo-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

    .promo-card {
      overflow: hidden;
    }

    .promo-top {
      aspect-ratio: 10 / 3;
      min-height: 0;
      background:
        linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.46)),
        url("/assets/neo79-promo-gifts-strip.png");
      background-size: cover;
      background-position: center;
      border-bottom: 1px solid rgba(255,255,255,0.1);
      padding: 18px;
      display: flex;
      align-items: flex-end;
      font-size: 34px;
      font-weight: 900;
      color: #fff;
      text-shadow: 0 2px 0 rgba(0,0,0,0.35);
    }

    .promo-card.vip .promo-top {
      background-image:
        linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.46)),
        url("/assets/neo79-categories-strip.png");
    }

    .promo-card.app .promo-top {
      background-image:
        linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.46)),
        url("/assets/neo79-app-download-strip.png");
      background-position: left center;
    }

    .promo-body {
      padding: 18px;
    }

    .section-title {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 14px;
    }

    .section-title p {
      color: var(--muted);
      margin-bottom: 0;
      max-width: 640px;
    }

    .article-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

    .article-card {
      display: grid;
      grid-template-columns: 130px 1fr;
      gap: 14px;
      padding: 10px;
      min-height: 150px;
    }

    .thumb {
      border-radius: 6px;
      aspect-ratio: 1 / 1;
      min-height: 0;
      border: 1px solid rgba(255,255,255,0.1);
      background:
        linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)),
        url("/assets/neo79-register-thumb.png");
      background-size: cover;
      background-position: center;
      position: relative;
      overflow: hidden;
    }

    .thumb::after {
      content: "";
      position: absolute;
      inset: 16px 20px;
      border-radius: 8px;
      border: 2px solid rgba(255,255,255,0.18);
      box-shadow: inset 0 0 24px rgba(255,210,91,0.24);
    }

    .thumb.register { background-image: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)), url("/assets/neo79-register-thumb.png"); }
    .thumb.app { background-image: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)), url("/assets/neo79-app-thumb.png"); background-position: center; }
    .thumb.payment { background-image: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)), url("/assets/neo79-payment-thumb.png"); background-position: center; }
    .thumb.promo { background-image: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)), url("/assets/neo79-promo-thumb.png"); background-position: center; }
    .thumb.safe { background-image: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)), url("/assets/neo79-safety-thumb.png"); background-position: center; }
    .thumb.compare { background-image: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.34)), url("/assets/neo79-compare-thumb.png"); background-position: center; }

    .article-card h3 {
      color: #fff;
      margin-top: 4px;
    }

    .meta {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      color: var(--soft);
      font-size: 12px;
      margin-top: 10px;
    }

    .faq-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

    .faq-card {
      padding: 20px;
      min-height: 160px;
    }

    .partner-band {
      padding: 22px;
      border-radius: var(--radius);
      background: #202020;
      border: 1px solid rgba(255,255,255,0.1);
      text-align: center;
      color: #ddd;
      font-weight: 800;
    }

    .provider-logos {
      margin-top: 16px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
    }

    .provider-logos span {
      min-width: 68px;
      padding: 8px 10px;
      border-radius: 5px;
      color: #111;
      background: linear-gradient(180deg, #f5f5f5, #b9b9b9);
      font-size: 12px;
      font-weight: 900;
    }

    footer {
      margin-top: 34px;
      padding: 38px 0 22px;
      background: #4c4c4c;
      color: #fff;
    }

    .footer-grid {
      width: min(1280px, calc(100% - 40px));
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1.1fr 0.8fr 0.8fr 1.1fr;
      gap: 36px;
    }

    footer h3 {
      color: var(--red);
      font-size: 18px;
      text-transform: uppercase;
    }

    footer ul {
      margin: 0;
      padding: 0;
      list-style: none;
      display: grid;
      gap: 10px;
      color: #eee;
    }

    .copyright {
      width: min(1280px, calc(100% - 40px));
      margin: 30px auto 0;
      padding-top: 18px;
      border-top: 1px solid rgba(255,255,255,0.18);
      text-align: center;
      color: #d8d8d8;
      font-size: 13px;
    }

    @media (max-width: 980px) {
      .topbar {
        min-height: 66px;
      }

      .brand-word { font-size: 32px; }
      .brand-mark { width: 42px; height: 42px; }
      .navrow {
        justify-content: flex-start;
        overflow-x: auto;
        gap: 22px;
      }

      .actions .btn {
        min-height: 36px;
        padding: 0 12px;
        font-size: 12px;
      }

      .hero,
      .hero-inner { min-height: 480px; }

      .hero-copy { padding: 26px; }

      .main-panel,
      .split,
      .footer-grid {
        grid-template-columns: 1fr;
      }

      .feature-grid,
      .category-strip,
      .promo-grid,
      .article-grid,
      .faq-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 620px) {
      .topbar,
      .navrow,
      .wrap,
      .section,
      .hero-inner,
      .footer-grid,
      .copyright {
        width: min(100% - 24px, 1280px);
      }

      .topbar {
        align-items: flex-start;
        flex-direction: column;
        padding: 12px 0;
        gap: 10px;
      }

      .actions { width: 100%; }
      .actions .btn { flex: 1; }

      .hero,
      .hero-inner { min-height: 540px; }

      .hero::before {
        background-image: url("/assets/neo79-hero-mobile-crop.png?v=202607021436");
        background-position: center;
      }

      .hero-copy {
        padding: 20px;
      }

      h1 {
        font-size: 34px;
      }

      .hero-copy p {
        font-size: 15px;
      }

      .main-panel,
      .panel {
        padding: 14px;
      }

      .media-frame {
        min-height: 0;
      }

      .feature-grid,
      .category-strip,
      .promo-grid,
      .article-grid,
      .faq-grid,
      .step-row {
        grid-template-columns: 1fr;
      }

      .article-card {
        grid-template-columns: 116px 1fr;
      }
    }
  

/* Article detail */
.article-shell {
  width: min(1280px, calc(100% - 40px));
  margin: 22px auto 0;
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  gap: 18px;
}
.article-side,
.article-detail {
  border: 1px solid rgba(255, 49, 49, 0.38);
  border-radius: var(--radius);
  background: rgba(13, 13, 13, 0.94);
  box-shadow: var(--shadow);
}
.article-side { overflow: hidden; }
.article-side .media-frame { border-radius: 0; border: 0; }
.article-side-body { padding: 20px; }
.article-side-body h2 { color: var(--red); font-size: 22px; line-height: 1.25; margin-bottom: 12px; }
.article-side-body p { color: var(--muted); margin-bottom: 14px; }
.article-side-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.article-side-list li { padding: 11px 12px; border-radius: 6px; background: rgba(255,255,255,0.045); border: 1px solid rgba(255,255,255,0.07); color: #ededed; }
.article-detail { padding: 30px; overflow: hidden; }
.article-detail h1 { font-size: clamp(32px, 4vw, 54px); line-height: 1.08; margin-bottom: 14px; color: #fff; text-transform: none; }
.article-detail .meta { margin: 0 0 18px; }
.article-detail .article-media { aspect-ratio: 1200 / 627; border-radius: 7px; border: 1px solid rgba(255, 210, 91, 0.22); background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.32)), url("/assets/neo79-secure-payment-card.png") center/cover; margin: 18px 0 24px; }
.article-detail .body { color: #e9e9e9; font-size: 17px; line-height: 1.85; overflow-wrap: anywhere; }
.article-detail .body h2, .article-detail .body h3 { color: var(--red); line-height: 1.25; margin: 26px 0 10px; }
.article-detail .body p, .article-detail .body li { margin-bottom: 14px; }
.article-detail .body a { color: var(--gold); text-decoration: underline; }
.article-detail .article-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.1); }
.article-detail .article-actions a, .prenext a { color: #fff; }
.prenext { margin-top: 20px; display: grid; gap: 10px; color: var(--muted); }
.column-page ul, .article-actions ul { list-style: none; margin: 0; padding: 0; }
@media (max-width: 980px) {
  .article-shell { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .article-shell { width: min(100% - 24px, 1280px); }
  .article-detail { padding: 20px; }
  .article-detail .body { font-size: 14px; line-height: 1.75; }
  .article-detail h1 { font-size: 28px; }
}