/* Interior pages on the v2 system, 2026-09-24. Loaded after site.css (and hours.css).
   Fixes the first screen (headline was falling to the bottom edge at 1440x900),
   brings the headlines onto the v2 display scale, and restyles the closing invitation. */

.interior-head { padding-block: clamp(1.5rem, 2.6vw, 2.5rem) clamp(3rem, 5vw, 5rem); }
.compare-line { margin-bottom: clamp(1.25rem, 2.5vw, 2.25rem); font-size: .8125rem; gap: 8px; }
.compare-line a { min-height: 40px; padding: 6px 14px; font-size: .8125rem; font-weight: 650; }

/* How we work A */
.interior-hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: clamp(2rem, 5vw, 5rem); align-items: center;
}
.interior-hero h1, .compact-hero h1 {
  font-size: clamp(2.75rem, 1rem + 4.6vw, 5rem); line-height: .98; letter-spacing: -.05em; max-width: 12ch; text-wrap: balance;
}
.interior-hero h1 .w-light, .compact-hero h1 .w-light { font-weight: 300; letter-spacing: -.04em; }
.interior-hero h1 > span, .compact-hero h1 > span { display: block; }
.interior-hero h1 { max-width: none; }
.interior-hero p, .compact-hero p { font-size: var(--v2-t-lede); line-height: 1.5; color: var(--v2-text-soft); max-width: 34rem; }
.page-label { font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: .75rem; }

/* How we work B */
.compact-hero { padding-bottom: clamp(2rem, 4vw, 3.5rem); max-width: 68rem; }
.compact-hero h1 { max-width: 16ch; }
.process-side img { aspect-ratio: 1.55; }

/* Chapter rhythm */
.chapter h2 { font-size: clamp(2rem, 1.2rem + 2.2vw, 3.25rem); letter-spacing: -.042em; line-height: 1.04; }
.chapter .step-num { font-weight: 300; font-size: clamp(2.75rem, 1.8rem + 2.4vw, 4.25rem); }
.handoff-section h2 { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.5rem); letter-spacing: -.042em; }

/* Closing invitation on How we work: light, so the page resolves before the Ink footer. */
.hours-invitation .page-label { color: var(--ah-link); }
.hours-invitation h2 { font-size: var(--v2-t-h2); letter-spacing: -.042em; line-height: 1.03; max-width: 12ch; }
.hours-invitation p { color: var(--v2-text-soft); }
.hours-invitation .ah-action { min-height: 3.5rem; padding-inline: 1.5rem; font-size: 1.0625rem; }
.invitation-note { background: var(--ah-bone); border-color: var(--ah-border); box-shadow: var(--v2-shadow-md); }
.invitation-note li { border-color: var(--ah-border); color: var(--ah-ink); }
.invitation-note span { color: var(--ah-link); font-weight: 700; }
.invitation-note p { color: var(--ah-muted); }

/* The Hours Check has its own stylesheet (hours.css), loaded after this one. */

@media (max-width: 760px) {
  .hours-invitation h2 { max-width: 14ch; }
}

/* ---------- Shared closing band for interior pages ----------
   Light, with the homepage close's rings, so every page resolves before the Ink footer. The colon
   marks the pause before the invitation. */
.page-close, .hours-invitation {
  position: relative; overflow: clip; isolation: isolate;
  background: var(--ah-surface); color: var(--ah-ink);
  padding-block: clamp(4.5rem, 3rem + 5vw, 8rem); border-top: 1px solid var(--ah-border);
}
.page-close::before, .hours-invitation::before {
  content: ""; position: absolute; z-index: -1; left: 86%; top: 55%; width: 150vmax; height: 150vmax;
  transform: translate(-50%, -50%); pointer-events: none; opacity: .55;
  background: repeating-radial-gradient(circle at center, rgb(11 13 14 / 0) 0 5.5rem, rgb(11 13 14 / .05) 5.5rem calc(5.5rem + 1px));
  -webkit-mask: radial-gradient(circle at center, #000 0 22%, transparent 50%);
          mask: radial-gradient(circle at center, #000 0 22%, transparent 50%);
}
.page-close__inner {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2vw, 2rem);
  row-gap: 2rem; align-items: end;
}
.page-close__head { grid-column: 1 / span 7; }
.page-close__head .v2-label { color: var(--ah-link); margin-bottom: 1.25rem; }
.page-close .h2 { max-width: 13ch; }
.page-close__body { grid-column: 9 / -1; display: grid; gap: 1.5rem; }
.page-close__body > p { font-size: 1.0625rem; line-height: 1.6; color: var(--v2-text-soft); max-width: 30rem; }
.page-close__actions { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.page-close .v2-link { color: var(--ah-link); }
@media (max-width: 900px) {
  .page-close__head, .page-close__body { grid-column: 1 / -1; }
}

/* ---------- About ---------- */
.about-hero h1 { font-size: clamp(2.75rem, 1rem + 4.6vw, 5rem); line-height: .98; letter-spacing: -.05em; }
.about-hero h1 > span { display: block; }
.about-hero h1 .w-light { font-weight: 300; letter-spacing: -.04em; }
.about-hero .lede { margin-top: 1.5rem; color: var(--v2-text-soft); max-width: 36rem; }
.founder { background: var(--v2-bone-deep); padding-block: clamp(3.5rem, 2rem + 4vw, 6rem); }
.founder__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.founder__photo { margin: 0; position: relative; max-width: 26rem; }
.founder__todo { position: absolute; z-index: 1; top: .75rem; left: .75rem; margin: 0 !important; color: #4d3900; background: #f3dc97; }
.founder__photo img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--ah-radius-media); box-shadow: var(--v2-shadow-lg); }
.founder__photo figcaption { position: absolute; left: 1rem; bottom: 1rem; display: grid; gap: .1rem; padding: .7rem 1rem; border-radius: var(--ah-radius-control); background: var(--ah-bone); box-shadow: var(--v2-shadow-md); }
.founder__photo figcaption strong { font-size: 1.0625rem; letter-spacing: -.01em; }
.founder__photo figcaption span { font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ah-link); }
.founder__note { display: grid; gap: 1.25rem; max-width: 40rem; }
.founder__note .h2 { font-size: clamp(2rem, 1.1rem + 2.6vw, 3.5rem); }
.founder__note p:not(.v2-label) { font-size: 1.125rem; line-height: 1.7; color: var(--v2-text-soft); }
/* Values: the About page's Ink chapter. */
.values { background: var(--ah-ink); color: var(--ah-bone); padding-block: var(--v2-section); }
.values .h2 .w-light { color: var(--v2-bone-soft); }
.values__list { list-style: none; margin-top: clamp(2.5rem, 4vw, 4rem); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); }
.values__list li { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 1.1rem; padding-top: 1.6rem; border-top: 1px solid var(--v2-ink-line); }
.values__list li::before { content: ""; position: absolute; left: 0; top: -1px; width: 3.5rem; height: 2px; background: var(--ah-emerald); }
.values__list .colon { --c: .5rem; margin-top: .5rem; }
.values__list h3 { font-size: clamp(1.5rem, 1.1rem + 1.1vw, 2.125rem); letter-spacing: -.03em; line-height: 1.12; color: var(--ah-bone); }
.values__list p { margin-top: .6rem; color: var(--v2-bone-soft); line-height: 1.6; }
.values__note { margin-top: 1.5rem; }

/* ---------- Contact ---------- */
.contact-hero h1 { font-size: clamp(2.75rem, 1rem + 4.6vw, 5rem); line-height: .98; letter-spacing: -.05em; }
.contact-hero h1 > span { display: block; }
.contact-hero h1 .w-light { font-weight: 300; letter-spacing: -.04em; }
.contact-hero .lede { margin-top: 1.5rem; color: var(--v2-text-soft); max-width: 34rem; }
.contact-methods { list-style: none; margin-top: 2.25rem; display: grid; }
.contact-methods li { display: grid; grid-template-columns: auto 1fr; gap: 1rem; padding: 1.4rem 0; border-top: 1px solid var(--ah-border); }
.contact-methods li:last-child { border-bottom: 1px solid var(--ah-border); }
.contact-methods .colon { --c: .42rem; margin-top: .4rem; }
.contact-methods h2 { font-size: 1.3125rem; letter-spacing: -.02em; }
.contact-methods p { margin-top: .25rem; color: var(--v2-text-soft); }
.contact-methods .v2-cta { margin-top: 1rem; }
.contact-number {
  display: inline-flex; align-items: center; min-height: 44px;
  font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em; color: var(--ah-ink); text-decoration: none;
  background-image: linear-gradient(var(--ah-emerald), var(--ah-emerald)); background-repeat: no-repeat;
  background-size: 100% 2px; background-position: 0 calc(100% - .35rem);
}
.contact-methods .contact-alt { margin-top: 0; font-size: .9375rem; }
.contact-alt a { display: inline-flex; align-items: center; min-height: 40px; color: var(--ah-link); font-weight: 600; }
.contact-methods [aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.contact-where { margin-top: 1.5rem; color: var(--ah-muted); }

/* ---------- Legal pages ---------- */
.legal { max-width: 46rem; padding-block: clamp(2.5rem, 4vw, 4.5rem) clamp(4rem, 6vw, 6rem); }
.legal h1 { margin-top: .5rem; font-size: clamp(2.5rem, 1rem + 4vw, 4.25rem); line-height: 1; letter-spacing: -.05em; }
.legal h1 .w-light { font-weight: 300; }
.legal__status { margin: 1.25rem 0 2rem; padding: .85rem 1rem; border-radius: var(--ah-radius-control); background: rgb(216 163 26 / .14); color: #5e4500; font-size: .9375rem; font-weight: 600; }
.legal h2 { margin-top: 2.25rem; font-size: 1.3125rem; letter-spacing: -.02em; }
.legal p, .legal li { margin-top: .6rem; color: var(--v2-text-soft); line-height: 1.7; }
.legal ul { padding-left: 1.2rem; }

/* ---------- 404 ---------- */
.notfound { display: grid; justify-items: center; text-align: center; padding-block: clamp(4rem, 8vw, 8rem); }
.notfound .notfound__mark { --u: min(1.6px, calc((100vw - 2.5rem) / 500)); --ground: var(--ah-bone); margin-bottom: clamp(2rem, 4vw, 3rem); }
.notfound h1 { font-size: clamp(2.5rem, 1rem + 4vw, 4.5rem); line-height: 1; letter-spacing: -.05em; }
.notfound h1 > span { display: block; }
.notfound h1 .w-light { font-weight: 300; }
.notfound .lede { margin-top: 1rem; color: var(--v2-text-soft); }
.notfound .page-close__actions { margin-top: 2rem; justify-content: center; }

@media (max-width: 900px) {
  .values__list { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .founder__grid { grid-template-columns: 1fr; }
  .founder__photo { max-width: 20rem; }
}

/* ---------- How we work: FAQ ---------- */
.faq { padding-block: clamp(3rem, 2rem + 3vw, 5rem); border-top: 1px solid var(--ah-border); }
.faq__head { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: clamp(1.75rem, 3vw, 2.75rem); }
.faq__head h2 { font-size: var(--v2-t-h2); line-height: 1.03; letter-spacing: -.042em; }
.faq__head h2 .w-light { font-weight: 300; }
.faq__list { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(2rem, 5vw, 4.5rem); }
.faq__list > div { padding: 1.4rem 0; border-top: 1px solid var(--ah-border); }
.faq__list dt { font-size: 1.1875rem; font-weight: 700; letter-spacing: -.015em; line-height: 1.3; }
.faq__list dd { margin: .55rem 0 0; color: var(--v2-text-soft); line-height: 1.65; }
@media (max-width: 760px) { .faq__list { grid-template-columns: 1fr; } }

/* ---------- Interior openings: one format per page ----------
   How we work: headline over a full-width panorama, the five steps drawn as a track.
   About: a full-bleed cover with a bone panel rising into it.
   Contact: a directory of ways to reach us beside the portrait.
   The Hours Check: an Ink and photo diptych that starts the check (its own file, hours.css).
   Every reveal plays once on arrival and is skipped for reduced motion. */
.interior-head, .hours-main { padding-block: 0; }
.hero-panorama h1, .hero-cover h1, .hero-directory h1 {
  font-size: clamp(2.75rem, 1rem + 4.6vw, 5.25rem); line-height: .98; letter-spacing: -.05em; max-width: none;
}
.hero-panorama h1 > span, .hero-cover h1 > span, .hero-directory h1 > span { display: block; }
.hero-panorama h1 .w-light, .hero-cover h1 .w-light, .hero-directory h1 .w-light { font-weight: 300; letter-spacing: -.04em; }

/* How we work: panorama and step track */
.hero-panorama__head {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2vw, 2rem); row-gap: 1.75rem;
  align-items: end; padding-block: clamp(3rem, 7vh, 5.5rem) clamp(2rem, 4.5vh, 3.25rem);
}
.hero-panorama__title { grid-column: 1 / span 7; }
.hero-panorama__intro { grid-column: 8 / -1; display: grid; justify-items: start; gap: 1.5rem; }
.hero-panorama__intro p { font-size: var(--v2-t-lede); line-height: 1.5; color: var(--v2-text-soft); }
.hero-panorama__art { margin: 0; height: clamp(14rem, 27vw, 26rem); overflow: hidden; background: var(--v2-sand); }
.hero-panorama__art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.hero-panorama__steps { position: relative; list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding-bottom: clamp(2.5rem, 6vh, 4.5rem); }
.hero-panorama__steps::before {
  content: ""; position: absolute; top: 0; left: var(--ah-gutter); right: var(--ah-gutter); height: 2px;
  background: var(--ah-emerald); transform-origin: left;
}
.hero-panorama__steps a {
  position: relative; display: grid; gap: .3rem; padding: 1.35rem 1rem 0 0; min-height: 44px;
  color: var(--ah-ink); font-size: 1.0625rem; font-weight: 650; letter-spacing: -.01em; text-decoration: none;
}
.hero-panorama__steps a::before { content: ""; position: absolute; left: 0; top: -.3rem; width: .65rem; height: .65rem; background: var(--ah-emerald); }
.hero-panorama__steps a span { font-size: clamp(1.5rem, 1.1rem + 1vw, 2.25rem); font-weight: 300; letter-spacing: -.05em; line-height: 1; color: var(--ah-link); }
@media (hover: hover) and (pointer: fine) { .hero-panorama__steps a:hover { color: var(--ah-link); } }

/* About: cover */
.hero-cover__art { margin: 0; height: clamp(24rem, 66svh, 44rem); overflow: hidden; background: var(--v2-sand); }
.hero-cover__art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.hero-cover__panel {
  position: relative; max-width: 46rem; margin-top: clamp(-15rem, -17vw, -6rem);
  padding: clamp(1.75rem, 3.5vw, 3.25rem) clamp(1.75rem, 3.5vw, 3.5rem) clamp(2.5rem, 4vw, 3.5rem) 0;
  background: var(--ah-bone);
}
.hero-cover__panel::before { content: ""; position: absolute; top: 0; bottom: 0; right: 100%; width: var(--v2-bleed); background: var(--ah-bone); }
.hero-cover .lede { margin-top: 1.5rem; color: var(--v2-text-soft); max-width: 38rem; }

/* Contact: directory */
.hero-directory {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2vw, 2rem);
  align-items: start; padding-block: clamp(2.5rem, 6vh, 4.5rem) clamp(4rem, 8vh, 6rem);
}
.hero-directory__art {
  grid-column: 1 / span 5; grid-row: 1 / span 3; position: sticky; top: 6.5rem; margin: 0;
  border-radius: var(--ah-radius-media); overflow: hidden; box-shadow: var(--v2-shadow-lg); background: var(--v2-sand);
}
.hero-directory__art img { display: block; width: 100%; height: auto; aspect-ratio: .82; object-fit: cover; object-position: 58% 60%; }
.hero-directory__head, .hero-directory__list, .contact-where { grid-column: 7 / -1; }
.hero-directory__head { padding-top: clamp(0rem, 3vh, 2rem); }
.hero-directory .lede { margin-top: 1.5rem; color: var(--v2-text-soft); max-width: 34rem; }
.hero-directory__list { list-style: none; margin-top: clamp(2.25rem, 4vw, 3.25rem); border-bottom: 1px solid var(--ah-border); }
.dir-row { position: relative; display: grid; grid-template-columns: 10.5rem minmax(0, 1fr); gap: .35rem 1.25rem; align-items: baseline; padding-block: 1.35rem 1.25rem; }
.dir-row::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--ah-border); transform-origin: left; }
.dir-row__label {
  display: inline-flex; align-items: center; gap: .65rem; font-size: .75rem; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; color: var(--ah-link);
}
.dir-row__label .colon { --c: .34rem; }
.dir-row__value {
  justify-self: start; display: inline-flex; align-items: center; gap: .75rem; min-height: 44px;
  font-size: clamp(1.5rem, 1rem + 1.5vw, 2.375rem); font-weight: 600; line-height: 1.1; letter-spacing: -.03em;
  color: var(--ah-ink); text-decoration: none;
  background-image: linear-gradient(var(--ah-emerald), var(--ah-emerald)); background-repeat: no-repeat;
  background-size: 0 2px; background-position: 0 100%; transition: background-size 260ms var(--v2-ease);
}
a.dir-row__value:not(.is-pending) { background-size: 100% 2px; }
.dir-row__value .arrow { transition: transform 180ms var(--v2-ease); }
.dir-row__value.is-pending { color: #8c8f88; cursor: not-allowed; }
.dir-row__note { grid-column: 2; font-size: .9375rem; }
.dir-row__alt { display: inline-flex; align-items: center; min-height: 44px; color: var(--ah-link); font-weight: 600; justify-self: start; }
.dir-row__note .todo-note { margin-left: 0; }
.dir-row__value .todo { font-weight: 600; }
.hero-directory .contact-where { margin-top: 1.25rem; color: var(--ah-muted); }
@media (hover: hover) and (pointer: fine) { a.dir-row__value:not(.is-pending):hover .arrow { transform: translateX(4px); } }

/* Arrival motion, one signature per page */
@media (prefers-reduced-motion: no-preference) {
  html:not(.motion-off) .hero-panorama__title, html:not(.motion-off) .hero-panorama__intro { animation: rise-in .9s var(--v2-ease) both; }
  html:not(.motion-off) .hero-panorama__intro { animation-delay: .1s; }
  html:not(.motion-off) .hero-panorama__art { animation: curtain-open 1.4s var(--v2-ease) .15s both; }
  html:not(.motion-off) .hero-panorama__steps::before { animation: line-draw 1.3s var(--v2-ease) .55s both; }
  html:not(.motion-off) .hero-panorama__steps li { animation: rise-in .7s var(--v2-ease) both; }
  html:not(.motion-off) .hero-panorama__steps li:nth-child(1) { animation-delay: .7s; }
  html:not(.motion-off) .hero-panorama__steps li:nth-child(2) { animation-delay: .85s; }
  html:not(.motion-off) .hero-panorama__steps li:nth-child(3) { animation-delay: 1s; }
  html:not(.motion-off) .hero-panorama__steps li:nth-child(4) { animation-delay: 1.15s; }
  html:not(.motion-off) .hero-panorama__steps li:nth-child(5) { animation-delay: 1.3s; }

  html:not(.motion-off) .hero-cover__art img { animation: settle-in 2.6s var(--v2-ease) both; }
  html:not(.motion-off) .hero-cover__panel { animation: panel-rise 1.1s var(--v2-ease) .25s both; }

  html:not(.motion-off) .hero-directory__art { animation: fade-lift 1.2s var(--v2-ease) both; }
  html:not(.motion-off) .hero-directory__head { animation: rise-in .9s var(--v2-ease) .1s both; }
  html:not(.motion-off) .dir-row { animation: arrive 0.8s var(--v2-ease) both; }
  html:not(.motion-off) .dir-row::before { animation: line-draw 1s var(--v2-ease) both; }
  html:not(.motion-off) .dir-row:nth-child(1), html:not(.motion-off) .dir-row:nth-child(1)::before { animation-delay: .35s; }
  html:not(.motion-off) .dir-row:nth-child(2), html:not(.motion-off) .dir-row:nth-child(2)::before { animation-delay: .5s; }
  html:not(.motion-off) .dir-row:nth-child(3), html:not(.motion-off) .dir-row:nth-child(3)::before { animation-delay: .65s; }
}
@keyframes rise-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes curtain-open { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
@keyframes line-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes settle-in { from { transform: scale(1.12); } to { transform: scale(1); } }
@keyframes panel-rise { from { opacity: 0; transform: translateY(3rem); } to { opacity: 1; transform: none; } }
@keyframes fade-lift { from { opacity: 0; transform: translateY(24px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes arrive { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }

@media (max-width: 900px) {
  .hero-panorama__title, .hero-panorama__intro { grid-column: 1 / -1; }
  .hero-panorama__art { height: clamp(13rem, 56vw, 22rem); }
  .hero-panorama__steps a { padding-right: .4rem; font-size: .875rem; }
  .hero-cover__art { height: auto; aspect-ratio: 1.2; }
  .hero-cover__art img { object-position: var(--pos-m, var(--pos, 50% 50%)); }
  .hero-cover__panel { margin-top: -2.5rem; padding: 1.75rem 1.25rem 2.25rem 0; }
  .hero-cover__panel::after { content: ""; position: absolute; top: 0; bottom: 0; left: 100%; width: var(--ah-gutter); background: var(--ah-bone); }
  .hero-directory__art { grid-column: 1 / -1; grid-row: auto; position: static; margin-top: 2rem; }
  .hero-directory__art img { aspect-ratio: 1; }
  .hero-directory__head, .hero-directory__list, .contact-where { grid-column: 1 / -1; }
  .hero-directory__head { grid-row: 1; padding-top: 0; }
  .dir-row { grid-template-columns: 1fr; }
  .dir-row__note { grid-column: 1; }
}

/* How we work: the illustrative workflow as a full-width Ink chapter. */
.handoff-band { background: var(--ah-ink); color: var(--ah-bone); padding-block: var(--v2-section); }
.handoff-band .handoff-section { margin: 0; padding: 0; border-radius: 0; background: none; }
.handoff-section h2 { font-size: clamp(2.25rem, 1.2rem + 3vw, 4rem); letter-spacing: -.042em; line-height: 1.03; }
.handoff-section > p { color: var(--v2-bone-soft); font-size: var(--v2-t-lede); line-height: 1.5; }
.handoff-step h3 { font-size: clamp(1.375rem, 1.15rem + .7vw, 1.75rem); letter-spacing: -.02em; }
.handoff-step p { color: var(--v2-bone-soft); }
.handoff-band + .faq { border-top: 0; }

/* In-page links land just below the one-row phone header (an older rule assumed a two-row header). */
@media (max-width: 760px) { html { scroll-padding-top: 5.25rem; } }

/* Contact directory: stack label over value whenever the list column is narrow (about 900 to 1300 px
   wide screens put it in half the page), so the email never spills past its row. */
.hero-directory__list { container-type: inline-size; }
.dir-row__value { min-width: 0; overflow-wrap: anywhere; }
@container (max-width: 620px) {
  .dir-row { grid-template-columns: 1fr; }
  .dir-row__note { grid-column: 1; }
}
@media (pointer: coarse) { .dir-row__alt { min-height: 44px; } }
/* Phones held sideways (short screens): About opens with its photo first, so cap the photo so the
   headline starts on the first screen. */
@media (max-width: 900px) and (max-height: 500px) and (orientation: landscape) {
  .hero-cover__art { aspect-ratio: auto; height: 58svh; }
}

/* Very wide screens: the full-width images stop at 2,000 px (centered, softly rounded) so they stay
   sharp and the How we work strip never gets thin enough to crop the agents. */
.hero-panorama__art { max-width: 2000px; margin-inline: auto; }
@media (min-width: 901px) { .hero-panorama__art { height: clamp(14rem, 27vw, 30rem); } }
.hero-cover__art { max-width: 2000px; margin-inline: auto; }
@media (min-width: 2001px) {
  .hero-panorama__art, .hero-cover__art { border-radius: var(--ah-radius-media); }
}