/* ==========================================================================
   OxusPay responsive.css — breakpoints: 480 / 768 / 1024 / 1280
   ========================================================================== */

@media (max-width: 1280px) {
    .ox-container { padding: 0 2rem; }
    .ox-hero__heading { font-size: 2.5rem; }
    .ox-footer__top { grid-template-columns: 1.1fr repeat(4, 1fr); gap: 1.75rem; }
}

@media (max-width: 1024px) {
    .ox-nav { position: fixed; top: 100%; left: 0; right: 0; background: var(--color-surface, #fff); z-index: 40; border-top: 1px solid var(--color-border);
        flex-direction: column; align-items: stretch; justify-content: flex-start; padding: 1.5rem 2rem; gap: 0; overflow-y: auto;
        box-shadow: var(--shadow-md, 0 8px 24px rgba(0,0,0,0.08));
        max-height: calc(100vh - 5.25rem); height: auto;
        transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity var(--dur-med) var(--ease-standard), transform var(--dur-med) var(--ease-standard), visibility var(--dur-med); }
    .ox-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
    .ox-nav__list { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
    .ox-nav__item, .ox-nav__list > li { border-bottom: 1px solid var(--color-border); }
    .ox-nav__item:last-child, .ox-nav__list > li:last-child { border-bottom: none; }
    .ox-nav__link, .ox-nav__list > li > a { padding: 1rem 0; justify-content: space-between; width: 100%; }
    .ox-nav__item, .ox-nav__list > li { display: flex; flex-wrap: wrap; align-items: center; }
    .ox-nav__item.has-dropdown, .ox-nav__list > li.menu-item-has-children { justify-content: space-between; }
    .ox-nav__link, .ox-nav__list > li > a { width: auto; flex: 1; }
    .ox-nav__toggle { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; background: none; border: none; color: inherit; cursor: pointer; transition: transform var(--dur-fast) var(--ease-standard); }
    .ox-nav__item.is-open .ox-nav__toggle, .ox-nav__list > li.menu-item-has-children.is-open .ox-nav__toggle { transform: rotate(180deg); }
    .ox-nav__dropdown, .ox-nav__list .sub-menu { width: 100%; }
    .ox-nav__dropdown, .ox-nav__list .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; display: none; padding: 0 0 0.75rem; }
    .ox-nav__item.is-open .ox-nav__dropdown,
    .ox-nav__list > li.menu-item-has-children.is-open > .sub-menu { display: block; }
    .ox-hamburger { display: inline-flex; }
    .ox-hero__grid { grid-template-columns: 1fr; }
    .ox-hero__media { order: -1; margin-bottom: 1rem; max-width: 22rem; margin-inline: auto; }
    .ox-footer__top { grid-template-columns: 1fr 1fr; }
    .ox-footer__brand-col { grid-column: 1 / -1; }
}

@media (max-width: 768px) {
    .ox-nav { top: 100%; max-height: calc(100vh - 4.5rem); height: auto; }
    .ox-header__row { height: 4.5rem; gap: 0; }
    .ox-container { padding: 0 1.25rem; }
    .ox-utility { gap: 0.35rem; }
    .ox-btn--dark { padding: 0.5rem 1.85rem; }
    .ox-lang-switcher__trigger, .ox-icon-btn { padding: 0.4rem 0.6rem; }
    [data-font-switcher] .ox-lang-switcher__trigger { padding: 0.4rem 0.6rem; }
    .ox-hero { padding: 3rem 0 3.5rem; }
    .ox-hero__heading { font-size: 2.1rem; }
    .ox-hero__stores { flex-direction: row; flex-wrap: wrap; align-items: stretch; }
    .ox-footer__top { grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; }
    .ox-footer__brand-col { grid-column: 1 / -1; }
    .ox-footer__bottom-row { flex-direction: column; }
    .ox-goal-cards { grid-template-columns: 1fr; }
    .ox-license-card__grid { grid-template-columns: 1fr; }
    .ox-requisites-row { grid-template-columns: 1fr; gap: 0.25rem; }
    .ox-requisites-row__value { text-align: left; }
    .ox-news-featured { grid-template-columns: 1fr; }
    .ox-news-featured__media { min-height: 10rem; }
    .ox-news-grid { grid-template-columns: 1fr; }
    .ox-inv-filters { justify-content: flex-start; }
    .ox-inv-table { display: block; overflow-x: auto; }
    .ox-inv-table td:first-child { padding-right: 0.75rem; }
    .ox-inv-cta { flex-direction: column; align-items: flex-start; }
    .ox-contacts__grid { grid-template-columns: 1fr; }
    .ox-contact-panel__form .ox-contact-form-row { grid-template-columns: 1fr; }
    .ox-tariff-table th:first-child, .ox-tariff-table td:first-child { display: none; }
    .ox-service-cards { grid-template-columns: 1fr; }
    .ox-tender-table { display: block; overflow-x: auto; }
    .ox-req-cards { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .ox-brand { font-size: 1.125rem; }
    .ox-hero__heading { font-size: 1.75rem; }
    .ox-hero__subtext { font-size: 1rem; }
    .ox-footer { padding: 3rem 0 1.5rem; }
}

@media (max-width: 650px) {
    .ox-header__row { height: auto; padding: 0.75rem 1rem; flex-direction: column; gap: 0.75rem; }
    .ox-header__top { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem; width: 100%; }
    .ox-brand { padding-left: 0; flex: 0 1 auto; min-width: 0; order: 1; }
    .ox-brand__mark { height: clamp(1.1rem, 4.5vw, 1.5rem); }
    .ox-utility { order: 2; flex-basis: auto; margin-left: auto; gap: clamp(0.25rem, 1.5vw, 0.4rem); }
    .ox-select-pill { padding: clamp(0.2rem, 1vw, 0.3rem) clamp(0.4rem, 2vw, 0.55rem); font-size: clamp(0.7rem, 2.2vw, 0.75rem); }
    .ox-icon-btn { width: clamp(1.6rem, 6vw, 1.9rem); height: clamp(1.6rem, 6vw, 1.9rem); }
    .ox-theme-toggle-btn { display: none; }
    .ox-hamburger { order: 3; width: 2.4rem; height: 2.4rem; }
    .ox-portal-btn { order: 4; width: auto; margin: 0; }
    .ox-btn--dark__label { display: inline; }
}

@media (max-width: 410px) {
    .ox-header__row { padding: 0.6rem 0.85rem; }
    .ox-utility { gap: 0.25rem; }
}
