
    .ivpn-page {
      --ivpn-blue: #2563eb;
      --ivpn-dark: #111827;
      --ivpn-muted: #64748b;
      --ivpn-border: #e5e7eb;
      --ivpn-soft: #f8fafc;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", "Microsoft YaHei", Arial, sans-serif;
      color: var(--ivpn-dark);
      line-height: 1.75;
    }

    .ivpn-wrap {
      max-width: 1080px;
      margin: 0 auto;
      padding: 28px 16px;
    }

    .ivpn-hero {
      background: linear-gradient(135deg, #eff6ff, #ffffff);
      border: 1px solid #bfdbfe;
      border-radius: 18px;
      padding: 34px;
      margin-bottom: 22px;
    }

    .ivpn-kicker {
      color: var(--ivpn-blue);
      font-weight: 900;
      margin-bottom: 8px;
    }

    .ivpn-hero h1 {
      margin: 0 0 14px;
      font-size: 34px;
      line-height: 1.25;
      letter-spacing: 0;
    }

    .ivpn-hero p {
      max-width: 820px;
      color: #475569;
      margin: 0;
      font-size: 17px;
    }

    .ivpn-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 22px;
    }

    .ivpn-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 42px;
      padding: 0 18px;
      border-radius: 999px;
      text-decoration: none;
      font-weight: 900;
      background: var(--ivpn-blue);
      color: #fff !important;
    }

    .ivpn-btn.secondary {
      background: #111827;
    }

    .ivpn-btn.feedback {
      background: #0f766e;
    }

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

    .ivpn-card,
    .ivpn-section {
      background: #fff;
      border: 1px solid var(--ivpn-border);
      border-radius: 16px;
      box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
    }

    .ivpn-card {
      padding: 20px;
    }

    .ivpn-card h3 {
      margin: 0 0 8px;
      font-size: 18px;
    }

    .ivpn-card p {
      margin: 0;
      color: var(--ivpn-muted);
      font-size: 15px;
    }

    .ivpn-section {
      margin-top: 28px;
      padding: 26px;
    }

    .ivpn-section h2 {
      margin: 0 0 16px;
      font-size: 25px;
    }

    .ivpn-section p {
      color: #475569;
    }

    .ivpn-list {
      margin: 0;
      padding-left: 22px;
      color: #475569;
    }

    .ivpn-list li {
      margin: 8px 0;
    }

    .ivpn-demo-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 18px;
    }

    .ivpn-demo {
      margin: 0;
      background: var(--ivpn-soft);
      border: 1px solid var(--ivpn-border);
      border-radius: 16px;
      overflow: hidden;
    }

    .ivpn-demo img {
      display: block;
      width: 100%;
      height: auto;
    }

    .ivpn-demo figcaption {
      padding: 12px 14px;
      font-weight: 900;
      color: #111827;
      background: #fff;
      border-top: 1px solid var(--ivpn-border);
    }

    .ivpn-code {
      background: #020617;
      color: #d1fae5;
      border-radius: 14px;
      padding: 16px;
      overflow-x: auto;
      font-size: 14px;
      line-height: 1.7;
      white-space: pre-wrap;
      word-break: break-all;
    }

    .ivpn-faq details {
      border-top: 1px solid var(--ivpn-border);
      padding: 14px 0;
    }

    .ivpn-faq details:first-child {
      border-top: 0;
    }

    .ivpn-faq summary {
      cursor: pointer;
      font-weight: 900;
    }

    .ivpn-faq p {
      margin: 10px 0 0;
      color: #475569;
    }

    .ivpn-note {
      background: #fffbeb;
      border: 1px solid #fde68a;
      color: #92400e;
      border-radius: 14px;
      padding: 14px 16px;
      margin-top: 16px;
      font-weight: 800;
    }

    @media (max-width: 820px) {
      .ivpn-hero {
        padding: 24px;
      }

      .ivpn-hero h1 {
        font-size: 28px;
      }

      .ivpn-grid {
        grid-template-columns: 1fr;
      }
    }
  
