/**
 * Nejat Ortho — Shared CSS Design Tokens
 * Included on every page; consumed by all widget stylesheets.
 */

:root {
  /* Layout */
  --nejat-gutter:           24px;   /* horizontal inner container padding L/R */
  --nejat-max-width:        1400px; /* container max-width                    */
  --nejat-section-pad-v:    60px;   /* vertical padding TOP/BOTTOM per widget */

  /* Gap scale */
  --nejat-gap-sm:  16px;
  --nejat-gap-md:  32px;
  --nejat-gap-lg:  48px;

  /* Radius */
  --nejat-radius:  12px;
}

@media (max-width: 1024px) {
  :root { --nejat-section-pad-v: 48px; }
}

@media (max-width: 768px) {
  :root {
    --nejat-gutter:          16px;
    --nejat-section-pad-v:   36px;
  }
}

@media (max-width: 480px) {
  :root { --nejat-section-pad-v: 28px; }
}

/* -----------------------------------------------------------------------
   Layout shell — apply to every widget root via BEM naming
   .nejat-{widget}          controls section spacing
   .nejat-{widget}__inner   controls horizontal gutter + max-width
   ----------------------------------------------------------------------- */