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

    :root {
      --navy:    #1C3557;
      --navy2:   #142844;
      --gold:    #14B8A6;
      --gold2:   #0F9488;
      --offwhite:#FAF8F5;
      --light:   #F0EDE8;
      --text:    #1A1A1A;
      --muted:   #5A5A5A;
      --white:   #ffffff;
    }

    html { scroll-behavior: smooth; }

    body {
      font-family: 'Open Sans', sans-serif;
      color: var(--text);
      background: var(--white);
      line-height: 1.6;
    }

    h1, h2, h3, h4 {
      font-family: 'Montserrat', sans-serif;
    }

    a { text-decoration: none; color: inherit; }
    img { display: block; max-width: 100%; }

    /* ─── TOP BAR ──────────────────────────────── */
    .topbar {
      background: var(--navy2);
      color: rgba(255,255,255,0.85);
      padding: 9px 5%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 0.82rem;
      font-family: 'Montserrat', sans-serif;
      font-weight: 500;
      letter-spacing: 0.02em;
    }

    .topbar-left {
      display: flex;
      align-items: center;
      gap: 24px;
    }

    .topbar a {
      color: rgba(255,255,255,0.85);
      display: flex;
      align-items: center;
      gap: 7px;
      transition: color 0.2s;
    }

    .topbar a:hover { color: var(--gold); }

    .topbar svg { width: 14px; height: 14px; fill: var(--gold); flex-shrink: 0; }

    .topbar-badge {
      background: var(--gold);
      color: var(--white);
      padding: 3px 12px;
      border-radius: 3px;
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }

    /* ─── NAV ──────────────────────────────────── */
    nav {
      background: var(--white);
      border-bottom: 3px solid var(--gold);
      padding: 0 5%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 120px;
      position: sticky;
      top: 0;
      z-index: 100;
      box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    }
    .nav-left {
      display: flex;
      align-items: center;
      gap: 18px;
      min-width: 0;
    }
    .nav-contact {
      display: flex;
      flex-direction: column;
      gap: 6px;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.85rem;
      font-weight: 600;
    }
    .nav-contact a {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--navy);
      transition: color 0.2s;
    }
    .nav-contact a:hover { color: var(--gold); }
    .nav-contact svg { width: 15px; height: 15px; fill: var(--gold); flex-shrink: 0; }

    .nav-logo {
      display: flex;
      align-items: center;
      height: 100%;
      flex-shrink: 0;
    }

    .nav-logo img {
      display: block;
      height: 88px;
      width: auto;
      max-width: 380px;
      object-fit: contain;
    }

    .nav-logo-mark {
      width: 48px;
      height: 48px;
      background: var(--navy);
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .nav-logo-mark svg { width: 28px; height: 28px; fill: var(--white); }

    .nav-logo-name {
      font-family: 'Montserrat', sans-serif;
      font-size: 1.05rem;
      font-weight: 800;
      color: var(--navy);
      line-height: 1.15;
      text-transform: uppercase;
      letter-spacing: 0.01em;
    }

    .nav-logo-name span {
      display: block;
      font-size: 0.62rem;
      font-weight: 500;
      color: var(--muted);
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .nav-menu {
      display: flex;
      align-items: center;
      gap: 0;
      list-style: none;
    }

    .nav-menu li a {
      display: block;
      padding: 0 18px;
      height: 120px;
      line-height: 120px;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.82rem;
      font-weight: 700;
      color: var(--navy);
      text-transform: uppercase;
      letter-spacing: 0.06em;
      border-bottom: 3px solid transparent;
      margin-bottom: -3px;
      transition: color 0.2s, border-color 0.2s;
    }

    .nav-menu li a:hover {
      color: var(--gold);
      border-color: var(--gold);
    }

    .nav-menu li.nav-cta a {
      background: var(--gold);
      color: var(--white);
      border-radius: 4px;
      margin-left: 14px;
      padding: 0 22px;
      border-bottom: none;
      height: auto;
      line-height: normal;
      padding-top: 11px;
      padding-bottom: 11px;
      transition: background 0.2s;
    }

    .nav-menu li.nav-cta a:hover {
      background: var(--gold2);
      color: var(--white);
      border-color: transparent;
    }

    /* ─── HERO ─────────────────────────────────── */
    .hero {
      position: relative;
      min-height: 680px;
      display: flex;
      align-items: center;
      overflow: hidden;
      background: var(--navy2);
    }

    .hero-bg {
      position: absolute;
      inset: 0;
      background-image: url('/hero-xray.png');
      background-size: cover;
      background-position: center;
      opacity: 1;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: right center;
    }

    .hero-content {
      position: relative;
      z-index: 2;
      padding: 100px 5%;
      max-width: 960px;
    }

    .hero-headline {
      font-size: clamp(2.6rem, 6vw, 5rem);
      font-weight: 800;
      color: var(--white);
      line-height: 1.1;
      margin-bottom: 36px;
      text-transform: uppercase;
      letter-spacing: -0.01em;
    }

    .hero-headline .hero-subline {
      color: var(--gold);
      display: block;
      font-size: clamp(2.6rem, 6vw, 5rem);
      white-space: nowrap;
    }

    .hero-features {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-bottom: 44px;
    }

    .hero-feature-item {
      color: rgba(255,255,255,0.9);
      font-family: 'Open Sans', sans-serif;
      font-size: clamp(1.05rem, 1.4vw, 1.25rem);
      font-weight: 500;
      line-height: 1.6;
    }

    .hero p {
      font-size: clamp(1.1rem, 1.5vw, 1.35rem);
      color: rgba(255,255,255,0.85);
      max-width: 720px;
      margin-bottom: 44px;
      line-height: 1.65;
    }

    .hero-actions {
      display: flex;
      gap: 16px;
      flex-wrap: wrap;
    }
    .hero-actions .btn {
      padding: 18px 34px;
      font-size: 1.08rem;
    }
    .hero-actions .btn svg { width: 20px; height: 20px; }

    .btn {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 14px 28px;
      border-radius: 4px;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.82rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      cursor: pointer;
      border: none;
      transition: all 0.2s;
    }

    .btn svg { width: 17px; height: 17px; fill: currentColor; flex-shrink: 0; }

    .btn-gold {
      background: var(--gold);
      color: var(--white);
    }
    .btn-gold:hover { background: var(--gold2); }

    .btn-outline-white {
      background: transparent;
      color: var(--white);
      border: 2px solid rgba(255,255,255,0.6);
    }
    .btn-outline-white:hover {
      background: rgba(255,255,255,0.1);
      border-color: white;
    }

    /* ─── SERVICE PANELS ───────────────────────── */
    .panels {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
    }

    .panel {
      position: relative;
      height: 340px;
      overflow: hidden;
      cursor: default;
    }

    .panel-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      transition: transform 0.5s ease;
    }

    .panel:hover .panel-bg { transform: scale(1.05); }

    .panel-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(20,40,68,0.92) 0%, rgba(20,40,68,0.3) 60%, transparent 100%);
    }

    .panel-content {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 2;
      height: 155px;
      padding: 18px 30px 26px;
      border-top: 4px solid var(--gold);
    }

    .panel-content h3 {
      font-family: 'Montserrat', sans-serif;
      font-size: 1.15rem;
      font-weight: 800;
      color: var(--white);
      text-transform: uppercase;
      letter-spacing: 0.04em;
      margin-bottom: 6px;
    }

    .panel-content p {
      font-size: 0.82rem;
      color: rgba(255,255,255,0.75);
      line-height: 1.5;
    }

    /* ─── ABOUT ────────────────────────────────── */
    .about {
      display: grid;
      grid-template-columns: 1fr 1fr;
      min-height: 480px;
    }

    .about-text {
      background: var(--offwhite);
      padding: 70px 6%;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .section-eyebrow {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 12px;
    }

    .section-title {
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.5rem, 2.5vw, 2rem);
      font-weight: 800;
      color: var(--navy);
      text-transform: uppercase;
      letter-spacing: 0.01em;
      line-height: 1.2;
      margin-bottom: 20px;
    }

    .about-text p {
      font-size: clamp(1.05rem, 1.25vw, 1.22rem);
      color: var(--muted);
      line-height: 1.85;
      margin-bottom: 22px;
      max-width: 760px;
    }

    .about-text p:last-of-type { margin-bottom: 0; }

    .about-text .mission-lead {
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.35rem, 2vw, 1.75rem);
      font-weight: 700;
      color: var(--navy);
      line-height: 1.45;
      margin-bottom: 28px;
    }

    .about-text .mission-lead strong {
      color: var(--gold);
      font-weight: 800;
    }

    .check-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin-bottom: 32px;
    }

    .check-list li {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 0.88rem;
      font-weight: 600;
      color: var(--navy);
      font-family: 'Montserrat', sans-serif;
    }

    .check-list li::before {
      content: '';
      width: 20px; height: 20px;
      border-radius: 50%;
      background: var(--gold);
      flex-shrink: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='white' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z'/%3E%3C/svg%3E");
      background-size: 13px;
      background-repeat: no-repeat;
      background-position: center;
    }

    .about-reserved-space {
      height: 220px;
      flex-shrink: 0;
    }

    .about-image {
      position: relative;
      overflow: hidden;
      min-height: 400px;
    }

    .about-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    /* ─── WHO WE SERVE ─────────────────────────── */
    .who {
      background: var(--navy);
      padding: 64px 1.6%;
      text-align: center;
    }

    .who .section-title {
      color: var(--white);
      margin-bottom: 38px;
    }

    .who-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: clamp(76px, 7vw, 126px);
      max-width: 1500px;
      margin: 0 auto;
    }

    .who-item {
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.12);
      overflow: hidden;
      min-height: 430px;
      display: flex;
      flex-direction: column;
      transition: transform 0.2s, background 0.2s, border-color 0.2s;
    }

    .who-item:hover {
      transform: translateY(-3px);
      background: rgba(255,255,255,0.09);
      border-color: rgba(20,184,166,0.45);
    }

    .who-item-title {
      min-height: 108px;
      padding: 30px 24px 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Montserrat', sans-serif;
      font-size: 1.08rem;
      font-weight: 800;
      color: var(--white);
      text-transform: uppercase;
      letter-spacing: 0.075em;
      line-height: 1.35;
    }

    .who-item-title::before {
      content: '';
      width: 8px;
      height: 8px;
      background: var(--gold);
      border-radius: 50%;
      flex-shrink: 0;
      margin-right: 10px;
      box-shadow: 0 0 0 5px rgba(20,184,166,0.12);
    }

    .who-item img {
      width: 100%;
      height: 320px;
      object-fit: cover;
      filter: saturate(0.92) contrast(1.03);
    }

    @media (max-width: 900px) {
      .who-grid { grid-template-columns: 1fr; max-width: 520px; }
      .who-item { min-height: auto; }
    }

    /* ─── CTA BAND ─────────────────────────────── */
    .cta-band {
      background: var(--gold);
      padding: 50px 5%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
      flex-wrap: wrap;
    }

    .cta-band-text h2 {
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.3rem, 2.5vw, 1.8rem);
      font-weight: 800;
      color: var(--white);
      text-transform: uppercase;
      letter-spacing: 0.01em;
      margin-bottom: 6px;
    }

    .cta-band-text p {
      font-size: 1.08rem;
      color: rgba(255,255,255,0.85);
    }

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

    .btn-navy {
      background: var(--navy);
      color: var(--white);
    }
    .btn-navy:hover { background: var(--navy2); }

    .btn-white {
      background: var(--white);
      color: var(--gold2);
    }
    .btn-white:hover { background: var(--offwhite); }

    /* ─── CONTACT ──────────────────────────────── */
    .contact {
      display: grid;
      grid-template-columns: 0.85fr 1.45fr;
      min-height: 540px;
      border-top: 6px solid var(--gold);
    }

    .contact-left {
      background: linear-gradient(135deg, var(--navy2) 0%, var(--navy) 100%);
      padding: 58px 5%;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
    }

    .contact-left .section-eyebrow { color: var(--gold); }
    .contact-left .section-title   { color: var(--white); margin-bottom: 18px; }

    .contact-intro {
      color: rgba(255,255,255,0.84);
      font-size: 1.22rem;
      line-height: 1.75;
      max-width: 520px;
      margin-bottom: 38px;
      font-weight: 500;
    }

    .contact-callout {
      border: 1px solid rgba(20,184,166,0.55);
      background: rgba(20,184,166,0.12);
      border-radius: 10px;
      padding: 34px 30px;
      margin-top: 18px;
      margin-bottom: 0;
      max-width: 100%;
      min-height: 210px;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    .contact-callout-label {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.82rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 10px;
    }

    .contact-callout-title {
      font-family: 'Montserrat', sans-serif;
      font-size: 1.9rem;
      font-weight: 800;
      line-height: 1.15;
      color: var(--white);
      margin-bottom: 18px;
    }

    .contact-callout .btn {
      width: 100%;
      max-width: 340px;
      justify-content: center;
      margin-top: 6px;
      padding: 17px 24px;
      font-size: 0.94rem;
    }

    .contact-detail {
      display: flex;
      align-items: flex-start;
      gap: 16px;
      margin-bottom: 22px;
    }

    .contact-detail-icon {
      width: 42px; height: 42px;
      background: rgba(196,147,58,0.2);
      border: 1px solid var(--gold);
      border-radius: 4px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .contact-detail-icon svg { width: 20px; height: 20px; fill: var(--gold); }

    .contact-detail-label {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.65rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 3px;
    }

    .contact-detail-val {
      font-size: 1rem;
      font-weight: 600;
      color: var(--white);
      font-family: 'Montserrat', sans-serif;
    }

    .service-area-list {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 10px;
      max-width: 460px;
      margin-top: 4px;
    }

    .service-area-list span {
      display: inline-flex;
      align-items: center;
      padding: 6px 10px;
      border-radius: 999px;
      background: rgba(255,255,255,0.09);
      border: 1px solid rgba(20,184,166,0.32);
      color: var(--white);
      font-family: 'Montserrat', sans-serif;
      font-size: 0.86rem;
      font-weight: 700;
      letter-spacing: 0.01em;
    }

    .contact-detail-val a {
      color: var(--white);
      transition: color 0.2s;
    }
    .contact-detail-val a:hover { color: var(--gold); }

    .contact-right {
      background: var(--offwhite);
      padding: 50px 5%;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .contact-right .section-title { color: var(--navy); font-size: 1.55rem; margin-bottom: 8px; }

    .form-intro {
      color: var(--muted);
      font-size: 0.98rem;
      margin-bottom: 24px;
      max-width: 760px;
    }

    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
    }

    .form-group {
      display: flex;
      flex-direction: column;
      gap: 5px;
      margin-bottom: 14px;
    }

    .form-group label {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      color: var(--navy);
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
      border: 1.5px solid #D8D3CB;
      border-radius: 3px;
      padding: 11px 14px;
      font-size: 0.9rem;
      font-family: 'Open Sans', sans-serif;
      color: var(--text);
      background: var(--white);
      outline: none;
      transition: border-color 0.2s;
    }

    .form-group input:focus,
    .form-group select:focus,
    .form-group textarea:focus { border-color: var(--navy); }

    .form-group textarea { resize: vertical; min-height: 100px; }

    .btn-submit {
      background: var(--navy);
      color: var(--white);
      width: 100%;
      justify-content: center;
      padding: 14px;
      font-size: 0.82rem;
      border-radius: 3px;
      margin-top: 4px;
    }
    .btn-submit:hover { background: var(--gold); }

    .form-success {
      display: none;
      margin-top: 12px;
      padding: 12px 16px;
      background: #EAF6EE;
      border: 1px solid #7DC99A;
      border-radius: 3px;
      color: #2B6B40;
      font-size: 0.85rem;
      font-weight: 600;
      font-family: 'Montserrat', sans-serif;
    }

    .form-error {
      display: none;
      margin-top: 12px;
      padding: 12px 16px;
      background: #FCECEC;
      border: 1px solid #E5A3A3;
      border-radius: 3px;
      color: #9F2D2D;
      font-size: 0.85rem;
      font-weight: 600;
      font-family: 'Montserrat', sans-serif;
    }

    /* ─── FOOTER ───────────────────────────────── */
    footer {
      background: #0E1E30;
      padding: 18px 5%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 10px;
    }

    .footer-brand {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.9rem;
      font-weight: 800;
      color: var(--white);
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .footer-copy {
      font-size: 0.76rem;
      color: rgba(255,255,255,0.4);
      margin-top: 2px;
    }

    .footer-links {
      display: flex;
      gap: 22px;
    }

    .footer-links a {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.72rem;
      font-weight: 600;
      color: rgba(255,255,255,0.45);
      text-transform: uppercase;
      letter-spacing: 0.06em;
      transition: color 0.2s;
    }
    .footer-links a:hover { color: var(--gold); }

    /* Internal staff access — intentionally low-contrast */
    .footer-links a.staff-link {
      color: rgba(255,255,255,0.16);
      font-weight: 500;
    }
    .footer-links a.staff-link:hover { color: rgba(255,255,255,0.5); }

    /* ─── RESPONSIVE ────────────────────────────── */
    @media (max-width: 900px) {
      .panels { grid-template-columns: 1fr; }
      .panel  { height: 220px; }
      .about  { grid-template-columns: 1fr; }
      .about-image { min-height: 280px; }
      .contact { grid-template-columns: 1fr; }
      .cta-band { justify-content: center; text-align: center; }
      footer { flex-direction: column; align-items: flex-start; }
    }

    @media (max-width: 680px) {
      .topbar-left { flex-direction: column; gap: 6px; align-items: flex-start; }
      nav { padding: 0 4%; }
      .nav-menu { display: none; }
      .form-row { grid-template-columns: 1fr; }
      section, .about-text, .who, .cta-band, .contact-left, .contact-right { padding-left: 4%; padding-right: 4%; }
    }
  
    @media (max-width: 768px) {
      nav {
        height: auto;
        min-height: 0;
        padding-top: 18px;
        padding-bottom: 18px;
        align-items: flex-start;
      }

      .nav-left {
        width: 100%;
        gap: 14px;
        align-items: center;
      }

      .nav-logo img {
        height: 64px !important;
        width: auto;
        max-width: min(78vw, 300px);
      }

      .nav-contact {
        gap: 8px;
        font-size: 0.76rem;
      }

      .nav-contact a {
        gap: 6px;
        line-height: 1.3;
        word-break: break-word;
      }

      .hero {
        min-height: 0;
        align-items: flex-start;
      }

      .hero::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
          180deg,
          rgba(20, 40, 68, 0.92) 0%,
          rgba(20, 40, 68, 0.80) 38%,
          rgba(20, 40, 68, 0.58) 100%
        );
        z-index: 1;
        pointer-events: none;
      }

      .hero-bg {
        z-index: 0;
        background-size: cover;
        background-position: center 18%;
        background-repeat: no-repeat;
        opacity: 0.42;
        filter: brightness(0.9);
      }

      .hero-content {
        z-index: 2;
        max-width: none;
        padding: 30px 6% 56px;
      }

      .hero h1 {
        font-size: clamp(2.05rem, 9.2vw, 3rem);
        line-height: 0.95;
        margin-bottom: 18px;
        max-width: 12ch;
      }

      .hero-subline {
        display: block;
        font-size: 0.64em;
        line-height: 1.15;
        white-space: nowrap;
        margin-top: 12px;
        letter-spacing: -0.01em;
      }

      .hero p {
        font-size: 0.96rem;
        line-height: 1.48;
        margin-bottom: 18px;
        max-width: 100%;
      }

      .hero-actions {
        gap: 10px;
      }

      .hero-actions .btn {
        width: 100%;
        justify-content: center;
        padding: 15px 16px;
        font-size: 0.8rem;
      }
    }

    @media (max-width: 480px) {
      .hero-bg {
        background-position: center top;
        opacity: 0.46;
      }

      .hero-content {
        padding-top: 24px;
        padding-bottom: 48px;
      }

      .hero h1 {
        font-size: clamp(1.9rem, 8.9vw, 2.6rem);
      }

      .hero-subline {
        font-size: 0.58em;
        margin-top: 10px;
        letter-spacing: -0.01em;
      }

      .hero p {
        font-size: 1.08rem;
      }
    }


    /* HERO REVISION: big single-message hero page */
    .hero.hero-expanded {
      min-height: calc(100vh - 120px);
      align-items: flex-start;
      background: linear-gradient(90deg, var(--navy2) 0%, var(--navy) 48%, var(--navy2) 100%);
    }

    .hero.hero-expanded::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background: linear-gradient(
        90deg,
        rgba(20, 40, 68, 0.97) 0%,
        rgba(20, 40, 68, 0.91) 34%,
        rgba(20, 40, 68, 0.62) 58%,
        rgba(20, 40, 68, 0.14) 100%
      );
    }

    .hero.hero-expanded .hero-bg {
      background-size: contain;
      background-repeat: no-repeat;
      background-position: right center;
      opacity: 0.92;
    }

    .hero.hero-expanded .hero-content {
      width: 100%;
      max-width: min(1120px, 65vw);
      padding: clamp(42px, 6.2vh, 70px) 1.2% clamp(50px, 7vh, 86px) 4.4%;
    }

    .hero.hero-expanded .hero-headline {
      margin-bottom: clamp(30px, 4.4vh, 50px);
      max-width: 100%;
    }

    .hero.hero-expanded .hero-headline .hero-subline {
      color: var(--gold);
      font-size: clamp(2.9rem, 4.28vw, 5.15rem);
      line-height: 0.88;
      letter-spacing: -0.06em;
      white-space: nowrap;
      max-width: none;
      text-shadow: 0 5px 24px rgba(0,0,0,0.25);
    }

    .hero-feature-statements {
      gap: clamp(24px, 2.9vh, 38px);
      width: 100%;
      max-width: 100%;
      margin-bottom: clamp(36px, 4.7vh, 58px);
    }

    .hero-feature-statements .hero-feature-item {
      display: grid;
      grid-template-columns: 255px minmax(0, 1fr);
      gap: clamp(38px, 5.2vw, 78px);
      align-items: start;
      color: var(--white);
      font-size: clamp(1.42rem, 1.9vw, 2.08rem);
      line-height: 1.29;
      padding: 0 0 clamp(22px, 2.6vh, 34px);
      border-bottom: 1px solid rgba(255,255,255,0.22);
    }

    .hero-feature-statements .hero-feature-item:last-child {
      border-bottom: none;
      padding-bottom: 0;
    }

    .hero-feature-statements .hero-feature-item strong {
      color: var(--gold);
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.72rem, 2.18vw, 2.42rem);
      font-weight: 800;
      line-height: 1.05;
      text-transform: uppercase;
      letter-spacing: -0.03em;
    }

    .hero-feature-statements .hero-feature-item span {
      color: rgba(255,255,255,0.94);
      font-weight: 600;
      display: block;
      max-width: none;
    }

    @media (max-width: 1100px) {
      .hero.hero-expanded .hero-content {
        max-width: 72vw;
      }
      .hero.hero-expanded .hero-headline .hero-subline {
        font-size: clamp(2.65rem, 5.0vw, 4.25rem);
      }
      .hero-feature-statements {
        width: 100%;
      }
      .hero-feature-statements .hero-feature-item {
        grid-template-columns: 230px minmax(0, 1fr);
        font-size: clamp(1.22rem, 1.6vw, 1.52rem);
      }
      .hero-feature-statements .hero-feature-item strong {
        font-size: clamp(1.48rem, 2vw, 2rem);
      }
    }

    @media (max-width: 768px) {
      .hero.hero-expanded {
        min-height: 0;
      }
      .hero.hero-expanded::before {
        background: linear-gradient(
          180deg,
          rgba(20, 40, 68, 0.95) 0%,
          rgba(20, 40, 68, 0.86) 55%,
          rgba(20, 40, 68, 0.70) 100%
        );
      }
      .hero.hero-expanded .hero-bg {
        background-size: cover;
        background-position: center top;
        opacity: 0.34;
      }
      .hero.hero-expanded .hero-content {
        max-width: none;
        padding: 36px 6% 58px;
      }
      .hero.hero-expanded .hero-headline {
        max-width: none;
      }
      .hero.hero-expanded .hero-headline .hero-subline {
        font-size: clamp(2.7rem, 13vw, 4.4rem);
        line-height: 0.92;
        white-space: normal;
        max-width: 10.5ch;
      }
      .hero-feature-statements .hero-feature-item {
        grid-template-columns: 1fr;
        gap: 8px;
        font-size: clamp(1.1rem, 4.5vw, 1.38rem);
      }
      .hero-feature-statements .hero-feature-item strong {
        font-size: clamp(1.42rem, 5.8vw, 1.82rem);
      }
    }

    @media (max-width: 480px) {
      .hero.hero-expanded .hero-content {
        padding-top: 30px;
      }
      .hero.hero-expanded .hero-headline .hero-subline {
        font-size: clamp(2.25rem, 12.7vw, 3.35rem);
      }
    }


    /* HERO POLISH PASS: eyebrow, premium feature rows, stronger CTA, smoother image blend */
    .hero.hero-expanded::before {
      background: linear-gradient(
        90deg,
        rgba(20, 40, 68, 0.99) 0%,
        rgba(20, 40, 68, 0.96) 38%,
        rgba(20, 40, 68, 0.86) 55%,
        rgba(20, 40, 68, 0.38) 71%,
        rgba(20, 40, 68, 0.05) 100%
      );
    }

    .hero.hero-expanded::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background: radial-gradient(circle at 18% 20%, rgba(20,184,166,0.16), transparent 30%);
    }

    .hero.hero-expanded .hero-content {
      max-width: min(1160px, 66.5vw);
      padding-top: clamp(38px, 5.1vh, 62px);
    }

    .hero-kicker {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 18px;
      color: rgba(255,255,255,0.86);
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(0.78rem, 0.82vw, 0.94rem);
      font-weight: 800;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }

    .hero-kicker::before {
      content: "";
      width: 42px;
      height: 3px;
      border-radius: 999px;
      background: var(--gold);
      box-shadow: 0 0 18px rgba(20,184,166,0.55);
    }

    .hero.hero-expanded .hero-headline {
      margin-bottom: clamp(28px, 3.6vh, 42px);
    }

    .hero-feature-statements {
      gap: 14px;
      margin-bottom: clamp(28px, 3.4vh, 42px);
    }

    .hero-feature-statements .hero-feature-item {
      position: relative;
      display: grid;
      grid-template-columns: 300px minmax(0, 1fr);
      gap: clamp(34px, 4.5vw, 72px);
      align-items: center;
      padding: clamp(16px, 1.9vh, 23px) clamp(22px, 2.5vw, 38px) clamp(16px, 1.9vh, 23px) clamp(28px, 2.8vw, 42px);
      border: 1px solid rgba(255,255,255,0.12);
      border-left: 6px solid var(--gold);
      border-radius: 16px;
      background: linear-gradient(90deg, rgba(20,184,166,0.13), rgba(255,255,255,0.055));
      box-shadow: 0 16px 36px rgba(0,0,0,0.16);
      backdrop-filter: blur(2px);
    }

    .hero-feature-statements .hero-feature-item:last-child {
      border-bottom: 1px solid rgba(255,255,255,0.12);
      padding-bottom: clamp(16px, 1.9vh, 23px);
    }

    .hero-feature-statements .hero-feature-item strong {
      color: var(--gold);
      font-size: clamp(1.45rem, 1.92vw, 2.24rem);
      text-shadow: 0 0 20px rgba(20,184,166,0.28);
    }

    .hero-feature-copy {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .hero-feature-copy .feature-lead {
      color: var(--white);
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.36rem, 1.66vw, 1.95rem);
      font-weight: 800;
      line-height: 1.18;
      letter-spacing: -0.02em;
    }

    .hero-feature-copy .feature-support {
      color: rgba(255,255,255,0.78);
      font-size: clamp(0.98rem, 1.05vw, 1.16rem);
      font-weight: 600;
      line-height: 1.45;
      max-width: 720px;
    }

    .hero-actions {
      align-items: center;
      gap: 14px;
      margin-top: 2px;
    }

    .hero-actions .btn {
      border-radius: 7px;
      padding: 18px 34px;
      box-shadow: 0 14px 30px rgba(0,0,0,0.20);
    }

    .hero-actions .btn-gold {
      box-shadow: 0 16px 34px rgba(20,184,166,0.30);
    }

    .hero-trust-line {
      margin-top: 18px;
      color: rgba(255,255,255,0.84);
      font-family: 'Montserrat', sans-serif;
      font-size: 1.12rem;
      font-weight: 800;
      letter-spacing: 0.02em;
    }

    @media (max-width: 1100px) {
      .hero.hero-expanded .hero-content {
        max-width: 74vw;
      }
      .hero-feature-statements .hero-feature-item {
        grid-template-columns: 250px minmax(0, 1fr);
      }
    }

    @media (max-width: 768px) {
      .hero-kicker {
        font-size: 0.72rem;
        line-height: 1.4;
      }
      .hero-kicker::before {
        width: 28px;
      }
      .hero-feature-statements .hero-feature-item {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 18px 20px 20px 22px;
        border-radius: 14px;
      }
      .hero-feature-copy .feature-lead {
        font-size: clamp(1.18rem, 5vw, 1.55rem);
      }
      .hero-feature-copy .feature-support {
        font-size: 0.98rem;
      }
    }


  

    /* ─── MOBILE REWORK PASS ─────────────────────
       Keeps desktop unchanged. Rebuilds stacked mobile cards/text so the page feels intentional on phones. */
    @media (max-width: 768px) {
      body { overflow-x: hidden; }

      .hero {
        min-height: auto;
        align-items: flex-start;
        padding: 44px 0 38px;
      }

      .hero-bg {
        background-position: 68% center;
        opacity: 0.28;
      }

      .hero::before {
        background: linear-gradient(180deg, rgba(20,40,68,0.98) 0%, rgba(20,40,68,0.92) 48%, rgba(20,40,68,0.84) 100%);
      }

      .hero-content {
        width: 100%;
        max-width: none;
        padding: 0 5.5%;
        margin: 0;
      }

      .hero-eyebrow {
        font-size: 0.74rem;
        letter-spacing: 0.13em;
        margin-bottom: 12px;
      }

      .hero h1 {
        white-space: normal;
        max-width: 100%;
        font-size: clamp(2.15rem, 12.5vw, 3.35rem);
        line-height: 0.96;
        letter-spacing: -0.035em;
        margin-bottom: 18px;
      }

      .hero-feature-statements {
        width: 100%;
        max-width: none;
        gap: 12px;
        margin: 18px 0 20px;
      }

      .hero-feature-statements .hero-feature-item {
        display: block;
        padding: 16px 16px 15px;
        border-left: 4px solid var(--gold);
        border-radius: 12px;
        background: rgba(255,255,255,0.08);
        box-shadow: 0 12px 28px rgba(0,0,0,0.14);
      }

      .hero-feature-statements .hero-feature-item strong {
        display: inline-block;
        margin: 0 0 7px;
        font-size: 0.72rem;
        letter-spacing: 0.12em;
      }

      .hero-feature-copy .feature-lead {
        font-size: clamp(1.02rem, 4.4vw, 1.24rem);
        line-height: 1.18;
        margin-bottom: 5px;
      }

      .hero-feature-copy .feature-support {
        font-size: 0.95rem;
        line-height: 1.48;
      }

      .hero-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100%;
        margin-top: 18px;
      }

      .hero-actions .btn {
        width: 100%;
        justify-content: center;
        min-height: 52px;
      }

      .hero-trust-line {
        font-size: 0.98rem;
        line-height: 1.4;
        margin-top: 16px;
        max-width: 95%;
      }

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

      .about-image {
        min-height: 260px;
        order: -1;
      }

      .about-text {
        padding: 38px 6% 46px;
      }

      .about-text .section-title,
      .about-mission-lead {
        font-size: clamp(1.65rem, 7.2vw, 2.2rem) !important;
        line-height: 1.12 !important;
      }

      .about-text p,
      .about-mission-body p {
        font-size: 1.02rem !important;
        line-height: 1.65 !important;
      }

      .about-reserved-space {
        height: 0;
      }

      .who {
        padding: 44px 5.5% 50px;
      }

      .who .section-title {
        font-size: clamp(1.85rem, 9vw, 2.45rem);
        margin-bottom: 24px;
      }

      .who-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 18px;
        max-width: 430px;
        width: 100%;
      }

      .who-item {
        display: grid;
        grid-template-columns: 42% 58%;
        align-items: stretch;
        min-height: 150px;
        border-radius: 16px;
        overflow: hidden;
        background: rgba(255,255,255,0.075);
        box-shadow: 0 18px 34px rgba(0,0,0,0.18);
      }

      .who-item-title {
        min-height: 0;
        padding: 18px 16px;
        font-size: 0.92rem;
        line-height: 1.25;
        text-align: left;
        justify-content: flex-start;
        letter-spacing: 0.06em;
      }

      .who-item-title::before {
        width: 7px;
        height: 7px;
        margin-right: 9px;
        box-shadow: 0 0 0 4px rgba(20,184,166,0.13);
      }

      .who-item img {
        height: 100%;
        min-height: 150px;
        object-fit: cover;
      }

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

      .contact-left,
      .contact-right {
        padding: 34px 5.5%;
      }

      .contact-left .section-title,
      .contact-right .section-title {
        font-size: clamp(1.65rem, 7vw, 2.15rem);
      }

      .contact-intro,
      .form-intro {
        font-size: 1rem;
        line-height: 1.62;
      }

      .contact-detail {
        padding: 14px 0;
        gap: 12px;
      }

      .service-area-list {
        gap: 7px;
      }

      .service-area-list span {
        font-size: 0.8rem;
        padding: 6px 9px;
      }

      .contact-callout {
        margin-top: 18px;
        padding: 22px 18px;
        text-align: center;
        border-radius: 16px;
      }

      .contact-callout-title {
        font-size: 1.25rem;
      }

      .contact-callout .btn {
        width: 100%;
        justify-content: center;
      }

      .form-row {
        grid-template-columns: 1fr;
        gap: 0;
      }

      .form-group input,
      .form-group select,
      .form-group textarea {
        font-size: 16px;
      }
    }

    @media (max-width: 430px) {
      .hero-content { padding: 0 5%; }

      .hero h1 {
        font-size: clamp(2rem, 12vw, 2.85rem);
      }

      .hero-feature-copy .feature-support {
        font-size: 0.9rem;
      }

      .who-item {
        grid-template-columns: 1fr;
      }

      .who-item-title {
        min-height: 76px;
        justify-content: center;
        text-align: center;
        padding: 18px 16px 16px;
      }

      .who-item img {
        min-height: 190px;
        height: 190px;
      }
    }

  

    /* MOBILE HERO CENTERING ONLY — leaves lower sections from mobile rework untouched */
    @media (max-width: 768px) {
      .hero.hero-expanded .hero-content,
      .hero-content {
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
        padding-left: 5.5% !important;
        padding-right: 5.5% !important;
      }

      .hero-kicker,
      .hero-eyebrow {
        justify-content: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
      }

      .hero.hero-expanded .hero-headline,
      .hero h1 {
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
      }

      .hero.hero-expanded .hero-headline .hero-subline,
      .hero-subline {
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
      }

      .hero-feature-statements {
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 440px !important;
      }

      .hero-feature-statements .hero-feature-item {
        text-align: center !important;
        border-left: none !important;
        border-top: 4px solid var(--gold) !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
      }

      .hero-feature-statements .hero-feature-item strong {
        display: block !important;
        text-align: center !important;
      }

      .hero-feature-copy,
      .hero-feature-copy .feature-lead,
      .hero-feature-copy .feature-support {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }

      .hero-actions {
        max-width: 420px !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }

      .hero-trust-line {
        max-width: 420px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
      }
    }


    /* MOBILE HERO WIDTH TUNING ONLY — wider kicker/cards and no teal dash */
    @media (max-width: 768px) {
      .hero.hero-expanded .hero-content,
      .hero-content {
        padding-left: 3.5% !important;
        padding-right: 3.5% !important;
      }

      .hero-kicker,
      .hero-eyebrow {
        display: block !important;
        width: min(94vw, 480px) !important;
        max-width: 94vw !important;
        font-size: clamp(0.82rem, 3.55vw, 1rem) !important;
        line-height: 1.35 !important;
        letter-spacing: 0.145em !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
      }

      .hero-kicker::before,
      .hero-eyebrow::before {
        display: none !important;
        content: none !important;
      }

      .hero-feature-statements {
        width: min(94vw, 500px) !important;
        max-width: 94vw !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }

      .hero-feature-statements .hero-feature-item {
        width: 100% !important;
        padding-left: 18px !important;
        padding-right: 18px !important;
      }

      .hero-actions,
      .hero-trust-line {
        width: min(94vw, 500px) !important;
        max-width: 94vw !important;
      }
    }

    @media (max-width: 430px) {
      .hero.hero-expanded .hero-content,
      .hero-content {
        padding-left: 3% !important;
        padding-right: 3% !important;
      }

      .hero-kicker,
      .hero-eyebrow,
      .hero-feature-statements,
      .hero-actions,
      .hero-trust-line {
        width: 94vw !important;
        max-width: 94vw !important;
      }
    }

  

    /* MOBILE HERO FINAL ALIGNMENT — center wider cards/kicker like the headline */
    @media (max-width: 768px) {
      .hero.hero-expanded .hero-content,
      .hero-content {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: 50% !important;
        margin-right: 0 !important;
        transform: translateX(-50%) !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
      }

      .hero-kicker,
      .hero-eyebrow {
        width: min(calc(100vw - 32px), 500px) !important;
        max-width: calc(100vw - 32px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        align-self: center !important;
        text-align: center !important;
      }

      .hero-feature-statements,
      .hero-actions,
      .hero-trust-line {
        width: min(calc(100vw - 32px), 500px) !important;
        max-width: calc(100vw - 32px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        align-self: center !important;
        box-sizing: border-box !important;
      }

      .hero-feature-statements .hero-feature-item {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
      }
    }

    @media (max-width: 430px) {
      .hero.hero-expanded .hero-content,
      .hero-content {
        padding-left: 14px !important;
        padding-right: 14px !important;
      }

      .hero-kicker,
      .hero-eyebrow,
      .hero-feature-statements,
      .hero-actions,
      .hero-trust-line {
        width: calc(100vw - 28px) !important;
        max-width: calc(100vw - 28px) !important;
      }
    }


    /* MOBILE HERO: remove kicker, move headline up, add more breathing room between words */
    @media (max-width: 768px) {
      .hero-kicker,
      .hero-eyebrow {
        display: none !important;
      }

      .hero {
        padding-top: 0 !important;
      }

      .hero.hero-expanded .hero-content,
      .hero-content {
        justify-content: flex-start !important;
      }

      .hero.hero-expanded .hero-headline,
      .hero h1 {
        margin-top: 0 !important;
        margin-bottom: 30px !important;
        line-height: 1.04 !important;
        letter-spacing: 0.025em !important;
        word-spacing: 0.08em !important;
      }

      .hero-feature-statements {
        margin-top: 0 !important;
      }
    }

    @media (max-width: 430px) {
      .hero {
        padding-top: 0 !important;
      }

      .hero.hero-expanded .hero-headline,
      .hero h1 {
        font-size: clamp(4.1rem, 19.5vw, 5.2rem) !important;
        line-height: 1.06 !important;
        letter-spacing: 0.018em !important;
        word-spacing: 0.06em !important;
        margin-bottom: 32px !important;
      }
    }



    /* DESKTOP ONLY: actually darken the hero image/contrast without touching mobile */
    @media (min-width: 769px) {
      .hero.hero-expanded {
        background: #10233d !important;
      }

      .hero.hero-expanded::before {
        background: linear-gradient(
          90deg,
          rgba(12, 25, 44, 1.00) 0%,
          rgba(12, 25, 44, 0.99) 36%,
          rgba(12, 25, 44, 0.94) 54%,
          rgba(12, 25, 44, 0.76) 70%,
          rgba(12, 25, 44, 0.58) 100%
        ) !important;
      }

      .hero.hero-expanded::after {
        background: linear-gradient(
          90deg,
          rgba(0, 0, 0, 0.14) 0%,
          rgba(0, 0, 0, 0.12) 45%,
          rgba(0, 0, 0, 0.18) 72%,
          rgba(0, 0, 0, 0.26) 100%
        ) !important;
      }

      .hero.hero-expanded .hero-bg {
        opacity: 0.62 !important;
        filter: brightness(0.58) contrast(1.14) saturate(0.95) !important;
      }
    }

  

    /* FINAL HERO IMAGE/COLOR PASS: replace hero X-ray, preserve dark navy hero color, no image filter */
    .hero.hero-expanded {
      background: #10233d !important;
    }

    .hero.hero-expanded .hero-bg {
      background-image: url('/hero-xray.png') !important;
      background-size: contain !important;
      background-repeat: no-repeat !important;
      background-position: right center !important;
      opacity: 1 !important;
      filter: none !important;
    }

    @media (min-width: 769px) {
      .hero.hero-expanded::before {
        background: linear-gradient(
          90deg,
          rgba(12, 25, 44, 1.00) 0%,
          rgba(12, 25, 44, 0.99) 36%,
          rgba(12, 25, 44, 0.94) 54%,
          rgba(12, 25, 44, 0.68) 70%,
          rgba(12, 25, 44, 0.24) 100%
        ) !important;
      }

      .hero.hero-expanded::after {
        background: linear-gradient(
          90deg,
          rgba(0, 0, 0, 0.12) 0%,
          rgba(0, 0, 0, 0.10) 45%,
          rgba(0, 0, 0, 0.08) 72%,
          rgba(0, 0, 0, 0.04) 100%
        ) !important;
      }
    }

    @media (max-width: 768px) {
      .hero.hero-expanded,
      .hero {
        background: #10233d !important;
      }

      .hero.hero-expanded::before,
      .hero::before {
        background: linear-gradient(
          180deg,
          rgba(12, 25, 44, 0.98) 0%,
          rgba(12, 25, 44, 0.94) 42%,
          rgba(12, 25, 44, 0.86) 100%
        ) !important;
      }

      .hero.hero-expanded .hero-bg,
      .hero-bg {
        background-image: url('/hero-xray.png') !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center top !important;
        opacity: 1 !important;
        filter: none !important;
      }
    }

  
    /* MOBILE HERO TEXT EMPHASIS — bigger feature card text only */
    @media (max-width: 768px) {
      .hero-feature-statements .hero-feature-item {
        padding: 24px 18px 22px !important;
        gap: 12px !important;
      }

      .hero-feature-statements .hero-feature-item strong {
        font-size: clamp(1.48rem, 7vw, 2.05rem) !important;
        line-height: 1.08 !important;
        letter-spacing: -0.02em !important;
        margin-bottom: 6px !important;
      }

      .hero-feature-copy {
        gap: 9px !important;
      }

      .hero-feature-copy .feature-lead {
        font-size: clamp(1.18rem, 5.3vw, 1.55rem) !important;
        line-height: 1.18 !important;
        font-weight: 800 !important;
      }

      .hero-feature-copy .feature-support {
        font-size: clamp(1rem, 4.15vw, 1.18rem) !important;
        line-height: 1.42 !important;
        font-weight: 650 !important;
      }
    }

    @media (max-width: 430px) {
      .hero-feature-statements .hero-feature-item {
        padding: 23px 16px 21px !important;
      }

      .hero-feature-statements .hero-feature-item strong {
        font-size: clamp(1.42rem, 7.4vw, 1.9rem) !important;
      }

      .hero-feature-copy .feature-lead {
        font-size: clamp(1.12rem, 5.8vw, 1.42rem) !important;
      }

      .hero-feature-copy .feature-support {
        font-size: clamp(0.98rem, 4.35vw, 1.1rem) !important;
      }
    }

  
    /* DESKTOP HERO IMAGE POSITION FIX — keep X-ray on the right, away from text */
    @media (min-width: 769px) {
      .hero-bg {
        background-image: url('/hero-xray.png') !important;
        background-size: auto 112% !important;
        background-position: right center !important;
        background-repeat: no-repeat !important;
        opacity: 1 !important;
      }

      .hero-bg::before {
        content: "";
        position: absolute;
        inset: 0;
        background:
          linear-gradient(90deg,
            rgba(8, 24, 42, 1) 0%,
            rgba(8, 24, 42, 0.98) 45%,
            rgba(8, 24, 42, 0.78) 58%,
            rgba(8, 24, 42, 0.32) 73%,
            rgba(8, 24, 42, 0.08) 100%);
        pointer-events: none;
      }

      .hero-bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg,
          var(--navy2) 0%,
          var(--navy2) 60%,
          rgba(20, 40, 68, 0.15) 74%,
          rgba(20, 40, 68, 0) 100%);
        pointer-events: none;
      }

      .hero .container,
      .hero-content {
        position: relative;
        z-index: 2;
      }
    }

  
    /* DESKTOP HERO HEADLINE WIDTH FIX — keep long headline out of X-ray image area */
    @media (min-width: 769px) {
      .hero.hero-expanded .hero-headline {
        max-width: 66vw !important;
      }

      .hero.hero-expanded .hero-headline .hero-subline {
        display: block !important;
        white-space: normal !important;
        max-width: 66vw !important;
        font-size: clamp(2.7rem, 3.75vw, 4.55rem) !important;
        line-height: 0.96 !important;
        letter-spacing: -0.055em !important;
      }
    }

    @media (min-width: 1200px) {
      .hero.hero-expanded .hero-headline,
      .hero.hero-expanded .hero-headline .hero-subline {
        max-width: 68vw !important;
      }
    }

  
    /* FINAL HERO TEXT SWAP — preserve original desktop proportions, final mobile headline */
    .mobile-headline-text { display: none; }

    @media (min-width: 769px) {
      .final-hero-headline {
        max-width: 100% !important;
      }

      .final-hero-headline .hero-subline {
        display: block !important;
        color: var(--gold) !important;
        font-size: clamp(2.9rem, 4.28vw, 5.15rem) !important;
        line-height: 0.88 !important;
        letter-spacing: -0.06em !important;
        white-space: nowrap !important;
        max-width: none !important;
        text-shadow: 0 5px 24px rgba(0,0,0,0.25) !important;
      }

      .desktop-headline-text {
        display: inline !important;
      }

      .mobile-headline-text {
        display: none !important;
      }
    }

    @media (max-width: 768px) {
      .desktop-headline-text { display: none !important; }

      .mobile-headline-text {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
      }

      .final-hero-headline {
        width: min(calc(100vw - 28px), 520px) !important;
        max-width: min(calc(100vw - 28px), 520px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: -8px !important;
        margin-bottom: 34px !important;
        text-align: center !important;
      }

      .final-hero-headline .hero-subline {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
      }

      .mobile-headline-text .mrh-line {
        display: block !important;
        width: auto !important;
        max-width: 100% !important;
        font-family: 'Montserrat', sans-serif !important;
        text-transform: uppercase !important;
      }

      .mobile-headline-text .mrh-line-1,
      .mobile-headline-text .mrh-line-1b {
        color: #ffffff !important;
        font-size: clamp(2.14rem, 8.9vw, 2.82rem) !important;
        font-weight: 800 !important;
        line-height: 0.92 !important;
        letter-spacing: -0.02em !important;
      }

      .mobile-headline-text .mrh-line-1b {
        margin-top: 2px !important;
      }

      .mobile-headline-text .mrh-line-2 {
        color: var(--gold) !important;
        font-size: clamp(1.56rem, 6.15vw, 1.98rem) !important;
        font-weight: 800 !important;
        line-height: 1.03 !important;
        letter-spacing: -0.02em !important;
        margin-top: 18px !important;
        white-space: nowrap !important;
        width: calc(100vw - 56px) !important;
        max-width: 332px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
        transform: translateX(-10px) !important;
        padding-top: 4px !important;
        padding-bottom: 4px !important;
      }
    }


    /* DESKTOP HERO TEXT POLISH — text only */
    @media (min-width: 769px) {
      .hero-kicker {
        display: block !important;
        margin-bottom: 18px !important;
        color: rgba(255,255,255,0.92) !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: clamp(2.15rem, 2.75vw, 3.25rem) !important;
        font-weight: 800 !important;
        line-height: 0.95 !important;
        letter-spacing: -0.035em !important;
        text-transform: uppercase !important;
        text-shadow: 0 5px 20px rgba(0,0,0,0.22) !important;
      }

      .hero-kicker::before {
        display: none !important;
        content: none !important;
      }

      .final-hero-headline {
        margin-bottom: clamp(30px, 4vh, 44px) !important;
      }

      .final-hero-headline .hero-subline {
        font-size: clamp(2.55rem, 3.55vw, 4.25rem) !important;
        line-height: 0.92 !important;
        letter-spacing: -0.055em !important;
        white-space: nowrap !important;
      }
    }

    @media (min-width: 769px) and (max-width: 1180px) {
      .hero-kicker {
        font-size: clamp(1.9rem, 2.5vw, 2.65rem) !important;
      }

      .final-hero-headline .hero-subline {
        font-size: clamp(2.25rem, 3.25vw, 3.55rem) !important;
      }
    }


    /* Desktop headline readability fix — prevent BETTER letters from visually connecting */
    @media (min-width: 769px) {
      .final-hero-headline .hero-subline {
        letter-spacing: -0.025em !important;
      }
    }

    @media (min-width: 769px) and (max-width: 1180px) {
      .final-hero-headline .hero-subline {
        letter-spacing: -0.02em !important;
      }
    }


    /* Facility Login buttons */
    .nav-menu li.nav-login a {
      color: var(--gold);
      border: 1.5px solid rgba(20,184,166,0.55);
      border-radius: 4px;
      height: auto;
      line-height: normal;
      padding: 10px 16px;
      margin-left: 8px;
      margin-right: 2px;
      transition: background 0.2s, color 0.2s, border-color 0.2s;
    }

    .nav-menu li.nav-login a:hover {
      background: rgba(20,184,166,0.10);
      color: var(--gold2);
      border-color: var(--gold);
    }

    .nav-portal-mobile {
      display: none;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--white);
      background: var(--gold);
      padding: 10px 12px;
      border-radius: 4px;
      white-space: nowrap;
      margin-left: auto;
    }

    .nav-portal-mobile:hover {
      background: var(--gold2);
      color: var(--white);
    }

    @media (max-width: 768px) {
      .nav-portal-mobile {
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .nav-left {
        width: 100%;
      }

      .nav-contact {
        flex: 1;
      }
    }

    @media (max-width: 430px) {
      .nav-portal-mobile {
        font-size: 0.68rem;
        padding: 9px 10px;
      }
    }


    /* Swap emphasis: Facility Login primary, Contact secondary */
    .nav-menu li.nav-login a {
      background: var(--gold) !important;
      color: var(--white) !important;
      border: none !important;
      box-shadow: 0 10px 24px rgba(20,184,166,0.22) !important;
    }

    .nav-menu li.nav-login a:hover {
      background: var(--gold2) !important;
      color: var(--white) !important;
      border: none !important;
    }

    .nav-menu li.nav-cta a {
      background: var(--white) !important;
      color: var(--navy) !important;
      border: 1.5px solid rgba(28,53,87,0.22) !important;
      box-shadow: none !important;
    }

    .nav-menu li.nav-cta a:hover {
      background: var(--offwhite) !important;
      color: var(--gold2) !important;
      border-color: rgba(20,184,166,0.45) !important;
    }

    @media (max-width: 768px) {
      .nav-portal-mobile {
        background: var(--gold) !important;
        color: var(--white) !important;
      }

      .nav-portal-mobile:hover {
        background: var(--gold2) !important;
        color: var(--white) !important;
      }
    }


    /* ─── MODALITIES (added Aug 2026) ─────────────────────────── */
    .modalities {
      background: var(--navy);
      padding: 84px 5% 92px;
      text-align: center;
    }
    /* NAV BREAKPOINT FIX: the mobile nav pieces switch on at 768px but the
       desktop .nav-menu wasn't hidden until 680px, so both rendered at once
       between 681-768px. Aligning the handoff to 768px. */
    @media (max-width: 768px) {
      .nav-menu { display: none; }
    }


    /* ── modality cards: diagnostic viewbox ─────────────────── */
    .modality-grid {
      display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
      gap: clamp(26px, 2.6vw, 42px); max-width: 1500px; margin: 0 auto;
      text-align: left; align-items: stretch;
    }
    .modality {
      background: #070F1C; border-radius: 10px; overflow: hidden;
      display: flex; flex-direction: column;
      border: 1px solid rgba(20,184,166,0.20);
      box-shadow: 0 20px 46px rgba(3,8,16,0.45);
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    @media (hover: hover) {
      .modality:hover { transform: translateY(-5px); box-shadow: 0 30px 62px rgba(3,8,16,0.55); border-color: rgba(20,184,166,0.42); }
    }
    @media (prefers-reduced-motion: reduce) {
      .modality { transition: none; }
      .modality:hover { transform: none; }
    }
    .mv-frame {
      position: relative; padding: 16px; aspect-ratio: 16 / 9;
      display: flex; align-items: center; justify-content: center;
      background: radial-gradient(120% 90% at 50% 42%, rgba(20,184,166,0.11), transparent 70%), #050B15;
      border-bottom: 1px solid rgba(20,184,166,0.22);
    }
    .mv-frame svg { width: 100%; height: auto; max-height: 100%; display: block; }
    .mv-tag {
      position: absolute; font-family: ui-monospace,'SF Mono',Menlo,Consolas,monospace;
      font-size: 0.6rem; letter-spacing: 0.13em; text-transform: uppercase;
      color: rgba(20,184,166,0.74); pointer-events: none; white-space: nowrap;
    }
    .mv-tl { top: 11px; left: 14px; }
    .mv-tr { top: 11px; right: 14px; color: rgba(255,255,255,0.32); }
    .mv-bl { bottom: 11px; left: 14px; color: rgba(255,255,255,0.32); }
    .mv-br { bottom: 11px; right: 14px; }
    .mv-body { padding: clamp(26px,2.4vw,36px) clamp(24px,2.2vw,34px) clamp(30px,2.6vw,38px); }
    .modality-name {
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.24rem, 1.5vw, 1.58rem); font-weight: 800;
      color: var(--white); text-transform: uppercase;
      letter-spacing: 0.045em; line-height: 1.2;
    }
    .modality-rule { width: 52px; height: 4px; background: var(--gold); border: 0; border-radius: 999px; margin: 16px 0 18px; }
    .modality-blurb { color: rgba(255,255,255,0.80); font-size: clamp(0.99rem,1.06vw,1.08rem); line-height: 1.72; }
    .modality-blurb strong { color: var(--gold); font-weight: 700; }

    /* eyebrows removed sitewide */
    .section-eyebrow { display: none; }

    /* pull the section headings up into the space the eyebrows left */
    @media (min-width: 769px) {
      .modalities { padding-top: 54px; }
      .about-text { padding-top: 46px; }
    }

    /* keep the sticky nav from covering anchor targets (nav is 120px / 103px) */
    #about, #services, #who, #contact { scroll-margin-top: 132px; }
    @media (max-width: 768px) {
      #about, #services, #who, #contact { scroll-margin-top: 115px; }
    }
    .modalities .section-title { margin-bottom: 14px; color: var(--white); }
    .modalities-lead {
      max-width: 70ch;
      margin: 0 auto 56px;
      color: rgba(255,255,255,0.82);
      font-size: clamp(1.04rem, 1.2vw, 1.18rem);
      line-height: 1.7;
    }
    @media (min-width: 900px) {
      .modalities-lead { max-width: none; white-space: nowrap; }
    }
    
    /* desktop: push the outer cards outward, middle stays put */
    @media (min-width: 1100px) {
      .modalities { padding-left: 2.6%; padding-right: 2.6%; }
      .modality-grid { gap: clamp(58px, 5.4vw, 104px); max-width: 1720px; }
    }
    
    
    
    
    
    @media (max-width: 900px) {
      .modalities { padding: 56px 6% 62px; }
      .modality-grid { grid-template-columns: 1fr; gap: 20px; }
      .modalities-lead { margin-bottom: 34px; }

    }
  
    /* Links from each service card through to its full page.
       Added during the 2026 rebuild: these are what connect the homepage to
       the X-ray, ultrasound and EKG pages, which nothing linked to before. */
    .modality-link {
      display: inline-block;
      margin-top: 18px;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.95rem;
      font-weight: 700;
      letter-spacing: 0.02em;
      color: var(--gold);
      text-decoration: none;
      border-bottom: 1px solid rgba(20,184,166,0.35);
      padding-bottom: 2px;
      transition: color 0.18s ease, border-color 0.18s ease;
    }
    .modality-link:hover,
    .modality-link:focus-visible {
      color: #fff;
      border-color: #fff;
    }

    /* The top menu carries more items since the service pages were added.
       Tighten the spacing on narrower desktops so it can never wrap. */
    @media (max-width: 1280px) {
      .nav-menu li a { padding: 0 12px; font-size: 0.74rem; }
    }
    @media (max-width: 1080px) {
      .nav-menu li a { padding: 0 9px; font-size: 0.70rem; }
    }

    /* ------------------------------------------------------------------
       Mobile menu. Below 768px the homepage previously had no navigation
       at all — the menu was hidden and there was no button to open it.
       ------------------------------------------------------------------ */
    .nav-burger {
      display: none;
      margin-left: auto;
      flex-direction: column;
      justify-content: center;
      gap: 5px;
      width: 48px;
      height: 42px;
      padding: 9px 10px;
      background: transparent;
      border: 1.5px solid rgba(20,184,166,0.55);
      border-radius: 4px;
      cursor: pointer;
      flex-shrink: 0;
    }
    .nav-burger span {
      display: block;
      width: 100%;
      height: 2px;
      background: var(--gold);
      border-radius: 2px;
    }

    @media (max-width: 768px) {
      nav { flex-wrap: wrap; }
      .nav-burger { display: flex; }

      /* beats the plain `.nav-menu { display: none }` rule above */
      .nav-menu.open {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        margin-top: 14px;
        border-top: 1px solid rgba(28,53,87,0.12);
      }
      .nav-menu.open li a {
        height: auto;
        line-height: 1.3;
        padding: 16px 2px;
        border-bottom: 1px solid rgba(28,53,87,0.10);
      }
      
      .nav-menu.open li.nav-cta a {
        margin: 14px 0 4px;
        text-align: center;
        padding: 15px;
        border-bottom: none;
      }
    }

    /* ------------------------------------------------------------------
       Credentials strip. Deliberately TEXT ONLY — the ARRT logo may not
       be used by employers, and ARDMS marks need written permission from
       Inteleos. Naming the credentials in words is accurate and allowed.
       ------------------------------------------------------------------ */
    .creds-strip {
      background: #0E1E36;
      border-top: 1px solid rgba(20,184,166,0.18);
      border-bottom: 1px solid rgba(20,184,166,0.18);
      padding: 22px 5%;
    }
    .creds-list {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 14px 40px;
      max-width: 1240px;
      margin: 0 auto;
      padding: 0;
      list-style: none;
    }
    .creds-list li {
      display: flex;
      align-items: center;
      gap: 10px;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.82rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.88);
    }
    .creds-list svg {
      width: 20px;
      height: 20px;
      flex-shrink: 0;
      fill: var(--gold);
    }
    @media (max-width: 900px) {
      .creds-list { gap: 12px 26px; }
      .creds-list li { font-size: 0.74rem; letter-spacing: 0.04em; }
    }
    @media (max-width: 560px) {
      .creds-strip { padding: 18px 6%; }
      .creds-list { justify-content: flex-start; gap: 11px 20px; }
      .creds-list li { font-size: 0.7rem; }
      .creds-list svg { width: 17px; height: 17px; }
    }

    /* ------------------------------------------------------------------
       Wordmark as real text next to the transparent NY mark.
       The supplied logo artwork has a cream paper background baked in,
       which showed as a box on the white nav. This has no background at
       all, stays sharp on any screen, and makes the company name real
       text rather than pixels.
       ------------------------------------------------------------------ */
    .nav-logo { display: flex; align-items: center; gap: 13px; text-decoration: none; }
    .nav-logo img.mark {
      height: 58px !important;
      width: auto !important;
      max-width: none !important;
      flex-shrink: 0;
    }
    .wordmark { display: flex; flex-direction: column; line-height: 1; }
    .wordmark strong {
      font-family: "Montserrat", sans-serif;
      font-weight: 600;
      font-size: 1.42rem;
      letter-spacing: 0.32em;
      color: var(--navy);
      text-indent: 0.32em;
    }
    .wordmark em {
      font-style: normal;
      font-family: "Montserrat", sans-serif;
      font-weight: 500;
      font-size: 0.66rem;
      letter-spacing: 0.2em;
      color: var(--navy);
      margin-top: 7px;
      text-indent: 0.2em;
      white-space: nowrap;
    }
    .wordmark em::before { content: "— "; }
    .wordmark em::after  { content: " —"; }

    @media (max-width: 900px) {
      .nav-logo { gap: 10px; }
      .nav-logo img.mark { height: 46px !important; }
      .wordmark strong { font-size: 1.12rem; letter-spacing: 0.26em; }
      .wordmark em { font-size: 0.56rem; letter-spacing: 0.16em; margin-top: 5px; }
    }
    @media (max-width: 460px) {
      .nav-logo img.mark { height: 38px !important; }
      .wordmark strong { font-size: 0.92rem; letter-spacing: 0.2em; }
      .wordmark em { font-size: 0.48rem; letter-spacing: 0.12em; }
    }

    /* Current page: teal text plus an underline along the bottom of the tab,
       so it is obvious which page you are on. */
    .nav-menu li a.on {
      color: var(--gold);
      box-shadow: inset 0 -3px 0 0 var(--gold);
    }

    /* Mobile header: the logo, contact block, Facility Login button and
       hamburger cannot all fit across a phone. The contact block was being
       squeezed to almost no width, so the phone number and email wrapped one
       character per line. Hidden below 768px — the number is right there in
       the banner call box, and again in the footer. */
    @media (max-width: 768px) {
      .nav-contact { display: none !important; }
      .nav-left { justify-content: space-between; gap: 10px; }
      .nav-logo { flex: 0 1 auto; min-width: 0; }
      .nav-logo img.mark { flex-shrink: 0; }
      .wordmark { min-width: 0; }
    }

    /* ------------------------------------------------------------------
       Header fitting across screen sizes.

       The bar holds a lot: logo + wordmark, phone, email, six menu items
       and two buttons. On a laptop that overflowed and wrapped mid-word
       ("X-" / "RAY"), and since the items are 120px tall with a matching
       line-height, the wrapped text spilled over the banner below.
       ------------------------------------------------------------------ */
    .nav-menu li a { white-space: nowrap; }

    @media (min-width: 769px) {
      nav { flex-wrap: nowrap; }
      .nav-menu { flex-shrink: 0; }
    }

    /* phone + email are the first thing to go — both are in the banner
       call box and again in the footer */
    @media (max-width: 1440px) {
      .nav-contact { display: none; }
    }
    @media (max-width: 1180px) {
      .nav-menu li a { padding: 0 8px; font-size: 0.67rem; }
      .nav-logo img.mark { height: 46px !important; }
      .wordmark strong { font-size: 1.05rem; letter-spacing: 0.22em; }
      .wordmark em { font-size: 0.5rem; letter-spacing: 0.13em; }
    }
    @media (max-width: 980px) {
      .nav-menu li a { padding: 0 6px; font-size: 0.62rem; }
      .nav-menu li.nav-cta a, .nav-menu li.nav-login a { padding: 0 10px; }
    }

    /* Measured: the header needs about 1576px of room with the phone and
       email column, and about 1243px without it. Hiding it below 1600px
       leaves a safe margin instead of letting it collide with the menu.
       The min-width/overflow rules make an overlap impossible even if a
       future change makes something wider. */
    @media (max-width: 1600px) {
      .nav-contact { display: none; }
    }
    .nav-left { min-width: 0; }
    .nav-contact { min-width: 0; overflow: hidden; }
    .nav-contact a { word-break: normal; white-space: nowrap; }

    /* "— MOBILE IMAGING —" sits under "UPSTATE", so hiding it saved no
       horizontal room — it just cost the company name on a phone.
       Kept at every size, scaled to sit neatly under the word above. */
    .wordmark em { display: block !important; }
    @media (max-width: 980px) {
      .wordmark strong { font-size: 0.98rem; letter-spacing: 0.2em; }
      .wordmark em { font-size: 0.47rem; letter-spacing: 0.1em; margin-top: 4px; }
    }
    @media (max-width: 420px) {
      .wordmark strong { font-size: 0.86rem; letter-spacing: 0.16em; }
      .wordmark em { font-size: 0.42rem; letter-spacing: 0.07em; }
    }

    /* ------------------------------------------------------------------
       Horizontal scroll on the homepage.

       The mobile hero used a full-bleed trick: width 100vw plus a 50%
       margin and a translate. Since the hero is already the full width of
       the screen, the vw maths only pushed content past the right edge,
       which is what you could swipe into. 100% does the same job with no
       overflow.
       ------------------------------------------------------------------ */
    @media (max-width: 768px) {
      .hero.hero-expanded .hero-content,
      .hero-content {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
      }
    }

    /* belt and braces: clip rather than hidden, so sticky positioning on
       the header keeps working */
    html { overflow-x: clip; }
    body { overflow-x: clip; max-width: 100%; }

    /* Stop single-word orphans in the pillar headlines. text-wrap: balance
       spreads the words evenly across the lines instead of leaving "do."
       stranded on its own. Older browsers ignore it and wrap as before. */
    .feature-lead { text-wrap: balance; }
    .feature-support { text-wrap: pretty; }

    /* Mobile header button is now Call Now, so Facility Login lives in the
       dropdown instead — last item before Request Service. */
    .nav-menu.open li.nav-login { display: block; }
    .nav-portal-mobile svg { width: 13px; height: 13px; fill: currentColor; margin-right: 6px; vertical-align: -2px; }

    /* The lead paragraph under "Three Modalities. One Call." used to carry
       the gap down to the cards (56px, 34px on mobile). With it gone, that
       spacing moves onto the heading so the section keeps its rhythm. */
    .modalities .section-title { margin-bottom: 56px; }
    @media (max-width: 900px) {
      .modalities .section-title { margin-bottom: 34px; }
    }
    @media (max-width: 560px) {
      .modalities .section-title { margin-bottom: 26px; }
    }

    /* In the open mobile menu, Facility Login is just another row — same
       colour, size and divider as Home, X-Ray, Contact and the rest. The
       gold button styling only applies to the desktop bar. */
    @media (max-width: 768px) {
      .nav-menu.open li.nav-login a,
      .nav-menu.open li.nav-login a:hover {
        background: none !important;
        color: var(--navy) !important;
        border: none !important;
        border-bottom: 1px solid rgba(28,53,87,0.10) !important;
        border-radius: 0 !important;
        height: auto !important;
        line-height: 1.3 !important;
        padding: 16px 2px !important;
        margin: 0 !important;
        text-align: left !important;
        font-size: 0.82rem !important;
        font-weight: 700 !important;
        letter-spacing: inherit !important;
      }
    }

    /* the gold button also carries a teal drop shadow — kill that too,
       otherwise the row still reads as a raised card in the dropdown */
    @media (max-width: 768px) {
      .nav-menu.open li.nav-login a,
      .nav-menu.open li.nav-login a:hover,
      .nav-menu.open li.nav-login a:focus {
        box-shadow: none !important;
        text-shadow: none !important;
        transform: none !important;
      }
    }

    /* Homepage footer links were a flex row with no wrapping — six items on
       one line, so on a phone they ran off the right edge. Wrap them, and
       ease the type down a little so they sit in two tidy rows. */
    @media (max-width: 768px) {
      footer { padding: 22px 5% 26px; }
      .footer-links {
        flex-wrap: wrap;
        gap: 12px 20px;
        width: 100%;
        margin-top: 16px;
      }
      .footer-links a { font-size: 0.68rem; }
    }
    @media (max-width: 420px) {
      .footer-links { gap: 10px 16px; }
      .footer-links a { font-size: 0.63rem; letter-spacing: 0.04em; }
    }
