/* Clean Blue for secondary pages; homepage styles remain independent. */
:root { color-scheme: light; --paper: #fff; --paper-bright: #fff; --ink: #152338; --muted: #59697e; --line: #e2e9f2; --blue: #1760de; --blue-pale: #f3f7ff; --soft: #f3f7ff; --sans: "Segoe UI", Arial, sans-serif; --serif: var(--sans); --mono: var(--sans); --max: 1152px; --rule: 1px solid var(--line); }
html { scroll-padding-top: 28px; }
body { font: 16px/1.65 var(--sans); overflow-x: visible; }
[hidden] { display: none !important; }
.wrap, .site-header > .wrap { width: min(1400px, calc(100% - 80px)); }
a:hover { color: var(--blue); }
:focus-visible, .auth-field input:focus { outline: 3px solid var(--blue); outline-offset: 4px; }
h1, h2, h3 { font-family: var(--sans); font-weight: 600; line-height: 1.2; letter-spacing: -.8px; }
.skip { border-radius: 10px; }
.site-header { position: static; background: #fff; border-bottom: 1px solid #f0f3f8; }
.site-header > .nav-shell { min-height: 96px; justify-content: space-between; gap: 24px; }
.brand { gap: 11px; font-size: 18px; font-weight: 650; letter-spacing: -.6px; }
.brand img { border-radius: 10px; }
.nav { gap: 31px; }
.nav > a { font: 500 14px/1.65 var(--sans); letter-spacing: 0; text-transform: none; padding-block: 12px; }
.nav a:hover, .site-footer nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.nav > a:not(.nav-cta):not(.btn), .nav > a:not(.nav-cta):not(.btn):hover { border: 0; }
.nav .nav-cta { background: var(--soft); color: var(--blue); border: 0; border-radius: 10px; padding: 11px 17px; box-shadow: none; }
.nav-cta span { margin-left: 13px; }
.nav-toggle { display: none; border: 1px solid var(--line); border-radius: 9px; background: #fff; width: 44px; height: 44px; }
.nav-toggle span { width: 18px; height: 2px; margin: 0; }
[aria-current="page"] { color: var(--blue); }
.page-hero { background: #f7f9fd; color: var(--ink); border-bottom: 0; padding-block: 62px; }
.page-hero .wrap::before, .eyebrow::before { content: none; }
.eyebrow, .eyebrow--dark { color: var(--blue); font-size: 12px; font-weight: 650; letter-spacing: 1.5px; }
.page-hero h1 { margin-top: 14px; max-width: 900px; font-size: clamp(36px, 5vw, 60px); line-height: 1.12; letter-spacing: -1.8px; }
.page-hero .lede { max-width: 740px; margin-top: 22px; color: var(--muted); font-size: 18px; line-height: 1.7; }
.updated { color: var(--muted); font-size: 12px; }
.section { padding-block: 64px; }
.section--tight { padding-block: 40px; }
.section--flush-top { padding-top: 0; }
.doc-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 56px; max-width: 1120px; margin-inline: auto; }
.toc { top: 28px; background: var(--soft); border: 1px solid var(--line); border-radius: 16px; padding: 8px 18px; }
.toc h4 { font-size: 11px; color: var(--ink); }
.toc a { padding: 10px 0; }
.toc a:hover { color: var(--blue); }
.toc li:last-child { border-bottom: 0; }
.doc > h2 { margin-top: 44px; padding-top: 28px; font-size: clamp(26px, 3vw, 34px); line-height: 1.25; scroll-margin-top: 28px; }
.doc > h2:first-child { padding-top: 0; border-top: 0; }
.doc h3 { font-size: 20px; font-weight: 600; line-height: 1.4; }
.doc p, .doc li { color: var(--muted); }
.doc strong { color: var(--ink); }
.doc a, .tile a { overflow-wrap: anywhere; }
.tile, .card { border: 1px solid var(--line); border-radius: 20px; padding: 28px; }
.tile .ico, .card .ico { color: var(--blue); background: #eaf1ff; border-radius: 12px; margin-bottom: 20px; }
.tile h3, .card h3 { font-size: 21px; font-weight: 600; }
.callout { border: 1px solid #dce8fc; border-left: 4px solid var(--blue); border-radius: 12px; padding: 20px 24px; }
.callout p { margin: 0; }
.tbl-scroll { border: 1px solid var(--line); border-radius: 12px; }
.tbl th { background: var(--soft); color: var(--ink); font-size: 13px; text-transform: none; letter-spacing: 0; }
.tbl th, .tbl td { border-color: var(--line); }
.button, .btn { border: 1px solid transparent; border-radius: 11px; font: 600 14px/1.65 var(--sans); letter-spacing: 0; text-transform: none; min-height: 48px; box-shadow: none; transition: background .15s; }
.button:hover, .btn:hover { transform: none; box-shadow: none; }
.button--blue, .button--ink, .btn--emerald { background: var(--blue); color: #fff; }
.button--blue:hover, .button--ink:hover, .btn--emerald:hover { background: #104bb3; color: #fff; }
.button--paper, .btn--ghost, .btn--ghost-dark { background: var(--soft); color: var(--blue); border-color: #dce8fc; }
.button--paper:hover, .btn--ghost:hover, .btn--ghost-dark:hover { background: #e5efff; }
.doc a.button, .doc a.btn { border-bottom: 1px solid transparent; }
.account-delete-panel { border: 1px solid var(--line); border-radius: 20px; box-shadow: none; }
.auth-form { max-width: 100%; }
.auth-field span { font-weight: 600; }
.auth-field input { border: 1px solid #b8c6d9; border-radius: 10px; min-height: 48px; font-size: 16px; }
.form-status { border-left-width: 4px; border-radius: 10px; font-weight: 500; overflow-wrap: anywhere; }
.form-status--error { background: #fff0ee; border-left-color: #c93b2c; }
.secondary-email-confirmed main, .secondary-reset-password main { background: #f7f9fd; padding-block: 60px; }
.secondary-email-confirmed .page-hero, .secondary-reset-password .page-hero { width: min(680px, calc(100% - 40px)); margin: auto; border: 1px solid var(--line); background: #fff; border-radius: 24px; padding: 40px; }
.secondary-email-confirmed .page-hero .wrap, .secondary-reset-password .page-hero .wrap { width: 100%; }
.secondary-email-confirmed .page-hero h1, .secondary-reset-password .page-hero h1 { font-size: clamp(32px, 4vw, 44px); }
.site-footer { background: #fff; color: var(--ink); border-top: 1px solid var(--line); padding: 41px 0 26px; }
.site-footer > .wrap { padding: 0; }
.footer-main { width: 100%; display: flex; justify-content: space-between; align-items: start; padding: 0; gap: 35px; }
.footer-main > div > p { color: var(--muted); font-size: 13px; margin-top: 12px; }
.site-footer .brand { color: var(--ink); font-size: 16px; }
.footer-main nav { display: flex; justify-content: end; flex-wrap: wrap; gap: 12px 24px; max-width: 490px; }
.footer-main nav a { padding-block: 7px; color: var(--muted); font: 400 12px/1.65 var(--sans); text-transform: none; border: 0; }
.footer-main nav a[aria-current="page"] { color: var(--blue); }
.footer-bottom { border-top: 1px solid var(--line); margin-top: 31px; padding-top: 23px; display: flex; justify-content: space-between; gap: 20px; font-size: 11px; color: var(--muted); }
.not-found { min-height: 520px; width: min(1400px, calc(100% - 80px)); margin: auto; gap: 50px; border: 0; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); padding-block: 65px; }
.not-found__number { color: #dce8fc; font-size: clamp(120px, 22vw, 280px); letter-spacing: -.09em; transform: none; }
.not-found__cue { display: none; }
.not-found__copy { padding: 0; }
.not-found__copy h1 { font-size: clamp(36px, 4.5vw, 56px); line-height: 1.15; }
.overline { color: var(--blue); }
.overline span { border-color: var(--line); border-radius: 8px; }
@media (max-width: 1000px) {
  .wrap, .site-header > .wrap, .not-found { width: calc(100% - 56px); }
  .nav { gap: 22px; }
  .nav > a { font-size: 13px; }
  .brand { font-size: 16px; }
  .doc-layout { gap: 32px; grid-template-columns: 190px minmax(0, 1fr); }
  .toc { display: block; }
}
@media (min-width: 901px) {
  .nav { position: static; display: flex; flex-direction: row; align-items: center; padding: 0; border: 0; background: #fff; margin-left: auto; }
  .nav > a { display: block; min-height: 0; }
  .nav .nav-cta { margin-top: 0; }
}
@media (max-width: 900px) {
  .wrap, .site-header > .wrap, .not-found { width: calc(100% - 40px); }
  .site-header > .nav-shell { min-height: 80px; flex-wrap: wrap; gap: 0; padding-block: 18px; }
  .nav-toggle { display: grid; align-content: center; justify-content: center; gap: 5px; }
  .nav { position: static; display: none; width: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 14px 0 0; border: 0; background: #fff; }
  .nav.open { display: flex; }
  .nav > a { padding: 12px; border: 0; }
  .nav .nav-cta { margin-top: 6px; }
  .brand span { max-width: none; white-space: nowrap; line-height: inherit; }
  .page-hero { padding-block: 42px; }
  .page-hero .lede { font-size: 17px; }
  .section { padding-block: 44px; }
  .section--flush-top { padding-top: 0; }
  .doc-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .toc { position: static; }
  .grid--3, .grid--2 { grid-template-columns: minmax(0, 1fr); }
  .tile { padding: 24px; }
  .secondary-email-confirmed main, .secondary-reset-password main { padding-block: 35px; }
  .secondary-email-confirmed .page-hero, .secondary-reset-password .page-hero { padding: 26px; }
  .footer-main { flex-direction: column; gap: 24px; }
  .footer-main nav { justify-content: start; }
  .footer-bottom { flex-wrap: wrap; gap: 8px; }
  .not-found { grid-template-columns: minmax(0, 1fr); gap: 28px; min-height: 0; }
  .not-found__number { position: static; font-size: 130px; opacity: 1; }
  .not-found__copy { padding: 0; }
}
@media (max-width: 430px) {
  .brand { font-size: 15px; gap: 8px; }
  .brand img { width: 32px; height: 32px; }
  .page-hero h1 { font-size: 36px; letter-spacing: -1px; }
  .callout { padding: 18px; }
  .account-delete-panel { padding: 20px; }
}

@media (min-width: 1600px) {
    html { font-size: clamp(16px, .9vw, 26px); }
    .wrap, .site-header > .wrap, .not-found { width: 80%; }
  /* Long documents and account forms retain their readable widths. */
  .secondary-email-confirmed .page-hero .wrap,
  .secondary-reset-password .page-hero .wrap { width: 100%; }
}

/* Reading pages use a slightly larger measure; account states stay compact. */
@media (min-width: 901px) {
  body.secondary-support,
  body.secondary-privacy,
  body.secondary-terms { font-size: 18px; }
  body.secondary-delete-account,
  body.secondary-email-confirmed,
  body.secondary-reset-password,
  body.secondary-404 { font-size: 17px; }
}