@keyframes fadeUp {
      from { opacity: 0; transform: translateY(18px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* Same motion as fadeUp, but never drops opacity below 1.
       Above-the-fold elements must use this one: an element sitting at
       opacity 0 is not a Largest Contentful Paint candidate, so fading the
       hero in made Chrome report NO_LCP on throttled mobile — which in turn
       errored out LCP, Total Blocking Time and every diagnostic built on
       them. Keep the hero on riseUp; fadeUp is fine below the fold. */
    @keyframes riseUp {
      from { transform: translateY(18px); }
      to   { transform: translateY(0); }
    }

    /* ── HERO ── */
    .section-hero {
      position: relative;
      min-height: 50vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      z-index: 1;
      padding: 60px 70px 50px;
      border-bottom: 1px solid rgba(201,147,42,0.12);
      overflow: hidden;
    }

    .hero-layout {
      width: 100%;
      max-width: 1720px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(220px, 300px) minmax(620px, 860px) 1fr;
      align-items: center;
      column-gap: clamp(36px, 6vw, 110px);
      min-height: 100%;
      position: relative;
      z-index: 1;
    }

    .section-hero::after {
      content: '';
      position: absolute;
      top: -100px;
      left: -100px;
      width: 500px;
      height: 500px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,147,42,0.07) 0%, transparent 70%);
      pointer-events: none;
    }

    .section-hero::before {
      content: '';
      position: absolute;
      right: -140px;
      top: 50%;
      width: 520px;
      height: 520px;
      transform: translateY(-50%);
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,147,42,0.045) 0%, transparent 72%);
      pointer-events: none;
      z-index: 0;
    }

    .logo-wrap {
      display: flex;
      align-items: center;
      gap: 14px;
      width: 100%;
      align-self: start;
      grid-column: 1;
      animation: riseUp 0.8s ease both 0.1s;
    }

    .logo-star { width: 42px; height: 42px; flex-shrink: 0; }

    .logo-text-block {
      display: flex;
      flex-direction: column;
    }

    .logo-name {
      font-family: 'Playfair Display', serif;
      font-size: 20px;
      font-weight: 700;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: var(--white);
      line-height: 1;
    }

    .logo-sub {
      font-family: 'Inter', sans-serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: var(--gold);
      margin-top: 4px;
    }

    .hero-welcome-wrap {
      width: 100%;
      max-width: 860px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      grid-column: 2;
      padding-right: clamp(20px, 4vw, 90px);
      position: relative;
      animation: riseUp 0.9s ease both 0.3s;
    }

    .hero-welcome-wrap::after {
      content: '';
      position: absolute;
      left: calc(100% - 10px);
      top: 50%;
      width: clamp(120px, 16vw, 250px);
      height: 1px;
      background: linear-gradient(90deg, rgba(201,147,42,0.22), transparent);
      transform: translateY(-10px);
      pointer-events: none;
    }

    .hero-eyebrow {
  font-size: 12px;
  margin-bottom: 14px;
}

    .gold-rule {
      display: block;
      width: 40px;
      height: 1px;
      background: linear-gradient(90deg, var(--gold), transparent);
      margin-bottom: 20px;
    }

    .hero-title {
  font-size: clamp(38px, 5.4vw, 78px);
  line-height: 1.03;
  letter-spacing: -0.8px;
  max-width: 860px;
  text-wrap: balance;
}

    .hero-title .gold-word {
      background: linear-gradient(135deg, var(--gold-light), var(--gold), #7a5600);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .hero-tagline {
  font-size: clamp(17px, 2vw, 24px);
  font-weight: 300;
  color: rgba(255,255,255,0.5);
  margin-top: 18px;
  max-width: 760px;
}

    /* ── LANG SWITCHER ── */
    .lang-wrap {
      grid-column: 3;
      display: flex;
      justify-content: flex-end;
      align-items: flex-start;
      align-self: start;
      animation: riseUp 0.8s ease both 0.15s;
    }

    .lang-current {
  font-size: 12px;
  font-weight: 700;
}

    .lang-current:hover,
    .lang-current:focus-visible { border-color: var(--gold); }
    .lang-arrow {
  font-size: 12px;
}

    .lang-menu button {
  font-size: 12px;
  font-weight: 700;
}

    .lang-menu button:hover,
    .lang-menu button:focus-visible {
      color: var(--gold-light);
      background: var(--charcoal3);
    }

    /* ── CHOICE ── */
    .section-choice {
      position: relative;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      z-index: 1;
      padding: 80px 70px;
      gap: 60px;
    }

    .choice-heading {
      text-align: center;
      animation: fadeUp 0.8s ease both 0.2s;
    }

    .choice-heading h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(24px, 3.8vw, 42px);
      font-weight: 300;
      letter-spacing: 2px;
      color: var(--white);
    }

    .choice-heading p {
      font-size: 12px;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: var(--gold);
      margin-top: 10px;
    }

    .cards-row {
      display: flex;
      gap: 36px;
      width: 100%;
      max-width: 960px;
      justify-content: center;
    }

    .card {
      flex: 1;
      max-width: 420px;
      background: var(--charcoal2);
      border: 1px solid rgba(201,147,42,0.18);
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 0 0 40px 0;
      overflow: hidden;
      cursor: pointer;
      position: relative;
      transition: border-color 0.4s, transform 0.4s;
      animation: fadeUp 0.9s ease both;
    }

    .card:nth-child(1) { animation-delay: 0.35s; }
    .card:nth-child(3) { animation-delay: 0.5s; }

    .card::before {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 2px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
      transform: scaleX(0);
      transform-origin: center;
      transition: transform 0.4s;
    }

    .card:hover,
    .card:focus-visible {
      border-color: var(--gold-light);
      transform: translateY(-6px);
      box-shadow: 0 0 0 1px rgba(245,200,66,0.16) inset;
    }

    .card:hover::before,
    .card:focus-visible::before { transform: scaleX(1); }

    .card:hover .card-illustration,
    .card:focus-visible .card-illustration { border-bottom-color: rgba(245,200,66,0.26); }

    .card-illustration svg {
      transition: transform 0.45s ease, filter 0.45s ease;
      transform-origin: center;
    }

    .figure-ring,
    .figure-shape {
      transition: stroke 0.45s ease, filter 0.45s ease, opacity 0.45s ease;
    }

    .card:hover .figure-ring,
    .card:focus-visible .figure-ring {
      stroke: rgba(245,200,66,0.32);
      filter: drop-shadow(0 0 10px rgba(245,200,66,0.10));
    }

    .card:hover .figure-shape,
    .card:focus-visible .figure-shape { filter: brightness(1.14) saturate(1.05); }

    .card:hover .card-illustration svg,
    .card:focus-visible .card-illustration svg {
      transform: translateY(-4px) scale(1.08);
      filter: drop-shadow(0 10px 18px rgba(245,200,66,0.10));
    }

    .card-illustration {
      width: 100%;
      height: 240px;
      background: var(--charcoal3);
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      border-bottom: 1px solid rgba(201,147,42,0.1);
    }

    .card-illustration::after {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at 50% 80%, rgba(201,147,42,0.08) 0%, transparent 70%);
    }

    .card-illustration svg {
      width: 160px;
      height: 160px;
      position: relative;
      z-index: 1;
    }

    .card-tag {
      position: absolute;
      top: 16px;
      left: 16px;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gold);
      border: 1px solid rgba(201,147,42,0.35);
      padding: 5px 10px;
      background: rgba(17,17,16,0.6);
      z-index: 2;
    }

    .card-body {
      padding: 32px 36px 0;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 14px;
    }

    .card-title {
      font-family: 'Playfair Display', serif;
      font-size: clamp(24px, 2.8vw, 32px);
      font-weight: 600;
      color: var(--white);
      letter-spacing: 1px;
      line-height: 1.1;
    }

    .card-desc {
      font-size: 12px;
      font-weight: 300;
      letter-spacing: 1px;
      color: var(--muted);
      line-height: 1.8;
      max-width: 280px;
    }

    .card-btn {
      display: inline-block;
      margin-top: 10px;
      padding: 12px 34px;
      border: 1px solid var(--gold);
      color: var(--gold-light);
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 4px;
      text-transform: uppercase;
      text-decoration: none;
      position: relative;
      overflow: hidden;
      transition: color 0.4s;
      cursor: pointer;
      background: none;
      font-family: 'Inter', sans-serif;
    }

    .card-btn::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, var(--gold), #7a5600);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s;
    }

    .card-btn:hover::before,
    .card-btn:focus-visible::before { transform: scaleX(1); }

    .card-btn:hover,
    .card-btn:focus-visible { color: #111; }

    .card-btn span { position: relative; z-index: 1; }

    .cards-divider {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 10px;
      flex-shrink: 0;
      align-self: center;
    }

    .cards-divider .or-line {
      width: 1px;
      height: 60px;
      background: linear-gradient(to bottom, transparent, rgba(201,147,42,0.4), transparent);
      transition: background 0.4s ease;
    }

    .cards-divider .or-label {
      font-family: 'Playfair Display', serif;
      font-size: 14px;
      font-style: italic;
      color: rgba(201,147,42,0.6);
      letter-spacing: 2px;
      transition: color 0.4s ease;
    }

    .cards-row:has(.card:hover) .cards-divider .or-label,
    .cards-row:has(.card:focus-visible) .cards-divider .or-label { color: var(--gold-light); }

    .cards-row:has(.card:hover) .cards-divider .or-line,
    .cards-row:has(.card:focus-visible) .cards-divider .or-line {
      background: linear-gradient(to bottom, transparent, var(--gold-light), transparent);
    }

    /* ── FOOTER ── */
    .section-footer {
      position: relative;
      min-height: 50vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      z-index: 1;
      padding: 60px 70px;
      border-top: 1px solid rgba(201,147,42,0.12);
      gap: 48px;
      text-align: center;
    }

    .footer-contacts {
      display: flex;
      gap: 80px;
      justify-content: center;
      flex-wrap: wrap;
      animation: fadeUp 0.8s ease both 0.2s;
    }

    .contact-group {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }

    .contact-group-label {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 4px;
    }

    .contact-item {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .contact-icon {
      width: 32px;
      height: 32px;
      border: 1px solid rgba(201,147,42,0.25);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: var(--gold);
    }

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

    .contact-value {
      font-family: 'Playfair Display', serif;
      font-size: 18px;
      font-weight: 400;
      color: var(--white);
      letter-spacing: 0.5px;
    }

    .contact-value a {
      color: inherit;
      text-decoration: none;
      transition: color .3s;
    }

    .contact-value a:hover,
    .contact-value a:focus-visible { color: var(--gold-light); }

    .footer-divider {
      width: 200px;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(201,147,42,0.3), transparent);
    }

    .footer-copy {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      animation: fadeUp 0.8s ease both 0.4s;
    }

    .footer-logo-small {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 4px;
    }

    .footer-logo-small svg { width: 22px; height: 22px; }

    .footer-logo-name {
      font-family: 'Playfair Display', serif;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--white);
    }

    .footer-copy p {
      font-size: 12px;
      font-weight: 300;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: rgba(255,255,255,0.25);
    }

    /* ── RESPONSIVE ── */
    @media (max-width: 760px) {
      .section-hero,
      .section-choice,
      .section-footer { padding: 48px 32px; }

      .hero-layout {
        grid-template-columns: 1fr;
        row-gap: 40px;
      }

      .logo-wrap,
      .hero-welcome-wrap { grid-column: auto; }

      .lang-wrap {
        grid-column: auto;
        justify-content: flex-start;
      }

      .hero-welcome-wrap {
        max-width: none;
        padding-right: 0;
      }

      .hero-welcome-wrap::after { display: none; }

      .hero-title {
        font-size: clamp(34px, 11vw, 56px);
        max-width: none;
      }

      .cards-row {
        flex-direction: column;
        align-items: center;
      }

      .cards-divider { flex-direction: row; }

      .cards-divider .or-line {
        width: 60px;
        height: 1px;
        background: linear-gradient(to right, transparent, rgba(201,147,42,0.4), transparent);
      }

      .footer-contacts { gap: 40px; }
    }

    /* MOBILE LANGUAGE SWITCHER FIX */
    @media (max-width: 760px) {
      .section-hero {
        overflow: visible;
      }

      .hero-layout,
      .lang-wrap,
      .lang-switcher {
        position: relative;
        z-index: 5000;
      }

      .lang-menu {
        top: calc(100% + 8px);
        right: auto;
        left: 0;
        min-width: 165px;
        z-index: 5001;
      }

      .lang-current {
        min-height: 34px;
        touch-action: manipulation;
      }
    }

    /* PHONE LANGUAGE SWITCHER HARD FIX - v2 */
    @media (max-width: 760px) {
      .section-hero,
      .hero-layout,
      .lang-wrap,
      .lang-switcher {
        overflow: visible !important;
      }

      .lang-wrap {
        position: relative !important;
        z-index: 99990 !important;
        justify-content: flex-start !important;
      }

      .lang-switcher {
        position: relative !important;
        z-index: 99991 !important;
        pointer-events: auto !important;
      }

      .lang-current {
        min-height: 38px !important;
        touch-action: manipulation !important;
        pointer-events: auto !important;
        -webkit-tap-highlight-color: transparent;
      }

      .lang-menu {
        display: none;
        position: absolute !important;
        top: calc(100% + 8px) !important;
        left: 0 !important;
        right: auto !important;
        min-width: 175px !important;
        z-index: 99999 !important;
        pointer-events: auto !important;
      }

      .lang-switcher.open .lang-menu {
        display: block !important;
      }

      .lang-menu button {
        min-height: 42px !important;
        pointer-events: auto !important;
      }
    }

    /* PHONE LANGUAGE SWITCHER EXPAND FIX - v3
       On phone the language menu is kept in normal document flow.
       This makes the hero/header area expand downward instead of the menu floating over the next section. */
    /* ELEGANT FOOTER CONTACT LAYOUT */
    .footer-contacts {
      flex-direction: column;
      gap: 34px;
      align-items: center;
      width: 100%;
    }

    .footer-phone-row,
    .footer-email-row {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      flex-wrap: wrap;
      gap: 28px;
      width: 100%;
    }

    .footer-phone-row .contact-item {
      justify-content: center;
      flex-direction: column;
      align-items: center;
    }

    .footer-email-row {
      gap: 38px;
      max-width: 980px;
      flex-direction: row;
      flex-wrap: nowrap;
      justify-content: center;
      align-items: center;
      margin: 0 auto;
    }

    .email-contact-card {
      min-width: 210px;
      padding: 0 18px;
      border: none;
      background: transparent;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      position: relative;
    }

    .email-contact-card:hover .email-contact-value {
      color: var(--gold-light);
    }

    .email-contact-label {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gold);
      line-height: 1;
    }

    .email-contact-value {
      font-family: 'Playfair Display', serif;
      font-size: 17px;
      font-weight: 400;
      color: var(--white);
      letter-spacing: .3px;
      text-decoration: none;
      transition: color .3s;
      white-space: nowrap;
    }

    .email-contact-value:hover,
    .email-contact-value:focus-visible {
      color: var(--gold-light);
    }

    @media (max-width: 760px) {
      .footer-contacts {
        gap: 30px;
      }

      .footer-phone-row,
      .footer-email-row {
        flex-direction: column;
        align-items: center;
        gap: 18px;
      }

      .footer-phone-row .contact-item {
        width: 100%;
        max-width: 280px;
        gap: 8px;
      }

      .footer-phone-row .contact-item span:first-child {
        font-size: 11px;
      }

      .footer-phone-row .contact-value {
        font-size: 18px;
      }

      .email-contact-card {
        width: 100%;
        max-width: 320px;
        min-width: 0;
        padding: 0;
      }

      .email-contact-value {
        font-size: 16px;
        white-space: normal;
        word-break: break-word;
      }
    }

    /* PHONE LANGUAGE SWITCHER EXPAND FIX - v3
       On phone the language menu is kept in normal document flow.
       This makes the hero/header area expand downward instead of the menu floating over the next section. */
    @media (max-width: 760px) {
      .section-hero {
        overflow: visible !important;
        height: auto !important;
        min-height: 50vh !important;
      }

      .hero-layout {
        overflow: visible !important;
        align-items: start !important;
      }

      .lang-wrap {
        position: relative !important;
        z-index: 99990 !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        overflow: visible !important;
      }

      .lang-switcher {
        position: relative !important;
        z-index: 99991 !important;
        width: fit-content !important;
        overflow: visible !important;
      }

      .lang-current {
        min-height: 38px !important;
        touch-action: manipulation !important;
        pointer-events: auto !important;
        -webkit-tap-highlight-color: transparent;
      }

      .lang-menu {
        display: none !important;
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        min-width: 175px !important;
        margin-top: 8px !important;
        z-index: 99999 !important;
        pointer-events: auto !important;
      }

      .lang-switcher.open .lang-menu {
        display: block !important;
      }

      .lang-menu button {
        min-height: 42px !important;
        pointer-events: auto !important;
      }
    }

    @media (prefers-reduced-motion: reduce) {
    }

    .card-btn {
      min-width: 240px;
      text-align: center;
    }

    .card-preview-list {
      list-style: none;
      text-align: left;
      width: 100%;
      max-width: 260px;
      margin-top: 6px;
      border-top: 1px solid rgba(201,147,42,0.12);
      padding-top: 14px;
      display: flex;
      flex-direction: column;
      gap: 9px;
    }

    .card-preview-list li {
      font-size: 11px;
      font-weight: 400;
      letter-spacing: 0.6px;
      color: rgba(255,255,255,0.32);
      padding-left: 16px;
      position: relative;
      line-height: 1.5;
      transition: color 0.3s;
    }

    .card-preview-list li::before {
      content: '→';
      position: absolute;
      left: 0;
      color: var(--gold);
      opacity: 0.45;
      font-size: 10px;
      transition: opacity 0.3s;
    }

    .card-employer .card-preview-list li:last-child {
      color: var(--gold-light);
      font-weight: 600;
      margin-top: 4px;
    }

    .card-employer .card-preview-list li:last-child::before {
      content: '★';
      opacity: 1;
      font-size: 11px;
    }

    .card:hover .card-preview-list li,
    .card:focus-visible .card-preview-list li { color: rgba(255,255,255,0.48); }

    .card-employer:hover .card-preview-list li:last-child,
    .card-employer:focus-visible .card-preview-list li:last-child {
      color: var(--gold-light);
    }

    .card:hover .card-preview-list li::before,
    .card:focus-visible .card-preview-list li::before { opacity: 0.75; }

    .card-employer:hover .card-preview-list li:last-child::before,
    .card-employer:focus-visible .card-preview-list li:last-child::before {
      opacity: 1;
    }

    /* Launch Badge */
    .card-seeker .card-preview-list {
      margin-bottom: 28px;
    }

    .launch-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  letter-spacing: 2px;
  padding: 6px 11px;
  z-index: 2;
  box-shadow: 0 2px 8px rgba(245,200,66,0.3);
  animation: pulse 2s ease-in-out infinite;
}

    @keyframes pulse {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.05); }
    }

    /* Home FAQ Section */
    .section-home-faq {
      position: relative;
      z-index: 1;
      padding: 80px 70px;
      border-bottom: 1px solid rgba(201,147,42,0.12);
    }

    .home-faq-header {
      text-align: center;
      margin-bottom: 60px;
    }

    .home-faq-header h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(24px, 3.8vw, 42px);
      font-weight: 300;
      letter-spacing: 2px;
      color: var(--white);
    }

    .home-faq-header p {
      font-size: 12px;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: var(--gold);
      margin-top: 10px;
    }

    .home-faq-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 60px;
      max-width: 1200px;
      margin: 0 auto;
    }

    .home-faq-column {
      display: flex;
      flex-direction: column;
      gap: 24px;
    }

    .home-faq-column-title {
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 12px;
      padding-bottom: 12px;
      border-bottom: 1px solid rgba(201,147,42,0.15);
    }

    .home-faq-item {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .home-faq-q {
      font-family: 'Playfair Display', serif;
      font-size: 16px;
      font-weight: 500;
      color: var(--white);
      line-height: 1.4;
    }

    .home-faq-a {
      font-size: 13px;
      font-weight: 300;
      color: rgba(255,255,255,0.5);
      line-height: 1.8;
      letter-spacing: 0.3px;
    }

    .home-faq-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 16px;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gold);
      text-decoration: none;
      transition: color 0.3s;
    }

    .home-faq-link:hover,
    .home-faq-link:focus-visible {
      color: var(--gold-light);
    }

    @media (max-width: 860px) {
      .section-home-faq { padding: 60px 32px; }
      .home-faq-grid {
        grid-template-columns: 1fr;
        gap: 48px;
      }
    }

    @media (max-width: 760px) {
      .section-home-faq { padding: 48px 28px; }
      .card-preview-list li {
        font-size: 11px;
      }
      .card-seeker .card-preview-list {
      margin-bottom: 28px;
    }

    .launch-badge {
        font-size: 8px;
        padding: 5px 9px;
        letter-spacing: 1.5px;
      }
      .home-faq-header h2 {
        font-size: 28px;
      }
      .home-faq-header p {
        font-size: 10px;
        letter-spacing: 4px;
      }
      .home-faq-q {
        font-size: 15px;
      }
      .home-faq-a {
        font-size: 12px;
      }
    }

  
    /* ============================================================
       MOBILE REFINEMENT v4 — clean phone layout (authoritative:
       placed last so it supersedes the earlier stacked patches)
       ============================================================ */
    @media (max-width: 768px) {

      /* HERO → tidy header row (logo left · language right) + copy below */
      .section-hero {
        overflow: hidden !important;         /* clip decorative circles: kills sideways scroll */
        min-height: auto !important;
        padding: 24px 22px 42px !important;
      }
      .hero-layout {
        display: grid !important;
        grid-template-columns: 1fr auto !important;
        grid-template-areas: "logo lang" "copy copy" !important;
        align-items: center !important;
        column-gap: 12px !important;
        row-gap: 30px !important;
      }
      .logo-wrap { grid-area: logo !important; }
      .lang-wrap { grid-area: lang !important; justify-content: flex-end !important; align-items: center !important; }
      .hero-welcome-wrap { grid-area: copy !important; max-width: none !important; padding-right: 0 !important; }
      .hero-welcome-wrap::after { display: none !important; }
      .logo-star { width: 34px; height: 34px; }
      .logo-name { font-size: 16px; letter-spacing: 3px; }
      .logo-sub  { font-size: 10px; letter-spacing: 4px; }
      .hero-eyebrow { font-size: 11px; letter-spacing: 4px; margin-bottom: 12px; }
      .hero-title { font-size: clamp(30px, 8.6vw, 40px) !important; line-height: 1.08; max-width: none; }
      .hero-tagline { font-size: 15px; margin-top: 14px; max-width: none; }

      /* LANGUAGE SWITCHER → clean right-aligned dropdown, big touch targets */
      .lang-switcher { position: relative !important; overflow: visible !important; width: auto !important; z-index: 2000 !important; }
      .lang-current {
  min-height: 40px !important;
  padding: 8px 12px !important;
  font-size: 11px !important;
  touch-action: manipulation;
}
      .lang-menu {
        display: none !important;
        position: absolute !important;
        top: calc(100% + 6px) !important;
        right: 0 !important; left: auto !important;
        width: max-content !important; min-width: 170px !important;
        margin-top: 0 !important;
        z-index: 2001 !important;
        box-shadow: 0 16px 36px rgba(0,0,0,0.5);
      }
      .lang-switcher.open .lang-menu { display: block !important; }
      .lang-menu button { min-height: 46px !important; font-size: 11px !important; }

      /* CHOICE */
      .section-choice { min-height: auto !important; padding: 54px 22px !important; gap: 40px !important; }
      .choice-heading h2 { font-size: 26px !important; }
      .choice-heading p { font-size: 11px; letter-spacing: 3px; }
      .cards-row { gap: 24px !important; }
      .card { max-width: 100% !important; width: 100% !important; }
      .card-illustration { height: 196px; }
      .card-body { padding: 28px 26px 0; }
      .card-btn { width: 100% !important; min-width: 0 !important; min-height: 50px; display: inline-flex; align-items: center; justify-content: center; }

      /* HOME FAQ + FOOTER */
      .section-home-faq { padding: 48px 22px !important; }
      .home-faq-header { margin-bottom: 40px; }
      .section-footer { min-height: auto !important; padding: 48px 22px !important; gap: 34px !important; }
    }

    @media (max-width: 400px) {
      .hero-title { font-size: 27px !important; }
      .card-illustration { height: 176px; }
      .choice-heading h2 { font-size: 23px !important; }
    }


/* Label above each footer phone number. Was an inline style="" repeated on
   both contact items, in both languages. */
    .contact-item-label {
      display: block; font-size: 12px; color: rgba(255,255,255,0.6);
      margin-bottom: 6px; letter-spacing: 0.5px;
    }