/* ── Presentation page: RTL & responsive fixes ────────────────────────── */

/* Identity grid: labels in Arabic are wider than 7rem → flexible two-col layout */
html[dir="rtl"] .identity-grid {
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
}

@media (min-width: 640px) {
  html[dir="rtl"] .identity-grid {
    grid-template-columns: minmax(4rem, 0.7fr) minmax(0, 1.3fr);
  }
}

html[dir="rtl"] .identity-grid dt,
html[dir="rtl"] .identity-grid dd {
  text-align: start;
  overflow-wrap: anywhere;
}

@media (max-width: 639px) {
  .identity-grid,
  html[dir="rtl"] .identity-grid {
    grid-template-columns: 1fr;
  }
}

html[dir="rtl"] .identity-grid dt {
  width: 100%;
}

/* Cards: stack to 2 columns on tablet for better readability */
@media (min-width: 640px) and (max-width: 1023px) {
  .identity-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Sites cards: 1 column on mobile, smooth 2→3 on desktop */
@media (min-width: 768px) and (max-width: 1023px) {
  .sites-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Long Arabic URLs/emails must break properly */
a[href] {
  overflow-wrap: break-word;
}

/* Ensure the section has a max-width to avoid page-level overflow */
#section-identity,
#section-cards,
#section-sites {
  max-width: 100%;
}