.page-vpn {
  --bg-primary: #ffffff;
  --bg-muted: #f8fafc;
  --bg-card: #ffffff;
  --border: #dbe1ea;
  --text-primary: #0f172a;
  --text-secondary: #475569;
  --accent-blue: #2563eb;
  --accent-yellow: #f4c430;
  --danger: #dc2626;
  --success: #16a34a;
  --warning: #b45309;
  font-family: 'Inter', sans-serif;
  background: var(--bg-primary);
  color: var(--text-secondary);
  line-height: 1.6;
  overflow-x: clip;
}

.page-vpn *, .page-vpn *::before, .page-vpn *::after { box-sizing: border-box; }
.page-vpn .container { width: min(1320px, 100% - 40px); margin-inline: auto; }
.page-vpn .section { padding: 68px 0; background: var(--bg-primary); }
.page-vpn .section-soft { background: var(--bg-muted); }
.page-vpn .section-title { margin: 0 0 24px; font-size: clamp(1.8rem, 2.6vw, 2.4rem); line-height: 1.2; text-align: center; color: var(--text-primary); }

.page-vpn .hero { padding: 72px 0 64px; text-align: center; background: linear-gradient(180deg,#fff 0%,#f8fafc 100%); }
.page-vpn .hero h1 { margin:0 0 18px; color: var(--text-primary); font-size: clamp(2rem, 3.6vw, 3rem); line-height:1.15; }
.page-vpn .hero-subtitle { max-width: 860px; margin: 0 auto 32px; font-size: 1.08rem; line-height: 1.78; color: #334155; }
.page-vpn .cta-button { margin: 6px; }
.page-vpn .ui-btn.cta-button { min-height: 50px; }

.page-vpn .comparison-desktop,
.page-vpn .comparison-mobile,
.page-vpn .benefit-card,
.page-vpn .pricing-card,
.page-vpn .tech-block,
.page-vpn .economy-block,
.page-vpn .downloads-cta-card,
.page-vpn .downloads-table,
.page-vpn .faq-item,
.page-vpn .modal,
.page-vpn .tariff-features-table { background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 10px 30px rgba(15,23,42,.04); }

.page-vpn .comparison-desktop { display:grid; grid-template-columns: 1fr 1fr; overflow:hidden; }
.page-vpn .column-header { padding:20px; font-size:1.15rem; font-weight:700; text-align:center; }
.page-vpn .problem-header { background: #fef2f2; color:#991b1b; border-bottom:1px solid #fecaca; }
.page-vpn .solution-header { background: #f0fdf4; color:#14532d; border-bottom:1px solid #bbf7d0; }
.page-vpn .column-list { padding:22px 24px; }
.page-vpn .column-list ul { list-style:none; margin:0; padding:0; }
.page-vpn .column-list li { position:relative; padding:12px 0 12px 28px; border-bottom:1px solid #edf2f7; line-height: 1.65; color: #334155; }
.page-vpn .column-list li:last-child { border-bottom: 0; }
.page-vpn .column-list li::before { content:'✓'; color: var(--success); position:absolute; left:4px; font-weight:700; }
.page-vpn .problem-list li::before { content:'✕'; color: var(--danger); }
.page-vpn .comparison-mobile { display:none; padding: 24px; }

.page-vpn .benefits-grid,
.page-vpn .tech-features,
.page-vpn .pricing-grid { display:grid; gap:20px; }
.page-vpn .benefits-grid { grid-template-columns: repeat(3,minmax(0,1fr)); margin-top:24px; }
.page-vpn .benefit-card { padding:24px; text-align:center; }
.page-vpn .benefit-card h3 { margin:0 0 10px; color:var(--text-primary); font-size:1.25rem; }
.page-vpn .benefit-card p { color:#334155; line-height:1.68; }
.page-vpn .benefit-icon { font-size:2.1rem; margin-bottom:12px; }
.page-vpn .benefit-tag { display:inline-block; margin-top:14px; background:#eff6ff; color:#1d4ed8; border:1px solid #dbeafe; border-radius:999px; padding:4px 12px; font-size:.82rem; font-weight:600; }

.page-vpn .tech-block { padding: 28px; text-align:center; }
.page-vpn .tech-block h3 { margin:0 0 16px; color:var(--text-primary); font-size:1.7rem; }
.page-vpn .tech-features { grid-template-columns: repeat(3, minmax(0,1fr)); margin-top:20px; }
.page-vpn .tech-feature { background: var(--bg-muted); border:1px solid var(--border); border-radius:12px; padding:18px; }
.page-vpn .tech-feature h4 { margin:0 0 8px; color:#1d4ed8; }
.page-vpn .tech-feature p { margin:0; color:#334155; line-height:1.6; }

.page-vpn .tariff-features-table { display:grid; grid-template-columns: 1.5fr repeat(3,1fr); gap:1px; overflow:hidden; margin:30px 0 12px; border-radius:14px; }
.page-vpn .feature-cell,.page-vpn .tariff-cell { background:#fff; padding:16px; display:flex; align-items:center; justify-content:center; }
.page-vpn .feature-cell { justify-content:flex-start; font-weight:500; }
.page-vpn .tariff-name { font-size:1.2rem; font-weight:700; color:var(--text-primary); }
.page-vpn .tariff-price { font-size:1.1rem; font-weight:700; color:#1d4ed8; line-height:1.35; }
.page-vpn .tariff-price .currency-pair { display:inline-flex; align-items:baseline; gap:6px; white-space:nowrap; }
.page-vpn .tariff-price .usdt-amount,.page-vpn .tariff-price .rub-amount { font-size:1.35rem; font-weight:800; color:#1d4ed8; }
.page-vpn .feature-highlight { background:#f8fafc; }
.page-vpn .feature-yes { color: var(--success); font-size:1.2rem; font-weight:800; }

.page-vpn .pricing-grid { grid-template-columns: repeat(3,minmax(0,1fr)); margin-top:30px; }
.page-vpn .pricing-card { padding: 28px 24px 24px; text-align:center; position:relative; display:flex; flex-direction:column; min-height: 100%; }
.page-vpn .pricing-card.popular { border-color:#d8e4ff; background: linear-gradient(180deg, #fdfefe 0%, #f7faff 100%); box-shadow:0 12px 24px rgba(37,99,235,.08); }
.page-vpn .popular-badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:#f5f9ff; color:#1d4ed8; border:1px solid #bfdbfe; border-radius:999px; padding:6px 18px; font-size:.78rem; letter-spacing:.02em; font-weight:800; white-space:nowrap; }
.page-vpn .pricing-card h3 { margin:0 0 8px; color:var(--text-primary); font-size:1.65rem; }
.page-vpn .tariff-subtitle { min-height:44px; margin-bottom:12px; color:#334155; font-weight:600; }
.page-vpn .duration-tabs { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin:8px 0; }
.page-vpn .duration-tab { border:1px solid var(--border); background:#fff; color:var(--text-secondary); border-radius:10px; padding:8px 12px; font-weight:700; font-size:.9rem; }
.page-vpn .duration-tab.active { background:#fff8db; border-color:#f0d05d; color:#7a5a00; }
.page-vpn .price { margin: 10px 0 6px; color:var(--text-primary); display:flex; flex-direction:column; align-items:center; gap:4px; }
.page-vpn .price .currency-pair { display:inline-flex; align-items:baseline; gap:6px; font-size:1.16rem; font-weight:700; color:#1d4ed8; white-space:nowrap; }
.page-vpn .price .usdt-amount,.page-vpn .price .rub-amount { font-size:2.05rem; font-weight:800; color:var(--text-primary); line-height:1; }
.page-vpn .price .price-term { color:var(--text-secondary); font-size:1rem; font-weight:500; }
.page-vpn .pricing-features { list-style:none; margin:20px 0; padding:0; text-align:left; }
.page-vpn .pricing-features li { position:relative; padding:8px 0 8px 26px; border-bottom:1px solid #edf2f7; line-height:1.45; color:#334155; }
.page-vpn .pricing-features li::before { content:'✓'; position:absolute; left:8px; color:var(--success); font-weight:800; }
.page-vpn .feature-highlight-text { color:#1d4ed8; font-weight:700; }
.page-vpn .payment-buttons { display:flex; margin-top:auto; }
.page-vpn .payment-buttons .ui-btn { width:100%; }

.page-vpn .economy-block { margin-top:24px; padding:24px; background:linear-gradient(180deg,#ffffff,#f8fafc); }
.page-vpn .economy-grid { display:grid; grid-template-columns: 1fr 1fr; gap:15px; }
.page-vpn .economy-card { background:#fff; border:1px solid var(--border); border-radius:12px; padding:15px; }

.page-vpn .faq-accordion { margin-top:16px; }
.page-vpn .faq-item { margin-bottom:14px; overflow:hidden; }
.page-vpn .faq-question { width:100%; border:0; background:#fff; color:var(--text-primary); padding:18px 20px; display:flex; justify-content:space-between; gap:10px; font-size:1.03rem; font-weight:700; text-align:left; }
.page-vpn .faq-question::after { content:'⌄'; color:#64748b; transition:transform .2s; }
.page-vpn .faq-question.active::after { transform:rotate(180deg); }
.page-vpn .faq-answer { max-height:0; overflow:hidden; transition:max-height .25s ease,padding .25s ease; padding:0 20px; background:#f8fafc; }
.page-vpn .faq-answer.open { max-height:440px; padding:0 20px 18px; }

.page-vpn .downloads-cta-card { text-align:center; padding:44px 32px; margin-bottom:36px; }
.page-vpn .page-vpn__happ .vpn-happ-card { background:#fff; border:1px solid var(--border); border-radius:16px; padding:20px; box-shadow: 0 10px 30px rgba(15,23,42,.04); }
.page-vpn .downloads-table-wrap { background:#ffffff; border:1px solid #e2e8f0; border-radius:12px; padding:0; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.page-vpn .downloads-table { width:100%; min-width:720px; border-collapse:separate; border-spacing:0; overflow:hidden; border:0; border-radius:12px; background:#ffffff; }
.page-vpn .downloads-table th,.page-vpn .downloads-table td { padding:16px; border-bottom:1px solid #e2e8f0; vertical-align:top; text-align:left; background:#ffffff; color:#1e293b; }
.page-vpn .downloads-table th { background:#f1f5f9; color:#0f172a; font-size:1rem; font-weight:700; }
.page-vpn .downloads-table tbody tr:nth-child(even) td { background:#f8fafc; }
.page-vpn .downloads-table tbody tr { transition: background-color .18s ease; }
.page-vpn .downloads-table tbody tr:hover td { background:#eef6ff; }
.page-vpn .download-link { display:inline-block; margin:4px 12px 4px 0; color:var(--accent-blue); text-decoration:none; font-weight:600; line-height:1.45; }
.page-vpn .download-link:hover { color:#1e40af; text-decoration:underline; }
.page-vpn .note-text { display:block; margin-top:5px; color: var(--warning); font-size:.88rem; }
.page-vpn .device-list ul { list-style:none; margin:8px 0 0; padding:0; }
.page-vpn .device-list li { position:relative; padding-left:16px; }
.page-vpn .device-list li::before { content:'•'; position:absolute; left:4px; color:#1d4ed8; }


.page-vpn .section-lead { text-align:center; color:#334155; margin: 0 auto 30px; max-width: 700px; line-height: 1.72; }
.page-vpn .section-lead--wide { max-width: 1200px; margin-bottom: 30px; }
@media (min-width: 1025px) { .page-vpn .section-lead--wide { white-space: nowrap; } }
.page-vpn .downloads-warning { text-align:center; margin: 0 auto 40px; max-width: 800px; color: #92400e; font-weight: 600; line-height: 1.65; }
.page-vpn .downloads-help-card { background: #f8fbff; border:1px solid #dbeafe; border-left: 4px solid var(--accent-blue); padding: 20px; border-radius: 12px; margin-top: 30px; }
.page-vpn .downloads-help-card h4 { color: var(--accent-blue); margin: 0 0 10px; }
.page-vpn .downloads-help-card ol { margin: 0 0 0 20px; color: #334155; line-height: 1.62; }
.page-vpn .downloads-help-card p { margin: 15px 0 0; color: #334155; font-size: .94rem; line-height: 1.6; }

.page-vpn .modal-overlay { position:fixed; inset:0; background:rgba(15,23,42,.45); display:none; z-index:120; padding:24px; overflow:auto; }
.page-vpn .modal-overlay.active { display:block; }
.page-vpn .modal { width:min(780px,100%); margin:30px auto; background:#fff; border-radius:16px; }
.page-vpn .modal-large { width:min(980px,100%); }
.page-vpn .modal-header { display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--border); padding:16px 20px; }
.page-vpn .modal-title { font-size:1.2rem; color:var(--text-primary); font-weight:800; }
.page-vpn .close-modal { border:1px solid var(--border); background:#fff; width:34px; height:34px; border-radius:10px; font-size:1.4rem; line-height:1; }
.page-vpn .modal-body { padding:20px; color:var(--text-secondary); }
.page-vpn .modal-body h3 { margin:0 0 10px; color:var(--text-primary); }
.page-vpn .modal-body p,.page-vpn .modal-body ul { margin:0 0 14px; }

@media (max-width: 1024px) {
  .page-vpn .benefits-grid, .page-vpn .tech-features, .page-vpn .pricing-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .page-vpn .tariff-features-table { display:none; }
}
@media (max-width: 768px) {
  .page-vpn .page-vpn__happ .vpn-happ-card { padding:16px; }
  .page-vpn .section { padding: 40px 0; }
  .page-vpn .comparison-desktop { display:none; }
  .page-vpn .comparison-mobile { display:block; }
  .page-vpn .benefits-grid, .page-vpn .tech-features, .page-vpn .pricing-grid, .page-vpn .economy-grid { grid-template-columns: 1fr; }
  .page-vpn .ui-btn.cta-button { width:100%; margin:8px 0; }
}