/* Aurum component stylesheet. Loads after tokens.css. Prefix: au-. Radius is always 0. */

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font-sans); font-size: 16px; line-height: 24px; color: var(--ink); background: var(--paper); font-kerning: normal; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; border-radius: var(--radius-none); }
a { color: var(--link); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: var(--border-rule) solid var(--focus); outline-offset: 2px; }
[hidden] { display: none !important; }
.au-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; }
.au-num { font-variant-numeric: tabular-nums; }

/* ---------- Icons (CSS masks, colour = currentColor) ---------- */
:root {
  --au-i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='square'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E");
  --au-i-cross: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='square'%3E%3Cpath d='M6.5 6.5l11 11M17.5 6.5l-11 11'/%3E%3C/svg%3E");
  --au-i-dash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='square'%3E%3Cpath d='M7 12h10'/%3E%3C/svg%3E");
  --au-i-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M6.5 9.5l5.5 5.5 5.5-5.5'/%3E%3C/svg%3E");
  --au-i-chevron-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M9.5 6.5l5.5 5.5-5.5 5.5'/%3E%3C/svg%3E");
  --au-i-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M4 12h15M13.5 6.5L19 12l-5.5 5.5'/%3E%3C/svg%3E");
  --au-i-external: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M13 4h7v7M20 4l-9 9M18 14v6H4V6h6'/%3E%3C/svg%3E");
  --au-i-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M4 4h16v16H4z'/%3E%3Cpath d='M12 11v6M12 7.5v.5'/%3E%3C/svg%3E");
  --au-i-warning: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 3.5L21.5 20h-19z'/%3E%3Cpath d='M12 10v4.5M12 17v.5'/%3E%3C/svg%3E");
  --au-i-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='M15 15l5 5'/%3E%3C/svg%3E");
  --au-i-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E");
  --au-i-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  --au-i-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
  --au-i-sort: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M8 9.5l4-4 4 4M8 14.5l4 4 4-4'/%3E%3C/svg%3E");
  --au-i-sort-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M12 5v13M7 13.5l5 5 5-5'/%3E%3C/svg%3E");
  --au-i-sort-up: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M12 19V6M7 10.5l5-5 5 5'/%3E%3C/svg%3E");
  --au-i-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M9 9h11v11H9z'/%3E%3Cpath d='M15 9V4H4v11h5'/%3E%3C/svg%3E");
  --au-i-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M3 6h18v12H3z'/%3E%3Cpath d='M3 6l9 7 9-7'/%3E%3C/svg%3E");
  --au-i-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M7 3h10v18H7z'/%3E%3Cpath d='M11 17.5h2'/%3E%3C/svg%3E");
  --au-i-building: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M4 20h16M6 20V9h12v11M3 9l9-5 9 5M9 12v5M12 12v5M15 12v5'/%3E%3C/svg%3E");
  --au-i-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M4 6h16v14H4zM4 10h16M8 3v4M16 3v4'/%3E%3C/svg%3E");
  --au-i-calculator: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M5 3h14v18H5zM8 7h8v3H8z'/%3E%3Cpath d='M8.5 14h.5M12 14h.5M15.5 14h.5M8.5 17.5h.5M12 17.5h.5M15.5 17.5h.5'/%3E%3C/svg%3E");
  --au-i-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.5 7.5-8 9-4.5-1.5-8-4.5-8-9V6z'/%3E%3Cpath d='M8.5 12l2.5 2.5 4.5-5'/%3E%3C/svg%3E");
  --au-i-document: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M6 3h8l4 4v14H6z'/%3E%3Cpath d='M14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E");
  --au-i-person: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Ccircle cx='12' cy='8.5' r='4'/%3E%3Cpath d='M4 21v-2c0-3 3-5 8-5s8 2 8 5v2'/%3E%3C/svg%3E");
  --au-i-chevron-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M14.5 6.5L9 12l5.5 5.5'/%3E%3C/svg%3E");
  --au-i-zoom-in: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='M15 15l5 5M8 10.5h5M10.5 8v5'/%3E%3C/svg%3E");
  --au-i-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 5h16v14H4z'/%3E%3Cpath d='M4 16l5-5 4 4 2-2 5 5'/%3E%3Cpath d='M15.5 8.5h.5'/%3E%3C/svg%3E");
}
.au-ico { display: inline-block; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--au-i) center / contain no-repeat; mask: var(--au-i) center / contain no-repeat; vertical-align: middle; }
.au-ico--sm { width: 16px; height: 16px; }
.au-ico--lg { width: 24px; height: 24px; }
.au-ico--check { --au-i: var(--au-i-check); }
.au-ico--cross { --au-i: var(--au-i-cross); }
.au-ico--dash { --au-i: var(--au-i-dash); }
.au-ico--chevron-down { --au-i: var(--au-i-chevron-down); }
.au-ico--chevron-right { --au-i: var(--au-i-chevron-right); }
.au-ico--arrow-right { --au-i: var(--au-i-arrow-right); }
.au-ico--external { --au-i: var(--au-i-external); }
.au-ico--info { --au-i: var(--au-i-info); }
.au-ico--warning { --au-i: var(--au-i-warning); }
.au-ico--search { --au-i: var(--au-i-search); }
.au-ico--menu { --au-i: var(--au-i-menu); }
.au-ico--close { --au-i: var(--au-i-cross); }
.au-ico--plus { --au-i: var(--au-i-plus); }
.au-ico--minus { --au-i: var(--au-i-minus); }
.au-ico--sort { --au-i: var(--au-i-sort); }
.au-ico--sort-down { --au-i: var(--au-i-sort-down); }
.au-ico--sort-up { --au-i: var(--au-i-sort-up); }
.au-ico--copy { --au-i: var(--au-i-copy); }
.au-ico--mail { --au-i: var(--au-i-mail); }
.au-ico--phone { --au-i: var(--au-i-phone); }
.au-ico--building { --au-i: var(--au-i-building); }
.au-ico--calendar { --au-i: var(--au-i-calendar); }
.au-ico--calculator { --au-i: var(--au-i-calculator); }
.au-ico--shield { --au-i: var(--au-i-shield); }
.au-ico--document { --au-i: var(--au-i-document); }
.au-ico--person { --au-i: var(--au-i-person); }
.au-ico--chevron-left { --au-i: var(--au-i-chevron-left); }
.au-ico--zoom-in { --au-i: var(--au-i-zoom-in); }
.au-ico--image { --au-i: var(--au-i-image); }

/* ---------- Layout ---------- */
.au-container { width: 100%; max-width: var(--container-max); margin: 0 auto; padding: 0 var(--container-pad-sm); }
@media (min-width: 1024px) { .au-container { padding: 0 var(--container-pad); } }
.au-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--gutter-sm); }
@media (min-width: 768px) { .au-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: var(--gutter); } }
@media (min-width: 1024px) { .au-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); } }

/* Guide layout: TOC rail (3 cols) + main (9 cols). Prose spans 7 of the 9, breakouts span all 9. */
.au-guide { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--gutter); }
.au-guide__toc { display: none; }
.au-guide__main > * { max-width: var(--measure); }
.au-guide__main > .au-wide { max-width: none; }
@media (min-width: 1024px) {
  .au-guide { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .au-guide__toc { display: block; grid-column: 1 / span 3; }
  .au-guide__main { grid-column: 4 / span 9; }
  .au-guide__main > * { max-width: min(var(--measure), calc((100% - 8 * var(--gutter)) * 7 / 9 + 6 * var(--gutter))); }
  .au-guide__main > .au-wide { max-width: none; }
}
/* Tool layout (calculator sites): main (8 cols) + rail (4 cols) with one sticky element. */
.au-tool { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--gutter); }
.au-tool__rail { display: none; }
@media (min-width: 1024px) {
  .au-tool { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .au-tool__main { grid-column: 1 / span 8; }
  .au-tool__rail { display: block; grid-column: 9 / span 4; }
  .au-tool__main > .au-prose-col { max-width: var(--measure); }
}
/* Split layout (product pages): main (8 cols) + sticky summary rail (4 cols). */
.au-split { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--gutter); row-gap: var(--space-6); }
@media (min-width: 1024px) { .au-split { grid-template-columns: repeat(12, minmax(0, 1fr)); } .au-split__main { grid-column: 1 / span 8; } .au-split__rail { grid-column: 9 / span 4; } }
.au-summary { border: var(--border-hairline) solid var(--line); border-top: var(--border-heavy) solid var(--brand); padding: var(--space-5); display: grid; gap: var(--space-4); background: var(--paper); }
.au-summary__name { margin: 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-summary dl { margin: 0; display: grid; gap: 0; }
.au-summary dl > div { display: flex; justify-content: space-between; gap: var(--space-3); padding: 8px 0; border-bottom: var(--border-hairline) solid var(--line); font-size: 15px; }
.au-summary dt { color: var(--ink-muted); }
.au-summary dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.au-summary__stand { margin: 0; font-size: 13px; line-height: 18px; color: var(--ink-subtle); }
.au-section { padding-top: var(--space-5); border-top: var(--border-rule) solid var(--rule); scroll-margin-top: calc(var(--header-h-compact) + 64px); }
.au-section + .au-section { margin-top: var(--space-8); }
.au-section__title { margin: 0 0 var(--space-4); font-size: 30px; line-height: 38px; font-weight: 700; letter-spacing: -0.005em; }
.au-section__intro { margin: 0 0 var(--space-5); font-size: 18px; line-height: 30px; max-width: var(--measure); }
.au-cols-2 { display: grid; grid-template-columns: 1fr; gap: var(--space-6); }
@media (min-width: 768px) { .au-cols-2 { grid-template-columns: 1fr 1fr; } }
.au-sticky { position: sticky; top: calc(var(--header-h-compact) + var(--space-5)); z-index: var(--z-sticky); }
.au-band { padding: var(--space-8) 0; }
.au-band--sunken { background: var(--surface-sunken); }
.au-stack > * + * { margin-top: var(--space-5); }

/* ---------- Prose ---------- */
.au-prose { font-size: 18px; line-height: 30px; }
.au-prose > * { margin: 0; }
.au-prose > * + * { margin-top: var(--space-5); }
.au-prose h2 { font-size: 30px; line-height: 38px; font-weight: 700; letter-spacing: -0.005em; padding-top: var(--space-5); border-top: var(--border-rule) solid var(--rule); margin-top: var(--space-8); scroll-margin-top: calc(var(--header-h-compact) + var(--space-5)); }
.au-prose h3 { font-size: 23px; line-height: 30px; font-weight: 600; margin-top: var(--space-6); scroll-margin-top: calc(var(--header-h-compact) + var(--space-5)); }
.au-prose h2 + *, .au-prose h3 + * { margin-top: var(--space-3); }
.au-prose ul:not([class]), .au-prose ol:not([class]) { padding-left: 0; }
.au-prose li + li { margin-top: var(--space-2); }
.au-prose ul:not([class]) > li { list-style: none; position: relative; padding-left: 26px; }
.au-prose ul:not([class]) > li::before { content: ""; position: absolute; left: 4px; top: 12px; width: 7px; height: 7px; background: var(--ink); }
.au-prose ol:not([class]) { counter-reset: au-ol; }
.au-prose ol:not([class]) > li { list-style: none; position: relative; padding-left: 34px; counter-increment: au-ol; }
.au-prose ol:not([class]) > li::before { content: counter(au-ol) "."; position: absolute; left: 0; top: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.au-prose strong { font-weight: 600; }
.au-prose figure img { width: 100%; }
.au-prose figcaption, .au-caption { font-size: 14px; line-height: 20px; color: var(--ink-muted); margin-top: var(--space-2); }
.au-ref { font-size: 13px; line-height: 0; vertical-align: super; font-variant-numeric: tabular-nums; }
.au-ref a { text-decoration: none; padding: 0 1px; }
@media (max-width: 767px) {
  .au-prose { font-size: 17px; line-height: 28px; }
  .au-prose h2 { font-size: 26px; line-height: 32px; margin-top: var(--space-7); }
  .au-prose h3 { font-size: 21px; line-height: 28px; }
}

/* ---------- Labels, overlines ---------- */
.au-label { font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); margin: 0; }
.au-label--brand { color: var(--brand); }
.au-marker { display: inline-block; width: 8px; height: 8px; background: var(--accent); margin-right: var(--space-2); vertical-align: 1px; }
.au-link-arrow { display: inline-flex; align-items: center; gap: var(--space-2); font-weight: 600; color: var(--ink); text-decoration: none; }
.au-link-arrow::after { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--au-i-arrow-right) center / contain no-repeat; mask: var(--au-i-arrow-right) center / contain no-repeat; transition: transform 120ms ease-out; }
.au-link-arrow:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-link-arrow:hover::after { transform: translateX(3px); }

/* ---------- Buttons ---------- */
.au-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: 48px; padding: 0 var(--space-5); border: var(--border-hairline) solid transparent; background: transparent; font-size: 16px; line-height: 20px; font-weight: 600; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color 120ms ease-out, border-color 120ms ease-out, color 120ms ease-out; }
.au-btn--primary { background: var(--brand); border-color: var(--brand); color: var(--ink-inverse); }
.au-btn--primary:hover { background: var(--brand-strong); border-color: var(--brand-strong); }
.au-btn--positive { background: var(--positive); border-color: var(--positive); color: var(--ink-inverse); }
.au-btn--positive:hover { background: var(--positive-strong); border-color: var(--positive-strong); }
.au-btn--secondary { background: var(--paper); border-color: var(--line-control); color: var(--ink); }
.au-btn--secondary:hover { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.au-btn--quiet { padding: 0 var(--space-3); color: var(--ink); }
.au-btn--quiet:hover { background: var(--surface-subtle); }
.au-btn--inverse { background: var(--paper); border-color: var(--paper); color: var(--brand); }
.au-btn--inverse:hover { background: var(--surface-sunken); }
.au-btn--sm { min-height: 40px; padding: 0 var(--space-4); font-size: 15px; }
.au-btn--lg { min-height: 56px; padding: 0 var(--space-6); font-size: 17px; }
.au-btn--block { display: flex; width: 100%; }
.au-btn[disabled], .au-btn[aria-disabled="true"] { background: var(--surface-sunken); border-color: var(--line); color: var(--ink-subtle); cursor: not-allowed; }
.au-btn .au-ast { margin-left: -6px; font-weight: 600; }
/* Affiliate CTA: button + the destination line under it */
.au-cta { display: flex; flex-direction: column; gap: var(--space-1); }
.au-cta__note { margin: 0; font-size: 13px; line-height: 16px; color: var(--ink-muted); text-align: center; }

/* ---------- Badges ---------- */
.au-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; border: var(--border-hairline) solid var(--line-control); color: var(--ink); background: var(--paper); white-space: nowrap; }
.au-badge--brand { background: var(--brand); border-color: var(--brand); color: var(--ink-inverse); }
.au-badge--positive { background: var(--positive-tint); border-color: var(--positive-tint); color: var(--positive); }
.au-badge--notice { background: var(--notice-tint); border-color: var(--notice-tint); color: var(--notice); }
.au-badge--ad { border-color: var(--line); color: var(--ink-muted); letter-spacing: 0.06em; }
.au-badge--quiet { border-color: transparent; background: var(--surface-sunken); color: var(--ink-muted); }

/* ---------- Form controls ---------- */
.au-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.au-field__label { font-size: 15px; line-height: 20px; font-weight: 600; color: var(--ink); }
.au-field__help { font-size: 14px; line-height: 20px; color: var(--ink-muted); margin: 0; }
.au-field__error { font-size: 14px; line-height: 20px; color: var(--negative); margin: 0; display: flex; gap: 6px; align-items: center; }
.au-input, .au-select { height: 48px; width: 100%; padding: 0 var(--space-3); border: var(--border-hairline) solid var(--line-control); background: var(--paper); font-size: 16px; line-height: 24px; color: var(--ink); -webkit-appearance: none; appearance: none; }
.au-input::placeholder { color: var(--ink-subtle); }
.au-input:hover, .au-select:hover { border-color: var(--ink); }
.au-input:focus-visible, .au-select:focus-visible { outline: var(--border-rule) solid var(--focus); outline-offset: 0; border-color: var(--focus); }
.au-input[aria-invalid="true"] { border-color: var(--negative); background: var(--negative-tint); }
.au-input--num { text-align: right; font-variant-numeric: tabular-nums; }
.au-select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121619' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M6.5 9.5l5.5 5.5 5.5-5.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 18px; cursor: pointer; }
.au-affix { display: flex; align-items: stretch; }
.au-affix .au-input { flex: 1; min-width: 0; }
.au-affix__unit { display: flex; align-items: center; padding: 0 var(--space-3); border: var(--border-hairline) solid var(--line-control); border-left: 0; background: var(--surface-sunken); color: var(--ink-muted); font-size: 15px; white-space: nowrap; }
.au-affix--pre .au-affix__unit { border-left: var(--border-hairline) solid var(--line-control); border-right: 0; }
.au-check, .au-radio { display: inline-flex; align-items: flex-start; gap: 10px; font-size: 16px; line-height: 24px; cursor: pointer; }
.au-check input, .au-radio input { -webkit-appearance: none; appearance: none; flex: none; width: 20px; height: 20px; margin: 2px 0 0; border: var(--border-hairline) solid var(--line-control); background: var(--paper) center / 16px no-repeat; cursor: pointer; }
.au-check input:hover, .au-radio input:hover { border-color: var(--ink); }
.au-check input:checked { background-color: var(--brand); border-color: var(--brand); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='square'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E"); }
.au-radio input:checked { border-color: var(--brand); box-shadow: inset 0 0 0 4px var(--paper); background-color: var(--brand); }
.au-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.au-fieldset > legend { padding: 0; margin-bottom: var(--space-2); font-size: 15px; line-height: 20px; font-weight: 600; }
.au-segmented { display: inline-flex; flex-wrap: wrap; }
.au-segmented > button { min-height: 44px; padding: 0 var(--space-4); border: var(--border-hairline) solid var(--line-control); background: var(--paper); font-size: 15px; font-weight: 600; color: var(--ink); cursor: pointer; margin-left: -1px; }
.au-segmented > button:first-child { margin-left: 0; }
.au-segmented > button:hover { background: var(--surface-subtle); }
.au-segmented > button[aria-pressed="true"], .au-segmented > button[aria-selected="true"] { background: var(--brand); border-color: var(--brand); color: var(--ink-inverse); position: relative; z-index: 1; }
.au-range { -webkit-appearance: none; appearance: none; width: 100%; height: 24px; background: transparent; }
.au-range::-webkit-slider-runnable-track { height: 4px; background: var(--line); }
.au-range::-moz-range-track { height: 4px; background: var(--line); }
.au-range::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; margin-top: -8px; background: var(--brand); border: 2px solid var(--paper); box-shadow: 0 0 0 1px var(--brand); cursor: pointer; }
.au-range::-moz-range-thumb { width: 18px; height: 18px; border-radius: 0; background: var(--brand); border: 2px solid var(--paper); box-shadow: 0 0 0 1px var(--brand); cursor: pointer; }

/* ---------- Chips (filters) ---------- */
.au-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.au-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 var(--space-3); border: var(--border-hairline) solid var(--line-control); background: var(--paper); font-size: 15px; line-height: 20px; font-weight: 500; color: var(--ink); cursor: pointer; }
.au-chip:hover { border-color: var(--ink); }
.au-chip[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: var(--ink-inverse); }
.au-chip__count { color: var(--ink-subtle); font-variant-numeric: tabular-nums; }
.au-chip[aria-pressed="true"] .au-chip__count { color: var(--ink-inverse-muted); }
.au-chip--remove { background: var(--surface-sunken); border-color: var(--surface-sunken); }
.au-chip--remove::after { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--au-i-cross) center / contain no-repeat; mask: var(--au-i-cross) center / contain no-repeat; }

/* ---------- Wordmark ---------- */
.au-wordmark { display: inline-flex; align-items: baseline; font-size: 24px; line-height: 28px; letter-spacing: -0.015em; color: var(--ink); text-decoration: none; white-space: nowrap; }
.au-wordmark__name { font-weight: 700; }
.au-wordmark__dot { font-weight: 700; color: var(--accent); }
.au-wordmark__tld { font-weight: 400; }
.au-wordmark--inverse { color: var(--ink-inverse); }
.au-wordmark--inverse .au-wordmark__dot { color: var(--ink-inverse-muted); }
.au-wordmark--lg { font-size: 40px; line-height: 44px; }
.au-wordmark--sm { font-size: 20px; line-height: 24px; }

/* ---------- Header ---------- */
.au-header { position: relative; background: var(--paper); z-index: var(--z-header); }
.au-header--sticky { position: sticky; top: 0; }
.au-utility { height: var(--utility-h); border-bottom: var(--border-hairline) solid var(--line); font-size: 13px; line-height: 16px; color: var(--ink-muted); }
.au-utility__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); }
.au-utility a { color: var(--ink-muted); text-decoration: none; }
.au-utility a:hover { color: var(--ink); text-decoration: underline; }
.au-utility__links { display: flex; gap: var(--space-5); list-style: none; margin: 0; padding: 0; }
.au-header__bar { border-bottom: var(--border-hairline) solid var(--line); }
.au-header__inner { height: var(--header-h); display: flex; align-items: center; gap: var(--space-6); }
.au-header.is-compact .au-header__inner { height: var(--header-h-compact); }
.au-header.is-compact .au-header__bar { box-shadow: var(--shadow-sticky); }
.au-nav { flex: 1; min-width: 0; align-self: stretch; }
.au-nav__list { display: flex; height: 100%; list-style: none; margin: 0; padding: 0; }
.au-nav__item { position: relative; display: inline-flex; align-items: center; gap: 4px; height: 100%; padding: 0 var(--space-3); border: 0; background: none; font-size: 16px; line-height: 20px; font-weight: 600; color: var(--ink); text-decoration: none; cursor: pointer; }
.au-nav__item .au-ico { width: 16px; height: 16px; transition: transform 120ms ease-out; }
.au-nav__item::after { content: ""; position: absolute; left: var(--space-3); right: var(--space-3); bottom: -1px; height: 3px; background: transparent; }
.au-nav__item:hover::after { background: var(--line-strong); }
.au-nav__item[aria-current="page"]::after, .au-nav__item[aria-current="true"]::after, .au-nav__item[aria-expanded="true"]::after { background: var(--accent); }
/* While another menu is open, the current-section mark steps back so only one accent bar shows. */
.au-nav__list:has([aria-expanded="true"]) .au-nav__item[aria-current]:not([aria-expanded="true"])::after { background: var(--line-strong); }
.au-nav__item[aria-expanded="true"] .au-ico { transform: rotate(180deg); }
.au-nav__item:focus-visible { outline-offset: -4px; }
.au-search { position: relative; width: 260px; flex: none; }
.au-search__input { height: 40px; padding-right: 44px; }
.au-search__btn { position: absolute; right: 0; top: 0; width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: none; color: var(--ink); cursor: pointer; }
.au-header__menu { display: none; margin-left: auto; width: 44px; height: 44px; border: var(--border-hairline) solid var(--line-control); background: var(--paper); align-items: center; justify-content: center; cursor: pointer; }
@media (max-width: 1023px) {
  .au-nav, .au-search, .au-utility { display: none; }
  .au-header__menu { display: inline-flex; }
  .au-header__inner { height: 60px; }
}

/* ---------- Megamenu ---------- */
.au-megamenu { position: absolute; left: 0; right: 0; top: 100%; background: var(--paper); border-bottom: var(--border-hairline) solid var(--line); box-shadow: var(--shadow-overlay); z-index: var(--z-overlay); }
.au-megamenu[hidden] { display: none; }
.au-megamenu__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: var(--space-5); padding-top: var(--space-6); padding-bottom: var(--space-6); }
.au-megamenu__intro { grid-column: 1 / span 9; grid-row: 1; display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-6); padding-bottom: var(--space-4); border-bottom: var(--border-hairline) solid var(--line); }
.au-megamenu__intro-title { margin: var(--space-2) 0 0; font-size: 23px; line-height: 30px; font-weight: 700; }
.au-megamenu__intro-text { margin: 4px 0 0; font-size: 15px; line-height: 22px; color: var(--ink-muted); }
.au-megamenu__intro .au-link-arrow { flex: none; }
.au-megamenu__col { grid-column: span 3; grid-row: 2; padding-right: var(--space-4); }
.au-megamenu__col + .au-megamenu__col { border-left: var(--border-hairline) solid var(--line); padding-left: var(--space-5); }
.au-megamenu__head { margin: 0 0 var(--space-3); }
.au-megamenu__list { list-style: none; margin: 0; padding: 0; }
.au-megamenu__list li + li { margin-top: 2px; }
.au-megamenu__list a { display: block; padding: 6px 0; font-size: 16px; line-height: 22px; color: var(--ink); text-decoration: none; }
.au-megamenu__list a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-megamenu__list a.is-strong { font-weight: 600; }
.au-megamenu__list .au-megamenu__all { color: var(--link); font-weight: 600; }
.au-megamenu__feature { grid-column: 10 / span 3; grid-row: 1 / span 2; background: var(--surface-sunken); padding: var(--space-5); align-self: start; }
.au-megamenu__feature-top { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); }
.au-megamenu__feature-name { margin: 0; font-size: 19px; line-height: 26px; font-weight: 600; }
.au-megamenu__feature dl { margin: var(--space-3) 0 var(--space-4); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.au-megamenu__feature dt { font-size: 13px; line-height: 16px; color: var(--ink-muted); }
.au-megamenu__feature dd { margin: 2px 0 0; font-size: 18px; line-height: 24px; font-weight: 600; font-variant-numeric: tabular-nums; }
.au-megamenu__foot { border-top: var(--border-hairline) solid var(--line); background: var(--paper); }
.au-megamenu__foot .au-container { display: flex; gap: var(--space-6); align-items: center; height: 52px; font-size: 15px; }
.au-megamenu__foot a { color: var(--ink); font-weight: 600; text-decoration: none; }
.au-megamenu__foot a:hover { text-decoration: underline; }
.au-megamenu__foot span { color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.au-megamenu__foot .au-megamenu__method { margin-left: auto; font-weight: 400; color: var(--ink-muted); display: inline-flex; gap: 6px; align-items: center; }

/* ---------- Menu family: shared ---------- */
.au-nav__list > li { position: relative; }
.au-nav__cta { display: flex; align-items: center; gap: var(--space-3); margin-left: auto; flex: none; }
.au-iconbtn { width: 40px; height: 40px; display: inline-grid; place-items: center; border: var(--border-hairline) solid transparent; background: none; color: var(--ink); cursor: pointer; }
.au-iconbtn:hover { border-color: var(--line-control); }
.au-menu-scrim { position: absolute; left: 0; right: 0; top: 100%; height: 100vh; background: rgba(18, 22, 25, 0.32); z-index: calc(var(--z-overlay) - 1); pointer-events: none; }
.au-menu-scrim[hidden] { display: none; }
.au-nav__count { margin-left: 6px; font-size: 13px; font-weight: 400; color: var(--ink-subtle); font-variant-numeric: tabular-nums; }

/* ---------- Menu option A: compact dropdown (small sites) ---------- */
.au-dropdown { position: absolute; left: 0; top: calc(100% + 1px); min-width: 280px; max-width: 380px; padding: var(--space-2) 0 var(--space-3); background: var(--paper); border: var(--border-hairline) solid var(--line); border-top: 0; box-shadow: var(--shadow-overlay); z-index: var(--z-overlay); }
.au-dropdown--described, .au-dropdown--wide { min-width: 360px; }
.au-dropdown__list { list-style: none; margin: 0; padding: 0; }
.au-dropdown__list a { display: block; padding: 9px var(--space-5); font-size: 16px; line-height: 22px; color: var(--ink); text-decoration: none; }
.au-dropdown__list a:hover, .au-dropdown__list a:focus-visible { background: var(--surface-subtle); text-decoration: underline; text-underline-offset: 0.2em; }
.au-dropdown__list a[aria-current="page"] { font-weight: 600; box-shadow: inset 4px 0 0 var(--accent); }
.au-dropdown__list small { display: block; margin-top: 2px; font-size: 14px; line-height: 20px; font-weight: 400; color: var(--ink-muted); text-decoration: none; }
.au-dropdown__all { display: inline-flex; align-items: center; gap: 6px; margin: var(--space-2) var(--space-5) 0; padding-top: var(--space-3); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--link); text-decoration: none; }
.au-dropdown__all::after { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--au-i-arrow-right) center / contain no-repeat; mask: var(--au-i-arrow-right) center / contain no-repeat; }
.au-dropdown__rule { height: 0; margin: var(--space-2) var(--space-5) 0; border-top: var(--border-hairline) solid var(--line); }

/* ---------- Menu option B: overview panel (the whole small site in one panel) ---------- */
.au-overview__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: var(--space-5); padding-top: var(--space-6); padding-bottom: var(--space-6); }
.au-overview__search { grid-column: 1 / span 9; display: flex; align-items: center; gap: var(--space-4); }
.au-overview__search .au-search { width: 100%; max-width: 520px; }
.au-overview__col { grid-column: span 3; }
.au-overview__head { margin: 0 0 var(--space-2); padding-top: var(--space-3); border-top: var(--border-rule) solid var(--rule); font-size: 17px; line-height: 24px; font-weight: 700; }
.au-overview__list { list-style: none; margin: 0; padding: 0; }
.au-overview__list a { display: block; padding: 6px 0; font-size: 16px; line-height: 22px; color: var(--ink); text-decoration: none; }
.au-overview__list a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-overview__list small { display: block; margin-top: 1px; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-overview__aside { grid-column: 10 / span 3; grid-row: 1 / span 2; align-self: start; }
.au-overview__foot { grid-column: 1 / span 9; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); padding-top: var(--space-4); border-top: var(--border-hairline) solid var(--line); font-size: 15px; }
.au-overview__foot span { color: var(--ink-muted); }
.au-overview__foot .au-link-arrow { margin-left: auto; }
.au-overview__list .au-overview__all { color: var(--link); font-weight: 600; }
.au-overview__label { flex: none; font-size: 17px; line-height: 24px; font-weight: 700; }
.au-overview--cols-4 .au-overview__col { grid-column: span 3; }
.au-overview--wide .au-overview__search, .au-overview--wide .au-overview__foot { grid-column: 1 / -1; }

/* ---------- Menu option C/E: tiered (section rail + pane), ihre-vorsorge pattern ---------- */
.au-megamenu--tiered { overflow: hidden; }
.au-tiered__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); min-height: 380px; }
.au-tiered__rail { position: relative; grid-column: 1 / span 3; padding: var(--space-6) 0; background: var(--brand); color: var(--ink-inverse); }
.au-tiered__rail::before { content: ""; position: absolute; top: 0; bottom: 0; right: 100%; width: 100vw; background: var(--brand); }
.au-tiered__title { margin: 0 0 var(--space-4); padding-right: var(--space-5); font-size: 23px; line-height: 30px; font-weight: 700; color: var(--ink-inverse); }
.au-tiered__items { list-style: none; margin: 0; padding: 0; }
.au-tiered__item { width: 100%; display: flex; align-items: center; gap: var(--space-2); padding: 11px var(--space-4) 11px 0; border: 0; background: none; color: var(--ink-inverse); font-size: 16px; line-height: 22px; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; }
.au-tiered__item .au-nav__count { color: var(--ink-inverse-muted); margin-left: auto; }
.au-tiered__item::after { content: ""; flex: none; width: 16px; height: 16px; margin-left: var(--space-2); background: var(--ink-inverse-muted); -webkit-mask: var(--au-i-chevron-right) center / contain no-repeat; mask: var(--au-i-chevron-right) center / contain no-repeat; }
.au-tiered__item:not(:has(.au-nav__count))::after { margin-left: auto; }
.au-tiered__item:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-tiered__item[aria-expanded="true"] { position: relative; margin-left: calc(-1 * var(--space-4)); padding-left: var(--space-4); width: calc(100% + var(--space-4) + var(--gutter)); background: var(--paper); color: var(--ink); text-decoration: none; }
.au-tiered__item[aria-expanded="true"] .au-nav__count { color: var(--ink-subtle); }
.au-tiered__item[aria-expanded="true"]::after { background: var(--ink); }
.au-tiered__item:focus-visible { outline-color: var(--focus-inverse); outline-offset: -2px; }
.au-tiered__item[aria-expanded="true"]:focus-visible { outline-color: var(--focus); }
.au-tiered__railfoot { margin-top: var(--space-5); padding-top: var(--space-4); padding-right: var(--space-5); border-top: var(--border-hairline) solid rgba(255, 255, 255, 0.22); font-size: 14px; line-height: 20px; }
.au-tiered__railfoot a { color: var(--ink-inverse); }
.au-tiered__pane { grid-column: 4 / span 9; display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); column-gap: var(--gutter); align-content: start; padding: var(--space-6) 0 var(--space-6) var(--space-6); }
.au-tiered__intro { grid-column: 1 / span 6; padding-bottom: var(--space-4); border-bottom: var(--border-hairline) solid var(--line); }
.au-tiered__intro h3 { margin: 0; font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -0.005em; }
.au-tiered__intro p { margin: var(--space-2) 0 0; font-size: 16px; line-height: 24px; color: var(--ink-muted); max-width: 560px; }
.au-tiered__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); margin-top: var(--space-3); font-size: 14px; color: var(--ink-muted); }
.au-tiered__meta strong { color: var(--ink); font-weight: 600; }
.au-tiered__cols { grid-column: 1 / span 6; display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--gutter); padding-top: var(--space-4); }
.au-tiered__cols .au-label { margin-bottom: var(--space-2); }
.au-tiered__aside { grid-column: 7 / span 3; grid-row: 1 / span 3; align-self: start; }
.au-tiered__aside > .au-label { margin-bottom: var(--space-2); }
.au-tiered__foot { grid-column: 1 / span 6; display: flex; gap: var(--space-6); margin-top: var(--space-4); padding-top: var(--space-3); border-top: var(--border-hairline) solid var(--line); font-size: 15px; }
.au-tiered__foot a { font-weight: 600; color: var(--ink); text-decoration: none; }
.au-tiered__foot a:hover { text-decoration: underline; }

/* Top list inside menus (editorial, data-first) */
.au-toplist { list-style: none; margin: 0; padding: 0; counter-reset: au-top; }
.au-toplist li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: var(--space-3); align-items: center; padding: 9px 0; border-bottom: var(--border-hairline) solid var(--line); counter-increment: au-top; font-size: 15px; line-height: 20px; }
.au-toplist li::before { content: counter(au-top); font-weight: 700; color: var(--ink-subtle); font-variant-numeric: tabular-nums; }
.au-toplist a { color: var(--ink); font-weight: 600; text-decoration: none; }
.au-toplist a:hover { text-decoration: underline; }
.au-toplist small { display: block; font-size: 13px; line-height: 18px; font-weight: 400; color: var(--ink-muted); }
.au-toplist__score { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.au-toplist__score span { font-weight: 400; color: var(--ink-subtle); }
.au-toplist-note { margin: var(--space-2) 0 0; font-size: 13px; line-height: 18px; color: var(--ink-muted); }
.au-megamenu__list .au-nav__count { margin-left: var(--space-2); }

/* ---------- Sold menu slot (native ad) ---------- */
.au-menuad { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4) var(--space-5) var(--space-5); background: var(--paper); border: var(--border-hairline) solid var(--line-strong); }
.au-menuad__top { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding-bottom: var(--space-3); border-bottom: var(--border-hairline) solid var(--line); }
.au-menuad__label { margin: 0; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); }
.au-menuad__why { font-size: 13px; line-height: 16px; color: var(--ink-muted); }
a.au-menuad__why:hover { color: var(--ink); }
.au-menuad__text { margin: 0; font-size: 15px; line-height: 22px; color: var(--ink-muted); }
.au-menuad .au-cta__note { text-align: left; }
.au-menuad--house { background: var(--surface-sunken); border-color: var(--surface-sunken); }
.au-menuad--house .au-menuad__top { border-bottom-color: var(--line-strong); }
.au-menuad .au-plate__rest { display: none; }
.au-menuad .au-plate-hint { margin-top: 6px; }
.au-menuad > .au-field__label { margin-bottom: -6px; }
.au-menuad .au-field { gap: 4px; }
.au-menuad .au-input { height: 44px; }
.au-menuad .au-affix__unit { padding: 0 var(--space-2); }
.au-megamenu__ad { grid-column: 10 / span 3; grid-row: 1 / span 2; align-self: start; }
.au-menuad__logo { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; min-width: 132px; height: 40px; padding: 0 var(--space-3); border: var(--border-hairline) dashed var(--line-control); background: var(--paper); font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); }
.au-menuad__title { margin: 0; font-size: 19px; line-height: 26px; font-weight: 600; }
.au-menuad .au-list-check { font-size: 15px; line-height: 22px; }
.au-menuad .au-list-check li + li { margin-top: 6px; }
.au-menuad .au-list-check li::before { top: 1px; }
.au-menuad--compact { flex-direction: row; align-items: flex-start; gap: var(--space-3); margin: var(--space-3) 0 calc(-1 * var(--space-3)); padding: var(--space-3) var(--space-5); background: var(--surface-subtle); border: 0; border-top: var(--border-hairline) solid var(--line); }
.au-menuad--compact > div { min-width: 0; }
.au-menuad--compact .au-menuad__label { margin-bottom: 2px; font-size: 12px; line-height: 16px; }
.au-menuad--compact .au-menuad__logo { min-width: 72px; height: 32px; margin-top: 2px; font-size: 11px; }
.au-menuad--compact p { margin: 0; font-size: 14px; line-height: 20px; }
.au-menuad--compact a { font-weight: 600; }

/* ---------- Mobile drawer ---------- */
.au-drawer { background: var(--paper); border: var(--border-hairline) solid var(--line); }
.au-drawer__top { display: flex; align-items: center; justify-content: space-between; height: 60px; padding: 0 var(--space-4); border-bottom: var(--border-hairline) solid var(--line); }
.au-drawer__search { padding: var(--space-4); border-bottom: var(--border-hairline) solid var(--line); }
.au-drawer__section { border-bottom: var(--border-hairline) solid var(--line); }
.au-drawer__toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; min-height: 56px; padding: 0 var(--space-4); border: 0; background: none; font-size: 18px; font-weight: 600; text-align: left; cursor: pointer; }
.au-drawer__toggle[aria-expanded="true"] { background: var(--brand-tint); }
.au-drawer__toggle[aria-expanded="true"] .au-ico { transform: rotate(180deg); }
.au-drawer__panel { padding: var(--space-2) var(--space-4) var(--space-4); }
.au-drawer__panel[hidden] { display: none; }
.au-drawer__panel .au-label { margin: var(--space-3) 0 var(--space-2); }
.au-drawer__panel ul { list-style: none; margin: 0; padding: 0; }
.au-drawer__panel a { display: block; padding: 10px 0; color: var(--ink); text-decoration: none; font-size: 17px; border-bottom: var(--border-hairline) solid var(--line); }
.au-drawer__foot { padding: var(--space-4); display: flex; flex-wrap: wrap; gap: var(--space-4); font-size: 15px; }
.au-drawer__foot a { color: var(--ink-muted); }

/* ---------- Breadcrumbs ---------- */
.au-crumbs { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-4) 0; font-size: 14px; line-height: 20px; }
.au-crumbs ol { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; color: var(--ink-subtle); }
.au-crumbs li + li::before { content: "/"; margin: 0 var(--space-2); color: var(--line-control); }
.au-crumbs a { color: var(--ink-muted); text-decoration: none; }
.au-crumbs a:hover { color: var(--ink); text-decoration: underline; }
.au-crumbs [aria-current="page"] { color: var(--ink-subtle); }
.au-crumbs__aside { flex: none; color: var(--ink-muted); }
@media (max-width: 767px) { .au-crumbs li:not(:nth-last-child(2)) { display: none; } .au-crumbs li:nth-last-child(2)::before { content: none; } .au-crumbs li:nth-last-child(2) a::before { content: "‹ "; } }

/* ---------- Article header & byline ---------- */
.au-article-head { padding-bottom: var(--space-5); }
.au-article-head__title { margin: var(--space-3) 0 0; font-size: 40px; line-height: 48px; font-weight: 700; letter-spacing: -0.01em; max-width: 920px; }
.au-article-head__lead { margin: var(--space-4) 0 0; font-size: 21px; line-height: 32px; color: var(--ink); max-width: var(--measure); }
.au-byline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3) var(--space-6); margin-top: var(--space-5); padding: var(--space-3) 0; border-top: var(--border-hairline) solid var(--line); border-bottom: var(--border-hairline) solid var(--line); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-byline__people { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); }
.au-byline__person { display: inline-flex; align-items: center; gap: 10px; }
.au-byline__person a { color: var(--ink); font-weight: 600; text-decoration: none; }
.au-byline__person a:hover { text-decoration: underline; }
.au-byline__dates { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: 0; align-items: center; }
.au-byline__dates div { display: flex; gap: 6px; }
.au-byline__dates dt { color: var(--ink-subtle); }
.au-byline__dates dd { margin: 0; color: var(--ink); font-variant-numeric: tabular-nums; }
.au-disclosure-line { display: flex; gap: var(--space-2); align-items: flex-start; margin: var(--space-3) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); max-width: 900px; }
.au-disclosure-line .au-ico { color: var(--ink-subtle); width: 16px; height: 16px; margin-top: 2px; }
.au-disclosure-line a { color: var(--ink-muted); }
@media (max-width: 767px) { .au-article-head__title { font-size: 32px; line-height: 40px; } .au-article-head__lead { font-size: 19px; line-height: 29px; } }

/* ---------- Portraits ---------- */
.au-portrait { flex: none; width: 48px; height: 48px; background: var(--surface-sunken); color: var(--line-control); display: grid; place-items: center; overflow: hidden; }
.au-portrait img { width: 100%; height: 100%; object-fit: cover; }
.au-portrait--xs { width: 32px; height: 32px; }
.au-portrait--lg { width: 112px; height: 112px; }
.au-portrait--xl { width: 160px; height: 160px; }
.au-portrait:empty::before { content: ""; width: 60%; height: 60%; background: currentColor; -webkit-mask: var(--au-i-person) center / contain no-repeat; mask: var(--au-i-person) center / contain no-repeat; }

/* ---------- Table of contents ---------- */
.au-toc { font-size: 15px; line-height: 20px; }
.au-toc__title { margin: 0 0 var(--space-3); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); }
.au-toc__list, .au-toc__sub { list-style: none; margin: 0; padding: 0; }
.au-toc__list { border-left: var(--border-hairline) solid var(--line); }
.au-toc__link { position: relative; display: block; padding: 7px 0 7px var(--space-4); color: var(--ink-muted); text-decoration: none; }
.au-toc__link:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 0.2em; }
.au-toc__link.is-active, .au-toc__link[aria-current="true"] { color: var(--ink); font-weight: 600; }
.au-toc__link.is-active::before, .au-toc__link[aria-current="true"]::before { content: ""; position: absolute; left: -1px; top: 4px; bottom: 4px; width: var(--border-heavy); background: var(--accent); }
.au-toc__sub { display: none; padding-bottom: var(--space-2); }
.au-toc__item.is-open > .au-toc__sub { display: block; }
.au-toc__sub .au-toc__link { padding: 5px 0 5px var(--space-6); font-size: 14px; line-height: 18px; }
.au-toc__sub .au-toc__link.is-active { font-weight: 600; }
.au-toc__sub .au-toc__link.is-active::before { width: 2px; }
.au-toc__meta { margin-top: var(--space-5); padding-top: var(--space-4); border-top: var(--border-hairline) solid var(--line); display: flex; flex-direction: column; gap: var(--space-3); font-size: 14px; }
.au-toc__meta a { color: var(--ink-muted); }
.au-progress { height: 3px; background: var(--line); margin-top: var(--space-4); }
.au-progress > span { display: block; height: 100%; width: 0; background: var(--accent); transition: width 80ms linear; }
/* Mobile TOC bar */
.au-tocbar { position: sticky; top: 0; z-index: var(--z-sticky); background: var(--paper); border-bottom: var(--border-hairline) solid var(--line); }
.au-tocbar__btn { width: 100%; display: flex; align-items: center; gap: var(--space-3); min-height: 52px; padding: 0 var(--space-4); border: 0; background: none; text-align: left; cursor: pointer; }
.au-tocbar__label { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); flex: none; }
.au-tocbar__current { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.au-tocbar__btn[aria-expanded="true"] .au-ico { transform: rotate(180deg); }
.au-tocbar__panel { padding: var(--space-2) var(--space-4) var(--space-4); border-top: var(--border-hairline) solid var(--line); max-height: 60vh; overflow: auto; }
.au-tocbar__panel[hidden] { display: none; }
.au-tocbar .au-progress { margin: 0; height: 3px; }
@media (min-width: 1024px) { .au-tocbar { display: none; } }

/* ---------- Product page section nav (horizontal, sticky) ---------- */
.au-pagenav { position: sticky; top: 0; z-index: var(--z-sticky); background: var(--paper); border-bottom: var(--border-hairline) solid var(--line); }
.au-pagenav__inner { display: flex; align-items: center; gap: var(--space-5); min-height: 56px; }
.au-pagenav__list { display: flex; gap: 0; list-style: none; margin: 0; padding: 0; overflow-x: auto; flex: 1; min-width: 0; scrollbar-width: none; }
.au-pagenav__list a { display: block; position: relative; padding: 18px var(--space-3) 16px; font-size: 15px; line-height: 20px; font-weight: 600; color: var(--ink-muted); text-decoration: none; white-space: nowrap; }
.au-pagenav__list a:hover { color: var(--ink); }
.au-pagenav__list a.is-active { color: var(--ink); }
.au-pagenav__list a.is-active::after { content: ""; position: absolute; left: var(--space-3); right: var(--space-3); bottom: -1px; height: 3px; background: var(--accent); }
.au-pagenav__cta { display: flex; align-items: center; gap: var(--space-4); flex: none; }
.au-pagenav__product { font-size: 14px; line-height: 18px; color: var(--ink-muted); text-align: right; }
.au-pagenav__product strong { display: block; color: var(--ink); font-size: 15px; }

/* ---------- KeyFacts ---------- */
.au-keyfacts { background: var(--surface-sunken); border-top: var(--border-heavy) solid var(--rule); padding: var(--space-5) var(--space-5) var(--space-5); }
.au-keyfacts__title { margin: 0 0 var(--space-3); font-size: 19px; line-height: 26px; font-weight: 700; }
.au-keyfacts__list { list-style: none; margin: 0; padding: 0; font-size: 17px; line-height: 27px; }
.au-keyfacts__list li { position: relative; padding-left: 26px; }
.au-keyfacts__list li + li { margin-top: var(--space-2); }
.au-keyfacts__list li::before { content: ""; position: absolute; left: 4px; top: 10px; width: 7px; height: 7px; background: var(--brand); }
.au-keyfacts__foot { margin: var(--space-4) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Callouts ---------- */
.au-callout { padding: var(--space-4) var(--space-5) var(--space-5); border: var(--border-hairline) solid var(--line); background: var(--paper); font-size: 17px; line-height: 27px; }
.au-callout__label { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-2); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink); }
.au-callout__label::before { content: ""; width: 8px; height: 8px; background: var(--accent); }
.au-callout p { margin: 0; }
.au-callout p + p { margin-top: var(--space-2); }
.au-callout--warning { background: var(--notice-tint); border-color: var(--notice-tint); color: var(--ink); }
.au-callout--warning .au-callout__label { color: var(--notice); }
.au-callout--warning .au-callout__label::before { width: 18px; height: 18px; background: var(--notice); -webkit-mask: var(--au-i-warning) center / contain no-repeat; mask: var(--au-i-warning) center / contain no-repeat; }
.au-callout--example { background: var(--surface-sunken); border-color: var(--surface-sunken); }
.au-callout--example .au-callout__label::before { background: var(--ink-muted); }
.au-callout--definition { border-width: var(--border-rule) 0 var(--border-hairline); border-color: var(--rule) transparent var(--line); padding-left: 0; padding-right: 0; }
.au-callout--definition dfn { font-style: normal; font-weight: 600; }

/* ---------- Check / cross lists ---------- */
.au-list-check { list-style: none; margin: 0; padding: 0; }
.au-list-check li { position: relative; padding-left: 30px; }
.au-list-check li + li { margin-top: var(--space-2); }
.au-list-check li::before { content: ""; position: absolute; left: 0; top: 2px; width: 20px; height: 20px; background: var(--positive); -webkit-mask: var(--au-i-check) center / contain no-repeat; mask: var(--au-i-check) center / contain no-repeat; }
.au-list-check li.is-con::before { background: var(--negative); -webkit-mask-image: var(--au-i-cross); mask-image: var(--au-i-cross); }
.au-list-check li.is-neutral::before { background: var(--ink-subtle); -webkit-mask-image: var(--au-i-dash); mask-image: var(--au-i-dash); }
.au-list-check li.is-highlight { font-weight: 600; }

/* ---------- Pros / cons ---------- */
.au-proscons { display: grid; grid-template-columns: 1fr; gap: var(--space-5); }
@media (min-width: 768px) { .au-proscons { grid-template-columns: 1fr 1fr; } }
.au-proscons__col { border-top: var(--border-rule) solid var(--rule); padding-top: var(--space-3); font-size: 17px; line-height: 26px; }
.au-proscons__head { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-3); font-size: 19px; line-height: 26px; font-weight: 700; }

/* ---------- Data table (editorial) ---------- */
.au-table-wrap { margin: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.au-table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 22px; font-variant-numeric: tabular-nums; }
.au-table caption { caption-side: top; text-align: left; padding-bottom: var(--space-3); font-size: 19px; line-height: 26px; font-weight: 700; }
.au-table th, .au-table td { padding: 12px var(--space-4) 12px 0; text-align: left; vertical-align: top; border-bottom: var(--border-hairline) solid var(--line); }
.au-table th:last-child, .au-table td:last-child { padding-right: 0; }
.au-table thead th { font-size: 14px; line-height: 18px; font-weight: 600; color: var(--ink); border-bottom: var(--border-rule) solid var(--rule); vertical-align: bottom; }
.au-table thead th small { display: block; font-weight: 400; color: var(--ink-muted); }
.au-table tbody th { font-weight: 600; }
.au-table .is-num { text-align: right; white-space: nowrap; }
.au-table--zebra tbody tr:nth-child(even) { background: var(--surface-subtle); }
.au-table--zebra th:first-child, .au-table--zebra td:first-child { padding-left: var(--space-3); }
.au-table--zebra th:last-child, .au-table--zebra td:last-child { padding-right: var(--space-3); }
.au-table--sticky-first th:first-child, .au-table--sticky-first td:first-child { position: sticky; left: 0; background: var(--paper); z-index: 1; }
.au-table-source { margin-top: var(--space-3); font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Accordion / FAQ ---------- */
.au-accordion { border-bottom: var(--border-hairline) solid var(--line); }
.au-accordion__tools { display: flex; justify-content: space-between; align-items: end; gap: var(--space-4); margin-bottom: var(--space-3); }
.au-accordion details { border-top: var(--border-hairline) solid var(--line); }
.au-accordion summary { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-4); padding: var(--space-4) 0; list-style: none; cursor: pointer; font-size: 18px; line-height: 26px; font-weight: 600; }
.au-accordion summary::-webkit-details-marker { display: none; }
.au-accordion summary::after { content: ""; flex: none; width: 22px; height: 22px; margin-top: 2px; background: var(--ink); -webkit-mask: var(--au-i-plus) center / contain no-repeat; mask: var(--au-i-plus) center / contain no-repeat; }
.au-accordion details[open] > summary::after { -webkit-mask-image: var(--au-i-minus); mask-image: var(--au-i-minus); }
.au-accordion summary:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-accordion__body { padding: 0 var(--space-6) var(--space-5) 0; font-size: 17px; line-height: 28px; max-width: var(--measure); }
.au-accordion__body p { margin: 0; }
.au-accordion__body p + p { margin-top: var(--space-3); }

/* ---------- Sources & change log ---------- */
.au-sources { font-size: 15px; line-height: 22px; }
.au-sources__title { margin: 0 0 var(--space-3); font-size: 19px; line-height: 26px; font-weight: 700; }
.au-sources__list { margin: 0; padding: 0; list-style: none; counter-reset: au-src; }
.au-sources__list li { position: relative; padding: var(--space-2) 0 var(--space-2) 40px; border-top: var(--border-hairline) solid var(--line); counter-increment: au-src; }
.au-sources__list li::before { content: "[" counter(au-src) "]"; position: absolute; left: 0; top: var(--space-2); color: var(--ink-subtle); font-variant-numeric: tabular-nums; }
.au-sources__list li:target { background: var(--brand-tint); }
.au-sources__meta { color: var(--ink-muted); }
.au-changelog { margin-top: var(--space-5); border-top: var(--border-hairline) solid var(--line); }
.au-changelog summary { padding: var(--space-3) 0; cursor: pointer; font-weight: 600; list-style: none; display: flex; align-items: center; gap: var(--space-2); }
.au-changelog summary::-webkit-details-marker { display: none; }
.au-changelog summary::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--au-i-chevron-right) center / contain no-repeat; mask: var(--au-i-chevron-right) center / contain no-repeat; transition: transform 120ms ease-out; }
.au-changelog[open] summary::before { transform: rotate(90deg); }
.au-changelog ol { list-style: none; margin: 0; padding: 0 0 var(--space-3); }
.au-changelog li { display: grid; grid-template-columns: 112px 1fr; gap: var(--space-4); padding: var(--space-2) 0; border-top: var(--border-hairline) solid var(--line); }
.au-changelog time { color: var(--ink-muted); font-variant-numeric: tabular-nums; }

/* ---------- People: author, reviewer, editorial team ---------- */
.au-people { display: grid; gap: var(--space-5); }
@media (min-width: 768px) { .au-people--2 { grid-template-columns: 1fr 1fr; } }
.au-person { display: flex; gap: var(--space-5); padding-top: var(--space-4); border-top: var(--border-rule) solid var(--rule); }
.au-person__role { margin: 0 0 4px; }
.au-person__name { margin: 0; font-size: 21px; line-height: 28px; font-weight: 700; }
.au-person__name a { color: var(--ink); text-decoration: none; }
.au-person__name a:hover { text-decoration: underline; }
.au-person__title { margin: 2px 0 0; font-size: 15px; line-height: 22px; color: var(--ink-muted); }
.au-person__bio { margin: var(--space-3) 0 0; font-size: 16px; line-height: 25px; }
.au-person__creds { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-3) 0 0; padding: 0; list-style: none; }
.au-person__links { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: var(--space-3) 0 0; padding: 0; list-style: none; font-size: 15px; }
.au-person__links a { font-weight: 600; }
.au-team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); list-style: none; margin: 0; padding: 0; }
@media (min-width: 768px) { .au-team { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.au-team .au-portrait { width: 100%; height: auto; aspect-ratio: 4 / 5; }
.au-team .au-portrait:empty::before { width: 36%; height: 36%; }
.au-team__name { margin: var(--space-3) 0 0; font-size: 17px; line-height: 24px; font-weight: 700; }
.au-team__role { margin: 2px 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Feedback ---------- */
.au-feedback { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) 0; border-top: var(--border-hairline) solid var(--line); border-bottom: var(--border-hairline) solid var(--line); }
.au-feedback__q { margin: 0; font-size: 17px; font-weight: 600; }
.au-feedback__actions { display: flex; gap: var(--space-2); }
.au-feedback__thanks { margin: 0; font-size: 15px; color: var(--ink-muted); }

/* ---------- Rating ---------- */
.au-rating { display: inline-flex; align-items: center; gap: var(--space-2); font-size: 15px; line-height: 20px; white-space: nowrap; }
.au-rating__value { font-size: 20px; line-height: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
.au-rating__scale { color: var(--ink-muted); margin-left: -6px; }
.au-rating__bar { position: relative; width: 70px; height: 8px; background: var(--line); flex: none; }
.au-rating__bar > i { position: absolute; inset: 0 auto 0 0; width: calc(var(--v, 0) * 100%); background: var(--brand); }
.au-rating__bar::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 12px, var(--paper) 12px 14.5px); }
.au-rating__label { color: var(--ink-muted); }
.au-rating__method { font-size: 14px; color: var(--ink-muted); }
.au-rating--lg { gap: var(--space-3); }
.au-rating--lg .au-rating__value { font-size: 40px; line-height: 44px; letter-spacing: -0.01em; }
.au-rating--lg .au-rating__bar { width: 105px; height: 10px; }
.au-rating--lg .au-rating__bar::after { background: repeating-linear-gradient(90deg, transparent 0 19px, var(--paper) 19px 21.5px); }
.au-rating--stack { flex-direction: column; align-items: flex-start; gap: 4px; }
.au-rating--stack .au-rating__row { display: inline-flex; align-items: center; gap: var(--space-2); }
.au-rating--sm .au-rating__value { font-size: 16px; }
.au-rating--sm .au-rating__bar { width: 56px; height: 6px; }
.au-rating--sm .au-rating__bar::after { background: repeating-linear-gradient(90deg, transparent 0 9.6px, var(--paper) 9.6px 11.6px); }
.au-subscores { display: grid; gap: var(--space-2); margin: 0; font-size: 15px; }
.au-subscores > div { display: grid; grid-template-columns: 1fr auto 70px; gap: var(--space-3); align-items: center; }
.au-subscores dt { color: var(--ink); }
.au-subscores dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---------- Card art placeholder (product imagery as supplied) ---------- */
.au-cardart { width: 168px; aspect-ratio: 1.586; background: var(--brand); position: relative; flex: none; }
.au-cardart::before { content: ""; position: absolute; left: 12%; top: 34%; width: 15%; height: 19%; background: #d9c58f; }
.au-cardart::after { content: attr(data-name); position: absolute; left: 12%; bottom: 10%; font-size: 10px; letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.8); text-transform: uppercase; }
.au-cardart--sm { width: 72px; }
.au-cardart--sm::after { content: none; }
.au-cardart--lg { width: 240px; }
.au-cardart--gold { background: #b89b5e; }
.au-cardart--black { background: #1b2022; }
.au-cardart--silver { background: #a2a9b0; }
.au-logo-ph { display: inline-flex; align-items: center; justify-content: center; min-width: 120px; height: 40px; padding: 0 var(--space-3); border: var(--border-hairline) solid var(--line); font-size: 15px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); background: var(--paper); }

/* ---------- Product card ---------- */
.au-product { border: var(--border-hairline) solid var(--line); background: var(--paper); }
.au-product + .au-product { margin-top: var(--space-4); }
.au-product__head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: 10px var(--space-5); border-bottom: var(--border-hairline) solid var(--line); }
.au-product__bestfor { margin: 0; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--brand); display: flex; align-items: center; gap: var(--space-2); }
.au-product__bestfor::before { content: ""; width: 8px; height: 8px; background: var(--accent); }
.au-product__rank { font-variant-numeric: tabular-nums; color: var(--ink-subtle); font-weight: 600; margin-right: 4px; }
.au-product__body { display: grid; grid-template-columns: 1fr; gap: var(--space-5); padding: var(--space-5); }
@media (min-width: 768px) { .au-product__body { grid-template-columns: 200px minmax(0, 1fr) 220px; } }
.au-product__id { display: flex; flex-direction: column; gap: var(--space-3); }
.au-product__name { margin: 0; font-size: 21px; line-height: 27px; font-weight: 700; }
.au-product__name a { color: var(--ink); text-decoration: none; }
.au-product__name a:hover { text-decoration: underline; }
.au-product__provider { margin: -8px 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 var(--space-4); border-top: var(--border-hairline) solid var(--line); border-bottom: var(--border-hairline) solid var(--line); }
.au-facts > div { padding: var(--space-3) var(--space-3) var(--space-3) 0; }
.au-facts > div + div { padding-left: var(--space-3); border-left: var(--border-hairline) solid var(--line); }
.au-facts dt { font-size: 13px; line-height: 16px; color: var(--ink-muted); }
.au-facts dd { margin: 4px 0 0; font-size: 22px; line-height: 28px; font-weight: 600; font-variant-numeric: tabular-nums; }
.au-facts dd small { font-size: 13px; font-weight: 400; color: var(--ink-muted); }
.au-product__features { font-size: 16px; line-height: 24px; }
.au-product__actions { display: flex; flex-direction: column; gap: var(--space-3); }
.au-product__actions .au-check { font-size: 15px; justify-content: center; }
.au-product__more { border-top: var(--border-hairline) solid var(--line); }
.au-product__more > summary { display: flex; justify-content: center; align-items: center; gap: var(--space-2); padding: 12px var(--space-5); font-size: 15px; font-weight: 600; cursor: pointer; list-style: none; color: var(--ink); }
.au-product__more > summary::-webkit-details-marker { display: none; }
.au-product__more > summary::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--au-i-chevron-down) center / contain no-repeat; mask: var(--au-i-chevron-down) center / contain no-repeat; }
.au-product__more[open] > summary::after { transform: rotate(180deg); }
.au-product__more > summary:hover { background: var(--surface-subtle); }
.au-product__more-body { padding: 0 var(--space-5) var(--space-5); }
.au-product--featured { border-color: var(--brand); box-shadow: inset 0 3px 0 var(--brand); }
.au-product--featured .au-product__head { border-bottom-color: var(--line); }

/* ---------- Best-of summary ---------- */
.au-bestof { border-top: var(--border-heavy) solid var(--rule); }
.au-bestof__title { margin: var(--space-4) 0 var(--space-2); font-size: 23px; line-height: 30px; font-weight: 700; }
.au-bestof__intro { margin: 0 0 var(--space-3); font-size: 15px; line-height: 22px; color: var(--ink-muted); }
.au-bestof__row { display: grid; grid-template-columns: 1fr; gap: var(--space-2); align-items: center; padding: var(--space-4) 0; border-top: var(--border-hairline) solid var(--line); }
@media (min-width: 768px) { .au-bestof__row { grid-template-columns: 200px minmax(0, 1fr) 150px 170px; gap: var(--space-5); } }
.au-bestof__cat { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--brand); }
.au-bestof__product { display: flex; align-items: center; gap: var(--space-4); min-width: 0; }
.au-bestof__name { margin: 0; font-size: 18px; line-height: 24px; font-weight: 700; }
.au-bestof__name a { color: var(--ink); text-decoration: none; }
.au-bestof__name a:hover { text-decoration: underline; }
.au-bestof__key { margin: 2px 0 0; font-size: 15px; line-height: 22px; color: var(--ink-muted); }

/* ---------- Comparison table (data-dense) ---------- */
.au-compare { font-size: 15px; line-height: 22px; }
.au-compare__meta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-3); padding: var(--space-3) 0; }
.au-compare__count { margin: 0; font-size: 15px; color: var(--ink-muted); }
.au-compare__count strong { color: var(--ink); font-weight: 700; }
.au-compare__scroll { overflow-x: auto; border-top: var(--border-rule) solid var(--rule); -webkit-overflow-scrolling: touch; }
.au-compare__table { width: 100%; min-width: 980px; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.au-compare__table th, .au-compare__table td { padding: var(--space-3) var(--space-3); text-align: left; vertical-align: middle; border-bottom: var(--border-hairline) solid var(--line); background: var(--paper); }
.au-compare__table thead th { position: sticky; top: 0; z-index: 2; font-size: 13px; line-height: 16px; font-weight: 600; color: var(--ink-muted); background: var(--paper); border-bottom: var(--border-hairline) solid var(--line-strong); white-space: nowrap; vertical-align: bottom; padding-top: var(--space-4); }
.au-compare__table .is-num { text-align: right; }
.au-compare__table .is-sticky { position: sticky; left: 0; z-index: 1; box-shadow: inset -1px 0 0 var(--line); }
.au-compare__table thead .is-sticky { z-index: 3; }
.au-compare__table tbody tr:hover > * { background: var(--surface-subtle); }
.au-compare__table tbody tr.is-featured > * { background: var(--brand-tint); }
.au-compare__product { display: flex; align-items: center; gap: var(--space-3); min-width: 250px; }
.au-compare__product a { font-size: 16px; line-height: 21px; font-weight: 700; color: var(--ink); text-decoration: none; }
.au-compare__product a:hover { text-decoration: underline; }
.au-compare__product small { display: block; font-size: 13px; line-height: 18px; color: var(--ink-muted); font-weight: 400; }
.au-compare__product .au-badge { margin-top: 4px; }
.au-compare__val { font-size: 16px; font-weight: 600; color: var(--ink); }
.au-compare__val--good { color: var(--positive); }
.au-compare__sub { display: block; font-size: 13px; line-height: 16px; font-weight: 400; color: var(--ink-muted); }
.au-compare__flag { display: inline-flex; align-items: center; gap: 4px; }
.au-compare__flag .au-ico { width: 18px; height: 18px; }
.au-compare__flag--yes { color: var(--positive); }
.au-compare__flag--no { color: var(--negative); }
.au-compare__action { display: flex; flex-direction: column; align-items: stretch; gap: 6px; min-width: 150px; }
.au-compare__action a.au-compare__details { font-size: 14px; text-align: center; color: var(--ink-muted); }
.au-sort { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; font: inherit; color: inherit; text-transform: inherit; cursor: pointer; white-space: nowrap; }
.au-sort::after { content: ""; width: 14px; height: 14px; background: var(--ink-subtle); -webkit-mask: var(--au-i-sort) center / contain no-repeat; mask: var(--au-i-sort) center / contain no-repeat; }
.au-sort:hover { color: var(--ink); }
th[aria-sort="descending"] .au-sort, th[aria-sort="ascending"] .au-sort { color: var(--ink); }
th[aria-sort="descending"] .au-sort::after { background: var(--ink); -webkit-mask-image: var(--au-i-sort-down); mask-image: var(--au-i-sort-down); }
th[aria-sort="ascending"] .au-sort::after { background: var(--ink); -webkit-mask-image: var(--au-i-sort-up); mask-image: var(--au-i-sort-up); }
.au-compare__foot { margin: var(--space-3) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Filter bar ---------- */
.au-filterbar { background: var(--surface-sunken); }
.au-filterbar__tabs { display: flex; border-bottom: var(--border-hairline) solid var(--line); background: var(--paper); }
.au-filterbar__tab { position: relative; min-height: 48px; padding: 0 var(--space-5); border: 0; background: none; font-size: 16px; font-weight: 600; color: var(--ink-muted); cursor: pointer; }
.au-filterbar__tab[aria-selected="true"] { color: var(--ink); background: var(--surface-sunken); box-shadow: inset 0 3px 0 var(--accent); }
.au-filterbar__body { padding: var(--space-5); display: grid; gap: var(--space-5); }
.au-filterbar__row { display: flex; flex-wrap: wrap; gap: var(--space-5) var(--space-6); align-items: flex-end; }
.au-filterbar__active { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); padding-top: var(--space-4); border-top: var(--border-hairline) solid var(--line-strong); font-size: 14px; color: var(--ink-muted); }
.au-filterbar__calc { display: grid; grid-template-columns: 1fr; gap: var(--space-4); align-items: end; }
@media (min-width: 1024px) { .au-filterbar__calc { grid-template-columns: repeat(3, minmax(0, 240px)) auto; } }
.au-filterbar .au-chip--remove { background: var(--paper); border-color: var(--line); }
.au-filterbar__reset { margin-left: auto; padding: 0; border: 0; background: none; font-size: 14px; font-weight: 600; color: var(--link); text-decoration: underline; cursor: pointer; }

/* ---------- Product hero ---------- */
.au-hero-product { display: grid; grid-template-columns: 1fr; gap: var(--space-6); padding: var(--space-5) 0 var(--space-7); }
@media (min-width: 1024px) { .au-hero-product { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); } .au-hero-product__id { grid-column: span 4; } .au-hero-product__facts { grid-column: span 8; } }
.au-hero-product__id { display: flex; flex-direction: column; gap: var(--space-4); }
.au-hero-product__title { margin: 0; font-size: 36px; line-height: 42px; font-weight: 700; letter-spacing: -0.01em; }
.au-hero-product__provider { margin: -8px 0 0; font-size: 15px; color: var(--ink-muted); }
.au-hero-product__stand { margin: 0; font-size: 14px; line-height: 20px; color: var(--ink-subtle); }
.au-hero-product__facts .au-facts dd { font-size: 28px; line-height: 34px; }
.au-hero-product__lists { display: grid; grid-template-columns: 1fr; gap: var(--space-3) var(--space-6); font-size: 16px; line-height: 24px; }
@media (min-width: 768px) { .au-hero-product__lists { grid-template-columns: 1fr 1fr; } }
.au-verdict { margin-top: var(--space-5); padding: var(--space-5); background: var(--surface-sunken); border-top: var(--border-heavy) solid var(--rule); }
.au-verdict__title { margin: 0 0 var(--space-2); font-size: 19px; line-height: 26px; font-weight: 700; }
.au-verdict p { margin: 0; font-size: 17px; line-height: 27px; }
.au-verdict__by { display: flex; align-items: center; gap: var(--space-3); margin-top: var(--space-4); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-verdict__by strong { color: var(--ink); }

/* ---------- Conditions table ---------- */
.au-conditions__group + .au-conditions__group { margin-top: var(--space-6); }
.au-conditions__head { margin: 0; padding-bottom: var(--space-2); font-size: 19px; line-height: 26px; font-weight: 700; border-bottom: var(--border-rule) solid var(--rule); }
.au-conditions__list { margin: 0; }
.au-conditions__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-4); align-items: baseline; padding: 11px 0; border-bottom: var(--border-hairline) solid var(--line); font-size: 16px; line-height: 24px; }
.au-conditions__row dt { display: flex; align-items: flex-start; gap: 10px; }
.au-conditions__row dd { margin: 0; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.au-conditions__row.is-no dt { color: var(--ink-muted); }
.au-conditions__row.is-no dd { font-weight: 400; color: var(--ink-muted); }
.au-flag { flex: none; width: 20px; height: 20px; margin-top: 2px; background: var(--positive); -webkit-mask: var(--au-i-check) center / contain no-repeat; mask: var(--au-i-check) center / contain no-repeat; }
.au-flag--no { background: var(--negative); -webkit-mask-image: var(--au-i-cross); mask-image: var(--au-i-cross); }
.au-flag--na { background: var(--ink-subtle); -webkit-mask-image: var(--au-i-dash); mask-image: var(--au-i-dash); }
.au-term { text-decoration: underline dotted var(--ink-subtle); text-underline-offset: 0.25em; cursor: help; position: relative; }
.au-term:hover, .au-term:focus-visible { text-decoration-color: var(--ink); }
.au-term[data-tip]:hover::after, .au-term[data-tip]:focus-visible::after { content: attr(data-tip); position: absolute; left: 0; top: calc(100% + 8px); width: 280px; padding: var(--space-3); background: var(--ink); color: var(--ink-inverse); font-size: 14px; line-height: 20px; font-weight: 400; z-index: var(--z-overlay); white-space: normal; }
.au-conditions__source { margin: var(--space-4) 0 0; display: flex; gap: var(--space-2); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-conditions__source .au-ico { width: 16px; height: 16px; margin-top: 2px; color: var(--ink-subtle); }

/* ---------- Provider facts ---------- */
.au-provider { border: var(--border-hairline) solid var(--line); display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { .au-provider { grid-template-columns: 260px minmax(0, 1fr); } }
.au-provider__id { padding: var(--space-5); border-bottom: var(--border-hairline) solid var(--line); background: var(--surface-subtle); display: flex; flex-direction: column; gap: var(--space-3); }
@media (min-width: 768px) { .au-provider__id { border-bottom: 0; border-right: var(--border-hairline) solid var(--line); } }
.au-provider__name { margin: 0; font-size: 21px; line-height: 28px; font-weight: 700; }
.au-provider__facts { margin: 0; display: grid; gap: var(--space-2); font-size: 14px; line-height: 20px; }
.au-provider__facts dt { color: var(--ink-muted); }
.au-provider__facts dd { margin: 0 0 var(--space-2); font-weight: 600; }
.au-provider__rows { padding: 0 var(--space-5); }
.au-provider__row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding: var(--space-4) 0; border-bottom: var(--border-hairline) solid var(--line); }
.au-provider__row:last-child { border-bottom: 0; }
.au-provider__row .au-ico { color: var(--ink-muted); }
.au-provider__row p { margin: 0; font-size: 16px; line-height: 22px; }
.au-provider__row small { display: block; font-size: 13px; line-height: 16px; color: var(--ink-muted); }
.au-provider__legal { grid-column: 1 / -1; padding: var(--space-3) var(--space-5); border-top: var(--border-hairline) solid var(--line); font-size: 13px; line-height: 18px; color: var(--ink-muted); }

/* ---------- Disclosure ---------- */
.au-disclosure { border: var(--border-hairline) solid var(--line); padding: var(--space-4) var(--space-5); font-size: 15px; line-height: 22px; }
.au-disclosure__title { margin: 0 0 var(--space-2); font-size: 16px; font-weight: 700; display: flex; gap: var(--space-2); align-items: center; }
.au-disclosure p { margin: 0; color: var(--ink); }
.au-disclosure p + p { margin-top: var(--space-2); }
.au-disclosure__weights { display: grid; grid-template-columns: 1fr; gap: 6px; margin: var(--space-3) 0 0; }
.au-disclosure__weights > div { display: grid; grid-template-columns: 180px minmax(0, 1fr) 48px; gap: var(--space-3); align-items: center; font-size: 14px; }
.au-disclosure__weights dt { color: var(--ink); }
.au-disclosure__weights dd { margin: 0; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.au-weightbar { height: 8px; background: var(--line); position: relative; }
.au-weightbar > i { position: absolute; inset: 0 auto 0 0; background: var(--brand); width: calc(var(--w, 0) * 1%); }

/* ---------- Comparison teaser (own promotion of comparison/affiliate pages) ---------- */
.au-teaser { display: grid; grid-template-columns: 1fr; gap: var(--space-5); padding: var(--space-6); background: var(--surface-sunken); }
@media (min-width: 768px) { .au-teaser { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; gap: var(--space-6); } }
.au-teaser__kicker { display: flex; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--space-2); }
.au-teaser__title { margin: 0 0 var(--space-3); font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -0.005em; }
.au-teaser__points { font-size: 16px; line-height: 24px; }
.au-teaser__form { display: grid; gap: var(--space-4); }
.au-teaser__fields { display: grid; gap: var(--space-4); grid-template-columns: 1fr; }
@media (min-width: 768px) { .au-teaser__fields--3 { grid-template-columns: 1fr 1.4fr 1fr; } .au-teaser__fields--2 { grid-template-columns: 1fr 1fr; } }
.au-teaser__fine { margin: 0; font-size: 13px; line-height: 18px; color: var(--ink-muted); }
.au-teaser--dark { background: var(--brand); color: var(--ink-inverse); }
.au-teaser--dark .au-label, .au-teaser--dark .au-teaser__fine { color: var(--ink-inverse-muted); }
.au-teaser--dark .au-field__label { color: var(--ink-inverse); }
.au-teaser--dark .au-list-check li::before { background: var(--ink-inverse); }
.au-teaser--dark .au-btn--primary { background: var(--paper); border-color: var(--paper); color: var(--brand); }
.au-teaser--dark .au-btn--primary:hover { background: var(--surface-sunken); }
.au-teaser--dark :focus-visible { outline-color: var(--focus-inverse); }
.au-teaser--dark .au-segmented > button[aria-pressed="true"] { background: var(--paper); color: var(--brand); border-color: var(--paper); }
.au-teaser--compact { grid-template-columns: 1fr; padding: var(--space-4) var(--space-5); }
@media (min-width: 1024px) { .au-teaser--compact { grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) auto; align-items: end; } }
.au-teaser--compact .au-teaser__title { font-size: 19px; line-height: 26px; margin: 0; }
.au-teaser--rail { grid-template-columns: 1fr; padding: var(--space-5); }
.au-teaser--rail .au-teaser__title { font-size: 21px; line-height: 28px; }

/* ---------- Licence plate input ---------- */
.au-plate { display: inline-flex; align-items: stretch; height: 60px; border: 2px solid var(--ink); background: var(--paper); color: var(--ink); max-width: 100%; }
.au-plate__band { flex: none; width: 36px; background: var(--plate-blue); color: #ffffff; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: 5px; font-size: 15px; font-weight: 600; line-height: 1; }
.au-plate__band svg { width: 22px; height: 22px; margin-bottom: 6px; }
.au-plate__stars { fill: var(--plate-yellow); }
.au-plate__input { width: 110px; border: 0; background: transparent; padding: 0 var(--space-3); font-size: 34px; line-height: 1; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink); }
.au-plate__input::placeholder { color: var(--line-strong); }
.au-plate__input:focus-visible { outline: none; }
.au-plate:focus-within { outline: var(--border-rule) solid var(--focus); outline-offset: 2px; }
.au-plate__seals { flex: none; display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 0 6px; }
.au-plate__seals i { display: block; width: 14px; height: 14px; border: 1px solid var(--line-strong); background: var(--surface-subtle); }
.au-plate__rest { flex: none; display: flex; align-items: center; padding: 0 var(--space-4) 0 var(--space-2); font-size: 34px; line-height: 1; font-weight: 600; letter-spacing: 0.06em; color: var(--line-strong); }
.au-plate--sm { height: 48px; }
.au-plate--sm .au-plate__band { width: 30px; font-size: 13px; padding-bottom: 3px; }
.au-plate--sm .au-plate__band svg { width: 18px; height: 18px; margin-bottom: 4px; }
.au-plate--sm .au-plate__input { width: 84px; font-size: 26px; padding: 0 var(--space-2); }
.au-plate--sm .au-plate__seals i { width: 11px; height: 11px; }
.au-plate--sm .au-plate__rest { font-size: 26px; padding-right: var(--space-3); }
.au-plate-hint { margin: var(--space-2) 0 0; min-height: 20px; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-teaser--dark .au-plate-hint { color: var(--ink-inverse-muted); }
.au-teaser--dark .au-plate { border-color: var(--paper); }

/* ---------- Ad slots (display advertising, calculator sites only) ---------- */
.au-ad { display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 0 auto; }
.au-ad__label { align-self: stretch; margin: 0; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); }
.au-ad__box { display: grid; place-items: center; max-width: 100%; background: var(--surface-subtle); border: var(--border-hairline) dashed var(--line-strong); color: var(--ink-subtle); font-size: 13px; font-variant-numeric: tabular-nums; }
.au-ad--leaderboard .au-ad__box { width: 728px; height: 90px; }
.au-ad--billboard .au-ad__box { width: 970px; height: 250px; }
.au-ad--mrec .au-ad__box { width: 300px; height: 250px; }
.au-ad--halfpage .au-ad__box { width: 300px; height: 600px; }
.au-ad--mobile .au-ad__box { width: 320px; height: 100px; }
.au-ad__sm { display: none; }
.au-ad--after .au-ad__box { width: 728px; height: 90px; }
.au-ad--incontent .au-ad__box { width: 300px; height: 250px; }
@media (max-width: 767px) {
  .au-ad--after .au-ad__box { width: 300px; height: 250px; }
  .au-ad--incontent .au-ad__box { width: 320px; height: 100px; }
  .au-ad--after .au-ad__lg, .au-ad--incontent .au-ad__lg { display: none; }
  .au-ad--after .au-ad__sm, .au-ad--incontent .au-ad__sm { display: inline; }
}

/* ---------- Cross promotion (network links) ---------- */
.au-crosspromo { border-top: var(--border-rule) solid var(--rule); padding-top: var(--space-3); }
.au-crosspromo__title { margin: 0 0 var(--space-2); font-size: 19px; line-height: 26px; font-weight: 700; }
.au-crosspromo__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { .au-crosspromo__list { grid-template-columns: 1fr 1fr; column-gap: var(--space-6); } }
.au-crosspromo__list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-3); align-items: center; padding: var(--space-3) 0; border-bottom: var(--border-hairline) solid var(--line); color: var(--ink); text-decoration: none; }
.au-crosspromo__list a:hover strong { text-decoration: underline; }
.au-crosspromo__list strong { display: block; font-size: 17px; line-height: 24px; font-weight: 600; }
.au-crosspromo__list a > span > span { display: block; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-crosspromo__list strong { color: var(--ink); }
.au-crosspromo__list a::after { content: ""; width: 20px; height: 20px; background: var(--ink); -webkit-mask: var(--au-i-arrow-right) center / contain no-repeat; mask: var(--au-i-arrow-right) center / contain no-repeat; }

/* ---------- Calculator ---------- */
.au-calc { border: var(--border-hairline) solid var(--line); }
.au-calc__modes { display: flex; flex-wrap: wrap; border-bottom: var(--border-hairline) solid var(--line); }
.au-calc__mode { position: relative; min-height: 52px; padding: 0 var(--space-5); border: 0; background: none; font-size: 16px; font-weight: 600; color: var(--ink-muted); cursor: pointer; }
.au-calc__mode:hover { color: var(--ink); }
.au-calc__mode[aria-selected="true"] { color: var(--ink); background: var(--surface-sunken); box-shadow: inset 0 3px 0 var(--accent); }
.au-calc__inputs { background: var(--surface-sunken); padding: var(--space-5); }
.au-calc__equation { display: grid; grid-template-columns: 1fr; gap: var(--space-3); align-items: end; }
@media (min-width: 768px) { .au-calc__equation { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); } }
.au-calc__op { padding-bottom: 12px; font-size: 22px; line-height: 24px; color: var(--ink-muted); text-align: center; }
.au-calc__hint { margin: var(--space-3) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-calc__result { display: grid; grid-template-columns: 1fr; gap: var(--space-4); padding: var(--space-5); border-top: var(--border-hairline) solid var(--line); }
@media (min-width: 768px) { .au-calc__result { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); align-items: start; } }
.au-calc__value { margin: 4px 0 0; font-size: 44px; line-height: 48px; font-weight: 600; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.au-calc__value small { font-size: 22px; font-weight: 600; color: var(--ink-muted); margin-left: 4px; }
.au-calc__steps { margin: 0; padding: var(--space-3) var(--space-4); background: var(--surface-subtle); border: var(--border-hairline) solid var(--line); font-family: var(--font-mono); font-size: 15px; line-height: 24px; white-space: pre; overflow-x: auto; }
.au-calc__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }

/* ---------- Footer ---------- */
.au-footer { background: var(--brand); color: var(--ink-inverse); padding: var(--space-8) 0 var(--space-5); font-size: 15px; line-height: 22px; }
.au-footer a { color: var(--ink-inverse); text-decoration: none; }
.au-footer a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-footer :focus-visible { outline-color: var(--focus-inverse); }
.au-footer__top { display: grid; grid-template-columns: 1fr; gap: var(--space-6); padding-bottom: var(--space-7); border-bottom: var(--border-hairline) solid rgba(255, 255, 255, 0.22); }
@media (min-width: 1024px) { .au-footer__top { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); } .au-footer__brand { grid-column: span 4; } .au-footer__cols { grid-column: span 8; } }
.au-footer__claim { margin: var(--space-4) 0 0; color: var(--ink-inverse-muted); max-width: 34ch; }
.au-footer__trust { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-5); }
.au-footer__trust a { display: inline-flex; align-items: center; gap: var(--space-2); font-weight: 600; }
.au-footer__trust .au-ico { width: 18px; height: 18px; }
.au-footer__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--gutter); }
@media (min-width: 768px) { .au-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.au-footer__head { margin: 0 0 var(--space-3); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-inverse-muted); }
.au-footer__list { list-style: none; margin: 0; padding: 0; }
.au-footer__list li + li { margin-top: var(--space-2); }
.au-footer__note { margin: var(--space-5) 0 0; font-size: 13px; line-height: 19px; color: var(--ink-inverse-muted); max-width: 920px; }
.au-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3) var(--space-5); padding-top: var(--space-5); font-size: 13px; line-height: 18px; color: var(--ink-inverse-muted); }
.au-footer__bottom ul { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); list-style: none; margin: 0; padding: 0; }
.au-footer__bottom a { color: var(--ink-inverse-muted); }

/* ---------- Page heads for hubs / comparison pages ---------- */
.au-pagehead { padding: var(--space-2) 0 var(--space-6); }
.au-pagehead__title { margin: var(--space-2) 0 0; font-size: 40px; line-height: 48px; font-weight: 700; letter-spacing: -0.01em; }
.au-pagehead__lead { margin: var(--space-3) 0 0; font-size: 19px; line-height: 29px; max-width: 760px; }
.au-pagehead__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: var(--space-4) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-pagehead__meta strong { color: var(--ink); font-weight: 600; }
.au-sectionhead { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); padding-top: var(--space-4); border-top: var(--border-heavy) solid var(--rule); margin-bottom: var(--space-5); }
.au-sectionhead__title { margin: 0; font-size: 30px; line-height: 38px; font-weight: 700; letter-spacing: -0.005em; }
.au-linklist { list-style: none; margin: 0; padding: 0; }
.au-linklist a { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: 12px 0; border-bottom: var(--border-hairline) solid var(--line); color: var(--ink); text-decoration: none; font-size: 17px; line-height: 24px; }
.au-linklist a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-linklist a::after { content: ""; flex: none; width: 18px; height: 18px; background: var(--ink-muted); -webkit-mask: var(--au-i-chevron-right) center / contain no-repeat; mask: var(--au-i-chevron-right) center / contain no-repeat; }
.au-linklist li:first-child a { border-top: var(--border-hairline) solid var(--line); }
.au-teaserlist { display: grid; grid-template-columns: 1fr; gap: var(--space-6) var(--gutter); }
@media (min-width: 768px) { .au-teaserlist { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.au-article-teaser__img { aspect-ratio: 3 / 2; background: var(--surface-sunken); }
.au-article-teaser__img img { width: 100%; height: 100%; object-fit: cover; }
.au-article-teaser__kicker { margin: var(--space-3) 0 4px; }
.au-article-teaser__title { margin: 0; font-size: 21px; line-height: 28px; font-weight: 700; }
.au-article-teaser__title a { color: var(--ink); text-decoration: none; }
.au-article-teaser__title a:hover { text-decoration: underline; }
.au-article-teaser__meta { margin: var(--space-2) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Media: images, figures, heroes ---------- */
.au-media { position: relative; display: block; margin: 0; overflow: hidden; aspect-ratio: 3 / 2; background: var(--surface-sunken); }
.au-media--21x9 { aspect-ratio: 21 / 9; }
.au-media--16x9 { aspect-ratio: 16 / 9; }
.au-media--4x3 { aspect-ratio: 4 / 3; }
.au-media--1x1 { aspect-ratio: 1 / 1; }
.au-media--4x5 { aspect-ratio: 4 / 5; }
.au-media--hero { aspect-ratio: 3 / 2; }
@media (min-width: 768px) { .au-media--hero { aspect-ratio: 21 / 9; } }
.au-media > img, .au-media > picture, .au-media > picture > img, .au-media > video, .au-media > iframe { display: block; width: 100%; height: 100%; object-fit: cover; border: 0; }
.au-media[data-ph]:empty { border: var(--border-hairline) solid var(--line); }
.au-media[data-ph]:empty::after { content: attr(data-ph); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: var(--space-4); text-align: center; white-space: pre-line; font-size: 13px; line-height: 18px; color: var(--ink-muted); }
.au-figure { margin: 0; }
.au-prose > .au-figure, .au-prose > .au-figure + * { margin-top: var(--space-6); }
.au-prose > .au-figure:first-child { margin-top: 0; }
.au-figure__caption { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px var(--space-4); margin-top: var(--space-2); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-figure__credit { font-size: 13px; line-height: 18px; color: var(--ink-subtle); }
.au-figure--lead { margin-bottom: var(--space-6); }
.au-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); padding: var(--space-6) 0 var(--space-7); }
@media (min-width: 1024px) { .au-hero { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; } .au-hero__text { grid-column: 1 / span 6; } .au-hero__media { grid-column: 7 / span 6; } }
.au-hero__title { margin: var(--space-3) 0 0; font-size: 48px; line-height: 56px; font-weight: 700; letter-spacing: -0.015em; }
.au-hero__lead { margin: var(--space-4) 0 0; font-size: 21px; line-height: 32px; max-width: 34em; }
.au-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
.au-hero__meta { margin: var(--space-4) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
@media (max-width: 767px) { .au-hero { padding-top: var(--space-4); } .au-hero__title { font-size: 34px; line-height: 40px; } .au-hero__lead { font-size: 19px; line-height: 29px; } }
.au-article-teaser .au-media { margin-bottom: 0; }
.au-article-teaser--noimg { padding-top: var(--space-3); border-top: var(--border-rule) solid var(--rule); }
.au-article-teaser--noimg .au-article-teaser__kicker { margin-top: 0; }
.au-article-rows { list-style: none; margin: 0; padding: 0; border-top: var(--border-hairline) solid var(--line); }
.au-article-row { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--space-4); align-items: start; padding: var(--space-4) 0; border-bottom: var(--border-hairline) solid var(--line); }
@media (min-width: 768px) { .au-article-row { grid-template-columns: 216px minmax(0, 1fr); gap: var(--space-5); padding: var(--space-5) 0; } }
.au-article-row--noimg { grid-template-columns: minmax(0, 1fr); }
.au-article-row__kicker { margin: 0 0 4px; }
.au-article-row__title { margin: 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-article-row__title a { color: var(--ink); text-decoration: none; }
.au-article-row__title a:hover { text-decoration: underline; }
.au-article-row__text { margin: 6px 0 0; font-size: 16px; line-height: 24px; color: var(--ink-muted); max-width: var(--measure); }
.au-article-row__meta { margin: var(--space-2) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
@media (max-width: 767px) { .au-article-row__title { font-size: 17px; line-height: 23px; } .au-article-row__text { display: none; } }

/* ---------- Consent: banner, settings dialog, external content ----------
   The banner is the first element in <body> (so Tab reaches it first) and sits fixed at the bottom. It never blocks the page. */
.au-linkbtn { padding: 0; border: 0; background: none; font: inherit; color: var(--link); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; cursor: pointer; }
.au-linkbtn:hover { text-decoration-thickness: 2px; }
.au-footer .au-linkbtn { color: var(--ink-inverse); text-decoration: none; }
.au-footer__bottom .au-linkbtn { color: var(--ink-inverse-muted); }
.au-footer .au-linkbtn:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-consent { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-modal); max-height: 85vh; overflow-y: auto; background: var(--paper); border-top: var(--border-heavy) solid var(--brand); box-shadow: var(--shadow-overlay); }
.au-consent__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); padding-top: var(--space-5); padding-bottom: var(--space-5); }
@media (min-width: 1024px) { .au-consent__inner { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; } .au-consent__text { grid-column: 1 / span 8; } .au-consent__actions { grid-column: 9 / span 4; } }
.au-consent__title { margin: 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-consent__body { margin: var(--space-2) 0 0; font-size: 15px; line-height: 22px; max-width: 76ch; }
.au-consent__links { display: flex; flex-wrap: wrap; gap: 4px var(--space-4); margin: var(--space-2) 0 0; font-size: 14px; line-height: 20px; }
.au-consent__actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.au-consent__actions .au-btn { padding: 0 var(--space-3); }
.au-consent__actions [data-au-consent="settings"] { grid-column: 1 / -1; }
.au-consent-dialog { width: min(640px, calc(100% - 32px)); max-width: none; max-height: min(760px, calc(100% - 32px)); margin: auto; padding: 0; border: 0; border-top: var(--border-heavy) solid var(--brand); background: var(--paper); color: var(--ink); box-shadow: var(--shadow-overlay); }
.au-consent-dialog::backdrop { background: rgba(18, 22, 25, 0.56); }
.au-consent-dialog[open] { display: flex; flex-direction: column; }
.au-consent-dialog__form { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; margin: 0; }
.au-consent-dialog__head { flex: none; display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-3) var(--space-3) var(--space-5); border-bottom: var(--border-hairline) solid var(--line); }
.au-consent-dialog__title { margin: 0; font-size: 21px; line-height: 28px; font-weight: 700; }
.au-consent-dialog__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: var(--space-4) var(--space-5) var(--space-5); font-size: 15px; line-height: 22px; }
.au-consent-dialog__body > p { margin: 0; }
.au-consent-dialog__foot { flex: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); padding: var(--space-4) var(--space-5); border-top: var(--border-hairline) solid var(--line); }
.au-consent-dialog__foot .au-btn { padding: 0 var(--space-3); }
@media (max-width: 767px) {
  .au-consent-dialog { width: 100%; height: 100%; max-height: 100%; }
  .au-consent-dialog__foot { grid-template-columns: 1fr 1fr; padding: var(--space-3) var(--space-4); }
  .au-consent-dialog__foot [data-au-consent="save"] { grid-column: 1 / -1; order: 3; }
  .au-consent-dialog__body { padding: var(--space-4); }
}
.au-consent-cats { list-style: none; margin: var(--space-4) 0 0; padding: 0; border-top: var(--border-hairline) solid var(--line); }
.au-consent-cat { padding: var(--space-4) 0; border-bottom: var(--border-hairline) solid var(--line); }
.au-consent-cat__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.au-consent-cat__head .au-check { font-weight: 600; }
.au-consent-cat__desc { margin: 6px 0 0 30px; color: var(--ink-muted); }
.au-consent-cat__services { margin: var(--space-2) 0 0 30px; font-size: 14px; line-height: 20px; }
.au-consent-cat__services summary { display: inline-flex; align-items: center; gap: 4px; list-style: none; cursor: pointer; color: var(--link); text-decoration: underline; text-underline-offset: 0.18em; }
.au-consent-cat__services summary::-webkit-details-marker { display: none; }
.au-consent-cat__services summary::before { content: ""; flex: none; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--au-i-chevron-right) center / contain no-repeat; mask: var(--au-i-chevron-right) center / contain no-repeat; }
.au-consent-cat__services[open] summary::before { transform: rotate(90deg); }
.au-consent-cat__services ul { margin: var(--space-2) 0 0; padding: 0; list-style: none; color: var(--ink-muted); }
.au-consent-cat__services li + li { margin-top: 4px; }
.au-check input:disabled { cursor: not-allowed; }
.au-check input:checked:disabled { background-color: var(--ink-subtle); border-color: var(--ink-subtle); }
.au-embed { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--space-3); padding: var(--space-5); background: var(--surface-sunken); border: var(--border-hairline) solid var(--line); }
.au-embed.au-media { aspect-ratio: 16 / 9; }
.au-embed__title { margin: 0; font-size: 17px; line-height: 24px; font-weight: 600; }
.au-embed__text { margin: 0; font-size: 15px; line-height: 22px; color: var(--ink-muted); max-width: 56ch; }
.au-embed__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); font-size: 15px; }
@media (max-width: 767px) { .au-embed.au-media { aspect-ratio: auto; } }

/* ---------- Language switch and colour-mode switch ---------- */
.au-langswitch ul { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.au-langswitch li + li { margin-left: var(--space-3); padding-left: var(--space-3); border-left: var(--border-hairline) solid currentColor; }
.au-langswitch a { color: inherit; text-decoration: none; }
.au-langswitch a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-langswitch a[aria-current] { color: var(--ink); font-weight: 600; }
.au-footer .au-langswitch a[aria-current] { color: var(--ink-inverse); }
.au-segmented--sm > button { min-height: 32px; padding: 0 var(--space-3); font-size: 14px; }
.au-modeswitch { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.au-footer .au-segmented > button { background: transparent; border-color: var(--ink-inverse-muted); color: var(--ink-inverse); }
.au-footer .au-segmented > button:hover { border-color: var(--ink-inverse); box-shadow: inset 0 0 0 1px var(--ink-inverse); }
.au-footer .au-segmented > button[aria-pressed="true"] { background: var(--ink-inverse); border-color: var(--ink-inverse); color: var(--brand); }
.au-footer__settings { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-6); padding-top: var(--space-5); font-size: 13px; line-height: 18px; color: var(--ink-inverse-muted); }
.au-footer__settings > :only-child { margin-left: auto; }
.au-drawer__settings { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-4); border-top: var(--border-hairline) solid var(--line); font-size: 15px; color: var(--ink-muted); }

/* ---------- Chart ----------
   Stacked columns plus at most one comparison line, built from data (Aurum.chartHTML). Colours come from chart-1 … chart-4 by role;
   text keeps the ink tokens. Charts sit on paper, never inside a sunken panel. Square marks, 2px paper gaps between segments,
   a 2px paper ring around the line. The legend doubles as the readout. */
.au-chart { margin: 0; }
.au-chart__head { margin-bottom: var(--space-4); }
.au-chart__title { margin: 0; font-size: 19px; line-height: 26px; font-weight: 600; color: var(--ink); }
.au-chart__sub { margin: var(--space-1) 0 0; max-width: var(--measure); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-chart__readout { margin-bottom: var(--space-4); }
.au-chart__when { margin: 0 0 var(--space-2); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.au-chart__legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-5); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .au-chart__legend { grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); } }
.au-chart__legend li { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.au-chart__name { display: flex; align-items: center; gap: var(--space-2); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-chart__val { padding-left: 20px; font-size: 19px; line-height: 26px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.au-chart__key { flex: none; width: 12px; height: 12px; background: var(--au-chart-c); }
.au-chart__key--line { height: 2px; background: repeating-linear-gradient(90deg, var(--au-chart-c) 0 6px, transparent 6px 10px); }
.au-chart__key--1, .au-chart__seg--1, .au-chart__dot--1 { --au-chart-c: var(--chart-1); }
.au-chart__key--2, .au-chart__seg--2, .au-chart__dot--2 { --au-chart-c: var(--chart-2); }
.au-chart__key--3, .au-chart__seg--3, .au-chart__dot--3 { --au-chart-c: var(--chart-3); }
.au-chart__key--4, .au-chart__seg--4, .au-chart__dot--4 { --au-chart-c: var(--chart-4); }
.au-chart__plot { display: grid; grid-template-columns: 52px minmax(0, 1fr); grid-template-rows: var(--au-chart-h, 280px) auto; }
.au-chart__y { position: relative; grid-column: 1; grid-row: 1; }
.au-chart__y span, .au-chart__x span { font-size: 13px; line-height: 16px; color: var(--ink-subtle); font-variant-numeric: tabular-nums; white-space: nowrap; }
.au-chart__y span { position: absolute; right: var(--space-2); transform: translateY(50%); }
.au-chart__area { position: relative; grid-column: 2; grid-row: 1; outline: none; }
.au-chart__area:focus-visible { outline: var(--border-rule) solid var(--focus); outline-offset: var(--space-1); }
.au-chart__grid span { position: absolute; left: 0; right: 0; height: 0; border-top: var(--border-hairline) solid var(--line); }
.au-chart__grid span.is-base { border-top-color: var(--line-strong); }
.au-chart__cols { position: absolute; inset: 0; display: flex; }
.au-chart__slot { position: relative; flex: 1 1 0; min-width: 0; display: flex; justify-content: center; }
.au-chart__slot.is-active { background: color-mix(in srgb, var(--ink) 5%, transparent); }
.au-chart__bar { display: flex; flex-direction: column-reverse; width: min(24px, 64%); height: 100%; }
.au-chart__seg { flex: none; background: var(--au-chart-c); }
.au-chart__seg + .au-chart__seg { box-shadow: 0 2px 0 0 var(--paper); }
.au-chart__lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.au-chart__ring, .au-chart__line { fill: none; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.au-chart__ring { stroke: var(--paper); stroke-width: 6px; }
.au-chart__line { stroke-width: 2px; stroke-dasharray: 6 4; }
.au-chart__line--1 { stroke: var(--chart-1); } .au-chart__line--2 { stroke: var(--chart-2); } .au-chart__line--3 { stroke: var(--chart-3); } .au-chart__line--4 { stroke: var(--chart-4); }
.au-chart__dot { position: absolute; width: 8px; height: 8px; margin: 0 0 -4px -4px; background: var(--au-chart-c); box-shadow: 0 0 0 2px var(--paper); pointer-events: none; }
.au-chart__x { grid-column: 2; grid-row: 2; display: flex; padding-top: var(--space-2); }
.au-chart__x span { flex: 1 1 0; min-width: 0; display: flex; justify-content: center; visibility: hidden; }
.au-chart__x span.is-tick { visibility: visible; }
.au-chart__x span:first-child { justify-content: flex-start; }
.au-chart__x span:last-child { justify-content: flex-end; }
@media (max-width: 599px) {
  .au-chart { --au-chart-h: 220px; }
  .au-chart__x span.is-tick { visibility: hidden; }
  .au-chart__x span.is-tick-sm { visibility: visible; }
}
.au-chart__table { margin-top: var(--space-4); }
.au-chart__table > summary, .au-reveal > summary { display: inline-flex; align-items: center; gap: var(--space-2); list-style: none; cursor: pointer; font-size: 15px; line-height: 22px; font-weight: 600; color: var(--link); }
.au-chart__table > summary::-webkit-details-marker, .au-reveal > summary::-webkit-details-marker { display: none; }
.au-chart__table > summary::before, .au-reveal > summary::before { content: ""; flex: none; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--au-i-chevron-right) center / contain no-repeat; mask: var(--au-i-chevron-right) center / contain no-repeat; }
.au-chart__table[open] > summary::before, .au-reveal[open] > summary::before { transform: rotate(90deg); }
.au-chart__table > summary:hover, .au-reveal > summary:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-chart__table .au-table-wrap { margin-top: var(--space-3); max-height: 360px; overflow: auto; }
.au-chart__note { margin-top: var(--space-3); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
@media (forced-colors: active) { .au-chart__key, .au-chart__seg, .au-chart__dot, .au-chart__line { forced-color-adjust: none; } }

/* Compare: one horizontal stacked bar per option, all on one scale, the total after the bar. For two to five options,
   such as savings products. Segment colours keep their roles; chart-4 marks state money (Zulagen) here. The legend names
   the series, a visually hidden line per row carries the values, and the table beside the chart repeats them. */
.au-chart__legend--keys { grid-template-columns: repeat(auto-fit, minmax(120px, max-content)); margin-bottom: var(--space-4); }
.au-hbars { display: grid; gap: var(--space-4); margin: 0; }
.au-hbars__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
@media (min-width: 768px) { .au-hbars__row { grid-template-columns: 152px minmax(0, 1fr); align-items: center; gap: var(--space-3); } }
.au-hbars dt { font-size: 15px; line-height: 20px; font-weight: 600; color: var(--ink); }
.au-hbars dd { margin: 0; min-width: 0; }
.au-hbars__track { display: flex; align-items: center; gap: var(--space-2); min-width: 0; }
.au-hbars__bar { display: flex; flex: none; height: 20px; min-width: 4px; }
.au-hbars__seg { display: block; min-width: 2px; height: 100%; background: var(--au-chart-c); }
.au-hbars__seg + .au-hbars__seg { box-shadow: -2px 0 0 0 var(--paper); }
.au-hbars__val { font-size: 15px; line-height: 20px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (forced-colors: active) { .au-hbars__seg { forced-color-adjust: none; } }
/* Compare table: one column per option; the rows that decide (net cost, net payout) in bold. */
.au-calc__result > .au-compare-wrap { margin-top: var(--space-5); }
.au-table--compare thead th.is-num { white-space: normal; hyphens: manual; }
.au-table--compare .is-total th, .au-table--compare .is-total td { font-weight: 700; color: var(--ink); }
.au-table--compare td { white-space: nowrap; }

/* ---------- Small shared blocks ----------
   Block head with the 2px rule, a meta line, key-value rows and a figures row. Used by the directory, the facts panel,
   the calculator result and the home pages. */
.au-blockhead { margin: 0 0 var(--space-3); padding-top: var(--space-3); border-top: var(--border-rule) solid var(--rule); font-size: 19px; line-height: 26px; font-weight: 700; }
.au-blockhead a { color: var(--ink); text-decoration: none; }
.au-blockhead a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-meta { margin: var(--space-1) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.au-meta a { color: inherit; }
.au-kv { margin: 0; }
.au-kv > div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); padding: var(--space-3) 0; border-bottom: var(--border-hairline) solid var(--line); font-size: 16px; line-height: 22px; }
.au-kv dt { color: var(--ink-muted); }
.au-kv dd { margin: 0; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.au-figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border-top: var(--border-rule) solid var(--rule); }
@media (min-width: 768px) { .au-figs { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } }
.au-figs > div { padding: var(--space-3) var(--space-4) var(--space-3) 0; border-bottom: var(--border-hairline) solid var(--line); }
.au-figs dt { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-figs dd { margin: 2px 0 0; font-size: 22px; line-height: 28px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.au-figs dd small { display: block; margin-top: 2px; font-size: 13px; line-height: 18px; font-weight: 400; color: var(--ink-muted); white-space: normal; }
.au-linklist__meta { margin-left: auto; padding-left: var(--space-3); font-size: 14px; color: var(--ink-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---------- Home hero with a panel ----------
   .au-hero--panel: label, H1, lead, search or two actions and quick links in seven columns; a FactsPanel or a checked list
   in the aside from column 9. On phones the aside follows the text. */
.au-hero__aside { min-width: 0; }
@media (min-width: 1024px) {
  .au-hero--panel { align-items: start; padding: var(--space-8) 0; }
  .au-hero--panel .au-hero__text { grid-column: 1 / span 7; }
  .au-hero--panel .au-hero__aside { grid-column: 9 / span 4; }
}
.au-hero__search { display: flex; max-width: 620px; margin-top: var(--space-5); }
.au-hero__search .au-input { flex: 1; min-width: 0; height: 52px; font-size: 17px; }
.au-hero__search .au-btn { flex: none; min-height: 52px; }
@media (min-width: 768px) { .au-hero__search .au-input { height: 56px; } .au-hero__search .au-btn { min-height: 56px; } }
.au-quick { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: var(--space-4) 0 0; padding: 0; list-style: none; font-size: 15px; line-height: 22px; }
.au-quick > li:first-child { color: var(--ink-muted); }
.au-hero__aside > .au-label { margin-bottom: var(--space-3); }

/* ---------- Facts panel ----------
   'Die Zahlen für 2026': legal figures with their source and Stand. Citable, so every value is text and the source names the law. */
.au-factspanel { padding: var(--space-5); background: var(--surface-sunken); border-top: var(--border-heavy) solid var(--brand); }
.au-factspanel > .au-label { margin-bottom: var(--space-2); }
.au-factspanel .au-kv > div:last-child { border-bottom: 0; }
.au-factspanel .au-kv dd { font-size: 18px; white-space: nowrap; }
.au-factspanel .au-kv dd small { display: block; font-size: 13px; line-height: 18px; font-weight: 400; color: var(--ink-muted); }
.au-factspanel__source { margin: var(--space-3) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-factspanel__source a { color: inherit; }

/* ---------- Directory ----------
   All tools or comparisons in groups: a block head per group, then rows with name, Stand date and two or three quick links. */
.au-dir { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6) var(--gutter); }
@media (min-width: 768px) { .au-dir { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .au-dir--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .au-dir--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .au-dir--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.au-dir__group { min-width: 0; }
.au-dir__list { list-style: none; margin: 0; padding: 0; }
.au-dir__list > li { padding: var(--space-3) 0; border-bottom: var(--border-hairline) solid var(--line); }
.au-dir__name { font-size: 17px; line-height: 24px; font-weight: 600; color: var(--ink); text-decoration: none; }
.au-dir__name:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-dir__links { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: var(--space-2) 0 0; padding: 0; list-style: none; font-size: 14px; line-height: 20px; }
.au-dir__more { margin: var(--space-3) 0 0; font-size: 15px; line-height: 22px; }

/* ---------- Steps ----------
   Three numbered statements under 2px rules: 'So rechnen wir', 'So vergleichen wir'. */
.au-steps { display: grid; gap: var(--space-5) var(--gutter); margin: 0; padding: 0; list-style: none; counter-reset: au-step; }
@media (min-width: 768px) { .au-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.au-steps > li { counter-increment: au-step; padding-top: var(--space-4); border-top: var(--border-rule) solid var(--rule); }
.au-steps > li::before { content: counter(au-step, decimal-leading-zero); display: block; font-size: 14px; line-height: 20px; font-weight: 700; color: var(--ink-subtle); font-variant-numeric: tabular-nums; }
.au-steps h3 { margin: var(--space-2) 0 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-steps p { margin: var(--space-2) 0 0; font-size: 16px; line-height: 25px; color: var(--ink-muted); }

/* ---------- Calculator: split layout and parts ----------
   .au-calc--split: inputs on a sunken panel on the left (five columns), the result on paper on the right (seven), stacked on phones.
   Parts work in both layouts: rows of segmented choices, a field grid, assumptions behind a details, a notice line,
   the result figure, a figures row, the chart, 'Rechenweg anzeigen' and the tool actions. */
@media (min-width: 1024px) {
  .au-calc--split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .au-calc--split > .au-calc__modes { grid-column: 1 / -1; }
  .au-calc--split > .au-calc__result { display: block; border-top: 0; border-left: var(--border-hairline) solid var(--line); padding: var(--space-6); }
  .au-calc--split > .au-calc__inputs { padding: var(--space-6) var(--space-5); }
}
.au-calc--split > .au-calc__result { display: block; }
.au-calc__row { display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-6); }
.au-calc__row > .au-fieldset { flex: 1 1 220px; }
.au-calc__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
@media (min-width: 768px) { .au-calc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.au-calc__row + .au-calc__grid, .au-calc__grid + .au-calc__grid { margin-top: var(--space-5); }
.au-segmented--fill { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.au-segmented--fill > button { padding: 0 var(--space-2); white-space: nowrap; }
.au-calc__more { margin-top: var(--space-5); border-top: var(--border-hairline) solid var(--line-strong); }
.au-calc__more > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 2px var(--space-2); padding-top: var(--space-3); font-size: 15px; line-height: 20px; font-weight: 600; cursor: pointer; list-style: none; }
.au-calc__more > summary::-webkit-details-marker { display: none; }
.au-calc__more > summary::before { content: ""; flex: none; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--au-i-chevron-right) center / contain no-repeat; mask: var(--au-i-chevron-right) center / contain no-repeat; }
.au-calc__more[open] > summary::before { transform: rotate(90deg); }
.au-calc__more > summary span { font-weight: 400; color: var(--ink-muted); }
.au-calc__more > .au-calc__grid { margin-top: var(--space-3); }
.au-calc__note { display: flex; gap: var(--space-2); align-items: flex-start; margin: var(--space-3) 0 0; font-size: 14px; line-height: 20px; color: var(--notice); }
.au-calc__note .au-ico { flex: none; width: 16px; height: 16px; margin-top: 2px; }
.au-calc__lead { margin: var(--space-2) 0 0; font-size: 16px; line-height: 24px; color: var(--ink-muted); }
.au-calc__lead strong { color: var(--ink); font-weight: 600; }
.au-calc__result > .au-figs { margin-top: var(--space-5); }
.au-calc__result > .au-chart { margin-top: var(--space-6); }
.au-calc__result > .au-reveal { margin-top: var(--space-5); }
.au-reveal > :not(summary) { margin-top: var(--space-3); }
.au-calc__result > .au-toolactions { margin-top: var(--space-5); }

/* ---------- Tool actions ----------
   'Link kopieren' puts the inputs into the URL fragment. 'Einbetten' opens the iframe snippet with its brand credit. */
.au-toolactions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding-top: var(--space-4); border-top: var(--border-hairline) solid var(--line); }
.au-toolactions .au-btn .au-ico { width: 16px; height: 16px; }
.au-toolactions__note { margin: 0 0 0 auto; font-size: 13px; line-height: 18px; color: var(--ink-subtle); }
.au-embedcode { margin-top: var(--space-4); padding: var(--space-4); background: var(--surface-subtle); border: var(--border-hairline) solid var(--line); }
.au-embedcode > .au-label { margin-bottom: var(--space-2); }
.au-embedcode pre { margin: 0; padding: var(--space-3); max-height: 180px; overflow: auto; background: var(--paper); border: var(--border-hairline) solid var(--line-strong); font-family: var(--font-mono); font-size: 13px; line-height: 20px; white-space: pre-wrap; word-break: break-all; }
.au-embedcode__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-3); font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Tool page ----------
   The eleven parts of TemplateCalculator: head and calculator across the full width, then the .au-tool body with the
   explanation in the main column and the facts panel or one sticky AdSlot in the rail. */
.au-toolhead { padding-bottom: var(--space-5); }
.au-toolhead .au-pagehead__meta a { color: inherit; }
.au-toolbody { margin-top: var(--space-7); }
.au-toolsection { margin-top: var(--space-7); }
.au-tool__main > .au-prose { margin-top: var(--space-7); }
.au-figure-table { margin: var(--space-5) 0; }
.au-table-source { margin-top: var(--space-2); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-teaser__text { margin: 0; font-size: 16px; line-height: 24px; }
@media (min-width: 768px) { .au-calc__equation--convert { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto minmax(0, 1fr); } }
.au-calc__result > .au-calc__actions-row { grid-column: 1 / -1; }
.au-calc__result > .au-toolactions.au-calc__actions-row { margin-top: 0; }
.au-toolsection > .au-ad { align-items: flex-start; margin: 0; }
.au-person--compact { align-items: center; gap: var(--space-4); }
.au-person--compact .au-person__name { font-size: 17px; line-height: 24px; }
.au-overview--cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.au-overview--cols-5 .au-overview__col { grid-column: auto; }

/* ---------- Images: figures beside the text, screenshots, galleries, lightbox ----------
   Licensed stock with a credit, own photos, screenshots, charts and own line illustrations; never AI images.
   Galleries are moved by the reader only: no autoplay, no rotating hero. No text or gradients on a photo. */

/* Figure beside the text: small, alternating start and end, from 768px. On phones it takes the full width. */
.au-prose > .au-figure--float { margin-top: var(--space-5); }
@media (min-width: 768px) {
  .au-prose > .au-figure--float { float: left; clear: left; width: min(42%, 300px); margin: var(--space-5) var(--space-5) var(--space-3) 0; }
  .au-prose > .au-figure--float.au-figure--end { float: right; clear: right; margin: var(--space-5) 0 var(--space-3) var(--space-5); }
}
.au-prose > h2, .au-prose > h3, .au-prose > .au-wide, .au-prose > .au-figure:not(.au-figure--float), .au-prose > .au-figure-pair, .au-prose > .au-gallery, .au-prose > .au-shotsteps, .au-prose > .au-shot, .au-prose > table, .au-prose > .au-table-wrap { clear: both; }
.au-prose::after { content: ""; display: table; clear: both; }

/* Two images side by side, each with its own caption. */
.au-figure-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5) var(--gutter); }
@media (min-width: 640px) { .au-figure-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.au-prose > .au-figure-pair { margin-top: var(--space-6); }

/* Zoom: the image itself is the button, and the caption row names the action. */
.au-figure__zoom { display: block; width: 100%; margin: 0; padding: 0; border: 0; background: none; color: inherit; text-align: inherit; cursor: zoom-in; }
.au-figure__zoomhint { display: inline-flex; align-items: center; gap: 6px; padding: 0; border: 0; background: none; font: inherit; font-size: 13px; line-height: 18px; color: var(--ink-muted); cursor: zoom-in; }
.au-figure__zoomhint .au-ico { width: 16px; height: 16px; }
.au-figure__zoomhint:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 0.2em; }
.au-figure__caption > span:first-child { flex: 1 1 260px; }

/* Screenshot: a hairline frame, no device chrome and no fake status bar. Phone screens portrait,
   websites with a plain address bar that names the domain. Screenshots keep their light face in dark mode. */
.au-shot { margin: 0; }
.au-shot__frame { position: relative; overflow: hidden; border: var(--border-hairline) solid var(--line-strong); background: var(--ink-inverse); }
.au-shot--phone { max-width: 272px; }
.au-shot--phone .au-shot__frame { aspect-ratio: 9 / 19.5; }
.au-shot__frame > img, .au-shot__view > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.au-shot__bar { display: flex; align-items: center; gap: var(--space-2); height: 32px; padding: 0 var(--space-3); border-bottom: var(--border-hairline) solid #dde1e6; background: #f2f4f8; }
.au-shot__bar i { flex: none; width: 8px; height: 8px; border: var(--border-hairline) solid #878d96; }
.au-shot__url { flex: 1; min-width: 0; height: 20px; padding: 0 var(--space-2); border: var(--border-hairline) solid #dde1e6; background: #ffffff; font: 12px/18px var(--font-sans); color: #4f555a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.au-shot--browser .au-shot__view { position: relative; overflow: hidden; }
.au-shot--browser .au-shot__view > img { height: auto; }
.au-shot .au-figure__caption { max-width: 100%; }
.au-shot--center { margin-left: auto; margin-right: auto; }

/* Gallery: native scroll-snap, so it swipes without JS. Aurum.gallery adds the button state, the counter and arrow keys.
   Default: one image per view (photos). --strip: several per view (phone screenshots, product shots). */
.au-gallery { position: relative; min-width: 0; }
.au-gallery__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-4); margin-bottom: var(--space-3); }
.au-gallery__title { margin: 0 auto 0 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-gallery__count { margin: 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.au-gallery__nav { display: flex; gap: var(--space-2); }
.au-gallery__btn { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: var(--border-hairline) solid var(--line-control); background: var(--paper); color: var(--ink); cursor: pointer; }
.au-gallery__btn:hover { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.au-gallery__btn[disabled] { border-color: var(--line); box-shadow: none; color: var(--line-strong); cursor: default; }
.au-gallery__track { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: var(--gutter); margin: 0; padding: 0; list-style: none; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.au-gallery__track::-webkit-scrollbar { display: none; }
.au-gallery__track:focus-visible { outline-offset: 4px; }
.au-gallery__item { min-width: 0; scroll-snap-align: start; }
@media (prefers-reduced-motion: reduce) { .au-gallery__track { scroll-behavior: auto; } }
.au-gallery--strip .au-gallery__track { grid-auto-columns: 74%; }
@media (min-width: 768px) {
  .au-gallery--strip .au-gallery__track { grid-auto-columns: calc((100% - 2 * var(--gutter)) / 3); }
  .au-gallery--strip.au-gallery--4 .au-gallery__track { grid-auto-columns: calc((100% - 3 * var(--gutter)) / 4); }
}
.au-gallery--strip .au-shot--phone { max-width: none; }
/* Thumbnails under a photo slider, from 768px. The current one carries the 2px rule. */
.au-gallery__thumbs { display: none; }
@media (min-width: 768px) { .au-gallery__thumbs { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: var(--space-2); margin: var(--space-3) 0 0; padding: 0; list-style: none; } }
.au-gallery__thumb { display: block; width: 100%; margin: 0; padding: 0; border: 0; background: none; cursor: pointer; }
.au-gallery__thumb[aria-current="true"] { outline: var(--border-rule) solid var(--rule); outline-offset: 2px; }
.au-gallery__thumbs .au-media { aspect-ratio: 3 / 2; }
/* Grid: a lead image and four more; the last tile names how many follow and opens them. */
.au-gallery__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.au-gallery__grid > li { min-width: 0; }
.au-gallery__grid > li:first-child { grid-column: 1 / -1; }
.au-gallery__grid .au-media { aspect-ratio: 4 / 3; }
@media (min-width: 768px) {
  .au-gallery__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .au-gallery__grid > li:first-child { grid-column: span 2; grid-row: span 2; }
  .au-gallery__grid > li:first-child .au-gallery__thumb, .au-gallery__grid > li:first-child .au-media { height: 100%; }
  .au-gallery__grid > li:first-child .au-media { aspect-ratio: auto; }
}
.au-gallery__grid .au-gallery__thumb { cursor: zoom-in; }
.au-gallery__more { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 100%; height: 100%; min-height: 96px; margin: 0; padding: var(--space-3); border: var(--border-hairline) solid var(--line-control); background: var(--surface-subtle); color: var(--ink); font: inherit; font-size: 15px; line-height: 20px; font-weight: 600; cursor: zoom-in; }
.au-gallery__more strong { font-size: 30px; line-height: 36px; font-variant-numeric: tabular-nums; }
.au-gallery__more:hover { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.au-gallery__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px var(--space-4); margin-top: var(--space-2); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-gallery__foot .au-figure__credit { margin-left: auto; }

/* Lightbox: a modal <dialog> on dark ground in both modes. Counter and close above, image in the middle,
   caption and credit below. Previous and next beside the image from 768px, under it on phones; swipe works too. */
.au-lightbox { width: 100%; max-width: 100%; height: 100%; max-height: 100%; margin: 0; padding: 0; border: 0; background: var(--dark-paper); color: var(--dark-ink); }
.au-lightbox::backdrop { background: rgba(0, 0, 0, 0.8); }
.au-lightbox :focus-visible { outline-color: var(--dark-focus); }
.au-lightbox__inner { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100%; }
.au-lightbox__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: 60px; padding: 0 var(--space-4); border-bottom: var(--border-hairline) solid var(--dark-line); }
.au-lightbox__count { margin: 0; font-size: 15px; line-height: 20px; color: var(--dark-ink-muted); font-variant-numeric: tabular-nums; }
.au-lightbox__btn { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: var(--border-hairline) solid var(--dark-line-strong); background: transparent; color: var(--dark-ink); cursor: pointer; }
.au-lightbox__btn:hover { border-color: var(--dark-ink); }
.au-lightbox__btn[disabled] { color: var(--dark-line-strong); border-color: var(--dark-line); cursor: default; }
.au-lightbox__stage { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; justify-items: center; min-height: 0; padding: var(--space-4); }
.au-lightbox__stage > .au-lightbox__btn { display: none; }
@media (min-width: 768px) {
  .au-lightbox__stage { grid-template-columns: 44px minmax(0, 1fr) 44px; gap: var(--space-5); padding: var(--space-5); }
  .au-lightbox__stage > .au-lightbox__btn { display: inline-grid; }
  .au-lightbox__pager { display: none; }
}
.au-lightbox__view { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 0; }
.au-lightbox__view > img { max-width: 100%; max-height: 100%; object-fit: contain; }
.au-lightbox__view > .au-media { width: min(100%, 1040px); }
.au-lightbox__view > .au-shot--phone { width: auto; height: 100%; max-width: 100%; }
.au-lightbox__view > .au-shot--phone .au-shot__frame { height: 100%; }
.au-lightbox__foot { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-2) var(--space-4); padding: var(--space-3) var(--space-4) var(--space-4); border-top: var(--border-hairline) solid var(--dark-line); font-size: 15px; line-height: 22px; }
.au-lightbox__credit { font-size: 13px; line-height: 18px; color: var(--dark-ink-subtle); }
.au-lightbox__pager { display: flex; gap: var(--space-2); width: 100%; }
.au-lightbox__pager .au-lightbox__btn { flex: 1; }
.au-lightbox .au-media { background: var(--dark-surface-sunken); }
.au-lightbox .au-media[data-ph]:empty { border-color: var(--dark-line); }
.au-lightbox .au-media[data-ph]:empty::after { color: var(--dark-ink-muted); }

/* Screenshot steps: numbered steps, each with a phone screenshot, a title and one or two sentences.
   Four in a row from 768px; phones scroll sideways with the next step peeking in. */
.au-shotsteps { display: grid; grid-auto-flow: column; grid-auto-columns: 74%; gap: var(--gutter); margin: 0; padding: 0 0 var(--space-2); list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; counter-reset: au-shotstep; }
@media (min-width: 768px) {
  .au-shotsteps { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; padding-bottom: 0; }
  .au-shotsteps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.au-shotsteps > li { min-width: 0; scroll-snap-align: start; counter-increment: au-shotstep; }
.au-shotsteps .au-shot--phone { max-width: none; margin-bottom: var(--space-4); }
.au-shotsteps__body { padding-top: var(--space-3); border-top: var(--border-rule) solid var(--rule); }
.au-shotsteps__body::before { content: "Schritt " counter(au-shotstep); display: block; font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); }
.au-shotsteps:lang(en) .au-shotsteps__body::before { content: "Step " counter(au-shotstep); }
.au-shotsteps__title { margin: var(--space-2) 0 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-shotsteps__text { margin: var(--space-2) 0 0; font-size: 16px; line-height: 25px; color: var(--ink-muted); }

/* Media and text in rows, alternating sides: home pages, category pages, offer pages. */
.au-mediatext { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5) var(--gutter); align-items: center; }
@media (min-width: 1024px) {
  .au-mediatext { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .au-mediatext__media { grid-column: 1 / span 6; grid-row: 1; }
  .au-mediatext__text { grid-column: 8 / span 5; grid-row: 1; }
  .au-mediatext--reverse .au-mediatext__media { grid-column: 7 / span 6; }
  .au-mediatext--reverse .au-mediatext__text { grid-column: 1 / span 5; }
}
.au-mediatext + .au-mediatext { margin-top: var(--space-8); }
.au-mediatext__media { min-width: 0; }
.au-mediatext__title { margin: var(--space-2) 0 0; font-size: 30px; line-height: 38px; font-weight: 700; letter-spacing: -0.005em; }
.au-mediatext__text > p:not([class]) { margin: var(--space-3) 0 0; font-size: 18px; line-height: 29px; }
.au-mediatext__text > .au-list-check, .au-mediatext__text > .au-link-arrow, .au-mediatext__actions { margin-top: var(--space-4); }
.au-mediatext__text > .au-link-arrow { display: inline-flex; }
.au-mediatext__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
@media (max-width: 767px) { .au-mediatext__title { font-size: 26px; line-height: 32px; } .au-mediatext__text > p:not([class]) { font-size: 17px; line-height: 28px; } }

/* Category head: label, H1, intro and meta, then a wide image, or the image beside the text (--split).
   In-page topic links follow. The image is optional: a category without a fitting photo starts with text. */
.au-cathead { padding: var(--space-2) 0 var(--space-6); }
.au-cathead__title { margin: var(--space-2) 0 0; font-size: 48px; line-height: 56px; font-weight: 700; letter-spacing: -0.015em; }
.au-cathead__lead { margin: var(--space-3) 0 0; max-width: 760px; font-size: 21px; line-height: 32px; }
.au-cathead__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: var(--space-4) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.au-cathead__meta strong { color: var(--ink); font-weight: 600; }
.au-cathead__media { margin-top: var(--space-6); }
@media (min-width: 1024px) {
  .au-cathead--split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; }
  .au-cathead--split > .au-crumbs, .au-cathead--split > .au-subnav { grid-column: 1 / -1; }
  .au-cathead--split .au-cathead__text { grid-column: 1 / span 6; }
  .au-cathead--split .au-cathead__media { grid-column: 7 / span 6; margin-top: 0; }
}
@media (max-width: 767px) { .au-cathead__title { font-size: 34px; line-height: 40px; } .au-cathead__lead { font-size: 19px; line-height: 29px; } }
.au-subnav { margin-top: var(--space-6); border-top: var(--border-hairline) solid var(--line); border-bottom: var(--border-hairline) solid var(--line); overflow-x: auto; scrollbar-width: none; }
.au-subnav::-webkit-scrollbar { display: none; }
.au-subnav ul { display: flex; gap: var(--space-5); margin: 0; padding: 0; list-style: none; white-space: nowrap; }
.au-subnav li:first-child { color: var(--ink-muted); }
.au-subnav li { display: flex; align-items: center; min-height: 52px; font-size: 16px; line-height: 20px; }
.au-subnav a { display: inline-flex; align-items: center; min-height: 52px; color: var(--ink); font-weight: 600; text-decoration: none; }
.au-subnav a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-subnav a[aria-current] { box-shadow: inset 0 calc(-1 * var(--border-rule)) 0 var(--rule); }
.au-subnav small { margin-left: 6px; font-size: 14px; font-weight: 400; color: var(--ink-muted); font-variant-numeric: tabular-nums; }

/* Teasers: excerpt, a lead teaser across two columns, four columns, and topic tiles with an image and top links. */
.au-article-teaser__excerpt { margin: var(--space-2) 0 0; font-size: 16px; line-height: 25px; color: var(--ink-muted); }
@media (min-width: 1024px) { .au-teaserlist--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 768px) {
  .au-teaserlist--lead > :first-child { grid-column: span 2; grid-row: span 2; }
  .au-teaserlist--lead > :first-child .au-article-teaser__title { font-size: 30px; line-height: 38px; letter-spacing: -0.005em; }
  .au-teaserlist--lead > :first-child .au-article-teaser__excerpt { font-size: 18px; line-height: 28px; }
}
.au-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--gutter-sm); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .au-tiles { gap: var(--space-6) var(--gutter); } }
@media (min-width: 1024px) { .au-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.au-tile { min-width: 0; }
.au-tile__link { display: block; color: var(--ink); text-decoration: none; }
.au-tile__name { display: block; margin-top: var(--space-3); font-size: 21px; line-height: 28px; font-weight: 700; }
.au-tile__link:hover .au-tile__name { text-decoration: underline; text-underline-offset: 0.2em; }
.au-tile__meta { margin: 4px 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.au-tile__links { margin: var(--space-3) 0 0; padding: 0; list-style: none; border-top: var(--border-hairline) solid var(--line); font-size: 15px; line-height: 22px; }
.au-tile__links a { display: block; padding: 8px 0; border-bottom: var(--border-hairline) solid var(--line); color: var(--ink); text-decoration: none; }
.au-tile__links a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
@media (max-width: 767px) { .au-tile__name { font-size: 18px; line-height: 24px; } }

/* Tool cards: a mini chart of what the tool computes, then name, one line, Stand and quick links. */
.au-toolcards { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6) var(--gutter); margin: 0; padding: 0; list-style: none; }
@media (min-width: 640px) { .au-toolcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .au-toolcards { grid-template-columns: repeat(3, minmax(0, 1fr)); } .au-toolcards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.au-toolcard { min-width: 0; }
.au-toolcard__name { margin: var(--space-3) 0 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-toolcard__name a { color: var(--ink); text-decoration: none; }
.au-toolcard__name a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-toolcard__text { margin: 4px 0 0; font-size: 16px; line-height: 24px; color: var(--ink-muted); }
.au-toolcard .au-dir__links { margin-top: var(--space-2); }
.au-thumbchart { display: block; aspect-ratio: 3 / 2; border: var(--border-hairline) solid var(--line); background: var(--surface-subtle); }
.au-thumbchart svg { display: block; width: 100%; height: 100%; }
.au-thumbchart .c1 { fill: var(--chart-1); } .au-thumbchart .c2 { fill: var(--chart-2); } .au-thumbchart .c3 { fill: var(--chart-3); }
.au-thumbchart .l4 { fill: none; stroke: var(--chart-4); stroke-width: 2; vector-effect: non-scaling-stroke; }
.au-thumbchart .l1 { fill: none; stroke: var(--chart-1); stroke-width: 2; vector-effect: non-scaling-stroke; }
.au-thumbchart .ax { fill: none; stroke: var(--line-strong); stroke-width: 1; vector-effect: non-scaling-stroke; }

/* Key numbers: large figures with a label and a source line. Only real, sourced numbers; never on guides. */
.au-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--gutter); margin: 0; }
@media (min-width: 1024px) { .au-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.au-stats > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; padding: var(--space-4) 0 var(--space-5); border-top: var(--border-rule) solid var(--rule); }
.au-stats dd { margin: 0; font-size: 44px; line-height: 52px; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.au-stats dt { margin-top: var(--space-1); font-size: 15px; line-height: 22px; color: var(--ink-muted); }
@media (max-width: 767px) { .au-stats dd { font-size: 32px; line-height: 40px; } }
.au-stats__source { margin: var(--space-2) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }

/* Logo wall: logos as supplied, each on a white plate in both modes. Only with the partner's consent. */
.au-logos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .au-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .au-logos { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.au-logos > li { display: grid; place-items: center; height: 88px; padding: var(--space-4); border: var(--border-hairline) solid #dde1e6; background: #ffffff; }
.au-logos img { max-width: 100%; max-height: 40px; object-fit: contain; }
.au-logos__ph { font-size: 14px; line-height: 18px; font-weight: 700; color: #4f555a; text-align: center; }

/* Plans: two to four offers side by side; one may be marked. Prices are text, never an image. */
.au-plans { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5) var(--gutter); margin: 0; padding: 0; list-style: none; }
@media (min-width: 1024px) { .au-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.au-plan { display: flex; flex-direction: column; min-width: 0; padding: var(--space-5); border: var(--border-hairline) solid var(--line-strong); border-top: var(--border-heavy) solid var(--line-strong); background: var(--paper); }
.au-plan--marked { border-top-color: var(--brand); }
.au-plan__flag { min-height: 16px; }
.au-plan--marked .au-plan__flag { color: var(--brand); }
.au-plan__name { margin: var(--space-2) 0 0; font-size: 23px; line-height: 30px; font-weight: 700; }
.au-plan__for { margin: 4px 0 0; font-size: 16px; line-height: 24px; color: var(--ink-muted); }
.au-plan__price { margin: var(--space-4) 0 0; font-size: 34px; line-height: 40px; font-weight: 700; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.au-plan__price small { margin-left: 4px; font-size: 15px; line-height: 20px; font-weight: 400; letter-spacing: 0; color: var(--ink-muted); }
.au-plan .au-list-check { flex: 1; margin-top: var(--space-4); padding-top: var(--space-4); border-top: var(--border-hairline) solid var(--line); font-size: 16px; line-height: 24px; }
.au-plan .au-list-check li + li { margin-top: var(--space-2); }
.au-plan__cta { margin-top: var(--space-5); }
.au-plan__note { margin: var(--space-2) 0 0; font-size: 13px; line-height: 18px; color: var(--ink-muted); }

/* Spot illustrations: own line drawings on a 64px grid, 2px strokes, square caps and mitred joins, plus one accent square.
   For tool groups, steps and features; never characters, mascots, 3D or AI, and never in place of a photo of a real thing. */
.au-illus { display: block; flex: none; width: 64px; height: 64px; color: var(--ink); }
.au-illus--lg { width: 96px; height: 96px; }
.au-illus--sm { width: 48px; height: 48px; }
.au-illus path, .au-illus rect, .au-illus circle, .au-illus line, .au-illus polyline { vector-effect: non-scaling-stroke; }
.au-illus .au-illus__accent { fill: var(--accent); stroke: none; }

/* Tools row: a spot illustration, name, one line and a link. Four in a row from 1024px. */
.au-toolrow { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 var(--gutter); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .au-toolrow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .au-toolrow { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.au-toolrow > li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: var(--space-4); align-items: start; padding: var(--space-4) 0; border-top: var(--border-hairline) solid var(--line); }
.au-toolrow .au-illus { width: 48px; height: 48px; }
@media (min-width: 1024px) {
  .au-toolrow > li { display: block; padding: var(--space-5) 0 0; border-top: var(--border-rule) solid var(--rule); }
  .au-toolrow .au-illus { width: 64px; height: 64px; margin-bottom: var(--space-4); }
}
.au-toolrow__name { margin: 0; font-size: 19px; line-height: 26px; font-weight: 700; }
.au-toolrow__name a { color: var(--ink); text-decoration: none; }
.au-toolrow__name a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.au-toolrow__text { margin: 4px 0 0; font-size: 16px; line-height: 25px; color: var(--ink-muted); }
.au-grouphead { display: flex; align-items: center; gap: var(--space-4); }
.au-grouphead .au-illus { width: 56px; height: 56px; }

/* A–Z index: letters, then the names in columns. */
.au-az { margin: 0; padding: 0; list-style: none; columns: 1; column-gap: var(--gutter); }
@media (min-width: 640px) { .au-az { columns: 2; } }
@media (min-width: 1024px) { .au-az { columns: 4; } }
.au-az > li { break-inside: avoid; padding: 0 0 var(--space-4); }
.au-az__letter { display: block; padding-top: var(--space-2); border-top: var(--border-rule) solid var(--rule); font-size: 15px; line-height: 20px; font-weight: 700; }
.au-az ul { margin: var(--space-2) 0 0; padding: 0; list-style: none; font-size: 16px; line-height: 24px; }
.au-az ul li { padding: 3px 0; }
.au-az a { color: var(--ink); }

/* ---------- Colour mode: dark ----------
   html[data-mode="dark"] maps every light token to its dark-* partner, so components need no dark styles of their own.
   Screen only: print always uses the light tokens. Put data-mode on the element that carries data-theme, or inside it. */
@media screen {
  [data-mode="dark"], [data-mode="dark"] [data-theme] {
    --paper: var(--dark-paper); --surface-subtle: var(--dark-surface-subtle); --surface-sunken: var(--dark-surface-sunken);
    --line: var(--dark-line); --line-strong: var(--dark-line-strong); --line-control: var(--dark-line-control);
    --ink: var(--dark-ink); --rule: var(--dark-ink); --ink-muted: var(--dark-ink-muted); --ink-subtle: var(--dark-ink-subtle);
    --link: var(--dark-link); --focus: var(--dark-focus);
    --positive: var(--dark-positive); --positive-strong: var(--dark-positive-strong); --positive-tint: var(--dark-positive-tint);
    --negative: var(--dark-negative); --negative-tint: var(--dark-negative-tint); --notice: var(--dark-notice); --notice-tint: var(--dark-notice-tint);
    --brand: var(--dark-brand); --brand-strong: var(--dark-brand-strong); --brand-tint: var(--dark-brand-tint); --accent: var(--dark-accent);
    --shadow-overlay: var(--dark-shadow-overlay); --shadow-sticky: var(--dark-shadow-sticky);
    --chart-1: var(--dark-chart-1); --chart-2: var(--dark-chart-2); --chart-3: var(--dark-chart-3); --chart-4: var(--dark-chart-4);
  }
  [data-mode="dark"] { color-scheme: dark; background: var(--paper); color: var(--ink); }
  /* Large brand areas keep the deep site colour. */
  [data-mode="dark"] .au-footer, [data-mode="dark"] .au-tiered__rail, [data-mode="dark"] .au-tiered__rail::before, [data-mode="dark"] .au-teaser--dark { background: var(--dark-brand-deep); }
  /* Light buttons on brand areas, with deep-brand text. */
  [data-mode="dark"] .au-btn--inverse, [data-mode="dark"] .au-teaser--dark .au-btn--primary, [data-mode="dark"] .au-teaser--dark .au-segmented > button[aria-pressed="true"], [data-mode="dark"] .au-footer .au-segmented > button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--dark-brand-deep); }
  [data-mode="dark"] .au-btn--inverse:hover, [data-mode="dark"] .au-teaser--dark .au-btn--primary:hover { background: var(--ink-muted); border-color: var(--ink-muted); }
  /* Brand-coloured text would fall below 4.5:1 on dark-paper: it becomes ink. */
  [data-mode="dark"] .au-label--brand, [data-mode="dark"] .au-product__bestfor, [data-mode="dark"] .au-bestof__cat, [data-mode="dark"] .au-plan--marked .au-plan__flag { color: var(--ink); }
  [data-mode="dark"] .au-btn--positive { color: var(--paper); }
  [data-mode="dark"] .au-chip[aria-pressed="true"] .au-chip__count { color: var(--ink-inverse); }
  [data-mode="dark"] .au-check input:checked:disabled { background-color: var(--line-strong); border-color: var(--line-strong); }
  [data-mode="dark"] .au-term[data-tip]:hover::after, [data-mode="dark"] .au-term[data-tip]:focus-visible::after { color: var(--paper); }
  [data-mode="dark"] .au-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f2f4f8' stroke-width='2' stroke-linecap='square'%3E%3Cpath d='M6.5 9.5l5.5 5.5 5.5-5.5'/%3E%3C/svg%3E"); }
  [data-mode="dark"] .au-menu-scrim { background: rgba(0, 0, 0, 0.56); }
  [data-mode="dark"] .au-consent-dialog::backdrop { background: rgba(0, 0, 0, 0.64); }
  /* Floating layers keep a visible frame, because shadows barely show on dark. */
  [data-mode="dark"] .au-dropdown, [data-mode="dark"] .au-megamenu, [data-mode="dark"] .au-drawer, [data-mode="dark"] .au-consent-dialog { border-color: var(--line-strong); }
  [data-mode="dark"] .au-consent-dialog { border-left: var(--border-hairline) solid var(--line-strong); border-right: var(--border-hairline) solid var(--line-strong); border-bottom: var(--border-hairline) solid var(--line-strong); }
  /* Real-world objects keep their light face: the licence plate and partner logos. Photos are never inverted or filtered. */
  [data-mode="dark"] .au-plate, [data-mode="dark"] .au-teaser--dark .au-plate { background: var(--ink-inverse); border-color: var(--ink-inverse); box-shadow: inset 0 0 0 1px var(--dark-paper); color: var(--dark-paper); }
  [data-mode="dark"] .au-plate__input { color: var(--dark-paper); }
  [data-mode="dark"] .au-plate__input::placeholder, [data-mode="dark"] .au-plate__rest { color: var(--dark-ink-muted); }
  [data-mode="dark"] .au-plate__seals i { border-color: var(--dark-ink-muted); background: var(--dark-ink); }
  [data-mode="dark"] .au-logo-ph, [data-mode="dark"] .au-menuad__logo { background: var(--ink-inverse); color: var(--dark-paper); }
  [data-mode="dark"] .au-cardart { outline: var(--border-hairline) solid var(--line-strong); outline-offset: -1px; }
}

/* ---------- Print ---------- */
@media print {
  .au-header, .au-megamenu, .au-toc, .au-tocbar, .au-pagenav, .au-ad, .au-teaser, .au-feedback, .au-footer, .au-consent, .au-consent-dialog, .au-embed, .au-gallery__nav, .au-gallery__thumbs, .au-lightbox, .au-figure__zoomhint { display: none !important; }
  .au-gallery__track, .au-shotsteps { display: block; overflow: visible; }
  .au-gallery__item + .au-gallery__item, .au-shotsteps > li + li { margin-top: var(--space-5); }
  .au-guide__main { grid-column: 1 / -1; }
  a { color: inherit; }
}