/* Legal pages (privacy, terms, how we make money, how we rank, who we are) on both sites:
   one readable column. Depends on tokens.css, base.css, catalog.css and city.css (crumbs). */
.legal{max-width:780px;padding:26px 0 90px}
.legal h1{font-size:var(--fs-h1);line-height:var(--lh-tight);margin-top:16px}
.legal .updated{font-size:var(--fs-sm);color:var(--pewter);margin-top:12px}
.legal .draft{margin-top:18px;background:var(--terracotta);border-left:3px solid var(--brass);padding:14px 18px;font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--ink)}
.legal .lede{font-size:var(--fs-md);line-height:var(--lh-body);color:var(--graphite);margin-top:22px;max-width:62ch}
.legal section{padding:0;margin-top:38px;scroll-margin-top:110px}   /* base.css pads every section 80px */
.legal h2{font-size:var(--fs-2xl);line-height:var(--lh-tight)}
.legal section p{font-size:var(--fs-md);line-height:var(--lh-body);color:var(--graphite);margin-top:12px;max-width:68ch}
.legal section p b{color:var(--ink);font-weight:600}
.legal a{color:var(--forest);text-decoration:underline;text-decoration-color:var(--sky-3);text-underline-offset:4px}
.legal .crumbs a{text-decoration:none}
/* a gap or a note for the lawyer, until legal.REVIEWED is True */
.legal .todo{background:var(--terracotta);color:var(--ink);padding:1px 5px;font-size:.92em}
/* the 404 page (11 Oct 2026): the brand's arch round the number, then the way back */
.nf{margin-top:28px}
.nf-arch{width:120px;height:140px;color:var(--brass)}
.nf-arch text{font:400 30px var(--serif);fill:var(--navy)}
.nf p{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.nf h2{margin-top:36px}
/* the site map (12 Oct 2026): main pages in columns, then each country with its cities */
.sitemap{max-width:1200px}
.sitemap h2{margin-top:40px}
.sm-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:24px;margin-top:16px}
.sm-col h3,.sm-country h3{font:400 var(--fs-xl)/var(--lh-tight) var(--serif);color:var(--navy)}
.sm-col ul,.sm-cities{list-style:none;margin:10px 0 0;padding:0}
.sm-col li{padding:6px 0;border-top:1px solid var(--moss)}
.sm-note{color:var(--pewter);margin-top:8px}
.sm-countries{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));gap:30px 36px;margin-top:20px}
.sm-country{min-width:0}
.sm-top{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:6px;font-weight:500}
.sm-cities li{display:grid;grid-template-columns:120px 1fr;gap:4px 12px;padding:7px 0;border-top:1px solid var(--moss);font-size:var(--fs-sm)}
.sm-cities b{color:var(--navy);font-weight:600;overflow-wrap:anywhere}
.sm-cities span{display:flex;flex-wrap:wrap;gap:4px 14px}
.sitemap a{color:var(--forest)}
@media(max-width:520px){.sm-cities li{grid-template-columns:1fr}}

/* Photo credits (15 Oct 2026): one line per photo */
.credits{list-style:none;margin-top:24px;columns:2 360px;column-gap:40px}
.credits li{break-inside:avoid;padding:8px 0;border-top:1px solid var(--moss);font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--graphite)}
.credits b{color:var(--ink);font-weight:600}

/* Tours and activities hub (15 Oct 2026) */
.hub-country{border-top:1px solid var(--moss)}
.hub-country summary{cursor:pointer;padding:14px 0;font:600 var(--fs-lg) var(--sans);color:var(--navy)}
.hub-cities{list-style:none;padding-bottom:14px}
.hub-cities li{padding:10px 0;border-top:1px dashed var(--moss)}
.hub-cities h3{font:600 var(--fs-md) var(--sans)}
.hub-cities p{font-size:var(--fs-sm);margin-top:4px;line-height:1.9}
.hub-cities p a{margin-right:14px;display:inline-block}
