/* ══════════════════════════════════════════════════════════════════════
   header-fit.css — ONE-LINE DESKTOP HEADER
   Loaded last on every page so it wins over style.css / home.css.

   Problem it solves: .header-area-3-inner was `flex-wrap: wrap` with three
   competing `margin:auto` children. On 13"/14" laptops (1200–1600px) the
   logo + 5 nav items + "Backed by" chips + the pilot CTA exceeded the
   container, so the CTA dropped onto a second row.

   Fix: nowrap layout with explicit flex roles, plus two density tiers that
   scale the logo, nav, backer chips and CTA down so everything fits on a
   single line from 1200px up.
   ══════════════════════════════════════════════════════════════════════ */

@media (min-width: 1200px) {

  /* ── Layout: never wrap, explicit flex roles ────────────────────── */
  .header-area-3 .header-area-3-inner {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 26px;
  }

  .header-area-3 .header-logo {
    flex: 0 0 auto;
    margin: 0 !important;
  }

  /* The nav is the only elastic child — it absorbs/gives up the slack. */
  .header-area-3 .header-nav {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: center;
    margin: 0 !important;
  }

  .header-area-3 .nd-backed-by,
  .header-area-3 .header-button {
    flex: 0 0 auto;
    margin: 0 !important;
  }

  /* ── Nav row itself must not wrap either ────────────────────────── */
  .header-area-3 .main-menu > ul {
    flex-wrap: nowrap !important;
    gap: 30px;
  }
  .header-area-3 .main-menu > ul > li {
    white-space: nowrap;
  }
  .header-area-3 .main-menu > ul > li > a {
    white-space: nowrap;
  }

  .header-area-3 .header-button .t-btn-group {
    flex-wrap: nowrap;
  }
  .header-area-3 .t-btn-exclusive {
    white-space: nowrap;
  }
}

/* ── Tier 1 — 14"/15" laptops and small desktops (1200–1599px) ─────── */
@media (min-width: 1200px) and (max-width: 1599.98px) {
  .header-area-3 .header-area-3-inner { gap: 18px; }

  body.body-creative-agency .header-logo img.normal-logo,
  .header-area-3 .header-logo img.normal-logo {
    width: 150px !important;
    max-width: 150px !important;
  }

  .header-area-3 .main-menu > ul { gap: 26px; }
  .header-area-3 .main-menu > ul > li > a { font-size: 16px; }

  .header-area-3 .nd-backed-by { gap: 9px; padding-right: 13px; }
  .header-area-3 .nd-backed-by-label { font-size: 10.5px; letter-spacing: 0.03em; }
  .header-area-3 .nd-backed-by-chip { height: 29px; padding: 0 8px; }
  .header-area-3 .nd-backed-by-chip img { height: 19px; }

  .header-area-3 .t-btn-exclusive {
    font-size: 13.5px;
    height: 42px;
    padding: 0 18px;
  }
}

/* ── Tier 2 — 13" MacBook class (1200–1379px) ──────────────────────── */
@media (min-width: 1200px) and (max-width: 1379.98px) {
  .header-area-3 .header-area-3-inner { gap: 14px; }

  body.body-creative-agency .header-logo img.normal-logo,
  .header-area-3 .header-logo img.normal-logo {
    width: 132px !important;
    max-width: 132px !important;
  }

  .header-area-3 .main-menu > ul { gap: 19px; }
  .header-area-3 .main-menu > ul > li > a { font-size: 15px; }

  .header-area-3 .t-btn-exclusive {
    font-size: 12.5px;
    height: 40px;
    padding: 0 15px;
  }
}