:root {
  color-scheme: light;
  --paper: #faf8f2;
  --surface: #fffdf8;
  --ink: #202d25;
  --muted: #4e5b51;
  --accent: #265444;
  --line: #d9ded2;
  --gold: #f0cc80;
  --heading: Georgia, 'Times New Roman', serif;
  font: 100%/1.55 system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--paper); color: var(--ink); }
a { color: var(--accent); text-underline-offset: .22em; }
a:hover { text-decoration-thickness: .13em; }
:focus-visible { outline: 3px solid #a14b18; outline-offset: 4px; }
img { display: block; width: 100%; object-fit: cover; }
figure { margin: 0; }
h1, h2, h3 { margin: 0; font: 400 2.35rem/1.06 var(--heading); letter-spacing: -.035em; }
h1 { font-size: clamp(3rem, 7vw, 6.2rem); }
h3 { font-size: 1.64rem; line-height: 1.13; }
p { margin: .8em 0 0; }
button, input { font: inherit; }
address { font-style: normal; }
.wrap { width: min(1220px, calc(100% - 3rem)); margin-inline: auto; }
.skip { position: fixed; z-index: 2; inset: 1rem auto auto 1rem; padding: .65rem 1rem; background: var(--surface); transform: translateY(-200%); }
.skip:focus { transform: none; }
.site-head { border-bottom: 1px solid var(--line); }
.head-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; min-height: 76px; }
.brand { display: inline-flex; align-items: center; gap: .58rem; color: inherit; text-decoration: none; font: 700 1.72rem/1 var(--heading); letter-spacing: -.06em; }
.mark { display: grid; width: 36px; height: 36px; place-items: center; background: var(--accent); color: white; border-radius: 10px; }
.mark svg { width: 25px; height: 25px; }
.head-inner nav { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem clamp(.7rem, 3vw, 2.3rem); }
.head-inner nav a { color: inherit; text-decoration: none; font-size: .94rem; font-weight: 650; }
.head-inner nav a:hover, .head-inner nav a[aria-current] { text-decoration: underline; }
.home-hero { background: #eeefe4; border-bottom: 1px solid var(--line); }
.hero-grid { display: grid; grid-template-columns: 1fr 1.08fr; align-items: center; gap: clamp(2rem, 5vw, 5rem); padding-block: clamp(2rem, 5vw, 4.25rem); }
.hero-copy { padding-block: 1rem; }
.hero-copy h1 { font-size: clamp(3.5rem, 7.35vw, 7rem); }
.eyebrow { margin: 0 0 .85rem; color: var(--accent); text-transform: uppercase; letter-spacing: .12em; font-size: .73rem; font-weight: 750; }
.lead { color: var(--muted); font-size: clamp(1.08rem, 2vw, 1.32rem); max-width: 37rem; }
.hero-photo { position: relative; }
.hero-photo img { aspect-ratio: 1.12; border-radius: 1rem; }
.hero-photo figcaption { position: absolute; right: .7rem; bottom: .7rem; border-radius: .35rem; padding: .25rem .6rem; background: #faf8f2; color: var(--ink); font-size: .71rem; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1.5rem; }
.button { display: inline-flex; justify-content: center; align-items: center; padding: .75rem 1rem; border: 1px solid var(--accent); border-radius: .5rem; background: var(--accent); color: #fff; text-decoration: none; font-size: .9rem; font-weight: 680; cursor: pointer; }
.button:hover { background: #193b30; }
.button.secondary { background: transparent; color: var(--accent); }
.button.secondary:hover { background: #e8eee7; }
.section { padding-block: clamp(2.5rem, 6vw, 5rem); }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.55rem; }
.text-link { font-size: .94rem; font-weight: 700; }
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.card { position: relative; min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: .85rem; }
.card > a { display: block; height: 100%; color: inherit; text-decoration: none; border-radius: inherit; }
.card img { aspect-ratio: 1.72; border-radius: .8rem .8rem 0 0; }
.card-copy { padding: 1.15rem 1.15rem 2.75rem; }
.card-copy .eyebrow { margin-bottom: .55rem; }
.card-copy h3 + p { color: var(--muted); }
.card a:hover h3 { text-decoration: underline; text-underline-offset: .15em; text-decoration-thickness: 1px; }
.arrow { position: absolute; right: 1.15rem; bottom: .7rem; color: var(--accent); font-size: 1.22rem; }
.planner-band { background: var(--accent); color: white; }
.band-inner { display: grid; grid-template-columns: 1.35fr 1fr; gap: 2rem; align-items: center; }
.band-inner .eyebrow { color: var(--gold); }
.band-inner p:not(.eyebrow) { max-width: 36rem; }
.band-inner .button { margin-top: 1.25rem; background: var(--gold); color: var(--ink); border-color: var(--gold); }
.band-inner .button:hover { background: #f5dda4; }
.band-inner ol { padding: 0; margin: 0; list-style: none; border-top: 1px solid #ffffff60; }
.band-inner li { padding: .62rem .1rem; border-bottom: 1px solid #ffffff60; font-weight: 650; }
.page-heading { padding-block: clamp(2.75rem, 7vw, 5.5rem) 2rem; }
.page-heading h1, .article-heading h1 { font-size: clamp(2.9rem, 6.5vw, 5.25rem); max-width: 58rem; }
.listing { padding-bottom: 4rem; }
.chips { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.25rem; }
.chips a { border: 1px solid #a8b8a9; padding: .4rem .8rem; border-radius: 999px; font-weight: 650; text-decoration: none; }
.chips a:hover { background: #e8eee7; }
.guide-group { margin-top: 2rem; scroll-margin-top: 1rem; }
.guide-group h2, .related h2 { margin-bottom: 1.2rem; }
.article-heading { max-width: 58rem; margin-inline: auto; padding-block: 2.75rem 1.8rem; }
.article-heading .eyebrow { margin-top: 1.3rem; }
.byline, figcaption, .small { font-size: .86rem; color: var(--muted); }
.article-photo { max-width: 58rem; margin-inline: auto; }
.article-photo img { aspect-ratio: 2.05; border-radius: .85rem; }
.article-photo figcaption { margin-top: .35rem; }
.article-body { max-width: 46rem; margin: 2rem auto 0; font-size: 1.065rem; overflow-wrap: anywhere; }
.article-body h2 { margin-top: 2rem; font-size: 1.9rem; }
.article-body address { margin-top: .8rem; }
.article-body .sources ul { padding-inline-start: 1.25rem; }
.article-body .sources li { margin-block: .4rem; }
.note { padding: 1rem 1.2rem; background: #e8eee4; border-left: 4px solid var(--accent); border-radius: .3rem; margin: 1.45rem 0; }
.note p { margin-top: .35rem; }
.info { max-width: 56rem; padding-bottom: 4.5rem; }
.info .article-body { margin: 0; }
.info .article-body h2:first-child { margin-top: 0; }
.planner-page { padding-bottom: 4rem; }
.tools-grid { display: grid; grid-template-columns: 1.25fr 1fr; align-items: start; gap: 1.25rem; }
.tool { border: 1px solid var(--line); padding: clamp(1rem, 3vw, 1.85rem); background: var(--surface); border-radius: .85rem; }
.tool h2 { font-size: 2rem; margin-bottom: .85rem; }
.tool fieldset { min-width: 0; margin: 1.25rem 0 0; padding: 0; border: 0; }
.tool legend { padding: 0; margin-bottom: .2rem; font-size: 1.06rem; font-weight: 750; }
.check { display: flex; align-items: flex-start; gap: .65rem; padding: .34rem 0; cursor: pointer; }
.check input { flex: 0 0 auto; width: 1.15rem; height: 1.15rem; margin: .2rem 0 0; accent-color: var(--accent); }
progress { display: block; width: 100%; height: 1rem; accent-color: var(--accent); }
.status { margin-top: .35rem; font-size: .9rem; }
.status:empty { display: none; }
.tool-controls { border-top: 1px solid var(--line); margin-top: 1.3rem; padding-top: 1rem; }
.tool-controls .actions { margin-top: .75rem; }
.budget-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; margin-top: 1rem; }
.budget-fields label { display: grid; align-content: end; gap: .28rem; font-size: .9rem; font-weight: 650; }
.currency { display: flex; align-items: center; gap: .3rem; border: 1px solid #9aa99e; padding-inline: .55rem; border-radius: .35rem; background: #fff; }
.currency input { width: 100%; min-width: 0; color: var(--ink); border: 0; padding-block: .55rem; background: transparent; }
.budget-total { display: flex; justify-content: space-between; align-items: center; gap: .6rem; border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 1rem; font-weight: 700; overflow-wrap: anywhere; }
.budget-total output { font: 1.75rem/1.05 var(--heading); text-align: right; }
.site-foot { padding-block: 2rem; background: #e9ece1; border-top: 1px solid var(--line); }
.foot-inner { display: grid; grid-template-columns: 1.1fr .7fr 1fr; gap: 1.5rem; }
.foot-inner p, .foot-inner address, .foot-inner nav { font-size: .89rem; }
.foot-inner nav { display: grid; justify-items: start; align-content: start; gap: .35rem; }
@media (max-width: 800px) {
  .hero-grid, .band-inner, .tools-grid { grid-template-columns: 1fr; }
  .hero-grid { gap: 1rem; }
  .hero-photo img { aspect-ratio: 1.6; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 525px) {
  .wrap { width: calc(100% - 2rem); }
  .head-inner { align-items: flex-start; flex-direction: column; padding-block: .75rem; }
  .desktop { display: none; }
  .cards, .foot-inner { grid-template-columns: 1fr; }
  .section-head { flex-wrap: wrap; align-items: start; }
  .article-photo img { aspect-ratio: 1.5; }
}
@media print {
  body { background: #fff; color: #000; }
  .site-head, .site-foot, .skip, .tool-controls, .budget > p:last-child { display: none !important; }
  .tools-grid { display: block; }
  .tool { break-inside: avoid; margin-bottom: 1rem; }
  .page-heading { padding-block: 0 1rem; }
  .page-heading h1 { font-size: 2rem; }
}