/* ==========================================================================
   Build2Income — public component library (contract: design/components.md)
   Loads after styles.css and knowledge.css. Tokens live in styles.css.
   Components: hero--title, hero--inner, curve, lead, doors, record, ledger
   (+ --card, --xl, --navy, ledger-block), band (--figures, --close), phases,
   tracker (+ --compact), steps-table, guide-row, programs, faq, split,
   sheetindex, name-card, sources, tiles--serif, utilities, motion.
   No vertical rules, no shadows, radius 0/2, red only where the spec puts it.
   ========================================================================== */

/* ---- Hero: home title hero ----------------------------------------------
   grid 7/5, figure bleeds to the right edge of the viewport inside
   overflow-x:clip. The bleed is the distance from the container edge to the
   viewport edge: (100vw − container)/2 while the container is capped, and one
   gutter once the viewport is narrower than the cap. */
.hero{position:relative;overflow-x:clip;background:var(--white)}
.hero__grid{display:grid;align-items:start}
.hero__text{min-width:0}
.hero__text>.record-head__label{margin-bottom:var(--s3)}
.hero--title .hero__grid{grid-template-columns:7fr 5fr;gap:var(--s7);padding-top:var(--s7)}
.hero--title h1{margin-bottom:0}
.hero__figure{position:relative;min-width:0;margin:0}
.hero--title .hero__figure{margin-right:min(calc((var(--container) - 100vw) / 2),calc(-1 * var(--gutter)))}
.hero--title .hero__figure img{width:100%;height:640px;object-fit:cover;display:block}
.hero--title .hero__figure .note--figure{margin-right:0;max-width:72ch}
.hero--title .doors{margin-top:var(--s6)}
.hero--title .actions{margin-top:var(--s6)}
/* ---- Hero: inner page hero --------------------------------------------- */
.hero--inner .hero__grid{grid-template-columns:7fr 4fr;column-gap:calc(100% / 12 + 24px);row-gap:var(--s6);padding:var(--s7) 0;border-bottom:1px solid var(--rule)}
.hero--inner h1,h1.h1--inner{font-size:var(--fs-h1-inner);line-height:1.06;max-width:20ch;margin-bottom:0}
.hero--inner .hero__figure img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.hero--inner .hero__figure.ratio-21-9 img,.hero--inner .hero__figure img[width="1400"]{aspect-ratio:21/9}
/* ---- Curve: the emblem's road, 88×14, once per page ---------------------- */
.curve{display:block;width:88px;height:14px;color:var(--red);margin:var(--s4) 0 20px}
.curve path{stroke:currentColor}
.curve--mark{width:24px;height:8px;margin:0}
/* ---- Lead ----------------------------------------------------------------- */
.lead{font:400 var(--fs-lead)/1.5 var(--font-text);color:var(--ink);max-width:var(--measure-lead);margin:0 0 var(--s5)}
.curve+.lead{margin-top:0}
/* ---- Doors: segmented control ------------------------------------------- */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:2px;max-width:420px;border:1px solid var(--navy);border-radius:var(--radius-ui);background:var(--white)}
.doors__item{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 12px;border:0;border-radius:1px;background:none;font:500 15px/1 var(--font-text);color:var(--navy);white-space:nowrap;cursor:pointer;transition:background-color .16s,color .16s}
.doors__item:hover{background:var(--navy-06)}
.doors__item[aria-pressed="true"],.doors__item.active{background:var(--navy);color:#fff}
.doors__item:focus-visible{outline-offset:-3px}
.doors--compact{display:inline-flex;flex-wrap:wrap;grid-template-columns:none;max-width:100%}
.doors--compact .doors__item{height:34px;padding:0 14px;font-size:14px}

/* ---- Record: section wrapper with a single hairline join ----------------- */
.record{padding:var(--section-pad) 0;background:var(--white)}
.record+.record>.container{border-top:1px solid var(--rule);padding-top:var(--section-pad)}
.record--wide>.container{max-width:var(--container-wide)}
.record--ledger{background:var(--ledger)}
.record--ledger+.record>.container,.record+.record--ledger>.container,.band+.record>.container,.hero+.record>.container{border-top:0;padding-top:0}
.record>.container>:last-child{margin-bottom:0}
.record .record-head+.lead{margin-top:calc(-1 * var(--s6))}

/* ---- Ledger: the signature ---------------------------------------------
   dl rows: label left, figure right, one baseline, hairline between rows.
   Head closed by the double rule; the serif total closes the block. */
.ledger{display:block;margin:0;padding:0;font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1}
.ledger__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px var(--s5);padding:0 0 var(--s3);border-bottom:3px double var(--navy);font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy)}
.ledger__head>span:first-child{min-width:0;flex:1 1 auto}
.ledger__head .record-head__date,.ledger__head .stamp{flex-shrink:0;margin:0;white-space:nowrap}
.ledger__head .record-head__date{white-space:normal;text-align:right}
.ledger__row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s5);padding:14px 0;margin:0;border-bottom:1px solid var(--rule)}
.ledger__row dt{margin:0;font:400 var(--fs-body)/1.4 var(--font-text);color:var(--ink);min-width:0}
.ledger__row dt small{display:inline;font-size:var(--fs-caption);color:var(--muted);margin-left:8px}
.ledger__row dd{margin:0;font:500 var(--fs-body)/1.4 var(--font-text);color:var(--navy);text-align:right;white-space:nowrap;flex-shrink:0}
.ledger__row dd .unit,.ledger__row dd small{font:400 var(--fs-caption)/1 var(--font-text);color:var(--muted);margin-left:4px}
.ledger__row dd.muted{color:var(--muted);font-weight:400;white-space:normal}
.ledger__total{border-bottom:3px double var(--navy);padding:18px 0}
.ledger__total dt{font-weight:500;color:var(--navy)}
.ledger__total dd{font:400 var(--fs-fig-l)/1 var(--font-display);letter-spacing:0;color:var(--navy)}
.ledger__foot{padding-top:var(--s3)}
.ledger__foot .note{border-top:0;padding-top:0;display:block}
.ledger__head+.ledger__row,.ledger__total+.ledger__row{padding-top:14px}
sup.fn{font:500 12px/1 var(--font-text);color:var(--muted);vertical-align:super;margin-left:2px;letter-spacing:0}
sup.fn a{color:inherit;text-decoration:none}
sup.fn a:hover{text-decoration:underline}
.ledger--navy,.ledger--navy .ledger__row dt,.ledger--navy .ledger__row dd,.ledger--navy .ledger__head,.ledger--navy .ledger__total dd,.ledger--navy .ledger__total dt{color:var(--on-navy)}
.ledger--navy .ledger__row{border-bottom-color:var(--on-navy-rule)}
.ledger--navy .ledger__head,.ledger--navy .ledger__total{border-bottom:3px double #fff}
.ledger--navy sup.fn,.ledger--navy .ledger__row dt small,.ledger--navy .ledger__row dd small{color:var(--on-navy-muted)}
.ledger--xl .ledger__row{min-height:88px;padding:16px 0;align-items:baseline}
.ledger--xl .ledger__row dt{font-size:var(--fs-body);max-width:26ch}
.ledger--xl .ledger__row dd{font:400 var(--fs-fig-xl)/1 var(--font-display);letter-spacing:-.01em}
.ledger--xl .ledger__row:last-child{border-bottom:3px double var(--navy)}
.ledger--navy.ledger--xl .ledger__row:last-child{border-bottom:3px double #fff}
.ledger--xl sup.fn{font-size:14px;vertical-align:top;margin-left:4px}
.ledger--card .ledger__row{padding:10px 0}
.ledger--card .ledger__row dt{font-size:var(--fs-small)}
.ledger--card .ledger__row dd{font-size:var(--fs-small)}
.ledger--card .ledger__total{padding:12px 0}
.ledger--card .ledger__total dt{font-size:var(--fs-small)}
.ledger--card .ledger__total dd{font-size:var(--fs-fig-m)}
.ledger-block{background:var(--ledger);padding:var(--s5) 28px}
.ledger-block>.ledger__head:first-child{margin-top:0}
.ledger-block .actions{margin-top:var(--s5)}
.ledger-block>:last-child{margin-bottom:0}
.ledger-block p:not(.name-card__name){font-size:var(--fs-small);line-height:1.55}
/* Hairline definition list (detail Overview "What you buy") */
.deflist{margin:0}
.deflist>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s5);padding:12px 0;border-bottom:1px solid var(--rule)}
.deflist dt{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0}
.deflist dd{font:500 var(--fs-body)/1.4 var(--font-text);color:var(--navy);margin:0}

/* ---- Bands: figures and closing ----------------------------------------- */
.band{background:var(--navy);color:var(--on-navy);padding:var(--band-pad) 0}
.band h2,.band h3{color:var(--on-navy)}
.band p{color:var(--on-navy)}
.band .record-head{margin-bottom:var(--s6)}
.band .record-head__label,.band .record-head__date{color:var(--on-navy-muted)}
.band__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s7);align-items:start}
.band__structure{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s5);margin:var(--s5) 0 0;max-width:none;font:400 var(--fs-ui)/1.5 var(--font-text);color:var(--on-navy)}
.band .button.tertiary{color:var(--on-navy);min-height:0}
.band__statement{font:400 48px/1.1 var(--font-display);color:var(--on-navy);letter-spacing:-.01em;max-width:24ch;margin:0 0 var(--s6)}
.band__statement em{font-style:italic;color:var(--on-navy)}
.band--close .actions{margin-top:0}
.band__body{font:400 var(--fs-lead)/1.5 var(--font-text);color:var(--on-navy-muted);max-width:var(--measure-lead);margin:calc(-1 * var(--s3)) 0 var(--s6)}
.band__footnotes{margin:var(--s4) 0 0;padding-left:20px;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--on-navy-muted);max-width:72ch}
.band__footnotes li{padding:2px 0}
.band .note{margin-top:var(--s5);color:var(--on-navy-muted);border-color:var(--on-navy-rule)}
.band .note svg{color:var(--on-navy-muted)}

/* ---- Phases: five solid navy segments on a baseline ---------------------- */
.phases{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s5);list-style:none;margin:0;padding:var(--s5) 0 0}
.phases::before{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:var(--navy)}
.phases__item{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0}
.phases__tick{position:absolute;left:0;top:-22px;width:2px;height:12px;background:var(--navy)}
.phases__name{font:500 var(--fs-ui)/1.3 var(--font-text);color:var(--navy)}
.phases__note{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.phases__caption{font:500 var(--fs-caption)/1.5 var(--font-text);color:var(--navy);margin-top:2px}
.phases__item.is-highlight .phases__tick,.phases__item.is-current .phases__tick{width:3px;height:18px;background:var(--red)}

/* ---- Tracker: ten stages ------------------------------------------------ */
.tracker{display:block;margin:0}
.tracker>.ledger__head{margin:0}
.tracker__list{list-style:none;margin:0;padding:0;font-variant-numeric:tabular-nums lining-nums}
.tracker__row{display:grid;grid-template-columns:24px 32px minmax(0,1fr) minmax(0,1.2fr) auto 120px;gap:var(--s4);align-items:center;min-height:56px;padding:8px 0;border-bottom:1px solid var(--rule)}
.tracker__mark{display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:var(--navy)}
.tracker__mark svg{width:16px;height:16px}
.tracker__mark .curve--mark{width:24px;height:8px}
.tracker__row.is-current .tracker__mark{color:var(--red)}
.tracker__n{font:400 var(--fs-caption)/1 var(--font-text);color:var(--muted)}
.tracker__name{font:500 var(--fs-body)/1.3 var(--font-text);color:var(--navy);min-width:0}
.tracker__name small{display:block;font:400 var(--fs-caption)/1.4 var(--font-text);color:var(--muted);margin-top:2px}
.tracker__row.is-next .tracker__name{color:var(--ink);font-weight:400}
.tracker__docs{font:400 var(--fs-small)/1.4 var(--font-text);color:var(--muted);min-width:0}
.tracker__row .badge{justify-self:start}
.tracker__date{font:400 var(--fs-small)/1 var(--font-text);color:var(--ink);text-align:right;white-space:nowrap}
.tracker__row.is-next .tracker__date{color:var(--muted)}
.tracker__row.is-milestone{border-bottom:3px double var(--navy)}
.tracker>.ledger__row{margin-top:0}
.tracker>.ledger__row dd{white-space:normal;text-align:right}
/* Glossary mode (/construction): no marks, badges or dates; name + documents only */
.tracker--glossary .tracker__row{grid-template-columns:32px minmax(0,1fr) minmax(0,1.2fr)}
.tracker--glossary .tracker__mark{display:none}
.tracker--glossary .tracker__row .tracker__name{color:var(--navy);font-weight:500}
/* Compact: ten 6×14 ticks + 13px caption */
.tracker--compact{display:flex;align-items:center;flex-wrap:wrap;gap:3px;min-width:0}
.tracker--compact .t{display:block;width:6px;height:14px;background:var(--rule);flex-shrink:0}
.tracker--compact .t-done{background:var(--navy)}
.tracker--compact .t-current{background:var(--red)}
.tracker--compact__label{font:400 var(--fs-caption)/1.4 var(--font-text);color:var(--muted);margin-left:9px;min-width:0}

/* ---- Steps table: step / responsible / you receive ----------------------- */
.steps-table{width:100%;border-collapse:collapse;text-align:left;font:400 var(--fs-small)/1.5 var(--font-text);color:var(--ink)}
.steps-table th{padding:0 var(--s5) 12px 0;border-bottom:1px solid var(--rule);font:500 var(--fs-caption)/1.4 var(--font-text);color:var(--muted);text-transform:none;letter-spacing:0;vertical-align:bottom}
.steps-table th:first-child{width:40%}
.steps-table th:last-child,.steps-table td:last-child{padding-right:0}
.steps-table td{padding:var(--s4) var(--s5) var(--s4) 0;border-bottom:1px solid var(--rule);vertical-align:top;min-height:64px}
.steps-table__n{display:block;font:400 var(--fs-caption)/1 var(--font-text);color:var(--muted);margin-bottom:8px;font-variant-numeric:tabular-nums lining-nums}
.steps-table td strong{display:block;font:500 var(--fs-body)/1.3 var(--font-text);color:var(--navy);margin-bottom:4px}
.steps-table td span{display:block;color:var(--ink)}
.steps-table td>.steps-table__n+strong{margin-top:0}

/* ---- Guide row ----------------------------------------------------------- */
.guide-row{display:grid;grid-template-columns:160px minmax(0,1fr);gap:var(--s5);align-items:start;padding:var(--s5) 0;border-bottom:1px solid var(--rule);color:inherit;text-decoration:none}
.guide-row:first-child,.guide-list>.guide-row:first-of-type,.guide-rows>.guide-row:first-child{border-top:1px solid var(--rule)}
.guide-rows{display:block}
.guide-row:not(:has(.guide-row__thumb)),.guide-row.guide-row--text{grid-template-columns:minmax(0,1fr)}
.guide-row__thumb{margin:0;overflow:hidden;background:var(--ledger)}
.guide-row__thumb img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.guide-row__thumb:empty{display:none}
.guide-row>div{min-width:0}
.guide-row .record-head__label{margin-bottom:8px}
.guide-row h3{margin:0 0 8px;max-width:none}
.guide-row:hover h3{text-decoration:underline;text-underline-offset:4px}
.guide-row p.small,.guide-row p{font-size:var(--fs-small);line-height:1.55;color:var(--ink);margin:0;max-width:60ch}
.guide-row p.record-head__label{font-size:var(--fs-caption);color:var(--muted);margin-bottom:8px}

/* ---- Programs ------------------------------------------------------------ */
.programs .ledger__head{margin-bottom:0}
.programs__list{list-style:none;margin:0;padding:0}
.programs__list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px var(--s5);align-items:center;padding:20px 0;border-bottom:1px solid var(--rule)}
.programs__list li>h4{grid-column:1;margin:0}
.programs__list li>p{grid-column:1;margin:0;max-width:var(--measure)}
.programs__list li>.button{grid-column:2;grid-row:1/span 2;align-self:center;min-height:0}
.programs .actions{margin-top:var(--s5)}

/* ---- FAQ ----------------------------------------------------------------- */
.faq{display:grid;grid-template-columns:4fr 7fr;column-gap:calc(100% / 12 + 24px);row-gap:var(--s6);align-items:start}
.faq__title h2{margin:0}
.faq__list{border-top:1px solid var(--rule);min-width:0}
.faq__item,.commercial-faq{border-bottom:1px solid var(--rule);background:none;border-radius:0;margin:0;overflow:visible}
.faq__item summary,.commercial-faq summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);min-height:64px;padding:12px;margin:0 -12px;list-style:none;font:500 var(--fs-body)/1.4 var(--font-text);color:var(--navy);cursor:pointer;transition:background-color .12s;border-radius:0}
.faq__item summary::-webkit-details-marker,.commercial-faq summary::-webkit-details-marker{display:none}
.faq__item summary::after,.commercial-faq summary::after{content:'+';font:400 24px/1 var(--font-text);color:var(--navy);flex-shrink:0}
.faq__item[open] summary::after,.commercial-faq[open] summary::after{content:'−'}
.faq__item summary:hover,.commercial-faq summary:hover{background:var(--navy-06)}
.faq__item[open] summary,.commercial-faq[open] summary{border-bottom:0}
.faq__item>p,.faq__item>div,.faq__item>ul,.faq__item>ol,.commercial-faq>p,.commercial-faq>div,.commercial-faq>ul,.commercial-faq>ol{font:400 var(--fs-small)/1.55 var(--font-text);color:var(--ink);max-width:60ch;margin:0 0 var(--s4);padding:0}
.faq__item>ul,.faq__item>ol,.commercial-faq>ul,.commercial-faq>ol{padding-left:22px}
.faq__item[open],.commercial-faq[open]{padding-bottom:var(--s2)}

/* ---- Split: text + aside ------------------------------------------------- */
.split{display:grid;grid-template-columns:7fr 4fr;column-gap:calc(100% / 12 + 24px);row-gap:var(--s6);align-items:start}
.split--figure-left{grid-template-columns:5fr 6fr}
.split__main,.split__aside{min-width:0}
.split__main>:last-child,.split__aside>:last-child{margin-bottom:0}
.split figure img,.split__aside img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.split__aside .ledger-block{margin:0}
.split__aside h3,.split__aside h4{margin-bottom:var(--s3)}
/* hairline list (asides, dossier contents, three ways) */
.hairlines,.list--hairline{list-style:none;margin:0;padding:0}
.hairlines li,.list--hairline li{padding:12px 0;border-bottom:1px solid var(--rule);font:400 var(--fs-small)/1.55 var(--font-text);color:var(--ink)}
.hairlines li:first-child,.list--hairline li:first-child{border-top:1px solid var(--rule)}
.hairlines li strong,.list--hairline li strong{color:var(--navy);font-weight:500}
.columns-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s7);border-top:1px solid var(--rule);padding-top:var(--s5)}
.columns-3>div{min-width:0}
.columns-3 h3{margin-bottom:var(--s3)}
.columns-3 p{font-size:var(--fs-small);line-height:1.55}
.columns-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s7)}

/* ---- Sheet index: "On this page" --------------------------------------- */
.sheetindex{display:flex;flex-direction:column;align-self:start;min-width:0;padding-top:var(--s2)}
.sheetindex .record-head__label{margin-bottom:var(--s2)}
.sheetindex a{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--rule);font:500 var(--fs-ui)/1.3 var(--font-text);color:var(--navy);text-decoration:none}
.sheetindex a:first-of-type{border-top:1px solid var(--rule)}
.sheetindex a:hover{text-decoration:underline;text-underline-offset:4px}

/* ---- Name card (Wagner) -------------------------------------------------- */
.name-card{border:1px solid var(--rule);padding:28px}
.name-card__name{font:400 40px/1.1 var(--font-display);color:var(--navy);letter-spacing:-.01em;margin:0 0 var(--s2);max-width:none}
.name-card__role{font:400 var(--fs-small)/1.5 var(--font-text);color:var(--muted);margin:0 0 20px;max-width:none}
.name-card__rule{border:0;border-top:1px solid var(--rule);margin:0 0 20px}
.name-card .curve{margin:0 0 20px}
.name-card .stamp{margin:0}

/* ---- Sources: hairline list, 13px ---------------------------------------- */
.sources ol,.note--sources ol{margin:0;padding-left:20px;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted)}
.sources li,.note--sources li{padding:8px 0;border-bottom:1px solid var(--rule)}
.sources li:last-child,.note--sources li:last-child{border-bottom:0}
.sources a{color:var(--navy);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.sources i{font-style:italic}
.note--sources .record-head__label{margin-bottom:var(--s2)}

/* ---- Figures with captions ---------------------------------------------- */
figure.figure img,.record figure img{width:100%;height:auto;object-fit:cover}
figure>img+.note--figure{margin-top:var(--s3)}

/* ---- Utilities ------------------------------------------------------------ */
.tnum{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1}
.measure{max-width:var(--measure)}
.mt-0{margin-top:0}

/* ---- Motion: one mechanism, one moment per page load -------------------- */
#app.is-drawing .hero .curve path,#app.is-drawing .name-card .curve path{stroke-dasharray:100;stroke-dashoffset:100;animation:curve-draw .6s cubic-bezier(.22,.61,.36,1) .12s forwards}
#app.is-drawing .tracker__row .tracker__mark{opacity:0;animation:mark-in .3s ease-out forwards}
#app.is-drawing .tracker__row:nth-child(1) .tracker__mark{animation-delay:.06s}
#app.is-drawing .tracker__row:nth-child(2) .tracker__mark{animation-delay:.12s}
#app.is-drawing .tracker__row:nth-child(3) .tracker__mark{animation-delay:.18s}
#app.is-drawing .tracker__row:nth-child(4) .tracker__mark{animation-delay:.24s}
#app.is-drawing .tracker__row:nth-child(5) .tracker__mark{animation-delay:.3s}
#app.is-drawing .tracker__row:nth-child(6) .tracker__mark{animation-delay:.36s}
#app.is-drawing .tracker__row:nth-child(7) .tracker__mark{animation-delay:.42s}
#app.is-drawing .tracker__row:nth-child(8) .tracker__mark{animation-delay:.48s}
#app.is-drawing .tracker__row:nth-child(9) .tracker__mark{animation-delay:.54s}
#app.is-drawing .tracker__row:nth-child(10) .tracker__mark{animation-delay:.6s}
#app.is-drawing .tracker__row.is-current .curve--mark path{stroke-dasharray:30;stroke-dashoffset:30;animation:curve-draw .4s cubic-bezier(.22,.61,.36,1) .75s forwards}
@keyframes curve-draw{to{stroke-dashoffset:0}}
@keyframes mark-in{to{opacity:1}}
@media (prefers-reduced-motion:reduce){#app.is-drawing .curve path,#app.is-drawing .tracker__row.is-current .curve--mark path{stroke-dashoffset:0}#app.is-drawing .tracker__row .tracker__mark{opacity:1}}

/* ---- Tabular figures: re-assert after every `font:` shorthand above (the
   shorthand resets font-variant-numeric and font-feature-settings) ---------- */
.ledger dd,.ledger dt small,.ledger__total dd,.ledger--xl .ledger__row dd,.tracker__n,.tracker__date,.steps-table__n,.tiles__value,.tiles__sub,
.calc-breakdown>div,.calc-breakdown>div b,.calc-breakdown>div strong,.calc-result strong,.deflist dd,.compare-card dd,.data-table td,.data-table th,
.property-card__meta,.property-price strong,.property-price b,.portfolio-value>b,.bar-column>span,.mini-stats b,.mini-stats strong,.fact strong,.fact b,
.record-head__date,.tracker--compact__label,.statusword,.field input,.small-select{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1}

/* ---- Breakpoints: 1200 / 1024 / 720 / 480 -------------------------------- */
@media (max-width:1199px){
  .hero--title .hero__grid{grid-template-columns:6fr 5fr;gap:var(--s6)}
  .hero--title .hero__figure img{height:560px}
  .band__statement{font-size:40px}
  .columns-3{gap:var(--s6)}
}
@media (max-width:1023px){
  .hero--title .hero__grid{grid-template-columns:minmax(0,1fr)}
  .hero--title .hero__figure{margin-right:0}
  .hero--title .hero__figure img{height:auto;aspect-ratio:16/9}
  .hero--inner .hero__grid{grid-template-columns:minmax(0,1fr);row-gap:var(--s6)}
  .sheetindex{display:none}
  .band__grid{grid-template-columns:minmax(0,1fr);gap:var(--s6)}
  .faq{grid-template-columns:minmax(0,1fr)}
  .faq__title h2{margin-bottom:0}
  .split,.split--figure-left{grid-template-columns:minmax(0,1fr)}
  .columns-3{grid-template-columns:minmax(0,1fr);gap:var(--s5)}
  .columns-3>div{border-top:1px solid var(--rule);padding-top:var(--s4)}
  .columns-3>div:first-child{border-top:0;padding-top:0}
  .columns-2{grid-template-columns:minmax(0,1fr)}
  .tracker__row{grid-template-columns:24px 32px minmax(0,1fr) auto}
  .tracker__row .tracker__docs{grid-column:3;grid-row:2}
  .tracker__row .tracker__date{grid-column:4;grid-row:2}
  .tracker__row{row-gap:4px;padding:12px 0}
  .tracker__mark,.tracker__n{grid-row:1/span 2}
  .tracker--glossary .tracker__row{grid-template-columns:28px minmax(0,1fr)}
  .tracker--glossary .tracker__row .tracker__docs{grid-column:2;grid-row:2}
}
@media (max-width:719px){
  .hero--title .hero__grid{padding-top:var(--s6);gap:var(--s6)}
  .hero--title .hero__figure{margin:0 calc(-1 * var(--gutter))}
  .hero--title .hero__figure .note--figure{padding:0 var(--gutter)}
  .hero--inner .hero__grid{padding:var(--s6) 0}
  .curve{margin:var(--s3) 0 var(--s4)}
  .doors{max-width:none}
  .doors__item{height:44px;padding:0 8px}
  .hero--title .actions{margin-top:var(--s5)}
  .band__statement{font-size:30px;line-height:1.15;margin-bottom:var(--s5)}
  .band__structure{display:block}
  .band__structure .button{display:inline-flex;margin-top:var(--s2)}
  .ledger__row dt{font-size:var(--fs-small)}
  .ledger__row dd{font-size:var(--fs-small)}
  .ledger .ledger__row.ledger__total dd{font-size:var(--fs-fig-l)}
  .ledger--card .ledger__row.ledger__total dd{font-size:var(--fs-fig-m)}
  .ledger--xl .ledger__row{min-height:0;flex-direction:column;align-items:flex-start;gap:6px;padding:14px 0}
  .ledger--xl .ledger__row dd{text-align:left;white-space:normal}
  .ledger--xl .ledger__row dt{max-width:none}
  .ledger-block{padding:var(--s4) var(--s4)}
  .phases{display:flex;flex-direction:column;gap:var(--s5);padding:0 0 0 var(--s5);border-left:2px solid var(--navy)}
  .phases::before{display:none}
  .phases__tick{left:-26px;top:8px;width:12px;height:2px}
  .phases__item.is-highlight .phases__tick,.phases__item.is-current .phases__tick{left:-26px;top:7px;width:18px;height:3px}
  .tracker__row{grid-template-columns:24px 28px minmax(0,1fr) auto;gap:var(--s2) var(--s3)}
  .tracker__name{font-size:var(--fs-small)}
  .tracker__docs{font-size:var(--fs-caption)}
  .tracker__date{font-size:var(--fs-caption)}
  .steps-table thead{display:none}
  .steps-table,.steps-table tbody{display:block}
  .steps-table tr{display:block;padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
  .steps-table td{display:block;padding:4px 0;border:0;min-height:0}
  .steps-table td::before{content:attr(data-label);display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin-bottom:2px}
  .steps-table td:first-child::before{display:none}
  .steps-table td:first-child{padding-bottom:var(--s2)}
  .guide-row{grid-template-columns:96px minmax(0,1fr);gap:var(--s4);padding:var(--s4) 0}
  .programs__list li{grid-template-columns:minmax(0,1fr)}
  .programs__list li>.button{grid-column:1;grid-row:auto;justify-self:start;margin-top:var(--s2)}
  .faq__item summary,.commercial-faq summary{min-height:56px;font-size:var(--fs-small);padding:10px 0;margin:0}
  .name-card{padding:var(--s5)}
  .name-card__name{font-size:32px}
}
@media (max-width:479px){
  .doors__item{font-size:14px}
  .hero--title .hero__figure img{aspect-ratio:4/3}
  .tracker__row{grid-template-columns:20px 24px minmax(0,1fr) auto;gap:4px var(--s2)}
  .tracker__mark{width:20px}
  .guide-row{grid-template-columns:minmax(0,1fr)}
  .guide-row__thumb{max-width:160px}
}