/* Public marketing shell only. Existing authenticated dashboard is unchanged. */
html.vpn-public-site { height: auto !important; min-height: 100%; overflow-x: clip !important; overflow-y: auto !important; }
body.vmshell-public-auth {
  --vmshell-shell: 1440px;
  --vmshell-auth-width: 330px;
  --vmshell-edge: max(28px, calc((100vw - var(--vmshell-shell)) / 2));
  position: relative; height: auto !important; min-height: 100svh; overflow: visible !important;
  background: radial-gradient(ellipse at 0 0, #e4efff 0, transparent 38%), radial-gradient(ellipse at 100% 30%, #f0eaff 0, transparent 35%), #f7f9fd;
}
body.vmshell-public-auth #vmshell-public-portal { position: relative; inset: auto; display: block; overflow: visible; padding-bottom: 4px; }
body.vmshell-public-auth .vmshell-ambient { display: none; }
body.vmshell-public-auth .vmshell-public-header { height: 84px; gap: 20px; }
body.vmshell-public-auth .vmshell-brand { width: 194px; height: 56px; }
body.vmshell-public-auth .vmshell-public-nav { gap: 1px; }
body.vmshell-public-auth .vmshell-nav-link { font-size: 13px !important; padding: 9px 12px; }
body.vmshell-public-auth .vmshell-public-main {
  min-height: 530px; padding: 25px calc(var(--vmshell-auth-width) + 32px) 36px 0;
  grid-template-columns: minmax(0, 1.18fr) minmax(260px, .82fr); gap: 30px;
  align-items: center;
}
body.vmshell-public-auth .vmshell-intro h1 { margin: 20px 0 16px; font-size: clamp(42px, 3.8vw, 57px); line-height: 1.12; letter-spacing: -.045em; }
body.vmshell-public-auth .vmshell-intro-copy { margin-bottom: 18px; font-size: 14px; line-height: 1.8; max-width: 500px; color: #56647b; }
body.vmshell-public-auth .vmshell-feature-grid { margin: 18px 0; gap: 9px; }
body.vmshell-public-auth .vmshell-feature { min-height: 59px; padding: 9px 12px; gap: 10px; border-radius: 17px; }
body.vmshell-public-auth .vmshell-primary-actions { margin-top: 16px; }
body.vmshell-public-auth .vmshell-feature-icon { width: 34px; height: 34px; flex-basis: 34px; border-radius: 11px; }
body.vmshell-public-auth .vmshell-feature strong { font-size: 12px; }
body.vmshell-public-auth .vmshell-feature p { font-size: 10px; margin-top: 3px; }
body.vmshell-public-auth .vmshell-download-badges { flex-wrap: wrap; gap: 7px; }
body.vmshell-public-auth .vmshell-android-badge, body.vmshell-public-auth .vmshell-platform-badge { width: 135px; min-height: 48px; padding: 6px 10px; }
body.vmshell-public-auth .vmshell-android-badge strong, body.vmshell-public-auth .vmshell-platform-badge strong { font-size: 12px; }
body.vmshell-public-auth .vmshell-app-store-badge img { width: 138px; height: 48px; }
body.vmshell-public-auth .vmshell-trust-row { margin-top: 15px; gap: 13px; font-size: 10px; }
body.vmshell-public-auth .vmshell-product-stage { display: block; }
body.vmshell-public-auth .vmshell-product-card { padding: 20px; border-radius: 26px; }
body.vmshell-public-auth .vmshell-product-head { gap: 9px; }
body.vmshell-public-auth .vmshell-product-head strong { font-size: 17px; }
body.vmshell-public-auth .vmshell-product-head > div > span { font-size: 10px; }
body.vmshell-public-auth .vmshell-live-badge { padding: 5px 7px; font-size: 9px; }
body.vmshell-public-auth .vmshell-status-panel { margin-top: 19px; padding: 15px 12px; gap: 10px; }
body.vmshell-public-auth .vmshell-status-ring { width: 60px; height: 60px; flex-basis: 60px; }
body.vmshell-public-auth .vmshell-status-copy strong { font-size: 14px; }
body.vmshell-public-auth .vmshell-status-copy p { font-size: 11px; line-height: 1.6; }
body.vmshell-public-auth .vmshell-metric-grid { gap: 7px; }
body.vmshell-public-auth .vmshell-metric { padding: 12px 9px; }
body.vmshell-public-auth .vmshell-metric span { font-size: 9px; }
body.vmshell-public-auth .vmshell-metric strong { font-size: 12px; }
body.vmshell-public-auth .vmshell-qr-card { padding: 12px; margin-top: 16px; gap: 12px; border-radius: 19px; }
body.vmshell-public-auth .vmshell-qr-visual { width: 67px; height: 67px; flex-basis: 67px; }
body.vmshell-public-auth .vmshell-qr-copy strong { font-size: 12px; }
body.vmshell-public-auth .vmshell-qr-copy em { font-size: 9px; }
body.vmshell-public-auth #app { position: absolute; top: 117px; bottom: auto; height: 472px; }
body.vmshell-public-auth #app > div { align-items: flex-start !important; }
body.vmshell-public-auth #app .n-card { border-radius: 24px !important; border: 1px solid #dce6f3 !important; box-shadow: 0 15px 40px #35538216; overflow: hidden; }
body.vmshell-public-auth #app .n-card .p-24 { padding: 23px 21px 19px !important; }
body.vmshell-public-auth #app .n-card .p-24 > .text-center:first-child { margin-bottom: 14px; padding-bottom: 12px; }
body.vmshell-public-auth #app .n-card h5 { font-size: 10px !important; }
body.vmshell-public-auth #app .n-card img { object-fit: contain; }
.vpn-hero-actions { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.vpn-hero-actions a { text-decoration: none; color: #3e56b5; font-size: 13px; font-weight: 700; }
.vpn-hero-actions a:first-child { display: flex; align-items: center; gap: 28px; color: #fff; border-radius: 13px; padding: 11px 16px; background: linear-gradient(110deg, #107eeb, #6258eb); box-shadow: 0 8px 22px #365cea24; }
.vpn-home-content { width: min(var(--vmshell-shell), calc(100% - var(--vmshell-edge) * 2)); margin: 0 auto; }
.vpn-home-plans { padding: 28px 0 18px; border-top: 1px solid #dce5f0; scroll-margin-top: 24px; }
.vpn-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.vpn-eyebrow { font-size: 10px; font-weight: 800; letter-spacing: .14em; color: #6b7b99; }
.vpn-section-head h2 { color: #1c2d47; font-size: 24px; line-height: 1.4; letter-spacing: -.025em; margin: 5px 0 0; font-weight: 750; }
.vpn-section-head h2 > span { display: inline-block; vertical-align: middle; margin-left: 10px; padding: 3px 9px; background: #e7efff; color: #4568ac; font-size: 11px; line-height: 1.8; border-radius: 8px; letter-spacing: 0; font-weight: 650; }
.vpn-section-head p { font-size: 12px; color: #697891; margin: 7px 0 0; }
.vpn-subtle-link { color: #4b6394; border: 1px solid #d5dfed; border-radius: 12px; text-decoration: none; padding: 10px 14px; font-size: 12px; white-space: nowrap; background: #ffffffa8; }
.vpn-plan-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; align-items: stretch; }
.vpn-plan-card { --vpn-accent: #187ee2; --vpn-tint: #edf5ff; min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 22px; border: 1px solid #dde6f2; background: #fff; box-shadow: 0 6px 24px #2d52830a; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.vpn-plan-card:hover { transform: translateY(-3px); border-color: var(--vpn-accent); box-shadow: 0 14px 35px #2d528314; }
.vpn-accent-violet { --vpn-accent: #7954d9; --vpn-tint: #f2edff; }
.vpn-accent-teal { --vpn-accent: #008a8f; --vpn-tint: #e8f8f7; }
.vpn-accent-orange { --vpn-accent: #bb640a; --vpn-tint: #fff3e7; }
.vpn-plan-kicker { display: flex; gap: 7px; align-items: center; color: var(--vpn-accent); font-size: 11px; font-weight: 700; }
.vpn-plan-icon { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 10px; background: var(--vpn-tint); font-size: 19px; }
.vpn-quota { margin-left: auto; padding: 5px 7px; border-radius: 7px; background: #f5f7fb; color: #5d6b82; font-size: 10px; white-space: nowrap; }
.vpn-plan-card h3 { font-size: 15px; font-weight: 750; color: #20334c; line-height: 1.5; margin: 0; overflow-wrap: anywhere; min-height: 45px; }
.vpn-plan-price { display: flex; align-items: baseline; gap: 5px; margin: -5px 0 2px; white-space: nowrap; }
.vpn-plan-price small { font-size: 10px; font-weight: 700; color: #64748b; }
.vpn-plan-price strong { font-size: 30px; color: #152a44; line-height: 1.3; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.vpn-plan-price > span { color: #6d7d93; font-size: 11px; margin-left: 3px; }
.vpn-plan-card details { font-size: 11px; color: #52647d; }
.vpn-plan-card summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.vpn-plan-card summary::-webkit-details-marker, .vpn-article summary::-webkit-details-marker { display: none; }
.vpn-plan-card summary > span { color: var(--vpn-accent); font-size: 16px; }
.vpn-plan-periods { padding: 9px 10px; background: var(--vpn-tint); border-radius: 10px; }
.vpn-plan-periods ul { margin: 10px 0 0; padding: 0; list-style: none; border-top: 1px solid #cad5e480; }
.vpn-plan-periods li { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; }
.vpn-plan-periods strong { font-weight: 650; font-variant-numeric: tabular-nums; }
.vpn-plan-rules { margin-bottom: 3px; padding: 0 2px; }
.vpn-plan-rules p { margin: 10px 0; line-height: 1.75; white-space: pre-line; overflow-wrap: anywhere; }
.vpn-plan-buy { margin-top: auto; min-height: 39px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 11px; background: var(--vpn-accent); color: #fff; text-decoration: none; font-size: 12px; font-weight: 700; }
.vpn-plan-buy:hover { color: #fff; filter: brightness(1.05); }
.vpn-plan-unavailable { color: #737f91; background: #edf0f5; }
.vpn-price-note { font-size: 11px; color: #6d7b90; line-height: 1.7; margin: 16px 0 0; }
.vpn-information-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 16px 0 22px; }
.vpn-info-panel { border: 1px solid #dde6f2; background: #ffffffd9; padding: 24px; border-radius: 24px; display: flex; flex-direction: column; scroll-margin-top: 24px; min-width: 0; }
.vpn-info-panel .vpn-section-head { margin-bottom: 13px; }
.vpn-info-panel h2 { font-size: 21px; }
.vpn-section-symbol { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 12px; background: #fff3e7; color: #b46b19; font-size: 22px; }
.vpn-knowledge .vpn-section-symbol { color: #6755bd; background: #f0edff; }
.vpn-article { padding: 13px 0; border-top: 1px solid #e5ebf4; }
.vpn-article summary { list-style: none; cursor: pointer; display: grid; gap: 7px; }
.vpn-article-date { font-size: 10px; color: #7a889e; }
.vpn-article strong { font-size: 14px; line-height: 1.5; color: #263c58; overflow-wrap: anywhere; }
.vpn-article-more { font-size: 11px; color: #3671bc; }
.vpn-article-text { margin-top: 15px; padding: 15px; background: #f6f8fc; border-radius: 12px; color: #465c78; font-size: 13px; line-height: 1.9; white-space: pre-line; overflow-wrap: anywhere; }
.vpn-info-footer { display: flex; justify-content: space-between; gap: 12px; font-size: 11px; color: #77869b; margin-top: auto; padding-top: 16px; border-top: 1px solid #e5ebf4; }
.vpn-info-footer a { color: #3671bc; text-decoration: none; }
.vpn-empty { padding: 16px; font-size: 13px; color: #63748e; line-height: 1.7; }
.vpn-home-bottom-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 25px; border: 1px solid #dce5f2; border-radius: 22px; background: linear-gradient(110deg, #eef5ff, #f3efff 60%, #eaf7f8); margin: 0 0 24px; }
.vpn-home-bottom-cta > div { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.vpn-home-bottom-cta strong { font-size: 17px; color: #233953; }
.vpn-home-bottom-cta span { font-size: 12px; color: #62718a; }
.vpn-home-bottom-cta a { background: #fff; color: #405bac; padding: 10px 17px; border-radius: 12px; font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }
body.vmshell-public-auth .vmshell-public-footer { min-height: 70px; height: auto; padding: 17px 0; font-size: 11px; color: #71819a; }
body.vmshell-public-auth .vmshell-public-footer a { color: #64738b; }
.vpn-chosen-plan { font-size: 11px; color: #3f62a8; line-height: 1.6; margin: 0 0 13px; padding: 10px 12px; border-radius: 10px; background: #eef5ff; overflow-wrap: anywhere; }
@media (max-width: 1500px) { .vpn-plan-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1380px) {
  body.vmshell-public-auth { --vmshell-auth-width: 305px; --vmshell-edge: 24px; }
  body.vmshell-public-auth .vmshell-public-main { grid-template-columns: minmax(0, 1fr) minmax(235px, .78fr); gap: 22px; }
  .vpn-plan-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  body.vmshell-public-auth .vmshell-public-main { grid-template-columns: minmax(0, 1fr); min-height: 510px; }
  body.vmshell-public-auth .vmshell-product-stage { display: none; }
  body.vmshell-public-auth .vmshell-intro { max-width: 590px; }
  body.vmshell-public-auth .vmshell-nav-link { padding: 8px 9px; }
}
@media (max-width: 860px) {
  body.vmshell-public-auth { --vmshell-edge: 20px; }
  body.vmshell-public-auth .vmshell-public-header { height: 74px; gap: 10px; }
  body.vmshell-public-auth .vmshell-nav-link[data-vpn-section] { display: block; padding: 7px 8px; font-size: 11px !important; }
  body.vmshell-public-auth .vmshell-public-main { padding: 20px 0 26px; min-height: 0; }
  body.vmshell-public-auth .vmshell-intro { margin: 0; max-width: 650px; }
  body.vmshell-public-auth .vmshell-intro h1 { font-size: 49px; }
  body.vmshell-public-auth #app { position: fixed; top: 0; height: 100svh; right: 0; bottom: 0; }
  body.vmshell-public-auth #app > div { align-items: center !important; }
  body.vmshell-public-auth #app > div > .n-card { max-height: none; }
  .vpn-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vpn-information-grid { grid-template-columns: 1fr; }
  .vpn-section-head h2 { font-size: 22px; }
  body.vmshell-public-auth .vmshell-public-footer { flex-wrap: wrap; gap: 12px; }
}
@media (max-width: 560px) {
  body.vmshell-public-auth { --vmshell-edge: 16px; }
  body.vmshell-public-auth .vmshell-brand { width: 132px; height: 43px; }
  body.vmshell-public-auth .vmshell-public-nav { gap: 0; padding: 3px; box-shadow: none; }
  body.vmshell-public-auth .vmshell-nav-link[data-vpn-section] { padding: 7px 6px; font-size: 10px !important; }
  body.vmshell-public-auth .vmshell-header-login { width: 31px; height: 31px; margin-left: 2px; }
  body.vmshell-public-auth .vmshell-intro h1 { font-size: 44px; }
  body.vmshell-public-auth .vmshell-feature { padding: 9px; gap: 8px; }
  body.vmshell-public-auth .vmshell-feature p { font-size: 9px; }
  body.vmshell-public-auth .vmshell-download-badges { width: 100%; flex-wrap: nowrap; }
  body.vmshell-public-auth .vmshell-app-store-badge, body.vmshell-public-auth .vmshell-android-badge { flex: 0 1 145px; }
  body.vmshell-public-auth .vmshell-app-store-badge img { max-width: 100%; }
  .vpn-home-plans { padding-top: 23px; }
  .vpn-section-head { align-items: flex-start; flex-wrap: wrap; gap: 10px; }
  .vpn-section-head h2 { font-size: 21px; }
  .vpn-section-head p { font-size: 11px; line-height: 1.7; }
  .vpn-subtle-link { padding: 7px 10px; font-size: 11px; }
  .vpn-plan-grid { grid-template-columns: 1fr; gap: 12px; }
  .vpn-plan-card { gap: 11px; padding: 19px; }
  .vpn-plan-card h3 { min-height: 0; }
  .vpn-plan-price strong { font-size: 31px; }
  .vpn-plan-card details, .vpn-plan-buy { font-size: 12px; }
  .vpn-plan-buy { min-height: 44px; }
  .vpn-info-panel { padding: 20px; }
  .vpn-info-footer { flex-wrap: wrap; }
  .vpn-home-bottom-cta { padding: 19px; gap: 12px; }
  .vpn-home-bottom-cta > div { gap: 6px; }
  body.vmshell-public-auth .vmshell-public-footer nav { justify-content: flex-start; flex-wrap: wrap; gap: 12px; }
  body.vmshell-public-auth .vmshell-public-footer nav a { display: block; }
  body.vmshell-public-auth .vmshell-public-footer > span { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .vpn-plan-card, body.vmshell-public-auth .vmshell-intro, body.vmshell-public-auth .vmshell-product-stage { transition: none; animation: none; }
  .vpn-plan-card:hover { transform: none; }
}
