/* Claim pages (2026-10-03, DRAFT): /flight-compensation/<airline>/ and /flight-compensation/<country>/,
   made by scripts/claim_pages.py from claims-data.json and claim-page.html. They stand on guide.css
   (the frame, the letter, the app split, the price box) and add four small things: a top without a
   picture, rows of "label: what the rules say", the card that says where a claim goes, and the
   link lists. Layout and colour roles only; the links keep the reading pages' own hover (page.css),
   so there is no duration or curve here at all. Only built with AC_DRAFT=1. */

/* the top: words only, so the airline's or the country's name is the picture */
.g-top.g-top--plain { grid-template-columns: minmax(0, 1fr); }
.doc.guide .g-top--plain h1 { font-size: clamp(34px, 4.8vw, 60px); max-width: 17em; }
.doc.guide .g-top--plain .intro { max-width: 34em; }

/* rows: what a route or a rule is called, and what the rules say about it */
.c-facts { display: grid; margin: 20px 0 14px; border-top: 1px solid var(--line); }
.c-facts > div { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); gap: 6px 24px; padding: 14px 2px; border-bottom: 1px solid var(--line); }
.c-facts dt, .c-facts dd { margin: 0; font-size: 17px; line-height: 1.4; color: var(--ink); text-wrap: pretty; }
.c-facts dt { color: var(--soft); }
.c-facts dd b { display: block; }
.c-facts--rules > div { grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr); }

/* where the claim goes: the one thing the page is for, on its own card */
.c-where { margin: 20px 0 18px; padding: clamp(20px, 3vw, 30px); background: var(--tile); border-radius: 28px; display: grid; gap: 6px; }
.doc .c-where p { margin: 0; }
.doc .c-where .c-where__link { font-size: clamp(20px, 2vw, 24px); line-height: 1.25; font-weight: 600; }
.doc.guide .read .c-where a { display: inline-flex; align-items: center; min-height: 44px; }
.doc .c-where .c-where__host { font-size: 14px; line-height: 1.43; color: var(--soft); overflow-wrap: anywhere; }

/* the airlines of a country, and the lists that lead to the other pages */
.doc .c-links { list-style: none; margin: 16px 0 8px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0 24px; }
.doc .c-links li { margin: 0; padding: 0; }
.doc.guide .read .c-links a { display: inline-flex; align-items: center; min-height: 44px; }
.guide .g-col > h2.c-second { margin-top: clamp(36px, 5vw, 56px); }

@media (max-width: 520px) {
  .c-facts > div, .c-facts--rules > div { grid-template-columns: 1fr; }
  .doc .c-links { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 0 16px; }
}