/* ============================================================
   PANDA-CLEAN  ·  Direction A
   ------------------------------------------------------------
   A light polish layer loaded AFTER style.css. It borrows
   Apple's structure — pill buttons, calmer corners, generous
   section rhythm — while keeping the site's ORIGINAL fonts.

   The 8-bit personality comes from the existing pixel panda
   artwork plus a subtle blocky shadow on the primary button —
   NOT from a pixel font (kept off so EN/TH text is consistent).
   ============================================================ */

/* ---- Apple-style pill buttons, kept warm ----
   These match style.css's two-class specificity (.hero-btn.primary /
   .secondary / .line-btn) so the pill radius wins by load order. */
.hero-btn.primary,
.hero-btn.secondary,
.hero-btn.line-btn {
  border-radius: 999px;
  padding: 0.85rem 1.7rem;
  font-weight: 600;
  letter-spacing: 0.1px;
}
.hero-btn.primary { box-shadow: var(--shadow-pixel); }            /* subtle 8-bit nod */

/* ---- Apple restraint: softer corners, calmer rhythm ---- */
.home-feature-card { border-radius: var(--radius-md); }
.home-workflow-step { border-radius: var(--radius-sm); }

/* a touch more air between the home sections (Apple section rhythm) */
.home-clean > section + section { margin-top: clamp(46px, 7vw, 84px); }

/* ============================================================
   UNIFIED NAV (shared style across Chamiz / MaliBills / MaliTrip)
   Minimalist panda on the left (-> Chamiz home), menu centered,
   language pill on the right. Desktop only; the mobile hamburger
   (<= 900px) is left untouched.
   ============================================================ */
.nav-home {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.nav-home:hover { opacity: 0.92; transform: translateY(-1px); }
.nav-home svg { width: 30px; height: 30px; }

/* Centered site title; positioned against the sticky .navbar */
.nav-title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 800;
  letter-spacing: -0.07em;
  line-height: 1;
  color: var(--text);
  text-decoration: none;
  white-space: nowrap;
}
.nav-title span { color: var(--orange); }