/* ancile.no — self-contained styles. No third-party requests (CLAUDE.md A.4).
   Targets WCAG 2.2 AAA (CLAUDE.md C.18): 1.4.6 contrast >=7:1 body,
   2.5.5 target size >=44px, visible focus, semantic structure. */
:root {
  --ink: #1a1a1a;     /* ~16:1 on white */
  --bg: #ffffff;
  --muted: #4a4a4a;   /* ~8.9:1 on white — AAA even for normal text */
  --link: #0a3d91;    /* ~9:1 on white */
  --rule: #d7d7d7;
  --map-bg: #e9edf1;
  --map-road: #ced6df;
  --map-pin: #0a3d91;
  --max: 44rem;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 1.0625rem/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  padding: 0 1.25rem;
}
.skip { position: absolute; left: -9999px; }
.skip:focus { position: static; display: inline-block; padding: .75rem 0; }
a { color: var(--link); }
a:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }
header.site { max-width: var(--max); margin: 0 auto; padding: 1.25rem 0 .5rem; border-bottom: 1px solid var(--rule); }
header.site .brand { font-weight: 700; font-size: 1.25rem; letter-spacing: .01em; text-decoration: none; color: var(--ink); display: inline-block; padding: .4rem 0; }
nav.site { margin-top: .25rem; }
/* inline-block + padding gives each nav link a >=44px target (2.5.5 AAA) */
nav.site a { display: inline-block; padding: .65rem .6rem; margin: 0 .3rem 0 -.6rem; text-decoration: underline; }
nav.site a.lang { font-weight: 600; }
main { max-width: var(--max); margin: 0 auto; padding: 1.5rem 0 2rem; }
main a, footer.site a { text-decoration: underline; }
h1 { font-size: 1.9rem; line-height: 1.25; margin: 0 0 1rem; }
h2 { font-size: 1.25rem; margin: 2rem 0 .5rem; }
h3 { font-size: 1.05rem; margin: 1.5rem 0 .35rem; }
p, li { color: var(--ink); }
.lede { font-size: 1.15rem; }
dl.info { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1.5rem; margin: 1.25rem 0; }
dl.info dt { font-weight: 600; color: var(--muted); }
dl.info dd { margin: 0; }
/* Location: self-contained inline-SVG map (no third-party tiles) + a link out. */
.location { margin: 1rem 0 1.5rem; }
.map { width: 100%; max-width: 26rem; height: auto; display: block; border: 1px solid var(--rule); border-radius: 14px; }
.map-bg { fill: var(--map-bg); }
.map-road { stroke: var(--map-road); stroke-width: 7; fill: none; stroke-linecap: round; }
.map-road-min { stroke-width: 3.5; }
.map-pin { fill: var(--map-pin); }
.map-dot { fill: var(--map-bg); }
.location address { font-style: normal; margin: .6rem 0 0; }
footer.site { max-width: var(--max); margin: 0 auto; padding: 1.5rem 0 3rem; border-top: 1px solid var(--rule); color: var(--muted); font-size: .9rem; }
@media (max-width: 30rem) {
  dl.info { grid-template-columns: 1fr; gap: .15rem; }
  dl.info dd { margin-bottom: .7rem; }
}
@media (prefers-color-scheme: dark) {
  :root {
    --ink: #f2f2f2; --bg: #111315; --muted: #c9c9c9; --link: #a9c1ff; --rule: #33373b;
    --map-bg: #1b2026; --map-road: #2f363f; --map-pin: #a9c1ff;
  }
}