/* ===========================================================================
   au-site.css — augale.com
   Palette consolidated from the Tilda export: the two near-identical teals
   (#006d77 / #006d7e) and two golds (#c9a84c / #d7b221) are reduced to one each.
   Gold is an accent only: gold text on off-white measures ~2:1 and fails WCAG AA.
   =========================================================================== */

:root {
  --au-navy:   #1b1b2e;
  /* Slate & bone. The grounds take their hue from the navy rather than the
     teal: cyan-green tints read clinical, and warm tints fought the portrait.
     A ~12-point luminance step between base and band does the alternating
     without either ground announcing itself as a colour. On the band, navy
     measures 14.4:1, muted text 6.0:1, teal 5.2:1 — all past WCAG AA. */
  --au-white:  #fbfbfc;
  --au-paper:  #ebedf2;
  /* Hover wash, between the two grounds, so a card hovered inside an
     alternating section neither dissolves into it nor jumps to the base. */
  --au-wash:   #f4f5f9;
  /* Gold is darker here than the Tilda original (#c9a84c) to hold up against
     the cooler grounds. It stays an accent — rules, markers, underlines,
     the ring on a step numeral — and is never a text colour. */
  --au-gold:   #b6923c;
  --au-teal:   #006d77;
  --au-muted:  #585866;
  --au-rule:   rgba(27, 27, 46, 0.14);
  --au-serif:  'Cormorant', Georgia, 'Times New Roman', serif;
  --au-sans:   -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --au-measure: 68ch;
  --au-gutter: clamp(20px, 5vw, 64px);
}

/* --- accessibility --------------------------------------------------------- */
#au-skip-anchor, .au-skip {
  position: absolute; left: -9999px; top: 0; z-index: 1000;
  background: var(--au-navy); color: #fff; padding: 12px 18px;
  font-family: var(--au-sans); font-size: 15px; text-decoration: none;
}
#au-skip-anchor, .au-skip:focus { left: 0; }

/* --- header ---------------------------------------------------------------- */
.au-header {
  position: sticky; top: 0; z-index: 900;
  background: var(--au-paper);
  border-bottom: 1px solid var(--au-rule);
}
.au-header__inner {
  max-width: 1180px; margin: 0 auto;
  padding: 18px var(--au-gutter);
  display: flex; align-items: baseline; gap: 32px;
}
#au-header .au-header__name {
  font-family: var(--au-serif);
  font-size: clamp(19px, 2.2vw, 23px);
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--au-navy); text-decoration: none; white-space: nowrap;
  margin-right: auto;
}
#au-header .au-header__name:hover, #au-header .au-header__name:focus-visible { color: var(--au-teal); }

.au-nav { display: flex; align-items: baseline; gap: 30px; }
#au-header .au-nav__link {
  font-family: var(--au-sans);
  font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--au-navy); text-decoration: none;
  padding-bottom: 3px; border-bottom: 1px solid transparent;
  transition: color .18s ease, border-color .18s ease;
}
#au-header .au-nav__link:hover, #au-header .au-nav__link:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }
#au-header .au-nav__link.is-current { border-bottom-color: var(--au-gold); }

#au-header .au-nav__langs { display: flex; gap: 10px; padding-left: 22px; border-left: 1px solid var(--au-rule); }
#au-header .au-nav__lang {
  font-family: var(--au-sans); font-size: 12px; letter-spacing: 0.08em;
  color: var(--au-muted); text-decoration: none;
}
#au-header .au-nav__lang:hover, #au-header .au-nav__lang:focus-visible { color: var(--au-teal); }
#au-header .au-nav__lang.is-current { color: var(--au-navy); font-weight: 600; }

.au-header__toggle { display: none; background: none; border: 0; padding: 6px; cursor: pointer; }
.au-header__toggle span {
  display: block; width: 24px; height: 2px; margin: 5px 0;
  background: var(--au-navy); transition: transform .2s ease, opacity .2s ease;
}

@media (max-width: 860px) {
  .au-header__inner { align-items: center; gap: 16px; }
  .au-header__toggle { display: block; }
  .au-nav {
    position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: flex-start; gap: 0;
    background: var(--au-paper); border-bottom: 1px solid var(--au-rule);
    padding: 0 var(--au-gutter); max-height: 0; overflow: hidden;
    transition: max-height .25s ease, padding .25s ease;
  }
  .au-header.is-open .au-nav { max-height: 70vh; padding: 8px var(--au-gutter) 22px; }
  .au-nav__link { display: block; width: 100%; padding: 14px 0; border-bottom: 1px solid var(--au-rule); }
  .au-nav__link.is-current { border-bottom-color: var(--au-gold); }
  .au-nav__langs { border-left: 0; padding: 16px 0 0; }
  .au-header.is-open .au-header__toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .au-header.is-open .au-header__toggle span:nth-child(2) { opacity: 0; }
  .au-header.is-open .au-header__toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

/* --- footer ---------------------------------------------------------------- */
.au-footer {
  background: var(--au-paper);
  border-top: 1px solid var(--au-rule);
  /* No top margin. Six pages end on an alternating band, and a margin here
     showed as a stripe of the base colour between two slate areas. The footer's
     own 52px of padding and its top rule do the separating. */
}
.au-footer__inner {
  max-width: 1180px; margin: 0 auto; padding: 52px var(--au-gutter) 44px;
  display: grid; gap: 28px;
}
.au-footer__brand { display: flex; align-items: flex-start; gap: 18px; }
.au-footer__mark { width: 56px; height: auto; flex: none; }
#au-footer .au-footer__line {
  margin: 0; max-width: 46ch;
  font-family: var(--au-serif); font-size: 18px; line-height: 1.5; color: var(--au-navy);
}
.au-footer__nav { display: flex; flex-wrap: wrap; gap: 10px 26px; }
#au-footer .au-footer__nav a {
  font-family: var(--au-sans); font-size: 13px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--au-navy); text-decoration: none;
  border-bottom: 1px solid transparent;
}
#au-footer .au-footer__nav a:hover, #au-footer .au-footer__nav a:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }
#au-footer .au-footer__copy { margin: 0; font-family: var(--au-sans); font-size: 13px; color: var(--au-muted); }

/* --- direct contact block (replaces the former Tilda forms) ----------------- */
#allrecords .au-contact, .au-contact {
  position: relative; z-index: 2;
  display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 4px;
}
#allrecords .au-contact a.au-contact__item, .au-contact a.au-contact__item {
  display: inline-block;
  font-family: var(--au-serif); font-size: 20px; line-height: 1.4;
  color: var(--au-navy); text-decoration: none;
  border-bottom: 1px solid var(--au-gold); padding-bottom: 3px;
  transition: color .2s ease, border-color .2s ease;
}
#allrecords .au-contact a.au-contact__item:hover, #allrecords .au-contact a.au-contact__item:focus-visible, .au-contact a.au-contact__item:hover { color: var(--au-teal); border-bottom-color: var(--au-teal); }
#allrecords .au-contact a.au-contact__item_email, .au-contact a.au-contact__item_email { font-size: 26px; letter-spacing: .2px; word-break: break-word; }
#allrecords .t712__form-text, #allrecords .t712__form-bottom-text { position: relative; z-index: 2; }

@media screen and (max-width: 640px) {
  #allrecords .au-contact a.au-contact__item       { font-size: 18px; }
  #allrecords .au-contact a.au-contact__item_email { font-size: 21px; }
}

/* --- link contrast fix across inherited Tilda content ---------------------- */
/* Tilda set #allrecords a { color:#c9a84c } — gold on off-white, ~2:1, fails AA. */
#allrecords .t-text a, #allrecords .t-descr a, #allrecords p a {
  color: var(--au-navy);
  border-bottom: 1px solid var(--au-gold);
  text-decoration: none;
}
#allrecords .t-text a:hover, #allrecords .t-descr a:hover, #allrecords .t-text a:focus-visible, #allrecords .t-descr a:focus-visible {
  color: var(--au-teal); border-bottom-color: var(--au-teal);
}

/* ===========================================================================
   Layout primitives for the rebuilt pages (/practice, /insights, homepage)
   =========================================================================== */

.au-page { margin: 0; background: var(--au-white); color: var(--au-navy); font-family: var(--au-sans); }
.au-wrap { max-width: 1180px; margin: 0 auto; padding: 0 var(--au-gutter); }
.au-wrap_narrow { max-width: 760px; }

.au-hero { padding: clamp(56px, 9vw, 104px) 0 clamp(32px, 5vw, 56px); }
.au-hero__title {
  font-family: var(--au-serif); font-weight: 300;
  font-size: clamp(44px, 7vw, 84px); line-height: 1.04; letter-spacing: -0.01em;
  margin: 0 0 22px; color: var(--au-navy);
}
.au-hero__lead {
  font-family: var(--au-serif); font-weight: 300;
  font-size: clamp(20px, 2.4vw, 27px); line-height: 1.5;
  max-width: 34em; margin: 0; color: var(--au-navy);
}

.au-section { padding: clamp(40px, 6vw, 72px) 0; }
.au-section_alt { background: var(--au-paper); }
.au-section__title {
  font-family: var(--au-sans); font-size: 13px; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--au-muted);
  margin: 0 0 28px; padding-bottom: 12px; border-bottom: 1px solid var(--au-rule);
}

.au-grid { display: grid; gap: 1px; background: var(--au-rule); border: 1px solid var(--au-rule); }
@media (min-width: 760px) { .au-grid { grid-template-columns: 1fr 1fr; } }
.au-grid_two { }

.au-card {
  display: block; background: var(--au-white); padding: clamp(24px, 3vw, 34px);
  text-decoration: none; color: inherit; transition: background .2s ease;
}
.au-card:hover, .au-card:focus-visible { background: var(--au-wash); }
.au-card__title {
  font-family: var(--au-serif); font-weight: 400; font-size: clamp(22px, 2.4vw, 28px);
  line-height: 1.2; margin: 0 0 12px; color: var(--au-navy);
}
.au-card__body { margin: 0 0 16px; font-size: 16px; line-height: 1.65; color: var(--au-muted); max-width: 46ch; }
.au-card__more {
  font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--au-teal);
  border-bottom: 1px solid var(--au-gold); padding-bottom: 2px;
}

.au-prose { font-family: var(--au-serif); font-size: 21px; line-height: 1.6; max-width: var(--au-measure); color: var(--au-navy); }
.au-fineprint { font-size: 14px; color: var(--au-muted); margin-top: 28px; }
.au-fineprint a { color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-fineprint a:hover { color: var(--au-teal); border-bottom-color: var(--au-teal); }

/* --- homepage lede --------------------------------------------------------- */
.au-lede { padding: clamp(44px, 7vw, 88px) 0 clamp(36px, 5vw, 64px); }
.au-lede__grid { display: grid; gap: clamp(32px, 5vw, 64px); align-items: center; }
@media (min-width: 900px) { .au-lede__grid { grid-template-columns: 1fr 440px; } }
.au-lede__eyebrow {
  font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--au-muted); margin: 0 0 20px;
}
.au-lede__title {
  font-family: var(--au-serif); font-weight: 300;
  font-size: clamp(34px, 5.4vw, 62px); line-height: 1.1; letter-spacing: -0.005em;
  margin: 0 0 22px; color: var(--au-navy);
}
.au-lede__sub {
  font-family: var(--au-serif); font-weight: 300;
  font-size: clamp(19px, 2.1vw, 24px); line-height: 1.55;
  max-width: 32em; margin: 0 0 30px; color: var(--au-navy);
}
.au-lede__cta { display: flex; flex-wrap: wrap; gap: 14px; }
.au-lede__figure { margin: 0; }
.au-lede__figure img { display: block; width: 100%; height: auto; }

.au-btn {
  display: inline-block; padding: 13px 24px;
  font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase;
  background: var(--au-teal); color: #fff; text-decoration: none;
  transition: background .18s ease;
}
.au-btn:hover, .au-btn:focus-visible { background: var(--au-navy); color: #fff; }
.au-btn_quiet { background: transparent; color: var(--au-navy); box-shadow: inset 0 0 0 1px var(--au-rule); }
.au-btn_quiet:hover, .au-btn_quiet:focus-visible { background: var(--au-navy); color: #fff; }

@media (min-width: 760px) { .au-grid_three { grid-template-columns: repeat(3, 1fr); } }

/* --- representative matters ------------------------------------------------ */
.au-matters { display: grid; gap: 1px; background: var(--au-rule); border: 1px solid var(--au-rule); }
@media (min-width: 900px) { .au-matters { grid-template-columns: repeat(3, 1fr); } }
.au-matter { background: var(--au-white); padding: clamp(24px, 3vw, 32px); margin: 0; }
.au-matter__meta {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--au-teal); margin: 0 0 12px;
}
.au-matter__title {
  font-family: var(--au-serif); font-weight: 400; font-size: clamp(21px, 2.2vw, 26px);
  line-height: 1.2; margin: 0 0 12px; color: var(--au-navy);
}
.au-matter__body { margin: 0; font-size: 15.5px; line-height: 1.65; color: var(--au-muted); }

/* --- credentials ----------------------------------------------------------- */
.au-stats { display: grid; gap: clamp(24px, 4vw, 48px); text-align: center; }
@media (min-width: 620px) { .au-stats { grid-template-columns: repeat(3, 1fr); } }
.au-stat { display: flex; flex-direction: column; gap: 8px; }
.au-stat__n {
  font-family: var(--au-serif); font-weight: 300; font-size: clamp(46px, 6vw, 72px);
  line-height: 1; color: var(--au-teal);
}
.au-stat__l { font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--au-muted); }

/* --- insights listing ------------------------------------------------------ */
.au-entries { display: grid; gap: 1px; background: var(--au-rule); border: 1px solid var(--au-rule); }
.au-entry { display: block; background: var(--au-white); padding: clamp(22px, 2.6vw, 30px);
  text-decoration: none; color: inherit; transition: background .18s ease; }
.au-entry:hover, .au-entry:focus-visible { background: var(--au-wash); }
.au-entry__meta { display: flex; gap: 14px; align-items: baseline; margin: 0 0 10px;
  font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--au-muted); }
.au-entry__tag { color: var(--au-teal); }
.au-entry__title { font-family: var(--au-serif); font-weight: 400;
  font-size: clamp(21px, 2.3vw, 27px); line-height: 1.25; margin: 0; color: var(--au-navy); max-width: 40ch; }
.au-entry__body { margin: 10px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--au-muted); max-width: 60ch; }
.au-entries_compact .au-entry { padding: 18px clamp(22px, 2.6vw, 30px); }
.au-entries_compact .au-entry__title { font-size: clamp(17px, 1.8vw, 20px); }

/* the t1241 hero lost its image column; let the text column use the full width */
#allrecords .t1241 .t-col_5 { width: 100%; max-width: 100%; }

/* --- article illustrations: keep, but make them recede ---------------------
   Full-bleed generated artwork reads as stock. Constrained and set slightly
   back, the same image reads as an illustration supporting the text. */
#allrecords .t107 .t-img {
  max-width: 520px;
  width: 100%;
  margin-inline: auto;
  opacity: 0.92;
}
#allrecords .t107 { padding-block: 8px; }
@media (max-width: 640px) { #allrecords .t107 .t-img { max-width: 100%; } }

/* non-linking card variant (Russian homepage has no Russian sub-pages to link to) */
.au-card_static { cursor: default; }
.au-card_static:hover { background: var(--au-white); }

/* --- FAQ list (practice pages) --------------------------------------------- */
.au-faq { display: grid; gap: 0; border-top: 1px solid var(--au-rule); }
.au-faq__item { padding: 26px 0; border-bottom: 1px solid var(--au-rule); }
.au-faq__q {
  font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(20px, 2.1vw, 24px); line-height: 1.3;
  margin: 0 0 10px; color: var(--au-navy); max-width: 44ch;
}
.au-faq__a {
  margin: 0; font-size: 16.5px; line-height: 1.7; color: var(--au-muted);
  max-width: var(--au-measure);
}
.au-faq__a a { color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-faq__a a:hover { color: var(--au-teal); border-bottom-color: var(--au-teal); }

/* --- prose internals (About, long-form pages) ------------------------------ */
.au-prose p { margin: 0 0 1.1em; }
.au-prose p:last-child { margin-bottom: 0; }
.au-prose a { color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-prose a:hover, .au-prose a:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }

.au-pull {
  margin: 1.4em 0; padding: 0 0 0 clamp(18px, 2.5vw, 28px);
  border-left: 2px solid var(--au-gold);
  font-family: var(--au-serif); font-style: italic;
  font-size: clamp(22px, 2.4vw, 28px); line-height: 1.4; color: var(--au-navy);
}
.au-pull p { margin: 0; }

.au-more { display: inline-block; margin-top: 10px; font-size: 15px; letter-spacing: .02em;
  color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-more:hover, .au-more:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }

/* --- credentials ----------------------------------------------------------- */
.au-defs { display: grid; gap: 1px; background: var(--au-rule); border: 1px solid var(--au-rule); }
@media (min-width: 700px) { .au-defs { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .au-defs { grid-template-columns: repeat(3, 1fr); } }
.au-def { background: var(--au-white); padding: clamp(22px, 2.6vw, 30px); }
.au-def__t {
  margin: 0 0 10px; font-family: var(--au-sans); font-size: 12px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--au-teal);
}
.au-def__d { margin: 0; font-size: 16px; line-height: 1.65; color: var(--au-navy); }

/* --- professional background ----------------------------------------------- */
.au-cv { display: grid; gap: 0; border-top: 1px solid var(--au-rule); }
.au-cv__item { padding: 26px 0; border-bottom: 1px solid var(--au-rule); display: grid; gap: 6px 32px; }
@media (min-width: 800px) { .au-cv__item { grid-template-columns: 150px 1fr; } }
.au-cv__when { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--au-muted); padding-top: 5px; }
.au-cv__role { margin: 0; font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(20px, 2vw, 24px); line-height: 1.25; color: var(--au-navy); }
.au-cv__where { margin: 2px 0 8px; font-size: 14px; color: var(--au-muted); }
.au-cv__body { margin: 0; font-size: 16px; line-height: 1.65; color: var(--au-muted); max-width: 62ch; }

/* --- bibliography ---------------------------------------------------------- */
.au-biblio { display: grid; gap: 0; }
.au-biblio__note + .au-biblio__group { border-top: 1px solid var(--au-rule); }

/* Folding groups: the same interaction as the FAQ, sized as an index label
   rather than a question. The tally tells a reader what is behind the fold. */
.au-biblio__group { border-bottom: 1px solid var(--au-rule); }
.au-biblio__t {
  display: flex; align-items: center; gap: 10px;
  margin: 0; padding: 18px 46px 18px 0; position: relative;
  cursor: pointer; list-style: none;
  font-family: var(--au-sans); font-size: 12px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--au-teal);
}
.au-biblio__t::-webkit-details-marker { display: none; }
.au-biblio__t:hover { color: var(--au-navy); }
.au-biblio__t:focus-visible { outline: 2px solid var(--au-teal); outline-offset: 3px; }
.au-biblio__n {
  font-size: 11px; font-weight: 400; letter-spacing: .06em;
  color: var(--au-muted); padding: 1px 7px;
  box-shadow: inset 0 0 0 1px var(--au-rule); border-radius: 999px;
}
.au-biblio__t::before, .au-biblio__t::after {
  content: ""; position: absolute; right: 4px; top: 50%;
  width: 15px; height: 1px; background: var(--au-gold);
  transition: transform .22s ease;
}
.au-biblio__t::after { transform: rotate(90deg); }
.au-biblio__group[open] > .au-biblio__t::after { transform: rotate(0deg); }
.au-biblio__group[open] > .au-biblio__t { color: var(--au-navy); }
.au-biblio__body { padding: 2px 0 26px; }
.au-biblio__list { margin: 0; padding: 0; list-style: none; }
.au-biblio__list li {
  padding: 12px 0; border-bottom: 1px solid var(--au-rule);
  font-size: 16px; line-height: 1.6; color: var(--au-navy); max-width: 74ch;
}
.au-biblio__list li:first-child { border-top: 1px solid var(--au-rule); }
.au-biblio__note { margin: 0 0 22px; font-size: 16px; line-height: 1.65; color: var(--au-muted); max-width: 66ch; }
.au-biblio__sub { margin: 0 0 8px; font-size: 15px; font-weight: 600; color: var(--au-navy); }

/* ===========================================================================
   Lists — rule-marked, no dots.
   A short gold rule replaces the bullet; items sit on generous leading so a
   list reads as prose rather than as a slide deck.
   .au-list_rule adds hairline separators for longer scannable enumerations.
   =========================================================================== */
.au-list, .au-prose ul, .au-card__body ul {
  margin: 0 0 1.15em; padding: 0; list-style: none;
}
.au-list > li, .au-prose ul > li, .au-card__body ul > li {
  position: relative; margin: 0; padding: 7px 0 7px 34px;
}
.au-list > li::before, .au-prose ul > li::before, .au-card__body ul > li::before {
  content: ""; position: absolute; left: 0; top: 0.78em;
  width: 18px; height: 1px; background: var(--au-gold);
}
.au-prose ul > li { line-height: 1.55; }
.au-card__body ul > li { padding-left: 26px; font-size: 15.5px; line-height: 1.6; }
.au-card__body ul > li::before { width: 14px; top: 0.72em; }
.au-card__body ul { margin-bottom: 0; }

.au-list_rule > li { border-top: 1px solid var(--au-rule); padding-top: 12px; padding-bottom: 12px; }
.au-list_rule > li:last-child { border-bottom: 1px solid var(--au-rule); }
.au-list_rule > li::before { top: 1.05em; }

/* ===========================================================================
   Process map — replaces step cards where a sequence is described.
   A numbered rail: the connector is a hairline, the node a small ruled
   numeral, so the sequence reads without boxing every stage.
   =========================================================================== */
.au-flow { display: grid; gap: 0; margin-top: 8px; }
.au-flow__step { position: relative; padding: 0 0 30px 62px; }
.au-flow__step::before {           /* the rail */
  content: ""; position: absolute; left: 15px; top: 8px; bottom: -8px;
  width: 1px; background: var(--au-rule);
}
.au-flow__step:last-child { padding-bottom: 0; }
.au-flow__step:last-child::before { display: none; }
.au-flow__n {
  position: absolute; left: 0; top: 0;
  width: 31px; height: 31px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--au-white); box-shadow: inset 0 0 0 1px var(--au-gold);
  font-family: var(--au-sans); font-size: 12px; font-weight: 600;
  letter-spacing: .04em; color: var(--au-navy);
}
.au-section_alt .au-flow__n { background: var(--au-paper); }
.au-flow__t {
  margin: 3px 0 8px; font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(20px, 2vw, 25px); line-height: 1.25; color: var(--au-navy);
}
.au-flow__b { margin: 0; font-size: 16px; line-height: 1.68; color: var(--au-muted); max-width: 62ch; }
.au-flow__b a { color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-flow__b a:hover, .au-flow__b a:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }

@media (min-width: 900px) {
  .au-flow_two { grid-template-columns: 1fr 1fr; column-gap: clamp(32px, 4vw, 64px); }
}

/* ===========================================================================
   Folding questions — native <details>, so every answer stays in the HTML
   for search engines and for find-in-page. No button chrome: a hairline row
   and a thin gold marker that rotates.
   =========================================================================== */
.au-faq__item { padding: 0; border-bottom: 1px solid var(--au-rule); }
.au-faq__q {
  margin: 0; padding: 22px 46px 22px 0; position: relative;
  cursor: pointer; list-style: none;
  font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(19px, 1.9vw, 23px); line-height: 1.35; color: var(--au-navy);
}
.au-faq__q::-webkit-details-marker { display: none; }
.au-faq__q:hover { color: var(--au-teal); }
.au-faq__q:focus-visible { outline: 2px solid var(--au-teal); outline-offset: 3px; }
.au-faq__q::before, .au-faq__q::after {   /* the + marker */
  content: ""; position: absolute; right: 4px; top: 50%;
  width: 15px; height: 1px; background: var(--au-gold);
  transition: transform .22s ease;
}
.au-faq__q::after { transform: rotate(90deg); }
.au-faq__item[open] > .au-faq__q::after { transform: rotate(0deg); }
.au-faq__item[open] > .au-faq__q { color: var(--au-teal); }
.au-faq__a { padding: 0 46px 26px 0; }

/* ===========================================================================
   Article layer (.au-article)
   The insight and news pages still carry Tilda's block markup. Tilda gives each
   record its own hand-set top/bottom padding (60/30, 45/60, 0/75 …), and the
   redactor text had no headings, paragraphs or list spacing of its own. This
   layer puts every article on one vertical rhythm and one measure.
   The #allrecords prefix is needed to outrank Tilda's own ID-scoped rules.
   =========================================================================== */
.au-article #allrecords .t-rec { padding-top: 0 !important; padding-bottom: 0 !important; }
.au-article #allrecords .t-rec > div:not(.au-section) { padding-block: clamp(26px, 3.4vw, 44px); }
/* a section already carries the site rhythm; do not pad it twice */
.au-article #allrecords .t-rec > .au-section { padding-block: clamp(40px, 6vw, 72px); }
.au-article #allrecords .t-rec:first-of-type > div { padding-top: clamp(44px, 6vw, 84px); }
.au-article #allrecords .t225 { padding-bottom: clamp(10px, 1.6vw, 20px); }

/* headline block */
.au-article :is(#allrecords .t225__uptitle, .au-post__meta) {
  margin-bottom: 22px; font-family: var(--au-sans); font-size: 12px;
  line-height: 1.9; letter-spacing: .14em; text-transform: uppercase;
  color: var(--au-muted);
}
.au-article :is(#allrecords .t225__title, .au-post__title) {   /* matches .au-hero__title */
  font-family: var(--au-serif); font-weight: 300;
  font-size: clamp(34px, 5vw, 60px); line-height: 1.06; color: var(--au-navy);
  margin: 0 0 22px; letter-spacing: -0.01em;
}
/* The standfirst is the article's lede and is styled as one on every article,
   in the same place under the headline: a gold rule and italic serif, set apart
   from the body without shouting. Two posts also carried a Tilda "preface"
   block; those are now ordinary opening paragraphs, so each article has exactly
   one styled intro. */
.au-article :is(#allrecords .t225__descr, .au-post__lede) {
  font-family: var(--au-serif); font-weight: 300; font-style: italic;
  font-size: clamp(19px, 2.2vw, 25px); line-height: 1.5;
  color: var(--au-navy); max-width: 34em;
  margin: 0; padding: 2px 0 2px clamp(18px, 2.4vw, 26px);
  border-left: 2px solid var(--au-gold);
}

/* body copy */
.au-article :is(#allrecords .t-text, .au-body) {   /* matches .au-prose */
  font-family: var(--au-serif); font-size: 21px; line-height: 1.6;
  color: var(--au-navy); max-width: var(--au-measure);
}
/* Descendant, not child: some posts wrap their body in redactor <div>s, so a
   child combinator left those paragraphs with no margin at all. */
.au-article :is(#allrecords .t-text, .au-body) p { margin: 0 0 1.15em; }
.au-article :is(#allrecords .t-text, .au-body) p:last-child { margin-bottom: 0; }
.au-article :is(#allrecords .t-text, .au-body) > div,
.au-article :is(#allrecords .t-text, .au-body) > div > div { margin: 0; }

/* section headings inside an article */
.au-article :is(#allrecords .t-text, .au-body) .au-ah {
  font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(23px, 2.4vw, 31px); line-height: 1.25; color: var(--au-navy);
  margin: 2em 0 .55em; letter-spacing: -0.005em;
}
.au-article :is(#allrecords .t-text, .au-body) .au-ah:first-child,
.au-article :is(#allrecords .t-text, .au-body) > div:first-child > .au-ah:first-child,
.au-article :is(#allrecords .t-text, .au-body) > div > div:first-child > .au-ah:first-child { margin-top: 0; }

/* the redactor's <figure><hr></figure> dividers, on one hairline */
.au-article :is(#allrecords .t-text, .au-body) figure { margin: 0; }
.au-article :is(#allrecords .t-text, .au-body) hr {
  height: 0; margin: 2em 0; border: 0; border-top: 1px solid var(--au-rule);
}
.au-article :is(#allrecords .t-text, .au-body) hr + .au-ah,
.au-article :is(#allrecords .t-text, .au-body) figure + .au-ah { margin-top: 1.1em; }
.au-article :is(#allrecords .t-text, .au-body) blockquote {
  margin: 1.4em 0; padding: 0 0 0 clamp(18px, 2.5vw, 28px);
  border-left: 2px solid var(--au-gold); font-style: italic; color: var(--au-navy);
}
.au-article :is(#allrecords .t-text, .au-body) blockquote p:last-child { margin-bottom: 0; }

/* lists: one marker system across the site — a short gold rule, never a dot */
.au-article :is(#allrecords .t-text, .au-body) ul,
.au-article :is(#allrecords .t-text, .au-body) ol {
  margin: 0 0 1.15em; padding: 0; list-style: none; counter-reset: au-li;
}
.au-article :is(#allrecords .t-text, .au-body) li {
  position: relative; margin: 0; padding: 5px 0 5px 36px; line-height: 1.55;
}
.au-article :is(#allrecords .t-text, .au-body) ul > li::before {
  content: ""; position: absolute; left: 0; top: .85em;
  width: 18px; height: 1px; background: var(--au-gold);
}
.au-article :is(#allrecords .t-text, .au-body) ol > li { counter-increment: au-li; }
.au-article :is(#allrecords .t-text, .au-body) ol > li::before {
  content: counter(au-li) "."; position: absolute; left: 0; top: 6px;
  font-variant-numeric: tabular-nums; font-size: 15px; color: var(--au-gold);
}
.au-article :is(#allrecords .t-text, .au-body) li > p { margin: 0; }

/* article illustration: same gutters and centring as the text column */
.au-article #allrecords .t107 { padding-inline: 20px; }
.au-article :is(#allrecords .t107 .t-img, .au-post__figure img) {
  display: block; margin-inline: auto; max-width: min(100%, 620px);
}

/* author line / trailing note */
.au-article :is(#allrecords .t-text, .au-body)_xs { font-size: 14px; color: var(--au-muted); }

/* images carry intrinsic width/height now (so the browser reserves the box and
   the page does not jump on load); keep them fluid all the same */
#allrecords img, .au-page img { max-width: 100%; height: auto; }

.au-def__d a { color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-def__d a:hover, .au-def__d a:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }

/* ===========================================================================
   About hero — deliberately not the homepage hero.
   Portrait first and square-cropped rather than landscape, no call-to-action
   buttons (the reader is already inside the site), and the name carries the
   headline with the role set beneath it.
   =========================================================================== */
.au-lede_profile { padding-bottom: clamp(28px, 4vw, 48px); }
@media (min-width: 900px) {
  .au-lede_profile .au-lede__grid { grid-template-columns: 340px 1fr; align-items: center; }
}
.au-lede_profile .au-lede__figure { max-width: 340px; }
.au-lede_profile .au-lede__figure img { border-radius: 2px; }
.au-lede_profile .au-lede__title {
  font-size: clamp(38px, 5.2vw, 66px); line-height: 1.05; margin-bottom: 10px;
}
.au-lede__role {
  margin: 0 0 22px; font-family: var(--au-serif); font-style: italic;
  font-size: clamp(19px, 2vw, 24px); line-height: 1.3; color: var(--au-teal);
}
.au-lede_profile .au-lede__sub { max-width: 54ch; }

/* ===========================================================================
   Flip cards — arbitral institutions on /isds.
   Both faces stay in the markup and in the layout (stacked in one grid cell),
   so the card sizes to the taller face and nothing is hidden from search.
   =========================================================================== */
.au-flip { display: grid; gap: 1px; background: var(--au-rule); border: 1px solid var(--au-rule); }
@media (min-width: 760px) { .au-flip { grid-template-columns: 1fr 1fr; } }
.au-flip__card { background: var(--au-white); perspective: 1600px; }
/* The canonical 3D card: one rigid object turning in the perspective of its
   parent. .au-flip__inner is the direct child of the perspective element, which
   is what the property requires — that was the bug before. The faces stay grid
   items in a single cell, so the card still sizes to the taller of the two and
   both faces remain in the markup for search. transform-style: preserve-3d is
   what puts the faces into the card's 3D space; grid does not flatten it. */
.au-flip__inner {
  display: grid; height: 100%;
  transform-style: preserve-3d;
  transition: transform .65s cubic-bezier(.2, .7, .2, 1);
}
.au-flip__card.is-flipped .au-flip__inner { transform: rotateY(180deg); }
/* Hover reveals the back; a click pins it there and a second click sends it
   home. Pointer devices only — there is no hover on touch, where the click
   toggle is the whole interaction. .no-hover is set for the moment after an
   unpinning click, while the pointer is still over the card. */
@media (hover: hover) and (pointer: fine) {
  .au-flip__card:not(.is-flipped):not(.no-hover):hover .au-flip__inner { transform: rotateY(180deg); }
}
.au-flip__face {
  grid-area: 1 / 1;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  padding: clamp(26px, 3vw, 36px); text-align: left;
  background: var(--au-white); border: 0; font: inherit; color: inherit;
}
.au-flip__back { transform: rotateY(180deg); }
/* whichever face is turned away must not take the click */
.au-flip__card { cursor: pointer; }
.au-flip__back { pointer-events: none; }
.au-flip__card.is-flipped .au-flip__back { pointer-events: auto; }
.au-flip__card.is-flipped .au-flip__front { pointer-events: none; }
@media (hover: hover) and (pointer: fine) {
  .au-flip__card:not(.is-flipped):not(.no-hover):hover .au-flip__back { pointer-events: auto; }
  .au-flip__card:not(.is-flipped):not(.no-hover):hover .au-flip__front { pointer-events: none; }
}

.au-flip__front {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  justify-content: center;   /* the back face sets the height; centre the front in it */
  width: 100%; cursor: pointer;
}
.au-flip__front:hover, .au-flip__front:focus-visible { background: var(--au-wash); }
.au-flip__front:focus-visible { outline: 2px solid var(--au-teal); outline-offset: -4px; }
.au-flip__abbr {
  font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(30px, 3.4vw, 42px); line-height: 1; color: var(--au-navy);
}
.au-flip__name { font-size: 15px; line-height: 1.5; color: var(--au-muted); max-width: 34ch; }
.au-flip__count {
  margin-top: 6px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--au-teal); padding: 3px 9px; box-shadow: inset 0 0 0 1px var(--au-rule);
  border-radius: 999px;
}
.au-flip__front::after {
  content: ""; position: absolute; right: 22px; bottom: 22px;
  width: 16px; height: 16px; border-right: 1px solid var(--au-gold);
  border-bottom: 1px solid var(--au-gold); transform: rotate(-45deg);
}
.au-flip__front { position: relative; }

.au-flip__back { display: flex; flex-direction: column; gap: 12px; }
.au-flip__bt {
  margin: 0; font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--au-teal); font-weight: 600;
}
.au-flip__list { margin: 0; padding: 0; list-style: none; }
.au-flip__list li {
  position: relative; padding: 6px 0 6px 26px;
  font-size: 15.5px; line-height: 1.6; color: var(--au-navy);
}
.au-flip__list li::before {
  content: ""; position: absolute; left: 0; top: .82em;
  width: 14px; height: 1px; background: var(--au-gold);
}
.au-flip__return {
  align-self: flex-start; margin-top: auto; padding: 0; border: 0; background: none;
  cursor: pointer; font: inherit; font-size: 13px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--au-navy);
  border-bottom: 1px solid var(--au-gold);
}
.au-flip__return:hover, .au-flip__return:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }
/* A.U. wants the rotation everywhere, so there is one code path and no
   suppression branch. Under prefers-reduced-motion it still turns, just faster
   and with a flatter easing — the trade-off is noted in the brand doc. Nothing
   here may use visibility or display to swap the faces: a face that is hidden
   at the moment the class changes cannot transition, which is what turns a
   flip into an instant text swap. */
@media (prefers-reduced-motion: reduce) {
  .au-flip__inner { transition: transform .3s ease-out; }
}

/* ===========================================================================
   Roadmap — /isds "How I work through a case".
   Stages alternate either side of the column, so the line that threads the
   numbered dots meanders rather than running straight. The path is drawn from
   the measured dot positions, so it stays accurate at any text length or width.
   Without JS the straight rail below is what shows.
   =========================================================================== */
.au-road { position: relative; margin-top: 12px; }
.au-road__line {
  position: absolute; inset: 0; width: 100%; height: 100%;
  color: var(--au-rule); pointer-events: none; z-index: 0; display: none;
}
.au-road.is-drawn .au-road__line { display: block; }
.au-road__steps { list-style: none; margin: 0; padding: 0; position: relative; z-index: 1; }
.au-road__step { position: relative; padding: 0 0 34px 62px; }
.au-road__step:last-child { padding-bottom: 0; }
.au-road__n {
  position: absolute; left: 0; top: 0;
  width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--au-white); box-shadow: inset 0 0 0 1px var(--au-gold);
  font-family: var(--au-sans); font-size: 12px; font-weight: 600; color: var(--au-navy);
}
.au-section_alt .au-road__n { background: var(--au-paper); }
.au-road__t {
  margin: 4px 0 8px; font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(20px, 2vw, 25px); line-height: 1.25; color: var(--au-navy);
}
.au-road__b { margin: 0; font-size: 16px; line-height: 1.68; color: var(--au-muted); }
.au-road__b a { color: var(--au-navy); border-bottom: 1px solid var(--au-gold); text-decoration: none; }
.au-road__b a:hover, .au-road__b a:focus-visible { color: var(--au-teal); border-bottom-color: var(--au-teal); }

/* straight fallback rail, replaced by the drawn path */
.au-road__step::before {
  content: ""; position: absolute; left: 17px; top: 38px; bottom: -4px;
  width: 1px; background: var(--au-rule);
}
.au-road__step:last-child::before { display: none; }
.au-road.is-drawn .au-road__step::before { display: none; }

@media (min-width: 860px) {
  /* 40% columns leave a 20%-of-width swing between the odd and even dots,
     which is what gives the drawn line its wave */
  .au-road__step { width: 40%; padding-left: 0; padding-bottom: 26px; }
  .au-road__step:nth-child(odd)  { margin-right: auto; padding-right: 62px; text-align: right; }
  .au-road__step:nth-child(even) { margin-left: 60%;   padding-left: 62px; }
  .au-road__step:nth-child(odd) .au-road__n  { left: auto; right: 0; }
  .au-road__step:nth-child(even) .au-road__n { left: 0; right: auto; }
  .au-road__step:nth-child(even) { margin-top: -14px; }
  .au-road__b { max-width: 40ch; }
  .au-road__step:nth-child(odd) .au-road__b { margin-left: auto; }
}

/* first five questions show; the rest stay in the markup behind a button */
.au-faq__more[hidden] { display: none; }
.au-faq__toggle {
  justify-self: start; margin-top: 22px; padding: 11px 20px;
  background: none; border: 0; box-shadow: inset 0 0 0 1px var(--au-rule);
  cursor: pointer; font: inherit; font-family: var(--au-sans);
  font-size: 13px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--au-navy);
}
.au-faq__toggle:hover, .au-faq__toggle:focus-visible { background: var(--au-navy); color: #fff; }
.au-faq__toggle:focus-visible { outline: 2px solid var(--au-teal); outline-offset: 2px; }

/* ===========================================================================
   Numbered steps inside an article.
   These arrived as pseudo-headings ("1.Map your dispute…") sitting at the same
   level as the real section heading, with no space after the number. They are a
   sequence, so they read as an ordered list: the number comes from a counter,
   the step title is a rank below the section heading, and the explanation is a
   paragraph under it.
   =========================================================================== */
.au-article :is(#allrecords .t-text, .au-body) .au-steps {
  margin: 0 0 1.15em; padding: 0; list-style: none; counter-reset: au-step;
}
.au-article :is(#allrecords .t-text, .au-body) .au-steps > li {
  counter-increment: au-step; position: relative;
  padding: 0 0 20px 52px; margin: 0; line-height: inherit;
}
.au-article :is(#allrecords .t-text, .au-body) .au-steps > li:last-child { padding-bottom: 0; }
.au-article :is(#allrecords .t-text, .au-body) .au-steps > li::before {
  content: counter(au-step); position: absolute; left: 0; top: 2px;
  width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 0 0 1px var(--au-gold); background: none;
  font-family: var(--au-sans); font-size: 12px; font-weight: 600;
  color: var(--au-navy);
}
.au-steps__t {
  margin: 0 0 .3em; font-family: var(--au-serif); font-weight: 500;
  font-size: clamp(19px, 1.9vw, 23px); line-height: 1.3; color: var(--au-navy);
}
.au-article :is(#allrecords .t-text, .au-body) .au-steps p:last-child { margin-bottom: 0; }

/* sub-section heading, a rank below .au-ah */
.au-article :is(#allrecords .t-text, .au-body) .au-ah_sub {
  font-size: clamp(19px, 1.9vw, 24px); font-style: italic;
  margin: 1.5em 0 .45em; color: var(--au-navy);
}

/* ===========================================================================
   Roadmap, track variant — /investors "From Harm to Global Enforcement".
   A different object from the /isds roadmap on purpose: four phases run left to
   right rather than zigzagging down, the dots step alternately up and down to
   give the drawn line its wave, and the line is dashed — a route rather than a
   rail. Below 860px it falls back to the same vertical rail as everywhere else.
   =========================================================================== */
@media (min-width: 860px) {
  .au-road_track .au-road__steps {
    display: grid; grid-template-columns: repeat(4, 1fr);
    column-gap: clamp(20px, 2.6vw, 36px); align-items: start;
  }
  .au-road_track .au-road__step:nth-child(odd),
  .au-road_track .au-road__step:nth-child(even) {
    width: auto; margin: 0; padding: 56px 0 0; text-align: left;
  }
  /* the alternating drop is what the drawn path waves through */
  .au-road_track .au-road__step:nth-child(even) { padding-top: 92px; }
  /* specificity has to match the base nth-child rules these replace */
  .au-road_track .au-road__step:nth-child(odd) .au-road__n,
  .au-road_track .au-road__step:nth-child(even) .au-road__n {
    left: 0; right: auto; top: 0;
    width: 40px; height: 40px; font-size: 13px;
    background: var(--au-paper); box-shadow: inset 0 0 0 1px var(--au-gold);
  }
  /* the even phases drop, so the drawn route rises and falls across the track */
  .au-road_track .au-road__step:nth-child(even) .au-road__n { top: 36px; }
  .au-road_track .au-road__step::before { display: none; }
  .au-road_track .au-road__t { margin-top: 0; font-size: clamp(18px, 1.7vw, 22px); }
  .au-road_track .au-road__step:nth-child(odd) .au-road__b,
  .au-road_track .au-road__step:nth-child(even) .au-road__b {
    font-size: 15.5px; max-width: none; margin-left: 0;
  }
}

/* the article pages take their body ground from Tilda; put them on the same
   tinted base as the rebuilt pages so the two templates do not differ */
.au-article, .au-article #allrecords { background: var(--au-white); }
.au-article #allrecords .t-rec { background-color: transparent; }
.au-article :is(#allrecords .t265__wrapper, .au-post__note) { padding: clamp(20px, 2.4vw, 28px); }

/* ===========================================================================
   Article fine print (Tilda's t265 callout, and .au-post__note on generated
   posts). It shipped with a coral exclamation icon, which reads as a warning;
   this is routine practice fine print, not an alert. It is now its own closing
   band at the foot of the article rather than trailing body copy, on a narrower
   measure so it does not read as one grey slab.
   =========================================================================== */
/* The grounds alternate down an article: body on the base, FAQ on the band,
   disclaimer back on the base, then the footer's band. So the disclaimer is not
   a band itself — a hairline separates it from whatever precedes it. */
.au-article :is(#allrecords .t265, .au-post__note) {
  background: var(--au-white); border-top: 1px solid var(--au-rule);
  /* No top margin: it rendered as a strip of the base colour between the FAQ
     band and the rule. The band's own bottom padding and this block's top
     padding already separate them. */
  padding-block: clamp(26px, 3vw, 40px);
}
/* an article FAQ sits on the band, like a section anywhere else on the site */
.au-article .au-post__faq { background: var(--au-paper); }
.au-article #allrecords .t265__wrapper { background: none; padding: 0; display: block; }
.au-article :is(#allrecords .t265__text, .au-post__note) p {
  font-family: var(--au-sans); font-style: normal;
  font-size: 13.5px; line-height: 1.7; color: var(--au-muted);
  max-width: 68ch; margin: 0 0 .9em; text-align: left;
}
.au-article :is(#allrecords .t265__text, .au-post__note) p:last-child { margin-bottom: 0; }


/* ===========================================================================
   Clean post scaffold — what _templates/new-post.py generates.
   New posts carry no Tilda markup at all; the article typography above is
   shared with the imported pages through :is(), so there is one set of rules.
   =========================================================================== */
.au-post { padding: clamp(44px, 6vw, 84px) 0 clamp(40px, 6vw, 72px); }
.au-post__wrap { max-width: 860px; margin: 0 auto; padding: 0 var(--au-gutter); }
.au-post__figure { margin: clamp(26px, 3.4vw, 44px) 0; }
.au-post__figure img { display: block; }
.au-post__figure figcaption {
  margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--au-muted);
}
.au-post__body { margin-top: clamp(26px, 3.4vw, 44px); }
.au-post__note { margin-top: clamp(32px, 4vw, 52px); }
.au-post__faq { margin-top: clamp(36px, 4.5vw, 60px); }
.au-post__faq > h2 {
  margin: 0 0 6px; font-family: var(--au-sans); font-size: 12px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--au-teal);
}

/* ===========================================================================
   Article tables (Quill's markup, from a paste into the old editor).
   Quill ships table-layout:fixed with a <colgroup> of 0.00% columns, so six
   columns split the width evenly and headings like "Turkmenistan" wrapped their
   last letter onto its own line. Sizing to content and scrolling sideways when
   it will not fit is the fix; the wrapper also had user-select:none, which
   stopped anyone copying a figure out of the table.
   =========================================================================== */
.au-article :is(#allrecords .t-text, .au-body) .quill-table__wrapper,
.au-article :is(#allrecords .t-text, .au-body) table { user-select: text; -webkit-user-select: text; }
.au-article :is(#allrecords .t-text, .au-body) .quill-table__wrapper {
  overflow-x: auto; margin: 0 0 1.15em;
  -webkit-overflow-scrolling: touch;
}
.au-article :is(#allrecords .t-text, .au-body) table {
  table-layout: auto; width: auto; min-width: 100%;
  border-collapse: collapse; font-family: var(--au-sans);
  font-size: 14.5px; line-height: 1.5; color: var(--au-navy);
}
.au-article :is(#allrecords .t-text, .au-body) td,
.au-article :is(#allrecords .t-text, .au-body) th {
  border: 0; border-bottom: 1px solid var(--au-rule);
  padding: 10px 16px 10px 0; text-align: left; vertical-align: top;
  word-wrap: normal; white-space: nowrap;
}
.au-article :is(#allrecords .t-text, .au-body) td:last-child,
.au-article :is(#allrecords .t-text, .au-body) th:last-child { padding-right: 0; }
/* the first row is the header: small caps, teal, ruled beneath */
.au-article :is(#allrecords .t-text, .au-body) tr:first-child td,
.au-article :is(#allrecords .t-text, .au-body) th {
  font-size: 11.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--au-teal); border-bottom: 1px solid var(--au-navy); padding-bottom: 8px;
}
.au-article :is(#allrecords .t-text, .au-body) tr:first-child td strong { font-weight: 600; }
/* the first column carries the row label, so it may wrap */
.au-article :is(#allrecords .t-text, .au-body) td:first-child { white-space: normal; min-width: 20ch; }
.au-article :is(#allrecords .t-text, .au-body) table p { margin: 0; }

/* ===========================================================================
   Touch targets.
   On a phone the language switcher measured 14px tall and the footer links
   16–17px. WCAG 2.5.8 asks for at least 24x24 CSS pixels for a pointer target,
   and a thumb is not a mouse. Padding only — nothing moves on desktop.
   =========================================================================== */
@media (max-width: 860px) {
  #au-header .au-nav__lang { padding: 6px 4px; }
  #au-header .au-header__name { padding: 4px 0; }
  #au-footer .au-footer__nav { gap: 2px 26px; }
  #au-footer .au-footer__nav a { padding: 6px 0; }
  .au-fineprint a { padding: 4px 0; display: inline-block; }
  .au-contact a.au-contact__item { padding-block: 4px; }
}
