/* ============================================================
   H&F ADVISERS — polish layer (loaded after base.css)
   1. Spacing rhythm and padding refinement
   2. Accessibility states
   3. Team photography
   4. Case study components
   5. FAQ
   6. Full responsive behaviour
   ============================================================ */

/* ---------- 1. spacing rhythm ---------- */
:root{
  --sec-y:118px;         /* standard section padding */
  --sec-y-tight:76px;
  --stack:56px;          /* gap between a section heading and its content */
  --gutter:48px;
  --aside:300px;
}

.section{ padding:var(--sec-y) 0; }
.section--tight{ padding:var(--sec-y-tight) 0; }
.section-head{ margin-bottom:var(--stack); }
.section-head--split{ gap:var(--stack); grid-template-columns:minmax(0,1fr) 420px; }
.page-hero{ padding:112px 0 96px; }
.page-hero + .section{ padding-top:var(--sec-y); }
.hero{ padding:0; }
.hero-inner{ padding:112px 0 96px; }
.cta-band{ padding:96px 0; }
.footer-top{ padding:84px 0 64px; }
.footer-bottom{ padding:28px 0 40px; }
.grid-2,.grid-3,.grid-4,.cards,.cap-grid,.tgrid,.stats-band,.team{ gap:0; }
.cards{ gap:32px; }
.cap-grid{ gap:0; }
.section-head--split .lead, .section-head--split p{ margin-bottom:0; }

/* even, predictable vertical rhythm inside prose blocks */
.prose > * + *{ margin-top:22px; }
.prose h2{ margin-top:56px; }
.prose h2:first-child{ margin-top:0; }
.prose h3{ margin-top:40px; }
.prose p{ margin:0; }
.prose ul{ margin-top:20px; display:grid; gap:12px; }
.prose img{ margin-top:44px; }

/* ---------- 2. accessibility ---------- */
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--violet); color:#fff; padding:14px 22px; font-weight:600; border-radius:0 0 4px 0;
}
.skip-link:focus{ left:0; }
:focus-visible{ outline:2px solid var(--violet); outline-offset:3px; border-radius:2px; }
a,button,summary{ -webkit-tap-highlight-color:transparent; }
.visually-hidden{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms!important; transition-duration:.001ms!important; }
}

/* ---------- 3. breadcrumbs ---------- */
.breadcrumbs{
  font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-3);
  display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:28px;
}
.breadcrumbs a{ color:var(--on-dark-3); }
.breadcrumbs a:hover{ color:#fff; }
.breadcrumbs span[aria-hidden]{ color:var(--on-dark-4); }
.breadcrumbs [aria-current]{ color:var(--lilac); }

/* ---------- 4. team photography ---------- */
.member .photo{
  position:relative; overflow:hidden; aspect-ratio:4/5; background:var(--bg-3); padding:0;
  border:1px solid var(--rule);
}
.member .photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 22%; filter:saturate(.92); transition:transform .5s ease,filter .5s ease; }
.member:hover .photo img{ transform:scale(1.03); filter:saturate(1.02); }
.member .photo::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,rgba(8,8,12,0) 45%,rgba(8,8,12,.55) 100%);
}
.member .photo .initials{ display:none; }
.team--photos{ grid-template-columns:repeat(4,1fr); gap:34px; }
.team--photos .member{ background:transparent; }
.team--photos h4{ margin-top:24px; }

/* ---------- 5. case study hub ---------- */
.cs-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:38px; }
.cs-card{
  background:var(--bg-3); border:1px solid var(--rule); display:flex; flex-direction:column;
  transition:border-color .25s ease,transform .25s ease,background .25s ease;
}
.cs-card:hover{ border-color:var(--rule-strong); background:var(--bg-4); transform:translateY(-3px); }
.cs-card .shot{ overflow:hidden; border-bottom:1px solid var(--rule); position:relative; }
.cs-card .shot img{ width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; display:block; transition:transform .6s ease; }
.cs-card:hover .shot img{ transform:scale(1.03); }
.cs-card .shot .client{
  position:absolute; left:20px; top:20px; background:rgba(8,8,12,.8); backdrop-filter:blur(6px);
  color:#fff; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; padding:8px 13px;
}
.cs-card .body{ padding:32px 32px 34px; display:flex; flex-direction:column; flex:1; }
.cs-card .body h3{ font-size:22px; line-height:1.25; margin-bottom:14px; }
.cs-card .body p{ font-size:15px; color:var(--on-dark-2); margin:0 0 24px; }
.cs-card .body .more{ margin-top:auto; font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--lilac); }
.cs-card .body .more::after{ content:" →"; transition:margin .2s ease; }
.cs-card:hover .body .more::after{ margin-left:4px; }

/* ---------- 6. case study detail ---------- */
.cs-hero{ padding:96px 0 64px; border-bottom:1px solid var(--rule); }
.cs-hero h1{ max-width:22ch; }
.cs-hero .lead{ max-width:62ch; margin-top:26px; margin-bottom:0; }
.cs-shot{ padding:0; }
.cs-shot img{ width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-bottom:1px solid var(--rule); }
.cs-layout{ display:grid; grid-template-columns:var(--aside) minmax(0,1fr); gap:80px; align-items:start; }
.cs-aside{ position:sticky; top:132px; border-top:1px solid var(--rule); padding-top:30px; }
.cs-aside h5{
  font-family:var(--font-text); font-size:11.5px; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--lilac-dim); margin:0 0 12px;
}
.cs-aside .grp{ margin-bottom:30px; }
.cs-aside .grp:last-of-type{ margin-bottom:34px; }
.cs-aside p, .cs-aside li{ font-size:15px; color:var(--on-dark-2); margin:0; }
.cs-aside ul{ display:grid; gap:9px; }
.cs-aside li{ border-left:2px solid var(--violet); padding-left:12px; }
.cs-main{ max-width:74ch; }
.cs-main h2{ font-size:30px; margin-top:56px; }
.cs-main h2:first-child{ margin-top:0; }
.cs-main p{ color:var(--on-dark-2); }
.cs-main .kicker{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--lilac); margin:0 0 16px; }
.deliv-grid{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--rule); }
.deliv{ padding:40px 34px 44px; border-right:1px solid var(--rule); }
.deliv:last-child{ border-right:0; }
.deliv .n{ font-size:12px; letter-spacing:.16em; color:var(--lilac-dim); }
.deliv h3{ font-size:20px; margin:18px 0 14px; }
.deliv .kick{ font-size:14px; font-weight:600; color:#fff; margin:0 0 12px; }
.deliv p{ font-size:14.5px; color:var(--on-dark-3); margin:0; }
.related{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.related .r{ border-top:1px solid var(--rule); padding-top:24px; display:block; }
.related .r img{ width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; margin-bottom:20px; opacity:.9; transition:opacity .25s ease; }
.related .r:hover img{ opacity:1; }
.related .r .who{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--lilac-dim); margin-bottom:10px; }
.related .r h4{ font-size:17px; line-height:1.3; }

/* ---------- 7. FAQ ---------- */
.faq{ border-top:1px solid var(--rule); }
.faq details{ border-bottom:1px solid var(--rule); }
.faq summary{
  cursor:pointer; list-style:none; padding:26px 0; display:flex; justify-content:space-between;
  gap:28px; align-items:flex-start; font-family:var(--font-display); font-size:19px; font-weight:600; color:#fff;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--lilac); font-size:22px; line-height:1; flex:none; }
.faq details[open] summary::after{ content:"–"; }
.faq summary:hover{ color:var(--lilac); }
.faq .a{ padding:0 0 28px; color:var(--on-dark-2); max-width:80ch; }
.faq .a p:last-child{ margin-bottom:0; }

/* ---------- 8. footer link lists ---------- */
.footer-top h5{ margin-bottom:22px; }
.footer-top ul{ display:grid; gap:12px; }
.footer-top a:hover{ color:#fff; }

/* ============================================================
   9. RESPONSIVE
   ============================================================ */
@media (max-width:1180px){
  :root{ --sec-y:96px; --sec-y-tight:64px; --stack:44px; --gutter:36px; --aside:260px; }
  .display{ font-size:64px; }
  .h1{ font-size:46px; }
  .h2{ font-size:34px; }
  .hero-inner{ padding:88px 0 76px; }
  .page-hero{ padding:88px 0 72px; }
  .cs-layout{ gap:56px; }
  .team--photos{ grid-template-columns:repeat(3,1fr); }
  .cs-grid{ gap:30px; }
  .related{ grid-template-columns:repeat(3,1fr); gap:24px; }
}

@media (max-width:980px){
  :root{ --sec-y:80px; --sec-y-tight:56px; --stack:38px; --gutter:28px; }
  body{ font-size:16.5px; }
  .h1{ font-size:40px; }
  .h2{ font-size:30px; }
  .h3{ font-size:22px; }
  .display{ font-size:52px; }
  .lead{ font-size:18px; }

  /* header: nav becomes a scrollable row, mega panel becomes an inline list */
  .header .container{ height:auto; padding-top:14px; padding-bottom:14px; flex-wrap:wrap; gap:14px 24px; }
  .header .logo{ order:1; }
  .header-cta{ order:2; margin-left:auto; }
  .nav{ order:3; width:100%; gap:24px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
  .nav::-webkit-scrollbar{ display:none; }
  .mega{ position:static; display:none; }
  .header.mega-open .mega, .header:has(.nav-item--services:hover) .mega{ display:block; }
  .mega-inner{ grid-template-columns:1fr; gap:34px; padding:34px var(--gutter) 40px; }
  .mega-promo{ padding:28px 26px; }
  .cs-layout{ grid-template-columns:1fr; gap:40px; }
  .cs-aside{ position:static; }
  .deliv-grid{ grid-template-columns:1fr; }
  .deliv{ border-right:0; border-bottom:1px solid var(--rule); }
  .deliv:last-child{ border-bottom:0; }
  .cs-grid{ grid-template-columns:1fr; }
  .related{ grid-template-columns:1fr 1fr; }
  .section-head--split{ grid-template-columns:1fr; gap:26px; align-items:start; }
  .section-head--split .h2{ max-width:none; }
  .cols-split, .featured-post, .grid-2, .grid-3, .grid-4{ grid-template-columns:1fr!important; gap:40px; }
  .grid-3 .swatch-label, .grid-4 > div{ border-right:0!important; }
  .team--photos{ grid-template-columns:1fr 1fr; }
  .cards{ grid-template-columns:1fr 1fr; }
  .post-grid--masonry{ column-count:2; }
  .logos{ grid-template-columns:repeat(2,1fr)!important; }
  .stats-band, .tgrid, .projects{ grid-template-columns:1fr 1fr; }
  .footer-top{ grid-template-columns:1fr 1fr; gap:44px; }
  .hero-stats{ grid-template-columns:1fr 1fr; }
}

@media (max-width:680px){
  :root{ --sec-y:64px; --sec-y-tight:48px; --stack:30px; --gutter:20px; }
  body{ font-size:16px; line-height:1.6; }
  .display{ font-size:38px; }
  .h1{ font-size:31px; letter-spacing:-.02em; }
  .h2{ font-size:25px; }
  .h3{ font-size:20px; }
  .h4{ font-size:17px; }
  .lead{ font-size:17px; }
  .section-head{ margin-bottom:30px; }
  .btn{ padding:13px 22px; font-size:14.5px; }
  .btn-row{ gap:10px; }
  .hero-inner{ padding:64px 0 56px; }
  .page-hero{ padding:64px 0 52px; }
  .cs-hero{ padding:64px 0 44px; }
  .cta-band{ padding:64px 0; }
  .cards, .team--photos, .related, .stats-band, .tgrid, .projects, .footer-top{ grid-template-columns:1fr; }
  .post-grid--masonry{ column-count:1; }
  .logos{ grid-template-columns:repeat(2,1fr)!important; }
  .cs-main h2{ font-size:24px; margin-top:40px; }
  .deliv{ padding:30px 24px 34px; }
  .cs-card .body{ padding:24px 22px 26px; }
  .mega-list{ grid-template-columns:1fr; }
  .footer-bottom{ flex-direction:column; gap:14px; align-items:flex-start; }
  .topbar .container{ height:auto; padding:10px 0; flex-direction:column; gap:6px; align-items:flex-start; }
  .faq summary{ font-size:17px; padding:22px 0; }
}

/* ============================================================
   10. LAYOUT CORRECTIONS
   .container.hero-inner / .container.inner had their horizontal
   padding overwritten by the component rule, so the gutters are
   restored here. Grids that carry an inline column count are
   collapsed with !important at each breakpoint.
   ============================================================ */

/* never distort an image: box follows the file's own ratio */
img{ max-width:100%; height:auto; }

.hero-inner, .page-hero .inner, .cs-hero .inner{
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}
.page-hero{ padding:0!important; }
.page-hero .inner{ padding-top:96px; padding-bottom:84px; }

.cta-band{ position:relative; overflow:hidden; }
.cta-inner{
  position:relative; padding:96px 0; display:grid;
  grid-template-columns:minmax(0,1fr) 420px; gap:70px; align-items:center;
}
.cta-inner .h2{ margin:0; }
.cta-inner .btn-row{ justify-content:flex-end; }

/* case-study imagery keeps its native ratio — no crop, no stretch */
.cs-card .shot img, .cs-shot img, .related .r img{
  width:100%; height:auto; aspect-ratio:auto; display:block;
}
.cs-card .shot{ aspect-ratio:16/9; }
.cs-shot{ aspect-ratio:16/9; }

html, body{ overflow-x:hidden; }

@media (max-width:1180px){
  .cta-inner{ grid-template-columns:minmax(0,1fr) 340px; gap:44px; padding:84px 0; }
  .page-hero .inner{ padding-top:80px; padding-bottom:70px; }
  .focus, .cap-grid, .stats-band, .hero-stats, .logos, .cs-grid, .related, .deliv-grid{
    grid-template-columns:1fr 1fr!important;
  }
  .tgrid, .projects, .grid-2, .grid-3, .grid-4{ grid-template-columns:1fr 1fr!important; }
  .footer-top{ grid-template-columns:1fr 1fr!important; }
}

@media (max-width:980px){
  .page-hero .inner{ padding-top:70px; padding-bottom:60px; }
  .cta-inner{ grid-template-columns:1fr!important; gap:32px; padding:70px 0; }
  .cta-inner .btn-row{ justify-content:flex-start; }
  .focus, .cap-grid, .logos{ grid-template-columns:1fr 1fr!important; }
  .cs-grid, .related, .deliv-grid, .tgrid, .projects, .grid-2, .grid-3, .grid-4, .stats-band, .hero-stats{
    grid-template-columns:1fr!important;
  }
}

@media (max-width:680px){
  .page-hero .inner{ padding-top:52px; padding-bottom:44px; }
  .cta-inner{ padding:56px 0; }
  .focus, .cap-grid, .stats-band, .hero-stats, .tgrid, .projects, .grid-2, .grid-3, .grid-4,
  .cs-grid, .related, .footer-top, .cards, .team--photos, .deliv-grid{
    grid-template-columns:1fr!important;
  }
  .logos{ grid-template-columns:repeat(2,1fr)!important; }
}

/* mobile: fit all five nav items without horizontal scrolling */
@media (max-width:680px){
  .nav{ gap:10px; }
  .nav a{ font-size:11px; letter-spacing:.04em; }
  .header .container{ gap:12px; }
  .header-cta .btn{ padding:11px 18px; font-size:13.5px; }
}

/* ============================================================
   11. RICH ARTICLE CONTENT
   Articles imported from the live site carry tables, highlighted
   spans, text colours, figures and code blocks. These rules keep
   every one of them legible on the dark theme.
   ============================================================ */

.table-scroll{ overflow-x:auto; margin:36px 0; -webkit-overflow-scrolling:touch; }
.post-body table{ width:100%; border-collapse:collapse; margin:0; font-size:16.5px; min-width:520px; }
.post-body th, .post-body td{
  border:1px solid var(--rule-strong); padding:13px 16px; text-align:left; vertical-align:top;
  line-height:1.6; }
.post-body th{ font-weight:700; }
.post-body td p, .post-body th p{ margin:0; }

/* highlighted text — the colour comes from the article itself */
.post-body mark{ padding:2px 5px; border-radius:2px; }

.post-body h4{ font-size:18px; margin:32px 0 12px; }
.post-body u{ text-decoration:underline; text-underline-offset:3px; }
.post-body s{ opacity:.75; }

.post-body figure{ margin:36px 0; }
.post-body figure img{ margin:0; }
.post-body figcaption{ font-size:13.5px; color:var(--on-dark-3); margin-top:12px; line-height:1.6; }

.post-body pre{
  background:#08080C; border:1px solid var(--rule); padding:20px 22px; overflow-x:auto;
  font-size:14.5px; line-height:1.65; margin:32px 0; }
.post-body pre code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; color:#D8D5E8; }

.post-body hr{ border:0; border-top:1px solid var(--rule); margin:46px 0; }
.post-body img{ border-radius:0; }
.post-body table th:first-child, .post-body table td:first-child{ padding-left:18px; }

/* ---------- 11b. writer block and content columns ---------- */
.rich-cols, .writer-card{
  display:grid; grid-template-columns:300px minmax(0,1fr); gap:40px;
  align-items:start; margin:40px 0;
}
.writer-card{
  border-top:1px solid var(--rule); margin-top:56px; padding-top:46px;
}
.rich-cols__media img, .writer-card__media img{ width:100%; height:auto; display:block; }
.rich-cols__body p, .writer-card__body p{
  font-size:16.5px; line-height:1.72; color:var(--on-dark-2); margin:0 0 1.05em;
}
.writer-card__body p:first-child{ margin-top:0; }
.writer-card__body strong{ color:#fff; }
.rich-cols__body a.rich-cta, .writer-card__body a.rich-cta{ margin-top:10px; }
.post-body a.rich-cta{ text-decoration:none; }
@media (max-width:760px){
  .rich-cols, .writer-card{ grid-template-columns:1fr; gap:26px; }
  .rich-cols__media, .writer-card__media{ max-width:320px; }
}

/* ---------- 12b. achievements band centred ---------- */
/* the standalone band (home) centres its eyebrow; a split head keeps it left */
.section--purple > .container > .eyebrow{ justify-content:center; text-align:center; }
.section--purple .stats-band{ text-align:center; }
.section--purple .stats-band .stat{ padding:10px 30px; }
.section--purple .stats-band .stat:first-child{ padding-left:30px; }
.section--purple .stats-band .num{ text-align:center; }
.section--purple .stats-band .lbl{ margin-left:auto; margin-right:auto; }

/* ---------- 12c. footer restructured (Kong-style) ---------- */
.footer{ padding:72px 0 0; }
.footer-cols{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:44px 48px; padding-bottom:52px; border-bottom:1px solid var(--rule);
}
.footer h5{ margin:0 0 18px; }
.footer li{ margin-bottom:10px; }
.footer li:last-child{ margin-bottom:0; }
.footer-brand{
  display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
  gap:48px; align-items:start; padding:44px 0; border-bottom:1px solid var(--rule);
}
.footer-brand__main{ display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.footer-brand__main p{ margin:0; font-size:14.5px; line-height:1.65; color:var(--on-dark-2); max-width:54ch; }
.footer-meta{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:10px 20px; font-size:14.5px; color:var(--on-dark-2); }
.footer-meta dt{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--lilac-dim); padding-top:4px; }
.footer-meta dd{ margin:0; }
@media (max-width:980px){
  .footer-cols{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px){
  .footer-cols{ grid-template-columns:1fr; gap:34px; }
  .footer-brand{ grid-template-columns:1fr; gap:32px; }
}
/* ============================================================
   14. LEAD FORM STATES (12 Oct)
   Company-email validation feedback and email submission status,
   shared by the home page and contact page forms.
   ============================================================ */
.field-note{
  display:block; margin-top:8px; font-size:12.5px; line-height:1.5;
  color:var(--on-dark-3, rgba(255,255,255,.55));
}
.field-error{
  display:block; margin-top:8px; font-size:12.5px; line-height:1.5;
  color:#ff9aa6; font-weight:600;
}
.field-error:empty{ display:none; }
.box[aria-invalid="true"]{
  border-color:#ff9aa6 !important;
  box-shadow:0 0 0 3px rgba(255,154,166,.14);
}
.form-status{
  margin-top:22px; padding:15px 19px; border-radius:10px; font-size:14.5px; line-height:1.6;
  border:1px solid var(--rule); background:rgba(255,255,255,.03);
  color:var(--on-dark-2, rgba(255,255,255,.82));
}
.form-status[data-state="success"]{
  border-color:rgba(126,231,170,.45); background:rgba(126,231,170,.10); color:#cdf5df;
}
.form-status[data-state="error"]{
  border-color:rgba(255,154,166,.45); background:rgba(255,154,166,.10); color:#ffd4d9;
}
.form-status[hidden]{ display:none; }
button.btn[disabled]{ opacity:.6; cursor:progress; }

/* ---------- 14. form inputs: real sizing, padding and focus ---------- */
/* .field .box in base.css set only border/background/height, so the browser
   default (13px Arial, ~1px padding) leaked through and typed text rendered
   tiny and jammed against the box edge. */
.form-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.form-grid > .field{ min-width:0; }

.field .box{
  width:100%;
  min-width:0;
  padding:0 18px;
  font-family:var(--font-text);
  font-size:16px;
  line-height:1.4;
  color:#fff;
  background:var(--bg-3);
  border:1px solid var(--rule);
  border-radius:10px;
  box-sizing:border-box;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.field .box::placeholder{ color:var(--on-dark-4); }
.field .box:hover{ border-color:var(--rule-strong); }
.field .box:focus{
  outline:none;
  border-color:var(--lilac);
  background:var(--bg-4);
  box-shadow:0 0 0 3px rgba(124,77,255,.22);
}
.field .box--tall{
  height:auto;
  min-height:150px;
  padding:15px 18px;
  line-height:1.6;
  resize:vertical;
}
.field .box--select{ padding:0 18px; border-radius:10px; }

@media (max-width:620px){
  .form-grid{ grid-template-columns:minmax(0,1fr); }
  .field .box--tall{ min-height:130px; }
}

/* ---------- 15. section heads: full-width heading, description beneath ---------- */
/* .section-head--split capped .h2 at 18ch, which squeezed long headings into
   five narrow lines. Headings now span the full width (one or two lines) and
   the supporting copy sits underneath them. */
.section-head--split{
  display:block;
  grid-template-columns:none;
  gap:0;
  align-items:initial;
}
.section-head--split .h2{
  max-width:none;
  text-wrap:balance;
}
.section-head--split > div + div{
  margin-top:26px;
  max-width:74ch;
}
.section-head--split .btn--link{ margin-top:18px; }

/* keep the mobile stacking sane now the grid is gone */
@media (max-width:860px){
  .section-head--split{ display:block; }
  .section-head--split > div + div{ margin-top:20px; max-width:none; }
}

/* ---------- 16. insight cards: uniform image height so the text aligns ---------- */
/* .thumb--img inherited aspect-ratio:auto + img{height:auto}, so every card
   took its image's natural height and the dates/titles below started at a
   different y on each card. The 3-up home grid now uses a fixed 16:9 frame
   with object-fit:cover — cropped to fill, never stretched or squashed.
   The blog archive (.post-grid--masonry) keeps natural ratios deliberately. */
.cards .card .thumb--img{
  aspect-ratio:16/9;
  background:var(--bg-4);
}
.cards .card .thumb--img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

/* Netlify Forms honeypot — must stay in the DOM, never visible */
.hp-field{ display:none !important; }

/* ---------- 17. testimonials: all nine, three featured ---------- */
.tgrid .t--featured{
  background:linear-gradient(180deg, rgba(124,77,255,.10), rgba(16,16,23,0) 62%), var(--bg-3);
  border-top:2px solid var(--violet);
}
.tgrid .t--featured p{ font-size:19px; }
.tgrid .t--featured .who b{ color:var(--lilac); }

/* ---------- 18. booking page ---------- */
.book-layout{ display:grid; grid-template-columns:380px 1fr; gap:56px; align-items:start; }
.book-side{ position:sticky; top:108px; }
.book-meta{ margin-top:14px; font-size:13.5px; color:var(--on-dark-3); min-height:18px; }
.book-facts{ list-style:none; padding:0; margin:26px 0 0; }
.book-facts li{ font-size:14px; color:var(--on-dark-3); padding:13px 0; border-bottom:1px solid var(--rule); line-height:1.5; }
.book-facts strong{ display:block; color:#fff; font-size:12px; letter-spacing:.09em; text-transform:uppercase; margin-bottom:5px; font-weight:600; }
.cal-shell{ border:1px solid var(--rule); background:var(--bg-3); min-height:660px; border-radius:2px; overflow:hidden; }
.cal-shell iframe{ width:100%; height:700px; border:0; display:block; }
.cal-empty{ padding:72px 32px; text-align:center; color:var(--on-dark-3); font-size:15px; }
@media (max-width:980px){
  .book-layout{ grid-template-columns:1fr; gap:34px; }
  .book-side{ position:static; }
  .cal-shell iframe{ height:620px; }
  .cal-shell{ min-height:0; }
}

/* ---------- 20. insights category filter ---------- */
.cat-filter{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:40px; }
.cat-filter a{
  display:inline-flex; align-items:center; gap:8px; padding:9px 15px; font-size:13.5px;
  border:1px solid var(--rule); border-radius:100px; color:var(--on-dark-3); transition:.18s;
}
.cat-filter a:hover{ color:#fff; border-color:var(--violet); }
.cat-filter a.is-active{ background:var(--violet); border-color:var(--violet); color:#fff; font-weight:600; }
.cat-filter a span{ font-size:11.5px; opacity:.72; }

/* ---------- 19. article category rail (sticky) ---------- */
.post-layout{ display:grid; grid-template-columns:minmax(0,760px) 258px; gap:68px; justify-content:center; align-items:start; }
.post-rail{ position:sticky; top:104px; }
.rail-block{ border-top:1px solid var(--rule); padding:20px 0 26px; }
.rail-block h4{ font-size:11.5px; letter-spacing:.11em; text-transform:uppercase; color:var(--lilac); margin:0 0 14px; font-weight:600; }
.rail-list{ list-style:none; margin:0; padding:0; }
.rail-list li{ border-bottom:1px solid rgba(255,255,255,.055); }
.rail-list a{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 0; font-size:14.5px; color:var(--on-dark-3); transition:.18s; }
.rail-list a:hover{ color:#fff; }
.rail-list .is-current a{ color:#fff; font-weight:600; }
.rail-list span{ color:var(--on-dark-4); font-size:12.5px; margin-left:auto; }
.rail-note{ font-size:14px; line-height:1.6; color:var(--on-dark-3); margin:0 0 16px; }
@media (max-width:1100px){
  .post-layout{ grid-template-columns:minmax(0,1fr); gap:40px; }
  .post-rail{ position:static; }
}

/* ---------- 21. booking: simplified direct-link layout ---------- */
.book-main .btn--lg{ margin-top:6px; }
.book-main .rule{ margin:30px 0 20px; }
@media (max-width:980px){ .book-main .btn--lg{ width:100%; justify-content:center; } }


/* ---------- 22. booking calendar ---------- */
.book-form{ margin:0; }
.hp{ position:absolute; left:-9999px; }
.bk-cal-shell{ border:1px solid var(--rule); background:var(--bg-3); padding:22px 24px 18px; margin-bottom:26px; }
.bk-cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.bk-cal-head span{ font-size:15px; font-weight:600; color:#fff; letter-spacing:.01em; }
.bk-nav{ width:34px; height:34px; border:1px solid var(--rule); background:transparent; color:var(--on-dark-3);
  font-size:19px; line-height:1; cursor:pointer; border-radius:2px; transition:.18s; }
.bk-nav:hover:not(:disabled){ border-color:var(--violet); color:#fff; }
.bk-nav:disabled{ opacity:.3; cursor:not-allowed; }
.bk-cal{ display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }
.bk-dow{ font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--on-dark-4);
  text-align:center; padding-bottom:8px; }
.bk-day{ aspect-ratio:1/1; border:1px solid transparent; background:transparent; color:var(--on-dark-2);
  font-size:14.5px; font-family:inherit; cursor:pointer; border-radius:2px; transition:.15s; }
.bk-day:hover:not(.is-disabled){ border-color:var(--violet); color:#fff; }
.bk-day.is-disabled{ color:var(--on-dark-4); opacity:.34; cursor:not-allowed; }
.bk-day.is-empty{ visibility:hidden; }
.bk-day.is-selected{ background:var(--violet); border-color:var(--violet); color:#fff; font-weight:600; }
.bk-hint{ font-size:12.5px; color:var(--on-dark-4); margin:14px 0 0; }
.bk-slots{ margin-bottom:34px; }
.bk-sub{ font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--lilac);
  margin:0 0 14px; font-weight:600; }
.bk-slot-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:9px; }
.bk-slot{ padding:11px 8px; border:1px solid var(--rule); background:transparent; color:var(--on-dark-2);
  font-family:inherit; font-size:14.5px; cursor:pointer; border-radius:2px; transition:.15s; }
.bk-slot:hover{ border-color:var(--violet); color:#fff; }
.bk-slot.is-selected{ background:var(--violet); border-color:var(--violet); color:#fff; font-weight:600; }
.bk-summary{ font-size:14.5px; color:var(--on-dark-3); margin:22px 0 16px; min-height:21px; }
.bk-summary.is-ready{ color:#fff; font-weight:600; }
.book-main .btn--lg{ margin-bottom:12px; }
@media (max-width:980px){
  .bk-day{ font-size:13.5px; }
  .bk-cal-shell{ padding:18px 16px 14px; }
  .book-main .btn--lg{ width:100%; justify-content:center; }
}