/* services.html: small page additions on top of site.css (same tokens only) */

/* full-width hero plate: give the 21:9 crop more height on phones */
@media (max-width: 700px) { .plate .frame__img.ratio-21x9 { aspect-ratio: 4 / 3; } }

/* "What sets us apart": four hairline columns, 2 x 2 (no boxes) */
.apart { display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap); }
.apart__item { position: relative; display: grid; gap: 0.75rem; align-content: start; padding: 1.5rem 0 0; background: transparent; border: 0; border-top: 1px solid var(--rule); }
.apart__num { font-family: var(--font-heading); font-style: italic; font-size: clamp(2.5rem, 2rem + 2vw, 3.75rem); line-height: 0.9; color: var(--accent-text); opacity: 0.9; }
.apart__item h3 { font-size: var(--fs-h4); max-width: 22ch; }
.apart__item p { color: var(--ink-soft); max-width: 52ch; }
@media (max-width: 760px) { .apart { grid-template-columns: 1fr; } }

/* program tabs: editorial index style */
.tabs--lg .tabs__list { gap: clamp(1rem, 0.5rem + 3vw, 3.5rem); }
.tabs--lg .tabs__tab { display: inline-flex; align-items: baseline; gap: 0.7rem; padding: 1rem 0.25rem 1.1rem 0; font-family: var(--font-heading); font-size: clamp(1.15rem, 1rem + 0.8vw, 1.6rem); letter-spacing: -0.01em; text-transform: none; }
.tabs--lg .tabs__tab .numeral { font-size: 0.8rem; letter-spacing: 0.08em; }
@media (max-width: 640px) {
  .tabs--lg .tabs__list { flex-direction: column; align-items: stretch; gap: 0; border-bottom: 0; overflow: visible; }
  .tabs--lg .tabs__tab { padding: 0.9rem 0; margin-bottom: 0; border-bottom: 1px solid var(--rule); white-space: normal; }
  .tabs--lg .tabs__tab.is-active { border-color: var(--accent-text); }
}
/* hash landings (services.html#strategy-sessions) clear the sticky header and keep the tab index in view;
   a focus ring around the whole panel region carries no information (the tab buttons keep theirs) */
.tabs { scroll-margin-top: 6rem; }
.tabs__panel { scroll-margin-top: 8rem; }
.tabs__panel:focus { outline: 0; }
.program__tile { max-width: 320px; }
.tabs .faq__panel .prose { padding-top: 0.25rem; }

/* keep the chapter numeral on one line */
.chapter .numeral { white-space: nowrap; }

/* the finder eyebrow already reads "Question 1 of 3"; the short progress stroke above it read as a line pointer */
.finder__bar { display: none; }