/* Her Circle — design tokens from Figma */

/* Digits-only Lora: only on serif/display stacks (--font-primary,
   --font-numeric). Body stacks stay Inter / Inter Tight so inline digits
   like "20-min", "12.30 pm" and "© 2026" match the surrounding text. */
   @font-face {
    font-family: "LoraNum";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/lora-num.woff2") format("woff2");
    unicode-range: U+0030-0039;
  }
  
  :root {
      --theme-bg: #f1f0e3;
      --theme-bg-dark: #0a192a;
      --theme-text: #0a192a;
      --theme-text-light: #f1f0e3;
      --theme-text-2: rgba(10, 25, 42, 0.5);
      --theme-text-2-light: rgba(241, 240, 227, 0.5);
      --theme-border: rgba(10, 25, 42, 0.2);
      --theme-border-light: rgba(241, 240, 227, 0.2);
      --brand-500: #cc4d29;
      --brand-text-o20: rgba(10, 25, 42, 0.5);
      --stat-slot: #12263e;
    
    --font-primary: "LoraNum", "Playfair Display", Georgia, serif;
    --font-secondary: Inter, system-ui, sans-serif;
    --font-tight: "Inter Tight", Inter, system-ui, sans-serif;
    --font-numeric: "LoraNum", "Lora", Georgia, serif;
    
      --fs-display: 90px;
      --fs-h1: 72px;
      --fs-h2: 50px;
      --fs-h3: 42px;
      --fs-h4: 28px;
      --fs-large: 20px;
      --fs-main: 16px;
      --fs-small: 16px;
      --fs-button: 14px;
      --fs-caption: 13px;
    
      --site-margin: 48px;
      --section-space: 100px;
      --section-space-sm: 80px;
      --space-1: 8px;
      --space-2: 12px;
      --space-3: 16px;
      --space-4: 24px;
      --space-5: 32px;
      --space-6: 40px;
      --space-7: 48px;
      --space-8: 64px;
      --radius-round: 99999px;
      --border-main: 1.5px;
      --max: 1440px;
    }
    
    *,
    *::before,
    *::after {
      box-sizing: border-box;
    }
    
    html {
      scroll-behavior: smooth;
    }
    
    body {
      margin: 0;
      font-family: var(--font-secondary);
      font-size: var(--fs-main);
      line-height: 1.5;
      color: var(--theme-text);
      background: var(--theme-bg);
      -webkit-font-smoothing: antialiased;
    }
    
    img {
      max-width: 100%;
      height: auto;
      display: block;
    }
    
    a {
      color: inherit;
      text-decoration: none;
    }
    
    ul {
      margin: 0;
      padding: 0;
      list-style: none;
    }
    
    p {
      margin: 0;
    }
    
    h1, h2, h3, h4 {
      margin: 0;
      font-weight: 400;
    }
    
    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      border: 0;
    }
    
    .container {
      width: 100%;
      max-width: var(--max);
      margin: 0 auto;
      padding-left: var(--site-margin);
      padding-right: var(--site-margin);
    }
    
    /* Typography */
    .h2 {
      font-family: var(--font-primary);
      font-size: var(--fs-h2);
      line-height: 1;
      letter-spacing: -1.5px;
      text-transform: uppercase;
      font-feature-settings: "case" 1;
    }
    
    .h2--light,
    .h3--light,
    .h4--light {
      color: var(--theme-text-light);
    }
    
    .h3 {
      font-family: var(--font-primary);
      font-size: var(--fs-h3);
      line-height: 1.1;
      letter-spacing: -1.26px;
      text-transform: uppercase;
      font-feature-settings: "case" 1, "cpsp" 1;
    }
    
    .h4 {
      font-family: var(--font-primary);
      font-size: var(--fs-h4);
      line-height: 1.3;
      letter-spacing: -0.28px;
      font-feature-settings: "case" 1, "cpsp" 1;
    }
    
    .badge-text {
      font-family: var(--font-secondary);
      font-size: var(--fs-caption);
      font-weight: 500;
      line-height: 1.5;
      text-transform: uppercase;
      color: var(--brand-text-o20);
    }
    
    .badge-text--light {
      color: var(--theme-text-2-light);
    }
    
    .section--cream {
      background: var(--theme-bg);
    }
    
    .section--dark {
      background: var(--theme-bg-dark);
      color: var(--theme-text-light);
    }
    
    /* Buttons */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      /* Figma button is 45px tall overall with a 1.5px inside stroke:
         21 (line) + 2x10.5 (padding) + 2x1.5 (border) = 45 */
      padding: 10.5px 24px;
      border-radius: var(--radius-round);
      border: var(--border-main) solid transparent;
      font-family: var(--font-secondary);
      font-size: var(--fs-button);
      font-weight: 500;
      letter-spacing: -0.14px;
      line-height: 1.5;
      white-space: nowrap;
      cursor: pointer;
      min-height: 45px;
    }
    
    .btn-primary {
      background: var(--brand-500);
      border-color: var(--brand-500);
      color: var(--theme-text-light);
    }
    
    .btn-secondary {
      background: transparent;
      border-color: var(--theme-border);
      color: var(--theme-text);
    }
    
    .btn-secondary--light {
      border-color: var(--theme-border-light);
      color: var(--theme-text-light);
    }
    
    .btn-arrow {
      width: 60px;
      height: 60px;
      border-radius: var(--radius-round);
      border: var(--border-main) solid var(--theme-border-light);
      background: transparent;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      padding: 0;
    }
    
    .btn-arrow:first-child img {
      transform: scaleX(-1);
    }
    
    .tag {
      position: absolute;
      top: 8px;
      left: 8px;
      padding: 8px 12px;
      background: rgba(241, 240, 227, 0.7);
      backdrop-filter: blur(2px);
      font-size: var(--fs-caption);
      font-weight: 500;
      text-transform: uppercase;
      color: var(--theme-text);
      line-height: 1.5;
    }
    
    /* Header */
    .site-header {
      position: sticky;
      top: 0;
      z-index: 100;
      background: var(--theme-bg);
    }
    
    .nav-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      max-width: var(--max);
      margin: 0 auto;
      padding: 8px var(--site-margin);
      min-height: 61px;
      position: relative;
    }
    
    .nav-logo {
      width: 120px;
      height: 30px;
      flex-shrink: 0;
    }
    
    .nav-logo img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
    
    .nav-links {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 16px;
      align-items: center;
    }
    
    .nav-links a {
      display: block;
      padding: 8px 12px;
      font-size: var(--fs-button);
      font-weight: 500;
      letter-spacing: -0.14px;
      white-space: nowrap;
    }
    
    .nav-actions {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    
    .nav-burger {
      display: none;
      width: auto;
      min-width: 0;
      height: auto;
      border: 0;
      border-radius: 0;
      background: transparent;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      padding: 12px 0;
      font-family: var(--font-secondary);
      font-size: 16px;
      line-height: 24px;
      font-weight: 500;
      color: var(--theme-text);
    }
  
    .nav-burger__label {
      display: block;
    }
    
    .mobile-menu {
      display: none;
      padding: 24px var(--site-margin) 40px;
      background: var(--theme-bg);
      border-top: 1px solid var(--theme-border);
    }
    
    .mobile-menu.is-open {
      display: block;
    }
    
    .mobile-menu__links {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-bottom: 24px;
    }
    
    .mobile-menu__links a {
      display: block;
      padding: 12px 0;
      font-size: 16px;
      font-weight: 500;
    }
    
    /* Hero */
    .hero {
      background: var(--theme-bg);
    }
    
    .hero__inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      /* Figma: text 660 @48 + image 656 ending at 1392 => 28px gutter */
      gap: 28px;
      min-height: 720px;
      padding-top: 32px;
      padding-bottom: 32px;
    }
    
    .hero__content {
      display: flex;
      flex-direction: column;
      gap: 32px;
      width: min(660px, 100%);
      flex-shrink: 0;
    }
    
    .hero__title {
      font-family: var(--font-primary);
      font-size: var(--fs-h1);
      line-height: 1;
      letter-spacing: -2.16px;
      text-transform: uppercase;
    }
    
    .hero__desc {
      max-width: 427px;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    
    .hero__cta {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    
    .hero__media {
      width: 656px;
      max-width: 100%;
      height: 656px;
      aspect-ratio: 1;
      overflow: hidden;
      flex: 0 0 auto;
      background: #d9d6cc;
    }
    
    .hero__media img,
    .hero__media video,
    .media-cover {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    
    /* Who we are */
    .who {
      padding: var(--section-space) 0;
    }
    
    .who__top {
      display: flex;
      gap: 147px;
      align-items: start;
      margin-bottom: 106px;
    }
    
    .who__media-col {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 312px;
      flex-shrink: 0;
      min-height: 497px;
    }
    
    .who__image {
      width: 312px;
      height: 251px;
      overflow: hidden;
    }
    
    .who__image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .who__text {
      width: min(640px, 100%);
      display: flex;
      flex-direction: column;
      gap: 32px;
    }
    
    .who__desc {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    
    .who__text .btn {
      align-self: flex-start;
    }
    
    .who__stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 292px));
      column-gap: 167px;
      row-gap: 64px;
      margin-bottom: 106px;
    }
    
    .stat__num {
      font-family: var(--font-primary);
      font-size: var(--fs-display);
      line-height: 1;
      letter-spacing: -5.4px;
      font-feature-settings: "case" 1;
      margin-bottom: 16px;
    }
    
    .stat__label {
      font-size: var(--fs-small);
      max-width: 292px;
    }
    
    .stat--wide {
      grid-column: 2 / -1;
      max-width: 534px;
    }
    
    .stat--wide .stat__num {
      white-space: nowrap;
      letter-spacing: -5.4px;
    }
    
    .stat--wide .stat__label {
      max-width: 430px;
    }
    
    .who__logos {
      display: flex;
      gap: 50px;
      justify-content: center;
    }
    
    .who__logo-slot {
      display: block;
      width: 197px;
      height: 93px;
      background: var(--stat-slot);
    }
    
    /* Stages */
    .stages {
      padding: var(--section-space) 0;
    }
    
    .stages__header {
      display: grid;
      grid-template-columns: minmax(0, 459px) minmax(0, 795px);
      justify-content: start;
      column-gap: 0;
      align-items: start;
      margin-bottom: 40px;
      width: 100%;
    }
    
    .stages__intro {
      width: 100%;
      max-width: 795px;
      display: flex;
      flex-direction: column;
      gap: 16px;
      justify-self: start;
    }
    
    .stages__intro p {
      max-width: 600px;
    }
    
    .stages__grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 32px;
    }
    
    .stage-card {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    
    .stage-card__media {
      height: 320px;
      overflow: hidden;
    }
    
    .stage-card__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .stage-card__body {
      display: flex;
      flex-direction: column;
      gap: 16px;
      align-items: flex-start;
    }
    
    .stage-card__copy {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }
    
    .stage-card__body p {
      font-size: var(--fs-small);
    }
    
    /* 5 Ways accordion */
    .five-ways {
      padding: var(--section-space) 0;
    }
    
    .five-ways__inner {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 32px;
    }
    
    .five-ways__content {
      width: 656px;
      max-width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-self: stretch;
      min-height: 720px;
      gap: 32px;
      flex: 1 1 auto;
      min-width: 0;
      overflow: visible;
    }
    
    .five-ways__content .h2 {
      max-width: 600px;
      margin: 0;
    }
    
    .five-ways__media {
      width: 657px;
      max-width: 100%;
      height: 720px;
      overflow: hidden;
      flex: 0 0 auto;
      background: #d9d6cc;
    }
    
    .five-ways__media img,
    .five-ways__media video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    
    .five-ways .accordion__trigger {
      padding: 24px 0;
    }
    
    .five-ways .accordion__item.is-open .accordion__trigger {
      padding-bottom: 0;
    }
    
    .five-ways .accordion__panel-inner p {
      padding: 8px 52px 24px 0;
      margin-top: 0;
    }
    
    .five-ways .accordion__item:first-child {
      border-top: 0;
    }
    
    .accordion__item {
      border-bottom: 1px solid var(--theme-border);
      padding: 0;
    }
    
    .accordion__trigger {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
      width: 100%;
      padding: 24px 0;
      border: 0;
      background: transparent;
      cursor: pointer;
      text-align: left;
      color: inherit;
      font-family: var(--font-primary);
      font-size: var(--fs-h4);
      line-height: 1.3;
      letter-spacing: -0.28px;
      font-feature-settings: "case" 1, "cpsp" 1;
    }
    
    .accordion__icon {
      width: 36px;
      height: 36px;
      flex-shrink: 0;
      position: relative;
    }
    
    .accordion__icon::before,
    .accordion__icon::after {
      content: "";
      position: absolute;
      background: var(--theme-text);
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease;
    }
    
    .accordion__icon::before {
      width: 20px;
      height: 1.5px;
    }
    
    .accordion__icon::after {
      width: 1.5px;
      height: 20px;
    }
    
    .accordion__item.is-open .accordion__icon::after {
      transform: translate(-50%, -50%) scaleY(0);
      opacity: 0;
    }
    
    .accordion__panel {
      display: grid;
      grid-template-rows: 0fr;
      transition: grid-template-rows 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    }
    
    .accordion__item.is-open .accordion__panel {
      grid-template-rows: 1fr;
    }
    
    .accordion__panel-inner {
      overflow: hidden;
      min-height: 0;
    }
    
    .accordion__panel-inner p {
      margin: 0;
      padding: 0 52px 24px 0;
      max-width: 541px;
      font-family: var(--font-secondary);
      font-size: var(--fs-small);
      line-height: 1.5;
      letter-spacing: 0;
      font-feature-settings: normal;
      opacity: 0;
      transform: translate3d(0, -8px, 0);
      transition:
        opacity 0.35s ease 0.06s,
        transform 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.06s;
    }
    
    .accordion__item.is-open .accordion__panel-inner p {
      opacity: 1;
      transform: none;
    }
    
    .accordion--faq .accordion__item {
      padding: 0 12px;
      border-top: 1.5px solid var(--theme-border);
      border-bottom: none;
    }
    
    .accordion--faq .accordion__item:last-child {
      border-bottom: 1.5px solid var(--theme-border);
    }
    
    .accordion--faq .accordion__trigger {
      font-family: var(--font-secondary);
      font-size: var(--fs-main);
      letter-spacing: 0;
      font-feature-settings: normal;
      align-items: center;
      padding: 16px 0;
    }
    
    .accordion--faq .accordion__panel-inner p {
      max-width: none;
      padding: 0 48px 16px 0;
    }
    
    .accordion--faq .accordion__icon::before,
    .accordion--faq .accordion__icon::after,
    .accordion--brand .accordion__icon::before,
    .accordion--brand .accordion__icon::after,
    .faq .accordion__icon::before,
    .faq .accordion__icon::after {
      background: var(--brand-500);
    }
    
    .accordion--faq .accordion__icon::before,
    .accordion--brand .accordion__icon::before,
    .faq .accordion__icon::before {
      width: 20px;
      height: 2px;
    }
    
    .accordion--faq .accordion__icon::after,
    .accordion--brand .accordion__icon::after,
    .faq .accordion__icon::after {
      width: 2px;
      height: 20px;
    }
    
    .section--dark .accordion__icon::before,
    .section--dark .accordion__icon::after {
      background: var(--theme-text-light);
    }
    
    .section--dark .accordion--brand .accordion__icon::before,
    .section--dark .accordion--brand .accordion__icon::after,
    .section--dark .accordion--faq .accordion__icon::before,
    .section--dark .accordion--faq .accordion__icon::after,
    .section--dark .faq .accordion__icon::before,
    .section--dark .faq .accordion__icon::after {
      background: var(--brand-500);
    }
    
    /* CTA banner */
    .cta-banner {
      background: var(--theme-bg);
      padding: 0 0;
    }
    
    .cta-banner .container {
      padding-top: 0;
      padding-bottom: 0;
    }
    
    .cta-banner__box {
      position: relative;
      overflow: hidden;
      background: var(--theme-bg-dark);
      padding: var(--section-space-sm) 48px;
      display: flex;
      justify-content: center;
      text-align: center;
    }
    
    .cta-banner__deco {
      position: absolute;
      left: -96px;
      top: 95px;
      width: 452px;
      height: 452px;
      opacity: 0.35;
      pointer-events: none;
    }
    
    .cta-banner__content {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
      max-width: 519px;
    }
    
    .cta-banner__content .btn {
      margin-top: 16px;
    }
    
    .cta-banner__content p {
      font-size: var(--fs-small);
      max-width: 453px;
      color: var(--theme-text-light);
    }
    
    /* Route / Ways we help — shared grid with section title */
    .route {
      padding: 112px 0 0;
    }
    
    .route__wrap {
      display: flex;
      flex-direction: column;
      gap: 64px;
    }
    
    .route__header {
      display: grid;
      grid-template-columns: minmax(0, 573px) minmax(0, 771px);
      justify-content: space-between;
      column-gap: 0;
      align-items: start;
      margin-bottom: 0;
      padding-bottom: 0;
      width: 100%;
    }
    
    .route__header .badge-text {
      padding-top: 6px;
    }
    
    .route__header .h2 {
      width: 100%;
      max-width: 771px;
      margin: 0;
      justify-self: end;
    }
    
    .route__list {
      border-top: 1px solid var(--theme-border);
    }
    
    .route__item {
      border-bottom: 1px solid var(--theme-border);
      background: var(--theme-bg);
      margin-bottom: 0;
      position: relative;
      z-index: 1;
      transition: margin-bottom 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }
    
    .route__item.is-open {
      z-index: 2;
    }
    
    .route__toggle {
      display: grid;
      grid-template-columns: 310px minmax(0, 730px);
      justify-content: space-between;
      align-items: start;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      padding: 20px 40px 20px 0;
      border: 0;
      background: transparent;
      cursor: pointer;
      text-align: left;
      color: inherit;
      font: inherit;
      box-sizing: border-box;
    }
    
    .route__image {
      width: 310px;
      height: 80px;
      overflow: hidden;
      display: block;
      transition: height 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }
    
    .route__item.is-open .route__image {
      height: 210px;
    }
    
    .route__item.is-open .route__toggle {
      padding-top: 40px;
      padding-bottom: 40px;
    }
    
    .route__image img {
      width: 100%;
      height: 210px;
      object-fit: cover;
      display: block;
      transition: transform 0.6s ease;
    }
    
    .route__item.is-open .route__image img,
    .route__toggle:hover .route__image img {
      transform: scale(1.03);
    }
    
    .route__side {
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 0;
      min-height: 80px;
      max-width: 730px;
      transition: min-height 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }
    
    .route__item.is-open .route__side {
      min-height: 210px;
      /* Figma "Description Block": heading -> 64px -> description (was pushed
         to the bottom by space-between, giving a ~111px gap). */
      justify-content: flex-start;
    }
    
    .route__side-top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 24px;
      width: 100%;
    }
    
    .route__heading {
      display: block;
      max-width: 540px;
      flex: 1;
    }
    
    .route__num {
      font-family: var(--font-primary);
      font-size: var(--fs-h4);
      line-height: 1.3;
      letter-spacing: -0.28px;
      color: #c1c1c1;
      width: 83px;
      flex-shrink: 0;
      text-align: left;
      font-feature-settings: "case" 1, "cpsp" 1;
    }
    
    .route__panel {
      display: grid;
      grid-template-rows: 0fr;
      transition:
        grid-template-rows 0.5s cubic-bezier(0.22, 1, 0.36, 1),
        margin-top 0.45s cubic-bezier(0.22, 1, 0.36, 1);
      margin-top: 0;
    }
    
    .route__item.is-open .route__panel {
      grid-template-rows: 1fr;
      margin-top: 64px; /* Figma "Description Block" heading -> description gap */
    }
    
    .route__panel-inner {
      overflow: hidden;
      min-height: 0;
    }
    
    .route__desc {
      display: block;
      font-size: var(--fs-small);
      line-height: 1.5;
      max-width: 420px;
      color: var(--theme-text);
      opacity: 0;
      transform: translateY(-8px);
      transition: opacity 0.35s ease 0.08s, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.08s;
    }
    
    .route__item.is-open .route__desc {
      opacity: 1;
      transform: none;
    }
    
    /* Diagnostic CTA */
    .diagnostic {
      background: var(--theme-bg);
      padding: var(--section-space-sm) 0;
    }
    
    .diagnostic__inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      align-items: stretch;
      isolation: isolate;
    }
    
    .diagnostic__panel {
      background: var(--theme-bg-dark);
      color: var(--theme-text-light);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      gap: 24px;
      padding: 80px 48px;
      min-height: 547px;
      min-width: 0;
      margin: 0;
    }
    
    .diagnostic__panel .btn {
      margin-top: 16px;
    }
    
    .diagnostic__panel p {
      max-width: 442px;
    }
    
    .diagnostic__note {
      font-size: var(--fs-small);
      color: var(--theme-text-2-light);
    }
    
    .diagnostic__media {
      position: relative;
      min-width: 0;
      min-height: 547px;
      overflow: hidden;
      margin: 0;
      background: var(--theme-bg-dark);
    }
    
    .diagnostic__media img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      max-width: none;
      object-fit: cover;
      display: block;
    }
    
    /* Events / Past / Route headers — Figma: badge left, title block 771 at x=573 */
    .route-like-header {
      display: grid;
      grid-template-columns: minmax(0, 573px) minmax(0, 771px);
      justify-content: space-between;
      column-gap: 0;
      align-items: start;
      margin-bottom: 44px;
      width: 100%;
    }
    
    .route-like-header .h2 {
      width: 100%;
      max-width: 771px;
      margin: 0;
      justify-self: end;
    }
    
    .events__wrap,
    .past__wrap {
      display: flex;
      flex-direction: column;
      width: 100%;
      max-width: var(--max);
      min-width: 0;
    }
    
    .events__wrap {
      gap: 44px;
    }
    
    .past__wrap {
      gap: 64px;
    }
    
    .events__header,
    .past__header {
      display: grid;
      grid-template-columns: minmax(0, 573px) minmax(0, 771px);
      justify-content: space-between;
      column-gap: 0;
      align-items: start;
      width: 100%;
      margin: 0;
    }
    
    .events__header .badge-text,
    .past__header .badge-text,
    .route-like-header .badge-text {
      margin: 0;
      padding-top: 6px;
    }
    
    .events__header .h2,
    .past__header .h2 {
      width: 100%;
      max-width: 771px;
      margin: 0;
      justify-self: end;
    }
    
    @media (max-width: 1280px) {
      .event-card {
        grid-template-columns: minmax(120px, 160px) minmax(200px, 260px) minmax(0, 1fr);
        column-gap: 24px;
      }
    
      .event-card__date {
        width: auto;
        font-size: clamp(28px, 3vw, var(--fs-h3));
      }
    
      .event-card__media {
        width: 100%;
        height: auto;
        aspect-ratio: 312 / 370;
      }
    }
    
    @media (max-width: 1100px) {
      .route-like-header,
      .events__header,
      .past__header,
      .stages__header,
      .route__header {
        grid-template-columns: 1fr;
        row-gap: 16px;
      }
    
      .events__header .h2,
      .past__header .h2,
      .route-like-header .h2,
      .stages__intro,
      .route__header .h2 {
        justify-self: start;
      }
    
      .route__toggle {
        grid-template-columns: 1fr;
        row-gap: 24px;
      }
    }
    
    .events {
      padding: var(--section-space) 0;
      overflow-x: clip;
    }
    
    /* Figma Upcoming Events: date 197 | gap 32 | image 312 | gap 32 | details 730 */
    .event-card {
      display: grid;
      grid-template-columns: 197px 312px minmax(0, 730px);
      column-gap: 32px;
      align-items: start;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
      padding: 40px 0;
      border-top: 1px solid var(--theme-border);
      border-bottom: 1px solid var(--theme-border);
      overflow: hidden;
    }
    
    .event-card__date {
      display: flex;
      gap: 10px;
      font-family: var(--font-primary);
      font-size: var(--fs-h3);
      line-height: 1.1;
      letter-spacing: -1.26px;
      text-transform: uppercase;
      font-feature-settings: "case" 1, "cpsp" 1;
      width: 197px;
      min-width: 0;
      white-space: nowrap;
    }
    
    .event-card__media {
      position: relative;
      width: 312px;
      max-width: 100%;
      height: 370px;
      overflow: hidden;
    }
    
    .event-card__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .event-card__body {
      display: flex;
      flex-direction: column;
      /* Figma "Event Content" is a 40px-gap stack, not space-between —
         the CTA sits just above the image bottom, not flush with it. */
      justify-content: flex-start;
      gap: 40px;
      align-items: flex-start;
      min-width: 0;
      width: 100%;
      max-width: 730px;
      min-height: 370px;
    }
    
    .event-card__copy {
      display: flex;
      flex-direction: column;
      gap: 8px;
      max-width: 560px;
      width: 100%;
      min-width: 0;
    }
    
    .event-card__copy .h3 {
      overflow-wrap: break-word;
      word-wrap: break-word;
    }
    
    .event-card__copy > p:not(.badge-text) {
      font-size: var(--fs-small);
      line-height: 1.5;
      max-width: 560px;
    }
    
    .event-card__meta {
      display: flex;
      flex-direction: column;
      gap: 11px;
      font-family: var(--font-tight);
      font-size: 16px;
      line-height: 24px;
      max-width: 338px;
      width: 100%;
    }
    
    .event-card__meta div {
      display: flex;
      gap: 30px;
      align-items: center;
    }
    
    .event-card__meta span {
      width: 60px;
      color: var(--theme-text-2);
      flex-shrink: 0;
    }
    
    .event-card__meta strong {
      font-weight: 400;
      min-width: 0;
    }
    
    /* Past events */
    .past {
      padding: var(--section-space) 0;
      overflow-x: clip;
    }
    
    .past__grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 32px;
      width: 100%;
    }
    
    .past-card {
      display: flex;
      flex-direction: column;
      gap: 24px;
    }
    
    .past-card__media {
      position: relative;
      aspect-ratio: 16 / 9;
      overflow: hidden;
    }
    
    .past-card__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .past-card__body {
      display: flex;
      flex-direction: column;
      gap: 24px;
      align-items: flex-start;
    }
    
    .past-card__meta {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      width: 100%;
      font-size: var(--fs-small);
      color: var(--theme-text-2);
    }
    
    .past-card__body p {
      font-size: var(--fs-small);
    }
    
    /* Testimonials */
    .testimonials {
      padding: var(--section-space) 0;
    }
    
    .testimonials__title {
      text-align: center;
      margin-bottom: 40px;
    }
    
    .testimonials__track {
      display: flex;
      gap: 32px;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
      padding-bottom: 8px;
    }
    
    .testimonials__track::-webkit-scrollbar {
      display: none;
    }
    
    .testimonial {
      width: 312px;
      flex-shrink: 0;
      scroll-snap-align: start;
    }
    
    .testimonial__media {
      height: 555px;
      overflow: hidden;
      margin-bottom: 24px;
    }
    
    .testimonial__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .testimonial__name {
      font-size: var(--fs-large);
      margin-bottom: 4px;
    }
    
    .testimonial__role {
      font-size: var(--fs-small);
      opacity: 0.6;
    }
    
    .testimonials__nav {
      display: flex;
      justify-content: center;
      gap: 8px;
      margin-top: 40px;
    }
    
    /* About founder */
    .about {
      padding: var(--section-space) 0;
    }
    
    .about__inner {
      display: flex;
      gap: 71px;
      align-items: flex-start;
      width: 100%;
    }
    
    .about__inner > .badge-text {
      flex: 0 0 auto;
      padding-top: 6px;
      width: 158px;
      white-space: nowrap;
    }
    
    .about__block {
      display: flex;
      gap: 32px;
      align-items: flex-start;
    }
    
    .about__media {
      width: 312px;
      height: 384px;
      flex-shrink: 0;
      overflow: hidden;
    }
    
    .about__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .about__text {
      width: min(654px, 100%);
      display: flex;
      flex-direction: column;
      gap: 32px;
      align-items: flex-start;
    }
    
    .about__text .h3 {
      max-width: 540px;
    }
    
    .about__desc {
      max-width: 540px;
      font-size: var(--fs-small);
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    
    /* Partner */
    .partner {
      padding: var(--section-space) 0;
      overflow: hidden;
    }
    
    .partner__inner {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 48px;
    }
    
    .partner__content {
      width: min(600px, 100%);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 64px;
    }
    
    .partner__intro {
      display: flex;
      flex-direction: column;
      gap: 40px;
      width: 100%;
      color: var(--theme-text-light);
    }
    
    .partner__list-block {
      display: flex;
      flex-direction: column;
      gap: 32px;
      width: 100%;
      align-items: flex-start;
    }
    
    .partner__lead {
      opacity: 0.8;
      margin: 0;
    }
    
    .partner__list {
      display: flex;
      flex-direction: column;
      gap: 16px;
      width: 100%;
    }
    
    .partner__list li {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    
    .partner__list li::before {
      content: "";
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--brand-500);
      flex-shrink: 0;
    }
    
    .partner__cta {
      position: static;
      transform: none;
    }
    
    .partner__media {
      width: 657px;
      max-width: 100%;
      height: 650px;
      overflow: hidden;
      flex: 0 0 auto;
    }
    
    .partner__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    /* FAQ */
    .faq {
      padding: var(--section-space) 0;
    }
    
    .faq__title {
      text-align: center;
      margin-bottom: 64px;
    }
    
    .faq__list {
      max-width: 886px;
      margin: 0 auto;
    }
    
    /* Newsletter */
    .newsletter {
      padding: var(--section-space) 0;
    }
    
    .newsletter__inner {
      max-width: 800px;
      margin: 0 auto;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
    }
    
    .newsletter__inner > p {
      max-width: 480px;
      opacity: 0.8;
    }
    
    .newsletter__form {
      margin-top: 24px;
    }
    
    .newsletter__legal {
      margin-top: 16px;
    }
    
    .newsletter__form {
      display: flex;
      gap: 16px;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
    }
    
    .newsletter__form input {
      width: 400px;
      max-width: 100%;
      padding: 12px 16px;
      border-radius: var(--radius-round);
      border: 1px solid var(--theme-border-light);
      background: var(--theme-bg-dark);
      color: var(--theme-text-light);
      font-family: var(--font-secondary);
      font-size: var(--fs-small);
      outline: none;
    }
    
    .newsletter__form input::placeholder {
      color: var(--theme-text-2-light);
    }
    
    .newsletter__legal {
      font-size: var(--fs-button);
      font-weight: 500;
      color: var(--theme-text-2-light);
      letter-spacing: -0.14px;
      max-width: 590px;
    }
    
    .newsletter__legal a {
      color: var(--brand-500);
      text-decoration: underline;
    }
  
    .newsletter__status {
      flex-basis: 100%;
      width: 100%;
      margin: 0;
      font-size: var(--fs-small);
      color: var(--brand-500);
      text-align: center;
    }
  
    .newsletter__status.is-error {
      color: #e07a5f;
    }
  
    .newsletter__form.is-loading {
      opacity: 0.6;
      pointer-events: none;
    }
  
    .newsletter.is-submitted .newsletter__form,
    .newsletter.is-submitted .newsletter__legal {
      display: none;
    }
  
    .newsletter__thanks {
      margin-top: 24px;
      padding: 32px 40px;
      max-width: 520px;
      border: 1px solid var(--theme-border-light);
      border-radius: 16px;
      text-align: center;
      outline: none;
    }
  
    .newsletter__thanks-title {
      font-family: var(--font-primary);
      font-size: clamp(28px, 3vw, 36px);
      line-height: 1.15;
      letter-spacing: -0.04em;
      color: var(--theme-text-light);
      margin: 0 0 8px;
    }
  
    .newsletter__thanks-text {
      margin: 0;
      font-size: var(--fs-small);
      color: var(--theme-text-2-light);
    }
    
    /* Footer */
    .site-footer {
      background: var(--theme-bg);
      padding: var(--section-space-sm) 0;
    }
    
    .footer__inner {
      display: flex;
      justify-content: space-between;
      gap: 48px;
      margin-bottom: 40px;
    }
    
    .footer__mark {
      width: 120px;
      flex-shrink: 0;
    }
    
    .footer__content {
      display: flex;
      gap: 146px;
    }
    
    .footer__contact {
      width: 311px;
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    
    .footer__contact-label {
      font-family: var(--font-secondary);
      font-size: var(--fs-caption);
      font-weight: 500;
      line-height: 1.5;
      text-transform: uppercase;
      color: var(--theme-text);
      max-width: 311px;
      letter-spacing: 0;
    }
    
    .footer__details {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 267px;
    }
    
    .footer__email,
    .footer__phone {
      font-family: var(--font-primary);
      font-size: var(--fs-h4);
      line-height: 1.3;
      letter-spacing: -0.28px;
      font-feature-settings: "case" 1, "cpsp" 1;
    }
    
    .footer__nav {
      display: flex;
      gap: 32px;
    }
    
    .footer__col {
      width: 198px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    
    .footer__col .badge-text {
      color: var(--theme-text);
      margin-bottom: 1px;
    }
    
    .footer__col a {
      font-size: var(--fs-small);
    }
    
    .footer__col a.footer__link-accent {
      color: inherit;
      text-decoration: none;
    }
    
    .footer__copy {
      font-size: var(--fs-small);
      opacity: 0.5;
    }

    /* Legal / text pages */
    .legal-page {
      background: var(--theme-bg);
      padding: var(--section-space) 0;
    }

    .legal-page__inner {
      max-width: 760px;
      display: flex;
      flex-direction: column;
      gap: 28px;
    }

    .legal-page__title {
      font-family: var(--font-primary);
      font-size: var(--fs-h2);
      line-height: 1.05;
      letter-spacing: -1.5px;
      text-transform: uppercase;
      font-feature-settings: "case" 1;
    }

    .legal-page__content {
      display: flex;
      flex-direction: column;
      gap: 16px;
      font-size: var(--fs-main);
      line-height: 1.6;
      color: var(--theme-text);
    }

    .legal-page__content h2 {
      font-family: var(--font-primary);
      font-size: var(--fs-h4);
      line-height: 1.25;
      letter-spacing: -0.28px;
      font-feature-settings: "case" 1, "cpsp" 1;
      margin-top: 24px;
    }

    .legal-page__content h3 {
      font-family: var(--font-secondary);
      font-size: 18px;
      font-weight: 500;
      line-height: 1.4;
      margin-top: 8px;
    }

    .legal-page__content p + h2,
    .legal-page__content ul + h2 {
      margin-top: 32px;
    }

    .legal-page__content ul {
      list-style: disc;
      padding-left: 1.3em;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .legal-page__content li::marker {
      color: var(--brand-500);
    }

    .legal-page__content a {
      color: var(--brand-500);
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    .legal-page__switch {
      display: flex;
      align-items: center;
      gap: 16px;
      padding-top: 16px;
      border-top: 1.5px solid var(--theme-border);
      font-size: var(--fs-small);
    }

    .legal-page__switch a {
      color: var(--brand-500);
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    .legal-page__switch [aria-current="page"] {
      font-weight: 500;
    }

    .legal-page__switch-sep {
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: var(--theme-text);
      opacity: 0.35;
    }
    
    /* ========== Tablet ≤ 1024 / 768 ========== */
    @media (max-width: 1100px) {
      :root {
        --site-margin: 24px;
        --fs-h1: 56px;
        --fs-h2: 42px;
        --fs-h3: 36px;
        --fs-h4: 26px;
        --fs-display: 64px;
        --section-space: 80px;
      }
    
      .nav-links {
        display: none;
      }
    
      .nav-burger {
        display: inline-flex;
      }
    
      .hero__inner {
        flex-direction: column;
        align-items: stretch;
        min-height: 0;
        gap: 28px;
      }
    
      .hero__content {
        width: 100%;
      }
    
      .hero__desc {
        max-width: none;
      }
    
      .hero__media {
        width: 100%;
        max-width: none;
      }
    
      .who__top {
        flex-direction: column;
        align-items: flex-start;
        gap: 28px;
        margin-bottom: 44px;
      }
    
      .who__media-col {
        width: 100%;
        min-height: 0;
        gap: 24px;
      }
    
      .who__text {
        width: 100%;
      }
    
      .who__stats {
        grid-template-columns: 1fr 1fr;
        column-gap: 32px;
        row-gap: 40px;
      }
    
      .stat--wide {
        grid-column: 2;
      }
    
      .who__logos {
        gap: 16px;
        flex-wrap: wrap;
      }
    
      .who__logo-slot {
        width: calc(25% - 12px);
        min-width: 140px;
      }
    
      .stages__header {
        grid-template-columns: 1fr;
        row-gap: 16px;
      }
    
      .stages__intro {
        justify-self: start;
      }
    
      .stages__grid {
        grid-template-columns: 1fr;
      }
    
      .stage-card__media {
        height: 280px;
      }
    
      .five-ways__inner {
        flex-direction: column;
      }
    
      .five-ways__content,
      .five-ways__media {
        width: 100%;
      }
    
      .five-ways__media {
        height: 480px;
      }
    
      .route__header,
      .route__toggle {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 16px;
      }
    
      .route__header {
        padding-bottom: 32px;
      }
    
      .route__toggle {
        padding: 28px 0;
      }
    
      .route__image {
        width: 100%;
        height: 140px;
      }
    
      .route__item.is-open .route__image {
        height: 200px;
      }
    
      .route__image img {
        height: 200px;
      }
    
      .route__side,
      .route__item.is-open .route__side {
        min-height: 0;
        max-width: none;
      }
    
      .route__side-top {
        gap: 16px;
      }
    
      .route__num {
        width: auto;
      }
    
      .route__desc {
        max-width: none;
      }
    
      .diagnostic__inner {
        grid-template-columns: 1fr;
      }
    
      .diagnostic__panel,
      .diagnostic__media {
        min-height: 420px;
      }
    
      .event-card {
        grid-template-columns: 1fr;
        row-gap: 24px;
        column-gap: 0;
      }
    
      .event-card__date {
        width: auto;
      }
    
      .event-card__media {
        width: 100%;
        max-width: 420px;
        height: auto;
        aspect-ratio: 312 / 370;
      }
    
      .event-card__body {
        min-height: 0;
      }
    
      .about__inner {
        flex-direction: column;
        gap: 24px;
      }
    
      .past__grid {
        grid-template-columns: 1fr;
      }
    
      .about__block {
        flex-direction: column;
      }
    
      .about__media {
        width: 100%;
        max-width: 420px;
        height: auto;
        aspect-ratio: 312 / 384;
      }
    
      .partner__inner {
        flex-direction: column;
      }
    
      .partner__media {
        width: 100%;
        height: auto;
        aspect-ratio: 657 / 650;
      }
    
      .route__item.is-open:not(:last-child) {
        margin-bottom: 0;
      }
    
      .footer__inner,
      .footer__content,
      .footer__nav {
        flex-direction: column;
        gap: 40px;
      }
    
      .footer__contact,
      .footer__col {
        width: 100%;
      }
    }
    
    /* ========== Mobile ≤ 767 ========== */
    @media (max-width: 767px) {
      :root {
        --site-margin: 16px;
        --fs-h1: 38px;
        --fs-h2: 32px;
        --fs-h3: 28px;
        --fs-h4: 22px;
        --fs-display: 42px;
        --section-space: 50px;
        --section-space-sm: 50px;
      }
    
      .nav-cta {
        display: none;
      }
    
      .nav-bar {
        min-height: 68px;
        padding-top: 8px;
        padding-bottom: 8px;
      }
    
      .hero__title {
        letter-spacing: -1px;
      }
    
      .hero__cta {
        flex-direction: column;
      }
    
      .hero__cta .btn {
        width: 100%;
      }
    
      .who__image {
        width: 100%;
        height: 251px;
      }
    
      .who__stats {
        grid-template-columns: 1fr 1fr;
        column-gap: 12px;
        row-gap: 24px;
        margin-bottom: 40px;
      }
    
      .stat--wide {
        grid-column: 1 / -1;
      }
    
      .stat__num {
        letter-spacing: -2px;
        margin-bottom: 12px;
      }
    
      .who__logos {
        gap: 12px;
      }
    
      .who__logo-slot {
        width: calc(33.333% - 8px);
        min-width: 0;
        height: 59px;
      }
    
      .who__logo-slot:nth-child(4) {
        display: none;
      }
    
      .stages__grid {
        gap: 40px;
      }
    
      .five-ways__media {
        height: 360px;
      }
    
      .cta-banner__box {
        padding: 48px 24px;
      }
    
      .cta-banner__deco {
        width: 260px;
        height: 260px;
        left: -80px;
        top: auto;
        bottom: -40px;
      }
    
      .route {
        padding-top: 50px;
      }
    
      .route__toggle {
        padding: 24px 0;
      }
    
      .diagnostic__panel {
        padding: 48px 24px;
        gap: 24px;
        min-height: 0;
      }
    
      .diagnostic__media {
        min-height: 320px;
      }
    
      .event-card {
        grid-template-columns: 1fr;
        gap: 24px;
      }
    
      .event-card__body {
        min-height: 0;
        gap: 24px;
      }
    
      .newsletter__form {
        flex-direction: column;
        width: 100%;
      }
    
      .newsletter__form input,
      .newsletter__form .btn {
        width: 100%;
      }
    
      .testimonial {
        width: min(280px, 80vw);
      }
    
      .testimonial__media {
        height: 420px;
      }
    
      .btn {
        white-space: normal;
        text-align: center;
      }
    }
    
    /* Motion / reveal — keep light for smooth scrolling */
    [data-reveal] {
      opacity: 0;
      transform: translate3d(0, 24px, 0);
      transition:
        opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
      transition-delay: var(--reveal-delay, 0ms);
    }
    
    [data-reveal].is-visible {
      opacity: 1;
      transform: none;
    }
    
    .hero__content.is-visible .badge-text,
    .hero__content.is-visible .hero__title,
    .hero__content.is-visible .hero__desc,
    .hero__content.is-visible .hero__cta {
      animation: hcRise 0.75s cubic-bezier(0.22, 1, 0.36, 1) both;
    }
    
    .hero__content.is-visible .badge-text { animation-delay: 0.05s; }
    .hero__content.is-visible .hero__title { animation-delay: 0.12s; }
    .hero__content.is-visible .hero__desc { animation-delay: 0.22s; }
    .hero__content.is-visible .hero__cta { animation-delay: 0.32s; }
    
    @keyframes hcRise {
      from {
        opacity: 0;
        transform: translate3d(0, 18px, 0);
      }
      to {
        opacity: 1;
        transform: none;
      }
    }
    
    .site-header {
      transition: background 0.25s ease, box-shadow 0.25s ease;
    }
    
    .site-header.is-scrolled {
      background: rgba(241, 240, 227, 0.97);
      box-shadow: 0 1px 0 rgba(10, 25, 42, 0.06);
    }
    
    .nav-links a {
      position: relative;
    }
    
    .nav-links a::after {
      content: "";
      position: absolute;
      left: 12px;
      right: 12px;
      bottom: 4px;
      height: 1px;
      background: currentColor;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s ease;
    }
    
    .nav-links a:hover::after {
      transform: scaleX(1);
    }
    
    .btn {
      transition: opacity 0.25s ease, transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
    }
    
    .btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 24px rgba(10, 25, 42, 0.12);
    }
    
    .btn-primary:hover {
      box-shadow: 0 10px 24px rgba(204, 77, 41, 0.28);
    }
    
    .stage-card,
    .past-card,
    .testimonial {
      transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }
    
    .stage-card:hover,
    .past-card:hover {
      transform: translateY(-8px);
    }
    
    .stage-card__media img,
    .past-card__media img,
    .who__image img,
    .about__media img {
      transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    }
    
    .stage-card:hover .stage-card__media img,
    .past-card:hover .past-card__media img {
      transform: scale(1.05);
    }
    
    .cta-banner__deco {
      animation: hcFloat 10s ease-in-out infinite;
      opacity: 0.65;
    }
    
    @keyframes hcFloat {
      0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
      50% { transform: translate3d(12px, -18px, 0) rotate(2deg); }
    }
    
    @media (prefers-reduced-motion: reduce) {
      [data-reveal],
      .route__toggle,
      .route__panel,
      .route__item,
      .accordion__panel,
      .accordion__panel-inner p,
      .cta-banner__deco,
      .hero__content.is-visible .badge-text,
      .hero__content.is-visible .hero__title,
      .hero__content.is-visible .hero__desc,
      .hero__content.is-visible .hero__cta {
        transition: none !important;
        animation: none !important;
        transform: none !important;
        opacity: 1 !important;
      }
    }
    
    /* Video testimonials */
    .testimonial__media {
      position: relative;
    }
    
    .testimonial__video {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: none;
      background: #000;
    }
    
    .testimonial__media.is-playing .testimonial__video {
      display: block;
    }
    
    .testimonial__media.is-playing .testimonial__play {
      display: none;
    }
    
    .testimonial__play {
      position: absolute;
      inset: 0;
      border: 0;
      padding: 0;
      cursor: pointer;
      background: transparent;
      display: block;
      width: 100%;
      height: 100%;
    }
    
    .testimonial__play img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .testimonial__play-icon {
      position: absolute;
      left: 50%;
      top: 50%;
      width: 64px;
      height: 64px;
      margin: -32px 0 0 -32px;
      border-radius: 50%;
      background: rgba(204, 77, 41, 0.92);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    }
    
    .testimonial__play-icon::before {
      content: "";
      position: absolute;
      left: 26px;
      top: 20px;
      border-style: solid;
      border-width: 12px 0 12px 18px;
      border-color: transparent transparent transparent #f1f0e3;
    }
    
    .btn,
    .nav-links a {
      transition: opacity 0.25s ease, transform 0.25s ease, background 0.25s ease;
    }
    
    .btn:hover {
      transform: translateY(-1px);
    }
    
    .stage-card,
    .past-card,
    .testimonial {
      transition: transform 0.4s ease;
    }
    
    .stage-card:hover,
    .past-card:hover {
      transform: translateY(-4px);
    }
    
    /* ========== Find the Right Support page ========== */
    .sp-hero {
      padding: 40px 0 64px;
    }
    
    .sp-hero__inner {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 32px;
    }
    
    .sp-hero__content {
      width: min(660px, 100%);
      padding-top: 68px;
    }
    
    .sp-hero__title {
      font-family: var(--font-primary);
      font-size: clamp(42px, 5vw, var(--fs-h1));
      line-height: 1;
      letter-spacing: -2.16px;
      text-transform: uppercase;
      font-feature-settings: "case" 1;
      max-width: 660px;
      margin-bottom: 32px;
    }
    
    .sp-hero__intro {
      font-size: var(--fs-main);
      line-height: 1.5;
      max-width: 540px;
      margin-bottom: 24px;
    }
    
    .sp-hero__list {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-bottom: 24px;
    }
    
    .sp-hero__list li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-size: var(--fs-main);
      line-height: 1.5;
    }
    
    .sp-hero__list li::before {
      content: "";
      width: 8px;
      height: 8px;
      margin-top: 8px;
      border-radius: 50%;
      background: var(--brand-500);
      flex-shrink: 0;
    }
    
    .sp-hero__note {
      font-size: var(--fs-main);
      margin-bottom: 32px;
      max-width: 480px;
    }
    
    .sp-hero__media {
      width: 656px;
      max-width: 100%;
      aspect-ratio: 1;
      overflow: hidden;
      flex: 0 0 auto;
    }
    
    .sp-hero__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .sp-stats {
      padding: 100px 0;
      background: var(--theme-bg);
      color: var(--theme-text);
      border-bottom: 1px solid var(--theme-border);
    }
    
    .sp-stats__grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      column-gap: 64px;
      row-gap: 40px;
      align-items: start;
    }
    
    .sp-stat__num {
      font-family: var(--font-primary);
      font-size: var(--fs-display);
      line-height: 1;
      letter-spacing: -5.4px;
      font-feature-settings: "case" 1;
      margin-bottom: 16px;
      white-space: nowrap;
    }
    
    .sp-stat--wide .sp-stat__num {
      font-size: var(--fs-h2);
      line-height: 1;
      letter-spacing: -1.5px;
      white-space: normal;
      max-width: 100%;
      overflow-wrap: break-word;
      text-transform: uppercase;
      font-feature-settings: "case" 1;
    }
    
    .sp-stat__label {
      font-size: var(--fs-small);
      line-height: 1.5;
      max-width: 288px;
    }
    
    .sp-clarity {
      padding: var(--section-space) 0;
    }
    
    .sp-clarity__inner {
      display: flex;
      justify-content: center;
      gap: 64px;
      align-items: stretch;
    }
    
    .sp-clarity__media {
      width: 600px;
      max-width: 100%;
      height: 720px;
      overflow: hidden;
      flex: 0 0 auto;
    }
    
    .sp-clarity__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .sp-clarity__content {
      width: 656px;
      max-width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 32px;
      align-items: stretch;
      min-height: 720px;
      flex: 1 1 auto;
      min-width: 0;
      overflow: visible;
    }
    
    .sp-clarity__content .h2 {
      max-width: 600px;
      margin: 0;
    }
    
    .sp-areas {
      padding: var(--section-space) 0;
    }
    
    .sp-areas__header {
      margin-bottom: 48px;
    }
    
    .sp-areas__header.route-like-header {
      grid-template-columns: minmax(0, 459px) minmax(0, 885px);
      column-gap: 0;
      justify-content: space-between;
    }
    
    .sp-areas__header.route-like-header .h2 {
      max-width: 885px;
      width: 100%;
      font-feature-settings: "case" 1;
      justify-self: end;
    }
    
    .sp-areas__grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      column-gap: 32px;
      row-gap: 48px;
    }
    
    .sp-area {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 24px;
      min-width: 0;
      max-width: 426px;
    }
    
    .sp-area__num {
      font-family: var(--font-primary);
      font-size: 28px;
      line-height: 1.3;
      letter-spacing: -0.28px;
      color: rgba(241, 240, 227, 0.5);
      margin: 0;
    }
    
    .sp-area__copy {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }
    
    .sp-area .h4 {
      margin: 0;
      font-size: 28px;
      line-height: 1.3;
      letter-spacing: -0.28px;
      font-feature-settings: "case" 1, "cpsp" 1;
      text-transform: none;
    }
    
    .sp-area p {
      margin: 0;
      font-size: var(--fs-main);
      line-height: 1.5;
      color: var(--theme-text-light);
      max-width: 370px;
    }
    
    .sp-banner {
      width: 100%;
      aspect-ratio: 2 / 1;
      max-height: 720px;
      overflow: hidden;
      line-height: 0;
    }
    
    .sp-banner img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
      display: block;
    }
    
    .sp-receive {
      padding: var(--section-space) 0;
    }
    
    .sp-receive__inner {
      display: flex;
      justify-content: space-between;
      gap: 48px;
      align-items: flex-start;
    }
    
    .sp-receive__left {
      width: min(640px, 100%);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 24px;
    }
    
    .sp-receive__left .h2 {
      max-width: 640px;
    }
    
    .sp-receive__media {
      width: min(400px, 100%);
      margin-top: 16px;
      overflow: hidden;
    }
    
    .sp-receive__media img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
    
    .sp-receive__right {
      width: min(640px, 100%);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 32px;
      padding-top: 8px;
    }
    
    .sp-receive__list {
      width: 100%;
    }
    
    .sp-receive__item {
      padding: 24px 0;
      border-bottom: 1px solid var(--theme-border);
    }
    
    .sp-receive__item:first-child {
      border-top: 1px solid var(--theme-border);
    }
    
    .sp-receive__item .h4 {
      margin-bottom: 8px;
      font-size: 28px;
    }
    
    .sp-receive__item p {
      font-size: var(--fs-main);
      max-width: 520px;
    }
    
    .sp-receive .btn,
    .sp-results .btn,
    .sp-form .btn {
      width: auto;
      max-width: none;
      align-self: flex-start;
      flex: 0 0 auto;
    }
    
    .sp-soft .btn {
      width: auto;
      max-width: none;
      flex: 0 0 auto;
      align-self: center;
    }
    
    .sp-how {
      padding: var(--section-space) 0;
    }
    
    .sp-how__header {
      margin-bottom: 64px;
    }
    
    .sp-how__header.route-like-header {
      grid-template-columns: minmax(0, 573px) minmax(0, 771px);
      column-gap: 0;
      justify-content: space-between;
    }
    
    .sp-how__header.route-like-header .h2 {
      max-width: 771px;
      width: 100%;
      font-feature-settings: "case" 1;
      justify-self: end;
    }
    
    .sp-how__grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      border: 1px solid var(--theme-border);
    }
    
    .sp-how__item {
      box-sizing: border-box;
      width: 100%;
      min-width: 0;
      height: 100%;
      min-height: 418px;
      padding: 24px;
      border-right: 1px solid var(--theme-border);
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: flex-start;
      gap: 80px;
    }
    
    .sp-how__item:last-child {
      border-right: 0;
    }
    
    .sp-clarity__content .h2,
    .sp-receive__left .h2,
    .sp-trust__content .h2,
    .sp-results__content .h2,
    .sp-form__intro .h2,
    .sp-areas__header .h2,
    .sp-how__header .h2,
    .sp-faq .faq__title {
      line-height: 1;
      letter-spacing: -1.5px;
    }
    
    .sp-how__num {
      font-family: var(--font-primary);
      font-size: 90px;
      line-height: 1;
      letter-spacing: -5.4px;
      color: var(--brand-500);
      margin: 0;
      font-feature-settings: "case" 1;
    }
    
    .sp-how__body {
      display: flex;
      flex-direction: column;
      gap: 32px;
      width: 100%;
      max-width: 288px;
    }
    
    .sp-how__body .h4 {
      margin: 0;
      font-family: var(--font-primary);
      font-size: 28px;
      line-height: 1.3;
      letter-spacing: -0.28px;
      max-width: none;
      font-weight: 400;
      text-transform: none;
      font-feature-settings: "case" 1, "cpsp" 1;
    }
    
    .sp-how__body p {
      margin: 0;
      font-family: var(--font-secondary);
      font-size: 16px;
      line-height: 1.5;
      letter-spacing: 0;
    }
    
    .sp-trust {
      padding: var(--section-space-sm) 0 var(--section-space);
    }
    
    .sp-trust__inner {
      display: flex;
      justify-content: center;
      gap: 64px;
      align-items: flex-start;
    }
    
    .sp-trust__media {
      width: 600px;
      max-width: 100%;
      height: 600px;
      aspect-ratio: 1;
      overflow: hidden;
      flex: 0 0 auto;
    }
    
    .sp-trust__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .sp-trust__content {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 24px;
      width: 450px;
      max-width: 100%;
      flex: 0 1 450px;
      padding-top: 0;
    }
    
    .sp-trust__content .badge-text {
      margin: 0;
    }
    
    .sp-trust__content .h2 {
      max-width: 450px;
    }
    
    .sp-trust__text {
      display: flex;
      flex-direction: column;
      gap: 16px;
      font-size: var(--fs-small);
      line-height: 1.5;
    }
    
    .sp-results {
      padding: var(--section-space) 0;
    }
    
    .sp-results__inner {
      display: flex;
      justify-content: center;
      gap: 64px;
      align-items: flex-start;
    }
    
    .sp-results__content {
      width: min(600px, 100%);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 24px;
    }
    
    .sp-results__content .h2 {
      max-width: 600px;
    }
    
    .sp-results__lead {
      font-size: var(--fs-main);
      max-width: 560px;
    }
    
    .sp-results__list {
      display: flex;
      flex-direction: column;
      gap: 16px;
      margin: 8px 0 16px;
      width: 100%;
    }
    
    .sp-results__list li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-size: var(--fs-main);
    }
    
    .sp-results__list li::before {
      content: "";
      width: 8px;
      height: 8px;
      margin-top: 8px;
      border-radius: 50%;
      background: var(--brand-500);
      flex-shrink: 0;
    }
    
    .sp-results__media {
      width: min(312px, 100%);
      margin: 0;
      flex-shrink: 0;
    }
  
    .sp-results__media > img {
      width: 100%;
      height: 560px;
      object-fit: cover;
      display: block;
    }
  
    .sp-results__media .testimonial {
      width: 100%;
    }
  
    .sp-results__media .testimonial__media {
      height: 560px;
      margin-bottom: 24px;
    }
    
    .sp-results__name {
      margin-top: 24px;
      font-size: var(--fs-large);
      font-weight: 500;
    }
    
    .sp-results__role {
      font-size: var(--fs-small);
      opacity: 0.7;
    }
    
    .sp-faq .faq__title {
      margin-bottom: 64px;
      max-width: none;
    }
    
    .sp-form {
      padding: var(--section-space) 0;
    }
    
    .sp-form__inner {
      display: flex;
      justify-content: space-between;
      gap: 32px;
      align-items: flex-start;
    }
    
    .sp-form__intro {
      width: min(542px, 100%);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 24px;
    }
    
    .sp-form__intro .h2 {
      max-width: 542px;
    }
    
    .sp-form__intro p {
      color: rgba(241, 240, 227, 0.8);
      max-width: 420px;
    }
    
    .diag-form {
      width: min(656px, 100%);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 16px;
    }
    
    .diag-form__row,
    .diag-field--full,
    .diag-form__legal,
    .diag-form__status {
      width: 100%;
    }
    
    .diag-form__row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
    }
    
    .diag-field input,
    .diag-field select {
      width: 100%;
      height: 45px;
      padding: 0 20px;
      border-radius: var(--radius-round);
      border: 1px solid var(--theme-border-light);
      background: var(--theme-bg-dark);
      color: var(--theme-text-light);
      font-family: var(--font-secondary);
      font-size: var(--fs-small);
      outline: none;
      appearance: none;
      -webkit-appearance: none;
    }
    
    .diag-field input::placeholder {
      color: rgba(241, 240, 227, 0.5);
    }
    
    .diag-field select {
      color: rgba(241, 240, 227, 0.5);
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23CC4D29' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 18px center;
      padding-right: 44px;
      cursor: pointer;
    }
    
    .diag-field select:valid,
    .diag-field select option {
      color: var(--theme-text-light);
    }
    
    .diag-field select option {
      background: var(--theme-bg-dark);
      color: var(--theme-text-light);
    }
    
    .diag-form .btn {
      align-self: flex-start;
      margin-top: 8px;
    }
    
    .diag-form__legal {
      font-size: var(--fs-small);
      line-height: 1.5;
      color: rgba(241, 240, 227, 0.55);
      max-width: 656px;
    }
    
    .diag-form__status {
      font-size: var(--fs-small);
      color: var(--theme-text-light);
    }
    
    .diag-form__status.is-error {
      color: #ffb4a2;
    }
    
    .diag-form.is-loading .btn {
      opacity: 0.7;
      pointer-events: none;
    }
    
    .sp-soft {
      padding: 80px 0;
    }
    
    .sp-soft__inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 32px;
    }
    
    .sp-soft__text {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
    }
    
    .sp-soft__text .h3,
    .sp-soft__text .h2 {
      margin: 0;
    }
    
    .sp-soft__text p {
      font-size: var(--fs-small);
      max-width: 453px;
      margin: 0;
    }
    
    @media (max-width: 1100px) {
      .sp-clarity__content,
      .five-ways__content {
        min-height: 0;
        justify-content: flex-start;
        overflow: visible;
      }
    
      .sp-clarity,
      .five-ways {
        overflow: visible;
      }
    
      .sp-clarity__inner,
      .five-ways__inner {
        overflow: visible;
      }
    
      .sp-hero__inner,
      .sp-clarity__inner,
      .sp-receive__inner,
      .sp-trust__inner,
      .sp-results__inner,
      .sp-form__inner {
        flex-direction: column;
      }
    
      .sp-areas__header.route-like-header,
      .sp-how__header.route-like-header {
        grid-template-columns: 1fr;
        row-gap: 16px;
      }
    
      .sp-areas__header.route-like-header .h2,
      .sp-how__header.route-like-header .h2 {
        justify-self: start;
        max-width: 100%;
      }
    
      .sp-hero__media,
      .sp-clarity__media,
      .sp-trust__media {
        width: 100%;
        height: auto;
        aspect-ratio: 1;
      }
    
      .sp-clarity__media {
        aspect-ratio: 5 / 6;
      }
    
      .sp-stats__grid {
        grid-template-columns: 1fr 1fr;
        column-gap: 32px;
      }
    
      .sp-stat__num {
        font-size: clamp(48px, 8vw, 72px);
        letter-spacing: -3px;
      }
    
      .sp-stat--wide .sp-stat__num {
        font-size: clamp(36px, 5vw, 50px);
        letter-spacing: -1.5px;
      }
    
      .sp-banner {
        max-height: none;
      }
    
      .sp-areas__grid {
        grid-template-columns: 1fr 1fr;
      }
    
      .sp-how__grid {
        grid-template-columns: 1fr 1fr;
      }
    
      .sp-how__item {
        min-height: 0;
        padding: 24px;
        gap: 48px;
        border-right: 0;
        border-bottom: 1px solid var(--theme-border);
      }
    
      .sp-how__num {
        font-size: 64px;
      }
    
      .sp-how__body {
        gap: 24px;
        max-width: none;
      }
    
      .sp-how__item:nth-child(odd) {
        border-right: 1px solid var(--theme-border);
      }
    
      .sp-how__item:nth-last-child(-n + 2) {
        border-bottom: 0;
      }
    
      .sp-results__media {
        width: min(360px, 100%);
      }
    }
    
    @media (max-width: 767px) {
      .sp-hero {
        padding: 24px 0 48px;
      }
    
      .sp-hero__content {
        padding-top: 24px;
      }
    
      .sp-hero__title {
        max-width: none;
      }
    
      .sp-stats {
        padding: 48px 0;
      }
    
      .sp-stats__grid,
      .sp-areas__grid,
      .sp-how__grid,
      .diag-form__row {
        grid-template-columns: 1fr;
      }
    
      .sp-stat__num {
        font-size: 48px;
        letter-spacing: -2.5px;
      }
    
      .sp-stat--wide .sp-stat__num {
        font-size: 36px;
        white-space: normal;
      }
    
      .sp-how__item:nth-child(odd) {
        border-right: 0;
        border-bottom: 1px solid var(--theme-border);
      }
    
      .sp-how__item {
        border-bottom: 1px solid var(--theme-border);
      }
    
      .sp-how__item:last-child {
        border-bottom: 0;
      }
    
      .sp-receive__item .h4,
      .sp-how__body .h4 {
        font-size: 24px;
      }
    
      .sp-results__media > img,
      .sp-results__media .testimonial__media {
        height: 420px;
      }
    
      .sp-banner {
        max-height: none;
      }
    
      .sp-soft {
        padding: 48px 0;
      }
    }
    
  /* ===== Numerals — Lora only on display figures & serif headings ===== */
  .stat__num,
  .sp-stat__num {
    font-family: var(--font-numeric);
  }
    
    .stat--wide .stat__num,
    .sp-stat--wide .sp-stat__num {
      font-family: var(--font-primary);
    }
    
    /* Accordion columns must grow with open panels (prevents next section overlap) */
    .five-ways .accordion,
    .sp-clarity__content .accordion {
      flex: 0 1 auto;
      width: 100%;
      min-height: 0;
    }
    
    .five-ways__content,
    .sp-clarity__content {
      justify-content: flex-start;
    }
    
    @media (min-width: 1101px) {
      .five-ways__content,
      .sp-clarity__content {
        justify-content: space-between;
      }
    }
    
    /* =====================================================================
       MOBILE — alignment with the Figma mobile frames (client review round 3)
       ===================================================================== */
    @media (max-width: 767px) {
      /* --- Type scale, measured from the Figma "Mobile (375px)" frame --- */
      :root {
        --fs-h1: 42px;      /* Hero Title      Playfair 42/42 */
        --fs-h2: 36px;      /* Section titles  Playfair 36/36 */
        --fs-h3: 32px;      /* Final CTA title Playfair 32/37 */
        --fs-h4: 24px;      /* Card titles     Playfair 24/28 */
        --fs-display: 30px; /* Stat figures    Playfair 30/33 */
        --fs-caption: 12px; /* Badges          Inter 500 12/18 */
      }
    
      .h2 {
        line-height: 1;
      }

      .legal-page {
        padding: 64px 0 80px;
      }

      .legal-page__inner {
        gap: 20px;
      }

      .legal-page__content h2 {
        margin-top: 16px;
      }
    
      .h4 {
        line-height: 1.17;
      }
    
      .stat__num,
      .sp-stat__num {
        font-size: var(--fs-display);
        line-height: 1.1;
        letter-spacing: -0.9px;
      }
    
      /* --- Buttons: Figma mobile spec is 343x45, Inter 500 14/21, pad 12/24 --- */
      .btn {
        font-size: 14px;
        line-height: 21px;
        letter-spacing: -0.14px;
        min-height: 45px;
        padding: 10.5px 24px;
        width: 100%;
      }
    
      .hero__cta .btn,
      .stage-card .btn,
      .who__text .btn,
      .cta-banner .btn,
      .diagnostic .btn,
      .partner .btn,
      .about .btn,
      .event-card .btn,
      .past-card .btn,
      .newsletter .btn,
      .sp-hero .btn,
      .sp-receive .btn,
      .sp-results .btn,
      .sp-soft .btn,
      .sp-form .btn,
      .diag-form .btn {
        width: 100%;
        align-self: stretch;
      }
    
      /* --- "Who we are": equal gaps, photo must not crop heads (MOB 4,5,7) --- */
      .who__top {
        gap: 24px;
      }
    
      .who__media-col {
        gap: 24px;
      }
    
      .who__text {
        gap: 24px;
      }
    
      .who__image img {
        object-position: center top;
      }
    
      /* Stats stay a 2x2 grid — "Multi-Industry" is a normal cell (MOB 8) */
      .who__stats {
        grid-template-columns: 1fr 1fr;
        column-gap: 24px;
        row-gap: 32px;
      }
    
      .stat--wide {
        grid-column: auto;
        max-width: none;
      }
    
      .stat--wide .stat__num {
        font-size: 28px;
        letter-spacing: -0.5px;
        white-space: normal;
      }
    
      .stat--wide .stat__label {
        max-width: none;
      }
    
      /* --- 5 Ways: no video on mobile, CTA follows straight after (MOB 14) --- */
      .five-ways__media {
        display: none;
      }
    
      .five-ways__content {
        min-height: 0;
      }
    
      /* --- CTA banner: full-bleed, watermark only peeking in (MOB 14,15,16) --- */
      .cta-banner .container {
        padding-left: 0;
        padding-right: 0;
        max-width: none;
      }
    
      .cta-banner__box {
        padding: 56px 24px;
      }
    
      .cta-banner__deco {
        width: 300px;
        height: 300px;
        left: -170px;
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
      }
    
      /* --- Route: tighter header, no desktop numbering on mobile (MOB 17,18) --- */
      .route__wrap {
        gap: 32px;
      }
    
      .route__header {
        row-gap: 12px;
        padding-bottom: 0;
      }
    
      .route__num {
        display: none;
      }
    
      /* --- Events: landscape image like the mobile frame (MOB 22) --- */
      .event-card__media {
        width: 100%;
        max-width: none;
        height: auto;
        aspect-ratio: 4 / 3;
      }
    
      /* Meta labels sit next to their values, not across a wide gap (MOB 23) */
      .event-card__meta div {
        gap: 140px;
      }
    
      .event-card__meta span {
        width: 52px;
      }
    
      /* --- Mobile menu (MOB 1) — Figma "Mobile menu" frame ---
         A cream panel that drops below the bar and HUGS its content
         (24px above the links, 24px below the button). Not full-height. */
      .mobile-menu.is-open {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 200;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 24px var(--site-margin);
        border-top: 0;
        box-shadow: 0 24px 48px rgba(10, 25, 42, 0.14);
      }
    
      .mobile-menu__links {
        align-items: center;
        gap: 8px;
        margin-bottom: 36px; /* Figma Nav-Links gap between links and CTA */
      }
    
      .mobile-menu__links a {
        font-family: var(--font-primary);
        font-size: 24px;
        line-height: 31px;
        font-weight: 400;
        text-align: center;
        padding: 8px 0;
      }
    
      .mobile-menu .btn {
        width: 100%;
      }
    
      .nav-burger[aria-expanded="true"] {
        position: relative;
        z-index: 201;
      }
    }
    
    /* =====================================================================
       Laptop range 1101–1439px: the desktop layout is built from fixed
       Figma widths (660+28+656 etc.) that only fit at 1440. Below that they
       overflowed the viewport (horizontal scrollbar on 1280 laptops).
       Let the paired blocks shrink proportionally; 1440+ is untouched.
       ===================================================================== */
    @media (min-width: 1101px) and (max-width: 1439px) {
      .hero__content,
      .five-ways__content,
      .sp-clarity__content {
        flex: 1 1 0;
        min-width: 0;
      }
    
      .hero__media,
      .five-ways__media,
      .sp-clarity__media,
      .partner__media {
        flex: 0 1 auto;
        min-width: 0;
        width: auto;
        max-width: 50%;
        height: auto;
        aspect-ratio: 1;
      }
    
      .five-ways__media,
      .sp-clarity__media {
        aspect-ratio: 657 / 720;
      }
    
      .partner__media {
        aspect-ratio: 657 / 650;
      }
    
      .footer__content {
        flex: 1 1 auto;
        min-width: 0;
        gap: clamp(32px, 6vw, 146px);
      }
    
      .footer__inner {
        gap: clamp(32px, 5vw, 110px);
      }
    
      .footer__nav {
        flex: 1 1 auto;
        min-width: 0;
        justify-content: space-between;
      }
    
      .footer__col {
        width: auto;
        min-width: 0;
        flex: 1 1 0;
      }
    }
    
    /* =====================================================================
       MOBILE — exact geometry from the Figma "Mobile (375px)" frame
       ===================================================================== */
    @media (max-width: 767px) {
      /* Media blocks: Figma gives explicit sizes at 343 content width */
      .hero__media {
        width: 100%;
        height: auto;
        aspect-ratio: 343 / 560;
      }
    
      .about__media {
        width: 100%;
        max-width: none;
        height: auto;
        aspect-ratio: 343 / 388;
      }
    
      .partner__media {
        width: 100%;
        height: auto;
        aspect-ratio: 343 / 400;
      }
    
      /* Figma stacks the partnership image above the copy */
      .partner__inner {
        flex-direction: column;
      }
    
      .partner__media {
        order: -1;
      }
    
      .partner__content {
        gap: 40px;
      }
    
      /* "Multi-Industry" is Playfair 24/31 in the stats grid */
      .stat--wide .stat__num {
        font-size: 24px;
        line-height: 1.3;
        letter-spacing: -0.24px;
      }
    
      /* Logo slots: 3 x 106x59, gap 12 */
      .who__logos {
        gap: 12px;
      }
    
      .who__logo-slot {
        width: 106px;
        height: 59px;
        flex: 1 1 0;
        min-width: 0;
      }
    
      /* Diagnostic CTA is full-bleed with 40px inner padding, like the CTA banner */
      .diagnostic {
        padding-left: 0;
        padding-right: 0;
      }
    
      .diagnostic .container {
        padding-left: 0;
        padding-right: 0;
        max-width: none;
      }
    
      .diagnostic__panel {
        padding: 50px 40px;
        gap: 28px;
      }
    
      /* Figma has no desktop portrait photo next to the diagnostic panel */
      .diagnostic__media {
        display: none;
      }
    
      /* Footer: 59x59 logomark, centred, 36px rhythm */
      .site-footer {
        padding: 40px 0;
      }
    
      .footer__inner {
        gap: 28px;
        margin-bottom: 36px;
      }
    
      .footer__mark {
        width: 59px;
        align-self: center;
      }
    
      .footer__mark img {
        width: 59px;
        height: 59px;
      }
    }
    
    /* =====================================================================
       "Find the Right Support" — corrections against the Figma desktop frame
       (7:656). Values below are measured, not estimated.
       ===================================================================== */
    
    /* BOOK-2 / BOOK-5 — "убрать полоску": Figma has no rule above the first
       item of either list; only the dividers between items. */
    .sp-receive__item:first-child {
      border-top: 0;
    }
    
    .sp-clarity .accordion__item:first-child,
    .accordion--brand .accordion__item:first-child {
      border-top: 0;
    }
    
    /* BOOK-6 — the photo must bottom-align with the CTA in the right column.
       Figma: left col 640x637 = header 144 + gap 64 + image 400x429;
              right col 640x637 = list 552 + gap 40 + button 45. */
    @media (min-width: 1101px) {
      .sp-receive__inner {
        align-items: flex-start;
      }
    
      .sp-receive__left {
        gap: 64px;
        min-height: 637px;
      }
    
      .sp-receive__media {
        width: 400px;
        height: 429px;
        margin-top: 0;
        flex: 0 0 auto;
      }
    
      .sp-receive__media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    
      .sp-receive__right {
        gap: 40px;
        min-height: 637px;
        padding-top: 0;
      }
    
      /* BOOK-8 / BOOK-9 — Figma spacing inside the "About" and "Partnership"
         columns is larger than what we shipped. */
      .sp-trust__content {
        gap: 64px;
      }
    
      .sp-results__content {
        gap: 64px;
      }
    
      .sp-results__lead {
        margin: 0;
      }
    }
    
    /* BOOK-11 — the 4 "how it works" cells are a fixed 336x418 grid with
       24px padding and an 80px gap between the number and the copy. */
    .sp-how__item {
      gap: 80px;
    }
    
    /* BOOK-1 — support hero re-spaced to the updated Figma frame:
       Hero Text Block gap 40 (copy -> CTA), inner gap 24 (title -> copy),
       copy gap 16 (intro -> list), list gap 12. Text block is vertically
       centred against the 656px image. */
    .sp-hero__inner {
      align-items: center;
    }
    
    .sp-hero__content {
      padding-top: 0;
    }
    
    .sp-hero__title {
      margin-bottom: 24px;
    }
    
    .sp-hero__intro {
      margin-bottom: 16px;
    }
    
    .sp-hero__list {
      gap: 12px;
      margin-bottom: 40px;
    }
    
    .sp-hero__note {
      margin-bottom: 40px;
    }
    
    /* Support hero uses the same 660 + 28 + 656 = 1344 grid as the landing hero */
    .sp-hero__inner {
      gap: 28px;
    }
    
    .sp-hero__content {
      width: 660px;
      max-width: 100%;
      flex: 0 1 660px;
      min-width: 0;
    }
    
    .sp-hero__media {
      flex: 0 0 auto;
    }
    
    /* Figma: intro and bullets run the full 660px column (was clamped to 540) */
    .sp-hero__intro,
    .sp-hero__list li {
      max-width: 660px;
    }
    
    /* Figma "Hero Section": 720 tall, 32px vertical padding (was 40/64) */
    @media (min-width: 1101px) {
      .sp-hero {
        padding: 0;
      }
    
      .sp-hero__inner {
        min-height: 720px;
        padding-top: 32px;
        padding-bottom: 32px;
      }
    }
    
    /* BOOK-3 — sp-clarity (accordion--brand): the title wraps within 541px so
       "…Limited Consistency" breaks to a second line, and the open item's
       title->description gap is 8px (Figma Area-Text gap), not 24. */
    .accordion--brand .accordion__trigger > span:not(.accordion__icon) {
      max-width: 541px;
    }
    
    .accordion--brand .accordion__item.is-open .accordion__trigger {
      padding-bottom: 8px;
    }
    
    @media (max-width: 767px) {
      /* MOB-10 — mobile "How we help" header: badge->title 24, title->desc 12 */
      .stages__header {
        row-gap: 24px;
      }
    
      .stages__intro {
        gap: 12px;
      }
    
      /* MOB-13 — mobile "5 Ways": title -> accordion is 40px (Figma Ways Section gap) */
      .five-ways__content {
        gap: 40px;
        min-height: 0;
        overflow: visible;
      }
    
      .sp-clarity__content {
        min-height: 0;
        overflow: visible;
        gap: 40px;
      }
    
      .faq .accordion,
      .accordion--brand,
      .accordion--faq {
        overflow: visible;
      }
      
      .who__image {
        height: 290px;
      }
      
      .cta-banner__content h2 {
        width: 70%;
      }
      
      .newsletter__inner h2 {
        width: 80%;
      }
      
      .route__item.is-open .route__panel {
        margin-top: 34px;
      }
      
      .past-card__body .h4 {
        margin-bottom: -10px;
      }
      
      .partner__list-block h3 {
        text-transform: uppercase;
      }
      
      .faq__title {
        text-align: left;
      }
      
      .footer__nav {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 10px !important;
      }
      
      .footer__contact {
        align-items: center;
        text-align: center;
      }
      
      
  /* 	find the right support  */
      
      .sp-hero__media {
        margin-top: -170px !important;
      }
      
      .stat__num, .sp-stat__num {
        font-size: 57px;
      }
      
      .sp-stats {
        border-bottom: 0;
      }
      
      .sp-area {
        display: grid;
        grid-template-columns: 1fr 4fr;
      }
      .sp-area__num {
        font-size: 28px !important;
      }
      
      .sp-receive__media img {
        height: 360px;
      }
      
      .sp-how {
        padding: 0 16px;
      }
      .sp-receive__item:nth-child(4) {
        border-bottom: 0;
      }
      
      .sp-trust__media {
        margin-bottom: -15px;
      }
      
      .sp-trust__inner {
        margin-bottom: -110px;
      }
      
      .sp-results__media {
        width: 100% !important;
      }
      
      .sp-results__media > img,
      .sp-results__media .testimonial__media {
        height: 650px !important;
      }
      
      .sp-soft__text {
        width: 65%;
      }
      
      .sp-how__num {
        margin-bottom: -45px;
      }
    }
    
    
    @media (min-width: 768px) {
      .who__text {
        margin-top: -8px;
      }
      
      .past-card__body .h4 {
        margin-bottom: -15px !important;
      }
      
      .sp-stats {
        border-bottom: 0;
      }
      
      .sp-trust__content h2, .sp-results__content h2 {
        margin-bottom: -40px;
      }
      
      .sp-results__media > img,
      .sp-results__media .testimonial__media {
        height: 550px;
      }
      
      .sp-results__list {
        margin-top: -40px;
        margin-bottom: -35px;
      }
    }