/* Shared by the two static pages. Deliberately not part of the Angular bundle: these must load
   even if the app fails to, because Apple checks them and a customer reads them when something
   has already gone wrong. */
:root {
  --ground: #FBF8F1; --surface: #FFFFFF; --line: #E9E2D6;
  --ink: #17251F; --muted: #5F6E65; --jade: #00795A; --jade-tint: #D3F2E4; --jade-deep: #00563F;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--ground); color: var(--ink);
  font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 720px; margin: 0 auto; padding: 40px 22px 80px; }
header { display: flex; align-items: center; gap: 12px; margin-bottom: 34px; }
header .mark {
  width: 38px; height: 38px; border-radius: 11px; background: var(--jade);
  display: grid; place-items: center; flex: 0 0 38px;
}
header .mark svg { width: 20px; height: 20px; stroke: #fff; fill: none; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round; }
header b { font-size: 17px; letter-spacing: -0.01em; }
header a { color: inherit; text-decoration: none; display: flex; align-items: center; gap: 12px; }
h1 { font-size: clamp(28px, 6vw, 38px); line-height: 1.12; letter-spacing: -0.02em; margin: 0 0 6px; }
h2 { font-size: 20px; letter-spacing: -0.01em; margin: 38px 0 10px; }
h3 { font-size: 15px; margin: 24px 0 6px; }
p, li { color: var(--muted); }
p { margin: 0 0 14px; }
ul, ol { margin: 0 0 14px; padding-left: 20px; }
li { margin-bottom: 7px; }
strong, b { color: var(--ink); font-weight: 600; }
.updated { font-size: 14px; color: var(--muted); margin-bottom: 30px; }
a { color: var(--jade-deep); }
table { border-collapse: collapse; width: 100%; margin: 0 0 18px; font-size: 15px; }
th, td { text-align: left; padding: 9px 14px 9px 0; border-bottom: 1px solid var(--line);
  vertical-align: top; color: var(--muted); }
th { font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink); }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
  padding: 18px 20px; margin: 0 0 18px; }
.card.mark { border-left: 3px solid var(--jade); }
.card p:last-child, .card ul:last-child { margin-bottom: 0; }
.contact { background: var(--jade-tint); border: 1px solid var(--jade); border-radius: 12px;
  padding: 20px; }
.contact p { color: var(--jade-deep); }
.contact a { color: var(--jade-deep); font-weight: 600; }
footer { margin-top: 50px; padding-top: 20px; border-top: 1px solid var(--line);
  font-size: 13.5px; color: var(--muted); }
footer a { color: var(--muted); }
@media (prefers-color-scheme: dark) {
  :root { --ground: #121815; --surface: #1A211D; --line: #2B332E;
          --ink: #ECF1EE; --muted: #9FAEA6; --jade-tint: #123026; --jade-deep: #7FD9B4; }
}