/* Last 100 Feet: components not covered by theme.json.
   Colors come from the theme.json palette (--wp--preset--color--*). */

:root {
	--l-ground: var(--wp--preset--color--ground, #0B0D0C);
	--l-band: var(--wp--preset--color--band, #121513);
	--l-surface: var(--wp--preset--color--surface, #15181A);
	--l-raised: var(--wp--preset--color--raised, #1C1F1D);
	--l-line: var(--wp--preset--color--line, #2A2E2B);
	--l-ink: var(--wp--preset--color--ink, #F2EFE9);
	--l-ink-2: var(--wp--preset--color--ink-2, #CFCBC0);
	--l-muted: var(--wp--preset--color--muted, #9A968B);
	--l-teal: var(--wp--preset--color--teal, #1DA679);
	--l-teal-dark: var(--wp--preset--color--teal-dark, #168F68);
	--l-amber: var(--wp--preset--color--amber, #E89A4D);
	--l-display: var(--wp--preset--font-family--display);
	color-scheme: dark;
}
body { background: var(--l-ground); -webkit-font-smoothing: antialiased; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
:focus-visible { outline: 3px solid var(--l-teal); outline-offset: 2px; }
h1, h2, h3 { text-wrap: balance; }
.wp-block-group.is-layout-grid > * { min-width: 0; }

/* ---------- header ---------- */
.site-head { padding: 24px clamp(16px, 4vw, 40px) !important; border-bottom: 1px solid var(--l-raised); gap: 16px; }
.lockup { display: inline-flex; flex-direction: column; gap: 6px; text-decoration: none; }
.lockup-word { display: flex; align-items: baseline; gap: 8px; font-family: var(--l-display); font-weight: 800; text-transform: uppercase; letter-spacing: 0.14em; font-size: 24px; line-height: 1; color: var(--l-ink); }
.lockup-word .hundred { color: var(--l-amber); }
.lockup-line { display: flex; align-items: center; }
.lockup-line .solid { flex: 1; height: 2px; background: var(--l-teal); }
.lockup-line .dash { width: 24px; height: 0; border-top: 2px dashed var(--l-teal); margin-left: 3px; }
.site-nav .wp-block-navigation-item__content { color: var(--l-ink-2); text-decoration: none; padding-bottom: 4px; border-bottom: 2px solid transparent; }
.site-nav .wp-block-navigation-item__content:hover { color: var(--l-ink); }
.site-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--l-ink); border-bottom-color: var(--l-teal); }
.site-nav.wp-block-navigation { gap: 8px 28px; }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--l-ground) !important; color: var(--l-ink) !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 20px; }
.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close { color: var(--l-ink); }

/* ---------- footer ---------- */
.site-foot { padding: 56px clamp(16px, 4vw, 40px) 36px !important; border-top: 1px solid var(--l-raised); margin-top: 0; }
.site-foot-main { gap: 32px; }
.foot-lockup { display: flex; flex-direction: column; gap: 12px; }
.lockup-word.lg { gap: 12px; letter-spacing: 0.16em; font-size: 36px; }
.lockup-line.lg { width: 100%; }
.lockup-line.lg .solid { height: 3px; }
.lockup-line.lg .dash { width: 40px; border-top-width: 3px; margin-left: 4px; }
.tagline { font-size: 13px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--l-teal); }
.foot-credit { gap: 6px; font-size: 14px; }
.foot-credit p { margin: 0; color: var(--l-muted); font-size: 14px; }
.foot-credit a { color: var(--l-ink-2); }
.foot-credit .copy-line { font-size: 13px; }
.foot-links { margin-top: 28px !important; padding-top: 20px; border-top: 1px solid var(--l-raised); gap: 6px 24px; font-size: 14px; }
.foot-links .wp-block-navigation-item__content { color: var(--l-muted); text-decoration: none; }
.foot-links .wp-block-navigation-item__content:hover { color: var(--l-ink); }
@media (max-width: 600px) {
	.lockup-word.lg { font-size: 30px; }
	.tagline { letter-spacing: 0.18em; }
}

/* ---------- sections (wide pages) ---------- */
.site-main.is-wide .wp-block-post-content > * { margin-block-start: 0; }
.l-section { padding-top: 80px !important; padding-bottom: 80px !important; }
.l-section.is-hero { padding-top: 96px !important; padding-bottom: 72px !important; }
.l-section.is-band { background: var(--l-band); }
.l-section.is-centered { text-align: center; }
.l-section.is-centered .wp-block-buttons { justify-content: center; }
.l-measure { max-width: 760px; }
.is-centered .l-measure { margin-left: auto !important; margin-right: auto !important; }
.has-lead-font-size { line-height: 1.6; }

.is-style-eyebrow { font-size: 13px !important; letter-spacing: 0.2em; text-transform: uppercase; color: var(--l-teal) !important; font-weight: 600; margin-bottom: 0; }
.is-style-eyebrow a { color: inherit; text-decoration: none; }
.is-style-section-number { font-family: var(--l-display); font-weight: 800; font-size: 20px !important; color: var(--l-teal) !important; letter-spacing: 0.1em; margin-bottom: 0 !important; }
.is-style-section-number + .wp-block-heading { margin-top: 8px; }
.is-style-card-label { font-size: 13px !important; letter-spacing: 0.15em; text-transform: uppercase; color: var(--l-muted) !important; font-weight: 600; margin: 0; }
.is-style-card-label.is-teal { color: var(--l-teal) !important; }
.is-style-card-label.is-amber { color: var(--l-amber) !important; }
.is-style-arrow-link { font-size: 15px !important; font-weight: 600; margin-top: auto !important; }
.is-style-arrow-link a { text-decoration: none; }
.is-style-arrow-link a::after { content: " \2192"; }
.is-muted, p.is-muted { color: var(--l-muted) !important; }
.is-ink, p.is-ink { color: var(--l-ink) !important; }

.is-style-card, .is-style-card-top-rule, .is-style-card-highlight { background: var(--l-surface); border-radius: 10px; padding: 28px !important; display: flex; flex-direction: column; gap: 12px; }
.is-style-card { border: 1px solid var(--l-line); }
.is-style-card.is-band-card { background: var(--l-band); border-color: var(--l-raised); }
.is-style-card-top-rule { border-top: 3px solid var(--l-teal); padding: 22px 24px !important; }
.is-style-card-highlight { border: 2px solid var(--l-teal); }
.is-style-card > *, .is-style-card-top-rule > *, .is-style-card-highlight > * { margin: 0 !important; }
.card-title { font-size: 17px !important; font-weight: 600; color: var(--l-ink) !important; }
.card-quote { font-size: 18px !important; font-weight: 600; line-height: 1.35; color: var(--l-ink) !important; }
.card-display { font-family: var(--l-display); font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; font-size: 22px !important; color: var(--l-ink) !important; }
.card-body { font-size: 15px !important; line-height: 1.6; color: var(--l-muted) !important; flex: 1; }

/* buttons */
.wp-block-button.is-style-outline-teal .wp-block-button__link { background: transparent; color: var(--l-teal); border: 2px solid var(--l-teal); padding: 12px 26px; }
.wp-block-button.is-style-outline-teal .wp-block-button__link:hover { background: transparent; color: var(--l-teal-dark); border-color: var(--l-teal-dark); }
.coming-soon { display: inline-block; color: var(--l-muted) !important; font-weight: 600; font-size: 16px !important; padding: 12px 26px; border-radius: 6px; border: 2px dashed #3A3F3B; margin: 0 !important; }
.l-row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.is-centered .l-row { justify-content: center; }

/* the dashed-line device */
.dash-rule { display: flex; align-items: center; width: 340px; max-width: 100%; margin: 36px auto 0; }
.dash-rule .solid { flex: 1; height: 3px; background: var(--l-teal); }
.dash-rule .dash { width: 60px; height: 0; border-top: 3px dashed var(--l-teal); margin-left: 6px; }
.status-pill { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border: 1px solid var(--l-line); border-radius: 6px; background: var(--l-band); font-size: 15px; color: var(--l-ink-2); }
.status-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--l-amber); }

/* Method page pieces */
.method-figure { margin: 56px 0 0; }
.method-figure .bar { display: flex; align-items: center; }
.method-figure .bar .solid { flex: 1; height: 3px; background: var(--l-teal); }
.method-figure .bar .gap { width: 6px; }
.method-figure .bar .dashed { flex: 0 0 30%; height: 0; border-top: 3px dashed var(--l-amber); }
.method-figure .bar .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--l-amber); margin-left: 4px; }
.method-figure .labels { display: flex; flex-wrap: wrap; margin-top: 14px; gap: 10px 16px; font-size: 14px; color: var(--l-muted); }
.method-figure .labels > div:first-child { flex: 1 1 260px; }
.method-figure .labels > div:last-child { flex: 0 1 30%; min-width: 220px; }
.method-figure .labels strong { font-weight: 600; }
.method-figure .labels .s { color: var(--l-teal); }
.method-figure .labels .l { color: var(--l-ink); }
.fail-grid { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.fail-grid li { background: var(--l-surface); border: 1px solid var(--l-line); border-radius: 10px; padding: 22px; display: flex; flex-direction: column; gap: 10px; }
.fail-grid .code { font-family: var(--l-display); font-weight: 800; font-size: 30px; color: var(--l-amber); line-height: 1; }
.fail-grid .name { font-size: 16px; font-weight: 600; color: var(--l-ink); line-height: 1.35; }
.fail-grid .says { font-size: 14px; font-style: italic; color: var(--l-muted); line-height: 1.5; flex: 1; }
.fail-grid .cm-label { border-top: 1px dashed var(--l-line); padding-top: 10px; font-size: 13px; color: var(--l-muted); text-transform: uppercase; letter-spacing: 0.1em; }
.fail-grid .cm { font-size: 15px; color: var(--l-teal); font-weight: 600; }
.cycle { margin-top: 56px; background: var(--l-band); border: 1px solid var(--l-raised); border-radius: 10px; padding: 28px; }
.cycle .steps { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 15px; }
.cycle .step { background: var(--l-raised); border-radius: 6px; padding: 10px 14px; color: var(--l-ink); }
.cycle .step.hot { border: 2px solid var(--l-amber); padding: 8px 12px; color: var(--l-amber); font-weight: 600; }
.cycle .arrow { color: var(--l-muted); }
.cycle p { margin: 18px 0 0; font-size: 15px; line-height: 1.6; color: var(--l-muted); max-width: 760px; }
.levels { display: flex; flex-direction: column; gap: 14px; margin-top: 18px; }
.levels .lv { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: baseline; }
.levels .n { font-family: var(--l-display); font-weight: 800; font-size: 28px; }
.levels .t { font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; }
.levels .d { font-size: 14px; color: var(--l-ink-2); margin-top: 2px; }
.emi-example table { width: 100%; margin-top: 18px; border-collapse: collapse; font-size: 15px; font-variant-numeric: tabular-nums; }
.emi-example th { color: var(--l-muted); font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 500; padding: 6px 0; text-align: left; }
.emi-example th:last-child, .emi-example td:last-child { text-align: right; }
.emi-example td { padding: 8px 0; border-top: 1px solid var(--l-raised); color: var(--l-ink); }
.emi-example tr.constraint td { color: var(--l-amber); font-weight: 600; }
.emi-example .tiles { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 12px; }
.emi-example .tile { flex: 1; min-width: 120px; background: var(--l-surface); border-radius: 8px; padding: 14px; }
.emi-example .tile.on { border: 2px solid var(--l-teal); }
.emi-example .tile .k { font-size: 13px; color: var(--l-muted); }
.emi-example .tile.on .k { color: var(--l-teal); }
.emi-example .tile .v { font-family: var(--l-display); font-weight: 800; font-size: 34px; color: var(--l-muted); }
.emi-example .tile.on .v { color: var(--l-ink); }
.emi-example .note { margin: 14px 0 0; font-size: 13px; line-height: 1.5; color: var(--l-muted); }
.mos-list { list-style: none; margin: 40px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.mos-list li { display: grid; grid-template-columns: 64px 1fr; gap: 16px; align-items: center; background: var(--l-surface); border-radius: 8px; padding: 18px 20px; }
.mos-list .n { font-family: var(--l-display); font-weight: 800; font-size: 30px; color: var(--l-teal); }
.mos-list .t { font-size: 17px; font-weight: 600; color: var(--l-ink); }
.mos-list .d { font-size: 15px; color: var(--l-muted); margin-top: 2px; }
.arch { margin-top: 48px; background: var(--l-surface); border-radius: 10px; padding: 28px; }
.arch .phases { margin-top: 22px; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 16px 4px; }
.arch .ph { border-top: 3px solid var(--l-teal); padding-top: 12px; padding-right: 12px; }
.arch .ph.overlap { border-top-style: dashed; }
.arch .wk { font-size: 13px; color: var(--l-teal); font-variant-numeric: tabular-nums; }
.arch .nm { font-size: 16px; font-weight: 600; margin-top: 2px; color: var(--l-ink); }
.arch .ds { font-size: 14px; color: var(--l-muted); margin-top: 4px; }
.arch p { margin: 22px 0 0; font-size: 15px; line-height: 1.6; color: var(--l-ink-2); }

/* ---------- Quick Check ---------- */
.qc-result { margin-top: 36px; background: var(--l-surface); border: 2px solid var(--qc-color, var(--l-line)); border-radius: 10px; padding: 24px; display: flex; flex-wrap: wrap; gap: 20px; align-items: center; }
.qc-big { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 96px; }
.qc-big .k { font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--l-muted); }
.qc-big .v { font-family: var(--l-display); font-weight: 800; font-size: 56px; color: var(--qc-color); line-height: 1; font-variant-numeric: tabular-nums; }
.qc-text { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: 8px; }
.qc-text .tag { font-size: 13px; letter-spacing: 0.15em; text-transform: uppercase; font-weight: 600; color: var(--qc-color); }
.qc-text .desc { font-size: 15px; line-height: 1.55; color: var(--l-ink-2); }
.qc-text .con { font-size: 14px; color: var(--l-amber); }
.qc-rows { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; text-align: left; }
.qc-row { display: flex; flex-wrap: wrap; border-radius: 6px; overflow: hidden; border: 1px solid var(--l-line); }
.qc-row.is-constraint { border: 2px solid var(--l-amber); }
.qc-name { flex: 0 1 200px; min-width: 150px; padding: 12px 16px; background: var(--l-raised); display: flex; flex-direction: column; justify-content: center; gap: 2px; }
.qc-name .n { font-size: 15px; font-weight: 600; color: var(--l-ink); }
.qc-name .s { font-size: 13px; font-style: italic; color: var(--l-muted); }
.qc-name .c { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; color: var(--l-amber); margin-top: 2px; min-height: 14px; }
.qc-ctrl { flex: 1 1 260px; padding: 12px 16px; display: flex; align-items: center; gap: 14px; background: var(--l-surface); }
.qc-ctrl .lv { font-family: var(--l-display); font-weight: 800; font-size: 28px; min-width: 24px; font-variant-numeric: tabular-nums; }
.qc-ctrl .lbl { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.qc-ctrl .lbl .t { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.qc-ctrl .lbl .d { font-size: 13px; font-style: italic; color: var(--l-ink-2); }
.qc-ctrl .btns { display: flex; gap: 6px; }
.qc-ctrl button { width: 44px; height: 44px; background: rgba(255,255,255,0.08); border: none; border-radius: 6px; color: var(--l-ink); font-size: 15px; cursor: pointer; }
.qc-ctrl button:hover { background: rgba(255,255,255,0.14); }
.qc-ctrl button:disabled { opacity: 0.35; cursor: default; }

/* ---------- Opportunity Gap estimator ---------- */
.og { margin-top: 36px; background: var(--l-surface); border-radius: 10px; padding: 28px; text-align: left; }
.og-head { font-size: 13px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--l-amber); font-weight: 600; margin-bottom: 18px; }
.og-inputs { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 20px; }
.og-field { display: flex; flex-direction: column; gap: 6px; }
.og-field label { font-size: 14px; color: var(--l-ink-2); min-height: 40px; }
.og-field input { background: var(--l-ground); border: 1px solid var(--l-line); border-radius: 6px; color: var(--l-ink); padding: 12px; font-size: 16px; font-variant-numeric: tabular-nums; font-family: inherit; }
.og-field input:focus { border-color: var(--l-teal); outline: none; }
.og-field .hint { font-size: 13px; line-height: 1.5; color: var(--l-muted); }
.og-outs { margin-top: 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.og-out { background: var(--l-band); border: 2px solid var(--l-line); border-radius: 10px; padding: 22px; display: flex; flex-direction: column; gap: 6px; }
.og-out.amber { border-color: var(--l-amber); }
.og-out.teal { border-color: var(--l-teal); }
.og-out .k { font-size: 13px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--l-muted); }
.og-out.amber .k { color: var(--l-amber); }
.og-out.teal .k { color: var(--l-teal); }
.og-out .v { font-family: var(--l-display); font-weight: 800; font-size: 36px; color: var(--l-ink); font-variant-numeric: tabular-nums; }
.og-formula { margin-top: 18px; font-size: 14px; line-height: 1.6; color: var(--l-ink-2); }
.og-note { margin-top: 10px; font-size: 13px; line-height: 1.55; color: var(--l-muted); }

/* ---------- Workbook path chooser and parts ---------- */
.wb-paths { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; }
.wb-paths button { min-height: 44px; padding: 10px 18px; border-radius: 6px; font-family: inherit; font-size: 15px; font-weight: 600; cursor: pointer; background: transparent; color: var(--l-ink-2); border: 2px solid var(--l-line); }
.wb-paths button[aria-pressed="true"] { background: var(--l-teal); color: var(--l-ground); border-color: var(--l-teal); }
.wb-note { margin: 14px 0 0; font-size: 15px; line-height: 1.6; color: var(--l-muted); min-height: 24px; }
.wb-parts { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.wb-part { display: flex; flex-wrap: wrap; gap: 16px 24px; align-items: flex-start; background: var(--l-band); border-radius: 10px; padding: 24px; border: 1px solid var(--l-raised); transition: opacity .2s; }
.wb-part.is-focus { border: 2px solid var(--l-amber); }
.wb-part.is-dim { opacity: 0.55; }
.wb-part .num { flex: 0 0 auto; min-width: 72px; }
.wb-part .num .k { font-size: 12px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--l-muted); }
.wb-part .num .v { font-family: var(--l-display); font-weight: 800; font-size: 44px; line-height: 1; color: var(--l-teal); }
.wb-part .body { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.wb-part .title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
.wb-part .title strong { font-size: 19px; font-weight: 600; color: var(--l-ink); }
.wb-part .title span { font-size: 14px; color: var(--l-muted); font-variant-numeric: tabular-nums; }
.wb-part .what { font-size: 15px; line-height: 1.6; color: var(--l-ink-2); margin: 0; }
.wb-part .tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.wb-part .tags span { font-size: 13px; padding: 4px 10px; border-radius: 4px; background: var(--l-raised); color: var(--l-ink-2); }
.wb-part .tags span.emi { background: rgba(29,166,121,0.14); color: var(--l-teal); }
.wb-part .tags span.later { background: transparent; border: 1px dashed var(--l-line); color: var(--l-muted); }
.wb-part .side { flex: 0 1 220px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.wb-part .focus { font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--l-amber); }
.wb-part .focus:empty { display: none; }
.wb-part .avail { font-size: 14px; color: var(--l-muted); }
.wb-part .open { font-size: 15px; font-weight: 600; text-decoration: none; }
.wb-part .open::after { content: " \2192"; }

/* ---------- blog ---------- */
.post-list { display: flex; flex-direction: column; gap: 0; }
.post-card { padding: 28px 0; border-bottom: 1px solid var(--l-line); }
.post-card > * { margin: 0 0 8px !important; }
.post-card .wp-block-post-title a { color: var(--l-ink); text-decoration: none; }
.post-card .wp-block-post-title a:hover { color: var(--l-teal); }
.post-card-date, .post-meta { font-size: 14px; color: var(--l-muted); }
.post-meta { gap: 16px; }
.post-meta a { color: var(--l-muted); }
.wp-block-post-excerpt__more-link { font-weight: 600; text-decoration: none; }
.wp-block-query-pagination a { color: var(--l-teal); }
.wp-block-search__input { background: var(--l-surface); border: 1px solid var(--l-line); color: var(--l-ink); border-radius: 6px; padding: 10px 12px; }
.wp-block-search__button { background: var(--l-amber); color: var(--l-ground); border: 0; border-radius: 6px; font-weight: 600; }

/* plain pages (legal, contact, about, posts) */
.site-main:not(.is-wide) .wp-block-post-content h2 { font-size: 28px; margin-top: 2.25rem; }
.site-main:not(.is-wide) .wp-block-post-content h3 { font-size: 20px; margin-top: 1.75rem; }
.site-main:not(.is-wide) .wp-block-post-content p,
.site-main:not(.is-wide) .wp-block-post-content li { font-size: 17px; }
.wp-block-table table { border-collapse: collapse; }
.wp-block-table td, .wp-block-table th { border-color: var(--l-line); }

@media (prefers-reduced-motion: reduce) { .wb-part { transition: none; } }
@media (max-width: 600px) {
	.qc-name { flex: 1 1 100%; }
	.qc-ctrl { flex: 1 1 100%; }
}