/* Middlecut — site.css
   Direction: DIRECTION.md (anchor wama: inverted bands, flat ink).
   Component index (for page authors):
     layout   .wrap .wrap-narrow .band(.band-ivory|-white|-charcoal|-mist|-slate) .grid-2 .grid-3 .grid-4 .split(.split-rev) .stack
     type     .kicker .display .h2 .h3 .h4 .lede .muted .small .mark(copper-mist underline, once per page) .measure
     action   .btn(.btn-ivory|.btn-ghost|.btn-sm) .link-arrow .cta-row
     content  .card .tile .stat(.stat-num .stat-lbl .stat-src) .steps .ticks .tag .faq .tbl .note .quote
     media    figure.shot(img + figcaption.cap) .phone(img) .shot-row .deck
     page     .phero (inner-page header) .toc
     motion   .reveal (masked line rise for headings) .fade (fade-up for blocks)
     forms    .form .field .field-row label .input .select .textarea .check .form-note
*/

:root {
  --charcoal: #272B2E;
  --ink-2: #3A3F43;
  --ivory: #F6F3EF;
  --white: #FFFFFF;
  --copper: #C58A65;
  --copper-deep: #A86E4B;
  --slate: #697379;
  --slate-deep: #5A646A; /* slate band ground: darker than brand slate so ivory text passes AA */
  --mist: #E7D3C3;
  --line: #E2DBD3;
  --line-strong: #CFC6BC;
  --line-dark: #41474B;
  --muted: #5C656B;
  --muted-dark: #B9BFC3;
  --copper-text: #7E4E33;
  --focus: var(--charcoal);
  --ease: cubic-bezier(.16, 1, .3, 1);
  --r-card: 10px;
  --r-tile: 14px;
  --r-phone: 34px;
  --phone-bezel: 10px;
  --gutter: clamp(16px, 4vw, 40px);
  --band-pad: clamp(72px, 10vw, 136px);
  --hdr-h: 68px;
  --fs-display: clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem);
  --fs-h2: clamp(2rem, 1.45rem + 2.2vw, 2.85rem);
  --fs-h3: clamp(1.4rem, 1.2rem + .8vw, 1.75rem);
  --fs-h4: 1.3125rem;
  --fs-body: 1.0625rem;
  --fs-lede: clamp(1.125rem, 1.05rem + .35vw, 1.3125rem);
  --fs-small: .9375rem;
  --fs-kicker: .8125rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr-h) + 16px); }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body {
  margin: 0;
  background: var(--ivory);
  color: var(--charcoal);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: var(--fs-body);
  line-height: 1.55;
  font-weight: 400;
  font-feature-settings: "cv11", "ss01";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { text-decoration-color: var(--copper); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: 4px; }
.band-charcoal, .band-slate, .ftr, .menu, .tile { --focus: var(--ivory); }
[tabindex="-1"]:focus { outline: none; }
::selection { background: var(--mist); color: var(--charcoal); }
h1, h2, h3, h4 { font-weight: 500; margin: 0; letter-spacing: -.02em; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
button { font: inherit; color: inherit; }

.skip {
  position: absolute; left: 12px; top: -60px; z-index: 200;
  background: var(--charcoal); color: var(--ivory); padding: 10px 16px; border-radius: 999px;
}
.skip:focus { top: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- layout ---------- */
.wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 var(--gutter); }
.wrap-narrow { max-width: 860px; }
.band { padding: var(--band-pad) 0; position: relative; }
.band-ivory { background: var(--ivory); }
.band-white { background: var(--white); }
.band-mist { background: var(--mist); --muted: #4A5257; }
.band-charcoal { background: var(--charcoal); color: var(--ivory); }
.band-slate { background: var(--slate-deep); color: var(--ivory); --muted: #E4E7E9; }
.band-white + .band-ivory, .band-ivory + .band-white, .band-ivory + .band-ivory { border-top: 1px solid var(--line); }
/* a page intro flows straight into its first section: no divider there */
.phero + .band { border-top: 0; }
.band-tight { padding: clamp(48px, 7vw, 88px) 0; }
.band + .band-ivory.band-follow, .band-ivory + .band-ivory { padding-top: 0; }
.stack > * + * { margin-top: 24px; }
.grid-2, .grid-3, .grid-4 { display: grid; gap: clamp(16px, 2.4vw, 28px); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 960px) { .grid-3, .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }
@media (min-width: 641px) and (max-width: 960px) { .grid-3 > :last-child:nth-child(odd) { grid-column: 1 / -1; } }
.split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 88px); align-items: center; }
.split-rev { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.split-rev > :first-child { order: 2; }
.split-top { align-items: start; }
@media (min-width: 901px) { .split-top > :first-child { position: sticky; top: calc(var(--hdr-h) + 40px); } }
@media (max-width: 900px) {
  .split, .split-rev { grid-template-columns: 1fr; }
  .split-rev > :first-child { order: 0; }
}
.head { max-width: 760px; margin-bottom: clamp(40px, 5vw, 64px); }
.head .lede { margin-top: 20px; }

/* ---------- type ---------- */
.kicker {
  font-size: var(--fs-kicker); letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 18px; display: block;
}
.kicker::before { content: ""; display: inline-block; width: 6px; height: 6px; background: var(--copper); margin-right: 10px; vertical-align: .18em; }
.band-charcoal .kicker, .band-slate .kicker { color: var(--muted-dark); }
.band-slate .kicker { color: #E4E7E9; }
.display { font-size: var(--fs-display); line-height: 1.04; letter-spacing: -.035em; max-width: 16ch; }
.h2 { font-size: var(--fs-h2); line-height: 1.1; letter-spacing: -.03em; max-width: 22ch; }
.h3 { font-size: var(--fs-h3); line-height: 1.18; letter-spacing: -.02em; }
.h4 { font-size: var(--fs-h4); line-height: 1.3; letter-spacing: -.012em; }
.lede { font-size: var(--fs-lede); line-height: 1.5; color: var(--muted); max-width: 60ch; }
.band-charcoal .lede, .band-slate .lede { color: var(--muted-dark); }
.band-slate .lede { color: #E4E7E9; }
.muted { color: var(--muted); }
.band-charcoal .muted { color: var(--muted-dark); }
.small { font-size: var(--fs-small); }
.measure { max-width: 62ch; }
.prose p + p, .prose p + ul, .prose ul + p { margin-top: 1em; }
.prose ul { padding-left: 1.2em; }
.prose li + li { margin-top: .4em; }
.prose h3 { margin: 1.6em 0 .5em; }
.mark { background: linear-gradient(transparent 62%, var(--mist) 62%, var(--mist) 92%, transparent 92%); }
.band-charcoal .mark { background: none; color: var(--mist); }
.num { font-variant-numeric: tabular-nums; }

/* ---------- actions ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 24px; border-radius: 999px; border: 1px solid var(--charcoal);
  background: var(--charcoal); color: var(--ivory); text-decoration: none;
  font-size: 1rem; font-weight: 500; letter-spacing: -.005em; cursor: pointer; white-space: nowrap;
  transition: background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.btn:hover { background: var(--ink-2); }
.btn-ivory { background: var(--ivory); color: var(--charcoal); border-color: var(--ivory); }
.btn-ivory:hover { background: var(--white); }
.btn-ghost { background: transparent; color: var(--charcoal); border-color: var(--line-strong); }
.btn-ghost:hover { background: var(--white); border-color: var(--charcoal); }
.band-charcoal .btn-ghost, .band-slate .btn-ghost { color: var(--ivory); border-color: var(--line-dark); }
.band-charcoal .btn-ghost:hover { background: var(--ink-2); border-color: var(--muted-dark); }
.btn-sm { min-height: 40px; padding: 0 18px; font-size: .9375rem; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.hdr-cta { gap: 0; }
.link-arrow { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; text-decoration: none; min-height: 44px; }
.link-arrow::after { content: "→"; content: "→" / ""; transition: transform .3s var(--ease); }
.link-arrow:hover::after { transform: translateX(4px); }
.link-arrow:hover { text-decoration: underline; text-decoration-color: var(--copper); }
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: 36px; }

/* ---------- header ---------- */
.hdr {
  position: sticky; top: 0; z-index: 50; height: var(--hdr-h);
  background: rgba(246, 243, 239, .97); backdrop-filter: saturate(1.2) blur(10px); -webkit-backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid transparent; transition: border-color .3s var(--ease);
}
.hdr.is-scrolled { border-bottom-color: var(--line); }
.hdr-in { height: 100%; max-width: 1240px; margin: 0 auto; padding: 0 var(--gutter); display: flex; align-items: center; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; flex: none; min-height: 44px; }
.brand-sym { width: 26px; height: auto; }
.brand-word { width: 112px; height: auto; }
.hdr-nav { display: flex; gap: 4px; margin-left: auto; }
.hdr-nav a { text-decoration: none; font-size: .9375rem; padding: 10px 14px; border-radius: 999px; color: var(--charcoal); }
.hdr-nav a:hover { background: rgba(39, 43, 46, .06); }
.hdr-nav a[aria-current="page"] { box-shadow: inset 0 0 0 1px var(--line-strong); }
.hdr-act { display: flex; align-items: center; gap: 8px; }
.menu-btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 6px 0 14px;
  background: transparent; border: 0; cursor: pointer; font-size: .9375rem; border-radius: 999px;
}
.menu-btn:hover .menu-ico { background: rgba(39, 43, 46, .08); }
.menu-ico { width: 40px; height: 40px; border-radius: 50%; display: grid; place-content: center; gap: 5px; transition: background .2s; }
.menu-ico i { display: block; width: 16px; height: 1.5px; background: currentColor; transition: transform .35s var(--ease); }
.menu-ico.is-x i:first-child { transform: translateY(3.25px) rotate(45deg); }
.menu-ico.is-x i:last-child { transform: translateY(-3.25px) rotate(-45deg); }
.progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; pointer-events: none; }
.progress i { display: block; height: 100%; width: 100%; background: var(--copper); transform-origin: 0 50%; transform: scaleX(0); }
@media (max-width: 900px) { .hdr-nav { display: none; } .hdr-act { margin-left: auto; } }
@media (max-width: 520px) {
  .hdr-act .hdr-cta { padding: 0 14px; min-height: 44px; }
  .hide-sm { display: none; }
  .hdr-act .show-sm { display: inline; }
  .brand-word { width: 96px; }
  .menu-lbl { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .menu-btn { padding: 0; min-width: 44px; justify-content: center; }
}

/* ---------- menu takeover ---------- */
.menu {
  position: fixed; inset: 0; z-index: 100; background: var(--charcoal); color: var(--ivory);
  overflow-y: auto; overscroll-behavior: contain;
}
.menu[hidden] { display: none; }
html:not(.js) [data-menu-open] { display: none; }
.menu-in { min-height: 100%; max-width: 1240px; margin: 0 auto; padding: 0 var(--gutter) 40px; display: flex; flex-direction: column; }
.menu-top { height: var(--hdr-h); display: flex; align-items: center; justify-content: space-between; }
.menu-top .menu-btn:hover .menu-ico { background: rgba(246, 243, 239, .1); }
.menu-list { list-style: none; margin: clamp(24px, 6vh, 64px) 0 40px; }
.menu-list a {
  display: flex; align-items: baseline; gap: 20px; text-decoration: none;
  font-size: clamp(2rem, 1.3rem + 3vw, 3.5rem); line-height: 1.15; letter-spacing: -.03em; font-weight: 500;
  padding: 8px 0; border-bottom: 1px solid var(--line-dark);
}
.menu-list a:hover, .menu-list a[aria-current="page"] { color: var(--mist); }
.mnum { font-size: .875rem; letter-spacing: .06em; color: var(--copper); font-variant-numeric: tabular-nums; min-width: 2ch; transform: translateY(-.6em); }
.menu-foot { margin-top: auto; display: flex; flex-wrap: wrap; gap: 16px 40px; align-items: center; color: var(--muted-dark); }
.menu-foot a:not(.btn) { color: var(--ivory); }
.menu-foot .btn { margin-left: auto; }
@media (max-width: 640px) { .menu-foot .btn { margin-left: 0; width: 100%; } }
html.menu-open { overflow: hidden; }
.js .menu.is-anim .menu-list li { opacity: 0; transform: translateY(18px); }
.js .menu.is-open .menu-list li { opacity: 1; transform: none; transition: opacity .6s var(--ease), transform .6s var(--ease); }
.js .menu.is-open .menu-list li:nth-child(2) { transition-delay: .04s; }
.js .menu.is-open .menu-list li:nth-child(3) { transition-delay: .08s; }
.js .menu.is-open .menu-list li:nth-child(4) { transition-delay: .12s; }
.js .menu.is-open .menu-list li:nth-child(5) { transition-delay: .16s; }
.js .menu.is-open .menu-list li:nth-child(6) { transition-delay: .2s; }
.js .menu.is-open .menu-list li:nth-child(7) { transition-delay: .24s; }
.js .menu.is-open .menu-list li:nth-child(8) { transition-delay: .28s; }

/* ---------- cards, tiles ---------- */
.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); padding: clamp(22px, 2.6vw, 32px); }
.band-white .card { background: var(--ivory); }
.band-mist .card { background: var(--ivory); border-color: transparent; }
.tile { background: var(--ink-2); border-radius: var(--r-tile); padding: clamp(22px, 2.6vw, 32px); }
.band-slate .tile { background: rgba(39, 43, 46, .28); }
.card h3, .tile h3 { font-size: var(--fs-h4); line-height: 1.3; letter-spacing: -.012em; margin-bottom: 10px; }
.card p, .tile p { color: var(--muted); }
.tile p { color: var(--muted-dark); }
.card-link { text-decoration: none; display: flex; flex-direction: column; transition: border-color .25s var(--ease); }
.card-link:hover { border-color: var(--charcoal); }
.card-link .link-arrow { margin-top: auto; padding-top: 16px; }
.tag {
  display: inline-flex; align-items: center; gap: 6px; font-size: .8125rem; line-height: 1;
  padding: 7px 11px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--muted); white-space: nowrap;
}
.band-charcoal .tag { border-color: var(--line-dark); color: var(--muted-dark); }
.tag-dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--copper); }
.tags { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- stats ---------- */
.stat { border-top: 1px solid var(--line-dark); padding-top: 22px; }
.band-ivory .stat, .band-white .stat, .band-mist .stat { border-top-color: var(--line-strong); }
.stat-num { font-size: clamp(2.6rem, 1.8rem + 3vw, 4rem); line-height: 1; letter-spacing: -.04em; font-weight: 500; font-variant-numeric: tabular-nums; }
.stat-lbl { margin-top: 14px; max-width: 30ch; }
.stat-src { margin-top: 10px; font-size: .8125rem; color: var(--muted); }
.band-charcoal .stat-src { color: var(--muted-dark); }
.stat-src a { color: inherit; }

/* ---------- lists ---------- */
.steps { list-style: none; counter-reset: s; display: grid; gap: 0; }
.steps > li { counter-increment: s; display: grid; grid-template-columns: 56px 1fr; gap: 0 16px; padding: 22px 0; border-top: 1px solid var(--line-strong); }
.band-charcoal .steps > li, .band-slate .steps > li { border-top-color: var(--line-dark); }
.band-slate .steps > li { border-top-color: rgba(246, 243, 239, .25); }
.steps > li::before { content: counter(s, decimal-leading-zero); color: var(--copper-text); font-variant-numeric: tabular-nums; font-size: .9375rem; padding-top: 3px; }
.band-charcoal .steps > li::before { color: var(--copper); }
.band-slate .steps > li::before { color: var(--ivory); }
.steps h3 { font-size: var(--fs-h4); margin-bottom: 6px; }
@media (max-width: 640px) {
  .steps > li { grid-template-columns: 32px 1fr; gap: 0 12px; padding: 18px 0; }
  .steps > li::before { font-size: .8125rem; }
}
.ticks { list-style: none; display: grid; gap: 12px; }
.ticks li { position: relative; padding-left: 26px; }
.ticks li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 8px; height: 8px; background: var(--copper); }
.ticks-x li::before { background: transparent; border: 1.5px solid var(--slate); }

/* ---------- screenshots ---------- */
.shot { margin: 0; }
.shot-frame { border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--line); background: var(--white); padding: 6px; }
.band-charcoal .shot-frame { border-color: var(--line-dark); background: #1F2326; }
.band-mist .shot-frame { background: var(--ivory); border-color: transparent; }
.shot-frame img { width: 100%; height: auto; border-radius: 5px; }
/* zoom crop: <div class="shot-frame zoom" style="--ar:4/3;--zx:4%;--zy:18%;--z:2"> — shows one region of a big screenshot */
.shot-frame.zoom { position: relative; aspect-ratio: var(--ar, 4 / 3); overflow: clip; contain: paint; }
.shot-frame.zoom img { position: absolute; inset: 6px; width: calc(100% - 12px); height: calc(100% - 12px); object-fit: cover; object-position: var(--zx, 0%) var(--zy, 0%); transform: scale(var(--z, 1.8)); transform-origin: var(--zx, 0%) var(--zy, 0%); }
.shot-frame.zoom::after { content: ""; position: absolute; inset: 0; border: 6px solid var(--white); border-radius: var(--r-card); pointer-events: none; }
.band-charcoal .shot-frame.zoom::after { border-color: #1F2326; }
.band-mist .shot-frame.zoom::after { border-color: var(--ivory); }
.shot-frame.crop { aspect-ratio: 16 / 10; }
.shot-frame.crop img { height: 100%; object-fit: cover; object-position: top left; }
.cap { margin-top: 14px; font-size: var(--fs-small); color: var(--muted); display: flex; flex-direction: column; gap: 2px; }
.cap strong { font-weight: 500; color: var(--charcoal); }
.band-charcoal .cap { color: var(--muted-dark); }
.band-charcoal .cap strong { color: var(--ivory); }
.phone {
  margin: 0 auto; width: min(100%, 320px); border-radius: var(--r-phone); padding: var(--phone-bezel); background: var(--charcoal);
}
.band-charcoal .phone { background: #15181A; box-shadow: inset 0 0 0 1px var(--line-dark); }
.phone img { border-radius: calc(var(--r-phone) - var(--phone-bezel)); width: 100%; }
.shot-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 2vw, 24px); }
@media (max-width: 900px) { .shot-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- page header ---------- */
.phero { padding: clamp(56px, 9vw, 120px) 0 clamp(48px, 7vw, 96px); }
.phero .display { max-width: 18ch; }
.phero .lede { margin-top: 24px; }
.crumbs { font-size: var(--fs-small); color: var(--muted); margin-bottom: 28px; }
.crumbs a { color: inherit; }

/* ---------- faq ---------- */
.faq { border-top: 1px solid var(--line-strong); }
.faq details { border-bottom: 1px solid var(--line-strong); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; align-items: center;
  padding: 22px 0; font-size: var(--fs-h4); letter-spacing: -.012em; font-weight: 500; min-height: 44px;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; content: "+" / ""; font-weight: 400; font-size: 1.5rem; color: var(--copper-text); transition: transform .35s var(--ease); flex: none; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq .ans { padding: 0 0 24px; max-width: 64ch; color: var(--muted); }
.faq .ans p + p { margin-top: .8em; }

/* ---------- tables ---------- */
.tbl-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--white); }
.tbl { width: 100%; border-collapse: collapse; min-width: 620px; font-size: var(--fs-small); }
.tbl th, .tbl td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl thead th { font-weight: 500; font-size: .8125rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); background: var(--ivory); }
.tbl tbody th { font-weight: 500; }
.tbl tr:last-child td, .tbl tr:last-child th { border-bottom: 0; }
.tbl .yes { color: var(--charcoal); }
.tbl .no { color: var(--muted); }

/* ---------- notes & quotes ---------- */
.note { border-left: 2px solid var(--line-strong); padding: 4px 0 4px 18px; color: var(--muted); font-size: var(--fs-small); max-width: 64ch; }
.band-charcoal .note { color: var(--muted-dark); border-left-color: var(--line-dark); }
.quote { margin: 0; font-size: var(--fs-h3); line-height: 1.3; letter-spacing: -.02em; max-width: 30ch; }
.quote footer { margin-top: 14px; font-size: var(--fs-small); color: var(--muted); letter-spacing: 0; }
.band-charcoal .quote footer { color: var(--muted-dark); }

/* ---------- forms ---------- */
.form { display: grid; gap: 20px; }
.field { display: grid; gap: 8px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 640px) { .field-row { grid-template-columns: 1fr; } }
.field label, .field .lbl { font-size: var(--fs-small); font-weight: 500; }
.field .hint { font-size: .8125rem; color: var(--muted); }
.input, .select, .textarea {
  width: 100%; min-height: 48px; padding: 12px 14px; font: inherit; font-size: 1rem; color: var(--charcoal);
  background: var(--white); border: 1px solid #80878D; border-radius: var(--r-card);
  transition: border-color .2s, box-shadow .2s;
}
.textarea { min-height: 132px; resize: vertical; line-height: 1.5; }
.input:focus, .select:focus, .textarea:focus { outline: none; border-color: var(--charcoal); box-shadow: 0 0 0 3px rgba(197, 138, 101, .35); }
.input[aria-invalid="true"], .textarea[aria-invalid="true"], .select[aria-invalid="true"] { border-color: #B3412E; }
.err { color: #A33A28; font-size: .8125rem; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: var(--fs-small); cursor: pointer; min-height: 44px; padding-top: 10px; }
.check input { width: 20px; height: 20px; accent-color: var(--charcoal); margin: 1px 0 0; flex: none; }
.checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
@media (max-width: 640px) { .checks { grid-template-columns: 1fr; } }
fieldset { border: 0; padding: 0; margin: 0; }
legend { font-size: var(--fs-small); font-weight: 500; margin-bottom: 4px; padding: 0; }
.form-note { font-size: .8125rem; color: var(--muted); }
.form-done { padding: 28px; border-radius: var(--r-card); background: var(--white); border: 1px solid var(--line); }

/* ---------- footer ---------- */
.ftr { background: var(--charcoal); color: var(--muted-dark); padding: clamp(56px, 8vw, 96px) 0 32px; border-top: 1px solid var(--line-dark); }
.ftr a { color: var(--ivory); text-decoration: none; }
.ftr a:hover { text-decoration: underline; text-decoration-color: var(--copper); }
.ftr-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 40px; }
.ftr .kicker { color: var(--muted-dark); }
.ftr-brand { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.ftr-brand img:first-child { width: 36px; }
.ftr-brand .brand-word { width: 150px; }
.ftr-tag { color: var(--ivory); font-size: 1.125rem; }
.ftr-links { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 24px; }
.ftr-links a { display: inline-block; padding: 11px 0; white-space: nowrap; }
.ftr-contact a { display: inline-block; padding: 12px 0; }
.ftr-note { margin-top: 12px; font-size: var(--fs-small); max-width: 36ch; }
.ftr-base { margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--line-dark); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px; font-size: .8125rem; }
.ftr-base p:last-child { max-width: 70ch; }
@media (max-width: 900px) { .ftr-grid { grid-template-columns: 1fr; } }

/* ---------- final CTA band ---------- */
.cta-band .display { max-width: 18ch; }
.cta-band .lede { margin-top: 24px; }

/* ---------- motion ---------- */
.js .reveal .ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.js .reveal .ln > span { display: block; transform: translateY(105%); transition: transform .8s var(--ease); }
.js .reveal.is-in .ln > span { transform: none; }
.js .reveal:not(.is-split) { opacity: 0; }
.js .reveal.is-split { opacity: 1; }
.js .fade { opacity: 0; transform: translateY(20px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.js .fade.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js .reveal .ln > span, .js .fade { transform: none !important; opacity: 1 !important; transition: none !important; }
  .js .reveal:not(.is-split) { opacity: 1; }
  *, *::before, *::after { scroll-behavior: auto !important; }
  .js .menu .menu-list li { opacity: 1 !important; transform: none !important; transition: none !important; }
  .faq summary::after, .link-arrow::after, .menu-ico i { transition: none !important; }
}

/* ---------- utilities ---------- */
.mt-0 { margin-top: 0; } .mt-1 { margin-top: 8px; } .mt-2 { margin-top: 16px; } .mt-3 { margin-top: 24px; } .mt-4 { margin-top: 40px; } .mt-5 { margin-top: 64px; }
.center { text-align: center; }
.nb { white-space: nowrap; }
.show-sm { display: none; }
sup a { display: inline-block; min-width: 24px; min-height: 24px; line-height: 24px; text-align: center; text-decoration: none; }
.hr { height: 1px; background: var(--line-strong); border: 0; margin: 0; }
.band-charcoal .hr { background: var(--line-dark); }