/*
 * Site chrome: skip link, header, navigation, breadcrumbs and footer.
 *
 * Loaded on every page, including the older long-form pages that bring their
 * own article.css. Everything here is scoped to .site-* classes and sets its
 * own font, size and case, so the older pages' global h1-h3 rules (uppercase,
 * condensed) cannot leak into the header or footer.
 */
.skip-link{position:absolute;left:12px;top:-60px;z-index:1000;background:#fff;color:#0A0A0A;padding:12px 16px;font:600 15px/1 'Poppins',system-ui,-apple-system,sans-serif;border-radius:4px;text-decoration:none}
.skip-link:focus{top:12px}

:focus-visible{outline:3px solid #3B82F6;outline-offset:3px}

.site-header{position:sticky;top:0;z-index:500;background:#0A0A0A;border-bottom:1px solid #222;font-family:'Poppins',system-ui,-apple-system,sans-serif}
.site-header__inner{max-width:1180px;margin:0 auto;padding:0 24px;min-height:68px;display:flex;align-items:center;gap:24px;position:relative}
.site-logo{color:#fff;text-decoration:none;font-weight:700;font-size:17px;letter-spacing:0.01em;white-space:nowrap;padding:10px 0;margin-right:auto}
.site-nav{display:flex;align-items:center}
.site-nav ul{list-style:none;margin:0;padding:0}
.site-nav__list{display:flex;align-items:center;gap:4px}
.site-nav__list>li{margin:0;position:relative}
.site-nav a,.site-nav button{font:500 15px/1.3 'Poppins',system-ui,-apple-system,sans-serif;color:#e5e5e5;text-decoration:none;background:none;border:0;cursor:pointer;display:flex;align-items:center;gap:6px;min-height:44px;padding:10px 12px;border-radius:4px;text-transform:none;letter-spacing:0}
.site-nav a:hover,.site-nav button:hover{color:#fff;background:#1a1a1a}
.site-nav a[aria-current="page"]{color:#fff;box-shadow:inset 0 -2px 0 #60A5FA}
.site-nav__toggle{display:none!important}
.site-nav__chev{width:10px;height:10px;transition:transform .2s ease}
.site-nav__sub-toggle[aria-expanded="true"] .site-nav__chev{transform:rotate(180deg)}
.site-nav__sub{position:absolute;top:calc(100% + 6px);left:0;min-width:240px;background:#111;border:1px solid #2a2a2a;border-radius:6px;padding:6px;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.site-nav__sub li{margin:0}
.site-nav__sub a{padding:12px 14px}
/* Without JavaScript the sub-menu opens on hover and keyboard focus. */
html:not(.js) .site-nav__sub{display:none}
html:not(.js) .site-nav__group:hover .site-nav__sub,html:not(.js) .site-nav__group:focus-within .site-nav__sub{display:block}
.js .site-nav__sub{display:none}
.js .site-nav.sub-open .site-nav__sub{display:block}

.site-cta{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;background:#2563EB;color:#fff;text-decoration:none;font:600 14px/1.2 'Poppins',system-ui,-apple-system,sans-serif;border-radius:4px;white-space:nowrap;text-transform:none;letter-spacing:0}
.site-cta:hover{background:#1D4ED8;color:#fff}
.site-cta__short{display:none}

.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (max-width:960px){
  .site-header__inner{gap:10px;padding:0 16px;min-height:64px}
  .site-logo{font-size:16px}
  .site-cta{order:2;padding:10px 14px;font-size:14px}
  .site-nav{order:3}
  .site-cta__long{display:none}
  .site-cta__short{display:inline}
  .js .site-nav__toggle{display:flex!important;border:1px solid #444;color:#fff;padding:10px 12px}
  .site-nav__list{flex-direction:column;align-items:stretch;gap:0}
  /* No JavaScript: the menu is simply shown under the header. */
  html:not(.js) .site-header__inner{flex-wrap:wrap}
  html:not(.js) .site-nav{order:4;width:100%}
  html:not(.js) .site-nav__list{width:100%;padding-bottom:12px}
  html:not(.js) .site-nav__sub{display:block;position:static;box-shadow:none;border:0;padding:0 0 0 12px;background:none}
  .js .site-nav__list{display:none;position:absolute;left:0;right:0;top:100%;background:#0A0A0A;border-bottom:1px solid #222;padding:8px 16px 16px;max-height:calc(100vh - 64px);overflow-y:auto;box-shadow:0 18px 32px rgba(0,0,0,.65)}
  .js .site-nav.is-open .site-nav__list{display:flex}
  .site-nav__list a,.site-nav__list button{width:100%;justify-content:space-between;padding:14px 8px;font-size:16px;border-bottom:1px solid #1f1f1f;border-radius:0}
  .js .site-nav__sub{position:static;box-shadow:none;border:0;background:none;padding:0 0 0 12px;min-width:0}
}
@media (max-width:359px){
  .site-header__inner{padding:0 12px;gap:8px}
  .site-logo{font-size:15px}
  .site-cta{padding:10px 12px;font-size:13px}
  .js .site-nav__toggle{padding:10px}
}

.site-breadcrumbs{background:#F4F4F4;border-bottom:1px solid #e5e5e5;font:400 14px/1.5 'Poppins',system-ui,-apple-system,sans-serif}
.site-breadcrumbs ol{max-width:1180px;margin:0 auto;padding:10px 24px;list-style:none;display:flex;flex-wrap:wrap;gap:4px 0}
.site-breadcrumbs li{margin:0;color:#404040}
.site-breadcrumbs li+li::before{content:"/";margin:0 10px;color:#737373}
.site-breadcrumbs a{color:#1D4ED8;text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:4px 0}
.site-breadcrumbs [aria-current]{color:#262626}

.site-footer{background:#050505;color:#d4d4d4;font:400 15px/1.6 'Poppins',system-ui,-apple-system,sans-serif;border-top:1px solid #1a1a1a}
.site-footer__inner{max-width:1180px;margin:0 auto;padding:56px 24px 32px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px}
.site-footer h2{font:600 13px/1.4 'Poppins',system-ui,-apple-system,sans-serif;text-transform:uppercase;letter-spacing:0.1em;color:#fff;margin:0 0 14px}
.site-footer p{margin:0 0 12px;color:#c4c4c4;font-size:15px}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin:0}
.site-footer a{color:#d4d4d4;text-decoration:underline;text-decoration-color:#525252;text-underline-offset:4px;display:inline-block;padding:7px 0}
.site-footer a:hover{color:#fff;text-decoration-color:#fff}
.site-footer__name{font-weight:700;font-size:18px;color:#fff!important;margin-bottom:8px!important}
.site-footer__base{max-width:1180px;margin:0 auto;padding:20px 24px 32px;border-top:1px solid #1f1f1f;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:14px;color:#a3a3a3}
.site-footer__base a{padding:4px 0}
@media (max-width:860px){.site-footer__inner{grid-template-columns:1fr 1fr;gap:32px}}
@media (max-width:520px){.site-footer__inner{grid-template-columns:1fr;padding-top:44px}}

/*
 * Fixes for the older long-form pages, kept here because chrome.css is the one
 * stylesheet every page loads last. Wide comparison tables scroll inside their
 * own container on small screens instead of widening the page, and a few
 * colour pairs from article.css are lifted to WCAG AA contrast.
 */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:24px 0}
.table-scroll>table{margin:0;min-width:100%}
.table-scroll:focus-visible{outline:3px solid #3B82F6;outline-offset:2px}
.answer p.answer-label,.body .quote cite,.score-band h3{color:#60A5FA}
.answer .warning p{color:#404040}
.warning strong{color:#B23A00}
.cta-section h2,.cta-section p,.cta-section .cta-note,.cta-offer,.cta-offer p,.cta-offer strong{color:#fff}
.back-link a{color:#404040;display:inline-block;padding:10px 0}
.ctable caption,.checklist-sub,.take-sub,.fineprint,.fineprint strong,.send label .opt,.updated{color:#595959}
.related li a{display:inline-block;padding:6px 0}