/* NineGravity theme — large-screen amplification */

/* NineGravity — Large-screen amplification
   Scales typography, spacing, and navigation beyond the stock clamp()
   ceilings on wide (1440+), ultrawide (1728+), and cinema (1920+) viewports.
   Mobile & desktop behavior below 1440px is untouched. */

/* ======================================================================
   TIER 0 — Mobile + standard desktop tuning (<1440px)
   The stock clamp() lower-bounds were too conservative on 13–15" laptops
   and phones: copy dropped below readable, nav links cramped, sections
   felt flat. This layer raises floors without touching large-screen rules.
   ====================================================================== */

/* ---------- Base: ensure minimum body + UI copy sizes ---------- */
.ng { font-size: 16px; line-height: 1.55; }
.ng .nga-nav__menu { font-size: 17px; gap: 36px; }
.ng .nga-nav__inner { padding-top: 20px; padding-bottom: 20px; gap: 36px; }
.ng .nga-nav__logo img { height: 22px !important; }
.ng .nga-nav__cta .ng-btn { padding: 12px 20px; font-size: 14px; }

/* ---------- Eyebrows / mono labels: never below 12px, slightly more tracked ---------- */
.ng .ng-eyebrow { font-size: 12px; }
.ng .nga-trust__l,
.ng .nga-audit__n,
.ng .nga-audit__kicker,
.ng .nga-case__m-l,
.ng .nga-services__n,
.ng .nga-foot__h { font-size: 12px; }

/* ---------- Body-copy floors ---------- */
.ng .nga-hero__sub { font-size: clamp(18px, 1.6vw, 22px); }
.ng .nga-dual__p { font-size: clamp(15px, 1.15vw, 17px); line-height: 1.6; }
.ng .nga-services__p { font-size: clamp(15px, 1.1vw, 17px); line-height: 1.6; }
.ng .nga-audit__lead { font-size: clamp(16px, 1.2vw, 18px); line-height: 1.6; margin: 24px 0 48px; }
.ng .nga-audit__t { font-size: 16px; }
.ng .nga-audit__d { font-size: 14px; line-height: 1.55; }
.ng .nga-case__lead { font-size: clamp(15px, 1.1vw, 17px); }
.ng .nga-review__q { font-size: 15px; line-height: 1.6; }
.ng .nga-foot__col a, .ng .nga-foot__col span { font-size: 14px; }
.ng .nga-post__h { font-size: clamp(18px, 1.3vw, 22px); line-height: 1.3; }
.ng .nga-news__p { font-size: clamp(16px, 1.15vw, 18px); }

/* ---------- Headline floors: prevent sub-30px H2 on narrow laptops ---------- */
.ng .nga-h2 { font-size: clamp(38px, 4.6vw, 60px); line-height: 1.04; }
.ng .nga-dual__h { font-size: clamp(30px, 2.9vw, 40px); line-height: 1.08; margin: 16px 0 20px; }
.ng .nga-services__h { font-size: clamp(26px, 2.3vw, 34px); }
.ng .nga-hero__h { font-size: clamp(52px, 7vw, 120px); line-height: 0.96; }

/* ---------- Vertical rhythm fixes ---------- */
:root { --nga-sec-y: clamp(88px, 9vw, 144px); --nga-sec-y-sm: clamp(64px, 6vw, 96px); --nga-pad: clamp(28px, 6vw, 96px); }
.ng .nga-sec > .nga-container > .ng-eyebrow,
.ng .nga-sec > .nga-container--wide > .ng-eyebrow { margin-bottom: 24px; display: inline-flex; }
.ng .nga-h2 + .svc-lead,
.ng .nga-h2 + p { margin-top: 20px; }
.ng .nga-dual { margin-top: clamp(40px, 4.5vw, 64px); gap: clamp(20px, 2vw, 32px); }
.ng .nga-dual__card { padding: clamp(36px, 4vw, 56px) clamp(28px, 3.5vw, 44px); min-height: clamp(380px, 38vw, 480px); }
.ng .nga-dual__list { margin-top: 32px; gap: 12px; }
.ng .nga-dual__list li { font-size: 15px; }
.ng .nga-dual__foot { padding-top: 44px; }

.ng .nga-services__card { padding: clamp(40px, 4vw, 56px) clamp(28px, 3vw, 44px); min-height: clamp(320px, 28vw, 400px); }
.ng .nga-services__h { margin: 0 0 16px; }
.ng .nga-case__m { padding: clamp(36px, 3.5vw, 56px) clamp(28px, 3vw, 44px); }
.ng .nga-review { padding: clamp(26px, 2.2vw, 36px); min-height: 260px; }

/* ---------- Trust strip: raise text sizes ---------- */
.ng .nga-trust__row { padding: clamp(22px, 2.2vw, 30px) 0; }
.ng .nga-trust__v,
.ng .nga-trust__big { font-size: clamp(20px, 1.7vw, 24px); }

/* ---------- Footer: better link hierarchy on laptop ---------- */
.ng .nga-foot { padding: clamp(72px, 7vw, 104px) 0 40px; }
.ng .nga-foot__top { gap: clamp(32px, 3.5vw, 56px); padding-bottom: clamp(48px, 5vw, 72px); }

/* ---------- Mobile (<640px) — bigger copy, tighter gutter ---------- */
@media (max-width: 640px) {
  .ng .nga-hero__h { font-size: clamp(44px, 12vw, 60px); line-height: 0.98; }
  .ng .nga-hero__sub { font-size: 17px; line-height: 1.5; }
  .ng .nga-h2 { font-size: clamp(34px, 9vw, 44px); }
  .ng .nga-dual__h { font-size: 28px; }
  .ng .nga-services__h { font-size: 24px; }
  .ng .nga-hero__foot { margin-top: 36px; padding-top: 28px; gap: 24px; }
  .ng .nga-hero__meta { gap: 16px; }
  .ng .nga-hero__meta-item { font-size: 11px; }
  .ng .nga-dual__card { padding: 36px 24px; }
  .ng .nga-dual__p { font-size: 16px; }
  .ng .nga-services__card { padding: 36px 24px; }
  .ng .nga-services__p { font-size: 16px; }
  .ng .nga-review__q { font-size: 16px; }
  .ng .nga-review { padding: 24px; }
  .ng .nga-foot__col a, .ng .nga-foot__col span { font-size: 15px; }
  .ng .nga-post__h { font-size: 19px; }
  :root { --nga-pad: 22px; }
}

/* ---------- Small laptop (641–1100) — eliminate cramped two-column feel on nav + hero ---------- */
@media (min-width: 641px) and (max-width: 1100px) {
  .ng .nga-nav__menu { gap: 28px; font-size: 17px; }
  .ng .nga-hero { padding: 96px 0 88px; }
  .ng .nga-hero__h { font-size: clamp(60px, 8vw, 92px); }
  .ng .nga-hero__foot { gap: 40px; margin-top: 48px; padding-top: 36px; }
}

/* ======================================================================
   TIER 1 — Desktop wide (1440px+)
   Headlines go bigger, nav breathes, container padding grows.
   ====================================================================== */
@media (min-width: 1440px) {
  :root {
    --nga-pad: clamp(64px, 5vw, 100px);
    --nga-sec-y: clamp(112px, 9vw, 160px);
    --nga-sec-y-sm: clamp(80px, 6vw, 120px);
  }

  /* Nav — taller, larger logo + links, more generous CTA */
  .ng .nga-nav__inner { padding: 26px var(--nga-pad); gap: 48px; }
  .ng .nga-nav__menu { gap: 40px; font-size: 17px; }
  .ng .nga-nav__logo img { height: 24px !important; }
  .ng .nga-nav__cta .ng-btn { padding: 13px 22px !important; font-size: 15px !important; }

  /* Hero — push headline larger, sub-copy larger, more breathing room */
  .ng .nga-hero { padding: clamp(128px, 10vw, 176px) 0 clamp(112px, 8vw, 144px); }
  .ng .nga-hero__h { font-size: clamp(100px, 8.5vw, 140px); line-height: 0.92; }
  .ng .nga-hero__sub { font-size: clamp(20px, 1.5vw, 26px); line-height: 1.4; max-width: 58ch; }
  .ng .nga-hero__foot { gap: clamp(64px, 6vw, 120px); padding-top: clamp(40px, 3.5vw, 60px); margin-top: clamp(56px, 5.5vw, 88px); }
  .ng .nga-hero__meta { gap: clamp(32px, 3vw, 56px); margin-top: clamp(36px, 3.5vw, 56px); padding-top: 28px; font-size: 13px; }
  .ng .nga-hero__ctas .ng-btn.ng-btn--lg { padding: 22px 32px; font-size: 17px; }

  /* Section headings scale up */
  .ng .nga-h2 { font-size: clamp(52px, 5vw, 76px); line-height: 1.02; }
  .ng .nga-dual__h { font-size: clamp(36px, 3vw, 48px); }
  .ng .nga-services__h { font-size: clamp(32px, 2.6vw, 42px); }

  /* Body copy that reads as "lead" */
  .ng .nga-dual__p,
  .ng .nga-services__p,
  .ng .nga-audit__lead { font-size: clamp(16px, 1.15vw, 18px); line-height: 1.6; }

  /* Trust strip spacing */
  .ng .nga-trust__row { padding: clamp(22px, 2vw, 34px) 0; }
  .ng .nga-trust__v,
  .ng .nga-trust__big { font-size: clamp(22px, 1.8vw, 28px); }
  .ng .nga-trust__l { font-size: 12px; }

  /* Dual path cards — bigger internal padding on wide */
  .ng .nga-dual__card { padding: clamp(48px, 4.5vw, 80px) clamp(40px, 4vw, 72px); min-height: clamp(440px, 36vw, 560px); }
  .ng .nga-dual { gap: clamp(28px, 2.5vw, 48px); margin-top: clamp(56px, 5vw, 88px); }

  /* Services cards */
  .ng .nga-services__card { padding: clamp(48px, 4vw, 72px) clamp(36px, 3.5vw, 60px); min-height: clamp(380px, 28vw, 460px); }

  /* Case study metric figures */
  .ng .nga-case__m { padding: clamp(44px, 4vw, 72px) clamp(36px, 3.5vw, 60px); }
  .ng .nga-case__m-t { font-size: clamp(56px, 5vw, 80px); }
  .ng .nga-case__quote blockquote { font-size: clamp(34px, 3vw, 48px); }

  /* Audit product */
  .ng .nga-audit { gap: clamp(80px, 7vw, 140px); }
  .ng .nga-audit__fig { font-size: clamp(48px, 4.2vw, 64px); }

  /* Reviews */
  .ng .nga-reviews__grid { gap: clamp(24px, 2vw, 36px); }
  .ng .nga-review { padding: clamp(32px, 2.5vw, 44px); min-height: 280px; }
  .ng .nga-review__q { font-size: 16px; line-height: 1.6; }
  .ng .nga-reviews__score-n { font-size: clamp(48px, 4vw, 64px); }

  /* Footer */
  .ng .nga-foot__top { gap: clamp(40px, 4vw, 72px); }
  .ng .nga-foot__col a,
  .ng .nga-foot__col span { font-size: 15px; }
}

/* ======================================================================
   TIER 2 — Ultrawide (1728px+)
   Bigger again, generous gutters that still stay proportional.
   ====================================================================== */
@media (min-width: 1728px) {
  :root {
    --nga-pad: clamp(100px, 6vw, 140px);
    --nga-sec-y: clamp(144px, 9vw, 192px);
  }
  .ng .nga-hero__h { font-size: clamp(128px, 9vw, 168px); }
  .ng .nga-h2 { font-size: clamp(64px, 5.2vw, 88px); }
  .ng .nga-hero__sub { font-size: clamp(22px, 1.5vw, 28px); max-width: 60ch; }
  .ng .nga-dual__h { font-size: clamp(42px, 3vw, 56px); }
  .ng .nga-hero__ctas .ng-btn.ng-btn--lg { padding: 24px 36px; font-size: 18px; }
}

/* ======================================================================
   TIER 3 — Cinema (1920px+)
   Final bump; keep padding cap so content doesn't drift.
   ====================================================================== */
@media (min-width: 1920px) {
  :root {
    --nga-pad: 140px;
    --nga-max: 1840px;
    --nga-max-wide: 1840px;
  }
  .ng .nga-hero__h { font-size: 176px; }
  .ng .nga-h2 { font-size: 96px; }
  .ng .nga-hero__sub { font-size: 28px; }
}