/* ============================================================
   MAVORA Design System — v65 refinement pass
   Loaded after v64. Unlayered => wins over Tailwind v4 layers & v64.
   Rollback: remove this <link> + delete file.
   ============================================================ */

/* ---------- A. Home ---------- */
/* A1 announcement bar: more air, refined tracking */
header .bg-\[var\(--charcoal\)\] .h-9 {
  height: 2.5rem;
}
header .bg-\[var\(--charcoal\)\] .h-9 > a {
  letter-spacing: 0.2em;
}

/* A2 inquiry badge: quiet hairline chip instead of loud bronze block */
header .min-w-6 {
  background: transparent;
  border: 1px solid var(--stone-grey);
  color: var(--charcoal);
  border-radius: 2px;
  min-width: 1.35rem;
  padding: 0 0.3rem;
  font-size: 0.6875rem;
  line-height: 1.2;
}

/* A4 category cards: CTA arrow + underline motion; consistent card spacing */
a[class*="col-span-4"] .inline-flex {
  position: relative;
  padding-bottom: 2px;
}
a[class*="col-span-4"] .inline-flex::after {
  content: "\2192";                 /* → */
  margin-left: 8px;
  transition: transform 0.2s cubic-bezier(0.2, 0.6, 0.2, 1);
}
a[class*="col-span-4"]:hover .inline-flex::after {
  transform: translateX(4px);
}
a[class*="col-span-4"] .inline-flex {
  border-bottom: 1px solid transparent;
  padding-bottom: 3px;
  transition: color 0.2s ease, border-color 0.2s ease;
}
a[class*="col-span-4"]:hover .inline-flex {
  border-color: currentColor;
}
/* room card image container: tighten vertical crop (cover) & unify text block spacing */
a[class*="col-span-4"] .border-b {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
a[class*="col-span-4"] .border-b h3 {
  letter-spacing: 0.02em;
}

/* ---------- B. Category pages ---------- */
/* B5 product card grid: more row breathing between card rows */
@media (min-width: 1024px) {
  .lg\:grid-cols-4 {
    row-gap: 3.5rem;
  }
}
/* B5 card meta: name larger/bolder on its own line; SKU + size share a baseline row */
article.group .space-y-1 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 10px;
}
article.group .space-y-1 p:first-child {
  flex-basis: 100%;
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.35;
}
article.group .space-y-1 p:first-child + p,
article.group .space-y-1 p:first-child + p + p {
  margin-top: 0;
}
article.group .space-y-1 p:first-child {
  margin-bottom: 3px;
}
article.group .space-y-1 p:first-child + p + p {
  color: var(--text-muted);
}

/* B7 intro copy max width (~75ch), centered as container already is */
.mx-auto.mt-6 {
  max-width: 75ch;
}

/* ---------- C. Product page ---------- */
/* C9 breadcrumb: compact + download catalog pushed to its own right edge */
nav[aria-label="Breadcrumb"] {
  font-size: 0.6875rem;
  letter-spacing: 0.13em;
  gap: 0.375rem;
}
nav[aria-label="Breadcrumb"] > a[target="_blank"] {
  margin-left: auto;
}
nav[aria-label="Breadcrumb"] a,
nav[aria-label="Breadcrumb"] span {
  white-space: nowrap;
}

/* C10 spec rows tightened (only inside product detail 3-col grid) */
.lg\:grid-cols-3 .space-y-3 > :not(:first-child) {
  margin-top: 0.5rem;
}
/* description column: readable measure + gentle leading */
.lg\:grid-cols-3 > div:first-child p.leading-7 {
  max-width: 52ch;
  line-height: 1.75;
}

/* ---------- D. Mobile ---------- */
/* D13 hero h1 slightly smaller to free the first screen (mobile) */
@media (max-width: 639px) {
  h1 {
    font-size: clamp(1.95rem, 4.8vw + 0.7rem, 2.4rem);
    line-height: 1.14;
  }
  /* breathing between hero description and CTA row */
  .home-hero-copy h1 + p + div {
    margin-top: 2.5rem;
  }
}

/* D14 float stack: unified right edge + ≥12px separation from WhatsApp */
.mavora-lang {
  right: 20px !important;
  bottom: 112px !important;
}

/* ---------- E. RTL ---------- */
/* RTL: directional arrows point left; comfortable Arabic leading */
[dir="rtl"] svg.lucide-arrow-right,
[dir="rtl"] .home-hero-copy a svg {
  transform: scaleX(-1);
}
[dir="rtl"] a[class*="col-span-4"] .inline-flex::after {
  content: "\2190";                 /* ← in RTL */
}
[dir="rtl"] h1 {
  line-height: 1.4;
}
