/* ==========================================================================
   Fekete Dáma — responsive.css
   Breakpoint overrides: 640 / 768 / 1024 / 1280.
   Keep overrides here that are cross-component.
   ========================================================================== */

/* Extra small (<640px) — base styles already mobile-first, minor polish */
@media (max-width: 639px) {
    .fd-section { padding: var(--s-48) 0; }
    .fd-section--wide { padding: var(--s-64) 0; }
    .fd-section__header { margin-bottom: var(--s-32); }
    .fd-hero__content { padding: var(--s-32) var(--s-24); }
    .fd-hero__title { font-size: clamp(1.875rem, 8vw, 2.25rem); }
    .fd-hero__lead { font-size: 1rem; }
    .fd-cta-block { padding: var(--s-32) var(--s-24); }
}

/* Tablet sm (≥640px) */
@media (min-width: 640px) {
    /* Grid bumps already handled in layout.css */
}

/* Tablet (≥768px) */
@media (min-width: 768px) {
    .fd-container { padding: 0 var(--s-32); }
    .fd-footer__bottom-inner { align-items: center; }
}

/* Desktop (≥1024px) */
@media (min-width: 1024px) {
    .fd-section { padding: var(--s-96) 0; }
    .fd-section--wide { padding: var(--s-128) 0; }
    .fd-header__inner { padding: 0 var(--s-32); }
}

/* Wide (≥1280px) */
@media (min-width: 1280px) {
    .fd-container { padding: 0 var(--s-40); }
}

/* Home split hero — mobile stack image top (already default), ensure correct ordering */
@media (max-width: 899px) {
    .fd-hero__media { order: 1; }
    .fd-hero__content { order: 2; }
}