/*
 * KKI Design System — EN/TH layout parity
 *
 * Section heights naturally vary between EN and TH because Thai text wraps
 * to more lines + has higher line-height for readability. This causes
 * cumulative y-position drift: at scroll y=2000, EN might show section B
 * while TH still shows section A's tail.
 *
 * Fix: set min-heights on major home sections so the SHORTER language
 * gets extra whitespace, but both pages have matching section starting
 * positions. Section heights are measured from production rendering and
 * use the TALLER language as the parity baseline.
 *
 * Sections covered (in order of appearance):
 *   .kki-fp           — KORKAIIDEA SELECTED (card grid)
 *   .kki-st           — BUSINESS OVERVIEW (stats)
 *   .kki-mb           — KORKAIIDEA PARTNERS (numbered list)
 *   .kki-fn           — Founder note / pullquote
 *   .kki-ri           — KORKAIIDEA DAILY (article cards)
 *   .kki-final        — Talk with us CTA
 *   .kki-svc          — FULL SERVICE INVESTMENT (icon grid)
 *   .kki-ir           — Voices from clients (testimonials)
 *   .kki-dev-slider   — Trusted developers logo strip
 *
 * Heights are measured at desktop 1440×900 viewport. Mobile uses different
 * min-heights via @media (max-width: 768px).
 */

/* ── Desktop section parity (≥1025px) ───────────────────────────────── */
@media (min-width: 1025px) {
  body.home .kki-fp,
  body.page-id-4122 .kki-fp,
  body.page-id-4519 .kki-fp {
      min-height: 1220px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-st,
  body.page-id-4122 .kki-st,
  body.page-id-4519 .kki-st {
      min-height: 600px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-mb,
  body.page-id-4122 .kki-mb,
  body.page-id-4519 .kki-mb {
      min-height: 680px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-fn,
  body.page-id-4122 .kki-fn,
  body.page-id-4519 .kki-fn {
      min-height: 1280px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-ri,
  body.page-id-4122 .kki-ri,
  body.page-id-4519 .kki-ri {
      min-height: 870px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-final,
  body.page-id-4122 .kki-final,
  body.page-id-4519 .kki-final {
      min-height: 510px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-svc,
  body.page-id-4122 .kki-svc,
  body.page-id-4519 .kki-svc {
      min-height: 1700px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-ir,
  body.page-id-4122 .kki-ir,
  body.page-id-4519 .kki-ir {
      min-height: 820px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-dev-slider,
  body.page-id-4122 .kki-dev-slider,
  body.page-id-4519 .kki-dev-slider {
      min-height: 560px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }
}

/* ── Tablet parity (769-1024px) ─────────────────────────────────────── */
@media (min-width: 769px) and (max-width: 1024px) {
  body.home .kki-fp,
  body.page-id-4122 .kki-fp,
  body.page-id-4519 .kki-fp {
      min-height: 1100px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-st,
  body.home .kki-mb,
  body.home .kki-ri,
  body.home .kki-ir,
  body.home .kki-dev-slider,
  body.page-id-4122 .kki-st,
  body.page-id-4519 .kki-st {
      min-height: 600px;
  }

  body.home .kki-fn,
  body.page-id-4122 .kki-fn,
  body.page-id-4519 .kki-fn {
      min-height: 1100px;
  }

  body.home .kki-svc,
  body.page-id-4122 .kki-svc,
  body.page-id-4519 .kki-svc {
      min-height: 1400px;
  }
}

/* ── Mobile (≤768px) — section parity with realistic min-heights ──── */
/*
 * Measured drift on mobile (390×844 viewport):
 *   .kki-fp           EN 2404 vs TH 2476 — Thai cards taller
 *   .kki-st           EN 1098 vs TH 1082 — close
 *   .kki-mb           EN  905 vs TH  845 — close
 *   .kki-fn           EN 1413 vs TH 1391 — close
 *   .kki-ri           EN 1483 vs TH 1463 — close
 *   .kki-final        EN  598 vs TH  535 — close
 *   .kki-svc          EN 3173 vs TH 2450 — **723px drift** ⚠
 *   .kki-ir           EN  664 vs TH  589 — close
 *   .kki-dev-slider   EN  425 vs TH  384 — close
 *
 * Setting min-heights = max(EN, TH) value so the SHORTER language
 * inherits the TALLER's vertical footprint. Page total stabilizes.
 */
@media (max-width: 768px) {
  body.home .kki-fp,
  body.page-id-4122 .kki-fp,
  body.page-id-4519 .kki-fp {
      min-height: 2480px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-st,
  body.page-id-4122 .kki-st,
  body.page-id-4519 .kki-st {
      min-height: 1100px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-mb,
  body.page-id-4122 .kki-mb,
  body.page-id-4519 .kki-mb {
      min-height: 910px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-fn,
  body.page-id-4122 .kki-fn,
  body.page-id-4519 .kki-fn {
      min-height: 1420px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-ri,
  body.page-id-4122 .kki-ri,
  body.page-id-4519 .kki-ri {
      min-height: 1490px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-final,
  body.page-id-4122 .kki-final,
  body.page-id-4519 .kki-final {
      min-height: 625px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-svc,
  body.page-id-4122 .kki-svc,
  body.page-id-4519 .kki-svc {
      min-height: 3340px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-ir,
  body.page-id-4122 .kki-ir,
  body.page-id-4519 .kki-ir {
      min-height: 670px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  body.home .kki-dev-slider,
  body.page-id-4122 .kki-dev-slider,
  body.page-id-4519 .kki-dev-slider {
      min-height: 430px;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }
}

/* ── Universal: ensure inner content centers within the parity box ──── */
@media (min-width: 769px) {
  body.home .kki-fp__inner,
  body.home .kki-st__inner,
  body.home .kki-mb__inner,
  body.home .kki-fn__inner,
  body.home .kki-ri__inner,
  body.home .kki-svc__inner,
  body.home .kki-ir__inner,
  body.home .kki-dev-slider__inner,
  body.page-id-4122 .kki-fp__inner,
  body.page-id-4519 .kki-fp__inner,
  body.page-id-4122 .kki-st__inner,
  body.page-id-4519 .kki-st__inner {
      width: 100%;
  }
}

/* ════════════════════════════════════════════════════════════════════
 * Per-family parity for non-home pages
 * Measured at desktop 1440×900 + mobile 390×844 — take MAX(EN, TH).
 * Helper class .kki-parity-flex centers content inside the min-height box.
 * ════════════════════════════════════════════════════════════════════ */

/* ── Methodology (kki-m2-*) ──────────────────────────────────────────── */
@media (min-width: 1025px) {
  body.page-id-4481 .kki-m2-hero,
  body.page-id-4520 .kki-m2-hero {
      min-height: 1610px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4481 .kki-m2-path,
  body.page-id-4520 .kki-m2-path {
      min-height: 930px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4481 article,
  body.page-id-4520 article {
      min-height: 560px;
  }
}
@media (max-width: 768px) {
  body.page-id-4481 .kki-m2-hero,
  body.page-id-4520 .kki-m2-hero {
      min-height: 895px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4481 .kki-m2-path,
  body.page-id-4520 .kki-m2-path {
      min-height: 670px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4481 article,
  body.page-id-4520 article {
      min-height: 320px;
  }
}

/* ── Services (kki-s2-*) ─────────────────────────────────────────────── */
@media (min-width: 1025px) {
  body.page-id-4482 .kki-s2-hero,
  body.page-id-4521 .kki-s2-hero {
      min-height: 545px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4482 .kki-s2-phase,
  body.page-id-4521 .kki-s2-phase {
      min-height: 780px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4482 article,
  body.page-id-4521 article {
      min-height: 370px;
  }
}
@media (max-width: 768px) {
  body.page-id-4482 .kki-s2-hero,
  body.page-id-4521 .kki-s2-hero {
      min-height: 670px !important;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4482 .kki-s2-phase,
  body.page-id-4521 .kki-s2-phase {
      min-height: 1340px !important;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4482 article,
  body.page-id-4521 article {
      min-height: 250px !important;
  }
}

/* ── About (kki-a2-*) ────────────────────────────────────────────────── */
@media (min-width: 1025px) {
  body.page-id-2711 .kki-a2-hero,
  body.page-id-4516 .kki-a2-hero {
      min-height: 900px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-2711 article,
  body.page-id-4516 article {
      min-height: 135px; display: flex; flex-direction: column; justify-content: center;
  }
}
@media (max-width: 768px) {
  body.page-id-2711 .kki-a2-hero,
  body.page-id-4516 .kki-a2-hero {
      min-height: 730px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-2711 article,
  body.page-id-4516 article {
      min-height: 200px;
  }
}

/* ── Projects + Portfolio listings (kki-fp on those page IDs) ───────── */
@media (min-width: 1025px) {
  body.page-id-4777 .kki-fp,
  body.page-id-4778 .kki-fp {
      min-height: 2010px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4788 .kki-fp,
  body.page-id-4789 .kki-fp {
      min-height: 650px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4777 article,
  body.page-id-4778 article {
      min-height: 710px;
  }
}
@media (max-width: 768px) {
  body.page-id-4777 .kki-fp,
  body.page-id-4778 .kki-fp {
      min-height: 4665px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4788 .kki-fp,
  body.page-id-4789 .kki-fp {
      min-height: 485px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.page-id-4777 article,
  body.page-id-4778 article {
      min-height: 650px;
  }
}

/* ── Project Detail (kki_project / harington_portfolio singular) ────── */
@media (min-width: 1025px) {
  body.single-kki_project .kki-pf-quickfacts,
  body.single-harington_portfolio .kki-pf-quickfacts {
      min-height: 700px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.single-kki_project .kki-pf-view,
  body.single-harington_portfolio .kki-pf-view {
      min-height: 410px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.single-kki_project .kki-pf-cta,
  body.single-harington_portfolio .kki-pf-cta {
      min-height: 395px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.single-kki_project article,
  body.single-harington_portfolio article {
      min-height: 615px;
  }
}
@media (max-width: 768px) {
  body.single-kki_project .kki-pf-quickfacts,
  body.single-harington_portfolio .kki-pf-quickfacts {
      min-height: 1295px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.single-kki_project .kki-pf-view,
  body.single-harington_portfolio .kki-pf-view {
      min-height: 345px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.single-kki_project .kki-pf-cta,
  body.single-harington_portfolio .kki-pf-cta {
      min-height: 400px;
      display: flex; flex-direction: column; justify-content: center;
  }
  body.single-kki_project article,
  body.single-harington_portfolio article {
      min-height: 580px;
  }
}

/* ── Insights page (article cards) ──────────────────────────────────── */
@media (min-width: 1025px) {
  body.page-id-4487 article,
  body.page-id-4523 article {
      min-height: 410px;
  }
}
@media (max-width: 768px) {
  body.page-id-4487 article,
  body.page-id-4523 article {
      min-height: 440px;
  }
}

/* ── Contact (kki-cx-* on page-id-2713/4522) ────────────────────────── */
@media (min-width: 1025px) {
  body.page-id-2713 .kki-cx,
  body.page-id-4522 .kki-cx {
      min-height: 1710px;
  }
}
@media (max-width: 768px) {
  body.page-id-2713 .kki-cx,
  body.page-id-4522 .kki-cx {
      min-height: 2770px;
  }
}

/* ════════════════════════════════════════════════════════════════════
 * Per-card parity for residual drift sources
 * Sets min-heights on individual card components that vary in height
 * between languages within the same page (different text lengths).
 * ════════════════════════════════════════════════════════════════════ */

/* About — belief cards + stat cards */
@media (min-width: 1025px) {
  body.page-id-2711 .kki-a2-bel,
  body.page-id-4516 .kki-a2-bel {
      min-height: 175px;
  }
  body.page-id-2711 .kki-a2-stat,
  body.page-id-4516 .kki-a2-stat {
      min-height: 170px;
  }
  body.page-id-2711 .kki-a2-believe,
  body.page-id-4516 .kki-a2-believe {
      min-height: 1010px;
  }
}
@media (max-width: 768px) {
  body.page-id-2711 .kki-a2-bel,
  body.page-id-4516 .kki-a2-bel {
      min-height: 200px;
  }
  body.page-id-2711 .kki-a2-stat,
  body.page-id-4516 .kki-a2-stat {
      min-height: 200px;
  }
  body.page-id-2711 .kki-a2-believe,
  body.page-id-4516 .kki-a2-believe {
      min-height: 1400px;
  }
}

/* Insights — article cards on the insight list */
@media (min-width: 1025px) {
  body.page-id-4487 .kki-insight-card,
  body.page-id-4523 .kki-insight-card,
  body.page-id-4487 .kki-fp__card,
  body.page-id-4523 .kki-fp__card {
      min-height: 520px;
  }
}
@media (max-width: 768px) {
  body.page-id-4487 .kki-insight-card,
  body.page-id-4523 .kki-insight-card,
  body.page-id-4487 .kki-fp__card,
  body.page-id-4523 .kki-fp__card {
      min-height: 560px;
  }
}

/* Methodology — content paragraphs/sections that vary */
@media (min-width: 1025px) {
  body.page-id-4481 .kki-m2-path__step,
  body.page-id-4520 .kki-m2-path__step {
      min-height: 280px;
  }
  body.page-id-4481 .kki-loop,
  body.page-id-4520 .kki-loop {
      min-height: 800px;
  }
}
@media (max-width: 768px) {
  body.page-id-4481 .kki-m2-path__step,
  body.page-id-4520 .kki-m2-path__step {
      min-height: 200px;
  }
  body.page-id-4481 .kki-loop,
  body.page-id-4520 .kki-loop {
      min-height: 700px;
  }
}

/* Project Detail — bump main-page-content to absorb Quick Facts variance */
@media (min-width: 1025px) {
  body.single-kki_project #main-page-content,
  body.single-harington_portfolio #main-page-content {
      min-height: 8410px;
  }
}
@media (max-width: 768px) {
  body.single-kki_project #main-page-content,
  body.single-harington_portfolio #main-page-content {
      min-height: 8960px;
  }
}

/* Final page-level total parity floors (ensures footer lands at same y) */
@media (min-width: 1025px) {
  body.page-id-4481 #main-page-content,
  body.page-id-4520 #main-page-content {
      min-height: 19650px;
  }
  body.page-id-2711 #main-page-content,
  body.page-id-4516 #main-page-content {
      min-height: 5400px;
  }
  body.page-id-4487 #main-page-content,
  body.page-id-4523 #main-page-content {
      min-height: 3970px;
  }
}
@media (max-width: 768px) {
  body.page-id-4481 #main-page-content,
  body.page-id-4520 #main-page-content {
      min-height: 18410px;
  }
  body.page-id-2711 #main-page-content,
  body.page-id-4516 #main-page-content {
      min-height: 7030px;
  }
  body.page-id-4487 #main-page-content,
  body.page-id-4523 #main-page-content {
      min-height: 4430px;
  }
}

/* ════════════════════════════════════════════════════════════════════
 * Final page-floor pass for residual drift
 * Targets body and #content-scroll (which wraps the full document area)
 * to lock total page height when #main-page-content selector doesn't catch.
 * ════════════════════════════════════════════════════════════════════ */
@media (min-width: 1025px) {
  /* Services desktop */
  body.page-id-4482 #content-scroll,
  body.page-id-4521 #content-scroll {
      min-height: 5960px;
  }
  /* ProjectDetail desktop */
  body.single-kki_project #content-scroll,
  body.single-harington_portfolio #content-scroll {
      min-height: 8410px;
  }
}

@media (max-width: 768px) {
  /* Services mobile */
  body.page-id-4482 #content-scroll,
  body.page-id-4521 #content-scroll {
      min-height: 8460px;
  }
  /* ProjectDetail mobile */
  body.single-kki_project #content-scroll,
  body.single-harington_portfolio #content-scroll {
      min-height: 8960px;
  }
}