/* Desktop reference: 1440 */
@media (min-width: 1440px) {
  .ag-hero {
    padding-top: 72px;
  }
}

/* Tablet: 768 */
@media (max-width: 1024px) {
  :root {
    --ag-section-y: 72px;
  }

  .ag-nav {
    display: none;
  }

  .ag-nav-toggle {
    display: grid;
  }

  .ag-header.is-open .ag-nav {
    display: flex;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    max-height: min(70vh, 520px);
    overflow-x: hidden;
    overflow-y: auto;
    background: #fff;
    border-bottom: 1px solid var(--ag-border);
    box-shadow: var(--ag-shadow);
    padding: 12px 24px 20px;
  }

  .ag-header.is-open .ag-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }

  .ag-header.is-open .ag-nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 0;
    border-bottom: 1px solid var(--ag-border);
    box-shadow: none;
  }

  .ag-header.is-open .ag-nav__list > .menu-item-has-children > a::after,
  .ag-header.is-open .ag-nav .sub-menu .menu-item-has-children > a::after {
    margin-top: -0.15em;
    transform: rotate(45deg);
  }

  .ag-header.is-open .ag-nav .sub-menu,
  .ag-header.is-open .ag-nav .sub-menu .sub-menu {
    position: static;
    top: auto;
    right: auto;
    left: auto;
    min-width: 0;
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-inline-start: 2px solid #93c5fd;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    background: transparent;
    z-index: auto;
  }

  .ag-header.is-open .ag-nav .sub-menu .sub-menu {
    margin-inline-start: 10px;
    border-inline-start-color: #bfdbfe;
  }

  .ag-header.is-open .ag-nav .sub-menu .sub-menu .sub-menu {
    margin-inline-start: 10px;
    border-inline-start-color: #dbeafe;
  }

  .ag-header.is-open .ag-nav .sub-menu .menu-item-has-children > a::after {
    transform: rotate(45deg);
  }

  .ag-header.is-open .ag-nav .sub-menu li + li {
    border-top: 1px dashed #cbd5e1;
  }

  .ag-header.is-open .ag-nav .sub-menu a {
    display: flex;
    padding: 10px 12px;
    font-size: 14px;
    border-bottom: 0;
    background: transparent;
  }

  .ag-header.is-open .ag-nav .sub-menu .sub-menu a {
    padding-inline-start: 16px;
    font-size: 13px;
  }

  .ag-header.is-open .ag-nav .sub-menu .sub-menu .sub-menu a {
    padding-inline-start: 20px;
    font-size: 12.5px;
  }

  .ag-hero__grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .ag-hero__content {
    order: -1;
  }

  .ag-hero__media-wrap {
    order: 0;
  }

  .ag-hero__title {
    max-width: none;
  }

  .ag-search__card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-search__submit {
    grid-column: 1 / -1;
    width: 100%;
  }

  .ag-tours__grid,
  .ag-why__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-destinations__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ag-promo__card {
    min-height: 260px;
    padding: 32px 28px;
  }

  .ag-hotels__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-hotel-gallery {
    min-height: 0;
  }

  .ag-hotel-gallery__item--main {
    height: 320px;
  }

  .ag-hotel-gallery__item:not(.ag-hotel-gallery__item--main) {
    height: 152px;
  }

  .ag-hotel-single__intro {
    display: block;
  }

  .ag-hotel-facilities__list {
    gap: 12px 24px;
  }

  .ag-blog__grid,
  .ag-reviews__grid,
  .ag-blog-archive__grid--cols-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-blog-archive--with-aside .ag-blog-archive__layout {
    grid-template-columns: 240px minmax(0, 1fr);
  }

  .ag-hotel-archive__layout {
    grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
    gap: 20px;
  }

  .ag-hotel-archive__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-hotel-archive__title,
  .ag-hotel-archive__count {
    font-size: 20px;
  }

  .ag-visas__grid--cols-3,
  .ag-visas__grid--cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-instagram__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ag-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile: 390 */
@media (max-width: 767px) {
  :root {
    --ag-section-y: 56px;
    --ag-header-h: 68px;
    --ag-topbar-h: 38px;
  }

  .ag-container,
  .ag-topbar__inner,
  .ag-header__inner {
    width: min(100% - 32px, var(--ag-container));
  }

  .ag-topbar__item {
    font-size: 11px;
    gap: 6px;
  }

  .ag-topbar__item span {
    max-width: 46vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .ag-logo__text {
    font-size: 16px;
  }

  .ag-header .ag-logo__img {
    height: 44px;
    max-width: min(180px, 52vw);
  }

  .ag-hero {
    padding: 36px 0 72px;
  }

  .ag-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .ag-hero__actions .ag-btn {
    width: 100%;
  }

  .ag-search {
    margin-top: -40px;
  }

  .ag-search__card {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .ag-section-head {
    margin-bottom: 22px;
  }

  .ag-section-head h2 {
    font-size: 22px;
  }

  .ag-tours__grid,
  .ag-why__grid,
  .ag-blog__grid,
  .ag-reviews__grid,
  .ag-hotels__grid,
  .ag-destinations__grid,
  .ag-visas__grid--cols-2,
  .ag-visas__grid--cols-3,
  .ag-visas__grid--cols-4,
  .ag-blog-archive__grid--cols-2,
  .ag-blog-archive__grid--cols-3 {
    grid-template-columns: 1fr;
  }

  .ag-blog-archive--with-aside .ag-blog-archive__layout {
    grid-template-columns: 1fr;
  }

  .ag-blog-archive__title {
    font-size: 26px;
  }

  .ag-blog-archive {
    padding: 28px 0 48px;
  }

  .ag-destinations__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-visas__grid--cols-2,
  .ag-visas__grid--cols-3,
  .ag-visas__grid--cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-visa-single__title {
    font-size: 20px;
  }

  .ag-visa-single__header {
    flex-direction: column;
    align-items: stretch;
  }

  .ag-visa-single__actions {
    width: 100%;
  }

  .ag-visa-single__consult {
    flex: 1;
  }

  .ag-visa-contact-float {
    inset-inline: 12px;
    bottom: 12px;
    width: auto;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
  }

  .ag-visa-contact-float__text {
    font-size: 12px;
    flex: 1;
    min-width: 0;
  }

  .ag-visa-contact-float__text span {
    display: none;
  }

  .ag-visa-contact-float__btn {
    min-height: 40px;
    padding-inline: 12px;
    font-size: 13px;
    flex-shrink: 0;
  }

  .ag-instagram__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ag-footer__grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .ag-footer__bottom-inner {
    flex-direction: column;
    text-align: center;
  }

  .ag-footer__bottom-inner > p:first-child,
  .ag-footer__legal {
    flex: 0 1 auto;
  }

  .ag-footer__legal {
    justify-content: center;
  }

  .ag-footer__credit {
    white-space: normal;
  }

  .ag-promo__card {
    min-height: 240px;
    padding: 28px 20px;
    justify-content: center;
  }

  .ag-promo__card--has-image::after {
    background: linear-gradient(
      to bottom,
      rgba(237, 244, 252, 0.2) 0%,
      rgba(237, 244, 252, 0.75) 35%,
      #edf4fc 70%,
      #edf4fc 100%
    );
  }

  .ag-promo__card--has-image::before {
    background-position: center top;
  }

  .ag-promo__content {
    width: 100%;
  }

  .ag-promo__title {
    font-size: 24px;
  }

  .ag-hotel-gallery__row {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    grid-template-columns: none;
    padding: 20px 0 16px;
    scrollbar-width: none;
  }

  .ag-hotel-gallery__item,
  .ag-hotel-gallery__item--main {
    flex: 0 0 256px;
    width: 256px;
    min-width: 256px;
    height: 181px;
    grid-area: auto;
  }

  .ag-hotel-gallery__more {
    left: 16px;
    bottom: 28px;
  }

  .ag-hotel-heading__title {
    font-size: 18px;
  }

  .ag-hotel-facilities__list {
    gap: 10px 16px;
    padding: 8px 0;
  }

  .ag-hotel-contact--float {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: none;
    min-width: 0;
    border-radius: 8px 8px 0 0;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .ag-hotel-contact--float .ag-hotel-contact__btn {
    width: auto;
    flex-shrink: 0;
  }

  .ag-hotel-single__intro {
    grid-template-columns: 1fr;
  }

  .ag-hotel-archive {
    padding: 16px 0 56px;
  }

  .ag-hotel-archive__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ag-hotel-archive__aside {
    display: none;
  }

  .ag-hotel-archive__mobile-filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .ag-hotel-archive__grid {
    grid-template-columns: 1fr;
  }

  .ag-hotel-archive__title,
  .ag-hotel-archive__count {
    font-size: 18px;
  }

  .ag-hotel-list-card__media {
    height: 190px;
  }

  .ag-hotel-filter-drawer:not([hidden]) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1200;
  }

  .ag-hotel-filter-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(17, 24, 39, 0.45);
  }

  .ag-hotel-filter-drawer__panel {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    width: min(100%, 360px);
    background: #fff;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.12);
  }

  .ag-hotel-filter-drawer__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--ag-border);
  }

  .ag-hotel-filter-drawer__close {
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    font-size: 28px;
    line-height: 1;
    color: #6b7280;
    cursor: pointer;
  }

  .ag-hotel-filter-drawer__body {
    flex: 1;
    overflow: auto;
    padding: 8px;
  }

  .ag-hotel-filter-drawer__body .ag-hotel-filter {
    position: static;
    max-height: none;
    border: 0;
    padding: 0;
  }
}