@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');

:root { color-scheme: light; --paper:#eff7fd; --ink:#132f49; --green:#205c88; --light:#dbeefa; --rule:#c0d8ea; --muted:#385976; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font: 17px/1.58 "Instrument Sans",system-ui,sans-serif; }
a { color:inherit; text-underline-offset:.25em; }
a:focus-visible,input:focus-visible { outline:3px solid #357ebe; outline-offset:4px; }
header,footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem max(5vw,calc((100vw - 1280px)/2)); }
header { border-bottom:1px solid var(--rule); }
.brand { font-weight:700; letter-spacing:.13em; text-decoration:none; white-space:nowrap; }
.brand span { margin-right:.45em; }
nav { display:flex; flex-wrap:wrap; gap:clamp(.6rem,3vw,2.6rem); font-size:.88rem; }
nav a { text-decoration:none; }
nav a:hover,.resources a:hover { text-decoration:underline; }
main { width:min(90%,1280px); margin:auto; }
.hero { display:grid; grid-template-columns:1fr 1fr; gap:clamp(1rem,4vw,4rem); padding:clamp(2rem,6vw,5rem) 0 2rem; align-items:center; }
.eyebrow { color:var(--green); font-size:.72rem; font-weight:700; letter-spacing:.15em; margin:0 0 1rem; }
h1,h2 { font:400 clamp(2.6rem,5.7vw,5.6rem)/.98 "Instrument Serif",Georgia,serif; margin:0 0 1.25rem; }
h1 { font-size:clamp(3.3rem,7.4vw,8rem); letter-spacing:-.025em; }
h1 span { color:#3981b7; }
h3 { font-size:1.15rem; margin:0 0 .6rem; }
p { margin:0 0 1rem; }
.intro>p:not(.eyebrow),.lede { max-width:42rem; color:var(--muted); }
.button { display:inline-flex; gap:1.15rem; align-items:center; margin-top:.7rem; padding:.72rem 1.12rem; border-radius:2rem; color:white; background:var(--green); font-size:.9rem; font-weight:600; text-decoration:none; }
.button:hover { background:var(--ink); }
figure { margin:0; }
figure img { display:block; width:100%; height:clamp(21rem,42vw,36rem); object-fit:cover; object-position:center 55%; border-radius:48% 48% 4px 4px / 22% 22% 4px 4px; }
figcaption { margin-top:.5rem; color:var(--muted); font-size:.7rem; text-align:right; }
.definition { border-block:1px solid var(--rule); display:grid; grid-template-columns:1fr 2fr; gap:1.5rem; padding:2rem 0; align-items:center; }
.definition h2,.definition p { margin:0; }
.definition h2,.resources h2 { font-size:clamp(2rem,4vw,3.5rem); }
.section { padding:clamp(2.5rem,6vw,5.5rem) 0; }
.steps,.claims { display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule); }
.steps { grid-template-columns:repeat(3,1fr); list-style:none; counter-reset:step; padding:0; margin:2rem 0 0; }
.steps li,.claims article { background:var(--paper); padding:clamp(1rem,3vw,2rem); }
.steps li::before { counter-increment:step; content:"0" counter(step); display:block; font-size:.8rem; color:var(--green); margin-bottom:1rem; }
.steps p,.claims p { margin:0; }
.example { display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,5vw,5rem); padding-inline:clamp(1rem,4vw,4rem); background:var(--light); align-items:center; }
form { display:grid; gap:.8rem; }
label { display:grid; gap:.25rem; font-size:.92rem; font-weight:600; }
input { min-width:0; width:100%; padding:.55rem .7rem; font:inherit; color:var(--ink); background:var(--paper); border:1px solid #7d9fba; border-radius:.25rem; }
output { display:block; margin-top:.4rem; font-size:1.35rem; font-weight:700; color:var(--green); }
small { color:var(--muted); }
.claims { grid-template-columns:1fr 1fr; }
.resources { border-top:1px solid var(--rule); }
.resources ul { margin:0; padding-left:1.2rem; }
.resources li { margin:.5rem 0; }
footer { background:var(--ink); color:var(--paper); font-size:.85rem; flex-wrap:wrap; }
@media(max-width:680px) {
  header { align-items:flex-start; flex-direction:column; }
  .hero,.definition,.steps,.example,.claims { grid-template-columns:1fr; }
  figure img { height:20rem; }
  h1 { font-size:clamp(3.3rem,12vw,5.4rem); }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

.accounting-note { margin:1.5rem 0 0; max-width:54rem; }
.check-title { margin-top:2rem; }
.evidence { padding-left:1.25rem; max-width:54rem; }
.evidence li { margin:.5rem 0; }
#lifecycle { padding-bottom:0; }

.editorial { border-top:1px solid var(--rule); }
.guide-grid { margin-top:1.5rem; }
.guide-grid article a { display:inline-block; margin-top:.8rem; color:var(--green); font-size:.88rem; }
.source-note { margin:1rem 0 0; color:var(--muted); font-size:.88rem; }
.pathway-table { overflow-x:auto; border:1px solid var(--rule); }
table { width:100%; min-width:34rem; border-collapse:collapse; text-align:left; }
th,td { padding:.8rem 1rem; vertical-align:top; border-bottom:1px solid var(--rule); }
thead { background:var(--light); }
tbody tr:last-child > * { border-bottom:0; }
tbody th { width:20%; }
.document-library { padding:1rem 1.25rem; background:var(--light); border:1px solid var(--rule); }
.document-library summary { cursor:pointer; font-weight:700; }
.document-list { margin:1rem 0 0; padding-left:1.25rem; }
.document-list li { margin:.5rem 0; }
.document-list a { color:var(--green); font-weight:700; }
.document-list span { font-size:.88rem; font-weight:400; }
.references { columns:2; column-gap:2.5rem; }
.references li { break-inside:avoid; }
@media(max-width:680px) {
  .references { columns:1; }
}

:root { --paper:#f2f8ff; --ink:#102947; --green:#1455a0; --light:#e4f1ff; --rule:#c9ddf1; --muted:#395674; }
body { background:radial-gradient(ellipse at 82% 0%,#d6eaff 0,transparent 48rem),var(--paper); }
header { background:#f7fbff; }
.brand span { display:inline-grid; place-items:center; background:#dcecff; color:var(--green); border-radius:.65rem; width:2rem; height:2rem; }
nav a { padding:.3rem .1rem; font-weight:600; }
h1,h2 { font-family:"Instrument Sans",system-ui,sans-serif; font-weight:700; letter-spacing:-.055em; }
h1 { font-size:clamp(3rem,6vw,6.25rem); line-height:.98; }
h2 { font-size:clamp(2rem,4.35vw,4rem); line-height:1.08; }
.hero { gap:clamp(1.5rem,4vw,4rem); }
figure img { border-radius:1.5rem; box-shadow:0 1.1rem 3rem #193f7030; }
.hero-actions,.quiz-actions { display:flex; align-items:center; flex-wrap:wrap; gap:.75rem; margin-top:1.25rem; }
.hero-actions .button,.quiz-actions .button { margin-top:0; }
.button,.secondary { border-radius:.7rem; font:600 .9rem/1.4 "Instrument Sans",system-ui,sans-serif; padding:.75rem 1rem; cursor:pointer; }
.button { border:1px solid transparent; }
.secondary { color:var(--green); background:#f7fbff; border:1px solid var(--rule); text-decoration:none; }
.secondary:hover { background:#dcecff; }
.steps,.claims { background:transparent; border:0; gap:1rem; }
.steps li,.claims article,.document-library { background:#fff; border:1px solid var(--rule); border-radius:1rem; }
.example { border:1px solid var(--rule); border-radius:1.4rem; }
#calc,.quiz { padding:clamp(1rem,3vw,1.75rem); background:#fff; border:1px solid var(--rule); border-radius:1rem; }
select { width:100%; padding:.55rem .7rem; background:var(--paper); color:var(--ink); border:1px solid #7d9fba; border-radius:.25rem; font:inherit; }
.pathway-controls { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
.pathway-controls button { border:1px solid var(--rule); border-radius:2rem; padding:.62rem 1rem; color:var(--ink); background:#fff; font:600 .92rem "Instrument Sans",system-ui,sans-serif; cursor:pointer; }
.pathway-controls button[aria-pressed=true] { background:var(--green); color:#fff; border-color:var(--green); }
.pathway-panel { padding:clamp(1rem,3vw,2rem); background:#fff; border:1px solid var(--rule); border-radius:1rem; }
.pathway-panel h3 { font-size:1.4rem; }
.pathway-panel dl { display:grid; grid-template-columns:auto 1fr; gap:.8rem 1.4rem; margin:0; }
.pathway-panel dt { font-weight:700; }
.pathway-panel dd { margin:0; }
.quiz { max-width:55rem; }
.quiz fieldset { padding:0; margin:0; border:0; display:grid; gap:.6rem; }
.quiz legend { font-weight:700; margin-bottom:.75rem; }
.quiz label { display:flex; gap:.65rem; align-items:baseline; padding:.7rem; border:1px solid var(--rule); border-radius:.65rem; background:var(--paper); cursor:pointer; }
.quiz input { width:auto; accent-color:var(--green); flex-shrink:0; }
.quiz-feedback { margin:0; color:var(--green); font-weight:600; }
.quiz-feedback:not(:empty) { margin-top:.5rem; }
button:focus-visible,select:focus-visible,summary:focus-visible { outline:3px solid #357ebe; outline-offset:4px; }
@media(max-width:680px) {
  h1 { font-size:clamp(2.85rem,10vw,4.4rem); }
  nav { gap:.35rem .85rem; }
  .pathway-panel dl { grid-template-columns:1fr; gap:.3rem; }
  .pathway-panel dd + dt { margin-top:.65rem; }
}

.quiz + .quiz { margin-top:1.25rem; }
.quiz fieldset p { margin:0 0 .25rem; }

.hero-photo {
  overflow:hidden;
  border-radius:1.5rem;
  box-shadow:0 1.1rem 3rem #193f7030;
}
.hero-photo img { border-radius:0; box-shadow:none; }
@media (any-hover:hover) and (any-pointer:fine) and (prefers-reduced-motion:no-preference) {
  .hero { position:relative; isolation:isolate; }
  .hero::before {
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:radial-gradient(circle 20rem at var(--glow-x,50%) var(--glow-y,50%), #70b9ff65, transparent 100%);
    opacity:0;
    transition:opacity .35s ease;
  }
  .hero.is-tracking::before { opacity:1; }
  .hero-photo img {
    transform:translate(var(--photo-x,0px),var(--photo-y,0px)) scale(1.07);
    transition:transform .24s ease-out;
  }
}