/* Black campaign theme, scoped to the Korean home and pricing pages. */
.black-site { background: #050505; color: #f5f5f5; }
.black-site :focus-visible { outline-color: #999; }
.black-site .site-header { background: #050505; border-color: #2c2c2c; }
.black-site .site-header .brand { background: transparent; border-radius: 0; padding: 0; }
.black-site .nav, .black-site .nav > a, .black-site .nav-group summary { color: #eee; }
.black-site .nav-panel, .black-site .nav.open { background: #171717; color: #eee; border-color: #3a3a3a; }
.black-site .nav a:hover, .black-site .nav-group summary:hover { color: #fff; }
.black-site .nav-panel a:hover { background: #333; }
.black-site .nav-cta { background: #fff; color: #111; }
.black-site .language-picker { background: #171717; border-color: #444; color: #ddd; }
.black-site .language-picker select { color: #eee; background: #171717; }
.black-site .menu-toggle { background: #171717; border-color: #444; }
.black-site .menu-toggle span { background: #fff; }
.black-site .eyebrow { color: #a9a9a9; }
.black-site h2, .black-site h3 { color: #fff; }
.black-site .button-primary, .black-site .button-white, .black-site .platform-link { background: #fff; color: #111; border-color: #fff; }
.black-site .inline-link { color: #eee; }
.black-hero { background: #050505; padding-bottom: 35px; }
.black-art { display: block; max-width: 1660px; margin: auto; }
.black-art img, .comparison-banner img, .pricing-art img { width: 100%; height: auto; display: block; }
.black-hero-actions { display: flex; align-items: center; gap: 18px; }
.black-hero-actions .button { border-radius: 8px; }
.black-hero-actions p { color: #aaa; font-size: 14px; margin: 0 0 0 auto; }
.black-outline { border: 1px solid #666; color: #fff; background: transparent; }
.black-site .benefit-strip, .black-site .feature-overview, .black-site .korea-trust, .black-site .security, .black-site .business-teaser, .black-site .download, .black-site .faq, .black-site .final-cta { background: #0d0d0d; color: #fff; }
.black-site .travel-section, .black-site .personal-stories { background: #050505; }
.black-site .personal-story-grid article { background: #171717; border-color: #333; }
.black-site .personal-story-caption p, .black-site .personal-stories .cases-head p, .black-site .business-teaser-bottom p span { color: #bbb; }
.black-site .benefit-inner div, .black-site .download-aside, .black-site .faq-items, .black-site .faq details { border-color: #383838; }
.black-site .benefit-inner span, .black-site .benefit-inner div { color: #ccc; }
.black-site .travel-grid article, .black-site .overview-grid article, .black-site .security-card, .black-site .platform-card, .black-site .annual-offer { background: #171717; border-color: #333; }
.black-site .travel-grid p, .black-site .overview-grid p, .black-site .intro-body p, .black-site .cases-head p, .black-site .experience-copy > p, .black-site .step-list p, .black-site .download-top > p, .black-site .platform-card p, .black-site .annual-offer p, .black-site .download-aside p, .black-site .faq details p, .black-site .business-section-head p, .black-site .security-head p, .black-site .security-card p { color: #bcbcbc; }
.black-site .travel-grid a, .black-site .overview-grid a, .black-site .travel-grid article > span, .black-site .overview-grid article > span, .black-site .platform-label, .black-site .annual-offer span, .black-site .download-aside a { color: #ddd; }
.black-site .section-footnote, .black-site .security-note, .black-site .store-status { color: #999; }
.black-site .step-list > div { border-color: #333; }
.black-site .step-list span { background: transparent; color: #aaa; }
.black-site .security-head h2 span { color: #aaa; }
.black-site .security-card:hover { background: #202020; border-color: #666; }
.black-site .feature-icon { background: #2a2a2a; }
.black-site .feature-no, .black-site .feature-meta { color: #aaa; border-color: #3a3a3a; }
.black-site .platform-icon { background: #fff; color: #111; }
.black-site .faq summary span { color: #fff; }
.black-site .locale-footer { background: #050505; color: #bbb; border-top: 1px solid #333; }
.black-site .locale-footer .brand { background: transparent; padding: 0; border-radius: 0; }
.black-site .footer-top p, .black-site .footer-links a, .black-site .footer-legal a, .black-site .business-info, .black-site .footer-bottom { color: #aaa; border-color: #333; }
.black-site .business-info b { color: #ddd; }
.comparison-banner { display: block; margin: -32px -20px 28px; }
.comparison-table .brand-logo-tile { display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 9px; height: 76px; padding: 14px; margin: 8px 0 15px; }
.comparison-table .comparison-stage .brand-logo-tile { background: #101010; border: 1px solid #343434; }
.brand-logo-tile img { width: 100%; height: 100%; object-fit: contain; }
.brand-logo-tile img[src$="expressvpn.svg"] { height: auto; max-height: none; }
.black-site .footer-legal strong { color: #eee; }
.comparison-notes a { text-decoration: underline; text-underline-offset: 3px; }
.black-site .personal-setup-art { max-width: 460px; margin: auto; background: #000; border: 1px solid #333; border-radius: 18px; overflow: hidden; }
.black-site .personal-setup-art img { width: 100%; height: auto; }
.pricing-art { display: block; max-width: 1500px; margin: auto; }
.pricing-plans { padding: 30px 0 90px; }
.pricing-plans > h2 { font-size: 34px; margin: 0 0 14px; }
.pricing-lead { color: #aaa; font-size: 16px; margin: 0 0 32px; }
.plan-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.plan-card { background: #151515; border: 1px solid #444; border-radius: 24px; padding: 38px; display: flex; flex-direction: column; }
.plan-card .plan-tag { font-size: 12px; font-weight: 700; letter-spacing: .08em; color: #bbb; }
.plan-card h3 { font-size: 28px; margin: 14px 0 8px; }
.plan-card .plan-description { color: #aaa; margin: 0; }
.plan-card .plan-amount { font-size: 56px; letter-spacing: -.045em; color: #fff; margin: 26px 0 0; line-height: 1.2; }
.plan-amount small { font-size: 18px; font-weight: 500; letter-spacing: 0; }
.plan-card .plan-period { margin: 12px 0 0; color: #bbb; }
.plan-card ul { list-style: none; padding: 23px 0; margin: 24px 0 0; border-top: 1px solid #444; line-height: 2; font-size: 15px; }
.plan-card li:before { content: '✓'; margin-right: 10px; }
.plan-card .button { margin-top: auto; justify-content: space-between; border-radius: 10px; }
.plan-card.featured { background: #f8f8f8; color: #111; border-color: #fff; }
.black-site .plan-card.featured h3, .plan-card.featured .plan-amount { color: #111; }
.plan-card.featured .plan-tag, .plan-card.featured .plan-description, .plan-card.featured .plan-period { color: #555; }
.plan-card.featured .button { background: #111; color: #fff; }
.plan-card.featured ul { border-color: #ccc; }
.plan-disclosure { font-size: 13px; color: #aaa; margin-top: 22px; line-height: 1.8; }
.plan-disclosure a { text-decoration: underline; }
.pricing-help { padding: 80px 0; background: #111; }
.pricing-help h2 { font-size: 36px; margin: 0 0 30px; }
.pricing-help details { border-top: 1px solid #444; padding: 20px 0; }
.pricing-help summary { cursor: pointer; font-size: 18px; font-weight: 650; }
.pricing-help details p { color: #bbb; line-height: 1.9; font-size: 15px; max-width: 850px; }
.pricing-help a { text-decoration: underline; text-underline-offset: 4px; }
.pricing-links { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 32px; }
@media(max-width:820px) { .black-hero-actions { flex-wrap: wrap; } .black-hero-actions p { margin: 12px 0 0; width: 100%; } .black-site .nav.open a { border-color: #444; } .plan-card { padding: 28px; } }
@media(max-width:650px) { .black-hero-actions .button { width: 100%; justify-content: space-between; } .black-hero-actions { gap: 12px; } .comparison-banner { margin: -35px -20px 25px; } .plan-grid { grid-template-columns: 1fr; } .plan-card .plan-amount { font-size: 48px; } .pricing-plans { padding: 10px 0 55px; } .pricing-plans > h2, .pricing-help h2 { font-size: 29px; } .plan-card { padding: 26px; } .black-site .personal-setup-art { max-width: 380px; } }
