/* Shared by all four home pages. Keep the opening view within the visible
   viewport, including mobile browser chrome, without clipping enlarged text. */
body.gm-modern.gm-home {
  --gm-home-viewport: 100vh;
  --gm-home-vh: 1vh;
  --gm-home-header: 120px;
  --gm-home-gap: clamp(10px, calc(var(--gm-home-vh) * 2), 22px);
}

@supports (height: 100dvh) {
  body.gm-modern.gm-home {
    --gm-home-viewport: 100dvh;
    --gm-home-vh: 1dvh;
  }
}

/* The navigation overlays the photo: its space belongs inside the hero. */
html body.gm-modern.gm-home .page {
  padding-top: 0 !important;
}

body.gm-modern.gm-home .swiper-form-wrap,
body.gm-modern.gm-home .swiper-form-wrap .swiper-container,
body.gm-modern.gm-home .swiper-form-wrap .swiper-wrapper,
body.gm-modern.gm-home .swiper-form-wrap .swiper-slide {
  box-sizing: border-box;
  width: 100% !important;
  height: auto !important;
  min-height: var(--gm-home-viewport) !important;
  max-height: none !important;
  margin: 0 !important;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-container,
body.gm-modern.gm-home .swiper-form-wrap .swiper-wrapper {
  display: block !important;
  padding: 0 !important;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: calc(var(--gm-home-header) + env(safe-area-inset-top, 0px))
    max(clamp(16px, 3vw, 48px), env(safe-area-inset-right, 0px))
    max(clamp(20px, calc(var(--gm-home-vh) * 5), 56px), env(safe-area-inset-bottom, 0px))
    max(clamp(16px, 3vw, 48px), env(safe-area-inset-left, 0px)) !important;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption {
  position: relative;
  top: auto !important;
  width: 100% !important;
  max-width: 1040px !important;
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 auto;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* Release the old Bootstrap column, which forced long translations to wrap
   even when there was room for them beside the title. */
body.gm-modern.gm-home .swiper-slide-caption .container,
body.gm-modern.gm-home .swiper-slide-caption .row,
body.gm-modern.gm-home .swiper-slide-caption [class*="col-"] {
  flex: 0 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h6 {
  min-height: 30px;
  max-width: 100%;
  margin: 0 !important;
  padding: 7px 16px;
  font-size: 11px;
  line-height: 1.35;
  white-space: normal;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h1 {
  margin: var(--gm-home-gap) 0 0 !important;
  font-size: 14px;
  line-height: 1.2 !important;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2 {
  max-width: 100% !important;
  margin: var(--gm-home-gap) auto 0 !important;
  padding: 10px 20px 14px !important;
  font-size: clamp(32px, min(5.2vw, calc(var(--gm-home-vh) * 8)), 72px) !important;
  line-height: 1.16 !important;
  overflow-wrap: break-word;
  text-wrap: balance;
}

body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2::after {
  width: 80px !important;
  height: 4px !important;
  margin-top: 10px !important;
}

body.gm-modern.gm-home .swiper-form-wrap .gm-hero-copy {
  max-width: 660px !important;
  margin: var(--gm-home-gap) auto 0 !important;
  font-size: clamp(16px, min(1.8vw, calc(var(--gm-home-vh) * 3)), 22px) !important;
  line-height: 1.4 !important;
  text-wrap: pretty;
}

body.gm-modern.gm-home .swiper-form-wrap .gm-hero-actions {
  flex-wrap: wrap;
  gap: 10px;
  margin-top: var(--gm-home-gap) !important;
}

body.gm-modern.gm-home .swiper-form-wrap .gm-hero-actions a {
  min-width: 0;
  min-height: 48px;
  max-width: 100%;
  padding: 10px 26px;
  line-height: 1.3;
}

body.gm-modern.gm-home #prenota {
  scroll-margin-top: calc(var(--gm-home-header) + env(safe-area-inset-top, 0px));
}

/* Keep the menu and its scrollable contents clear of notches and browser bars. */
@media (max-width: 1199.98px) {
  body.gm-modern.gm-home {
    --gm-home-header: 96px;
  }

  body.gm-modern.gm-home .rd-navbar-fixed .rd-navbar-panel {
    top: calc(8px + env(safe-area-inset-top, 0px)) !important;
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    /* Resize with the hero immediately when the device rotates. */
    transition: background-color .2s ease, box-shadow .2s ease !important;
  }

  body.gm-modern.gm-home .rd-navbar-fixed .rd-navbar-nav-wrap {
    top: calc(86px + env(safe-area-inset-top, 0px)) !important;
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    max-height: calc(var(--gm-home-viewport) - 100px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    overscroll-behavior: contain;
  }
}

@media (max-width: 767px) {
  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2 {
    padding: 9px 13px 12px !important;
    font-size: clamp(30px, min(8.8vw, calc(var(--gm-home-vh) * 7.2)), 52px) !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-copy {
    max-width: 520px !important;
    font-size: 16px !important;
  }
}

@media (max-width: 479px) {
  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-actions a {
    padding: 10px 8px;
    font-size: 11px;
    letter-spacing: .04em;
  }
}

@media (max-width: 420px) {
  body.gm-modern.gm-home {
    --gm-home-header: 84px;
  }

  body.gm-modern.gm-home .rd-navbar-fixed .rd-navbar-panel {
    top: calc(6px + env(safe-area-inset-top, 0px)) !important;
  }

  body.gm-modern.gm-home .rd-navbar-fixed .rd-navbar-nav-wrap {
    top: calc(76px + env(safe-area-inset-top, 0px)) !important;
    max-height: calc(var(--gm-home-viewport) - 90px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Short windows and landscape phones need less vertical spacing, while
   retaining readable copy and touch targets at least 44px high. */
@media (max-height: 500px) {
  body.gm-modern.gm-home {
    --gm-home-gap: 8px;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide {
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h6 {
    min-height: 24px;
    padding: 4px 12px;
    font-size: 10px;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h1 {
    font-size: 11px;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2 {
    padding: 6px 12px 8px !important;
    font-size: clamp(28px, calc(var(--gm-home-vh) * 7.5), 36px) !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2::after {
    width: 56px !important;
    height: 3px !important;
    margin-top: 6px !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-copy {
    font-size: 14px !important;
    line-height: 1.3 !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-actions a {
    min-height: 44px;
    padding: 8px 18px;
    font-size: 11px;
  }
}

@media (max-width: 1199.98px) and (max-height: 500px) {
  body.gm-modern.gm-home {
    --gm-home-header: 72px;
  }

  body.gm-modern.gm-home .rd-navbar-fixed .rd-navbar-panel {
    top: calc(6px + env(safe-area-inset-top, 0px)) !important;
    height: 52px !important;
    min-height: 52px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  body.gm-modern.gm-home .rd-navbar-fixed .rd-navbar-nav-wrap {
    top: calc(66px + env(safe-area-inset-top, 0px)) !important;
    max-height: calc(var(--gm-home-viewport) - 78px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Browser controls can leave less than 300px on a landscape phone. Keep the
   badge and brand on one row and retain both actions with 44px touch targets. */
@media (min-width: 480px) and (max-height: 320px) {
  body.gm-modern.gm-home {
    --gm-home-gap: 4px;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide {
    padding-bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
  }

  body.gm-modern.gm-home .swiper-slide-caption [class*="col-"] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 4px 14px;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h6 {
    justify-self: end;
    min-height: 22px;
    padding: 3px 12px;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h1 {
    justify-self: start;
    margin: 0 !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2,
  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-copy,
  body.gm-modern.gm-home .swiper-form-wrap .gm-hero-actions {
    grid-column: 1 / -1;
    margin-top: 0 !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2 {
    justify-self: center;
    padding: 4px 12px 6px !important;
    font-size: 26px !important;
  }

  body.gm-modern.gm-home .swiper-form-wrap .swiper-slide-caption h2::after {
    margin-top: 4px !important;
  }
}

@media (min-width: 480px) and (max-width: 1199.98px) and (max-height: 320px) {
  body.gm-modern.gm-home {
    --gm-home-header: 68px;
  }
}