@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      background: #f2f4f8;
      min-height: 100vh;
      -webkit-font-smoothing: antialiased;
    }

    .site-page-shell {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
    }

    .site-page-main {
      flex: 1 0 auto;
    }

    .breadcrumb {
      margin-bottom: 18px;
    }

    .breadcrumb ol {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px;
      list-style: none;
      margin: 0;
      padding: 0;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }

    .breadcrumb li {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: rgba(26, 37, 51, 0.56);
    }

    .breadcrumb li + li::before {
      content: "/";
      color: currentColor;
      opacity: 0.45;
    }

    .breadcrumb a {
      color: inherit;
      text-decoration: none;
      transition: color 0.18s ease;
    }

    .breadcrumb a:hover {
      color: #2f6ab1;
    }

    .breadcrumb [aria-current="page"] {
      color: rgba(26, 37, 51, 0.78);
    }

    .procurement-hero .breadcrumb li {
      color: rgba(255, 255, 255, 0.62);
    }

    .procurement-hero .breadcrumb [aria-current="page"] {
      color: rgba(255, 255, 255, 0.9);
    }

    .procurement-hero .breadcrumb a:hover {
      color: #fff;
    }

    h1, h2, h3, h4, h5, h6 {
      font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      font-weight: 500;
    }

    /* ── Header ── */
    header {
      position: sticky;
      top: 0;
      z-index: 1000;
    }

    header::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(249, 251, 254, 0.82) 0%, rgba(239, 244, 250, 0.74) 100%);
      backdrop-filter: blur(24px) saturate(1.06);
      -webkit-backdrop-filter: blur(24px) saturate(1.06);
      border-bottom: 1px solid rgba(79, 101, 132, 0.12);
      box-shadow:
        0 10px 28px rgba(24, 44, 72, 0.055),
        inset 0 -1px 0 rgba(255, 255, 255, 0.46);
      pointer-events: none;
      z-index: 0;
    }

    nav {
      position: relative;
      max-width: 1280px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      padding: 8px 40px;
      height: 64px;
      z-index: 1;
    }

    nav > * {
      position: relative;
      z-index: 1;
    }

    /* Logo */
    .nav-logo {
      display: flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      justify-self: start;
    }

    .logo-mark {
      display: inline-flex;
      width: 32px;
      height: 32px;
      perspective: 400px;
    }

    .logo-mark-svg {
      width: 100%;
      height: 100%;
    }

    .nav-logo:hover .logo-mark {
      animation: hixton-tumble 0.8s cubic-bezier(0.65, 0, 0.35, 1) both;
    }

    .nav-logo:hover .logo-mark-svg {
      animation: hixton-spin 0.8s cubic-bezier(0.65, 0, 0.35, 1) both;
    }

    @keyframes hixton-tumble {
      0%   { transform: rotate3d(0, 0, 0, 0deg); }
      50%  { transform: rotate3d(1, 0, 0, -45deg); }
      100% { transform: rotate3d(0, 0, 0, 0deg); }
    }

    @keyframes hixton-spin {
      0%   { transform: rotateZ(0deg); }
      100% { transform: rotateZ(360deg); }
    }

    @media (prefers-reduced-motion: reduce) {
      .nav-logo:hover .logo-mark,
      .nav-logo:hover .logo-mark-svg { animation: none; }
    }

    .logo-wordmark {
      height: 22px;
      width: auto;
      object-fit: contain;
    }

    .nav-logo .logo-light {
      display: none;
    }

    /* Over-hero: make mark white */
    .over-hero .logo-mark-svg {
      filter: brightness(0) invert(1);
    }

    /* Center links */
    .nav-center {
      display: flex;
      align-items: center;
      gap: 2px;
      padding: 4px;
      border-radius: 980px;
      list-style: none;
      background: transparent;
    }

    .nav-center a {
      display: block;
      text-decoration: none;
      font-size: 14.5px;
      font-weight: 500;
      color: #5a6270;
      padding: 7px 20px;
      border-radius: 980px;
      transition: all 0.2s ease;
      white-space: nowrap;
      background: transparent;
    }

    .nav-center a:hover {
      color: #3b7ddb;
    }

    .nav-center a.active {
      color: #3b7ddb;
      background: transparent;
    }

    /* Dropdown */
    .nav-dropdown {
      position: relative;
    }

    .nav-dropdown-toggle {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-family: inherit;
      font-size: 14.5px;
      font-weight: 500;
      color: #5a6270;
      padding: 7px 20px;
      border-radius: 980px;
      border: none;
      background: transparent;
      cursor: pointer;
      transition: all 0.2s ease;
      white-space: nowrap;
    }

    .nav-dropdown-toggle:hover {
      color: #3b7ddb;
    }

    .nav-dropdown-toggle.active {
      color: #3b7ddb;
    }

    .nav-chevron {
      width: 12px;
      height: 12px;
      transition: transform 0.2s ease;
    }

    .nav-dropdown:hover .nav-chevron {
      transform: rotate(180deg);
    }

    .nav-dropdown-menu {
      position: absolute;
      top: calc(100% + 24px);
      left: 50%;
      transform: translateX(-50%);
      min-width: 280px;
      background:
        linear-gradient(180deg, rgba(249, 251, 254, 0.82) 0%, rgba(236, 242, 249, 0.72) 100%);
      backdrop-filter: blur(28px) saturate(1.08);
      -webkit-backdrop-filter: blur(28px) saturate(1.08);
      will-change: transform, opacity;
      overflow: visible;
      border-radius: 16px;
      border: 1px solid rgba(255, 255, 255, 0.62);
      box-shadow:
        0 18px 42px rgba(28, 52, 82, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.54);
      padding: 8px;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.2s ease, visibility 0.2s ease;
      z-index: 2000;
    }

    .nav-dropdown:hover .nav-dropdown-menu {
      opacity: 1;
      visibility: visible;
    }

    .nav-dropdown-item {
      position: relative;
    }

    .nav-dropdown-item + .nav-dropdown-item {
      margin-top: 2px;
    }

    .nav-dropdown-menu a {
      display: flex;
      align-items: center;
      gap: 14px;
      text-decoration: none;
      padding: 12px 14px;
      border-radius: 12px;
      transition: background 0.15s ease;
    }

    .nav-dropdown-menu a:hover {
      background: rgba(255, 255, 255, 0.48);
    }

    .dropdown-icon {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.5);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .dropdown-icon svg {
      width: 22px;
      height: 22px;
      color: #5a6270;
    }

    .dropdown-text {
      flex: 1;
      min-width: 0;
    }

    .dropdown-title {
      display: block;
      font-size: 14.5px;
      font-weight: 500;
      color: #1a2533;
    }

    .dropdown-desc {
      display: block;
      font-size: 13px;
    color: #0000005c;
      margin-top: 2px;
    }

    .dropdown-arrow {
      width: 16px;
      height: 16px;
    color: #0000005c;
      flex-shrink: 0;
      opacity: 0;
      transform: translateX(-4px);
      transition: opacity 0.15s ease, transform 0.15s ease;
    }

    .nav-dropdown-menu a:hover .dropdown-arrow {
      opacity: 1;
      transform: translateX(0);
    }

    .dropdown-submenu-chevron {
      width: 14px;
      height: 14px;
      color: #00000074;
      flex-shrink: 0;
      transition: transform 0.18s ease;
    }

    .nav-dropdown-item-has-children:hover > .nav-dropdown-link .dropdown-submenu-chevron,
    .nav-dropdown-item-has-children:focus-within > .nav-dropdown-link .dropdown-submenu-chevron {
      transform: translateX(2px);
    }

    .nav-submenu {
      position: absolute;
      top: 0;
      left: calc(100% - 6px);
      min-width: 280px;
      max-width: 340px;
      padding: 8px;
      border-radius: 16px;
      border: 1px solid rgba(255, 255, 255, 0.68);
      background: rgba(255, 255, 255, 0.96);
      backdrop-filter: blur(34px) saturate(1.08);
      -webkit-backdrop-filter: blur(34px) saturate(1.08);
      box-shadow:
        0 18px 42px rgba(28, 52, 82, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.54);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateX(8px);
      transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease;
      z-index: 2200;
    }

    .nav-dropdown-item-has-children:hover > .nav-submenu,
    .nav-dropdown-item-has-children:focus-within > .nav-submenu,
    .nav-dropdown-item-has-children > .nav-dropdown-link:focus + .nav-submenu,
    .nav-dropdown-item-has-children > .nav-submenu:focus-within {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateX(0);
    }

    .nav-submenu .nav-submenu-link {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 10px 12px;
      border-radius: 12px;
      white-space: normal;
    }

    .nav-submenu .nav-submenu-link:hover,
    .nav-submenu .nav-submenu-link:focus-visible {
      background: rgba(255, 255, 255, 0.62);
      outline: none;
    }

    .nav-submenu-icon {
      width: 38px;
      height: 38px;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.56);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .nav-submenu-icon svg {
      width: 19px;
      height: 19px;
      color: #5a6270;
    }

    .nav-submenu-text {
      flex: 1;
      min-width: 0;
    }

    .nav-submenu-title {
      display: block;
      font-size: 13.5px;
      font-weight: 500;
      color: #1a2533;
    }

    .nav-submenu-desc {
      display: block;
      margin-top: 2px;
      font-size: 12.5px;
      line-height: 1.35;
      color: #0000005c;
    }

    .nav-submenu-arrow {
      width: 14px;
      height: 14px;
      color: #0000005c;
      flex-shrink: 0;
      opacity: 0;
      transform: translateX(-4px);
      transition: opacity 0.15s ease, transform 0.15s ease;
    }

    .nav-submenu .nav-submenu-link:hover .nav-submenu-arrow,
    .nav-submenu .nav-submenu-link:focus-visible .nav-submenu-arrow {
      opacity: 1;
      transform: translateX(0);
    }

    /* Over-hero dropdown styles */
    .over-hero .nav-dropdown-toggle {
      color: rgba(255, 255, 255, 0.8);
    }

    .over-hero .nav-dropdown-toggle:hover,
    .over-hero .nav-dropdown-toggle.active {
      color: #fff;
    }

    .over-hero .nav-dropdown-menu {
      background:
        linear-gradient(180deg, rgba(16, 30, 53, 0.72) 0%, rgba(10, 23, 43, 0.64) 100%);
      backdrop-filter: blur(34px) saturate(1.06);
      -webkit-backdrop-filter: blur(34px) saturate(1.06);
      border-color: rgba(255, 255, 255, 0.16);
    }

    .over-hero .nav-dropdown-menu a:hover {
      background: rgba(255, 255, 255, 0.1);
    }

    .over-hero .dropdown-title {
      color: #fff;
    }

    .over-hero .dropdown-desc {
      color: rgba(255, 255, 255, 0.6);
    }

    .over-hero .dropdown-icon {
      background: rgba(255, 255, 255, 0.12);
    }

    .over-hero .dropdown-icon svg {
      color: rgba(255, 255, 255, 0.8);
    }

    .over-hero .dropdown-arrow {
      color: rgba(255, 255, 255, 0.6);
    }

    .over-hero .dropdown-submenu-chevron {
      color: rgba(255, 255, 255, 0.68);
    }

    .over-hero .nav-submenu {
      background: rgba(15, 30, 55, 0.86);
      border-color: rgba(255, 255, 255, 0.12);
    }

    .over-hero .nav-submenu .nav-submenu-link:hover,
    .over-hero .nav-submenu .nav-submenu-link:focus-visible {
      background: rgba(255, 255, 255, 0.1);
    }

    .over-hero .nav-submenu-title {
      color: #fff;
    }

    .over-hero .nav-submenu-desc,
    .over-hero .nav-submenu-arrow {
      color: rgba(255, 255, 255, 0.62);
    }

    .over-hero .nav-submenu-icon {
      background: rgba(255, 255, 255, 0.12);
    }

    .over-hero .nav-submenu-icon svg {
      color: rgba(255, 255, 255, 0.82);
    }

    /* Right side — CTA */
    .nav-right {
      display: flex;
      align-items: center;
      gap: 16px;
      justify-self: end;
    }

    .nav-cta {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      text-decoration: none;
      font-size: 14px;
      font-weight: 500;
      color: #fff;
      padding: 9px 22px;
      border-radius: 980px;
      background: #0e0f19;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
      transition: all 0.2s ease;
    }

    .nav-cta:hover {
      transform: translateY(-1px);
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    }

    .nav-cta svg {
      width: 14px;
      height: 14px;
      transition: transform 0.2s ease;
    }

    .nav-cta:hover svg {
      transform: translateX(2px);
    }

    /* Header over hero — dark glass, white text */
    .over-hero::before {
      background:
        linear-gradient(180deg, rgba(14, 26, 49, 0.7) 0%, rgba(9, 20, 40, 0.62) 100%);
      backdrop-filter: blur(32px) saturate(1.05);
      -webkit-backdrop-filter: blur(32px) saturate(1.05);
      border-bottom-color: rgba(255, 255, 255, 0.1);
      box-shadow:
        0 12px 34px rgba(0, 0, 0, 0.14),
        inset 0 -1px 0 rgba(255, 255, 255, 0.08);
    }

    .over-hero .nav-center a {
      color: rgba(255, 255, 255, 0.8);
    }

    .over-hero .nav-center a:hover,
    .over-hero .nav-center a.active {
      color: #fff;
    }

    .over-hero .nav-logo .logo-dark {
      display: none;
    }

    .over-hero .nav-logo .logo-light {
      display: block;
    }

    .over-hero .nav-cta {
      background: #fff;
      color: #1a2533;
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    }

    .over-hero .nav-cta:hover {
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    }

    .over-hero .nav-toggle span {
      background: #fff;
    }

    /* Mobile */
    .nav-toggle {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 6px;
      background: none;
      border: none;
    }

    .nav-toggle span {
      display: block;
      width: 22px;
      height: 2px;
      border-radius: 2px;
      background: #5a6270;
      transition: all 0.3s ease;
    }

    /* ── Hero ── */
    .hero-shell {
      margin: 24px 24px 0;
    }

    .hero {
      position: relative;
      overflow: hidden;
      margin: 0;
      border-radius: 32px;
      min-height: clamp(500px, 74vh, 760px);
      display: flex;
      align-items: center;
      justify-content: center;
      background: #132c54;
      isolation: isolate;
    }

    .hero-bg-wrap {
      position: absolute;
      inset: 0;
      overflow: hidden;
      border-radius: inherit;
      z-index: 0;
    }

    .hero-bg {
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 80% 60% at 30% 40%, #3b7ddb 0%, transparent 60%),
        radial-gradient(ellipse 70% 70% at 70% 60%, #4a8ad4 0%, transparent 55%),
        radial-gradient(ellipse 60% 50% at 50% 50%, #2c5fa0 0%, transparent 50%);
      background-color: #132c54;
    }

    .hero-blob {
      position: absolute;
      border-radius: 50%;
      filter: blur(80px);
      will-change: transform;
    }

    .hero-blob-1 {
      width: 55%;
      height: 55%;
      top: 0%;
      left: 5%;
      background: radial-gradient(circle, #3b7ddb 0%, transparent 70%);
      animation: blob-1 14s ease-in-out infinite;
    }

    .hero-blob-2 {
      width: 50%;
      height: 50%;
      bottom: 0%;
      right: 5%;
      background: radial-gradient(circle, #5ba3d9 0%, transparent 70%);
      animation: blob-2 12s ease-in-out infinite;
    }

    .hero-blob-3 {
      width: 40%;
      height: 40%;
      top: 20%;
      right: 20%;
      background: radial-gradient(circle, #6db3e8 0%, transparent 70%);
      animation: blob-3 16s ease-in-out infinite;
    }

    .hero-blob-4 {
      width: 35%;
      height: 35%;
      bottom: 20%;
      left: 25%;
      background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
      animation: blob-4 20s ease-in-out infinite;
    }

    @keyframes blob-1 {
      0%, 100% { transform: translate(0%, 0%) scale(1); }
      20% { transform: translate(18%, 14%) scale(1.15); }
      40% { transform: translate(-12%, 20%) scale(0.9); }
      60% { transform: translate(15%, -10%) scale(1.1); }
      80% { transform: translate(-8%, -16%) scale(0.95); }
    }

    @keyframes blob-2 {
      0%, 100% { transform: translate(0%, 0%) scale(1); }
      20% { transform: translate(-16%, -12%) scale(1.12); }
      40% { transform: translate(14%, -18%) scale(0.88); }
      60% { transform: translate(-20%, 10%) scale(1.08); }
      80% { transform: translate(10%, 16%) scale(0.93); }
    }

    @keyframes blob-3 {
      0%, 100% { transform: translate(0%, 0%) scale(1); }
      20% { transform: translate(-14%, 18%) scale(0.9); }
      40% { transform: translate(18%, 8%) scale(1.15); }
      60% { transform: translate(6%, -16%) scale(0.92); }
      80% { transform: translate(-18%, -6%) scale(1.1); }
    }

    @keyframes blob-4 {
      0%, 100% { transform: translate(0%, 0%) scale(1); }
      20% { transform: translate(16%, -14%) scale(1.1); }
      40% { transform: translate(-14%, 12%) scale(0.9); }
      60% { transform: translate(-10%, -18%) scale(1.12); }
      80% { transform: translate(12%, 14%) scale(0.92); }
    }

    .hero-content {
      position: relative;
      z-index: 1;
      text-align: center;
      max-width: 720px;
      padding: 68px 24px;
    }

    .hero-content h1 {
      font-size: 64px;
      font-weight: 500;
      letter-spacing: -2px;
      line-height: 1.08;
      color: #fff;
      margin-bottom: 24px;
    }

    .hero-content p {
      font-size: 18px;
      line-height: 1.7;
      color: rgba(255, 255, 255, 0.8);
      max-width: 520px;
      margin: 0 auto 40px;
    }

    .hero-cta {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      font-size: 14.5px;
      font-weight: 500;
      color: #1a2533;
      padding: 12px 28px;
      border-radius: 980px;
      background: #fff;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
      transition: all 0.2s ease;
    }

    .hero-cta:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 28px rgba(0, 0, 0, 0.2);
    }

    .hero-cta svg {
      width: 15px;
      height: 15px;
      transition: transform 0.2s ease;
    }

    .hero-cta:hover svg {
      transform: translateX(3px);
    }

    .hero-highlights {
      margin-top: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .hero-highlight-pill {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.03em;
      color: rgba(255, 255, 255, 0.84);
      padding: 8px 14px;
      border-radius: 980px;
      border: 1px solid rgba(255, 255, 255, 0.24);
      background: rgba(255, 255, 255, 0.08);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
    }

    @media (max-width: 768px) {
      .hero-shell {
        margin: 16px 16px 0;
      }

      .hero {
        border-radius: 24px;
        min-height: clamp(420px, 62vh, 620px);
      }

      .hero-content {
        padding: 54px 20px;
      }

      .hero-content h1 {
        font-size: 36px;
        letter-spacing: -1px;
      }

      .hero-content p {
        font-size: 16px;
      }
    }

    /* ── Clients section ── */
    .clients {
      max-width: 1280px;
      margin: 72px auto 0;
      padding: 0 24px;
      text-align: center;
    }

    .clients-label {
      font-size: 13px;
      font-weight: 500;
      color: #8a919c;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      margin-bottom: 28px;
    }

    .clients-track-wrapper {
      overflow: hidden;
      mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
      -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    }

    .clients-track {
      display: flex;
      align-items: center;
      gap: 64px;
      width: max-content;
      animation: scroll-logos 45s linear infinite;
    }

    .clients-track img {
      height: 32px;
      width: auto;
      opacity: 0.4;
      filter: grayscale(1) contrast(0.8) brightness(0.7);
      transition: opacity 0.3s ease, filter 0.3s ease;
      flex-shrink: 0;
    }

    .clients-track img:hover {
      opacity: 0.6;
      filter: grayscale(1) contrast(0.9) brightness(0.6);
    }

    @keyframes scroll-logos {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    /* ── Reimagined homepage sections ── */
    .home-expertise,
    .home-services-reimagined,
    .home-house-framework {
      max-width: 1280px;
      margin: 96px auto 0;
      padding: 0 24px;
    }

    .home-contact-reimagined {
      max-width: min(calc(100% - 48px), 1280px);
      margin: 96px auto 0;
      padding: 0;
    }

    .home-section-heading {
      max-width: 760px;
      margin-bottom: 34px;
    }

    .home-section-heading-centered {
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }

    .home-section-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #8c6d3f;
      margin-bottom: 10px;
    }

    .home-section-heading h2 {
      font-size: 44px;
      font-weight: 500;
      letter-spacing: -1.3px;
      line-height: 1.1;
      color: #1a2533;
      margin-bottom: 12px;
    }

    .home-section-heading p {
      font-size: 16px;
      line-height: 1.75;
      color: #5a6270;
    }

    .home-expertise-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 20px;
    }

    .home-expertise-card {
      background: rgba(255, 255, 255, 0.4);
      border: 1px solid rgba(255, 255, 255, 0.54);
      border-radius: 20px;
      box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.03),
        0 1px 0 rgba(255, 255, 255, 0.62) inset;
      padding: 30px;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .home-expertise-card h3 {
      font-size: 24px;
      line-height: 1.25;
      letter-spacing: -0.45px;
      color: #1a2533;
    }

    .home-expertise-card p {
      font-size: 15px;
      line-height: 1.75;
      color: #4f5a69;
    }

    .home-expertise-card a {
      margin-top: auto;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      color: #245a9f;
      font-size: 14px;
      font-weight: 600;
    }

    .home-expertise-card a svg {
      width: 14px;
      height: 14px;
    }

    .home-services-reimagined {
      margin-top: 92px;
    }

    .home-services-reimagined .home-section-heading {
      max-width: 700px;
      margin-bottom: 22px;
    }

    .home-services-kicker {
      max-width: 560px;
      margin: 0 auto;
      font-size: 15px;
      line-height: 1.7;
      color: #5e6978;
    }

    .home-services-reveal {
      position: relative;
      padding-top: 10px;
      isolation: isolate;
      overflow: hidden;
    }

    .home-services-reveal::before {
      content: '';
      position: absolute;
      inset: 18px 14px auto;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(59, 125, 219, 0.18), rgba(91, 163, 217, 0.42), rgba(59, 125, 219, 0.18), transparent);
      opacity: 0;
      pointer-events: none;
    }

    .home-services-reveal-sweep {
      position: absolute;
      inset: -18px;
      pointer-events: none;
      opacity: 0;
      background:
        radial-gradient(circle at 12% 34%, rgba(91, 163, 217, 0.16), transparent 22%),
        radial-gradient(circle at 88% 12%, rgba(59, 125, 219, 0.12), transparent 18%),
        linear-gradient(110deg, transparent 28%, rgba(91, 163, 217, 0.18) 49%, transparent 70%);
      transform: translateX(-10%) scaleX(0.88);
      filter: blur(1px);
      z-index: 0;
    }

    .home-services-reveal-sweep::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.42), transparent);
      transform: translateX(-110%);
    }

    .home-services-compact-grid {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
    }

    .home-service-node {
      min-height: 168px;
      padding: 18px 16px;
      border-radius: 16px;
      border: 1px solid rgba(59, 125, 219, 0.14);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(246, 250, 255, 0.8) 100%);
      box-shadow:
        0 8px 20px rgba(26, 37, 51, 0.04),
        0 1px 0 rgba(255, 255, 255, 0.72) inset;
      text-decoration: none;
      color: inherit;
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
      opacity: 0;
      transform: translate3d(0, 18px, 0) scale(0.985);
      animation: none;
      transition:
        transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1),
        border-color 0.28s ease,
        box-shadow 0.28s ease,
        background-color 0.28s ease;
      will-change: transform, opacity;
    }

    .home-service-node::before {
      content: '';
      position: absolute;
      inset: 0 0 auto;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(59, 125, 219, 0.7), rgba(91, 163, 217, 0.95), rgba(59, 125, 219, 0.7), transparent);
      transform: scaleX(0.18);
      transform-origin: left center;
      opacity: 0;
      transition: transform 0.28s ease, opacity 0.28s ease;
      pointer-events: none;
    }

    .home-service-node:hover {
      transform: translate3d(0, -5px, 0) scale(1.01);
      border-color: rgba(59, 125, 219, 0.28);
      box-shadow:
        0 16px 32px rgba(26, 37, 51, 0.08),
        0 1px 0 rgba(255, 255, 255, 0.72) inset;
    }

    .home-service-node:hover::before {
      opacity: 1;
      transform: scaleX(1);
    }

    .home-services-reimagined.is-visible .home-services-reveal::before {
      animation: home-services-rail-in 780ms ease both;
    }

    .home-services-reimagined.is-visible .home-services-reveal-sweep {
      animation: home-services-sweep 1100ms cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .home-services-reimagined.is-visible .home-services-reveal-sweep::after {
      animation: home-services-sweep-glint 1100ms cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .home-services-reimagined.is-visible .home-service-node {
      animation: home-service-node-rise 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
      animation-delay: var(--service-delay, 0ms);
    }

    .home-service-node:focus-visible {
      outline: 2px solid rgba(59, 125, 219, 0.6);
      outline-offset: 3px;
    }

    .home-service-node-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 12px;
    }

    .home-service-track-index {
      font-size: 11.5px;
      font-weight: 700;
      letter-spacing: 0.1em;
      color: #8c6d3f;
      font-variant-numeric: tabular-nums;
    }

    .home-service-track-phase {
      display: inline-flex;
      align-items: center;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.09em;
      text-transform: uppercase;
      color: #8c6d3f;
      padding: 4px 9px;
      border-radius: 980px;
      background: rgba(140, 109, 63, 0.1);
    }

    .home-service-node h3 {
      font-size: 20px;
      line-height: 1.24;
      letter-spacing: -0.32px;
      color: #1a2533;
      margin-bottom: 8px;
    }

    .home-service-track-description {
      font-size: 13.5px;
      line-height: 1.62;
      color: #5b6675;
      margin-bottom: 14px;
    }

    .home-service-track-link {
      margin-top: auto;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: #245a9f;
      font-size: 13.5px;
      font-weight: 600;
    }

    .home-service-track-link svg {
      width: 14px;
      height: 14px;
      transition: transform 0.24s ease;
    }

    @keyframes home-services-rail-in {
      from {
        opacity: 0;
        transform: scaleX(0.22);
      }

      35% {
        opacity: 1;
      }

      to {
        opacity: 0.85;
        transform: scaleX(1);
      }
    }

    @keyframes home-services-sweep {
      0% {
        opacity: 0;
        transform: translateX(-10%) scaleX(0.88);
      }

      28% {
        opacity: 1;
      }

      100% {
        opacity: 0;
        transform: translateX(10%) scaleX(1.08);
      }
    }

    @keyframes home-services-sweep-glint {
      0% {
        transform: translateX(-110%);
        opacity: 0;
      }

      32% {
        opacity: 1;
      }

      100% {
        transform: translateX(110%);
        opacity: 0;
      }
    }

    .home-service-node:hover .home-service-track-link svg {
      transform: translateX(5px);
    }

    .home-house-framework {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 22px;
      align-items: stretch;
    }

    .home-house-framework-copy,
    .home-house-framework-panel {
      border-radius: 22px;
      padding: 32px;
    }

    .home-house-framework-copy {
      background: rgba(255, 255, 255, 0.45);
      backdrop-filter: blur(24px) saturate(1.3);
      -webkit-backdrop-filter: blur(24px) saturate(1.3);
    }

    .home-house-framework-label {
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #8c6d3f;
      margin-bottom: 10px;
    }

    .home-house-framework-copy h2 {
      font-size: 39px;
      font-weight: 500;
      letter-spacing: -1px;
      line-height: 1.14;
      color: #1a2533;
      margin-bottom: 14px;
    }

    .home-house-framework-copy p {
      font-size: 15.5px;
      line-height: 1.8;
      color: #526174;
      margin-bottom: 20px;
    }

    .home-house-framework-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      font-size: 14px;
      font-weight: 600;
      color: #fff;
      background: #0e0f19;
      border-radius: 980px;
      padding: 10px 18px;
    }

    .home-house-framework-link svg {
      width: 14px;
      height: 14px;
    }

    .home-house-framework-panel {
      background: linear-gradient(145deg, #132c54 0%, #214779 72%, #2d6199 100%);
      color: #fff;
      position: relative;
      overflow: hidden;
    }

    .home-house-framework-panel::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at top right, rgba(121, 186, 235, 0.35), transparent 55%);
      pointer-events: none;
    }

    .home-house-framework-panel h3 {
      position: relative;
      z-index: 1;
      font-size: 28px;
      letter-spacing: -0.5px;
      margin-bottom: 18px;
    }

    .home-house-framework-panel ul {
      position: relative;
      z-index: 1;
      list-style: none;
      display: grid;
      gap: 12px;
      padding: 0;
    }

    .home-house-framework-panel li {
      position: relative;
      padding-left: 16px;
      font-size: 14.5px;
      line-height: 1.76;
      color: rgba(255, 255, 255, 0.88);
    }

    .home-house-framework-panel li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 11px;
      width: 6px;
      height: 6px;
      border-radius: 999px;
      background: #9dd2f4;
    }

    .testimonials-more-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 24px;
      text-decoration: none;
      font-size: 14px;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.88);
    }

    .testimonials-more-link svg {
      width: 14px;
      height: 14px;
    }

    .home-contact-reimagined {
      position: relative;
      overflow: hidden;
      border-radius: 24px;
      padding: 0;
      background:
        radial-gradient(circle at 8% 12%, rgba(59, 125, 219, 0.65) 0%, rgba(59, 125, 219, 0) 32%),
        radial-gradient(circle at 40% 20%, rgba(123, 188, 241, 0.6) 0%, rgba(123, 188, 241, 0) 32%),
        radial-gradient(circle at 88% 8%, rgba(206, 226, 255, 0.9) 0%, rgba(206, 226, 255, 0) 38%),
        radial-gradient(circle at 14% 90%, rgba(191, 215, 255, 0.48) 0%, rgba(191, 215, 255, 0) 28%),
        linear-gradient(145deg, #eef5ff 0%, #d8eaff 38%, #b8d4f5 72%, #d4e5ff 100%);
      color: #1a2533;
      text-align: left;
    }

    .home-contact-reimagined-glow {
      position: absolute;
      width: 460px;
      height: 460px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(129, 189, 240, 0.3) 0%, rgba(129, 189, 240, 0) 68%);
      filter: blur(10px);
      top: -220px;
      right: -160px;
      pointer-events: none;
    }

    .home-contact-reimagined-shell {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
      align-items: center;
      gap: 48px;
      padding: 52px 52px 48px;
    }

    .home-contact-reimagined-intro {
      max-width: 580px;
    }

    .home-contact-reimagined-label {
      font-size: 11.5px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #2f5ea8;
      margin-bottom: 14px;
      font-weight: 700;
    }

    .home-contact-reimagined h2 {
      font-size: clamp(32px, 4vw, 46px);
      line-height: 1.08;
      letter-spacing: -1.4px;
      margin-bottom: 14px;
      color: #1a2533;
      font-weight: 500;
    }

    .home-contact-reimagined-copy {
      font-size: 15.5px;
      line-height: 1.75;
      color: rgba(36, 58, 92, 0.78);
      max-width: 480px;
    }

    .home-contact-reimagined-actions {
      display: grid;
      gap: 0;
      align-content: start;
      background: rgba(255, 255, 255, 0.55);
      border: 1px solid rgba(255, 255, 255, 0.7);
      border-radius: 16px;
      padding: 24px 28px;
      backdrop-filter: blur(12px);
      box-shadow: 0 4px 20px rgba(26, 37, 51, 0.06), inset 0 1px 0 rgba(255,255,255,0.8);
    }

    .home-contact-reimagined-availability {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #5a7caa;
    }

    .home-contact-reimagined-channels {
      display: grid;
      gap: 0;
      margin-bottom: 20px;
    }

    .home-contact-reimagined-channels a {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 18px;
      text-decoration: none;
      padding: 12px 0;
      color: #1d314b;
      border-bottom: 1px solid rgba(59, 125, 219, 0.1);
      transition: color 0.2s ease;
    }

    .home-contact-reimagined-channels a:last-child {
      border-bottom: none;
    }

    .home-contact-reimagined-channels a:hover {
      color: #2f6ab1;
    }

    .home-contact-reimagined-channels a span {
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: #5a7caa;
      flex-shrink: 0;
    }

    .home-contact-reimagined-channels a strong {
      font-size: 14.5px;
      font-weight: 600;
      letter-spacing: -0.01em;
      color: #1a2d47;
    }

    .home-contact-reimagined-cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      text-decoration: none;
      border-radius: 10px;
      font-size: 14px;
      font-weight: 600;
      color: #fff;
      background: #2f6ab1;
      padding: 13px 22px;
      transition: background 0.2s ease, transform 0.15s ease;
      width: 100%;
    }

    .home-contact-reimagined-cta:hover {
      background: #2460a0;
      transform: translateY(-1px);
    }

    .home-contact-reimagined-cta:focus-visible {
      outline: 2px solid rgba(59, 125, 219, 0.5);
      outline-offset: 3px;
    }

    .home-contact-reimagined-cta svg {
      width: 14px;
      height: 14px;
    }

    .home-contact-reimagined-footnote {
      font-size: 12px;
      line-height: 1.6;
      color: rgba(47, 80, 130, 0.6);
      text-align: center;
      margin-top: 10px;
    }

    @media (max-width: 1080px) {
      .home-expertise-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .home-services-compact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
      }

      .home-house-framework {
        grid-template-columns: 1fr;
      }

      .home-section-heading h2 {
        font-size: 36px;
      }

      .home-house-framework-copy h2 {
        font-size: 34px;
      }

      .home-contact-reimagined-shell {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .home-contact-reimagined h2 {
        font-size: 38px;
      }

      .home-contact-reimagined-actions {
        max-width: 560px;
      }
    }

    @media (max-width: 768px) {
      .hero-highlights {
        gap: 8px;
      }

      .hero-highlight-pill {
        font-size: 11px;
      }

      .home-expertise,
      .home-services-reimagined,
      .home-house-framework {
        margin-top: 72px;
        padding: 0 16px;
      }

      .home-contact-reimagined {
        max-width: min(calc(100% - 32px), 1280px);
        margin: 72px auto 0;
      }

      .home-section-heading h2 {
        font-size: 29px;
        letter-spacing: -0.8px;
      }

      .home-section-heading p {
        font-size: 15px;
      }

      .home-expertise-grid {
        grid-template-columns: 1fr;
      }

      .home-expertise-card,
      .home-house-framework-copy,
      .home-house-framework-panel {
        padding: 24px;
      }

      .home-contact-reimagined-shell {
        padding: 28px 22px 24px;
        gap: 18px;
      }

      .home-services-kicker {
        font-size: 15px;
      }

      .home-services-compact-grid {
        grid-template-columns: 1fr;
        gap: 12px;
      }

      .home-service-node {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(0.985);
        padding: 20px;
        min-height: 0;
      }

      .home-service-node h3 {
        font-size: 21px;
      }

      .home-service-track-description {
        margin-bottom: 14px;
      }

      .home-expertise-card h3 {
        font-size: 22px;
      }

      .home-house-framework-copy h2 {
        font-size: 29px;
      }

      .home-contact-reimagined h2 {
        font-size: 31px;
        letter-spacing: -0.8px;
      }

      .home-contact-reimagined-copy {
        font-size: 15px;
      }

      .home-contact-reimagined-availability {
        font-size: 11px;
      }

      .home-contact-reimagined-channels a strong {
        font-size: 14.5px;
      }

      .home-contact-reimagined-cta {
        width: 100%;
      }
    }

    /* ── Services preview (home page) ── */
    .services-preview {
      max-width: 1320px;
      margin: 96px auto 0;
      padding: 0 24px;
    }

    .services-preview-heading {
      text-align: center;
      margin: 0 auto 24px;
    }

    .services-preview-heading h2 {
      font-size: clamp(2.25rem, 4vw, 4.25rem);
      font-weight: 500;
      letter-spacing: -0.06em;
      color: #05070c;
      line-height: 0.98;
      max-width: 900px;
      margin: 0 auto 22px;
    }

    .services-preview-sub {
      font-size: clamp(1rem, 1.25vw, 1.18rem);
      line-height: 1.65;
      color: #202634;
      max-width: 620px;
      margin: 0 auto;
    }

    .services-preview-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }

    .services-preview-compare {
      margin-top: 56px;
    }

    .services-preview-compare-heading {
      margin: 0 0 26px;
      text-align: center;
    }

    .services-preview-compare-heading p {
      font-size: 0.8rem;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: rgba(59, 94, 150, 0.62);
      margin-bottom: 10px;
    }

    .services-preview-compare-heading h3 {
      font-size: clamp(2rem, 3vw, 3rem);
      font-weight: 500;
      letter-spacing: -0.05em;
      line-height: 1;
      color: #10131d;
    }

    .services-preview-compare-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }

    .services-preview-compare-card {
      position: relative;
      min-height: 620px;
      padding: 34px;
      padding-top: 88px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      overflow: hidden;
      border-radius: 8px;
      background:
        radial-gradient(circle at 12% 10%, rgba(59, 125, 219, 0.72) 0%, rgba(59, 125, 219, 0) 34%),
        radial-gradient(circle at 44% 22%, rgba(123, 199, 241, 0.7) 0%, rgba(123, 199, 241, 0) 34%),
        radial-gradient(circle at 86% 10%, rgba(206, 226, 255, 0.94) 0%, rgba(206, 226, 255, 0) 40%),
        radial-gradient(circle at 12% 88%, rgba(191, 215, 255, 0.52) 0%, rgba(191, 215, 255, 0) 30%),
        linear-gradient(145deg, #eef5ff 0%, #d6e6ff 36%, #b2d1f4 72%, #d8e3ff 100%);
      color: #241f2c;
      transition: transform 220ms ease;
    }

    .services-preview-compare-card:nth-child(2) {
      background:
        radial-gradient(circle at 10% 14%, rgba(88, 151, 226, 0.7) 0%, rgba(88, 151, 226, 0) 34%),
        radial-gradient(circle at 36% 28%, rgba(166, 209, 246, 0.64) 0%, rgba(166, 209, 246, 0) 34%),
        radial-gradient(circle at 84% 12%, rgba(218, 233, 255, 0.94) 0%, rgba(218, 233, 255, 0) 42%),
        radial-gradient(circle at 18% 86%, rgba(198, 218, 255, 0.48) 0%, rgba(198, 218, 255, 0) 28%),
        linear-gradient(145deg, #f0f6ff 0%, #dbe9ff 36%, #b9d5f5 72%, #dce6ff 100%);
    }

    .services-preview-compare-card:nth-child(3) {
      background:
        radial-gradient(circle at 8% 18%, rgba(71, 137, 220, 0.7) 0%, rgba(71, 137, 220, 0) 34%),
        radial-gradient(circle at 32% 24%, rgba(149, 201, 244, 0.64) 0%, rgba(149, 201, 244, 0) 34%),
        radial-gradient(circle at 84% 12%, rgba(227, 238, 255, 0.94) 0%, rgba(227, 238, 255, 0) 42%),
        radial-gradient(circle at 86% 82%, rgba(186, 226, 236, 0.44) 0%, rgba(186, 226, 236, 0) 28%),
        linear-gradient(145deg, #eef5ff 0%, #d6e7ff 36%, #b4d3f3 72%, #d8ecf7 100%);
    }

    .services-preview-compare-card:nth-child(4) {
      background:
        radial-gradient(circle at 14% 16%, rgba(77, 143, 223, 0.7) 0%, rgba(77, 143, 223, 0) 34%),
        radial-gradient(circle at 38% 22%, rgba(158, 205, 245, 0.64) 0%, rgba(158, 205, 245, 0) 34%),
        radial-gradient(circle at 84% 12%, rgba(221, 235, 255, 0.94) 0%, rgba(221, 235, 255, 0) 42%),
        radial-gradient(circle at 18% 84%, rgba(202, 219, 255, 0.46) 0%, rgba(202, 219, 255, 0) 28%),
        linear-gradient(145deg, #eef5ff 0%, #d8e8ff 36%, #b8d4f4 72%, #dbe2ff 100%);
    }

    .services-preview-compare-card:hover {
      transform: translateY(-4px);
    }

    .services-preview-compare-copy {
      width: 100%;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding-top: 0;
    }

    .services-preview-compare-icon {
      position: absolute;
      top: 28px;
      left: 28px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: rgba(33, 73, 127, 0.74);
    }

    .services-preview-compare-icon svg {
      width: 30px;
      height: 30px;
      stroke-width: 1.5;
    }

    .services-preview-compare-card h2,
    .services-preview-compare-card h3 {
      font-size: clamp(2.2rem, 2.8vw, 3rem);
      font-weight: 500;
      letter-spacing: -0.055em;
      line-height: 0.95;
      color: rgba(34, 27, 39, 0.96);
      margin-bottom: 18px;
    }

    .services-preview-compare-eyebrow {
      max-width: 16ch;
      font-size: 1.06rem;
      line-height: 1.22;
      letter-spacing: -0.03em;
      color: rgba(33, 47, 72, 0.88);
      margin-bottom: 0;
    }

    .services-preview-compare-card ul {
      list-style: none;
      padding: 0;
      margin: 0;
      margin-top: auto;
      padding-top: 24px;
      display: grid;
      gap: 10px;
    }

    .services-preview-compare-card li {
      position: relative;
      padding-left: 18px;
      font-size: 0.95rem;
      line-height: 1.35;
      color: rgba(36, 53, 82, 0.8);
    }

    .services-preview-compare-card li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 0.58em;
      width: 6px;
      height: 6px;
      border-radius: 999px;
      background: rgba(58, 110, 204, 0.46);
      transform: translateY(-50%);
    }

    .services-preview-compare-link {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      margin-top: 28px;
      min-height: 48px;
      padding: 14px 22px;
      border-radius: 999px;
      background: #090a0f;
      color: #fff;
      font-size: 0.98rem;
      font-weight: 600;
      line-height: 1;
      text-decoration: none;
      opacity: 0;
      transform: translateY(10px);
      pointer-events: none;
      transition:
        opacity 180ms ease,
        transform 180ms ease;
    }

    .services-preview-compare-card:hover .services-preview-compare-link,
    .services-preview-compare-card:focus-within .services-preview-compare-link {
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
    }

    .services-preview-compare-link svg {
      width: 14px;
      height: 14px;
    }

    .services-preview-card {
      position: relative;
      min-height: 490px;
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      padding: clamp(24px, 3vw, 34px);
      border-radius: 7px;
      isolation: isolate;
      background:
        radial-gradient(circle at 12% 8%, rgba(59, 125, 219, 0.72) 0%, rgba(59, 125, 219, 0) 34%),
        radial-gradient(circle at 44% 22%, rgba(123, 199, 241, 0.74) 0%, rgba(123, 199, 241, 0) 35%),
        radial-gradient(circle at 86% 10%, rgba(206, 226, 255, 0.95) 0%, rgba(206, 226, 255, 0) 41%),
        radial-gradient(circle at 8% 92%, rgba(165, 229, 238, 0.54) 0%, rgba(165, 229, 238, 0) 32%),
        linear-gradient(135deg, #dbeaff 0%, #a8c7f5 28%, #c5e8fa 58%, #eef4ff 100%);
      color: #262834;
      transition: transform 240ms ease;
    }

    .services-preview-card:nth-child(2) {
      background:
        radial-gradient(circle at 6% 12%, rgba(162, 211, 244, 0.86) 0%, rgba(162, 211, 244, 0) 36%),
        radial-gradient(circle at 22% 54%, rgba(59, 125, 219, 0.62) 0%, rgba(59, 125, 219, 0) 31%),
        radial-gradient(circle at 44% 66%, rgba(186, 211, 255, 0.58) 0%, rgba(186, 211, 255, 0) 25%),
        radial-gradient(circle at 82% 13%, rgba(218, 233, 255, 0.96) 0%, rgba(218, 233, 255, 0) 47%),
        linear-gradient(138deg, #edf6ff 0%, #c5ddff 37%, #95c7ec 66%, #e5efff 100%);
    }

    .services-preview-card:nth-child(3) {
      background:
        radial-gradient(circle at 10% 22%, rgba(204, 225, 255, 0.92) 0%, rgba(204, 225, 255, 0) 35%),
        radial-gradient(circle at 8% 55%, rgba(45, 97, 153, 0.58) 0%, rgba(45, 97, 153, 0) 31%),
        radial-gradient(circle at 25% 72%, rgba(126, 204, 217, 0.58) 0%, rgba(126, 204, 217, 0) 26%),
        radial-gradient(circle at 75% 9%, rgba(232, 240, 255, 0.96) 0%, rgba(232, 240, 255, 0) 43%),
        radial-gradient(circle at 92% 78%, rgba(174, 229, 233, 0.46) 0%, rgba(174, 229, 233, 0) 30%),
        linear-gradient(140deg, #edf5ff 0%, #bdd8fb 40%, #9bcde6 68%, #eaf1ff 100%);
    }

    .services-preview-card::after {
      content: '';
      position: absolute;
      inset: -30%;
      z-index: -1;
      background:
        radial-gradient(circle at 46% 44%, rgba(255, 255, 255, 0.35), transparent 34%),
        radial-gradient(circle at 68% 70%, rgba(255, 255, 255, 0.18), transparent 30%);
      filter: blur(24px);
      opacity: 0.7;
    }

    .services-preview-card:hover {
      transform: translateY(-6px);
    }

    .services-preview-icon {
      position: absolute;
      top: 28px;
      left: 28px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: rgba(19, 44, 84, 0.74);
    }

    .services-preview-icon svg {
      width: 32px;
      height: 32px;
      stroke-width: 1.5;
    }

    .services-preview-card-copy {
      width: 100%;
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding-top: 84px;
    }

    .services-preview-eyebrow {
      margin-bottom: 14px;
      font-size: 0.82rem;
      font-weight: 600;
      letter-spacing: 0.04em;
      color: rgba(19, 44, 84, 0.72);
      text-transform: uppercase;
    }

    .services-preview-card h3 {
      font-size: clamp(1.85rem, 2.3vw, 2.45rem);
      font-weight: 500;
      letter-spacing: -0.045em;
      line-height: 1;
      color: rgba(13, 32, 62, 0.92);
      margin-bottom: 10px;
    }

    .services-preview-card p {
      max-width: 92%;
      font-size: 0.96rem;
      line-height: 1.55;
      color: rgba(18, 42, 78, 0.74);
    }

    .services-preview-card ul {
      list-style: none;
      display: grid;
      gap: 6px;
      margin-top: 20px;
      padding: 0;
    }

    .services-preview-mode-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
      width: 100%;
    }

    .services-preview-mode-section {
      margin-top: 26px;
    }

    .services-preview-mode-heading {
      margin: 0 0 18px;
      text-align: center;
    }

    .services-preview-mode-heading p {
      font-size: 0.8rem;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: rgba(72, 109, 160, 0.78);
      margin-bottom: 8px;
    }

    .services-preview-mode-heading h3 {
      font-size: clamp(1.6rem, 2.5vw, 2.35rem);
      font-weight: 500;
      letter-spacing: -0.05em;
      color: #171c29;
    }

    .services-preview-mode-card {
      min-height: 600px;
      padding: 34px 34px 28px;
      border-radius: 24px;
      position: relative;
      overflow: hidden;
      transition: transform 180ms ease;
    }

    .services-preview-mode-card:hover {
      transform: translateY(-3px);
    }

    .services-preview-mode-card:nth-child(1) {
      background: #514c43;
      color: #f4efe7;
    }

    .services-preview-mode-card:nth-child(2) {
      background: #c7daf1;
    }

    .services-preview-mode-card:nth-child(3) {
      background: #d8d3c9;
    }

    .services-preview-mode-card-top {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 14px;
    }

    .services-preview-mode-card-eyebrow {
      max-width: none;
      font-size: 0.8rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      margin-bottom: 14px;
      color: rgba(21, 36, 62, 0.58);
    }

    .services-preview-mode-card:nth-child(1) .services-preview-mode-card-eyebrow,
    .services-preview-mode-card:nth-child(1) h4,
    .services-preview-mode-card:nth-child(1) p {
      color: #f4efe7;
    }

    .services-preview-mode-card h4 {
      font-size: clamp(2rem, 2.8vw, 2.8rem);
      font-weight: 500;
      letter-spacing: -0.03em;
      line-height: 0.95;
      color: rgba(13, 32, 62, 0.94);
      margin-bottom: 16px;
    }

    .services-preview-mode-card p {
      max-width: none;
      font-size: 1.02rem;
      line-height: 1.45;
      color: rgba(24, 45, 74, 0.72);
    }

    .services-preview-mode-card-arrow {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 34px;
      height: 34px;
      border-radius: 999px;
      background: rgba(17, 21, 31, 0.08);
      color: rgba(13, 32, 62, 0.76);
      margin-top: 2px;
    }

    .services-preview-mode-card:nth-child(1) .services-preview-mode-card-arrow {
      background: rgba(255, 255, 255, 0.16);
      color: #f4efe7;
    }

    .services-preview-mode-card-arrow svg {
      width: 14px;
      height: 14px;
    }

    .services-preview-mode-visual {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 290px;
      pointer-events: none;
    }

    .services-preview-chat-shell {
      position: absolute;
      left: 34px;
      right: 34px;
      bottom: 32px;
      min-height: 106px;
      border-radius: 18px;
      background: #f6f4ef;
      box-shadow: 0 10px 26px rgba(21, 16, 10, 0.12);
      padding: 14px;
    }

    .services-preview-chat-tags {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 12px;
    }

    .services-preview-chat-tags span,
    .services-preview-chat-actions span {
      display: inline-flex;
      align-items: center;
      min-height: 22px;
      padding: 0 10px;
      border-radius: 999px;
      background: #ebe7df;
      color: #605a51;
      font-size: 0.72rem;
      font-weight: 600;
    }

    .services-preview-chat-input {
      min-height: 22px;
      color: #8a8479;
      font-size: 1rem;
      margin-bottom: 14px;
    }

    .services-preview-chat-actions {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .services-preview-chat-send {
      width: 24px;
      height: 24px;
      margin-left: auto;
      border-radius: 999px;
      background: #5576e8;
      box-shadow: 0 0 0 3px rgba(85, 118, 232, 0.12);
    }

    .services-preview-workflow-shell {
      position: absolute;
      inset: 0;
    }

    .services-preview-workflow-line {
      position: absolute;
      left: -2%;
      right: -2%;
      height: 82px;
      border-top: 2px solid rgba(69, 96, 136, 0.22);
      border-radius: 50%;
    }

    .services-preview-workflow-line-top {
      top: 138px;
    }

    .services-preview-workflow-line-bottom {
      top: 196px;
    }

    .services-preview-workflow-node {
      position: absolute;
      border-radius: 14px;
      background: rgba(255, 255, 255, 0.82);
      box-shadow: 0 8px 24px rgba(58, 84, 122, 0.08);
      color: #415269;
    }

    .services-preview-workflow-node strong {
      display: block;
      font-size: 0.92rem;
      color: #29384e;
      margin-bottom: 6px;
    }

    .services-preview-workflow-node span,
    .services-preview-workflow-node li {
      font-size: 0.74rem;
      color: #6c7e97;
    }

    .services-preview-workflow-node-main {
      top: 86px;
      left: 96px;
      width: 194px;
      padding: 14px 16px;
    }

    .services-preview-workflow-node-list {
      right: 56px;
      bottom: 26px;
      width: 182px;
      padding: 14px 16px;
    }

    .services-preview-workflow-node-list ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: grid;
      gap: 8px;
    }

    .services-preview-agent-shell {
      position: absolute;
      left: 108px;
      right: 44px;
      bottom: 52px;
      display: grid;
      gap: 18px;
    }

    .services-preview-agent-step {
      position: relative;
      padding-left: 44px;
      min-height: 44px;
    }

    .services-preview-agent-step:not(:last-child)::after {
      content: '';
      position: absolute;
      left: 15px;
      top: 34px;
      bottom: -18px;
      width: 2px;
      background: rgba(65, 73, 87, 0.5);
    }

    .services-preview-agent-dot {
      position: absolute;
      left: 0;
      top: 4px;
      width: 30px;
      height: 30px;
      border-radius: 999px;
      background: #595f68;
    }

    .services-preview-agent-step.is-live .services-preview-agent-dot {
      background: #bdb7ab;
    }

    .services-preview-agent-step strong {
      display: block;
      font-size: 0.98rem;
      color: rgba(46, 52, 61, 0.9);
      margin-bottom: 4px;
    }

    .services-preview-agent-step p {
      font-size: 0.9rem;
      color: rgba(86, 93, 103, 0.74);
    }

    .services-preview-card li {
      position: relative;
      padding-left: 18px;
      font-size: 0.88rem;
      line-height: 1.35;
      color: rgba(18, 42, 78, 0.76);
    }

    .services-preview-card li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 0.58em;
      width: 5px;
      height: 5px;
      border-radius: 999px;
      background: rgba(59, 125, 219, 0.5);
      transform: translateY(-50%);
    }

    .services-preview-card-link {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-top: 24px;
      min-height: 42px;
      padding: 12px 20px;
      border-radius: 999px;
      border: none;
      background: rgba(255, 255, 255, 0.36);
      color: rgba(13, 32, 62, 0.86);
      font-size: 0.92rem;
      font-weight: 600;
      line-height: 1;
      text-decoration: none;
      transition:
        background 160ms ease,
        transform 160ms ease;
    }

    .services-preview-card-link:hover {
      background: rgba(255, 255, 255, 0.58);
      transform: translateY(-1px);
    }

    .services-preview-card-link svg {
      width: 14px;
      height: 14px;
    }

    .services-preview-footer {
      display: flex;
      justify-content: center;
      margin: 0 0 34px;
    }

    .services-preview-cta {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      font-size: 15.5px;
      font-weight: 500;
      color: #10131d;
      min-height: 46px;
      padding: 14px 28px;
      border-radius: 999px;
      border: 1px solid #cdcbc5;
      background: rgba(255, 255, 255, 0.35);
      transition: all 140ms ease;
    }

    .services-preview-cta:hover {
      background: rgba(255, 255, 255, 0.75);
      border-color: #98a0ad;
      transform: translateY(-1px);
    }

    .services-preview-cta svg {
      width: 15px;
      height: 15px;
    }

    @media (prefers-reduced-motion: reduce) {
      .services-preview-card-link {
        transition: none;
      }

      .services-preview-compare-card,
      .services-preview-compare-link {
        transition: none;
      }

      .services-preview-compare-link {
        opacity: 1;
        transform: none;
        pointer-events: auto;
      }
    }

    @media (max-width: 1180px) {
      .services-preview-compare-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .services-preview-compare-card {
        min-height: 520px;
        padding-top: 88px;
      }
    }

    @media (max-width: 768px) {
      .services-preview {
        margin-top: 72px;
        padding: 0 16px;
      }

      .services-preview-heading {
        margin-bottom: 22px;
      }

      .services-preview-footer {
        margin-bottom: 26px;
      }

      .services-preview-grid {
        grid-template-columns: 1fr;
        gap: 16px;
      }

      .services-preview-compare {
        margin-top: 42px;
      }

      .services-preview-compare-grid {
        grid-template-columns: 1fr;
        gap: 16px;
      }

      .services-preview-compare-card {
        min-height: 420px;
        padding: 26px 24px;
        padding-top: 76px;
      }

      .services-preview-compare-eyebrow {
        max-width: none;
      }

      .services-preview-compare-link {
        opacity: 1;
        transform: none;
        pointer-events: auto;
      }

      .services-preview-card {
        min-height: 380px;
        padding: 24px;
      }

      .services-preview-card-copy {
        padding-top: 72px;
      }

      .services-preview-mode-card {
        min-height: 440px;
        padding: 18px;
      }

      .services-preview-mode-grid {
        grid-template-columns: 1fr;
        gap: 14px;
      }

      .services-preview-mode-visual {
        height: 220px;
      }

      .services-preview-chat-shell {
        left: 18px;
        right: 18px;
        bottom: 18px;
      }

      .services-preview-workflow-node-main {
        left: 18px;
        top: 72px;
        width: 182px;
      }

      .services-preview-workflow-node-list {
        right: 18px;
        bottom: 18px;
        width: 170px;
      }

      .services-preview-agent-shell {
        left: 42px;
        right: 18px;
        bottom: 22px;
      }
    }

    /* ── Testimonials ── */
    .testimonials {
      position: relative;
      overflow: hidden;
      margin: 100px 24px 0;
      border-radius: 32px;
      padding: 80px 0;
      background: #132c54;
      isolation: isolate;
    }

    .testimonials-bg {
      position: absolute;
      inset: 0;
      overflow: hidden;
      z-index: 0;
      background:
        radial-gradient(ellipse 80% 60% at 30% 40%, #3b7ddb 0%, transparent 60%),
        radial-gradient(ellipse 70% 70% at 70% 60%, #4a8ad4 0%, transparent 55%);
      background-color: #132c54;
    }

    .testimonials-blob {
      position: absolute;
      border-radius: 50%;
      filter: blur(80px);
    }

    .testimonials-blob-1 {
      width: 50%;
      height: 60%;
      top: -10%;
      left: 10%;
      background: radial-gradient(circle, #3b7ddb 0%, transparent 70%);
    }

    .testimonials-blob-2 {
      width: 45%;
      height: 55%;
      bottom: -10%;
      right: 10%;
      background: radial-gradient(circle, #5ba3d9 0%, transparent 70%);
    }

    .testimonials-content {
      position: relative;
      z-index: 1;
      text-align: center;
    }

    .testimonials-label {
      font-size: 13px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: rgba(255, 255, 255, 0.6);
      margin-bottom: 12px;
    }

    .testimonials-content h2 {
      font-size: 36px;
      color: #fff;
      letter-spacing: -1px;
      margin-bottom: 48px;
    }

    .testimonials-carousel {
      display: flex;
      align-items: center;
      gap: 16px;
      max-width: 1280px;
      margin: 0 auto;
      padding: 0 24px;
    }

    .testimonial-arrow {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      border: none;
      background: rgba(255, 255, 255, 0.15);
      backdrop-filter: blur(12px);
      color: #fff;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.2s ease;
      z-index: 2;
    }

    .testimonial-arrow:hover {
      background: rgba(255, 255, 255, 0.25);
    }

    .testimonial-arrow svg {
      width: 20px;
      height: 20px;
    }

    .testimonials-track-wrap {
      flex: 1;
      overflow: hidden;
      mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
      -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    }

    .testimonials-track {
      display: flex;
      gap: 24px;
      transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .testimonial-card {
      flex: 0 0 calc(50% - 12px);
      padding: 40px;
      min-height: 320px;
      display: flex;
      flex-direction: column;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(24px) saturate(1.3);
      -webkit-backdrop-filter: blur(24px) saturate(1.3);
      border: 1px solid rgba(255, 255, 255, 0.18);
      text-align: left;
      transition: opacity 0.4s ease, transform 0.4s ease;
      opacity: 0.4;
      transform: scale(0.95);
    }

    .testimonial-card.active {
      opacity: 1;
      transform: scale(1);
    }

    .testimonial-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 20px;
    }

    .testimonial-name {
      font-size: 15px;
      font-weight: 500;
      color: #fff;
    }

    .testimonial-role {
      font-size: 13px;
      color: rgba(255, 255, 255, 0.55);
      margin-top: 2px;
    }

    .testimonial-logo {
      height: 24px;
      width: auto;
      object-fit: contain;
      filter: brightness(0) invert(1);
      opacity: 0.6;
    }

    .testimonial-logo-fallback {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 24px;
      padding: 0 10px;
      border-radius: 980px;
      border: 1px solid rgba(255, 255, 255, 0.28);
      color: rgba(255, 255, 255, 0.72);
      font-size: 11px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      white-space: nowrap;
    }

    .testimonial-quote {
      font-size: 16px;
      line-height: 1.7;
      color: rgba(255, 255, 255, 0.85);
      font-style: italic;
      margin: 0;
      flex: 1;
    }

    @media (max-width: 768px) {
      .testimonials {
        margin: 76px 16px 0;
        padding: 60px 0;
        border-radius: 24px;
      }

      .testimonials-content h2 {
        font-size: 26px;
        padding: 0 24px;
      }

      .testimonial-card {
        flex: 0 0 85%;
      }

      .testimonial-arrow {
        display: none;
      }
    }

    /* ── Approach ── */
    .approach {
      max-width: 1280px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .approach-header {
      text-align: center;
      margin-bottom: 48px;
    }

    .approach-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1.5px;
      color: #8c6d3f;
      margin-bottom: 12px;
    }

    .approach-header h2 {
      font-size: 36px;
      font-weight: 500;
      color: #1a2533;
      letter-spacing: -0.5px;
      margin-bottom: 12px;
    }

    .approach-sub {
      font-size: 16px;
      color: #5a6270;
      max-width: 520px;
      margin: 0 auto;
      line-height: 1.6;
    }

    .approach-steps {
      display: flex;
      border-radius: 24px;
      overflow: hidden;
      background: rgba(255, 255, 255, 0.35);
      backdrop-filter: blur(28px) saturate(1.3);
      -webkit-backdrop-filter: blur(28px) saturate(1.3);
      border: 1px solid rgba(255, 255, 255, 0.5);
      box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.03),
        0 1px 0 rgba(255, 255, 255, 0.6) inset;
      min-height: 520px;
    }

    .approach-card {
      display: flex;
      flex-direction: column;
      position: relative;
      flex: 1;
      cursor: pointer;
      overflow: hidden;
      transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .approach-card:not(.active) {
      background: rgba(0, 0, 0, 0.03);
    }

    .approach-card:not(.active):hover {
      background: rgba(0, 0, 0, 0.05);
    }

    .approach-card.active {
      flex: 3;
      cursor: default;
    }

    .approach-card + .approach-card {
      border-left: 1px solid rgba(255, 255, 255, 0.45);
    }

    .approach-card-content {
      padding: 32px 28px;
      flex: 1;
    }

    .approach-card-content h3 {
      font-size: 20px;
      font-weight: 600;
      color: #1a2533;
      margin-bottom: 16px;
      letter-spacing: -0.3px;
      white-space: nowrap;
    }

    .approach-card-content p {
      font-size: 15px;
      color: #5a6270;
      line-height: 1.7;
      opacity: 0;
      max-height: 0;
      overflow: hidden;
      transition: opacity 0.3s ease 0s, max-height 0.4s ease;
    }

    .approach-card.active .approach-card-content p {
      opacity: 1;
      max-height: 300px;
      transition: opacity 0.4s ease 0.2s, max-height 0.5s ease;
    }

    .approach-card-visual {
      position: relative;
      display: flex;
      align-items: flex-end;
      justify-content: flex-start;
      padding: 20px 28px 28px;
      margin-top: auto;
      opacity: 0.28;
      transition: opacity 0.3s ease 0s;
    }

    .approach-card.active .approach-card-visual {
      opacity: 1;
      transition: opacity 0.4s ease 0.25s;
    }

    .approach-illustration {
      width: 72%;
      max-width: 260px;
      height: auto;
      color: #3b7ddb;
    }

    .approach-number {
      position: absolute;
      bottom: -8px;
      right: 16px;
      font-size: 100px;
      font-weight: 700;
      color: rgba(59, 125, 219, 0.07);
      line-height: 1;
      pointer-events: none;
      user-select: none;
      transition: opacity 0.3s ease;
    }

    .approach-card:not(.active) .approach-number {
      opacity: 1;
    }

    @media (max-width: 768px) {
      .approach-steps {
        flex-direction: column;
        min-height: auto;
      }

      .approach-card {
        flex: none !important;
      }

      .approach-card:not(.active) {
        min-height: 64px;
      }

      .approach-card.active {
        min-height: 360px;
      }

      .approach-card + .approach-card {
        border-left: none;
        border-top: 1px solid rgba(255, 255, 255, 0.45);
      }

      .approach-card-content h3 {
        white-space: normal;
      }

      .approach-card:not(.active) .approach-card-content {
        padding: 20px 24px;
      }

      .approach-header h2 {
        font-size: 28px;
      }
    }

    /* ── Footer ── */
    .footer-wrap {
      margin: 80px 0 0;
      padding: 0;
    }

    footer.site-footer {
      position: relative;
      background: linear-gradient(135deg, #1a3a6e 0%, #132c54 50%, #0e2244 100%);
      border-radius: 0;
      padding: 48px 56px 40px;
      color: #fff;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: auto auto auto auto;
      justify-content: space-between;
      gap: 56px;
      align-items: start;
      max-width: 1280px;
      margin: 0 auto;
    }

    .footer-logo a {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
    }

    .footer-mark {
      display: inline-flex;
      width: 40px;
      height: 40px;
      perspective: 400px;
    }

    .footer-mark-svg {
      width: 100%;
      height: 100%;
    }

    .footer-mark-svg path {
      fill: #fff !important;
    }

    .footer-logo a:hover .footer-mark {
      animation: hixton-tumble 0.8s cubic-bezier(0.65, 0, 0.35, 1) both;
    }

    .footer-logo a:hover .footer-mark-svg {
      animation: hixton-spin 0.8s cubic-bezier(0.65, 0, 0.35, 1) both;
    }

    .footer-wordmark {
      height: 22px;
      width: auto;
      object-fit: contain;
    }

    @media (prefers-reduced-motion: reduce) {
      .footer-logo a:hover .footer-mark,
      .footer-logo a:hover .footer-mark-svg { animation: none; }
    }

    .footer-col h4 {
      font-size: 13px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      margin-bottom: 18px;
      color: rgba(255, 255, 255, 0.7);
    }

    .footer-col ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .footer-col a,
    .footer-col li {
      color: #fff;
      text-decoration: none;
      font-size: 14.5px;
      font-weight: 400;
      transition: opacity 0.2s ease;
    }

    .footer-col a:hover {
      opacity: 0.75;
    }

    .footer-contact .contact-name {
      font-weight: 500;
      font-size: 14.5px;
      color: #fff;
      margin-bottom: 12px;
    }

    .contact-icons {
      display: flex;
      gap: 8px;
    }

    .contact-icon {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: 8px;
      background: rgba(255, 255, 255, 0.15);
      transition: background 0.2s ease;
      text-decoration: none;
    }

    .contact-icon:hover {
      background: rgba(255, 255, 255, 0.3);
    }

    .contact-icon svg {
      width: 16px;
      height: 16px;
    }

    /* Stroke-based icons (email, phone) */
    .contact-icon svg[fill="none"] {
      color: #fff;
    }

    /* Fill-based icons (LinkedIn) */
    .contact-icon svg:not([fill="none"]) {
      fill: #fff;
    }

    .contact-tooltip {
      position: absolute;
      bottom: calc(100% + 8px);
      left: 50%;
      transform: translateX(-50%);
      white-space: nowrap;
      font-size: 12px;
      color: #1a2533;
      background: #fff;
      padding: 6px 12px;
      border-radius: 8px;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.15s ease, visibility 0.15s ease;
      pointer-events: none;
    }

    .contact-icon:hover .contact-tooltip {
      opacity: 1;
      visibility: visible;
    }

    .footer-bottom {
      margin-top: 36px;
      padding-top: 24px;
      border-top: 1px solid rgba(255, 255, 255, 0.18);
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 12px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.7);
      max-width: 1280px;
      margin-left: auto;
      margin-right: auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
    }

    .footer-privacy-link {
      color: inherit;
      text-decoration: none;
      opacity: 0.6;
      transition: opacity 0.15s ease;
    }

    .footer-privacy-link:hover {
      opacity: 1;
    }

    /* ── Cookie Consent Banner ── */
    .cookie-banner {
      position: fixed;
      bottom: 24px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 9000;
      width: calc(100% - 48px);
      max-width: 680px;
      background: #fff;
      border: 1px solid rgba(0, 0, 0, 0.08);
      border-radius: 16px;
      box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
      padding: 18px 22px;
      animation: cookie-slide-in 0.3s ease;
    }

    @keyframes cookie-slide-in {
      from { opacity: 0; transform: translateX(-50%) translateY(12px); }
      to   { opacity: 1; transform: translateX(-50%) translateY(0); }
    }

    .cookie-banner-inner {
      display: flex;
      align-items: center;
      gap: 20px;
      flex-wrap: wrap;
    }

    .cookie-banner-text {
      flex: 1;
      min-width: 220px;
      font-size: 13.5px;
      line-height: 1.55;
      color: #5a6270;
      margin: 0;
    }

    .cookie-banner-link {
      color: #1a2533;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    .cookie-banner-actions {
      display: flex;
      gap: 8px;
      flex-shrink: 0;
    }

    .cookie-banner-accept,
    .cookie-banner-decline {
      padding: 8px 18px;
      border-radius: 980px;
      font-size: 13.5px;
      font-weight: 500;
      cursor: pointer;
      border: none;
      white-space: nowrap;
      font-family: inherit;
      transition: all 0.15s ease;
    }

    .cookie-banner-accept {
      background: #0e0f19;
      color: #fff;
    }

    .cookie-banner-accept:hover {
      background: #1a1b2e;
    }

    .cookie-banner-decline {
      background: transparent;
      color: #5a6270;
      border: 1px solid rgba(0, 0, 0, 0.14);
    }

    .cookie-banner-decline:hover {
      background: rgba(0, 0, 0, 0.04);
    }

    @media (max-width: 600px) {
      .cookie-banner {
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        transform: none;
        border-radius: 16px 16px 0 0;
        max-width: none;
        animation: cookie-slide-in-mobile 0.3s ease;
      }

      @keyframes cookie-slide-in-mobile {
        from { opacity: 0; transform: translateY(12px); }
        to   { opacity: 1; transform: translateY(0); }
      }

      .cookie-banner-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
      }
    }

    @media (max-width: 768px) {
      footer.site-footer {
        padding: 36px 28px 28px;
      }
      .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
      }
      .footer-logo {
        grid-column: 1 / -1;
      }
    }

    @media (max-width: 768px) {
      header {
        padding: 10px 16px;
      }

      nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 8px 16px;
        height: auto;
        min-height: 56px;
        align-items: center;
        gap: 0;
      }

      .nav-logo {
        padding: 8px 0;
      }

      .nav-toggle {
        display: flex;
      }

      .nav-center {
        display: none;
        width: 100%;
        flex-direction: column;
        gap: 2px;
        padding: 8px;
        margin-top: 8px;
        margin-bottom: 8px;
        order: 3;
      }

      .nav-center.open {
        display: flex;
      }

      .nav-center a {
        width: 100%;
        text-align: center;
        padding: 12px 20px;
      }

      .nav-right {
        display: none;
        width: 100%;
        order: 4;
        justify-content: center;
        padding-bottom: 8px;
      }

      .nav-center.open ~ .nav-right {
        display: flex;
      }

      .nav-dropdown-menu {
        position: static !important;
        transform: none !important;
        box-shadow: none;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        padding: 0 12px;
        opacity: 1;
        visibility: visible;
        min-width: 0;
        border-radius: 0;
        border: none;
      }

      .nav-dropdown-menu a {
        text-align: center;
      }

      .nav-dropdown-menu a + a {
        border-top: none;
      }

      .nav-dropdown-item {
        width: 100%;
      }

      .nav-dropdown-item > .nav-dropdown-link {
        justify-content: space-between;
        text-align: left;
      }

      .nav-dropdown-item-has-children.open > .nav-dropdown-link .dropdown-submenu-chevron {
        transform: rotate(90deg);
      }

      .nav-submenu {
        position: static;
        transform: translateY(-4px);
        opacity: 0;
        visibility: visible;
        pointer-events: none;
        min-width: 0;
        max-width: none;
        max-height: 0;
        margin: 2px 0 8px;
        padding: 0 0 0 12px;
        border: none;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        overflow: hidden;
        transition:
          max-height 0.3s cubic-bezier(0.22, 1, 0.36, 1),
          opacity 0.22s ease,
          transform 0.28s ease;
      }

      .nav-dropdown-item-has-children.open > .nav-submenu {
        max-height: 900px;
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
      }

      .nav-submenu .nav-submenu-link {
        justify-content: flex-start;
        text-align: left;
        padding: 9px 12px;
      }

      .nav-submenu .nav-submenu-text {
        text-align: left;
      }

      .nav-submenu .nav-submenu-icon,
      .nav-submenu .nav-submenu-arrow {
        display: none;
      }

      .nav-submenu-desc {
        font-size: 12px;
      }

      /* Mobile menu: clean up dropdown items */
      .nav-dropdown-toggle {
        width: 100%;
        justify-content: center;
        padding: 12px 20px;
      }

      .nav-dropdown-toggle.active {
        color: #1a2533;
      }

      .nav-dropdown-toggle:hover {
        color: #1a2533;
      }

      .nav-chevron {
        width: 12px;
        height: 12px;
        opacity: 0.45;
      }

      .nav-dropdown-menu {
        padding: 0 4px 4px;
      }

      .nav-dropdown-menu a {
        justify-content: center;
        gap: 0;
        padding: 11px 16px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.03);
      }

      .nav-dropdown-menu a:hover {
        background: rgba(0, 0, 0, 0.055);
      }

      .dropdown-icon,
      .dropdown-desc,
      .dropdown-arrow {
        display: none;
      }

      .dropdown-title {
        font-size: 14px;
        color: #5a6270;
      }
    }

    /* ── Page placeholder ── */
    .page-placeholder {
      max-width: 1280px;
      margin: 80px auto;
      padding: 0 24px;
      text-align: center;
      min-height: 40vh;
    }
    .page-placeholder h1 {
      font-size: 48px;
      font-weight: 500;
      letter-spacing: -1px;
      color: #1a2533;
      margin-bottom: 16px;
    }
    .page-placeholder p {
      font-size: 17px;
      color: #5a6270;
    }

    /* ── Careers ── */
    .careers-hero {
      max-width: 780px;
      margin: 80px auto 0;
      padding: 0 24px;
      text-align: center;
    }

    .careers-hero h1 {
      font-size: 48px;
      font-weight: 500;
      letter-spacing: -1.5px;
      line-height: 1.1;
      color: #1a2533;
      margin-bottom: 20px;
    }

    .careers-hero p {
      font-size: 17px;
      line-height: 1.7;
      color: #5a6270;
      max-width: 560px;
      margin: 0 auto 32px;
    }

    .careers-hero-cta {
      display: inline-block;
      text-decoration: none;
      font-size: 14px;
      font-weight: 500;
      color: #fff;
      padding: 11px 28px;
      border-radius: 980px;
      background: #0e0f19;
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
      transition: all 0.2s ease;
    }

    .careers-hero-cta:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.24);
    }

    /* Label */
    .careers-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #8c6d3f;
      margin-bottom: 12px;
    }

    /* Mission */
    .careers-mission {
      max-width: 780px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .careers-mission h2 {
      font-size: 32px;
      font-weight: 500;
      letter-spacing: -0.8px;
      line-height: 1.2;
      color: #1a2533;
      margin-bottom: 24px;
    }

    .careers-mission-body {
      font-size: 16px;
      line-height: 1.8;
      color: #5a6270;
    }

    /* Values */
    .careers-values {
      max-width: 1080px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .careers-values h2 {
      font-size: 32px;
      font-weight: 500;
      letter-spacing: -0.8px;
      color: #1a2533;
      margin-bottom: 40px;
    }

    .values-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }

    .value-card {
      background: #fff;
      border-radius: 20px;
      padding: 36px 32px;
      border: 1px solid rgba(0, 0, 0, 0.06);
    }

    .value-number {
      display: inline-block;
      font-size: 13px;
      font-weight: 600;
      color: #8c6d3f;
      margin-bottom: 20px;
      font-variant-numeric: tabular-nums;
    }

    .value-card h3 {
      font-size: 19px;
      font-weight: 500;
      color: #1a2533;
      margin-bottom: 12px;
      letter-spacing: -0.3px;
    }

    .value-card p {
      font-size: 14.5px;
      line-height: 1.7;
      color: #5a6270;
    }

    /* Open Roles */
    .careers-roles {
      max-width: 780px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .careers-roles h2 {
      font-size: 32px;
      font-weight: 500;
      letter-spacing: -0.8px;
      color: #1a2533;
      margin-bottom: 32px;
    }

    .roles-list {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .role-card {
      display: flex;
      align-items: center;
      gap: 24px;
      text-decoration: none;
      background: #fff;
      border-radius: 20px;
      padding: 32px;
      border: 1px solid rgba(0, 0, 0, 0.06);
      transition: all 0.2s ease;
    }

    .role-card:hover {
      border-color: rgba(59, 125, 219, 0.25);
      box-shadow: 0 4px 20px rgba(59, 125, 219, 0.08);
    }

    .role-info {
      flex: 1;
    }

    .role-info h3 {
      font-size: 19px;
      font-weight: 500;
      color: #1a2533;
      margin-bottom: 8px;
      letter-spacing: -0.3px;
    }

    .role-info p {
      font-size: 14.5px;
      line-height: 1.7;
      color: #5a6270;
    }

    .role-meta {
      display: flex;
      gap: 8px;
      flex-shrink: 0;
      flex-wrap: wrap;
    }

    .role-tag {
      font-size: 12px;
      font-weight: 500;
      color: #5a6270;
      padding: 5px 14px;
      border-radius: 980px;
      background: #f2f4f8;
      white-space: nowrap;
    }

    .role-arrow {
      width: 20px;
      height: 20px;
      color: #3b7ddb;
      flex-shrink: 0;
      transition: transform 0.2s ease;
    }

    .role-card:hover .role-arrow {
      transform: translateX(3px);
    }

    /* Open application */
    .careers-open-application {
      margin-top: 40px;
      text-align: center;
      padding: 40px 24px;
      background: #fff;
      border-radius: 20px;
      border: 1px solid rgba(0, 0, 0, 0.06);
    }

    .careers-open-application p {
      font-size: 16px;
      color: #5a6270;
      margin-bottom: 20px;
    }

    .careers-open-cta {
      display: inline-block;
      text-decoration: none;
      font-size: 14px;
      font-weight: 500;
      color: #1a2533;
      padding: 10px 24px;
      border-radius: 980px;
      border: 1.5px solid #1a2533;
      transition: all 0.2s ease;
    }

    .careers-open-cta:hover {
      background: #0e0f19;
      border-color: #0e0f19;
      color: #fff;
    }

    /* Careers responsive */
    @media (max-width: 768px) {
      .careers-hero h1 {
        font-size: 32px;
      }

      .careers-mission h2,
      .careers-values h2,
      .careers-roles h2 {
        font-size: 26px;
      }

      .values-grid {
        grid-template-columns: 1fr;
      }

      .role-card {
        flex-direction: column;
        align-items: flex-start;
      }

      .role-arrow {
        align-self: flex-end;
      }
    }

    /* ── Portfolio / Services ── */
    .portfolio {
      max-width: 1180px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .portfolio-header {
      text-align: center;
      margin-bottom: 56px;
    }

    .portfolio-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #3b7ddb;
      margin-bottom: 12px;
    }

    .portfolio-header h1 {
      font-size: 48px;
      font-weight: 500;
      letter-spacing: -1.5px;
      color: #1a2533;
      margin-bottom: 12px;
    }

    .portfolio-sub {
      font-size: 17px;
      color: #5a6270;
    }

    .services-category-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 20px;
      align-items: stretch;
    }

    .services-category-card {
      position: relative;
      min-height: 340px;
      display: flex;
      flex-direction: column;
      gap: 16px;
      padding: 30px;
      border-radius: 18px;
      text-decoration: none;
      color: inherit;
      overflow: hidden;
      background:
        radial-gradient(circle at 68% 18%, rgba(91, 163, 217, 0.45), transparent 34%),
        linear-gradient(145deg, rgba(151, 199, 246, 0.74), rgba(217, 238, 248, 0.86));
      border: 1px solid rgba(255, 255, 255, 0.58);
      box-shadow:
        0 10px 28px rgba(26, 37, 51, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
      transition: transform 0.22s ease, box-shadow 0.22s ease;
    }

    .services-category-card:nth-child(2) {
      background:
        radial-gradient(circle at 70% 12%, rgba(91, 163, 217, 0.34), transparent 36%),
        linear-gradient(145deg, rgba(205, 225, 255, 0.8), rgba(211, 237, 246, 0.88));
    }

    .services-category-card:nth-child(3) {
      background:
        radial-gradient(circle at 66% 18%, rgba(91, 163, 217, 0.32), transparent 34%),
        linear-gradient(145deg, rgba(228, 224, 214, 0.92), rgba(200, 218, 238, 0.74));
    }

    .services-category-card:hover,
    .services-category-card:focus-visible {
      transform: translateY(-4px);
      box-shadow:
        0 16px 38px rgba(26, 37, 51, 0.11),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
      outline: none;
    }

    .services-category-eyebrow {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.11em;
      text-transform: uppercase;
      color: #2f6ab1;
    }

    .services-category-card h2 {
      font-size: 34px;
      line-height: 1.05;
      letter-spacing: -0.9px;
      color: #1a2533;
    }

    .services-category-card > p:not(.services-category-eyebrow) {
      font-size: 15px;
      line-height: 1.65;
      color: #405069;
    }

    .services-category-card ul {
      margin-top: auto;
      list-style: none;
      display: grid;
      gap: 8px;
    }

    .services-category-card li {
      position: relative;
      padding-left: 14px;
      font-size: 13px;
      line-height: 1.45;
      color: #50617a;
    }

    .services-category-card li::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0.64em;
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: rgba(47, 106, 177, 0.7);
    }

    .services-category-link {
      margin-top: 6px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      width: fit-content;
      font-size: 13.5px;
      font-weight: 700;
      color: #2f6ab1;
    }

    .services-category-link svg {
      width: 14px;
      height: 14px;
      transition: transform 0.2s ease;
    }

    .services-category-card:hover .services-category-link svg,
    .services-category-card:focus-visible .services-category-link svg {
      transform: translateX(3px);
    }

    .portfolio-grid {
      position: relative;
      display: flex;
      flex-direction: column;
      gap: 32px;
    }

    .portfolio-lines {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: 0;
    }

    .flow-line {
      stroke-dasharray: 8 6;
      animation: dash-flow 1.5s linear infinite;
    }

    .flow-line-2 {
      animation-delay: 0.5s;
    }

    .flow-line-3 {
      animation-delay: 1s;
    }

    @keyframes home-service-node-rise {
      from {
        opacity: 0;
        transform: translate3d(0, 14px, 0) scale(0.985);
      }

      to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
      }
    }

    .flow-dot {
      opacity: 1;
    }

    .portfolio-lines {
      z-index: 2;
    }

    .portfolio-card .card-desc {
      font-size: 14px;
      color: #5a6270;
      line-height: 1.6;
      margin-top: 6px;
    }

    .portfolio-card {
      position: relative;
      z-index: 1;
      text-align: center;
      padding: 32px 28px;
      border-radius: 20px;

      /* Glass UI — matches header */
      background: rgba(255, 255, 255, 0.35);

      border: 1px solid rgba(255, 255, 255, 0.5);
      box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.03),
        0 1px 0 rgba(255, 255, 255, 0.6) inset;
      transition: all 0.25s ease;
    }

    .portfolio-card:hover {
      background: rgba(255, 255, 255, 0.55);
      box-shadow:
        0 8px 32px rgba(59, 125, 219, 0.08),
        0 1px 0 rgba(255, 255, 255, 0.7) inset;
      transform: translateY(-2px);
    }

    .portfolio-card h3 {
      font-size: 21px;
      font-weight: 500;
      color: #1a2533;
      margin-bottom: 8px;
      letter-spacing: -0.3px;
    }

    .portfolio-card p {
      font-size: 14.5px;
      color: #5a6270;
      line-height: 1.6;
    }

    .portfolio-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 24px;
      position: relative;
      z-index: 1;
    }

    /* ── Service tab buttons ── */
    .service-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 20px;
      justify-content: center;
    }

    .service-tab {
      display: inline-block;
      padding: 8px 20px;
      border-radius: 980px;
      border: 1.5px solid rgba(0, 0, 0, 0.1);
      background: transparent;
      font-family: inherit;
      font-size: 14px;
      font-weight: 500;
      color: #5a6270;
      cursor: pointer;
      transition: all 0.25s ease;
      white-space: nowrap;
    }

    .service-tab:hover {
      border-color: rgba(59, 125, 219, 0.4);
      color: #3b7ddb;
    }

    .service-tab.active {
      background: linear-gradient(135deg, #4a8ad4 0%, #5ba3d9 100%);
      border-color: transparent;
      color: #fff;
      box-shadow: 0 4px 14px rgba(74, 138, 212, 0.25);
    }

    .service-panel {
      margin-top: 20px;
      max-height: 0;
      overflow: hidden;
      opacity: 0;
      transition: max-height 0.35s ease, opacity 0.25s ease, margin 0.35s ease;
    }

    .service-panel.visible {
      max-height: 280px;
      opacity: 1;
    }

    .service-panel-inner {
      padding: 16px 20px;
      background: rgba(59, 125, 219, 0.06);
      border-radius: 14px;
      text-align: left;
    }

    .service-panel-inner p {
      font-size: 14.5px;
      line-height: 1.7;
      color: #3a4a5c;
    }

    .service-panel-link {
      margin-top: 12px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      font-size: 13.5px;
      font-weight: 600;
      color: #2f6ab1;
      transition: opacity 0.2s ease;
    }

    .service-panel-link:hover {
      opacity: 0.75;
    }

    .service-panel-link svg {
      width: 14px;
      height: 14px;
    }

    /* ── Services deep-dive pages ── */
    .service-pages {
      max-width: 1080px;
      margin: 72px auto 0;
      padding: 0 24px;
    }

    .service-pages-header {
      text-align: center;
      margin-bottom: 30px;
    }

    .service-pages-label {
      font-size: 12.5px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #3b7ddb;
      margin-bottom: 10px;
    }

    .service-pages-header h2 {
      font-size: 42px;
      letter-spacing: -1.1px;
      color: #1a2533;
      margin-bottom: 10px;
    }

    .service-pages-sub {
      max-width: 760px;
      margin: 0 auto;
      font-size: 16px;
      line-height: 1.75;
      color: #5a6270;
    }

    .service-pages-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .services-category-sections {
      display: grid;
      gap: 24px;
    }

    .services-category-section {
      scroll-margin-top: 92px;
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 22px;
      align-items: start;
      padding: 24px;
      border-radius: 22px;
      background: rgba(255, 255, 255, 0.32);
      border: 1px solid rgba(255, 255, 255, 0.58);
      box-shadow:
        0 8px 26px rgba(26, 37, 51, 0.045),
        inset 0 1px 0 rgba(255, 255, 255, 0.62);
    }

    .services-category-section-copy {
      position: sticky;
      top: 92px;
    }

    .services-category-section-copy h3 {
      margin: 8px 0 10px;
      font-size: 32px;
      line-height: 1.08;
      letter-spacing: -0.85px;
      color: #1a2533;
    }

    .services-category-section-copy p:not(.services-category-eyebrow) {
      font-size: 14.5px;
      line-height: 1.7;
      color: #5a6270;
    }

    .service-page-card {
      display: flex;
      flex-direction: column;
      gap: 10px;
      text-decoration: none;
      color: inherit;
      padding: 24px 22px;
      border-radius: 18px;
      background: rgba(255, 255, 255, 0.45);
      border: 1px solid rgba(255, 255, 255, 0.58);
      box-shadow:
        0 8px 24px rgba(26, 37, 51, 0.05),
        0 1px 0 rgba(255, 255, 255, 0.62) inset;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    }

    .service-page-card:hover {
      transform: translateY(-3px);
      border-color: rgba(74, 138, 212, 0.28);
      box-shadow:
        0 14px 30px rgba(26, 37, 51, 0.1),
        0 1px 0 rgba(255, 255, 255, 0.72) inset;
    }

    .service-page-card-category {
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #3b7ddb;
    }

    .service-page-card h3,
    .service-page-card h4 {
      font-size: 24px;
      line-height: 1.22;
      letter-spacing: -0.45px;
      color: #1a2533;
    }

    .service-page-card p {
      font-size: 14.5px;
      line-height: 1.72;
      color: #526074;
    }

    .service-page-card-link {
      margin-top: auto;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 13.5px;
      font-weight: 600;
      color: #2f6ab1;
    }

    .service-page-card-link svg {
      width: 14px;
      height: 14px;
      transition: transform 0.2s ease;
    }

    .service-page-card:hover .service-page-card-link svg {
      transform: translateX(3px);
    }

    .service-domain-note {
      margin-top: 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
      padding: 24px;
      border-radius: 22px;
      background: rgba(19, 44, 84, 0.08);
      border: 1px solid rgba(74, 138, 212, 0.16);
    }

    .service-domain-note h3 {
      font-size: 24px;
      letter-spacing: -0.4px;
      color: #1a2533;
      margin-bottom: 8px;
    }

    .service-domain-note p:not(.service-pages-label) {
      max-width: 680px;
      font-size: 14.5px;
      line-height: 1.7;
      color: #526074;
    }

    .service-domain-note a {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
      text-decoration: none;
      border-radius: 980px;
      background: #1a2533;
      color: #fff;
      padding: 12px 18px;
      font-size: 13.5px;
      font-weight: 700;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .service-domain-note a:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 22px rgba(15, 26, 40, 0.18);
    }

    .service-domain-note svg {
      width: 14px;
      height: 14px;
    }

    @media (max-width: 1080px) {
      .service-pages-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    /* ── Services reference card ── */
    .service-reference {
      max-width: 900px;
      margin: 28px auto 0;
      padding: 0 24px;
    }

    .service-reference-card {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 24px;
      padding: 24px;
      border-radius: 20px;
      background:
        linear-gradient(140deg, rgba(26, 37, 51, 0.96), rgba(44, 88, 145, 0.95)),
        radial-gradient(circle at 18% 18%, rgba(106, 179, 235, 0.32), transparent 60%);
      border: 1px solid rgba(255, 255, 255, 0.16);
      box-shadow: 0 16px 34px rgba(16, 35, 65, 0.28);
      color: #fff;
    }

    .service-reference-copy {
      max-width: 620px;
    }

    .service-reference-label {
      font-size: 12px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.64);
      margin-bottom: 8px;
      font-weight: 600;
    }

    .service-reference-copy h2 {
      font-size: 28px;
      letter-spacing: -0.6px;
      margin-bottom: 10px;
      color: #fff;
    }

    .service-reference-copy p {
      font-size: 15px;
      line-height: 1.72;
      color: rgba(255, 255, 255, 0.85);
    }

    .service-reference-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      white-space: nowrap;
      text-decoration: none;
      color: #1a2533;
      background: #fff;
      border-radius: 980px;
      padding: 10px 20px;
      font-size: 14px;
      font-weight: 600;
      box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .service-reference-link:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2);
    }

    .service-reference-link svg {
      width: 15px;
      height: 15px;
    }

    /* ── Procurement expertise page ── */
    .procurement-hero {
      position: relative;
      overflow: hidden;
      margin: 24px 24px 0;
      border-radius: 32px;
      min-height: 560px;
      background: linear-gradient(142deg, #0f2a52 0%, #1d4271 55%, #2f5d93 100%);
      isolation: isolate;
      padding: 92px 0;
    }

    .procurement-hero-grid {
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
      background-size: 44px 44px;
      opacity: 0.18;
      z-index: 0;
      mask-image: radial-gradient(circle at 60% 45%, black 42%, transparent 100%);
      -webkit-mask-image: radial-gradient(circle at 60% 45%, black 42%, transparent 100%);
    }

    .procurement-hero-glow {
      position: absolute;
      border-radius: 50%;
      filter: blur(90px);
      z-index: 0;
      pointer-events: none;
    }

    .procurement-hero-glow-1 {
      width: 440px;
      height: 440px;
      top: -80px;
      left: -70px;
      background: rgba(91, 163, 217, 0.55);
    }

    .procurement-hero-glow-2 {
      width: 420px;
      height: 420px;
      right: -80px;
      bottom: -120px;
      background: rgba(115, 188, 235, 0.4);
    }

    .procurement-hero-inner {
      position: relative;
      z-index: 1;
      max-width: 1080px;
      margin: 0 auto;
      padding: 0 56px;
    }

    .procurement-hero-label {
      font-size: 12px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.14em;
      color: rgba(255, 255, 255, 0.72);
      margin-bottom: 14px;
    }

    .procurement-hero h1 {
      font-size: 56px;
      line-height: 1.05;
      letter-spacing: -2px;
      color: #fff;
      max-width: 820px;
      margin-bottom: 24px;
    }

    .procurement-hero-sub {
      max-width: 760px;
      font-size: 17px;
      line-height: 1.8;
      color: rgba(255, 255, 255, 0.84);
      margin-bottom: 32px;
    }

    .procurement-hero-actions {
      display: flex;
      align-items: center;
      gap: 14px;
      flex-wrap: wrap;
    }

    .procurement-hero-cta,
    .procurement-outro-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border-radius: 980px;
      text-decoration: none;
      background: #fff;
      color: #1a2533;
      padding: 11px 22px;
      font-size: 14px;
      font-weight: 600;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    }

    .procurement-hero-cta:hover,
    .procurement-outro-link:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
    }

    .procurement-hero-cta svg,
    .procurement-outro-link svg {
      width: 15px;
      height: 15px;
    }

    .procurement-hero-secondary {
      display: inline-flex;
      align-items: center;
      border-radius: 980px;
      text-decoration: none;
      border: 1px solid rgba(255, 255, 255, 0.35);
      color: rgba(255, 255, 255, 0.9);
      padding: 11px 22px;
      font-size: 14px;
      font-weight: 500;
      transition: background 0.2s ease, border-color 0.2s ease;
    }

    .procurement-hero-secondary:hover {
      background: rgba(255, 255, 255, 0.1);
      border-color: rgba(255, 255, 255, 0.52);
    }

    .procurement-context,
    .procurement-practice,
    .procurement-ai-impact,
    .procurement-marc,
    .procurement-outro {
      max-width: 1080px;
      margin: 28px auto 0;
      padding: 0 24px;
    }

    .procurement-context-card {
      background: rgba(255, 255, 255, 0.45);
      backdrop-filter: blur(26px) saturate(1.2);
      -webkit-backdrop-filter: blur(26px) saturate(1.2);
      border: 1px solid rgba(255, 255, 255, 0.5);
      border-radius: 20px;
      padding: 34px;
      box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.03),
        0 1px 0 rgba(255, 255, 255, 0.58) inset;
    }

    .procurement-context-card h2 {
      font-size: 30px;
      color: #1a2533;
      margin-bottom: 14px;
      letter-spacing: -0.7px;
    }

    .procurement-context-card p {
      font-size: 16px;
      line-height: 1.8;
      color: #4d5968;
    }

    .procurement-context-card p + p {
      margin-top: 14px;
    }

    .procurement-practice {
      margin-top: 72px;
    }

    .procurement-practice-header {
      text-align: center;
      margin-bottom: 34px;
    }

    .procurement-practice-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #3b7ddb;
      margin-bottom: 10px;
    }

    .procurement-practice-header h2 {
      font-size: 42px;
      color: #1a2533;
      letter-spacing: -1.1px;
      margin-bottom: 10px;
    }

    .procurement-practice-sub {
      max-width: 700px;
      margin: 0 auto;
      font-size: 16px;
      color: #5a6270;
      line-height: 1.7;
    }

    .procurement-pillar-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 20px;
    }

    .procurement-pillar {
      position: relative;
      background: #fff;
      border-radius: 20px;
      border: 1px solid rgba(0, 0, 0, 0.06);
      padding: 28px 24px;
      box-shadow: 0 10px 30px rgba(26, 37, 51, 0.06);
      overflow: hidden;
    }

    .procurement-pillar-index {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.08em;
      color: #3b7ddb;
      margin-bottom: 12px;
    }

    .procurement-pillar h3 {
      font-size: 22px;
      line-height: 1.25;
      letter-spacing: -0.45px;
      color: #1a2533;
      margin-bottom: 12px;
    }

    .procurement-pillar p {
      font-size: 14.5px;
      line-height: 1.78;
      color: #506074;
    }

    .procurement-ai-impact-card {
      background: linear-gradient(140deg, #16345f 0%, #254f82 62%, #30679d 100%);
      border-radius: 24px;
      border: 1px solid rgba(255, 255, 255, 0.14);
      box-shadow: 0 20px 44px rgba(26, 53, 90, 0.26);
      padding: 36px;
      color: #fff;
    }

    .procurement-ai-impact-card h2 {
      font-size: 34px;
      letter-spacing: -0.7px;
      margin-bottom: 18px;
      max-width: 640px;
    }

    .procurement-ai-impact-card ul {
      list-style: none;
      display: grid;
      gap: 12px;
      padding: 0;
    }

    .procurement-ai-impact-card li {
      position: relative;
      padding-left: 18px;
      font-size: 15px;
      line-height: 1.75;
      color: rgba(255, 255, 255, 0.88);
    }

    .procurement-ai-impact-card li::before {
      content: '';
      position: absolute;
      top: 11px;
      left: 0;
      width: 7px;
      height: 7px;
      border-radius: 999px;
      background: #9dd2f4;
      box-shadow: 0 0 0 4px rgba(157, 210, 244, 0.2);
    }

    .procurement-marc-card {
      display: grid;
      grid-template-columns: 84px minmax(0, 1fr) auto;
      align-items: center;
      gap: 18px;
      padding: 22px;
      border-radius: 18px;
      background: #fff;
      border: 1px solid rgba(26, 37, 51, 0.1);
      box-shadow: 0 12px 28px rgba(20, 35, 58, 0.06);
    }

    .procurement-marc-avatar {
      width: 84px;
      height: 84px;
      border-radius: 999px;
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      background: #edf2f8;
      border: 1px solid rgba(26, 37, 51, 0.12);
    }

    .procurement-marc-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      border-radius: inherit;
    }

    .procurement-marc-initials {
      font-size: 20px;
      font-weight: 700;
      letter-spacing: 0.04em;
      color: #2a5f9c;
    }

    .procurement-marc-copy {
      min-width: 0;
    }

    .procurement-marc-label {
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #4f6e91;
      margin-bottom: 4px;
    }

    .procurement-marc-copy h2 {
      font-size: 30px;
      line-height: 1.2;
      letter-spacing: -0.65px;
      color: #1a2533;
      margin-bottom: 4px;
    }

    .procurement-marc-role {
      font-size: 14px;
      color: #42566f;
      margin-bottom: 6px;
    }

    .procurement-marc-email {
      display: inline-flex;
      align-items: center;
      text-decoration: none;
      font-size: 13px;
      color: #2f6ab1;
      margin-bottom: 8px;
    }

    .procurement-marc-email:hover {
      text-decoration: underline;
    }

    .procurement-marc-description {
      font-size: 14px;
      line-height: 1.68;
      color: #5c6979;
      margin: 0;
      max-width: 650px;
    }

    .procurement-marc-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      white-space: nowrap;
      border-radius: 12px;
      background: #1a2533;
      color: #fff;
      padding: 12px 16px;
      font-size: 13px;
      font-weight: 600;
      box-shadow: 0 8px 18px rgba(15, 26, 40, 0.16);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .procurement-marc-link:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 22px rgba(15, 26, 40, 0.24);
    }

    .procurement-marc-link svg {
      width: 14px;
      height: 14px;
    }

    .procurement-outro {
      text-align: center;
      margin-top: 38px;
      margin-bottom: 8px;
    }

    .procurement-outro h2 {
      font-size: 36px;
      letter-spacing: -0.9px;
      color: #1a2533;
      margin-bottom: 10px;
    }

    .procurement-outro p {
      max-width: 700px;
      margin: 0 auto 18px;
      font-size: 16px;
      line-height: 1.75;
      color: #566174;
    }

    @media (max-width: 768px) {
      .portfolio-header h1 {
        font-size: 32px;
      }

      .services-category-grid {
        grid-template-columns: 1fr;
      }

      .services-category-card {
        min-height: 260px;
      }

      .portfolio-row {
        grid-template-columns: 1fr;
      }

      .portfolio-lines {
        display: none;
      }

      .service-reference-card {
        flex-direction: column;
        align-items: flex-start;
      }

      .service-reference-copy h2 {
        font-size: 24px;
      }

      .service-pages {
        margin-top: 52px;
        padding: 0 16px;
      }

      .service-pages-header h2 {
        font-size: 30px;
      }

      .service-pages-sub {
        font-size: 15px;
      }

      .service-pages-grid {
        grid-template-columns: 1fr;
      }

      .services-category-section {
        grid-template-columns: 1fr;
        padding: 18px;
      }

      .services-category-section-copy {
        position: static;
      }

      .service-domain-note {
        flex-direction: column;
        align-items: flex-start;
      }

      .procurement-hero {
        margin: 16px 16px 0;
        border-radius: 24px;
        min-height: 480px;
        padding: 70px 0;
      }

      .procurement-hero-inner {
        padding: 0 24px;
      }

      .procurement-hero h1 {
        font-size: 36px;
        letter-spacing: -1px;
      }

      .procurement-hero-sub {
        font-size: 16px;
      }

      .procurement-context,
      .procurement-practice,
      .procurement-ai-impact,
      .procurement-marc,
      .procurement-outro {
        padding: 0 16px;
      }

      .procurement-context-card {
        padding: 24px;
      }

      .procurement-context-card h2 {
        font-size: 26px;
      }

      .procurement-practice-header h2 {
        font-size: 30px;
      }

      .procurement-pillar-grid {
        grid-template-columns: 1fr;
      }

      .procurement-ai-impact-card {
        padding: 24px;
      }

      .procurement-ai-impact-card h2 {
        font-size: 28px;
      }

      .procurement-marc-card {
        grid-template-columns: 64px 1fr;
        padding: 18px;
        gap: 12px;
        align-items: flex-start;
      }

      .procurement-marc-avatar {
        width: 56px;
        height: 56px;
      }

      .procurement-marc-initials {
        font-size: 18px;
      }

      .procurement-marc-copy h2 {
        font-size: 24px;
      }

      .procurement-marc-email {
        font-size: 12.5px;
      }

      .procurement-marc-description {
        font-size: 14.5px;
      }

      .procurement-marc-link {
        grid-column: 1 / -1;
        justify-self: start;
      }

      .procurement-outro h2 {
        font-size: 30px;
      }
    }

    /* ── About page ── */
    .about-intro {
      max-width: 780px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .about-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #8c6d3f;
      margin-bottom: 12px;
    }

    .about-intro h1 {
      font-size: 48px;
      font-weight: 500;
      letter-spacing: -1.5px;
      line-height: 1.1;
      color: #1a2533;
      margin-bottom: 32px;
    }

    .about-body {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .about-body p {
      font-size: 17px;
      line-height: 1.8;
      color: #5a6270;
    }

    /* Team section */
    .about-team {
      max-width: 1080px;
      margin: 80px auto 0;
      padding: 0 24px;
    }

    .about-team h2 {
      font-size: 32px;
      font-weight: 500;
      letter-spacing: -0.8px;
      color: #1a2533;
      margin-bottom: 40px;
    }

    .team-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 32px;
    }

    .team-card {
      cursor: pointer;
      text-align: center;
      transition: transform 0.2s ease;
    }

    .team-card:hover {
      transform: translateY(-3px);
    }

    .team-photo {
      width: 100%;
      aspect-ratio: 1;
      border-radius: 16px;
      background-color: #e8ecf2;
      background-size: cover;
      background-position: center;
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }

    .team-photo .team-initials {
      font-size: 32px;
      font-weight: 600;
      color: #8a919c;
      letter-spacing: 1px;
    }

    /* Hide initials when a real photo is loaded */
    .team-photo[style*="url"] .team-initials {
      display: none;
    }

    .team-card h3 {
      font-size: 17px;
      font-weight: 500;
      color: #1a2533;
      margin-bottom: 4px;
      letter-spacing: -0.2px;
    }

    .team-role {
      font-size: 14px;
      color: #5a6270;
    }

    /* Team modal */
    .team-modal {
      position: fixed;
      inset: 0;
      z-index: 2000;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0, 0, 0, 0.6);
      backdrop-filter: blur(4px);
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .team-modal.open {
      opacity: 1;
      visibility: visible;
    }

    .team-modal-inner {
      display: flex;
      max-width: 900px;
      width: 90%;
      max-height: 85vh;
      background: #fff;
      border-radius: 24px;
      overflow: hidden;
      box-shadow: 0 24px 80px rgba(0, 0, 0, 0.25);
      transform: scale(0.95) translateY(10px);
      transition: transform 0.3s ease;
    }

    .team-modal.open .team-modal-inner {
      transform: scale(1) translateY(0);
    }

    .team-modal-photo {
      width: 45%;
      min-height: 400px;
      background-color: #e8ecf2;
      background-size: cover;
      background-position: center;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .team-modal-photo .team-initials {
      font-size: 64px;
      font-weight: 600;
      color: #8a919c;
      letter-spacing: 2px;
    }

    .team-modal-photo[style*="url"] .team-initials {
      display: none;
    }

    .team-modal-content {
      flex: 1;
      padding: 40px;
      overflow-y: auto;
      position: relative;
    }

    .team-modal-close {
      position: absolute;
      top: 16px;
      right: 16px;
      width: 36px;
      height: 36px;
      border: none;
      background: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 8px;
      transition: background 0.2s ease;
    }

    .team-modal-close:hover {
      background: #f2f4f8;
    }

    .team-modal-close svg {
      width: 22px;
      height: 22px;
      color: #5a6270;
    }

    .team-modal-content h2 {
      font-size: 28px;
      font-weight: 500;
      color: #1a2533;
      letter-spacing: -0.5px;
      margin-bottom: 4px;
    }

    .team-modal-role {
      font-size: 15px;
      color: #5a6270;
      margin-bottom: 28px;
    }

    .team-modal-bio p {
      font-size: 15px;
      line-height: 1.8;
      color: #3a4a5c;
      margin-bottom: 16px;
    }

    .team-modal-linkedin {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: 8px;
      background: #1a2533;
      margin-top: 8px;
      transition: background 0.2s ease;
    }

    .team-modal-linkedin:hover {
      background: #3b7ddb;
    }

    .team-modal-linkedin svg {
      width: 16px;
      height: 16px;
      fill: #fff;
    }

    @media (max-width: 768px) {
      .about-intro h1 {
        font-size: 32px;
      }

      .team-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
      }

      .team-modal-inner {
        flex-direction: column;
        max-height: 90vh;
      }

      .team-modal-photo {
        width: 100%;
        min-height: 250px;
      }

      .team-modal-content {
        padding: 28px;
      }
    }

    /* ── Customer stories overview ── */
    .stories-overview {
      max-width: 1280px;
      margin: 128px auto 0;
      padding: 0 24px;
    }

    .stories-overview-header {
      max-width: 760px;
      margin: 0 auto 44px;
      text-align: center;
    }

    .stories-overview-label {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #3b7ddb;
      margin-bottom: 12px;
    }

    .stories-overview-header h1 {
      font-size: 46px;
      font-weight: 500;
      letter-spacing: -1.2px;
      line-height: 1.1;
      color: #1a2533;
      margin-bottom: 16px;
    }

    .stories-overview-header p {
      font-size: 17px;
      color: #5a6270;
      line-height: 1.75;
    }

    .stories-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.55fr) repeat(2, minmax(260px, 0.72fr));
      gap: 26px;
      align-items: stretch;
    }

    .story-card {
      display: flex;
      flex-direction: column;
      text-decoration: none;
      gap: 18px;
      transition: transform 0.28s ease;
      color: inherit;
    }

    .story-card:hover {
      transform: translateY(-6px);
    }

    .story-card-visual {
      position: relative;
      min-height: 420px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 18px;
      padding: 28px;
      border-radius: 28px;
      background-image:
        linear-gradient(180deg, rgba(14, 22, 34, 0.04) 0%, rgba(14, 22, 34, 0.44) 100%),
        var(
          --story-card-bg-image,
          linear-gradient(135deg, rgba(59, 125, 219, 0.95) 0%, rgba(74, 138, 212, 0.92) 45%, rgba(91, 163, 217, 0.88) 100%)
        );
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      color: rgba(255, 255, 255, 0.9);
      overflow: hidden;
    }

    .story-card-visual::after {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 78% 10%, rgba(255, 255, 255, 0.14) 0%, transparent 26%),
        linear-gradient(180deg, rgba(8, 18, 30, 0.04) 0%, rgba(8, 18, 30, 0.46) 100%);
      pointer-events: none;
    }

    .story-card-visual > * {
      position: relative;
      z-index: 1;
    }

    .story-card-visual-top {
      display: flex;
      align-items: flex-start;
      justify-content: flex-start;
    }

    .story-card-visual-bottom {
      display: flex;
      flex-direction: column;
      gap: 14px;
      max-width: min(82%, 560px);
    }

    .story-card-visual-brand {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 52px;
      max-width: min(86%, 280px);
      padding: 10px 16px;
      border-radius: 16px;
      background: rgba(255, 255, 255, 0.88);
    }

    .story-card-visual-logo {
      display: block;
      width: auto;
      max-width: 100%;
      max-height: 28px;
      object-fit: contain;
    }

    .story-card-visual-logo-fallback {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #234f83;
      white-space: nowrap;
    }

    .story-card-body {
      display: flex;
      flex-direction: column;
      flex: 1;
      gap: 18px;
      padding: 0 4px;
    }

    .story-card-meta {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 10px;
      flex-wrap: wrap;
    }

    .story-card-sector {
      font-size: 13px;
      font-weight: 600;
      color: rgba(31, 41, 55, 0.82);
      background: rgba(230, 232, 238, 0.85);
      border-radius: 980px;
      padding: 10px 16px;
      white-space: nowrap;
    }

    .story-card h2 {
      font-size: 20px;
      font-weight: 500;
      letter-spacing: -0.4px;
      line-height: 1.24;
      color: #1a2533;
    }

    .story-card p {
      font-size: 15px;
      color: #5a6270;
      line-height: 1.75;
      flex: 1;
    }

    .story-card-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 14px;
      font-weight: 600;
      color: #3b7ddb;
    }

    .story-card-arrow {
      width: 15px;
      height: 15px;
      transition: transform 0.2s ease;
    }

    .story-card:hover .story-card-arrow {
      transform: translateX(3px);
    }

    .story-card-featured .story-card-visual {
      min-height: 620px;
      padding: 28px 28px 30px;
      background-position: center;
    }

    .story-card-featured h2 {
      font-size: clamp(32px, 3vw, 42px);
      line-height: 1.1;
      color: #ffffff;
      max-width: 13ch;
    }

    .story-card-featured .story-card-sector {
      color: rgba(255, 255, 255, 0.95);
      background: rgba(255, 255, 255, 0.18);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    @media (max-width: 1024px) {
      .stories-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .story-card-featured {
        grid-column: 1 / -1;
      }

      .story-card-featured .story-card-visual {
        min-height: 520px;
      }
    }

    @media (max-width: 768px) {
      .stories-overview {
        margin-top: 104px;
      }

      .stories-overview-header h1 {
        font-size: 32px;
      }

      .stories-overview-header p {
        font-size: 16px;
      }

      .stories-grid {
        grid-template-columns: 1fr;
      }

      .story-card-visual {
        min-height: 300px;
        padding: 22px;
      }

      .story-card-visual-brand {
        max-width: 92%;
        min-height: 44px;
      }

      .story-card-visual-logo {
        max-height: 27px;
      }

      .story-card h2 {
        font-size: 22px;
      }

      .story-card-featured .story-card-visual {
        min-height: 420px;
      }

      .story-card-featured h2 {
        font-size: 28px;
      }

      .story-card-body {
        padding: 0;
      }
    }

    /* ── Case story detail page ── */
    .case-story {
      max-width: 1320px;
      margin: 56px auto 0;
      padding: 0 24px;
    }

    .case-story-shell {
      padding: 12px 0 0;
    }

    .case-story-back {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      font-size: 14.5px;
      font-weight: 500;
      color: #3b7ddb;
      margin-bottom: 26px;
      transition: opacity 0.2s ease;
    }

    .case-story-back:hover {
      opacity: 0.75;
    }

    .case-story-top {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 270px;
      gap: 32px;
      align-items: start;
      margin-top: 22px;
    }

    .case-story-eyebrow {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #8892a1;
      margin-bottom: 12px;
    }

    .case-story-intro h1 {
      max-width: 15ch;
      font-size: clamp(40px, 5vw, 68px);
      font-weight: 500;
      letter-spacing: -2.2px;
      line-height: 0.98;
      color: #1a2533;
    }

    .case-story-intro p {
      margin-top: 20px;
      max-width: 760px;
      font-size: 20px;
      line-height: 1.65;
      color: #5a6270;
    }

    .case-story-overview {
      display: grid;
      gap: 14px;
      align-self: end;
    }

    .case-story-overview-card {
      display: grid;
      gap: 12px;
      padding: 22px;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.72);
      border: 1px solid rgba(219, 226, 236, 0.8);
    }

    .case-story-overview-logo {
      width: auto;
      max-width: 160px;
      max-height: 34px;
      object-fit: contain;
    }

    .case-story-overview-card p {
      font-size: 18px;
      font-weight: 600;
      color: #1a2533;
    }

    .case-story-overview-card span {
      font-size: 14px;
      color: #647083;
    }

    .case-story-share {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 46px;
      padding: 0 18px;
      border-radius: 999px;
      text-decoration: none;
      background: #111111;
      color: #ffffff;
      font-size: 14px;
      font-weight: 600;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .case-story-share:hover {
      transform: translateY(-1px);
      opacity: 0.92;
    }

    .case-story-media {
      position: relative;
      margin-top: 32px;
      min-height: clamp(320px, 52vh, 620px);
      border-radius: 28px;
      overflow: hidden;
      background-image:
        linear-gradient(180deg, rgba(8, 18, 30, 0.04) 0%, rgba(8, 18, 30, 0.38) 100%),
        var(
          --case-story-bg-image,
          linear-gradient(136deg, rgba(59, 125, 219, 0.85) 0%, rgba(91, 163, 217, 0.8) 100%)
        );
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      box-shadow: inset 0 -90px 120px rgba(8, 22, 38, 0.2);
    }

    .case-story-media::after {
      content: '';
      position: absolute;
      inset: auto 0 0;
      height: 56%;
      background: linear-gradient(180deg, rgba(8, 22, 40, 0) 0%, rgba(8, 22, 40, 0.52) 100%);
      pointer-events: none;
    }

    .case-story-media-bar {
      position: absolute;
      top: 24px;
      left: 24px;
      z-index: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      max-width: min(420px, calc(100% - 48px));
      min-height: 54px;
      padding: 12px 18px;
      border-radius: 16px;
      background: rgba(255, 255, 255, 0.9);
    }

    .case-story-media-logo {
      display: block;
      width: auto;
      max-width: 100%;
      max-height: 34px;
      object-fit: contain;
    }

    .case-story-media-logo-fallback {
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #234f83;
      white-space: nowrap;
    }

    .case-story-body {
      display: grid;
      grid-template-columns: 280px minmax(0, 1fr);
      gap: 42px;
      margin-top: 38px;
      align-items: start;
    }

    .case-story-sidebar {
      position: sticky;
      top: 108px;
      display: grid;
      gap: 24px;
    }

    .case-story-sidebar-section {
      display: grid;
      gap: 10px;
    }

    .case-story-sidebar-label {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #8892a1;
    }

    .case-story-sidebar-copy {
      font-size: 15px;
      line-height: 1.75;
      color: #5a6270;
    }

    .case-story-highlights {
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
    }

    .case-story-highlight {
      border-radius: 18px;
      background: rgba(255, 255, 255, 0.74);
      border: 1px solid rgba(219, 226, 236, 0.8);
      padding: 16px 18px;
    }

    .case-story-highlight-label {
      font-size: 11px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #8a919c;
      margin-bottom: 8px;
    }

    .case-story-highlight-value {
      font-size: 15px;
      line-height: 1.45;
      color: #1a2533;
      font-weight: 600;
    }

    .case-story-content {
      display: grid;
      gap: 38px;
    }

    .case-story-article-section {
      display: grid;
      gap: 18px;
      padding-top: 12px;
      border-top: 1px solid rgba(203, 211, 222, 0.68);
    }

    .case-story-article-section h2 {
      font-size: 32px;
      font-weight: 500;
      letter-spacing: -0.8px;
      color: #1a2533;
    }

    .case-story-article-section > p {
      max-width: 72ch;
      font-size: 18px;
      line-height: 1.8;
      color: #4f5a6c;
    }

    .case-story-block-stack {
      display: grid;
      gap: 26px;
    }

    .case-story-block {
      padding: 0 0 26px;
      border-bottom: 1px solid rgba(218, 225, 235, 0.76);
    }

    .case-story-block h2 {
      font-size: 24px;
      font-weight: 500;
      color: #1a2533;
      letter-spacing: -0.35px;
      margin-bottom: 12px;
    }

    .case-story-block p {
      max-width: 70ch;
      font-size: 17px;
      line-height: 1.9;
      color: #5a6270;
    }

    .case-story-block p + p {
      margin-top: 10px;
    }

    .case-story-list {
      margin-top: 12px;
      padding-left: 20px;
      display: grid;
      gap: 8px;
      color: #5a6270;
      font-size: 16px;
      line-height: 1.8;
    }

    @media (max-width: 1024px) {
      .case-story-top {
        grid-template-columns: 1fr;
      }

      .case-story-overview {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: stretch;
      }

      .case-story-body {
        grid-template-columns: 1fr;
        gap: 28px;
      }

      .case-story-sidebar {
        position: static;
      }

      .case-story-highlights {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 768px) {
      .case-story {
        margin-top: 64px;
      }

      .case-story-media {
        margin-top: 24px;
        min-height: 240px;
        border-radius: 18px;
      }

      .case-story-media-bar {
        top: 14px;
        left: 14px;
        min-height: 46px;
        padding: 10px 12px;
        max-width: calc(100% - 28px);
      }

      .case-story-media-logo {
        max-height: 28px;
      }

      .case-story-top {
        gap: 22px;
      }

      .case-story-intro h1 {
        font-size: 34px;
        letter-spacing: -1.2px;
      }

      .case-story-intro p {
        font-size: 17px;
      }

      .case-story-overview {
        grid-template-columns: 1fr;
      }

      .case-story-highlights {
        grid-template-columns: 1fr;
      }

      .case-story-article-section h2 {
        font-size: 26px;
      }

      .case-story-block {
        padding: 0 0 22px;
      }

      .case-story-block h2 {
        font-size: 21px;
      }
    }

    /* ── Vision page ── */
    .vision-hero {
      position: relative;
      max-width: 1280px;
      margin: 24px auto 0;
      padding: 0 24px;
      isolation: isolate;
    }

    .vision-hero-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(56px);
      z-index: 0;
      pointer-events: none;
      animation: vision-drift 18s ease-in-out infinite;
    }

    .vision-hero-orb-1 {
      width: 280px;
      height: 280px;
      top: -62px;
      left: 92px;
      background: rgba(127, 185, 236, 0.35);
    }

    .vision-hero-orb-2 {
      width: 320px;
      height: 320px;
      right: 68px;
      bottom: -110px;
      background: rgba(99, 159, 219, 0.24);
      animation-delay: -9s;
    }

    .vision-hero-grid {
      position: absolute;
      inset: 0 24px;
      border-radius: 30px;
      background-image:
        linear-gradient(rgba(90, 126, 169, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(90, 126, 169, 0.12) 1px, transparent 1px);
      background-size: 34px 34px;
      opacity: 0.46;
      mask-image: radial-gradient(circle at 40% 34%, black 40%, transparent 100%);
      -webkit-mask-image: radial-gradient(circle at 40% 34%, black 40%, transparent 100%);
      z-index: 0;
      pointer-events: none;
    }

    .vision-hero-inner {
      position: relative;
      z-index: 1;
      border-radius: 30px;
      padding: 84px 72px 80px;
      background:
        linear-gradient(132deg, rgba(255, 255, 255, 0.96) 0%, rgba(236, 244, 253, 0.95) 63%, rgba(225, 239, 253, 0.95) 100%);
      border: 1px solid rgba(122, 161, 205, 0.24);
      box-shadow:
        0 22px 44px rgba(19, 53, 98, 0.12),
        0 1px 0 rgba(255, 255, 255, 0.78) inset;
      animation: vision-fade-up 0.85s ease both;
    }

    .vision-eyebrow {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #2f67ad;
      margin-bottom: 14px;
    }

    .vision-hero h1 {
      max-width: 860px;
      font-size: 56px;
      line-height: 1.06;
      letter-spacing: -1.9px;
      color: #15273f;
      margin-bottom: 18px;
    }

    .vision-hero-lead {
      max-width: 760px;
      font-size: 18px;
      line-height: 1.82;
      color: #384f6d;
      margin-bottom: 14px;
    }

    .vision-hero-sub {
      max-width: 700px;
      font-size: 16px;
      line-height: 1.8;
      color: #4b6180;
    }

    .vision-story,
    .vision-consequences,
    .vision-outlook {
      max-width: 1280px;
      margin: 76px auto 0;
      padding: 0 24px;
    }

    .vision-story {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
      gap: 18px;
      align-items: start;
    }

    .vision-story-panel {
      border-radius: 22px;
      border: 1px solid rgba(101, 137, 179, 0.18);
      background: rgba(255, 255, 255, 0.64);
      backdrop-filter: blur(22px) saturate(1.2);
      -webkit-backdrop-filter: blur(22px) saturate(1.2);
      box-shadow:
        0 14px 30px rgba(29, 53, 86, 0.08),
        0 1px 0 rgba(255, 255, 255, 0.74) inset;
      animation: vision-fade-up 0.8s ease both;
    }

    .vision-story-copy {
      padding: 34px 34px 30px;
      animation-delay: 0.1s;
    }

    .vision-story-copy h2 {
      font-size: 34px;
      line-height: 1.13;
      letter-spacing: -0.85px;
      color: #172a43;
      margin-bottom: 14px;
    }

    .vision-story-copy p {
      font-size: 15.5px;
      line-height: 1.82;
      color: #4a5e79;
    }

    .vision-story-copy p + p {
      margin-top: 12px;
    }

    .vision-signal-grid {
      display: grid;
      gap: 12px;
    }

    .vision-signal-card {
      position: relative;
      overflow: hidden;
      padding: 24px 24px 22px;
      animation-delay: 0.18s;
    }

    .vision-signal-card:nth-child(2) {
      animation-delay: 0.24s;
    }

    .vision-signal-card:nth-child(3) {
      animation-delay: 0.3s;
    }


    .vision-signal-card h3 {
      font-size: 22px;
      letter-spacing: -0.4px;
      line-height: 1.24;
      color: #1a304c;
      margin-bottom: 10px;
    }

    .vision-signal-card p {
      font-size: 14.5px;
      line-height: 1.76;
      color: #536982;
    }

    .vision-consequences-head {
      max-width: 760px;
      margin-bottom: 24px;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }

    .vision-consequences-head h2 {
      font-size: 42px;
      line-height: 1.1;
      letter-spacing: -1.15px;
      color: #162b47;
    }

    .vision-consequence-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
    }

    .vision-consequence-card {
      border-radius: 20px;
      border: 1px solid rgba(95, 133, 177, 0.17);
      background: rgba(255, 255, 255, 0.75);
      box-shadow:
        0 12px 26px rgba(24, 52, 88, 0.07),
        0 1px 0 rgba(255, 255, 255, 0.84) inset;
      padding: 24px 22px;
      transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
      animation: vision-fade-up 0.8s ease both;
      animation-delay: 0.14s;
    }

    .vision-consequence-card:nth-child(2) {
      animation-delay: 0.2s;
    }

    .vision-consequence-card:nth-child(3) {
      animation-delay: 0.26s;
    }

    .vision-consequence-card:hover {
      transform: translateY(-3px);
      border-color: rgba(59, 125, 219, 0.35);
      box-shadow:
        0 16px 30px rgba(24, 52, 88, 0.12),
        0 1px 0 rgba(255, 255, 255, 0.9) inset;
    }

    .vision-consequence-index {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      color: #316cad;
      margin-bottom: 10px;
    }

    .vision-consequence-card h3 {
      font-size: 22px;
      line-height: 1.24;
      letter-spacing: -0.36px;
      color: #1a304c;
      margin-bottom: 10px;
    }

    .vision-consequence-card p {
      font-size: 14.5px;
      line-height: 1.78;
      color: #4f637d;
    }

    .vision-outlook {
      margin-top: 58px;
    }

    .vision-outlook-card {
      position: relative;
      overflow: hidden;
      border-radius: 24px;
      padding: 42px;
      background:
        linear-gradient(137deg, rgba(240, 247, 255, 0.95) 0%, rgba(226, 239, 252, 0.95) 55%, rgba(219, 235, 250, 0.94) 100%);
      border: 1px solid rgba(91, 132, 179, 0.22);
      box-shadow:
        0 22px 40px rgba(24, 53, 90, 0.12),
        0 1px 0 rgba(255, 255, 255, 0.82) inset;
      animation: vision-fade-up 0.82s ease both;
      animation-delay: 0.16s;
    }

    .vision-outlook-card::after {
      content: '';
      position: absolute;
      inset: auto -6% -60% 42%;
      height: 330px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(117, 177, 230, 0.3) 0%, rgba(117, 177, 230, 0) 70%);
      pointer-events: none;
    }

    .vision-outlook-card h2 {
      max-width: 840px;
      font-size: 40px;
      line-height: 1.1;
      letter-spacing: -1.05px;
      color: #13263e;
      margin-bottom: 14px;
    }

    .vision-outlook-card p {
      max-width: 860px;
      font-size: 16px;
      line-height: 1.82;
      color: #4a607c;
      position: relative;
      z-index: 1;
    }

    .vision-outlook-card p + p {
      margin-top: 8px;
    }

    .vision-outlook-cta {
      margin-top: 22px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      border-radius: 980px;
      font-size: 14px;
      font-weight: 600;
      color: #fff;
      background: linear-gradient(132deg, #346fb6 0%, #5aa0d7 100%);
      padding: 12px 20px;
      box-shadow: 0 12px 22px rgba(46, 94, 156, 0.27);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      position: relative;
      z-index: 1;
    }

    .vision-outlook-cta:hover {
      transform: translateY(-1px);
      box-shadow: 0 15px 26px rgba(46, 94, 156, 0.33);
    }

    .vision-outlook-cta svg {
      width: 14px;
      height: 14px;
      transition: transform 0.2s ease;
    }

    .vision-outlook-cta:hover svg {
      transform: translateX(3px);
    }

    @keyframes vision-drift {
      0%,
      100% {
        transform: translate3d(0, 0, 0) scale(1);
      }
      35% {
        transform: translate3d(10px, -12px, 0) scale(1.05);
      }
      70% {
        transform: translate3d(-12px, 8px, 0) scale(0.96);
      }
    }

    @keyframes vision-fade-up {
      from {
        opacity: 0;
        transform: translate3d(0, 14px, 0);
      }
      to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
      }
    }

    @keyframes vision-shimmer {
      0% {
        background-position: 0% 50%;
      }
      100% {
        background-position: 220% 50%;
      }
    }

    @media (max-width: 1080px) {
      .vision-hero-inner {
        padding: 72px 46px 66px;
      }

      .vision-hero h1 {
        font-size: 46px;
        letter-spacing: -1.45px;
      }

      .vision-story {
        grid-template-columns: 1fr;
      }

      .vision-consequence-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .vision-consequences-head h2,
      .vision-outlook-card h2 {
        font-size: 34px;
        letter-spacing: -0.85px;
      }
    }

    @media (max-width: 768px) {
      .vision-hero {
        margin-top: 16px;
        padding: 0 16px;
      }

      .vision-hero-grid {
        inset: 0 16px;
        border-radius: 22px;
      }

      .vision-hero-inner {
        border-radius: 22px;
        padding: 48px 24px 42px;
      }

      .vision-hero h1 {
        font-size: 34px;
        line-height: 1.1;
        letter-spacing: -0.95px;
      }

      .vision-hero-lead,
      .vision-hero-sub {
        font-size: 15.5px;
      }

      .vision-story,
      .vision-consequences,
      .vision-outlook {
        margin-top: 56px;
        padding: 0 16px;
      }

      .vision-story-copy {
        padding: 24px 22px;
      }

      .vision-story-copy h2 {
        font-size: 28px;
      }

      .vision-signal-card h3,
      .vision-consequence-card h3 {
        font-size: 20px;
      }

      .vision-consequence-grid {
        grid-template-columns: 1fr;
      }

      .vision-consequences-head h2,
      .vision-outlook-card h2 {
        font-size: 30px;
      }

      .vision-outlook {
        margin-top: 42px;
      }

      .vision-outlook-card {
        border-radius: 20px;
        padding: 28px 24px;
      }

      .vision-outlook-card p {
        font-size: 15px;
      }

      .vision-outlook-cta {
        width: 100%;
        justify-content: center;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .vision-hero-orb,
      .vision-story-panel,
      .vision-consequence-card,
      .vision-outlook-card,
      .vision-signal-card::before {
        animation: none;
      }

      .vision-outlook-cta,
      .vision-consequence-card {
        transition: none;
      }

      .home-services-reveal::before,
      .home-services-reveal-sweep,
      .home-services-reveal-sweep::after,
      .home-service-node,
      .home-service-node::before,
      .home-service-track-link svg {
        animation: none;
        transition: none;
      }

      .home-service-node {
        opacity: 1;
        transform: none;
      }
    }

/* ── Services intro header ── */
.services-intro {
  max-width: 780px;
  margin: 80px auto 0;
  padding: 0 24px;
  text-align: center;
}

.services-intro-label {
  font-size: 12.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #3b7ddb;
  margin-bottom: 12px;
}

.services-intro h1 {
  font-size: clamp(32px, 5vw, 52px);
  font-weight: 500;
  letter-spacing: -1.6px;
  line-height: 1.08;
  color: #1a2533;
  margin-bottom: 16px;
}

.services-intro-sub {
  font-size: 17px;
  line-height: 1.75;
  color: #5a6270;
  max-width: 580px;
  margin: 0 auto;
}

/* ── Per-category detail sections ── */
.service-category-sections {
  margin-top: 0;
}

.service-category-section {
  max-width: 1080px;
  margin: 80px auto 0;
  padding: 0 24px;
}

.service-category-section + .service-category-section {
  margin-top: 60px;
  padding-top: 64px;
  border-top: 1px solid rgba(200, 215, 240, 0.7);
}

.service-category-header {
  margin-bottom: 32px;
}

.service-category-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #3b7ddb;
  margin-bottom: 12px;
}

.service-category-eyebrow::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  background: #3b7ddb;
  border-radius: 50%;
  flex-shrink: 0;
}

.service-category-header h2 {
  font-size: clamp(26px, 3.8vw, 42px);
  font-weight: 500;
  letter-spacing: -1px;
  color: #1a2533;
  margin-bottom: 12px;
  line-height: 1.1;
}

.service-category-description {
  font-size: 16px;
  line-height: 1.75;
  color: #5a6270;
  max-width: 640px;
}

/* ── Service detail block ── */
.service-detail-block {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(200, 215, 240, 0.65);
  border-radius: 20px;
  padding: 0;
  margin-bottom: 16px;
  overflow: hidden;
  box-shadow:
    0 2px 4px rgba(26, 37, 51, 0.04),
    0 12px 40px rgba(26, 37, 51, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.service-detail-block-top {
  padding: 32px 40px 28px;
  background: linear-gradient(140deg, rgba(59, 125, 219, 0.07) 0%, rgba(100, 160, 240, 0.02) 55%, transparent 100%);
  border-bottom: 1px solid rgba(59, 125, 219, 0.09);
}

.service-detail-category {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #3b7ddb;
  margin-bottom: 8px;
}

.service-detail-block-top h3 {
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 500;
  letter-spacing: -0.6px;
  color: #1a2533;
  margin-bottom: 10px;
  line-height: 1.16;
}

.service-detail-intro {
  font-size: 15px;
  line-height: 1.75;
  color: #526074;
  max-width: 740px;
  margin: 0;
}

/* ── Pillar grid ── */
.service-pillars-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  padding: 28px 40px 24px;
}

.service-pillar-tile {
  padding: 18px 20px;
  background: #ffffff;
  border: 1px solid rgba(59, 125, 219, 0.13);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  box-shadow: 0 2px 8px rgba(26, 37, 51, 0.05);
}

.service-pillar-index {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #3b7ddb;
  font-variant-numeric: tabular-nums;
}

.service-pillar-tile strong {
  font-size: 13.5px;
  font-weight: 600;
  color: #1a2533;
  line-height: 1.3;
}

.service-pillar-tile p {
  font-size: 13px;
  line-height: 1.65;
  color: #526074;
  margin: 0;
}

/* ── Advanced Prompt Training follow-up note ── */
.service-followup-note {
  font-size: 13.5px;
  line-height: 1.7;
  color: #3a4a5c;
  background: rgba(59, 125, 219, 0.05);
  border: 1px solid rgba(59, 125, 219, 0.12);
  border-radius: 12px;
  padding: 14px 18px;
  margin: 0 40px 0;
}

.service-followup-note strong {
  font-weight: 600;
  color: #1a2533;
}

/* ── Impact list + CTA footer ── */
.service-detail-footer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 40px 28px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  margin-top: 24px;
  flex-wrap: wrap;
}

.service-impact-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex: 1;
  min-width: 0;
}

.service-impact-list li {
  font-size: 14px;
  line-height: 1.5;
  color: #3a4a5c;
  padding-left: 22px;
  position: relative;
}

.service-impact-list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #3b7ddb;
  font-weight: 700;
  font-size: 13px;
}

.service-detail-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 600;
  color: #ffffff;
  background: #2f6ab1;
  text-decoration: none;
  flex-shrink: 0;
  padding: 9px 16px;
  border-radius: 8px;
  transition: background 0.2s ease, transform 0.15s ease;
  align-self: flex-end;
}

.service-detail-cta:hover {
  background: #2460a0;
}

.service-detail-cta svg {
  width: 14px;
  height: 14px;
  transition: transform 0.2s ease;
}

.service-detail-cta:hover svg {
  transform: translateX(3px);
}

@media (max-width: 860px) {
  .service-detail-block-top {
    padding: 24px 28px 22px;
  }

  .service-pillars-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 22px 28px 18px;
  }

  .service-followup-note {
    margin: 0 28px 0;
  }

  .service-detail-footer {
    padding: 18px 28px 24px;
  }
}

@media (max-width: 600px) {
  .service-detail-block-top {
    padding: 20px 20px 18px;
  }

  .service-pillars-grid {
    grid-template-columns: 1fr;
    padding: 18px 20px 16px;
  }

  .service-followup-note {
    margin: 0 20px 0;
  }

  .service-detail-footer {
    flex-direction: column;
    padding: 16px 20px 22px;
  }

  .service-detail-cta {
    align-self: flex-start;
  }

  .service-category-section {
    padding: 0 16px;
  }
}

/* ── Procurement note ── */
.services-procurement-note {
  max-width: 1080px;
  margin: 64px auto 80px;
  padding: 0 24px;
}

.services-procurement-note-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: 28px 36px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(59, 125, 219, 0.12);
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(26, 37, 51, 0.04);
  flex-wrap: wrap;
}

.services-procurement-note-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3b7ddb;
  margin-bottom: 4px;
}

.services-procurement-note-copy h2 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.3px;
  color: #1a2533;
  margin-bottom: 4px;
}

.services-procurement-note-copy p {
  font-size: 14px;
  line-height: 1.65;
  color: #526074;
  max-width: 560px;
}

.services-procurement-note-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
  background: #2f6ab1;
  text-decoration: none;
  padding: 11px 20px;
  border-radius: 9px;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s ease;
}

.services-procurement-note-link:hover {
  background: #2460a0;
}

.services-procurement-note-link svg {
  width: 14px;
  height: 14px;
  transition: transform 0.2s ease;
}

.services-procurement-note-link:hover svg {
  transform: translateX(3px);
}

@media (max-width: 600px) {
  .services-procurement-note-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 22px 24px;
  }
}

/* ── Contact modal overlay ── */
.contact-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(10, 20, 40, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: contact-modal-fade-in 0.18s ease;
}

@keyframes contact-modal-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Card ── */
.contact-modal-card {
  position: relative;
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 24px 64px rgba(0, 0, 0, 0.18);
  padding: 52px 48px;
  width: 100%;
  max-width: 580px;
  animation: contact-modal-slide-in 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes contact-modal-slide-in {
  from { opacity: 0; transform: translateY(12px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Close button ── */
.contact-modal-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 36px;
  height: 36px;
  border: none;
  background: #f3f4f7;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #5a6270;
  transition: background 0.15s ease, color 0.15s ease;
  flex-shrink: 0;
}

.contact-modal-close svg {
  width: 16px;
  height: 16px;
}

.contact-modal-close:hover {
  background: #e8eaf0;
  color: #1a2533;
}

/* ── Header ── */
.contact-modal-eyebrow {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3b7ddb;
  margin-bottom: 12px;
}

.contact-modal-title {
  font-size: clamp(22px, 3.5vw, 28px);
  font-weight: 500;
  letter-spacing: -0.5px;
  color: #1a2533;
  line-height: 1.2;
  margin-bottom: 12px;
}

.contact-modal-sub {
  font-size: 15px;
  line-height: 1.65;
  color: #5a6270;
  margin-bottom: 32px;
}

/* ── Form ── */
.contact-modal-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.contact-modal-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.contact-modal-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.contact-modal-field label {
  font-size: 13px;
  font-weight: 500;
  color: #3a4250;
}

.contact-modal-optional {
  font-weight: 400;
  color: #9aa3b0;
}

.contact-modal-field input,
.contact-modal-field textarea {
  border: 1.5px solid #dde2ea;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 14px;
  font-family: inherit;
  color: #1a2533;
  background: #f7f8fb;
  outline: none;
  transition: border-color 0.15s ease, background 0.15s ease;
  resize: none;
}

.contact-modal-field input:focus,
.contact-modal-field textarea:focus {
  border-color: #3b7ddb;
  background: #fff;
}

.contact-modal-field input::placeholder,
.contact-modal-field textarea::placeholder {
  color: #adb5c2;
}

.contact-modal-field--error input,
.contact-modal-field--error textarea {
  border-color: #e05252;
  background: #fff8f8;
}

.contact-modal-error {
  font-size: 12px;
  color: #e05252;
  line-height: 1.4;
}

/* ── Submit button ── */
.contact-modal-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #3b7ddb;
  color: #fff;
  border: none;
  border-radius: 980px;
  padding: 14px 28px;
  font-size: 15px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  box-shadow: 0 4px 14px rgba(59, 125, 219, 0.28);
  align-self: flex-start;
  margin-top: 4px;
}

.contact-modal-submit svg {
  width: 15px;
  height: 15px;
}

.contact-modal-submit:hover:not(:disabled) {
  background: #2d6bc4;
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(59, 125, 219, 0.35);
}

.contact-modal-submit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

/* ── Success state ── */
.contact-modal-success {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 0;
}

.contact-modal-success-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #eaf2ff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3b7ddb;
  margin-bottom: 8px;
}

.contact-modal-success-icon svg {
  width: 24px;
  height: 24px;
}

.contact-modal-success h2 {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.4px;
  color: #1a2533;
}

.contact-modal-success p {
  font-size: 15px;
  line-height: 1.65;
  color: #5a6270;
  margin-bottom: 8px;
}

/* ── Responsive ── */
@media (max-width: 560px) {
  .contact-modal-card {
    padding: 36px 24px;
    border-radius: 20px;
  }

  .contact-modal-row {
    grid-template-columns: 1fr;
  }
}

/* ── Cookie Consent Banner ── */
.cookie-banner {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9000;
  width: calc(100% - 48px);
  max-width: 720px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 14px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
  padding: 20px 24px;
  animation: cookie-slide-in 0.3s ease;
}

@keyframes cookie-slide-in {
  from { opacity: 0; transform: translateX(-50%) translateY(16px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.cookie-banner-inner {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.cookie-banner-text {
  flex: 1;
  min-width: 260px;
  font-size: 14px;
  line-height: 1.55;
  color: #444;
  margin: 0;
}

.cookie-banner-link {
  color: #3b7ddb;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cookie-banner-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.cookie-banner-accept,
.cookie-banner-decline {
  padding: 9px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  white-space: nowrap;
}

.cookie-banner-accept {
  background: #0e0f19;
  color: #fff;
}

.cookie-banner-accept:hover {
  background: #1a1b2e;
}

.cookie-banner-decline {
  background: transparent;
  color: #666;
  border: 1px solid rgba(0, 0, 0, 0.15);
}

.cookie-banner-decline:hover {
  background: #f5f5f5;
}

@media (max-width: 600px) {
  .cookie-banner {
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    transform: none;
    border-radius: 14px 14px 0 0;
    max-width: none;
  }

  @keyframes cookie-slide-in {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  .cookie-banner-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
}

/* ── Privacy Policy Page ── */
.prose-page {
  max-width: 720px;
  margin: 80px auto 120px;
  padding: 0 24px;
}

.prose-page h1 {
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 700;
  letter-spacing: -0.03em;
  margin-bottom: 8px;
}

.prose-meta {
  font-size: 14px;
  color: #888;
  margin-bottom: 48px;
}

.prose-page h2 {
  font-size: 20px;
  font-weight: 650;
  margin-top: 48px;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.prose-page h3 {
  font-size: 16px;
  font-weight: 600;
  margin-top: 28px;
  margin-bottom: 8px;
  color: #222;
}

.prose-page p,
.prose-page li {
  font-size: 15px;
  line-height: 1.7;
  color: #444;
  margin-bottom: 12px;
}

.prose-page ul {
  padding-left: 20px;
  margin-bottom: 16px;
}

.prose-page a {
  color: #3b7ddb;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.prose-page code {
  font-size: 13px;
  background: #f2f2f5;
  padding: 2px 6px;
  border-radius: 4px;
  color: #333;
}

/* ── Footer privacy link ── */
.footer-bottom {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.footer-privacy-link {
  font-size: 13px;
  color: inherit;
  opacity: 0.6;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.footer-privacy-link:hover {
  opacity: 1;
}