:root {
  --wc-ink: #0b1830;
  --wc-muted: #50627a;
  --wc-blue: #1456d9;
  --wc-blue-dark: #0a3da6;
  --wc-sky: #eef5ff;
  --wc-line: #dbe5f2;
  --wc-amber: #f4b942;
  --wc-radius: 22px;
  --wc-shadow: 0 18px 55px rgba(20, 57, 112, .12);
  --wc-serif: "Newsreader", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.wc-body { margin: 0; color: var(--wc-ink); background: #fff; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.wc-body h1, .wc-body h2, .wc-body h3 { text-wrap: balance; }
.wc-body h1, .wc-body h2 { font-family: var(--wc-serif); font-weight: 600; }
.wc-guide-index-hero { padding: 92px 0 70px; color: #fff; background: linear-gradient(135deg, #07162f, #12396e); }
.wc-guide-index-hero h1 { max-width: 720px; margin: 16px 0 14px; font-size: clamp(42px, 6vw, 74px); line-height: .98; letter-spacing: -.06em; }
.wc-guide-index-hero p { max-width: 620px; color: #c7d7ee; font-size: 18px; line-height: 1.6; }
.wc-guide-index-search { max-width: 720px; margin: 34px 0 0; }
.wc-guide-index-search input { font-size: 16px; }
.wc-guide-index-list { background: #f8fbff; }
.wc-guide-index-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.wc-index-card { display: flex; min-height: 390px; flex-direction: column; padding: 0 26px 26px; overflow: hidden; border: 1px solid var(--wc-line); border-radius: 20px; color: var(--wc-ink); background: #fff; text-decoration: none; box-shadow: 0 8px 28px rgba(24,57,105,.05); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.wc-index-card:hover, .wc-index-card:focus-visible { transform: translateY(-4px); border-color: #a8c4f8; box-shadow: var(--wc-shadow); }
.wc-index-card-art { display: block; width: calc(100% + 52px); height: 150px; margin: 0 -26px 22px; object-fit: cover; }
.wc-index-card > span { color: var(--wc-blue); font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.wc-index-card h2 { margin: 14px 0 9px; font-family: var(--wc-serif); font-size: 27px; line-height: 1.02; }
.wc-index-card p { margin: 0; color: var(--wc-muted); line-height: 1.55; }
.wc-index-card b { margin-top: auto; padding-top: 20px; color: var(--wc-blue); font-size: 14px; }
.comparison-filter-status { flex-basis: 100%; color: var(--wc-muted); font-size: 12px; font-weight: 700; }
.wc-shell { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.wc-menu-toggle { display: none; border: 1px solid var(--wc-line); background: #fff; color: var(--wc-ink); border-radius: 999px; padding: 10px 14px; font: inherit; font-weight: 700; }
.wc-mobile-plan { display: none; }
.wc-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.88); border-bottom: 1px solid rgba(219,229,242,.82); backdrop-filter: blur(18px); }
.wc-nav { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.wc-brand { display: inline-flex; align-items: center; gap: 11px; color: var(--wc-ink); text-decoration: none; font-weight: 800; letter-spacing: -.03em; }
.wc-brand img { width: 36px; height: 36px; object-fit: contain; }
.wc-brand-mark { width: 34px; height: 38px; flex: 0 0 auto; color: var(--wc-blue); filter: drop-shadow(0 7px 10px rgba(20,86,217,.2)); }
body:not(.wc-body) .logo { position: relative; display: inline-flex; align-items: center; gap: 9px; }
body:not(.wc-body) .guide-brand-mark { width: 27px; height: 30px; flex: 0 0 auto; color: var(--wc-blue); filter: drop-shadow(0 5px 10px rgba(20,86,217,.18)); }
.wc-brand span { font-size: 15px; line-height: 1.1; }
.wc-navlinks { display: flex; align-items: center; gap: 28px; }
.wc-navlinks a { color: var(--wc-muted); text-decoration: none; font-size: 14px; font-weight: 650; }
.wc-navlinks a:hover, .wc-navlinks a:focus-visible { color: var(--wc-blue); }
.wc-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 14px; padding: 14px 22px; color: #fff; background: var(--wc-blue); font-weight: 800; line-height: 1.2; text-decoration: none; box-shadow: 0 10px 24px rgba(20,86,217,.2); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.wc-button:hover { transform: translateY(-2px); background: var(--wc-blue-dark); box-shadow: 0 14px 30px rgba(20,86,217,.28); }
.wc-button--quiet { color: var(--wc-blue); background: #fff; border: 1px solid var(--wc-line); box-shadow: none; }
.wc-button--quiet:hover { background: var(--wc-sky); }
.wc-hero { position: relative; overflow: hidden; background: linear-gradient(135deg, #f8fbff 0%, #edf5ff 58%, #fff 100%); }
.wc-hero::after { content: ""; position: absolute; inset: auto -10% -40% 38%; height: 420px; background: radial-gradient(circle, rgba(20,86,217,.12), transparent 68%); pointer-events: none; }
.wc-hero-grid { min-height: 590px; display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 40px; position: relative; z-index: 1; }
.wc-hero-stage { position: relative; isolation: isolate; }
.wc-hero-stage::before { content: ""; position: absolute; width: 230px; height: 230px; right: -30px; top: -30px; border: 1px solid rgba(20,86,217,.22); border-radius: 50%; box-shadow: 0 0 0 18px rgba(20,86,217,.04), 0 0 0 38px rgba(20,86,217,.025); z-index: -1; }
.wc-plan-overlay { position: absolute; left: 24px; right: 24px; bottom: 22px; display: flex; justify-content: space-between; gap: 10px; padding: 12px; border: 1px solid rgba(255,255,255,.28); border-radius: 15px; color: #fff; background: rgba(6,22,54,.78); backdrop-filter: blur(14px); box-shadow: 0 12px 28px rgba(4,17,42,.2); }
.wc-plan-overlay span { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.wc-plan-overlay b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: var(--wc-ink); background: var(--wc-amber); font-size: 10px; }
.wc-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--wc-blue); font-size: 12px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.wc-eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--wc-amber); }
.wc-hero h1 { max-width: 590px; margin: 18px 0 18px; font-size: clamp(42px, 5vw, 72px); line-height: .98; letter-spacing: -.065em; }
.wc-hero p { max-width: 540px; margin: 0; color: var(--wc-muted); font-size: 18px; line-height: 1.65; }
.wc-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.wc-note { display: flex; align-items: center; gap: 8px; margin-top: 20px; color: #6d7f95; font-size: 13px; }
.wc-note strong { color: var(--wc-ink); }
.wc-hero-art { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; border-radius: 28px; box-shadow: var(--wc-shadow); }
.wc-proof { border-bottom: 1px solid var(--wc-line); background: #fff; }
.wc-proof-grid { display: grid; grid-template-columns: repeat(3, 1fr); padding: 22px 0; gap: 20px; }
.wc-proof-item { display: flex; align-items: center; gap: 12px; color: var(--wc-muted); font-size: 13px; }
.wc-proof-mark { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 10px; color: var(--wc-blue); background: var(--wc-sky); font-weight: 900; }
.wc-section { padding: 104px 0; }
.wc-section--soft { background: #f8fbff; }
.wc-section--directory { background: #0b1830; color: #fff; }
.wc-section--directory h2 { color: #fff; }
.wc-section--directory .wc-section-intro { color: #b9c9df; }
.wc-search { display: block; max-width: 680px; margin: 0 0 24px; }
.wc-search-label { display: block; margin-bottom: 8px; color: #c5d4e8; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.wc-search input { width: 100%; padding: 16px 18px; border: 1px solid #3a5277; border-radius: 14px; color: var(--wc-ink); background: #fff; font: inherit; box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.wc-search input:focus { outline: 3px solid var(--wc-amber); outline-offset: 3px; }
.wc-search-status { margin: 0 0 12px; color: #b9c9df; font-size: 13px; }
.wc-directory-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.wc-directory-card { display: flex; flex-direction: column; min-height: 150px; padding: 20px; color: #fff; background: #132949; border: 1px solid #2b4770; border-radius: 16px; text-decoration: none; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.wc-directory-card:hover, .wc-directory-card:focus-visible { transform: translateY(-3px); border-color: var(--wc-amber); background: #18355e; }
.wc-directory-card span { color: var(--wc-amber); font-size: 12px; font-weight: 900; }
.wc-directory-card strong { margin-top: 18px; font-size: 17px; line-height: 1.2; }
.wc-directory-card small { margin-top: 8px; color: #b9c9df; line-height: 1.45; }
.wc-search-empty { color: #b9c9df; }
.wc-search-empty button { padding: 0; border: 0; color: #fff; background: transparent; font: inherit; font-weight: 800; text-decoration: underline; cursor: pointer; }
.wc-search-empty button:focus-visible { outline: 2px solid var(--wc-amber); outline-offset: 3px; border-radius: 3px; }
.wc-section-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 34px; }
.wc-section h2 { margin: 8px 0 0; font-size: clamp(30px, 4vw, 48px); letter-spacing: -.055em; line-height: 1.02; }
.wc-section-intro { max-width: 480px; color: var(--wc-muted); line-height: 1.65; }
.wc-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.wc-card { display: flex; flex-direction: column; min-height: 245px; padding: 28px; color: var(--wc-ink); background: #fff; border: 1px solid var(--wc-line); border-radius: var(--wc-radius); text-decoration: none; box-shadow: 0 8px 28px rgba(24,57,105,.05); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.wc-card--art { padding: 0 28px 28px; overflow: hidden; }
.wc-card-art { display: block; width: calc(100% + 56px); height: 150px; margin: 0 -28px 24px; object-fit: cover; }
.wc-card:hover, .wc-card:focus-visible { transform: translateY(-5px); border-color: #a8c4f8; box-shadow: var(--wc-shadow); }
.wc-card-icon { width: 44px; height: 44px; display: grid; place-items: center; margin-bottom: 24px; border-radius: 14px; color: var(--wc-blue); background: var(--wc-sky); font-size: 19px; font-weight: 900; }
.wc-card-icon svg { width: 25px; height: 25px; display: block; }
.wc-card-icon--question { color: #1456d9; background: #eaf2ff; }
.wc-card-icon--checklist { color: #087f70; background: #e5f7f3; }
.wc-card-icon--tool { color: #9a6500; background: #fff3d5; }
.wc-card-icon--shield { color: #1456d9; background: #eaf2ff; }
.wc-card-icon--key { color: #7c49b8; background: #f1eaff; }
.wc-card-icon--recovery { color: #087f70; background: #e5f7f3; }
.wc-card h3 { margin: 0 0 10px; font-size: 20px; letter-spacing: -.03em; }
.wc-card p { margin: 0; color: var(--wc-muted); line-height: 1.55; }
.wc-card-arrow { margin-top: auto; padding-top: 22px; color: var(--wc-blue); font-weight: 850; font-size: 14px; }
.wc-guide-feature { display: grid; grid-template-columns: 1.25fr .75fr; gap: 18px; align-items: stretch; }
.wc-guide-stack { display: grid; gap: 18px; }
.wc-guide-stack .wc-card { min-height: 0; }
.wc-card--featured { min-height: 510px; padding: 0 38px 38px; }
.wc-card--featured .wc-card-art { height: 270px; width: calc(100% + 76px); margin-left: -38px; margin-right: -38px; }
.wc-card-kicker { display: block; margin-bottom: 12px; color: var(--wc-blue); font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.wc-emergency { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; margin: 0 0 30px; padding: 20px 22px; border: 1px solid #3c587d; border-radius: 18px; background: linear-gradient(105deg, #152f55, #10233e); }
.wc-emergency strong { color: #fff; font-size: 18px; }
.wc-emergency p { margin: 4px 0 0; color: #b9c9df; font-size: 14px; line-height: 1.45; }
.wc-emergency a { color: var(--wc-amber); font-weight: 850; text-decoration: none; white-space: nowrap; }
.wc-route-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; color: var(--wc-ink); background: var(--wc-amber); font-weight: 900; font-size: 22px; }
.wc-method { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: start; }
.wc-method-list { display: grid; gap: 14px; }
.wc-method-step { display: grid; grid-template-columns: 42px 1fr; gap: 14px; padding: 18px; border: 1px solid var(--wc-line); border-radius: 16px; background: #fff; }
.wc-method-step b { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: #fff; background: var(--wc-blue); font-size: 13px; }
.wc-method-step h3 { margin: 1px 0 4px; font-size: 16px; }
.wc-method-step p { margin: 0; color: var(--wc-muted); line-height: 1.5; font-size: 14px; }
.wc-cta { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; padding: 42px 48px; border-radius: 28px; color: #fff; background: var(--wc-ink); box-shadow: var(--wc-shadow); }
.wc-cta h2 { margin: 0 0 10px; color: #fff; }
.wc-cta p { max-width: 600px; margin: 0; color: #b5c5da; line-height: 1.6; }
.wc-footer { padding: 34px 0 42px; color: #72839a; border-top: 1px solid var(--wc-line); font-size: 13px; }
.wc-footer-row { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.wc-footer a { color: var(--wc-muted); text-decoration: none; margin-left: 18px; }
.wc-footer a:hover { color: var(--wc-blue); }
.wc-skip { position: fixed; left: 16px; top: -60px; z-index: 100; padding: 12px 16px; color: #fff; background: var(--wc-ink); border-radius: 10px; font-weight: 800; }
.wc-skip:focus { top: 16px; }
:where(a,button):focus-visible { outline: 3px solid var(--wc-amber); outline-offset: 3px; }
@media (max-width: 820px) { .wc-hero-grid, .wc-method { grid-template-columns: 1fr; gap: 40px; } .wc-hero-grid { padding: 72px 0 56px; } .wc-hero-art { max-width: 680px; } .wc-card-grid { grid-template-columns: 1fr; } .wc-section { padding: 76px 0; } .wc-section-head { display: block; } .wc-section-intro { margin-top: 14px; } .wc-cta { grid-template-columns: 1fr; padding: 32px; } }
@media (max-width: 820px) { .wc-directory-grid, .wc-guide-index-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .wc-shell { width: min(100% - 32px, 1160px); } .wc-menu-toggle { display: inline-flex; } .wc-navlinks { display: none; position: absolute; top: 74px; left: 16px; right: 16px; flex-direction: column; align-items: stretch; padding: 14px; background: #fff; border: 1px solid var(--wc-line); border-radius: 18px; box-shadow: 0 18px 40px rgba(24,57,105,.14); } .wc-navlinks.is-open { display: flex; } .wc-proof-grid { grid-template-columns: 1fr; gap: 12px; } .wc-hero h1 { font-size: 46px; } .wc-hero p { font-size: 16px; } .wc-button { width: 100%; } .wc-hero-actions { display: grid; } .wc-footer-row { display: block; } .wc-footer a { display: inline-block; margin: 14px 14px 0 0; } .wc-guide-index-grid { grid-template-columns: 1fr; } .wc-guide-index-hero { padding: 68px 0 54px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* Release-blocker fixes: quiz and checklist controls stay visible after the shared stylesheet loads. */
.quiz-container button.option { display: block; width: 100%; min-height: 52px; padding: 16px 20px; border: 2px solid #b8c9df; border-radius: 14px; color: #0b1830; background: #fff; font: inherit; font-weight: 700; text-align: left; cursor: pointer; box-shadow: 0 4px 12px rgba(20,57,112,.05); }
.quiz-container button.option:hover, .quiz-container button.option:focus-visible { border-color: var(--wc-blue); background: #eef5ff; }
.quiz-container button.option[aria-pressed="true"], .quiz-container button.option.selected { border-color: var(--wc-blue); color: #072b76; background: #dceaff; box-shadow: 0 0 0 4px rgba(20,86,217,.12); }
.quiz-status { min-height: 24px; margin: -18px 0 18px; color: var(--wc-blue); font-size: 14px; font-weight: 700; }
.checklist-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 0 0 28px; padding: 14px 16px; border: 1px solid var(--wc-line); border-radius: 16px; background: #f8fbff; }
.checklist-nav strong { width: 100%; color: var(--wc-ink); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.checklist-nav a { color: var(--wc-blue); font-size: 13px; font-weight: 800; text-decoration: none; }
.checklist-status { width: 100%; margin: 2px 0 0; color: var(--wc-muted); font-size: 13px; font-weight: 700; }
.checklist-control { display: flex; width: 100%; min-height: 48px; align-items: center; gap: 12px; padding: 0; border: 0; color: inherit; background: transparent; font: inherit; font-weight: 800; text-align: left; cursor: pointer; }
.checklist-box { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 auto; border: 2px solid var(--wc-blue); border-radius: 8px; color: #fff; background: #fff; }
.checklist-control:focus-visible { outline: 3px solid var(--wc-amber); outline-offset: 4px; border-radius: 5px; }
.priority-high.is-complete, .priority-medium.is-complete, .priority-low.is-complete { opacity: .7; }
.is-complete .checklist-box { background: var(--wc-blue); }
.checklist-related { display: inline-block; margin-top: 10px; color: var(--wc-blue); font-size: 13px; font-weight: 800; text-decoration: none; }
@media (max-width: 480px) { .quiz-card, .results-card { padding: 24px 18px; } .quiz-container button.option { min-height: 56px; } .checklist-nav { display: block; } .checklist-nav a { display: block; padding: 6px 0; } body:not(.wc-body) .btn { width: 100%; white-space: normal; } }

/* Shared article shell: one visual language across guides, legal pages, and utility pages. */
body:not(.wc-body) { color: var(--wc-ink); background: #fff; font-family: "DM Sans", Inter, ui-sans-serif, system-ui, sans-serif; }
body:not(.wc-body) .site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); border-bottom: 1px solid var(--wc-line); box-shadow: 0 8px 24px rgba(24,57,105,.04); backdrop-filter: blur(16px); }
body:not(.wc-body) .header-inner { width: min(1160px, calc(100% - 48px)); min-height: 74px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
body:not(.wc-body) .logo { color: var(--wc-ink); font-weight: 800; letter-spacing: -.035em; text-decoration: none; }
body:not(.wc-body) .logo span { color: var(--wc-blue); }
body:not(.wc-body) .nav-links { display: flex; align-items: center; gap: 26px; }
body:not(.wc-body) .nav-links a { color: var(--wc-muted); font-weight: 700; text-decoration: none; }
body:not(.wc-body) .nav-links a:hover { color: var(--wc-blue); }
body:not(.wc-body) .btn { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 8px; padding: 13px 22px; border: 1px solid transparent; border-radius: 14px; font-weight: 800; line-height: 1.2; text-align: center; white-space: nowrap; text-decoration: none; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
body:not(.wc-body) .btn-primary { color: #fff; background: var(--wc-blue); box-shadow: 0 10px 24px rgba(20,86,217,.18); }
body:not(.wc-body) .btn-primary:hover { background: var(--wc-blue-dark); transform: translateY(-2px); }
body:not(.wc-body) .btn-secondary { color: var(--wc-ink); background: #fff; border-color: var(--wc-line); box-shadow: 0 6px 16px rgba(24,57,105,.06); }
body:not(.wc-body) .btn-secondary:hover, body:not(.wc-body) .btn-white:hover { color: var(--wc-blue); background: var(--wc-sky); border-color: #b8cdf0; }
body:not(.wc-body) .btn-white, body:not(.wc-body) .btn-ghost { min-height: 46px; padding: 12px 20px; border-radius: 14px; line-height: 1.2; }
body:not(.wc-body) .article-header { position: relative; overflow: hidden; color: #fff; background: linear-gradient(135deg, rgba(5,14,37,.96), rgba(11,35,79,.92)), url('/images/cyber-grid-bg.png') center/cover; border-bottom: 1px solid #152f62; }
body:not(.wc-body) .article-header::before { content: ""; position: absolute; inset: 0 0 0 42%; background: url('/images/guide-recovery.webp') center/cover no-repeat; opacity: .28; mix-blend-mode: screen; pointer-events: none; }
body:not(.wc-body) .article-header--endpoint::before { background-image: url('/images/guide-endpoint.webp'); }
body:not(.wc-body) .article-header--access::before { background-image: url('/images/guide-access.webp'); }
body:not(.wc-body) .article-header--network::before { background-image: url('/images/guide-network.webp'); }
body:not(.wc-body) .article-header--website::before { background-image: url('/images/guide-website.webp'); }
body:not(.wc-body) .article-header--checklist::before { background-image: url('/images/guide-checklist.webp'); }
body:not(.wc-body) .article-header--email::before { background-image: url('/images/guide-email.webp'); }
body:not(.wc-body) .article-header--hipaa::before { background-image: url('/images/guide-hipaa.webp'); }
body:not(.wc-body) .article-header--deployment::before { background-image: url('/images/guide-deployment.webp'); }
body:not(.wc-body) .article-header--pos::before { background-image: url('/images/guide-pos.webp'); }
body:not(.wc-body) .article-header--recovery::before { background-image: url('/images/guide-recovery.webp'); }
body:not(.wc-body) .article-header--hospitality::before { background-image: url('/images/guide-hospitality.webp'); }
body:not(.wc-body) .article-header::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 78% 20%, rgba(79,177,255,.24), transparent 34%), linear-gradient(90deg, transparent 35%, rgba(126,96,255,.12)); pointer-events: none; }
body:not(.wc-body) .article-header > * { position: relative; z-index: 1; }
body:not(.wc-body) .article-header h1 { color: #fff; letter-spacing: -.055em; }
body:not(.wc-body) .article-header h1, body:not(.wc-body) .article-content h2 { font-family: var(--wc-serif); font-weight: 600; }
body:not(.wc-body) .article-header p, body:not(.wc-body) .article-header .article-meta { color: #c9d8f0; }
body:not(.wc-body) .article-content { max-width: none; width: 100%; padding: 54px 0 96px; }
body:not(.wc-body) > article > .article-content { box-sizing: border-box; width: min(820px, calc(100% - 48px)); margin: 0 auto; padding: 64px 0 96px; }
body:not(.wc-body) > article > .article-content h2 { margin-top: 48px; }
body:not(.wc-body) > article > .article-content h2:first-child { margin-top: 0; }
body:not(.wc-body) .article-content > .ad-banner:first-child { display: none; }
body:not(.wc-body) .guide-content-shell { display: grid; grid-template-columns: minmax(190px, 220px) minmax(0, 820px); gap: clamp(28px, 5vw, 64px); align-items: start; width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
body:not(.wc-body) .guide-main { min-width: 0; }
body:not(.wc-body) .guide-reading-nav { position: sticky; top: 94px; padding: 20px 18px; border: 1px solid var(--wc-line); border-radius: 18px; background: linear-gradient(160deg, #fff, #f5f9ff); box-shadow: 0 12px 28px rgba(24,57,105,.07); }
body:not(.wc-body) .guide-reading-nav-label { margin-bottom: 12px; color: var(--wc-blue); font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
body:not(.wc-body) .guide-reading-nav ol { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; counter-reset: guide-nav; }
body:not(.wc-body) .guide-reading-nav li { counter-increment: guide-nav; margin: 0; }
body:not(.wc-body) .guide-reading-nav li a { display: grid; grid-template-columns: 24px 1fr; gap: 7px; padding: 9px 7px; border-radius: 9px; color: var(--wc-muted); font-size: 12px; font-weight: 700; line-height: 1.35; text-decoration: none; }
body:not(.wc-body) .guide-reading-nav li a::before { content: counter(guide-nav, decimal-leading-zero); color: #93a5bd; font-size: 10px; font-weight: 900; padding-top: 2px; }
body:not(.wc-body) .guide-reading-nav li a:hover, body:not(.wc-body) .guide-reading-nav li a:focus-visible, body:not(.wc-body) .guide-reading-nav li a.is-active { color: var(--wc-blue); background: #eaf2ff; }
body:not(.wc-body) .guide-reading-nav li a.is-active::before { color: var(--wc-blue); }
body:not(.wc-body) .guide-reading-nav-top { display: block; margin-top: 15px; padding: 12px 7px 0; border-top: 1px solid var(--wc-line); color: var(--wc-blue); font-size: 12px; font-weight: 800; text-decoration: none; }
body:not(.wc-body) .editorial-trust { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; margin: -24px auto 36px; padding: 22px 24px; position: relative; z-index: 2; max-width: 820px; border: 1px solid #dbe5f2; border-radius: 18px; background: #fff; box-shadow: 0 14px 36px rgba(24,57,105,.1); }
body:not(.wc-body) .stat-banner { display: none; }
body:not(.wc-body) .editorial-trust strong { color: var(--wc-ink); }
body:not(.wc-body) .editorial-trust p { margin: 5px 0 0; color: var(--wc-muted); font-size: 13px; line-height: 1.5; }
body:not(.wc-body) .decision-snapshot { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 auto 34px; max-width: 820px; }
body:not(.wc-body) .decision-snapshot > div { padding: 16px; border: 1px solid var(--wc-line); border-radius: 16px; background: linear-gradient(145deg, #fff, #f5f9ff); }
body:not(.wc-body) .decision-snapshot strong { display: block; margin-bottom: 6px; color: var(--wc-blue); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
body:not(.wc-body) .decision-snapshot span { color: var(--wc-ink); font-size: 14px; line-height: 1.45; }
body:not(.wc-body) .guide-visual { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0 auto 34px; max-width: 820px; }
body:not(.wc-body) .guide-visual div { position: relative; padding: 15px 12px 13px; border-radius: 14px; color: #fff; background: #0d2346; overflow: hidden; }
body:not(.wc-body) .guide-visual div::after { content: ""; position: absolute; width: 70px; height: 70px; right: -26px; bottom: -26px; border: 1px solid rgba(244,185,66,.5); border-radius: 50%; }
body:not(.wc-body) .guide-visual b { display: block; margin-bottom: 5px; color: var(--wc-amber); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
body:not(.wc-body) .guide-visual span { font-size: 14px; font-weight: 800; }
body:not(.wc-body) .guide-infographic { box-sizing: border-box; width: min(100%, 1100px); max-width: 1100px; margin: 0 auto 38px; padding: 0 20px; overflow: hidden; }
body:not(.wc-body) .guide-infographic img { display: block; width: 100%; height: auto; aspect-ratio: 2752 / 1536; object-fit: cover; background: #edf4fb; border: 1px solid #dbe5f2; border-radius: 22px; box-shadow: 0 18px 45px rgba(24,57,105,.14); clip-path: inset(0 0 36px 0); margin-bottom: -36px; }
body:not(.wc-body) .guide-infographic figcaption { margin-top: 8px; color: var(--wc-muted); font-size: 12px; text-align: center; }
body:not(.wc-body) .comparison-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
body:not(.wc-body) .comparison-filter button { border: 1px solid var(--wc-line); border-radius: 999px; padding: 8px 12px; color: var(--wc-muted); background: #fff; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
body:not(.wc-body) .comparison-filter button[aria-pressed="true"], body:not(.wc-body) .comparison-filter button:hover { color: #fff; background: var(--wc-blue); border-color: var(--wc-blue); }
body:not(.wc-body) .evidence-ribbon { margin: 28px 0; padding: 15px 18px; border-left: 3px solid var(--wc-amber); color: var(--wc-muted); background: #f8fbff; font-size: 13px; line-height: 1.55; }
body:not(.wc-body) .article-content p, body:not(.wc-body) .article-content li { color: #43556d; line-height: 1.8; }
body:not(.wc-body) .article-content > p { max-width: 68ch; }
body:not(.wc-body) .article-content h2 { position: relative; margin-top: 58px; padding-top: 26px; color: var(--wc-ink); letter-spacing: -.035em; scroll-margin-top: 104px; }
body:not(.wc-body) .article-content h2::before { content: ""; position: absolute; top: 0; left: 0; width: 42px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, var(--wc-blue), var(--wc-amber)); }
body:not(.wc-body) .article-content h2:first-of-type { margin-top: 20px; }
body:not(.wc-body) .article-content h3 { margin-top: 30px; padding-left: 14px; border-left: 3px solid #c9dcfb; color: var(--wc-ink); }
body:not(.wc-body) .article-content ul, body:not(.wc-body) .article-content ol { padding-left: 24px; }
body:not(.wc-body) .article-content li + li { margin-top: 7px; }
body:not(.wc-body) .article-content > p + ul, body:not(.wc-body) .article-content > p + ol, body:not(.wc-body) .article-content > h3 + ul, body:not(.wc-body) .article-content > h3 + ol { padding: 17px 20px 17px 40px; border: 1px solid var(--wc-line); border-radius: 16px; background: #f8fbff; }
body:not(.wc-body) .article-meta, body:not(.wc-body) .article-tag { color: var(--wc-muted); }
body:not(.wc-body) .best-for, body:not(.wc-body) .highlight-box, body:not(.wc-body) .stat-banner { border-radius: 18px; border-color: var(--wc-line); box-shadow: 0 8px 26px rgba(24,57,105,.05); }
body:not(.wc-body) .table-scroll { max-width: 100%; margin: 24px 0; overflow-x: auto; overscroll-behavior-inline: contain; border: 1px solid var(--wc-line); border-radius: 16px; background: #fff; }
body:not(.wc-body) .table-scroll::before { content: "Swipe to compare →"; display: block; padding: 9px 14px; color: var(--wc-muted); background: #f8fbff; border-bottom: 1px solid var(--wc-line); font-size: 12px; font-weight: 800; letter-spacing: .03em; }
body:not(.wc-body) .comparison-table { min-width: 514px; margin: 0; border: 0; border-radius: 0; overflow: visible; }
body:not(.wc-body) .comparison-table th { color: #fff; background: var(--wc-ink); }
body:not(.wc-body) .comparison-table td { color: #43556d; }
body:not(.wc-body) .site-footer { color: #71839b; border-top: 1px solid var(--wc-line); background: #f8fbff; }
body:not(.wc-body) .mobile-menu-toggle { border-color: var(--wc-line); color: var(--wc-ink); }
body:not(.wc-body) .skip-link, body:not(.wc-body) .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
body:not(.wc-body) .skip-link:focus-visible, body:not(.wc-body) .sr-only:focus-visible { width: auto !important; height: auto !important; margin: 0 !important; padding: 12px 16px !important; clip: auto !important; top: 12px !important; left: 12px !important; z-index: 100 !important; color: #fff !important; background: var(--wc-ink) !important; border-radius: 10px !important; }
body:not(.wc-body) .site-header .logo { white-space: nowrap; }
body:not(.wc-body) .product-brand { overflow: hidden; background: #fff !important; }
body:not(.wc-body) .product-brand img { display: block; width: 86%; height: 86%; object-fit: contain; }
body:not(.wc-body) .product-image.product-logo-tile { display: flex; align-items: center; justify-content: center; padding: 14px; border: 1px solid var(--wc-line); background: #fff; }
body:not(.wc-body) .product-image.product-logo-tile img { width: 100%; height: 100%; object-fit: contain; }
body:not(.wc-body) .product-recommendation-logo { display: inline-block; width: 34px; height: 34px; margin-right: 10px; vertical-align: middle; object-fit: contain; }

/* Shared comparison-card anatomy: rank, brand mark, details, then one consistent CTA. */
body:not(.wc-body) .product-card-header { display: grid !important; grid-template-columns: 48px 84px minmax(0, 1fr) auto !important; align-items: center; gap: 16px; }
body:not(.wc-body) .product-card-header .product-rank { grid-column: 1; grid-row: 1; }
body:not(.wc-body) .product-card-header .product-brand,
body:not(.wc-body) .product-card-header .product-image { grid-column: 2; grid-row: 1; width: 84px; height: 52px; margin: 0; }
body:not(.wc-body) .product-card-header .product-info { grid-column: 3; grid-row: 1; min-width: 0; }
body:not(.wc-body) .product-card-header .product-visit { grid-column: 4; grid-row: 1; white-space: nowrap; }

/* Optical sizing: the source marks have very different viewBox proportions, so
   scale their visible artwork rather than letting each intrinsic canvas decide. */
body:not(.wc-body) .product-card .product-brand img,
body:not(.wc-body) .product-card .product-image img { transform: scale(var(--product-logo-scale, 1)); }
body:not(.wc-body) .product-card img[src*="astra.svg"],
body:not(.wc-body) .product-card img[src*="bitdefender.svg"],
body:not(.wc-body) .product-card img[src*="bitwarden.svg"],
body:not(.wc-body) .product-card img[src*="dashlane.svg"],
body:not(.wc-body) .product-card img[src*="keeper.svg"],
body:not(.wc-body) .product-card img[src*="malwarebytes.svg"],
body:not(.wc-body) .product-card img[src*="nordvpn.svg"],
body:not(.wc-body) .product-card img[src*="norton.svg"],
body:not(.wc-body) .product-card img[src*="onepassword.svg"],
body:not(.wc-body) .product-card img[src*="perimeter81.svg"],
body:not(.wc-body) .product-card img[src*="qualys.svg"],
  body:not(.wc-body) .product-card img[src*="tailscale.svg"] { --product-logo-scale: .90; }
body:not(.wc-body) .product-card img[src*="eset.svg"],
body:not(.wc-body) .product-card img[src*="nordlayer.svg"],
body:not(.wc-body) .product-card img[src*="nordpass.svg"],
body:not(.wc-body) .product-card img[src*="sitelock.svg"] { --product-logo-scale: 1; }
body:not(.wc-body) .product-card img[src*="purevpn.png"],
body:not(.wc-body) .product-card img[src*="sucuri.png"],
body:not(.wc-body) .product-card img[src*="wordfence.png"] { --product-logo-scale: 1; }
body:not(.wc-body) .hipaa-checklist { list-style: none; padding: 0; }
body:not(.wc-body) .hipaa-checklist li::before { content: none; }
body:not(.wc-body) .hipaa-checklist li { padding: 0; border-bottom: 1px solid var(--wc-line); }
body:not(.wc-body) .hipaa-checklist label { display: flex; align-items: center; gap: 13px; min-height: 56px; padding: 10px 4px; color: var(--wc-ink); font-weight: 700; cursor: pointer; }
body:not(.wc-body) .hipaa-checklist input { width: 22px; height: 22px; flex: 0 0 auto; accent-color: var(--wc-blue); cursor: pointer; }
body:not(.wc-body) .hipaa-checklist input:checked + span { color: var(--wc-muted); text-decoration: line-through; text-decoration-thickness: 1px; }
body.pos-guide .pos-checklist { list-style: none; padding: 0; margin: 18px 0 0; }
body.pos-guide .pos-checklist li { margin: 0; padding: 0; border-bottom: 1px solid var(--wc-line); }
body.pos-guide .pos-checklist label { display: flex; align-items: center; gap: 13px; min-height: 52px; padding: 8px 4px; color: var(--wc-ink); font-weight: 700; cursor: pointer; }
body.pos-guide .pos-checklist input { width: 22px; height: 22px; flex: 0 0 auto; accent-color: var(--wc-blue); cursor: pointer; }
body.pos-guide .pos-checklist input:checked + span { color: var(--wc-muted); text-decoration: line-through; text-decoration-thickness: 1px; }
body.pos-guide .step-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; align-items: start; margin: 8px 0; padding: 16px 20px; }
body.pos-guide .step-card .step-number { grid-column: 1; grid-row: 1; margin: 2px 0 0; }
body.pos-guide .step-card h3 { grid-column: 2; margin: 2px 0 6px; }
body.pos-guide .step-card > p, body.pos-guide .step-card > ul { grid-column: 2; }
body.pos-guide .step-card p { margin-bottom: 6px; }
body.pos-guide .step-card > ul { margin: 6px 0 0; }
body.ransomware-guide .ransomware-checklist { list-style: none; padding: 0; margin: 18px 0 0; }
body.ransomware-guide .ransomware-checklist li { margin: 0; padding: 0; border-bottom: 1px solid var(--wc-line); }
body.ransomware-guide .ransomware-checklist li::before { content: none; }
body.ransomware-guide .ransomware-checklist label { display: flex; align-items: center; gap: 13px; min-height: 52px; padding: 8px 4px; color: var(--wc-ink); font-weight: 700; cursor: pointer; }
body.ransomware-guide .ransomware-checklist input { width: 22px; height: 22px; flex: 0 0 auto; accent-color: var(--wc-blue); cursor: pointer; }
body.ransomware-guide .ransomware-checklist input:checked + span { color: var(--wc-muted); text-decoration: line-through; text-decoration-thickness: 1px; }
body.ransomware-guide .step-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; align-items: start; margin: 8px 0; padding: 16px 20px; }
body.ransomware-guide .step-card .step-number { grid-column: 1; grid-row: 1; margin: 2px 0 0; }
body.ransomware-guide .step-card h3 { grid-column: 2; margin: 2px 0 6px; }
body.ransomware-guide .step-card > p, body.ransomware-guide .step-card > ul { grid-column: 2; }
body.ransomware-guide .step-card p { margin-bottom: 6px; }
body.ransomware-guide .step-card > ul { margin: 6px 0 0; }
body.vpn-restaurant-guide .restaurant-network-checklist { list-style: none; padding: 0; margin: 18px 0 0; }
body.vpn-restaurant-guide .restaurant-network-checklist li { margin: 0; padding: 0; border-bottom: 1px solid var(--wc-line); }
body.vpn-restaurant-guide .restaurant-network-checklist li::before { content: none; }
body.vpn-restaurant-guide .restaurant-network-checklist label { display: flex; align-items: center; gap: 13px; min-height: 52px; padding: 8px 4px; color: var(--wc-ink); font-weight: 700; cursor: pointer; }
body.vpn-restaurant-guide .restaurant-network-checklist input { width: 22px; height: 22px; flex: 0 0 auto; accent-color: var(--wc-blue); cursor: pointer; }
body.vpn-restaurant-guide .restaurant-network-checklist input:checked + span { color: var(--wc-muted); text-decoration: line-through; text-decoration-thickness: 1px; }
/* VPN marks are unusually wide, so give this guide a larger, dedicated brand tile. */
body.vpn-guide .product-card-header { grid-template-columns: 48px 112px minmax(0, 1fr) auto !important; }
body.vpn-guide .product-card-header .product-brand,
body.vpn-guide .product-card-header .product-image { width: 112px; height: 64px; }
body.vpn-guide .product-card .product-image img { transform: scale(1.08); }
body.vpn-guide .product-card .product-image:has(img[src*="nordlayer.svg"]) { background: #102b4d; border-color: #102b4d; }
@media (max-width: 768px) {
  body:not(.wc-body) .product-card-header { grid-template-columns: 44px 64px minmax(0, 1fr) !important; gap: 10px; text-align: left; }
  body:not(.wc-body) .product-card-header .product-brand,
  body:not(.wc-body) .product-card-header .product-image { width: 64px; height: 48px; }
  body:not(.wc-body) .product-card-header .product-visit { grid-column: 1 / -1; grid-row: 2; justify-content: center; width: 100%; }
  body.vpn-guide .product-card-header { grid-template-columns: 44px 78px minmax(0, 1fr) !important; }
  body.vpn-guide .product-card-header .product-brand,
  body.vpn-guide .product-card-header .product-image { width: 78px; height: 56px; }
}
@media (max-width: 860px) { body:not(.wc-body) .guide-content-shell { display: block; width: min(100% - 40px, 820px); } body:not(.wc-body) .guide-reading-nav { position: relative; top: auto; margin: 22px 0 0; padding: 14px; } body:not(.wc-body) .guide-reading-nav ol { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; } body:not(.wc-body) .guide-reading-nav li { flex: 0 0 auto; } body:not(.wc-body) .guide-reading-nav li a { display: block; max-width: 190px; padding: 9px 11px; border: 1px solid var(--wc-line); background: #fff; } body:not(.wc-body) .guide-reading-nav li a::before { display: inline; margin-right: 6px; } body:not(.wc-body) .guide-reading-nav-top { display: none; } body:not(.wc-body) .article-content { padding: 38px 0 72px; } }
@media (max-width: 720px) { body:not(.wc-body) .header-inner { width: min(100% - 32px, 1160px); } body:not(.wc-body) .nav-links { display:none; } body:not(.wc-body) .editorial-trust { grid-template-columns: 1fr; margin-inline: 20px; } body:not(.wc-body) .decision-snapshot, body:not(.wc-body) .guide-visual { grid-template-columns: 1fr; margin-inline: 20px; } body:not(.wc-body) .guide-infographic { width: 100%; margin-bottom: 28px; padding-inline: 20px; } body:not(.wc-body) .guide-infographic img { border-radius: 16px; } body:not(.wc-body) .article-content h2 { margin-top: 46px; font-size: 1.55rem; } body:not(.wc-body) .article-content h3 { font-size: 1.05rem; } }
@media (max-width: 820px) { .wc-guide-feature { grid-template-columns: 1fr; } .wc-card--featured { min-height: 0; } .wc-emergency { grid-template-columns: auto 1fr; } .wc-emergency a { grid-column: 2; } }
@media (max-width: 620px) { .wc-plan-overlay { left: 12px; right: 12px; } .wc-plan-overlay span { font-size: 9px; } }
@media (max-width: 620px) { .wc-header .wc-button { display: none; } .wc-mobile-plan { display: block; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--wc-line); color: var(--wc-blue) !important; } body:not(.wc-body) .site-header .header-inner { width: calc(100% - 32px); min-width: 0; min-height: 66px; padding-right: 76px; gap: 10px; } body:not(.wc-body) .logo { display: block; max-width: 190px; overflow: hidden; font-size: 14px; line-height: 1.1; white-space: nowrap; text-overflow: ellipsis; } body:not(.wc-body) .site-header .btn-primary { display: none; } body:not(.wc-body) .mobile-menu-toggle { position: absolute; top: 15px; right: 16px; margin: 0; } body:not(.wc-body) .mobile-menu { position: absolute; top: 66px; left: 16px; right: 16px; z-index: 60; } body:not(.wc-body) .article-header { padding: 42px 0 34px; } body:not(.wc-body) .article-header h1 { font-size: clamp(30px, 8vw, 42px); } }