/* ---------- Header ---------- */
.hdr { position: relative; z-index: 30; flex: none; height: var(--hdr-h); padding: 0 var(--fr, max(var(--gutter), calc((100% - var(--col)) / 2))) 0 var(--fl, max(var(--gutter), calc((100% - var(--col)) / 2))); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hdr-left { display: flex; align-items: center; gap: 48px; }
.logo { display: flex; width: 30px; height: 30px; color: var(--ink); transition: color .15s ease; }
.logo:hover { color: var(--accent); }
.logo svg { display: block; width: 100%; height: 100%; }
.nav { display: flex; align-items: center; gap: 32px; }
.nav a, .nav button { display: inline-flex; align-items: center; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; font: inherit; font-size: 15px; color: var(--ink); text-decoration: none; transition: color .15s ease; }
.nav a:hover, .nav button:hover { color: var(--accent); }
.nav a, .nav button { white-space: nowrap; }
/* Seven menu items: tighter spacing on smaller desktop screens so they stay on one line. */
@media (min-width: 1021px) and (max-width: 1240px) { .hdr-left { gap: 32px; } .nav { gap: 20px; } .nav a, .nav button { font-size: 14px; } }
@media (min-width: 1021px) and (max-width: 1100px) { .hdr-left { gap: 24px; } .nav { gap: 16px; } }
.nav [aria-current="page"], .nav button[aria-expanded="true"] { box-shadow: inset 0 -1px 0 currentColor; }
.hdr-actions { display: flex; align-items: center; gap: 12px; }

.btn-outline, .icon-btn { display: inline-flex; align-items: center; justify-content: center; height: 44px; border: 1px solid var(--rule); border-radius: 2px; background: transparent; color: var(--ink); text-decoration: none; cursor: pointer; font: inherit; font-size: 15px; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.btn-outline { padding: 0 18px; }
.icon-btn { width: 44px; padding: 0; }
.btn-outline:hover, .icon-btn:hover { background: var(--hover-tint); border-color: var(--rule-strong); }
.btn-outline[aria-current="page"], .icon-btn.is-close { background: var(--ink); border-color: var(--ink); color: var(--bg); }

.btn-solid, .btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border-radius: 2px; font: inherit; font-size: 16px; text-decoration: none; cursor: pointer; transition: background-color .15s ease, border-color .15s ease; }
.btn-solid { padding: 0 28px; border: 0; background: var(--ink); color: var(--bg); font-weight: 500; }
.btn-solid:hover { background: var(--solid-hover); }
.btn-solid:disabled { background: var(--off); color: var(--off-ink); cursor: not-allowed; }
.btn-ghost { padding: 0 24px; border: 1px solid var(--rule); background: transparent; color: var(--ink); }
.btn-ghost:hover { background: var(--hover-tint); border-color: var(--rule-strong); }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 40px; }

/* Theme menu */
.theme { position: relative; }
.theme .ti { display: none; }
html[data-theme="light"] .ti-light, html[data-theme="dark"] .ti-dark, html[data-theme="auto"] .ti-auto { display: block; }
.theme-menu { position: absolute; right: 0; top: 52px; z-index: 50; width: 220px; padding: 6px; background: var(--bg); border: 1px solid var(--rule); box-shadow: 0 16px 32px rgba(0, 0, 0, 0.14); }
.theme-menu[hidden] { display: none; }
.theme-menu p { margin: 6px 10px; font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: .2em; color: var(--muted); }
.theme-menu button { display: flex; align-items: center; gap: 12px; width: 100%; height: 44px; padding: 0 10px; border: 0; background: transparent; cursor: pointer; font: inherit; font-size: 15px; text-align: left; color: var(--ink); }
.theme-menu button:hover { background: var(--hover-tint); }
.theme-menu button[aria-checked="true"] { background: var(--hover-tint); }
.theme-menu .check { margin-left: auto; color: var(--accent); visibility: hidden; }
.theme-menu button[aria-checked="true"] .check { visibility: visible; }

/* Hamburger */
.burger { display: none; flex-direction: column; gap: 5px; }
.burger span { display: block; width: 18px; height: 2px; background: currentColor; transition: transform .2s ease, opacity .15s ease; }
.burger[aria-expanded="true"] { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Company / Legal panels */
/* Same position, width and spacing as the page body (the Search page panel). */
.mega { position: absolute; top: calc(var(--hdr-h) + var(--top-h, 0px)); left: var(--pl, calc((100% - 840px) / 2)); width: var(--pw, 840px); z-index: 25; padding: 60px; background: var(--panel); box-shadow: 0 24px 40px rgba(0, 0, 0, 0.12); }
.mega[hidden], .mega-scrim[hidden], .mmenu[hidden] { display: none; }
.mega ul { list-style: none; margin: 0; padding: 0; }
.mega a { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 59px; font-size: 22px; font-weight: 500; letter-spacing: -.01em; text-decoration: none; color: var(--ink); transition: color .15s ease; }
.mega a:hover { color: var(--accent); }
.chev { flex: none; color: var(--muted); transition: color .15s ease, transform .15s ease; }
a:hover > .chev, button:hover > .chev { color: var(--accent); transform: translateX(3px); }
.mega-scrim { position: fixed; inset: 0; z-index: 20; background: var(--scrim); }
.arrow { font-size: .65em; color: var(--muted); }

/* Phone menu */
.mmenu { position: fixed; left: 0; right: 0; top: var(--hdr-h); bottom: 0; z-index: 25; overflow-y: auto; display: flex; flex-direction: column; padding: 16px var(--fr, 24px) 0 var(--fl, 24px); background: var(--bg); border-top: 1px solid var(--rule); }
.mm-list { padding: 12px 0 24px; }
.mmenu .eyebrow { margin: 0 0 8px; }
.mm-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; height: 60px; margin: 0; padding: 0; border: 0; background: none; font: inherit; font-size: 26px; font-weight: 500; letter-spacing: -.02em; text-align: left; text-decoration: none; color: var(--ink); cursor: pointer; }
.mm-row:hover, .mm-row[aria-expanded="true"] { color: var(--accent); }
.mm-row .chev { transition: transform .25s ease, color .15s ease; }
.mm-row[aria-expanded="true"] .chev { color: var(--accent); }
/* One rule for every arrow: rows that open in place point down, and up while open (to close).
   Links to another page keep the right-pointing arrow. */
button.mm-row .chev, button.mm-row:hover > .chev { transform: rotate(90deg); }
button.mm-row[aria-expanded="true"] .chev { transform: rotate(-90deg); }
/* Top menu drop-downs: a small arrow that turns down while the panel is open */
.nav .nav-chev { margin-left: 5px; color: var(--muted); transform: rotate(90deg); transition: transform .2s ease, color .15s ease; }   /* points down */
.nav button:hover .nav-chev { color: currentColor; }
.nav button[aria-expanded="true"] .nav-chev { color: currentColor; transform: rotate(-90deg); }   /* open: points up, to close */
/* Company → Legal inside the panel: opens under itself, arrow down while open */
.mega .mega-sub { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; height: 59px; padding: 0; border: 0; background: none; font: inherit; font-size: 22px; font-weight: 500; letter-spacing: -.01em; color: var(--ink); text-align: left; cursor: pointer; transition: color .15s ease; }
.mega .mega-sub:hover, .mega .mega-sub[aria-expanded="true"] { color: var(--accent); }
.mega .mega-sub .chev { transition: transform .2s ease, color .15s ease; }
.mega .mega-sub .chev, .mega .mega-sub:hover .chev { transform: rotate(90deg); }
.mega .mega-sub[aria-expanded="true"] .chev { color: var(--accent); transform: rotate(-90deg); }
.mega .mega-group > ul[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .nav .nav-chev, .mega .mega-sub .chev { transition: none; } }
/* Company / Legal links slide open under their row and push the rows below down. */
.mm-sub { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .25s ease; }
.mm-sub.is-open { grid-template-rows: 1fr; }
.mm-sub > div { overflow: hidden; display: flex; flex-direction: column; }
.mm-sub a { display: flex; align-items: center; height: 44px; padding-left: 16px; font-size: 18px; text-decoration: none; color: var(--muted); }
.mm-sub a:last-child { margin-bottom: 8px; }
.mm-sub a:hover { color: var(--accent); }
/* Company → Legal: a small label with Terms and Privacy indented under it */
.mm-sub .mm-group { display: flex; align-items: center; height: 36px; padding-left: 16px; font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.mm-sub a.mm-indent { padding-left: 32px; }
.mega .mega-group > ul { margin: 0 0 8px; padding: 0 0 0 24px; border-left: 1px solid var(--rule); }
.mega .mega-group > ul a { height: 48px; font-size: 18px; color: var(--muted); }
.mega .mega-group > ul a:hover { color: var(--accent); }
@media (prefers-reduced-motion: reduce) { .mm-sub, .mm-row .chev { transition: none; } }
.mmenu .ftr-mini { flex: 1; margin: 24px calc(-1 * var(--fr, 24px)) 0 calc(-1 * var(--fl, 24px)); padding: 16px var(--fr, 24px) 24px var(--fl, 24px); border-top: 1px solid var(--rule); background-color: var(--footer-bg); }
.mmenu .ftr-mini { background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px); background-size: var(--u) var(--u); background-position: var(--gx, 0px) var(--gy, 0px); background-attachment: fixed; }