/* === ./template/styles.css === */

:root { scroll-padding-top: 6.75rem; }
@media (max-width: 640px) {
  :root { scroll-padding-top: 5.75rem; }
}

:focus-visible { outline: 3px solid rgba(16,185,129,.45); outline-offset: 3px; }

/* Optional – professional readability on mobile */
body { -webkit-text-size-adjust: 100%; }
p { text-wrap: pretty; }
h1, h2 { text-wrap: balance; }

html[dir="rtl"] body { font-family: Cairo, ui-sans-serif, system-ui, "Segoe UI", Arial; }
html[dir="ltr"] body { font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", Arial; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .motion-safe\:animate-pulse,
  .motion-safe\:animate-ping,
  .motion-safe\:transition,
  .motion-safe\:duration-300,
  .motion-safe\:duration-500,
  .motion-safe\:duration-700 { animation: none !important; transition: none !important; }
}

/* Useful logical alignment helpers */
.text-start { text-align: start; }
.text-end { text-align: end; }