/* Light editorial footer. The directory below is deliberately quiet and
   highly structured. */
.site-footer {
  --footer-gutter: clamp(2rem, 5.4vw, 7rem);
  --footer-paper: #f6f3ef;
  --footer-ink: #17141d;
  --footer-muted: #706b75;
  --footer-line: rgba(28, 23, 34, .16);
  --footer-accent: #66369d;
  position: relative;
  z-index: 4;
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  background: var(--footer-paper);
  color: var(--footer-ink);
  font-family: var(--font-ui);
}
.site-footer::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    radial-gradient(ellipse at 50% 54%, rgba(95, 60, 145, .12), transparent 22%),
    radial-gradient(ellipse at 50% 63%, rgba(36, 26, 46, .09), transparent 15%);
  pointer-events: none;
}

.site-footer__panel {
  position: absolute;
  z-index: 2;
  inset: 0;
  padding: 0 var(--footer-gutter);
  pointer-events: none;
}

.site-footer__topline {
  position: absolute;
  top: clamp(2.25rem, 5.5svh, 5rem);
  right: var(--footer-gutter);
  left: var(--footer-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgba(23, 20, 29, .58);
  font-size: .53rem;
  font-weight: var(--w-bold);
  letter-spacing: .42em;
  text-transform: uppercase;
}
.site-footer__topline span { display: flex; align-items: center; gap: 1.15rem; }
.site-footer__topline i { width: 1.5rem; height: 1px; background: rgba(23, 20, 29, .42); }
.site-footer__topline b { color: rgba(95, 60, 145, .62); font-weight: inherit; }

.site-footer__primary {
  position: absolute;
  top: 17svh;
  right: var(--footer-gutter);
  left: var(--footer-gutter);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 2.5rem);
}
.site-footer__intro { grid-column: 1 / span 4; padding-top: 3svh; }
.site-footer__intro h2 {
  display: grid;
  margin: 0;
  font-size: min(clamp(3.1rem, 5.4vw, 7rem), 9svh);
  font-weight: var(--w-regular);
  line-height: .83;
  letter-spacing: -.065em;
}
.site-footer__intro h2 span:last-child { padding-left: .6em; }
.site-footer__intro h2 em { color: #77509b; font-style: normal; }
.site-footer__intro > p {
  max-width: 29rem;
  margin: clamp(1.4rem, 3svh, 2.6rem) 0 0;
  color: var(--footer-muted);
  font-size: clamp(.95rem, 1.15vw, 1.22rem);
  line-height: 1.43;
}

/* Original extruded mark and its scroll-driven docking into the footer.
   The canvas belongs to this shared footer on every route. */
.site-footer .site-footer__mark-3d {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block !important;
  visibility: visible !important;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0;
  filter: brightness(1.05) saturate(.82) contrast(1.08);
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: 50% 50%;
  transition: opacity .8s ease, transform 1.9s cubic-bezier(.22, 1, .36, 1), filter 1.2s ease;
}
.site-footer.is-in-view .site-footer__mark-3d { opacity: .96; }
.site-footer.is-logo-docked .site-footer__mark-3d {
  opacity: 1;
  filter: brightness(1.06) saturate(.72) contrast(1.1);
  transform: translate3d(-13vw, -7svh, 0) scale(.6);
}
.site-footer .site-footer__logo-slot {
  position: absolute;
  top: 100%;
  left: 51%;
  width: calc(min(32vh, 18rem) * 120 / 195.88);
  height: min(32vh, 18rem);
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.site-footer .site-footer__logo-artwork {
  display: block;
  width: 100%;
  height: 100%;
  color: #5f3c91;
  animation: tlh-footer-mark-swing 7s ease-in-out infinite alternate;
}
.site-footer[data-footer-logo-state="live"] .site-footer__logo-artwork { display: none !important; }
.site-footer[data-footer-logo-state="fallback"] .site-footer__mark-3d { opacity: 0 !important; }
@keyframes tlh-footer-mark-swing {
  from { transform: rotateY(-32deg) rotateX(6deg); }
  to { transform: rotateY(32deg) rotateX(6deg); }
}
@media (max-width: 899px) {
  .site-footer .site-footer__logo-slot {
    position: relative;
    top: auto;
    left: auto;
    grid-column: 1;
    grid-row: 2;
    justify-self: center;
    width: 100%;
    height: 15rem;
    transform: none;
    display: grid;
    place-items: center;
  }
  .site-footer .site-footer__logo-artwork { width: 7.35rem; height: 12rem; }
  .site-footer .site-footer__logo-slot .site-footer__mark-3d {
    inset: 0;
    width: 100%;
    height: 100%;
    transform: none;
    filter: none;
  }
  .site-footer .site-footer__intro { grid-row: 1; }
  .site-footer .site-footer__action { grid-row: 3; }
}
@media (prefers-reduced-motion: reduce) {
  .site-footer .site-footer__mark-3d { transition: none; }
  .site-footer .site-footer__logo-artwork { animation: none; }
}

.site-footer__action {
  grid-column: 9 / -1;
  align-self: center;
  padding-top: clamp(3rem, 9svh, 7rem);
}
.site-footer__action-rule {
  display: block;
  width: 2rem;
  height: 1px;
  margin-bottom: 1.5rem;
  background: rgba(23, 20, 29, .4);
}
.site-footer__action > p {
  margin: 0 0 clamp(1.25rem, 3svh, 2.25rem);
  color: rgba(23, 20, 29, .7);
  font-size: .6rem;
  font-weight: var(--w-bold);
  line-height: 1.55;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.site-footer__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.site-footer__button {
  display: flex;
  min-width: 0;
  min-height: clamp(3.2rem, 5.5svh, 4.4rem);
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0 clamp(1rem, 1.5vw, 1.5rem);
  border: 1px solid var(--footer-accent);
  border-radius: .55rem;
  background: var(--footer-accent);
  color: #fff;
  font-size: clamp(.67rem, .7vw, .78rem);
  text-decoration: none;
  transition: color .3s ease, background .3s ease, transform .3s cubic-bezier(.22, 1, .36, 1);
  pointer-events: auto;
}
.site-footer__button i { font-size: 1rem; font-style: normal; }
.site-footer__button:hover { background: #7a4ab0; transform: translateY(-2px); }
.site-footer__button--secondary {
  border-color: rgba(23, 20, 29, .13);
  background: rgba(23, 20, 29, .035);
  color: var(--footer-ink);
}
.site-footer__button--secondary:hover { background: rgba(95, 60, 145, .1); }
.site-footer__button:focus-visible { outline: 2px solid #7a4ab0; outline-offset: 3px; }
.site-footer__action-note {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: clamp(1.25rem, 3svh, 2rem);
  color: rgba(23, 20, 29, .42);
  font-size: .52rem;
  font-weight: var(--w-bold);
  letter-spacing: .24em;
  text-transform: uppercase;
}
.site-footer__action-note::before { content: ""; width: 1.75rem; height: 1px; background: var(--footer-line); }

.site-footer__directory {
  position: absolute;
  top: 61.5svh;
  right: var(--footer-gutter);
  left: var(--footer-gutter);
  display: grid;
  grid-template-columns: 1.2fr .9fr 1.05fr .9fr 1.2fr;
  gap: clamp(1.5rem, 4vw, 5rem);
  padding: clamp(1.5rem, 3.5svh, 3rem) 0;
  border-top: 1px solid var(--footer-line);
  pointer-events: auto;
}
.site-footer__directory section,
.site-footer__directory nav { display: grid; align-content: start; gap: .55rem; }
.site-footer__directory strong {
  margin-bottom: .45rem;
  font-size: clamp(.68rem, .76vw, .82rem);
  font-weight: var(--w-semibold);
}
.site-footer__directory p,
.site-footer__directory a,
.site-footer__directory span {
  margin: 0;
  color: #77727b;
  font-size: clamp(.67rem, .72vw, .77rem);
  line-height: 1.38;
  text-decoration: none;
}
.site-footer__directory a { width: max-content; max-width: 100%; transition: color .2s ease; }
.site-footer__directory a:hover { color: var(--footer-accent); }
.site-footer__socials { display: flex; gap: .8rem; margin-top: 1rem; }
.site-footer__socials a { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border: 1px solid rgba(23, 20, 29, .2); border-radius: 50%; color: var(--footer-ink); font-size: 1rem; font-weight: 700; transition: color .2s ease, background .2s ease, border-color .2s ease; }
.site-footer__socials a:hover { background: var(--footer-accent); border-color: var(--footer-accent); color: #fff; }
.site-footer__socials svg { display: block; width: 1.25rem; height: 1.25rem; fill: currentColor; }
.site-footer__socials a { color: var(--footer-ink); font-size: .95rem; font-weight: var(--w-semibold); }
.site-footer__contact { padding-left: clamp(1rem, 3vw, 3.5rem); border-left: 1px solid var(--footer-line); }

.site-footer__base {
  position: absolute;
  right: var(--footer-gutter);
  bottom: 0;
  left: var(--footer-gutter);
  display: flex;
  min-height: 9svh;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  border-top: 1px solid var(--footer-line);
  color: var(--footer-muted);
  font-size: .55rem;
  pointer-events: auto;
}
.site-footer__base > div { display: flex; align-items: center; gap: 1.5rem; }
.site-footer__base i { width: 1.75rem; height: 1px; background: rgba(23, 20, 29, .28); }
.site-footer__base a { color: var(--footer-ink); text-decoration: none; }
.site-footer__base a:hover { color: var(--footer-accent); }

[data-footer-reveal] {
  opacity: 0;
  transform: translateY(1.4rem);
  transition:
    opacity .85s cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, .1s),
    transform .85s cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, .1s);
}
.site-footer.is-revealed [data-footer-reveal] { opacity: 1; transform: translateY(0); }

/* The document is an opaque sheet above the footer. Its final edge moves out
   of the viewport during the last screen of scrolling, revealing the footer
   that has been waiting underneath rather than placing the footer after the
   page in normal flow. The shadow keeps that moving edge legible on both the
   white and lilac page endings. */
body:has(> .site-footer) > main {
  position: relative;
  z-index: 3;
  border-bottom: 1px solid rgba(95, 60, 145, .24);
  box-shadow: 0 2rem 4.5rem rgba(23, 20, 29, .2);
}

@media (min-width: 900px) {
  .home-page main {
    position: relative;
    z-index: 3;
    margin-bottom: 100svh;
  }
  .site-footer {
    position: fixed;
    z-index: 1;
    inset: 0;
    width: 100%;
    height: 100svh;
  }
}

@media (max-width: 899px) {
  body:has(> .site-footer) > main { margin-bottom: 100svh; }
  .site-footer {
    position: fixed;
    z-index: 1;
    inset: 0;
    width: 100%;
    height: 100svh;
    min-height: 0;
    padding: 2.5rem var(--footer-gutter) 0;
    /* No overscroll-behavior: contain. The footer is a fixed, full-screen
       element that the page sheet slides off to reveal; `contain` stopped a
       scroll that reached the top of this box from chaining back to the
       document, so once you were inside the footer the page above could not be
       brought back — you were held here. It is also sized to fit one screen
       now, so this scroller should never engage at all; `auto` stays only as a
       safety valve for very short screens or very large text. */
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .site-footer__panel { position: relative; padding: 0; }
  .site-footer__topline,
  .site-footer__primary,
  .site-footer__directory,
  .site-footer__base { position: relative; inset: auto; }
  .site-footer__topline { font-size: .6rem; letter-spacing: .28em; }
  .site-footer__topline span:last-child { display: none; }
  .site-footer__primary { grid-template-columns: 1fr; margin-top: 1.5rem; }
  .site-footer__intro,
  .site-footer__action { grid-column: 1; }
  .site-footer__intro { padding-top: 0; }
  .site-footer__intro h2 { font-size: clamp(2.6rem, 11vw, 4rem); }
  .site-footer__intro > p { margin-top: 1rem; font-size: .92rem; line-height: 1.4; }
  .site-footer__action { padding-top: 1.75rem; }
  .site-footer__action > p { display: none; }
  .site-footer__action-note { display: none; }

  /* The directory was 888px of an 852px screen on its own: five stacked blocks,
     thirteen links each at a 44px touch target. The brand blurb goes — it
     restates the statement directly above it — and the four navigation blocks
     pair up, which halves the column and keeps every link a full target. */
  .site-footer__directory {
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem 1.5rem;
    margin-top: 1.75rem;
    padding: 1.25rem 0 0;
  }
  .site-footer__directory > .site-footer__directory-brand { display: none; }
  .site-footer__directory strong { margin-bottom: 0; }
  .site-footer__contact { padding-left: 0; border-left: 0; }
  .site-footer__base { margin-top: 1.25rem; padding: .85rem 0 1rem; }
}

@media (max-width: 560px) {
  .site-footer__intro h2 span:last-child { padding-left: .2em; }
  /* The two CTAs stay side by side and the directory stays two-up: collapsing
     both to one column is what made this footer a screen and a half. */
  .site-footer__base { align-items: flex-start; flex-direction: column; gap: .35rem; }
  .site-footer__base > div { align-items: center; flex-direction: row; gap: .9rem; }
  .site-footer__base i { display: none; }
}

/* The footer's microtype is set for a desktop page where it reads as fine
   editorial detail at arm's length. On a phone the same sizes land at 8.3–10.7px
   at reading distance, and the directory links become 15px-tall targets with
   nothing but a .55rem gap between them — a thumb hits two at once. Sizes come
   up to an 11px floor and the links get real vertical room, which is a legibility
   and hit-area fix rather than a change of design: the tracked-caps voice is kept. */
@media (max-width: 899px) {
  .site-footer__topline { font-size: .68rem; }
  .site-footer__action > p { font-size: .72rem; }
  .site-footer__action-note { font-size: .68rem; }
  .site-footer__button { font-size: .78rem; }
  .site-footer__directory strong { font-size: .82rem; }
  .site-footer__directory p,
  .site-footer__directory a,
  .site-footer__directory span { font-size: .84rem; }
  .site-footer__base,
  .site-footer__base a { font-size: .7rem; }
}

/* Touch only: the padding that makes each link a 44px target would open the
   footer out unnecessarily on a small desktop window, where a cursor is exact. */
@media (hover: none) and (max-width: 899px) {
  .site-footer__directory section,
  .site-footer__directory nav { gap: 0; }
  .site-footer__directory a,
  .site-footer__base a {
    display: flex;
    align-items: center;
    /* The base rule sets width: max-content so each link is its own hit area on
       a wide screen. In a 139px column that makes a long label ("Book a
       Discovery Call") overrun its cell, and display:flex stops it wrapping out
       of trouble. Auto width lets it wrap inside the column instead. */
    width: auto;
    min-height: 44px;
    -webkit-tap-highlight-color: transparent;
  }
  .site-footer__socials { gap: .25rem; }
  .site-footer__socials a { display: flex; align-items: center; min-width: 44px; min-height: 44px; }
  .site-footer__button { min-height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
  .site-footer__button,
  [data-footer-reveal] { transition: none; }
  [data-footer-reveal] { opacity: 1; transform: none; }
}

/* ── Static editorial footer ────────────────────────────────────────────────
   The previous footer lived fixed behind a full viewport of artificial page
   margin. That made the end of the site feel like a second overlapping page,
   trapped short phone screens inside an internal scroller and put the 3D mark
   behind live text. On mobile only, the footer is deliberately ordinary: it
   follows main in document flow, sizes itself from its content and has no
   reveal state. Desktop keeps the original full-screen footer reveal. */
@media (max-width: 899px) {
body:has(> .site-footer) > main,
.home-page main,
.tlh-inner main {
  margin-bottom: 0 !important;
  border-bottom: 0;
  box-shadow: none !important;
}

.site-footer {
  position: relative !important;
  inset: auto !important;
  width: 100%;
  height: auto !important;
  min-height: 0;
  padding: clamp(4.5rem, 8vw, 7rem) var(--footer-gutter) 0;
  overflow: hidden;
}
.site-footer::before {
  display: none !important;
}
.site-footer__panel {
  position: relative;
  inset: auto;
  padding: 0;
  pointer-events: auto;
}
.site-footer__topline { display: none; }
.site-footer__primary,
.site-footer__directory,
.site-footer__base {
  position: relative;
  inset: auto;
}
.site-footer__primary {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(2rem, 5vw, 6rem);
}
.site-footer__intro {
  grid-column: 1 / span 6;
  padding-top: 0;
}
.site-footer__intro h2 {
  display: block;
  max-width: 9ch;
  font-size: clamp(3rem, 5.2vw, 5.8rem);
  line-height: .9;
}
.site-footer__intro h2 span { display: inline; }
.site-footer__intro h2 span:last-child { padding-left: 0; }
.site-footer__intro > p { max-width: 38rem; }
.site-footer__action {
  grid-column: 8 / -1;
  align-self: end;
  padding-top: 0;
}
.site-footer__action-rule,
.site-footer__action-note { display: none; }
.site-footer__action > p { margin-bottom: 1.25rem; }
.site-footer__actions { gap: .65rem; }
.site-footer__button {
  min-height: 3.75rem;
  border-radius: .4rem !important;
  font-size: .76rem;
}
.site-footer__directory {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(2rem, 5vw, 5rem);
  margin-top: clamp(3.5rem, 7vw, 6.5rem);
  padding: clamp(2rem, 4vw, 3rem) 0;
}
.site-footer__directory > .site-footer__directory-brand { display: none; }
.site-footer__contact { padding-left: 0; border-left: 0; }
.site-footer__base {
  min-height: 0;
  padding: 1.25rem 0;
}
[data-footer-reveal],
.site-footer.is-revealed [data-footer-reveal] {
  opacity: 1;
  transform: none;
  transition: none;
}

  .site-footer {
    padding: 4rem 1.25rem 0;
    overflow: hidden;
  }
  .site-footer__primary { grid-template-columns: 1fr; gap: 2.25rem; }
  .site-footer__intro,
  .site-footer__action { grid-column: 1; }
  .site-footer__intro h2 {
    max-width: 8ch;
    font-size: clamp(2.7rem, 13vw, 4rem);
    line-height: .91;
  }
  .site-footer__intro > p {
    max-width: 32rem;
    margin-top: 1.25rem;
    font-size: 1rem;
    line-height: 1.5;
  }
  .site-footer__action { padding-top: 0; }
  .site-footer__action > p { display: none; }
  .site-footer__actions { grid-template-columns: 1fr; }
  .site-footer__button {
    min-height: 3.5rem;
    padding: 0 1.15rem;
    border-radius: .35rem !important;
    font-size: .76rem;
  }
  .site-footer__directory {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 2rem;
    margin-top: 3rem;
    padding: 2rem 0;
  }
  .site-footer__programmes,
  .site-footer__support { display: none !important; }
  .site-footer__directory strong { margin-bottom: .5rem; }
  .site-footer__directory a,
  .site-footer__directory span {
    min-height: 44px;
    font-size: .9rem;
    line-height: 1.35;
  }
  .site-footer__contact a { overflow-wrap: anywhere; }
  .site-footer__base {
    align-items: flex-start;
    flex-direction: column;
    gap: .65rem;
    padding: 1.25rem 0 max(1.5rem, env(safe-area-inset-bottom));
    font-size: .7rem;
    line-height: 1.5;
  }
  .site-footer__base > div { gap: 1rem; }
  .site-footer__base i,
  .site-footer__base > div > span { display: none; }
}

@media (max-width: 560px) {
  .site-footer__directory {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }
  .site-footer__directory section,
  .site-footer__directory nav { gap: 0; }
  .site-footer__contact {
    padding-top: 1.75rem;
    border-top: 1px solid var(--footer-line);
  }
}