/* FnF Competitions - "facts 'n' figures": pine green, mustard ticket stock, tomato ink, graph paper. */
:root {
  --pine: #123d33;
  --pine-2: #0b2a23;
  --pine-3: #1d5a4b;
  --mustard: #e9b72f;
  --mustard-l: #f6dc8c;
  --tomato: #d9512c;
  --paper: #f6f1e4;
  --card: #fffdf6;
  --ink: #1b211e;
  --muted: #56625c;
  --line: #ddd3bc;
  --grid: rgba(18, 61, 51, .07);
  --serif: 'Gloock', Georgia, 'Times New Roman', serif;
  --sans: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'Spline Sans Mono', ui-monospace, Menlo, Consolas, monospace;
  --r: 14px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.65 var(--sans); overflow-x: hidden; }
img, svg { max-width: 100%; }
a { color: var(--pine-3); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--tomato); }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.12; margin: 0 0 .5em; letter-spacing: -.005em; }
h1 { font-size: clamp(2.2rem, 6vw, 3.9rem); }
h2 { font-size: clamp(1.6rem, 3.6vw, 2.3rem); }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1em; }
.ic { flex: none; vertical-align: -.2em; }
.shell { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 700px) { .shell { padding: 0 28px; } }
.narrow { max-width: 780px; }
.skip { position: absolute; left: 8px; top: -60px; background: var(--mustard); color: var(--ink); padding: 8px 14px; z-index: 99; border-radius: 6px; }
.skip:focus { top: 8px; }
:focus-visible { outline: 3px solid var(--tomato); outline-offset: 2px; }

/* ---------- Masthead ---------- */
.mast { background: var(--pine); color: #fff; position: relative; }
.mast__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 76px; flex-wrap: wrap; }
.brandmark { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; }
.brandmark:hover { color: #fff; }
.brandmark__txt { font: 400 1.35rem/1 var(--serif); }
.brandmark__txt b { color: var(--mustard); font-weight: 400; }
.brandmark__txt small { display: block; font: 500 .7rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.65); margin-top: 5px; }
.burger { display: flex; flex-direction: column; gap: 4px; align-items: center; background: none; border: 1.5px solid rgba(255,255,255,.35); border-radius: 10px; padding: 9px 11px 6px; color: #fff; cursor: pointer; }
.burger span { display: block; width: 20px; height: 2px; background: var(--mustard); border-radius: 2px; }
.burger em { font: 600 .6rem var(--mono); font-style: normal; letter-spacing: .1em; text-transform: uppercase; margin-top: 2px; }
.menu { display: none; width: 100%; flex-direction: column; padding: 4px 0 18px; }
.menu.is-open { display: flex; }
.menu a { color: #fff; text-decoration: none; padding: 11px 2px; border-bottom: 1px dashed rgba(255,255,255,.18); font-weight: 500; }
.menu a[aria-current="page"] { color: var(--mustard); }
.menu a:hover { color: var(--mustard); }
.menu__cta { display: inline-flex; align-items: center; gap: 8px; }
@media (min-width: 980px) {
  .burger { display: none; }
  .menu, .menu.is-open { display: flex; width: auto; flex-direction: row; align-items: center; gap: 6px; padding: 0; }
  .menu a { border: 0; padding: 8px 12px; border-radius: 8px; font-size: .95rem; }
  .menu a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--mustard); border-radius: 0; }
  .menu .menu__cta { background: var(--mustard); color: var(--pine-2); border-radius: 999px; padding: 9px 16px; margin-left: 8px; font-weight: 700; }
  .menu .menu__cta:hover { background: #fff; color: var(--pine-2); }
  .menu .menu__cta[aria-current="page"] { color: var(--pine-2); border-radius: 999px; box-shadow: 0 0 0 2px #fff; }
}
/* perforated ticket edge */
.perf { height: 12px; background: radial-gradient(circle at 8px 12px, var(--paper) 5px, transparent 5.5px) 0 0 / 16px 12px repeat-x, var(--pine); }
.perf--top { background: radial-gradient(circle at 8px 0, var(--paper) 5px, transparent 5.5px) 0 0 / 16px 12px repeat-x, var(--pine-2); }

/* ---------- Breadcrumb ---------- */
.trail ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 0; margin: 18px 0 0; padding: 0; font: 500 .78rem/1.5 var(--mono); color: var(--muted); }
.trail li:not(:last-child)::after { content: '/'; margin: 0 8px; opacity: .5; }
.trail a { color: var(--muted); }
.trail span { color: var(--ink); }

/* ---------- Shared bits ---------- */
.tag { display: inline-flex; align-items: center; gap: 8px; font: 600 .74rem/1.3 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--tomato); margin-bottom: 14px; }
.tag--light { color: var(--mustard); }
.pill { display: inline-flex; align-items: center; gap: 8px; background: var(--mustard); color: var(--pine-2); text-decoration: none; font-weight: 700; padding: 11px 20px; border-radius: 999px; border: 2px solid var(--pine-2); box-shadow: 3px 3px 0 var(--pine-2); transition: transform .12s, box-shadow .12s; }
.pill:hover { color: var(--pine-2); transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--pine-2); }
.pill--dark { background: var(--pine); color: #fff; }
.pill--dark:hover { color: #fff; }
.sechead { max-width: 760px; margin-bottom: 30px; }
.sechead p { color: var(--muted); }
section { position: relative; }

/* ---------- Opener (hero) ---------- */
.opener { padding: 40px 0 56px; background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px); background-size: 24px 24px; }
.opener__grid { display: grid; gap: 34px; }
@media (min-width: 980px) { .opener__grid { grid-template-columns: 1.05fr 1fr; align-items: center; gap: 56px; } .opener { padding: 64px 0 80px; } }
.opener h1 { max-width: 13ch; }
.scrawl { position: relative; white-space: nowrap; color: var(--pine-3); }
.scrawl::after { content: ''; position: absolute; left: -2%; right: -2%; bottom: -.06em; height: .26em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M2 9c40-6 80-8 120-5 25 2 50 3 76-2' fill='none' stroke='%23e9b72f' stroke-width='6' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat; z-index: -1; }
.opener__lead { font-size: 1.08rem; color: #333d38; max-width: 58ch; }
.facts { list-style: none; padding: 0; margin: 26px 0 0; display: grid; gap: 10px; }
.facts li { display: flex; gap: 14px; align-items: center; background: var(--card); border: 1.5px solid var(--line); border-left: 5px solid var(--pine); border-radius: 10px; padding: 10px 14px; font-size: .93rem; color: var(--muted); }
.facts b { font: 600 1.05rem var(--mono); color: var(--pine); min-width: 4.6em; }
.opener__more { margin: 14px 4px 0; font-weight: 600; text-align: right; }
.opener__more a { text-decoration: none; }

/* ---------- Ticket-stub calculator ---------- */
.stub { display: flex; background: var(--card); border: 2px solid var(--pine-2); border-radius: var(--r); box-shadow: 8px 8px 0 var(--pine); position: relative; overflow: hidden;
  -webkit-mask: radial-gradient(circle at 0 50%, transparent 13px, #000 13.5px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 13px, #000 13.5px) right / 51% 100% no-repeat;
          mask: radial-gradient(circle at 0 50%, transparent 13px, #000 13.5px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 13px, #000 13.5px) right / 51% 100% no-repeat; }
.stub { box-shadow: none; }
.calcwrap { filter: drop-shadow(7px 7px 0 var(--pine)); min-width: 0; }
.stub__side { flex: 0 0 40px; background: var(--mustard); border-right: 2px dashed var(--pine-2); display: flex; align-items: center; justify-content: center; }
.stub__side span { writing-mode: vertical-rl; transform: rotate(180deg); font: 600 .66rem var(--mono); letter-spacing: .16em; color: var(--pine-2); white-space: nowrap; }
.stub__body { flex: 1; min-width: 0; padding: 22px 20px 20px 22px; }
.stub__kicker { display: flex; align-items: center; gap: 7px; font: 600 .72rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--tomato); margin: 0 0 6px; }
.stub__title { font-size: 1.45rem; margin-bottom: 16px; }
.stub__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.stub__fields label { display: flex; flex-direction: column; gap: 4px; font-size: .78rem; font-weight: 700; color: var(--muted); min-width: 0; }
.stub__fields em { font-weight: 400; }
.stub__fields input { width: 100%; font: 600 1.05rem var(--mono); color: var(--ink); background: var(--paper); border: 1.5px solid var(--line); border-radius: 8px; padding: 9px 10px; }
.stub__fields input:focus { border-color: var(--pine); outline: none; box-shadow: 0 0 0 3px rgba(233,183,47,.5); }
.stub__out { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin: 18px 0 12px; border-top: 2px dashed var(--line); padding-top: 16px; }
.stub__out div { min-width: 0; }
.stub__out dt { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.stub__out dd { margin: 2px 0 0; font: 600 1.05rem var(--mono); color: var(--pine); overflow-wrap: anywhere; }
.stub__big { grid-column: 1 / -1; background: var(--pine); color: #fff; border-radius: 10px; padding: 12px 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; }
.stub__big dt { color: var(--mustard-l); width: 100%; }
.stub__big dd { color: #fff; font: 400 clamp(1.7rem, 5vw, 2.2rem)/1.1 var(--serif); margin: 0; }
.stub__big .stub__sub { font: 600 .95rem var(--mono); color: var(--mustard); }
.stub__meter { height: 10px; background: repeating-linear-gradient(90deg, var(--line) 0 2px, transparent 2px 10%), #efe7d3; border-radius: 99px; overflow: hidden; }
.stub__meter i { display: block; height: 100%; width: 48%; background: linear-gradient(90deg, var(--tomato), var(--mustard)); border-radius: 99px; transition: width .3s; }
.stub__say { margin: 10px 0 0; font-size: .88rem; color: var(--muted); font-style: italic; }
.stub--full .stub__fields { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.stub--full .stub__out { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
@media (max-width: 420px) {
  .stub__side { flex-basis: 30px; }
  .stub__body { padding: 18px 14px 16px 16px; }
  .stub__out { grid-template-columns: 1fr 1fr; }
}

/* ---------- Verdict (lottery checker) ---------- */
.verdict { background: var(--pine); color: #e9efe9; padding: 64px 0; }
.verdict h2 { color: #fff; }
.verdict a { color: var(--mustard); }
.verdict__grid { display: grid; gap: 30px; }
@media (min-width: 900px) { .verdict__grid { grid-template-columns: 1fr 1.1fr; gap: 54px; align-items: start; } }
.verdict__small { font-size: .88rem; opacity: .8; }
.verdict__box { background: var(--pine-2); border: 1.5px solid rgba(255,255,255,.12); border-radius: var(--r); padding: 20px; }
.verdict__box fieldset { border: 0; margin: 0 0 16px; padding: 0 0 14px; border-bottom: 1px dashed rgba(255,255,255,.15); }
.verdict__box legend { font-weight: 700; color: #fff; margin-bottom: 8px; padding: 0; }
.verdict__box label { display: inline-flex; align-items: center; gap: 7px; margin: 4px 14px 4px 0; cursor: pointer; font-size: .95rem; }
.verdict__box input { accent-color: var(--mustard); width: 18px; height: 18px; }
.verdict__result { border-radius: 10px; padding: 14px 16px; background: var(--tomato); color: #fff; display: grid; gap: 4px; }
.verdict__result strong { font: 400 1.35rem var(--serif); }
.verdict__result.is-ok { background: var(--mustard); color: var(--pine-2); }
.verdict__result.is-free { background: #e9efe9; color: var(--pine-2); }

/* ---------- Ledger (six checks) ---------- */
.ledger { padding: 70px 0; }
.ledger__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 2px solid var(--ink); }
@media (min-width: 820px) { .ledger__list { grid-template-columns: 1fr 1fr; column-gap: 40px; } }
.ledger__list li { display: flex; gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.ledger__list b { font: 400 2.6rem/1 var(--serif); color: var(--tomato); min-width: 1.6em; }
.ledger__list h3 { margin-bottom: 6px; }
.ledger__list p { margin: 0; color: var(--muted); font-size: .97rem; }
.ledger__more { margin-top: 28px; }

/* ---------- Receipt ---------- */
.receipt-sec { padding: 70px 0; background: #ece4cf; }
.receipt-sec__grid { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .receipt-sec__grid { grid-template-columns: 400px 1fr; gap: 70px; } }
.receipt { background: #fff; font-family: var(--mono); font-size: .88rem; padding: 26px 22px 30px; max-width: 400px; width: 100%; margin: 0 auto; transform: rotate(-1.5deg); box-shadow: 0 14px 30px rgba(11,42,35,.15);
  -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 10px) no-repeat, conic-gradient(from -45deg at bottom, transparent 90deg, #000 0) bottom / 14px 10px repeat-x;
          mask: linear-gradient(#000 0 0) top / 100% calc(100% - 10px) no-repeat, conic-gradient(from -45deg at bottom, transparent 90deg, #000 0) bottom / 14px 10px repeat-x; }
.receipt__head { text-align: center; font-weight: 600; letter-spacing: .12em; border-bottom: 1.5px dashed #999; padding-bottom: 12px; }
.receipt__head small { font-weight: 500; letter-spacing: 0; color: #777; }
.receipt dl { margin: 0; }
.receipt dl div { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; }
.receipt dt { color: #444; }
.receipt dd { margin: 0; font-weight: 600; white-space: nowrap; }
.receipt .rule { border-top: 1.5px dashed #999; margin-top: 6px; padding-top: 10px; }
.receipt .total { border-top: 3px double #333; margin-top: 8px; padding-top: 10px; font-size: 1.05rem; }
.receipt .total dd { color: var(--tomato); }
.receipt__foot { text-align: center; color: #888; font-size: .72rem; margin: 18px 0 0; letter-spacing: .05em; }

/* ---------- Stamps (prize types) ---------- */
.stamps { padding: 70px 0; }
.stamps__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 22px; }
.stampcard { display: block; text-decoration: none; color: var(--ink); background: var(--card); padding: 22px 18px 18px; position: relative;
  -webkit-mask: radial-gradient(circle 6px, transparent 98%, #000) -8px -8px / 16px 16px round, linear-gradient(#000 0 0) center / calc(100% - 14px) calc(100% - 14px) no-repeat;
          mask: radial-gradient(circle 6px, transparent 98%, #000) -8px -8px / 16px 16px round, linear-gradient(#000 0 0) center / calc(100% - 14px) calc(100% - 14px) no-repeat;
  -webkit-mask-composite: source-over; mask-composite: add; transition: transform .15s; }
.stampcard::before { content: ''; position: absolute; inset: 14px; border: 1.5px solid var(--line); pointer-events: none; }
.stampcard:hover { transform: rotate(-1.5deg) scale(1.02); color: var(--ink); }
.stampcard__val { display: inline-block; font: 600 .78rem var(--mono); background: var(--pine); color: var(--mustard); padding: 3px 8px; border-radius: 4px; margin: 6px 0 12px 6px; }
.stampcard h3 { margin: 0 6px 6px; }
.stampcard p { margin: 0 6px 6px; font-size: .92rem; color: var(--muted); }
.stamps__note { font-size: .82rem; color: var(--muted); margin-top: 18px; }

/* ---------- Flags ---------- */
.flags { padding: 0 0 70px; }
.flags__grid { display: grid; gap: 20px; }
@media (min-width: 820px) { .flags__grid { grid-template-columns: 1fr 1fr; } }
.flags__col { border-radius: var(--r); padding: 26px 24px; border: 2px solid var(--ink); }
.flags__col h2 { display: flex; align-items: center; gap: 10px; font-size: 1.7rem; }
.flags__col ul { list-style: none; margin: 0; padding: 0; }
.flags__col li { padding: 9px 0 9px 26px; border-top: 1px dashed rgba(0,0,0,.15); position: relative; }
.flags__col li::before { content: ''; position: absolute; left: 4px; top: 17px; width: 10px; height: 10px; border-radius: 50%; }
.flags__col--green { background: #e3ecdf; }
.flags__col--green h2 { color: var(--pine); }
.flags__col--green li::before { background: var(--pine-3); }
.flags__col--red { background: #f8e1d6; }
.flags__col--red h2 { color: #a63a1b; }
.flags__col--red li::before { background: var(--tomato); border-radius: 2px; transform: rotate(45deg); }
.flags__link { margin: 16px 0 0; font-weight: 600; }

/* ---------- Library (TOC) ---------- */
.library { padding: 70px 0; background: var(--card); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.library__cols { display: grid; gap: 30px; }
@media (min-width: 900px) { .library__cols { grid-template-columns: repeat(3, 1fr); gap: 40px; } }
.toc h3 { font: 600 .8rem var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--tomato); border-bottom: 2px solid var(--ink); padding-bottom: 8px; }
.toc ol { list-style: none; margin: 0; padding: 0; counter-reset: t; }
.toc li { counter-increment: t; }
.toc a { display: flex; align-items: baseline; gap: 8px; padding: 10px 0; text-decoration: none; color: var(--ink); border-bottom: 1px solid var(--line); }
.toc a::before { content: counter(t, decimal-leading-zero); font: 600 .75rem var(--mono); color: var(--muted); }
.toc a span { font-weight: 600; }
.toc a i { flex: 1; border-bottom: 2px dotted var(--line); min-width: 12px; transform: translateY(-4px); }
.toc a em { font: 500 .75rem var(--mono); font-style: normal; color: var(--muted); white-space: nowrap; }
.toc a:hover span { color: var(--tomato); }

/* ---------- Tax band + FAQ ---------- */
.taxband { padding: 70px 0; }
.taxband__grid { display: grid; gap: 40px; }
@media (min-width: 900px) { .taxband__grid { grid-template-columns: 1fr 1fr; gap: 60px; } }
.taxband__q { background: var(--mustard); border: 2px solid var(--pine-2); border-radius: var(--r); padding: 28px 24px; box-shadow: 7px 7px 0 var(--pine-2); align-self: start; }
.taxband__q .tag { color: var(--pine-2); }
.taxband__q a { color: var(--pine-2); font-weight: 600; }
.taxband__q .pill { background: var(--card); }
h2.mini { font-size: 1.5rem; }
.qa { border-bottom: 1px solid var(--line); }
.qa summary { cursor: pointer; list-style: none; padding: 14px 32px 14px 0; font-weight: 700; position: relative; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary::after { content: '+'; position: absolute; right: 4px; top: 8px; font: 400 1.6rem var(--serif); color: var(--tomato); }
.qa[open] summary::after { content: '-'; }
.qa p { margin: 0 0 16px; color: var(--muted); }

/* ---------- Closer ---------- */
.closer { padding: 0 0 70px; }
.closer__in { display: flex; gap: 18px; align-items: flex-start; border: 2px dashed var(--pine-3); border-radius: var(--r); padding: 24px; color: var(--pine); }
.closer__in p { color: var(--ink); }
.closer__in p:last-child { margin: 0; }

/* ---------- Page head / prose ---------- */
.pagehead { padding: 30px 0 34px; background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px); background-size: 24px 24px; border-bottom: 2px solid var(--ink); }
.pagehead h1 { font-size: clamp(2rem, 5vw, 3.1rem); max-width: 22ch; }
.pagehead__lead { font-size: 1.12rem; color: #333d38; max-width: 62ch; }
.pagehead__meta { font: 500 .8rem var(--mono); color: var(--muted); display: flex; align-items: center; gap: 6px; margin: 0; }
.prose { padding: 34px 0 50px; min-width: 0; }
.prose h2 { font-size: clamp(1.45rem, 3vw, 1.85rem); margin-top: 1.4em; scroll-margin-top: 20px; }
.prose h2:first-child { margin-top: 0; }
.prose ul, .prose ol { padding-left: 1.3em; margin: 0 0 1.2em; }
.prose li { margin-bottom: .5em; }
.prose ol li::marker { font-family: var(--mono); font-weight: 600; color: var(--tomato); }
.prose ul li::marker { color: var(--tomato); }
.prose__end { font-size: .88rem; color: var(--muted); border-top: 1px solid var(--line); padding-top: 16px; margin-top: 30px; }
.aside { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 10px; font-size: .95rem; }
.aside--note { background: #e3ecdf; color: var(--pine-2); border-left: 4px solid var(--pine-3); }
.aside--warn { background: #f8e1d6; color: #6e2610; border-left: 4px solid var(--tomato); }
.tbl { overflow-x: auto; margin: 0 0 1.4em; border: 2px solid var(--ink); border-radius: 10px; background: var(--card); }
.tbl table { border-collapse: collapse; width: 100%; font-size: .92rem; min-width: 460px; }
.tbl th { background: var(--pine); color: #fff; text-align: left; padding: 10px 12px; font-weight: 700; }
.tbl td { padding: 9px 12px; border-top: 1px solid var(--line); }
.tbl td:first-child { font-weight: 700; }
.tbl tr:nth-child(even) td { background: #faf5e8; }

.guide__grid { display: grid; gap: 0; }
@media (min-width: 980px) { .guide__grid { grid-template-columns: 260px minmax(0, 1fr); gap: 56px; } .guide__grid .prose { max-width: 760px; } }
.guide__side { padding-top: 30px; }
@media (min-width: 980px) { .guide__side { position: sticky; top: 16px; align-self: start; } }
.guide__toc { background: var(--card); border: 1.5px solid var(--line); border-radius: 10px; padding: 16px 18px; margin-bottom: 14px; }
.guide__toc p { font: 600 .72rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--tomato); margin-bottom: 8px; }
.guide__toc ol { margin: 0; padding-left: 1.2em; font-size: .9rem; }
.guide__toc li { margin: 5px 0; }
.guide__toc a { color: var(--ink); text-decoration: none; }
.guide__toc a:hover { color: var(--tomato); }
.guide__calc { display: flex; align-items: center; gap: 12px; background: var(--pine); color: #fff; text-decoration: none; padding: 14px 16px; border-radius: 10px; font-size: .85rem; }
.guide__calc:hover { color: var(--mustard); }
.guide__calc .ic { color: var(--mustard); }
.guide__calc b { display: block; font-size: 1rem; }
.pager { display: grid; gap: 14px; padding-bottom: 60px; }
@media (min-width: 700px) { .pager { grid-template-columns: 1fr 1fr; } .pager a:last-child { text-align: right; } }
.pager a { display: block; background: var(--card); border: 2px solid var(--ink); border-radius: 10px; padding: 14px 18px; text-decoration: none; color: var(--ink); font-family: var(--serif); font-size: 1.15rem; }
.pager a:hover { background: var(--mustard); color: var(--ink); }
.pager small { display: block; font: 600 .7rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--tomato); margin-bottom: 4px; }

/* hub */
.hub { padding: 34px 16px 60px; }
@media (min-width: 700px) { .hub { padding: 40px 28px 70px; } }
.hub__shelf { margin-bottom: 40px; }
.hub__shelf h2 { font: 600 .85rem var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--tomato); border-bottom: 2px solid var(--ink); padding-bottom: 8px; }
.hub__list { display: grid; }
.entry { display: flex; gap: 16px; align-items: flex-start; padding: 18px 4px; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.entry:hover strong { color: var(--tomato); }
.entry__ic { background: var(--pine); color: var(--mustard); border-radius: 10px; width: 46px; height: 46px; display: flex; align-items: center; justify-content: center; flex: none; }
.entry__txt { flex: 1; min-width: 0; }
.entry__txt strong { display: block; font: 400 1.25rem/1.25 var(--serif); margin-bottom: 4px; }
.entry__txt span { color: var(--muted); font-size: .95rem; }
.entry__min { font: 500 .75rem var(--mono); color: var(--muted); white-space: nowrap; padding-top: 4px; }
@media (max-width: 520px) { .entry__min { display: none; } }
.hub__tool { background: var(--mustard); border: 2px solid var(--pine-2); border-radius: var(--r); padding: 24px; box-shadow: 6px 6px 0 var(--pine-2); }
.hub__tool h2 { display: flex; gap: 10px; align-items: center; font-size: 1.6rem; }
.hub__tool .pill { background: var(--card); }

/* tool page */
.toolpage { padding-top: 40px; padding-bottom: 20px; display: grid; gap: 30px; }
@media (min-width: 1000px) { .toolpage { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 50px; align-items: start; } }
.toolpage__notes { padding-top: 0; }

/* contact */
.mailcard { display: flex; gap: 16px; align-items: flex-start; background: var(--card); border: 2px solid var(--ink); border-radius: var(--r); padding: 22px; margin-bottom: 24px; box-shadow: 6px 6px 0 var(--mustard); }
.mailcard .ic { color: var(--tomato); }
.mailcard a { font: 400 clamp(1.15rem, 4vw, 1.6rem) var(--serif); overflow-wrap: anywhere; }
.mailcard p { margin: 8px 0 0; color: var(--muted); font-size: .95rem; }
.kicker { display: block; font: 600 .72rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }

/* 404 */
.lost { text-align: center; padding: 70px 0; }
.lost h1, .lost .pagehead__lead { margin-left: auto; margin-right: auto; }
.lost__num { font: 600 1rem var(--mono); color: var(--tomato); letter-spacing: .1em; }
.lost__links { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 24px; }

/* ---------- Footer ---------- */
.foot { background: var(--pine-2); color: #c9d6cf; margin-top: 0; }
.foot a { color: #fff; text-decoration: none; }
.foot a:hover { color: var(--mustard); }
.foot__grid { display: grid; gap: 30px; padding-top: 46px; padding-bottom: 30px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .foot__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .foot__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr .8fr; } }
.foot__name { font: 400 1.6rem var(--serif); color: #fff; }
.foot__name b { color: var(--mustard); font-weight: 400; }
.foot h2 { font: 600 .74rem var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--mustard); margin-bottom: 12px; }
.foot ul { list-style: none; margin: 0; padding: 0; font-size: .93rem; }
.foot li { margin: 0 0 8px; }
.foot__base { border-top: 1px dashed rgba(255,255,255,.2); padding-top: 20px; padding-bottom: 30px; font-size: .82rem; }
.badge18 { display: inline-block; background: var(--tomato); color: #fff; font: 600 .75rem var(--mono); padding: 2px 7px; border-radius: 4px; margin-right: 6px; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }