/* Baken Digital, edition 04 "Ledger".
   Loaded after site.css. Paper throughout; blue is the one action colour;
   lime is a highlighter (marker, closing band). One ink band per page plus the footer.
   Two families: Barlow Condensed for display and prices, Manrope for everything else. */

:root {
  --paper: #f1f0e9;
  --paper-deep: #e8e7de;
  --ink: #1a1a18;
  --ink-soft: #3d3e38;
  --muted: #5b5c53;
  --blue: #273edb;
  --blue-deep: #1d2fa8;
  --lime: #e5f34d;
  --yellow: var(--lime);
  --line: #c8c9bf;
  --field: #6f7168;
  --error: #b42318;
  --ok: #1f6f43;
  --mono: var(--body);
  --header-h: 72px;
  --s1: 8px;
  --s2: 12px;
  --s3: 16px;
  --s4: 24px;
  --s5: 32px;
  --s6: 48px;
  --s7: 64px;
  --s8: 96px;
  --z-header: 50;
  --z-menu: 60;
  --z-skip: 100;
}

/* Base type */
body {
  font: 400 17px/1.65 var(--body);
  letter-spacing: 0;
}
p,
li,
dd,
dt,
label,
summary,
input,
select,
textarea,
button {
  letter-spacing: 0;
}
h1,
h2 {
  letter-spacing: -0.02em;
}
h2 {
  font-size: clamp(40px, 5vw, 72px);
  line-height: 0.95;
}
h3 {
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.2;
}
.tabular,
.qs-price,
.ledger-price {
  font-variant-numeric: tabular-nums;
}
::selection {
  background: var(--lime);
  color: var(--ink);
}
:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}
.skip:focus {
  z-index: var(--z-skip);
  background: var(--lime);
  color: var(--ink);
}
.icon {
  width: 1.15em;
  height: 1.15em;
  flex: none;
  display: inline-block;
  vertical-align: -0.18em;
}

/* Labels: one quiet style, used sparingly */
.eyebrow,
.label {
  font: 600 13px/1.5 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: var(--s4);
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 52px;
  padding: 14px 22px;
  border: 0;
  border-radius: 0;
  font: 600 16px/1.2 var(--body);
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 160ms ease,
    color 160ms ease,
    transform 90ms ease;
  white-space: nowrap;
}
.btn-primary {
  background: var(--blue);
  color: #fff;
}
.btn-primary:hover {
  background: var(--blue-deep);
  color: #fff;
}
.btn-ink {
  background: var(--ink);
  color: var(--paper);
}
.btn-ink:hover {
  background: var(--blue-deep);
  color: #fff;
}
.btn:active {
  transform: translateY(1px);
}
.btn .icon {
  transition: transform 160ms ease;
}
.btn:hover .icon {
  transform: translateX(3px);
}
.text-link {
  font-size: 15px;
}

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: var(--z-header);
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}
.masthead {
  min-height: var(--header-h);
  gap: 28px;
}
.brand {
  gap: 12px;
}
.brand-name {
  font-size: 40px;
}
.brand-tag {
  font: 600 11px/1.3 var(--body);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-left: 1px solid var(--ink);
  padding-left: 12px;
  max-width: 7ch;
}
.main-nav {
  gap: 26px;
}
.main-nav a {
  font-size: 15px;
  font-weight: 600;
}
.main-nav a:hover {
  color: var(--blue);
}
.main-nav a[aria-current="page"] {
  text-decoration: underline;
  text-decoration-color: var(--blue);
  text-decoration-thickness: 2px;
  text-underline-offset: 8px;
}
.main-nav .menu-cta,
.main-nav .menu-contact {
  display: none;
}
.header-cta {
  min-height: 44px;
  padding: 10px 18px;
  font-size: 15px;
}
.navtoggle {
  display: none;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 4px;
  border: 0;
  background: none;
  font: 600 15px var(--body);
  color: var(--ink);
}
.navtoggle .icon {
  width: 22px;
  height: 22px;
}
.navtoggle .icon-close,
.navtoggle[aria-expanded="true"] .icon-open {
  display: none;
}
.navtoggle[aria-expanded="true"] .icon-close {
  display: inline-block;
}
@media (max-width: 1060px) {
  .main-nav {
    gap: 18px;
  }
  .brand-tag {
    display: none;
  }
}
@media (max-width: 960px) {
  .masthead {
    gap: 12px;
  }
  .navtoggle {
    display: inline-flex;
  }
  .main-nav {
    display: none;
    position: fixed;
    inset: var(--header-h) 0 0;
    z-index: var(--z-menu);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: var(--s3) var(--gutter) var(--s6);
    background: var(--paper);
    overflow-y: auto;
    border-top: 1px solid var(--ink);
  }
  .main-nav.open {
    display: flex;
  }
  .main-nav a {
    font: 800 34px/1.1 var(--display);
    letter-spacing: -0.01em;
    min-height: 56px;
    padding-block: 10px;
    border-bottom: 1px solid var(--line);
  }
  .main-nav a[aria-current="page"] {
    text-underline-offset: 6px;
  }
  .main-nav .menu-cta {
    display: flex;
    margin-top: var(--s5);
    font: 600 17px var(--body);
    min-height: 56px;
    border: 0;
  }
  .main-nav .menu-contact {
    display: block;
    margin-top: var(--s4);
    font-size: 17px;
  }
  .main-nav .menu-contact a {
    font: 600 17px var(--body);
    border: 0;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  body.menu-open {
    overflow: hidden;
  }
}
@media (max-width: 420px) {
  .brand-name {
    font-size: 34px;
  }
  .header-cta {
    font-size: 14px;
    padding: 10px 12px;
  }
  .navtoggle-label {
    display: none;
  }
}
@media (max-width: 340px) {
  .header-cta {
    display: none;
  }
}

/* Interior openers: paper, not colour fields */
.page-opener,
.page-opener.blue,
.page-opener.yellow,
.page-opener.ink {
  background: var(--paper);
  color: var(--ink);
  border-bottom: 1px solid var(--ink);
}
.page-opener[class*="sector-tone"] {
  background: var(--paper);
  color: var(--ink);
  box-shadow: inset 0 8px 0 var(--tone, var(--blue));
}
.sector-tone-attorneys {
  --tone: var(--blue);
}
.sector-tone-medical {
  --tone: #1f6f43;
}
.sector-tone-architects {
  --tone: var(--ink);
}
.sector-tone-hospitality {
  --tone: #dd5b32;
}
.page-opener h1 {
  font-size: clamp(56px, 8vw, 128px);
  line-height: 0.9;
}
.page-opener .opener-bottom p,
.page-opener .standfirst {
  font-size: 20px;
  line-height: 1.5;
  max-width: 44ch;
}
.page-opener a:hover {
  color: var(--blue);
}
.page-opener :focus-visible {
  outline-color: var(--blue);
}
.editorial.yellow {
  background: var(--paper-deep);
}

/* Poster hero (home) */
.poster-hero {
  padding: 48px 0 0;
}
.poster-hero .eyebrow {
  margin-bottom: 28px;
}
.poster-hero h1 {
  font-size: clamp(64px, 14vw, 232px);
  line-height: 0.84;
  letter-spacing: -0.025em;
  margin: 0;
}
.poster-hero h1 .hero-line {
  display: block;
}
.poster-hero h1 .line-two {
  font-size: 0.64em;
  margin-top: 0.12em;
}
.marker {
  position: relative;
  z-index: 0;
  background: none;
  color: inherit;
  white-space: nowrap;
}
.marker::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -0.03em;
  right: 0.02em;
  bottom: 0.07em;
  height: 0.34em;
  background: var(--lime);
  transform-origin: left center;
}
@media (prefers-reduced-motion: no-preference) {
  .marker::before {
    animation: baken-marker 520ms 180ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
  }
}
@keyframes baken-marker {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}
.hero-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--s5) var(--s6);
  align-items: end;
  border-top: 1px solid var(--ink);
  margin-top: 44px;
  padding-block: 28px 40px;
}
.hero-actions p {
  font-size: 20px;
  line-height: 1.5;
  max-width: 42ch;
  margin: 0;
}
.hero-buttons {
  display: flex;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}
.hero-buttons .btn {
  min-height: 60px;
  padding-inline: 26px;
  font-size: 17px;
}
.hero-note {
  grid-column: 1/-1;
  font-size: 15px;
  color: var(--muted);
  margin: -12px 0 0;
}
.plain-link {
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.plain-link:hover {
  color: var(--blue);
}

/* Fact strip */
.fact-strip {
  border-block: 1px solid var(--ink);
}
.fact-strip ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.fact-strip li {
  padding: 22px 24px;
  font-weight: 600;
  font-size: 17px;
  line-height: 1.4;
  border-left: 1px solid var(--line);
}
.fact-strip li:first-child {
  border-left: 0;
  padding-left: 0;
}

/* Section rhythm */
.l-section {
  padding-block: clamp(64px, 8vw, 120px);
}
.l-head {
  max-width: 880px;
  margin-bottom: clamp(32px, 4vw, 56px);
}
.l-head h2 {
  margin: 0;
}
.l-head p {
  font-size: 19px;
  line-height: 1.55;
  max-width: 56ch;
  margin: 20px 0 0;
  color: var(--ink-soft);
}

/* Founder and why */
.founder-layout {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(40px, 6vw, 96px);
  align-items: start;
}
.founder-statement {
  font: 600 clamp(32px, 4vw, 54px)/1.12 var(--body);
  letter-spacing: -0.02em;
  margin: 0 0 var(--s5);
  max-width: 20ch;
}
.founder-statement em {
  font-style: normal;
  background: linear-gradient(
    transparent 62%,
    var(--lime) 62% 94%,
    transparent 94%
  );
}
.founder-copy > p {
  font-size: 19px;
  line-height: 1.6;
  max-width: 52ch;
}
.why-list {
  list-style: none;
  padding: 0;
  margin: var(--s5) 0 var(--s4);
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--ink);
}
.why-list li {
  padding: 20px 24px 20px 0;
  border-bottom: 1px solid var(--line);
}
.why-list li:nth-child(odd) {
  border-right: 1px solid var(--line);
}
.why-list li:nth-child(even) {
  padding-left: 24px;
  padding-right: 0;
}
.why-list strong {
  display: block;
  font-size: 17px;
  margin-bottom: 4px;
}
.why-list span {
  display: block;
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
}
.portrait {
  margin: 0;
}
.portrait-frame {
  aspect-ratio: 4/5;
  border: 1px solid var(--ink);
  background: var(--paper-deep);
  display: grid;
  place-items: center;
  padding: 24px;
  text-align: center;
  color: var(--muted);
  font-size: 15px;
}
.portrait img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/5;
  object-fit: cover;
  border: 1px solid var(--ink);
}
.portrait figcaption {
  font-size: 15px;
  margin-top: 14px;
  color: var(--ink-soft);
}

/* Service ledger (paths) */
.ledger {
  border-top: 2px solid var(--ink);
}
.ledger-row {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 2.2fr) 40px;
  gap: var(--s4);
  align-items: center;
  padding: 28px 12px;
  border-bottom: 1px solid var(--ink);
  text-decoration: none;
  transition: background-color 160ms ease;
}
.ledger-row:hover {
  background: var(--paper-deep);
}
.ledger-row:hover .icon {
  transform: translate(3px, -3px);
}
.ledger-row .icon {
  width: 30px;
  height: 30px;
  justify-self: end;
  transition: transform 160ms ease;
}
.ledger-name small {
  display: block;
  font: 600 13px/1.4 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
}
.ledger-name strong {
  display: block;
  font: 800 clamp(40px, 4.6vw, 72px)/0.92 var(--display);
  letter-spacing: -0.015em;
  text-transform: uppercase;
}
.ledger-desc {
  font-size: 17px;
  line-height: 1.55;
  margin: 0;
}
.ledger-price {
  font: 800 clamp(26px, 2.4vw, 36px)/1 var(--display);
  margin: 0;
  text-align: right;
}
.ledger-price small {
  display: block;
  font: 600 13px/1.4 var(--body);
  color: var(--muted);
  margin-top: 6px;
  text-align: right;
}
.ledger-note {
  font-size: 15px;
  color: var(--ink-soft);
  margin-top: 20px;
}

/* Case study */
.case {
  background: var(--paper-deep);
}
.case .proof-layout {
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 0.8fr);
}
.case .proof-shots {
  order: -1;
}
.case h2 span {
  color: var(--blue);
}
.fact-rail {
  list-style: none;
  padding: 0;
  margin: var(--s4) 0;
  border-top: 1px solid var(--ink);
}
.fact-rail li {
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  font-size: 16px;
  line-height: 1.5;
}
.fact-rail b {
  display: block;
  font: 600 13px/1.4 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}
.case .honest {
  font-size: 15px;
  color: var(--ink-soft);
}
.proof-shots figcaption {
  font: 400 13px/1.6 var(--body);
}

/* Markets table */
.markets-table {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
  font-size: 17px;
  line-height: 1.5;
}
.markets-table th,
.markets-table td {
  text-align: left;
  vertical-align: top;
  padding: 20px 20px 20px 0;
  border-bottom: 1px solid var(--line);
  background: none;
  color: inherit;
}
.markets-table thead th {
  font: 600 13px/1.4 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  border-bottom: 2px solid var(--ink);
  padding-block: 0 12px;
}
.markets-table tbody th {
  font: 800 30px/1 var(--display);
  text-transform: uppercase;
  width: 22%;
}
.markets-table tbody tr:hover {
  background: var(--paper-deep);
}
.markets-table td:last-child {
  padding-right: 0;
  white-space: nowrap;
  font-weight: 400;
}
.markets-more {
  margin-top: var(--s4);
  font-size: 15px;
}

/* Quote sheet (signature component) */
.quote-sheet {
  max-width: 1080px;
  margin-inline: auto;
  background: var(--paper-deep);
  border-top: 2px solid var(--ink);
  padding: clamp(24px, 4vw, 48px);
}
.qs-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--s4);
  flex-wrap: wrap;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--ink);
}
.qs-head h3 {
  font: 800 32px/1 var(--display);
  text-transform: uppercase;
  margin: 0;
}
.qs-head p {
  font-size: 15px;
  color: var(--ink-soft);
  margin: 0;
}
.qs-lines {
  list-style: none;
  margin: 0;
  padding: 0;
}
.qs-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px 40px;
  align-items: baseline;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}
.qs-line h4 {
  font: 700 21px/1.3 var(--body);
  margin: 0 0 4px;
}
.qs-line p {
  margin: 0;
}
.qs-scope {
  font-size: 16px;
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 48ch;
}
.qs-time {
  font-size: 15px;
  color: var(--ink-soft);
  white-space: nowrap;
}
.qs-price {
  font: 800 clamp(34px, 3.4vw, 48px)/1 var(--display);
  text-align: right;
  white-space: nowrap;
}
.qs-line .plain-link {
  font-size: 15px;
  min-height: 36px;
}
.qs-foot {
  padding-top: 20px;
  display: grid;
  gap: 6px;
  font-size: 15px;
  color: var(--ink-soft);
}
.qs-foot p {
  margin: 0;
}
.qs-actions {
  display: flex;
  gap: 28px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 28px;
}

/* Process: the one ink band */
.process {
  background: var(--ink);
  color: var(--paper);
}
.process .l-head p {
  color: #c9cabf;
}
.process :focus-visible {
  outline-color: var(--lime);
}
.timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--s5);
  counter-reset: step;
}
.timeline li {
  position: relative;
  padding-top: 36px;
  border-top: 3px solid var(--lime);
}
.timeline li::before {
  counter-increment: step;
  content: counter(step);
  position: absolute;
  top: -19px;
  left: 0;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  background: var(--lime);
  color: var(--ink);
  font: 800 20px/1 var(--display);
}
.timeline h3 {
  font: 800 clamp(30px, 2.6vw, 40px)/1 var(--display);
  text-transform: uppercase;
  margin: 0 0 12px;
}
.timeline p {
  font-size: 16px;
  line-height: 1.6;
  color: #dcdcd2;
  margin: 0;
}
.timeline .when {
  display: block;
  margin-top: 12px;
  font-weight: 600;
  color: var(--lime);
  font-size: 15px;
}

/* Open Q&A */
.qa {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 clamp(32px, 5vw, 80px);
  border-top: 2px solid var(--ink);
}
.qa div {
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}
.qa dt {
  font: 700 19px/1.4 var(--body);
  margin-bottom: 8px;
}
.qa dd {
  margin: 0;
  font-size: 17px;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 56ch;
}

/* Closing band: the one lime band */
.closing-band {
  background: var(--lime);
  color: var(--ink);
  padding-block: clamp(64px, 8vw, 112px);
}
.closing-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: var(--s6);
  align-items: end;
}
.closing-band h2 {
  font-size: clamp(64px, 10vw, 160px);
  line-height: 0.86;
  margin: 0 0 24px;
}
.closing-lead {
  font-size: 20px;
  line-height: 1.5;
  max-width: 42ch;
  margin: 0;
}
.closing-actions .btn {
  min-height: 60px;
  font-size: 17px;
}
.closing-actions p {
  font-size: 15px;
  margin: 14px 0 0;
}
.closing-actions a:not(.btn) {
  font-weight: 600;
}
.closing-band :focus-visible {
  outline-color: var(--ink);
}

/* Footer */
.site-footer {
  padding-block: 72px 40px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: var(--s5) var(--s6);
  margin-bottom: var(--s7);
}
.footer-grid nav,
.footer-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.footer-title {
  font: 600 13px/1.4 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--lime);
  margin: 0 0 14px;
}
.footer-grid nav a {
  font-size: 15px;
  min-height: 40px;
  display: flex;
  align-items: center;
  text-decoration: none;
}
.footer-grid a:hover {
  color: var(--lime);
}
.footer-email {
  font: 600 20px/1.3 var(--body);
  text-decoration: none;
  min-height: 44px;
  display: flex;
  align-items: center;
  overflow-wrap: anywhere;
}
.footer-contact p {
  font-size: 15px;
  color: #c9cabf;
  margin: 6px 0 0;
  max-width: 36ch;
}
.footer-logo {
  font-size: clamp(96px, 16vw, 220px);
  margin: 0;
}
.footer-legal {
  gap: 8px 28px;
}
.footer-legal a {
  font-size: 15px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.footer-bottom {
  font: 400 13px/1.7 var(--body);
  color: #c9cabf;
}

/* Forms (shared) */
form label {
  font: 600 15px/1.4 var(--body);
  letter-spacing: 0;
  margin-bottom: 6px;
}
input,
select,
textarea {
  font-size: 17px;
  border-bottom-color: var(--field);
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
}
form .btn {
  font-size: 17px;
}
form .btn:hover {
  background: var(--blue-deep);
  color: #fff;
}
.fineprint {
  font-size: 15px;
}

/* Responsive */
@media (max-width: 1100px) {
  .ledger-row {
    grid-template-columns: minmax(0, 1fr) auto 32px;
    grid-template-areas: "name price arrow" "desc desc desc";
  }
  .ledger-name {
    grid-area: name;
  }
  .ledger-desc {
    grid-area: desc;
    max-width: 60ch;
  }
  .ledger-price {
    grid-area: price;
  }
  .ledger-row .icon {
    grid-area: arrow;
  }
  .timeline {
    grid-template-columns: 1fr 1fr;
    row-gap: 48px;
  }
}
@media (max-width: 900px) {
  .fact-strip ul {
    grid-template-columns: 1fr 1fr;
  }
  .fact-strip li {
    border-left: 0;
    padding: 16px 16px 16px 0;
    border-bottom: 1px solid var(--line);
  }
  .fact-strip li:nth-child(even) {
    border-left: 1px solid var(--line);
    padding-left: 16px;
  }
  .fact-strip li:nth-last-child(-n + 2) {
    border-bottom: 0;
  }
  .founder-layout,
  .case .proof-layout,
  .closing-layout {
    grid-template-columns: 1fr;
  }
  .portrait {
    max-width: 420px;
  }
  .qa {
    grid-template-columns: 1fr;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
  .footer-contact {
    grid-column: 1/-1;
  }
  .markets-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }
  .markets-table,
  .markets-table tbody,
  .markets-table tr,
  .markets-table th,
  .markets-table td {
    display: block;
    width: auto;
  }
  .markets-table tr {
    padding: 20px 0;
    border-bottom: 1px solid var(--ink);
  }
  .markets-table th,
  .markets-table td {
    border: 0;
    padding: 6px 0;
  }
  .markets-table td::before {
    content: attr(data-label);
    display: block;
    font: 600 13px/1.4 var(--body);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .markets-table td:last-child::before {
    content: none;
  }
}
@media (max-width: 650px) {
  body {
    font-size: 17px;
  }
  .poster-hero {
    padding-top: 32px;
  }
  .poster-hero h1 {
    font-size: 19vw;
  }
  .hero-actions {
    grid-template-columns: 1fr;
    margin-top: 32px;
  }
  .hero-actions p {
    font-size: 18px;
  }
  .hero-buttons {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .hero-buttons .btn {
    width: 100%;
  }
  .hero-buttons .plain-link {
    justify-content: center;
  }
  .hero-note {
    margin: 0;
  }
  .why-list {
    grid-template-columns: 1fr;
  }
  .why-list li,
  .why-list li:nth-child(even) {
    padding: 16px 0;
    border-right: 0;
  }
  .ledger-row {
    padding: 22px 0;
  }
  .qs-line {
    grid-template-columns: 1fr auto;
  }
  .qs-line > div {
    grid-column: 1/-1;
  }
  .qs-price {
    font-size: 38px;
  }
  .timeline {
    grid-template-columns: 1fr;
  }
  .closing-band h2 {
    font-size: 17vw;
  }
  .closing-actions .btn {
    width: 100%;
  }
  .footer-logo {
    font-size: 28vw;
  }
}
@media (max-width: 380px) {
  .fact-strip ul {
    grid-template-columns: 1fr;
  }
  .fact-strip li,
  .fact-strip li:nth-child(even) {
    border-left: 0;
    padding-left: 0;
    border-bottom: 1px solid var(--line);
  }
}
@media (prefers-reduced-motion: reduce) {
  .btn,
  .btn .icon,
  .ledger-row,
  .ledger-row .icon {
    transition: none;
  }
  .btn:active {
    transform: none;
  }
}
@media print {
  .closing-band,
  .header-cta,
  .navtoggle {
    display: none;
  }
  .process {
    background: #fff !important;
    color: #111 !important;
  }
}

/* Fixes after first render */
.fact-strip {
  padding: 0;
}
.founder-copy > .founder-statement {
  font: 600 clamp(32px, 4vw, 54px) / 1.12 var(--body);
  letter-spacing: -0.02em;
  max-width: 20ch;
}
.footer-contact .footer-title {
  color: var(--lime);
}
p .plain-link,
dd .plain-link,
li .plain-link {
  display: inline;
  min-height: 0;
}
@media (max-width: 900px) {
  .markets-table tbody th {
    width: auto;
    padding-top: 0;
  }
}
@media (max-width: 650px) {
  .poster-hero h1 {
    font-size: 21vw;
  }
  .why-list li:nth-child(odd) {
    border-right: 0;
  }
}

/* =====================================================================
   Shared interior fixes (added with the pricing, services and contact pages)
   ===================================================================== */
.breadcrumbs {
  font: 600 15px/1.4 var(--body);
  gap: 4px 10px;
  align-items: center;
  margin-bottom: var(--s4);
  color: var(--ink-soft);
}
.breadcrumbs a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.quote-sheet .plain-link,
.qs-line .plain-link {
  min-height: 44px;
}
.qs-price small {
  display: block;
  font: 600 15px/1.4 var(--body);
  color: var(--muted);
  margin-top: 6px;
  text-align: right;
  white-space: normal;
}
/* Interior opener: stacked h1 and lead */
.l-opener {
  padding-block: 32px 56px;
}
.l-opener h1 {
  margin: 0;
  max-width: none;
}
.opener-lead {
  font-size: 20px;
  line-height: 1.5;
  max-width: 46ch;
  margin: 24px 0 0;
  color: var(--ink-soft);
}
/* Quote sheet: expandable inclusions and single-offer variant */
.qs-more {
  margin-top: 6px;
}
.qs-more > summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  list-style: none;
  font: 600 15px/1.3 var(--body);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}
.qs-more > summary::-webkit-details-marker {
  display: none;
}
.qs-more > summary:hover {
  color: var(--blue);
}
.qs-more .icon-minus,
.qs-more[open] .icon-plus,
.more-detail .icon-minus,
.more-detail[open] .icon-plus {
  display: none;
}
.qs-more[open] .icon-minus,
.more-detail[open] .icon-minus {
  display: inline-block;
}
.qs-more-body {
  padding: 6px 0 4px;
}
@media (prefers-reduced-motion: no-preference) {
  .qs-more[open] .qs-more-body,
  .more-detail[open] > .field-grid {
    animation: baken-reveal 160ms ease-out both;
  }
}
@keyframes baken-reveal {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.qs-incl {
  margin: 4px 0 12px;
  padding-left: 20px;
}
.qs-incl li {
  font-size: 16px;
  line-height: 1.55;
  margin: 0 0 6px;
}
.qs-note {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 60ch;
}
.qs-line:target h4 {
  background: linear-gradient(transparent 58%, var(--lime) 58% 92%, transparent 92%);
  display: inline;
}
.qs-single {
  max-width: none;
  margin: 0;
}
.qs-single-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 32px;
  align-items: baseline;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--ink);
  margin-bottom: 8px;
}
.qs-single-top h3 {
  font: 800 32px/1 var(--display);
  text-transform: uppercase;
  margin: 0 0 8px;
}
.qs-single > .qs-incl {
  margin-top: 16px;
}
.qs-single .qs-foot {
  padding-top: 12px;
}
.qs-single .qs-actions {
  margin-top: 12px;
}

/* =====================================================================
   Pricing page
   ===================================================================== */
.opener-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(300px, 1fr);
  gap: var(--s6) clamp(40px, 6vw, 96px);
  align-items: start;
}
.opener-copy {
  padding-top: 8px;
}
.glance {
  background: var(--paper-deep);
  border-top: 2px solid var(--ink);
  padding: 24px 28px 28px;
}
.glance .glance-title {
  font: 600 15px/1.4 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0 0 8px;
}
.glance dl {
  margin: 0;
}
.glance dl div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.glance dt {
  font-size: 16px;
  color: var(--ink-soft);
}
.glance dd {
  margin: 0;
  font-weight: 700;
  font-size: 17px;
  text-align: right;
}
.glance .btn {
  width: 100%;
  margin-top: 24px;
}
.l-subnav {
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
  padding: 0;
}
.l-subnav .wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 0 28px;
}
.l-subnav a {
  display: inline-flex;
  align-items: center;
  min-height: 52px;
  font: 600 15px/1.2 var(--body);
  text-decoration: none;
}
.l-subnav a:hover {
  color: var(--blue);
  text-decoration: underline;
  text-underline-offset: 6px;
}
@media (min-width: 961px) {
  .l-subnav {
    position: sticky;
    top: var(--header-h);
    z-index: 40;
  }
  .page-pricing main [id] {
    scroll-margin-top: 40px;
  }
}
.page-pricing .l-section {
  border-bottom: 0;
}
.page-pricing .l-section + .l-section {
  border-top: 1px solid var(--line);
}
.rescue-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
  gap: var(--s6) clamp(32px, 5vw, 72px);
  align-items: start;
}
.rescue-aside {
  border-top: 2px solid var(--ink);
  padding-top: 24px;
}
.rescue-aside h3 {
  font-size: 22px;
  margin: 0 0 10px;
}
.rescue-aside p {
  font-size: 17px;
  line-height: 1.6;
  color: var(--ink-soft);
  margin: 0 0 8px;
}
#care.l-section {
  background: var(--paper-deep);
}
.compare-table {
  width: 100%;
  max-width: 1080px;
  border-collapse: collapse;
  font-size: 17px;
  line-height: 1.5;
}
.compare-table th,
.compare-table td {
  text-align: left;
  vertical-align: top;
  padding: 16px 24px 16px 0;
  border-bottom: 1px solid var(--line);
  background: none;
  color: inherit;
}
.compare-table thead th {
  font: 800 clamp(26px, 2.6vw, 36px)/1 var(--display);
  text-transform: uppercase;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 14px;
}
.compare-table thead td {
  border-bottom: 2px solid var(--ink);
}
.compare-table td:last-child {
  font-weight: 400;
  white-space: normal;
}
.compare-table tbody th {
  font-weight: 600;
  font-size: 16px;
  width: 34%;
}
.compare-table .qs-price {
  display: inline;
  font-size: clamp(34px, 3.4vw, 48px);
  text-align: left;
  margin-right: 6px;
}
.compare-table .compare-price td {
  color: var(--muted);
  font-size: 15px;
  font-weight: 600;
}
.compare-table .compare-price .qs-price {
  color: var(--ink);
}
.compare-table tfoot td {
  border: 0;
  padding-top: 12px;
}
.l-foot {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 80ch;
  margin: 24px 0 0;
}
.qs-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
.qs-grid .qs-lead {
  grid-row: span 2;
}
.terms-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 clamp(32px, 5vw, 80px);
  border-top: 2px solid var(--ink);
  margin: 0;
}
.terms-list > div {
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}
.terms-list dt {
  font: 700 17px/1.4 var(--body);
  margin-bottom: 6px;
}
.terms-list dd {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 60ch;
}
@media (max-width: 900px) {
  .opener-grid,
  .rescue-layout,
  .qs-grid,
  .terms-list {
    grid-template-columns: 1fr;
  }
  .qs-grid .qs-lead {
    grid-row: auto;
  }
}
@media (max-width: 700px) {
  .compare-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }
  .compare-table,
  .compare-table tbody,
  .compare-table tfoot {
    display: block;
  }
  .compare-table tr {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
  }
  .compare-table tbody th {
    grid-column: 1 / -1;
    width: auto;
  }
  .compare-table th,
  .compare-table td {
    display: block;
    border: 0;
    padding: 0;
  }
  .compare-table td::before {
    content: attr(data-label);
    display: block;
    font: 600 15px/1.4 var(--body);
    color: var(--muted);
  }
  .compare-table .qs-price {
    font-size: 34px;
    display: block;
  }
  .compare-table tfoot tr {
    grid-template-columns: 1fr;
    border: 0;
  }
  .compare-table tfoot td:first-child {
    display: none;
  }
}
@media (max-width: 650px) {
  .glance {
    padding: 20px;
  }
  .qs-single-top {
    grid-template-columns: 1fr;
  }
  .qs-single-top .qs-price,
  .qs-single-top .qs-price small {
    text-align: left;
  }
}

/* =====================================================================
   Services page
   ===================================================================== */
.services-index {
  margin-top: 40px;
}
.services-opener {
  border-bottom: 0;
}
.services-index .ledger-row {
  color: var(--ink);
}
.services-index .ledger-name small {
  font: 600 15px/1.4 var(--body);
  letter-spacing: 0;
  text-transform: none;
}
.services-index .ledger-price small {
  font-size: 15px;
}
.services-index .ledger-desc,
.services-index .ledger-price {
  display: block;
}
.page-services .l-section {
  border-bottom: 0;
  border-top: 1px solid var(--line);
}
.split-offer {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--s6) clamp(40px, 6vw, 96px);
  align-items: start;
}
.split-copy h2 {
  margin: 0 0 24px;
}
.split-copy p {
  font-size: 19px;
  line-height: 1.6;
  max-width: 52ch;
  margin: 0 0 14px;
}
.svc-care {
  background: var(--paper-deep);
}
.fact-rows {
  margin: 0 0 16px;
  border-top: 2px solid var(--ink);
  max-width: 1080px;
}
.fact-rows > div {
  display: grid;
  grid-template-columns: minmax(0, 13rem) minmax(0, 17rem) minmax(0, 1fr);
  gap: 6px 32px;
  align-items: baseline;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}
.fact-rows dt {
  font: 700 17px/1.4 var(--body);
}
.fact-rows dd {
  margin: 0;
}
.fact-value {
  font: 800 clamp(30px, 3vw, 40px)/1 var(--display);
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}
.fact-value small {
  font: 600 15px/1.4 var(--body);
  text-transform: none;
  color: var(--muted);
  margin-left: 8px;
}
.fact-note {
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink-soft);
}
.fit-cols {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--s5) clamp(32px, 5vw, 80px);
  margin-bottom: 16px;
}
.fit-col h3 {
  font: 800 clamp(28px, 2.6vw, 36px)/1 var(--display);
  text-transform: uppercase;
  margin: 0;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--ink);
}
.fit-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fit-col li {
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink-soft);
}
.fit-col strong {
  display: block;
  color: var(--ink);
  margin-bottom: 2px;
}
.fit-not h3 {
  color: var(--ink-soft);
}
.svc-addons h2 {
  font-size: clamp(32px, 3.6vw, 48px);
  margin: 0 0 16px;
}
.svc-addons p {
  font-size: 19px;
  line-height: 1.6;
  max-width: 60ch;
  margin: 0 0 8px;
}
@media (max-width: 900px) {
  .split-offer,
  .fit-cols {
    grid-template-columns: 1fr;
  }
  .fact-rows > div {
    grid-template-columns: 1fr;
  }
}

/* =====================================================================
   Contact page: form beside a contact panel, inline validation states
   ===================================================================== */
.contact-page {
  padding-block: 32px clamp(64px, 8vw, 104px);
  border-bottom: 0;
}
.contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  grid-template-areas: "intro form" "panel form";
  grid-template-rows: auto 1fr;
  gap: 0 clamp(40px, 6vw, 96px);
  align-items: start;
}
.contact-intro {
  grid-area: intro;
}
.contact-form-col {
  grid-area: form;
  padding-top: 12px;
}
.contact-panel {
  grid-area: panel;
  margin-top: 40px;
  border-top: 2px solid var(--ink);
}
.contact-intro h1 {
  font-size: clamp(52px, 6.4vw, 104px);
  line-height: 0.9;
  margin: 0;
}
.contact-panel dl {
  margin: 0;
}
.contact-panel dl > div {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.contact-panel dt {
  font: 700 15px/1.4 var(--body);
  margin-bottom: 4px;
}
.contact-panel dd {
  margin: 0;
  font-size: 17px;
  line-height: 1.55;
}
.panel-email {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.next-steps {
  margin: 0;
  padding-left: 22px;
}
.next-steps li {
  font-size: 16px;
  line-height: 1.5;
  margin: 2px 0;
}
#contact-form {
  border-top: 2px solid var(--ink);
  padding-top: 24px;
}
.choice-set {
  border: 0;
  padding: 0;
  margin: 0 0 28px;
  min-width: 0;
}
.choice-set legend {
  font: 700 17px/1.4 var(--body);
  padding: 0;
  margin-bottom: 12px;
}
.choice-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}
#contact-form .choice-card,
#contact-form .choice-chip {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin: 0;
  padding: 16px;
  border: 1px solid var(--ink);
  border-radius: 0;
  background: var(--paper);
  cursor: pointer;
  font: 400 16px/1.45 var(--body);
  transition: background-color 160ms ease, border-color 160ms ease;
}
.choice-card strong {
  display: block;
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
}
.choice-card strong + span {
  display: block;
  font-size: 15px;
  color: var(--ink-soft);
  margin-top: 2px;
}
#contact-form input[type="radio"] {
  width: 20px;
  height: 20px;
  min-height: 0;
  margin: 2px 0 0;
  padding: 0;
  accent-color: var(--blue);
  cursor: pointer;
}
#contact-form .choice-card:hover,
#contact-form .choice-chip:hover {
  background: var(--paper-deep);
}
#contact-form .choice-card:has(input:checked),
#contact-form .choice-chip:has(input:checked) {
  border-color: var(--blue);
  box-shadow: inset 0 0 0 1px var(--blue);
  background: var(--paper-deep);
}
#contact-form .choice-card:has(input:focus-visible),
#contact-form .choice-chip:has(input:focus-visible) {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
}
.choice-more {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 12px;
}
.choice-more-label {
  font-size: 15px;
  color: var(--ink-soft);
}
#contact-form .choice-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 8px 14px;
  font: 600 15px/1.3 var(--body);
}
#contact-form .choice-chip input[type="radio"] {
  margin: 0;
}
.field-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 24px;
}
.field {
  margin-bottom: 20px;
  min-width: 0;
}
.field-wide {
  grid-column: 1 / -1;
}
#contact-form .field input,
#contact-form .field select,
#contact-form .field textarea {
  margin-bottom: 0;
}
#contact-form .field textarea {
  min-height: 96px;
}
.field-hint {
  font-size: 15px;
  line-height: 1.45;
  color: var(--muted);
  margin: 6px 0 0;
}
.field-error {
  font: 600 15px/1.45 var(--body);
  color: var(--error);
  margin: 6px 0 0;
}
.field-error:empty {
  display: none;
}
#contact-form .field.is-invalid input {
  border-bottom: 2px solid var(--error);
}
.more-detail {
  border-block: 1px solid var(--line);
  margin: 4px 0 24px;
}
.more-detail > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 52px;
  list-style: none;
  font: 600 16px/1.3 var(--body);
}
.more-detail > summary::-webkit-details-marker {
  display: none;
}
.more-detail > .field-grid {
  padding-top: 8px;
}
/* Status regions stay rendered (collapsed when empty) so screen readers announce new text. */
#contact-form .form-status {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  margin: 0 0 20px;
  background: var(--paper-deep);
  border-left: 4px solid currentColor;
  font: 600 16px/1.5 var(--body);
}
#contact-form .form-status:empty {
  padding: 0;
  margin: 0;
  border: 0;
  background: none;
}
#contact-form .form-status.is-ok {
  color: var(--ok);
}
.form-status.is-ok .icon {
  width: 22px;
  height: 22px;
  margin-top: 1px;
}
#contact-form .form-status.is-error {
  display: block;
  color: var(--error);
}
.form-status.is-error a {
  color: inherit;
  text-decoration: underline;
}
.form-status:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
}
#contact-form .form-submit {
  width: 100%;
  justify-content: space-between;
  white-space: normal;
  text-align: left;
  min-height: 60px;
}
#contact-form .form-submit[aria-disabled="true"] {
  cursor: progress;
  background: var(--blue-deep);
}
#contact-form .fineprint {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-soft);
}
@media (max-width: 900px) {
  .contact-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "intro" "form" "panel";
    grid-template-rows: auto;
  }
  .contact-form-col {
    padding-top: 28px;
  }
}
@media (max-width: 600px) {
  .choice-grid,
  .field-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .contact-intro h1 {
    font-size: clamp(44px, 13vw, 64px);
  }
  .opener-lead {
    font-size: 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #contact-form .choice-card,
  #contact-form .choice-chip {
    transition: none;
  }
}

/* Late fixes after the viewport sweep (pricing, services, contact) */
.compare-table {
  min-width: 0;
}
@media (max-width: 650px) {
  .qs-line {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .qs-time {
    white-space: normal;
  }
}
@media (max-width: 400px) {
  .qs-line .qs-price {
    font-size: 32px;
  }
}
@media (max-width: 600px) {
  .choice-more-label {
    flex-basis: 100%;
  }
}
/* Shared fix: the menu button keeps its accessible name when the label is hidden on small phones. */
@media (max-width: 420px) {
  .navtoggle-label {
    display: inline;
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }
  .navtoggle {
    min-width: 44px;
    justify-content: center;
  }
}

/* Footer social links (placeholders until the profiles exist) */
.footer-social {
  display: flex;
  gap: 8px;
  margin-top: 18px;
}
.footer-social .social-link {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid #5a5b53;
  color: var(--paper);
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}
.footer-social .social-link:hover {
  background: var(--lime);
  border-color: var(--lime);
  color: var(--ink);
}
.footer-social .icon {
  width: 22px;
  height: 22px;
}

/* =====================================================================
   Fluid layer: ruled paper, one blue band, reveals, hover life,
   timeline draw, quote builder, closing form, phone CTA bar.
   Motion is transform and opacity only, and every hidden start state is
   added by site.js (so no-JS and reduced-motion visitors see everything).
   ===================================================================== */
:root {
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ruled: repeating-linear-gradient(to bottom, transparent 0 31px, rgba(26, 26, 24, 0.05) 31px 32px);
  --margin-rule: rgba(39, 62, 219, 0.5);
  --z-sticky: 45;
}

/* Ledger paper: faint 32px rules plus a blue double margin rule */
.poster-hero,
.quote-sheet,
.glance {
  position: relative;
  background-image: var(--ruled);
}
.poster-hero::before,
.quote-sheet::before,
.glance::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  border-inline: 1px solid var(--margin-rule);
  pointer-events: none;
}
.poster-hero::before {
  left: max(calc(var(--gutter) / 2 - 2px), calc((100% - var(--max)) / 2 + var(--gutter) / 2 - 2px));
}
.quote-sheet::before {
  left: calc(clamp(24px, 4vw, 48px) / 2 - 2px);
}
.glance::before {
  left: 12px;
}
@media (max-width: 650px) {
  .glance::before {
    left: 8px;
  }
}

/* Home case study: the one blue band */
.page-home .case {
  background: var(--blue-deep);
  color: var(--paper);
  --line: rgba(241, 240, 233, 0.32);
}
.case h2 span,
.case .fact-rail b {
  color: var(--lime);
}
.case .fact-rail {
  border-top-color: var(--paper);
}
.case .honest {
  color: #e3e5f6;
}
.case .proof-shots figcaption {
  color: #c9cff5;
}
.case .proof-desktop {
  box-shadow: 0 34px 60px -34px rgba(6, 10, 48, 0.7);
}
.case a:hover {
  color: var(--lime);
}
.case :focus-visible {
  outline-color: var(--lime);
}

/* Entrances: hero lines rise once; everything else reveals on enter (site.js) */
@media (prefers-reduced-motion: no-preference) {
  .poster-hero .hero-line,
  .page-opener h1,
  .article-opener h1 {
    animation: baken-rise 480ms var(--ease) both;
  }
  .poster-hero .line-two {
    animation-delay: 80ms;
  }
}
@keyframes baken-rise {
  from {
    transform: translateY(12px);
  }
}
.rv {
  opacity: 0;
  transform: translateY(14px);
}
.rv.rv-in {
  opacity: 1;
  transform: none;
  transition:
    opacity 450ms var(--ease),
    transform 450ms var(--ease);
}

/* Hover and focus life */
.ledger-row {
  position: relative;
  isolation: isolate;
}
.ledger-row::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--lime);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 380ms var(--ease);
}
.ledger-row:hover,
.ledger-row:focus-visible {
  background: none;
  color: var(--ink);
}
.ledger-row:hover::before,
.ledger-row:focus-visible::before {
  transform: scaleX(1);
}
.ledger-row:focus-visible .icon {
  transform: translate(3px, -3px);
}
.text-link {
  position: relative;
}
.text-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 280ms var(--ease);
}
.text-link:hover::after,
.text-link:focus-visible::after {
  transform: scaleX(1);
}
.plain-link {
  background: linear-gradient(var(--blue), var(--blue)) no-repeat 0 calc(50% + 0.8em) / 0 2px;
  transition:
    background-size 280ms var(--ease),
    color 160ms ease;
}
p .plain-link,
dd .plain-link,
li .plain-link {
  background-position: 0 100%;
}
.plain-link:hover,
.plain-link:focus-visible {
  background-size: 100% 2px;
  text-decoration-color: transparent;
}
.case .plain-link,
.process .plain-link {
  background-image: linear-gradient(var(--lime), var(--lime));
}
.qs-line {
  transition: transform 220ms var(--ease);
}
.qs-line:hover,
.qs-line:focus-within {
  transform: translateY(-2px);
}
.qs-line .qs-price {
  position: relative;
  z-index: 0;
}
.qs-line .qs-price::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -0.04em;
  right: -0.04em;
  top: 0.6em;
  height: 0.38em;
  background: var(--lime);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 320ms var(--ease);
}
.qs-line:hover .qs-price::after,
.qs-line:focus-within .qs-price::after {
  transform: scaleX(1);
}
.portrait img {
  transition: transform 320ms var(--ease);
}
.portrait:hover img {
  transform: translateY(-4px);
}

/* Process timeline: rule draws across, then each number fills */
.timeline li::before {
  z-index: 1;
}
.timeline li::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -3px;
  height: 3px;
  background: var(--lime);
  transform-origin: left center;
}
.timeline h3::before {
  content: counter(step);
  position: absolute;
  z-index: 2;
  top: -19px;
  left: 0;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  background: var(--lime);
  color: var(--ink);
  font: 800 20px/1 var(--display);
}
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .timeline li {
      view-timeline: --step block;
    }
    .timeline li::after {
      animation: baken-draw linear both;
      animation-timeline: --step;
      animation-range: cover 12% cover 26%;
    }
    .timeline h3::before {
      animation: baken-fill linear both;
      animation-timeline: --step;
      animation-range: cover 24% cover 30%;
    }
    .timeline li:nth-child(2)::after {
      animation-range: cover 17% cover 31%;
    }
    .timeline li:nth-child(2) h3::before {
      animation-range: cover 29% cover 35%;
    }
    .timeline li:nth-child(3)::after {
      animation-range: cover 22% cover 36%;
    }
    .timeline li:nth-child(3) h3::before {
      animation-range: cover 34% cover 40%;
    }
    .timeline li:nth-child(4)::after {
      animation-range: cover 27% cover 41%;
    }
    .timeline li:nth-child(4) h3::before {
      animation-range: cover 39% cover 45%;
    }
  }
  @supports (animation-timeline: view()) {
    .timeline li {
      border-top-color: rgba(229, 243, 77, 0.22);
    }
    .timeline li::before {
      background: var(--ink);
      color: var(--lime);
      box-shadow: inset 0 0 0 2px var(--lime);
    }
  }
  .tl-io li {
    border-top-color: rgba(229, 243, 77, 0.22);
  }
  .tl-io li::before {
    background: var(--ink);
    color: var(--lime);
    box-shadow: inset 0 0 0 2px var(--lime);
  }
  .tl-io li::after {
    transform: scaleX(0);
    transition: transform 600ms var(--ease);
  }
  .tl-io h3::before {
    opacity: 0;
    transform: scale(0.5);
    transition:
      opacity 240ms ease,
      transform 320ms var(--ease);
  }
  .tl-io.tl-in li::after,
  .tl-io.tl-in h3::before {
    opacity: 1;
    transform: none;
  }
  .tl-io li:nth-child(1) h3::before {
    transition-delay: 450ms;
  }
  .tl-io li:nth-child(2)::after {
    transition-delay: 180ms;
  }
  .tl-io li:nth-child(2) h3::before {
    transition-delay: 630ms;
  }
  .tl-io li:nth-child(3)::after {
    transition-delay: 360ms;
  }
  .tl-io li:nth-child(3) h3::before {
    transition-delay: 810ms;
  }
  .tl-io li:nth-child(4)::after {
    transition-delay: 540ms;
  }
  .tl-io li:nth-child(4) h3::before {
    transition-delay: 990ms;
  }
}
@keyframes baken-draw {
  from {
    transform: scaleX(0);
  }
}
@keyframes baken-fill {
  from {
    opacity: 0;
    transform: scale(0.5);
  }
}

/* Pricing section nav: current section underlined in blue */
.l-subnav a {
  position: relative;
}
.l-subnav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 240ms var(--ease);
}
.l-subnav a[aria-current] {
  color: var(--blue);
}
.l-subnav a[aria-current]::after {
  transform: scaleX(1);
}

/* Quote builder (pricing) */
.qb {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: var(--s6) clamp(32px, 5vw, 72px);
  align-items: start;
}
.qb[hidden],
.qb-nojs[hidden] {
  display: none;
}
.qb-nojs {
  font-size: 17px;
  max-width: 60ch;
}
.qb-inputs {
  display: grid;
  gap: 28px;
}
.qb-seg {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.qb-seg legend {
  font: 700 17px/1.4 var(--body);
  padding: 0;
  margin-bottom: 10px;
}
.seg {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}
.seg-4 {
  grid-auto-flow: row;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.seg label {
  position: relative;
  display: flex;
  margin: 0;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  cursor: pointer;
}
.seg input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  min-height: 0;
  margin: 0;
  padding: 0;
}
.seg span {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 56px;
  padding: 10px 14px;
  font: 600 16px/1.3 var(--body);
  transition:
    background-color 160ms ease,
    color 160ms ease;
}
.seg small {
  font: 600 15px/1.3 var(--body);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}
.seg label:hover span {
  background: var(--paper-deep);
}
.seg input:checked + span {
  background: var(--blue);
  color: #fff;
}
.seg input:checked + span small {
  color: #e3e6fb;
}
.seg input:focus-visible + span {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
  position: relative;
  z-index: 1;
}
.qb-sheet {
  max-width: none;
  margin: 0;
}
.qb-lines {
  list-style: none;
  margin: 0;
  padding: 0;
}
.qb-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 24px;
  align-items: baseline;
  margin: 0;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.qb-line h4 {
  font: 700 18px/1.3 var(--body);
  margin: 0 0 2px;
}
.qb-line p {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.qb-line .qs-price {
  font-size: clamp(28px, 2.6vw, 36px);
  color: var(--ink);
}
.qb-empty p {
  font-size: 16px;
}
.qb-totals {
  margin: 0;
  padding-top: 6px;
}
.qb-totals div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.qb-totals dt {
  font: 600 16px/1.4 var(--body);
}
.qb-totals dd {
  margin: 0;
  font: 800 clamp(28px, 2.6vw, 36px)/1 var(--display);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.qb-totals .qb-year {
  border-bottom: 2px solid var(--ink);
}
.qb-year dt {
  font-weight: 700;
  font-size: 17px;
}
.qb-year dd {
  font-size: clamp(40px, 4vw, 56px);
  background: linear-gradient(transparent 58%, var(--lime) 58% 92%, transparent 92%);
}
.qb-note {
  font: 600 15px/1.5 var(--body);
  margin: 16px 0 0;
}
.qb-note:empty {
  display: none;
}
.qb-terms {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 16px 0 20px;
}
.qb-sheet .btn {
  width: 100%;
  justify-content: space-between;
}
@media (max-width: 900px) {
  .qb {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 600px) {
  .seg-3 {
    grid-auto-flow: row;
    grid-template-columns: minmax(0, 1fr);
  }
  .seg-3 span {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
}

/* Closing band: one-field Website Check form (GET to the contact page) */
.check-mini {
  border-top: 0;
  padding-top: 0;
  margin-bottom: 4px;
}
.check-mini label {
  display: block;
  font: 700 17px/1.4 var(--body);
  margin-bottom: 8px;
  color: var(--ink);
}
.check-row {
  display: grid;
  gap: 12px;
}
.check-mini input[type="text"] {
  margin: 0;
  min-height: 56px;
  padding: 12px 16px;
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: 0;
  font-size: 17px;
}
.check-mini input::placeholder {
  color: var(--muted);
}
.check-mini input:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 2px;
}
.closing-band .check-mini .btn {
  width: 100%;
  min-height: 60px;
  font-size: 17px;
}

@media (prefers-reduced-motion: reduce) {
  .ledger-row::before,
  .text-link::after,
  .plain-link,
  .qs-line,
  .qs-line .qs-price::after,
  .portrait img,
  .l-subnav a::after,
  .seg span {
    transition: none;
  }
  .qs-line:hover,
  .qs-line:focus-within,
  .portrait:hover img {
    transform: none;
  }
}
@media print {
  .rv {
    opacity: 1;
    transform: none;
  }
  .qb-section {
    display: none;
  }
}
.seg input:checked:focus-visible + span {
  outline-color: var(--ink);
}

/* Founder card: replaces the portrait. Ledger paper, the Baken mark, plain facts. */
.founder-card {
  position: relative;
  margin: 0;
  border: 1px solid var(--ink);
  border-top-width: 2px;
  background-color: var(--paper-deep);
  background-image: var(--ruled);
  padding: clamp(28px, 3.5vw, 44px) clamp(28px, 3.5vw, 44px) clamp(20px, 2.5vw, 32px) clamp(40px, 4.5vw, 56px);
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.founder-card::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 16px;
  width: 4px;
  border-inline: 1px solid var(--margin-rule);
  pointer-events: none;
}
.founder-card:hover,
.founder-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 18px 32px -24px rgba(26, 26, 24, 0.5);
}
.fc-top {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--ink);
}
.fc-mark {
  display: block;
  width: clamp(96px, 10vw, 136px);
  height: auto;
  color: var(--ink);
  background: var(--blue);
  color: var(--paper);
  margin-bottom: 24px;
}
.fc-name {
  font: 800 clamp(40px, 4vw, 56px) / 0.95 var(--display);
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin: 0 0 8px;
}
.fc-role {
  font: 600 15px / 1.4 var(--body);
  color: var(--ink-soft);
  margin: 0;
}
.fc-facts {
  margin: 0;
}
.fc-facts div {
  display: block;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.fc-facts div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.fc-facts dt {
  font: 600 13px / 1.4 var(--body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 2px;
}
.fc-facts dd {
  margin: 0;
  text-align: left;
  font-size: 17px;
  line-height: 1.45;
}
.fc-facts a {
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 4px;
  overflow-wrap: anywhere;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
@media (max-width: 900px) {
  .founder-card {
    max-width: 480px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .founder-card {
    transition: none;
  }
  .founder-card:hover,
  .founder-card:focus-within {
    transform: none;
  }
}