:root {
  --grenze-header-height: 9rem;
  --grenze-line: rgba(18, 63, 66, 0.15);
  --grenze-radius: 2px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
body.admin-bar .grenze-header { top: 32px; }

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid #b9873d;
  outline-offset: 3px;
}

.screen-reader-text:focus {
  clip: auto !important;
  clip-path: none;
  width: auto;
  height: auto;
  padding: .75rem 1rem;
  background: #fff;
  color: #123f42;
  z-index: 100000;
}

.grenze-header {
  position: relative;
  z-index: 100;
  padding: 0 !important;
  border-bottom: 1px solid var(--grenze-line);
}

.grenze-header-top {
  min-height: 148px;
  padding: .75rem clamp(1.25rem, 4vw, 2.5rem);
}

.grenze-logo img {
  display: block;
  width: 132px;
  height: 132px;
  object-fit: contain;
}

.grenze-header-actions { gap: .65rem; }
.grenze-header-actions .wp-block-button__link { min-width: 148px; text-align: center; }

.grenze-nav-row {
  min-height: 54px;
  padding: .4rem clamp(1.25rem, 4vw, 2.5rem);
  border-top: 1px solid rgba(18, 63, 66, .08);
}

.grenze-nav-row .wp-block-navigation-item__content { padding: .7rem .2rem; }
.grenze-nav-row .wp-block-navigation-item__content:hover { text-decoration: none; }

.grenze-kicker {
  margin-bottom: .75rem;
  color: #b9873d;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.grenze-hero {
  min-height: min(78vh, 780px);
  padding: clamp(3rem, 9vw, 8rem) clamp(1.25rem, 5vw, 4rem) !important;
}

.grenze-hero .wp-block-cover__inner-container { width: min(1240px, 100%); }
.grenze-hero-copy { max-width: 760px; margin-left: 0 !important; }
.grenze-hero h1 { max-width: 13ch; margin: 0; font-size: clamp(3rem, 7vw, 6.75rem); color: #fff; }
.grenze-hero .grenze-subline { max-width: 690px; margin-top: 1.4rem; font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.55; }

.grenze-booking-wrap {
  position: relative;
  z-index: 5;
  margin-top: -3.25rem !important;
  padding: 0 clamp(1.25rem, 4vw, 2.5rem) !important;
}

.grenze-booking-panel {
  width: min(1180px, 100%);
  margin-inline: auto;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #fff;
  border-top: 4px solid #b9873d;
  box-shadow: 0 18px 50px rgba(20, 40, 38, .12);
}

.grenze-fallback-booking,
.mphb_sc_search-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr)) auto;
  gap: .8rem;
  align-items: end;
}

.grenze-fallback-booking p,
.mphb_sc_search-form p { margin: 0; }
.mphb-required-fields-tip { display: none; }

.grenze-fallback-booking label,
.mphb_sc_search-form label {
  display: block;
  margin-bottom: .35rem;
  color: #123f42;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.grenze-fallback-booking input,
.grenze-fallback-booking select,
.mphb_sc_search-form input[type="text"],
.mphb_sc_search-form select {
  width: 100%;
  min-height: 48px;
  padding: .6rem .75rem;
  border: 1px solid rgba(18, 63, 66, .3);
  border-radius: 0;
  background: #fbf8f2;
  color: #202725;
  font: inherit;
}

.grenze-fallback-booking button,
.mphb_sc_search-form input[type="submit"] {
  min-height: 48px;
  padding: .7rem 1.25rem;
  border: 0;
  border-radius: 2px;
  background: #123f42;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}

.grenze-section { padding-top: clamp(4rem, 8vw, 7rem) !important; padding-bottom: clamp(4rem, 8vw, 7rem) !important; }
.grenze-section-compact { padding-top: clamp(3rem, 6vw, 5rem) !important; padding-bottom: clamp(3rem, 6vw, 5rem) !important; }
.grenze-section h2 { max-width: 15ch; font-size: clamp(2.25rem, 5vw, 4.25rem); }
.grenze-section h3 { font-size: clamp(1.55rem, 3vw, 2.25rem); }

.grenze-split { gap: clamp(2rem, 6vw, 6rem) !important; align-items: center !important; }
.grenze-split .wp-block-column { min-width: 0; }
.grenze-split figure { overflow: hidden; }
.grenze-split img { width: 100%; min-height: 470px; object-fit: cover; }

.grenze-feature-list { padding: 0; list-style: none; }
.grenze-feature-list li { position: relative; padding: .45rem 0 .45rem 1.5rem; }
.grenze-feature-list li::before { content: ""; position: absolute; top: 1.05rem; left: 0; width: 8px; height: 8px; background: #b9873d; border-radius: 50%; }

.grenze-room-grid .wp-block-column,
.grenze-card {
  overflow: hidden;
  background: #fff;
  border-bottom: 3px solid #b9873d;
}

.grenze-room-grid figure { margin: 0; }
.grenze-room-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.grenze-card-body { padding: 1.5rem; }
.grenze-card-body h3 { margin-top: 0; }
.grenze-event-card__body { padding: 1.5rem; }
.grenze-event-card__body > :first-child { margin-top: 0 !important; }
.grenze-event-card__body > :last-child { margin-bottom: 0 !important; }
.grenze-price { color: #b9873d; font-weight: 800; }

.grenze-event-grid .wp-block-post-template { gap: 1.5rem; }
.grenze-event-grid .wp-block-post { overflow: hidden; background: #fff; border-bottom: 3px solid #b9873d; }
.grenze-event-grid .wp-block-post-featured-image { margin: 0; }
.grenze-event-grid .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; }
.grenze-event-card-content { padding: 1.35rem; }
.grenze-event-date { margin-bottom: .4rem; color: #b9873d; font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.grenze-breakfast .wp-block-cover__inner-container { width: min(1180px, 100%); }
.grenze-glass-panel { max-width: 620px; margin-left: 0 !important; padding: clamp(1.5rem, 4vw, 3rem); background: rgba(251, 248, 242, .94); }

.grenze-cta { padding: clamp(3rem, 7vw, 6rem) clamp(1.25rem, 4vw, 2.5rem) !important; }
.grenze-cta h2 { color: #fff; }

.grenze-footer { padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 2.5rem) 2rem !important; }
.grenze-footer-logo img { width: 140px; height: 140px; object-fit: contain; }
.grenze-footer a { color: inherit; }
.grenze-footer .is-style-none { margin-left: 0; padding-left: 0; list-style: none; }
.grenze-footer .is-style-none li { margin-bottom: .35rem; }
.grenze-footer-bottom { padding-top: 1.5rem; border-top: 1px solid rgba(18, 63, 66, .18); }

.grenze-page-hero { padding-top: clamp(3rem, 7vw, 6rem) !important; padding-bottom: clamp(3rem, 7vw, 6rem) !important; }
.grenze-page-hero .wp-block-post-title { max-width: 15ch; }
.grenze-content { padding-top: clamp(2.5rem, 6vw, 5rem) !important; padding-bottom: clamp(3rem, 7vw, 6rem) !important; }

.grenze-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1.5rem; }
.grenze-meta-grid dt { color: #123f42; font-weight: 800; }
.grenze-meta-grid dd { margin: 0; }

/* MotoPress Hotel Booking: keep functionality, align appearance. */
.mphb-room-type,
.mphb_sc_rooms-wrapper .mphb-room-type { margin-bottom: 3rem; }
.mphb-room-type-title a { text-decoration: none; }
.mphb-loop-room-type-attributes { margin: 1rem 0; }
.mphb-view-details-button,
.mphb-book-button { display: inline-block; padding: .75rem 1rem; background: #123f42; color: #fff !important; text-decoration: none; }
.mphb-book-button { background: #b9873d; }

@media (max-width: 980px) {
  .grenze-header-top { min-height: 116px; }
  .grenze-logo img { width: 100px; height: 100px; }
  .grenze-header-actions .is-style-outline { display: none; }
  .grenze-nav-row { position: relative; z-index: 110; min-height: 48px; justify-content: flex-end !important; overflow: visible; }
  .grenze-nav-row .wp-block-navigation { position: relative; width: 100%; justify-content: flex-end; }
  .grenze-nav-row .wp-block-navigation__responsive-container-open {
    width: 44px;
    height: 44px;
    padding: 0;
    background-color: transparent;
    background-image: linear-gradient(#123f42, #123f42), linear-gradient(#123f42, #123f42), linear-gradient(#123f42, #123f42);
    background-repeat: no-repeat;
    background-position: center 13px, center 21px, center 29px;
    background-size: 24px 2px, 24px 2px, 24px 2px;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container-open svg { display: none; }

  /* The core Navigation block normally opens as a full-screen modal. For this
     header it opens as a dropdown directly below the sand navigation row. */
  body.has-modal-open { overflow-y: auto; }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open {
    position: absolute !important;
    top: calc(100% + .15rem) !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 8.5rem) !important;
    padding: .35rem .8rem .65rem !important;
    overflow-y: auto !important;
    transform: none !important;
    background: #fbf8f2 !important;
    border-top: 3px solid #b9873d;
    border-bottom: 1px solid rgba(18, 63, 66, .16);
    border-radius: 0 0 4px 4px;
    box-shadow: 0 14px 30px rgba(20, 40, 38, .18);
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
    display: block;
    width: 100%;
    min-height: 0;
    margin: 0;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    top: .38rem;
    right: .5rem;
    width: 2.35rem;
    height: 2.35rem;
    padding: .45rem;
    color: #123f42;
    background: #f2eadc;
    border-radius: 50%;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    width: 100%;
    margin: 0 !important;
    padding-top: 0 !important;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    width: 100%;
    margin: 0;
    gap: 0;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    width: 100%;
    border-bottom: 1px solid rgba(18, 63, 66, .12);
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    display: block;
    width: 100%;
    padding: .72rem .7rem;
    line-height: 1.25;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:first-child .wp-block-navigation-item__content {
    padding-right: 3.2rem;
  }
  .grenze-nav-row .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    position: static;
    width: 100%;
    margin: 0;
    padding: 0 0 .5rem .85rem;
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  .grenze-fallback-booking,
  .mphb_sc_search-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grenze-fallback-booking button,
  .mphb_sc_search-submit-button-wrapper { grid-column: 1 / -1; }
}

@media (max-width: 781px) {
  body.admin-bar .grenze-header { top: 46px; }
  .grenze-split { gap: 2rem !important; }
  .grenze-split img { min-height: 340px; }
  .grenze-booking-wrap { margin-top: 0 !important; padding: 0 !important; }
  .grenze-booking-panel { box-shadow: none; }
  .grenze-room-grid { gap: 1.25rem !important; }
}

@media (max-width: 560px) {
  .grenze-header-actions .wp-block-button__link { min-width: auto; padding: .72rem .9rem; font-size: .75rem; }
  .grenze-hero { min-height: 68vh; }
  .grenze-hero h1 { font-size: clamp(2.65rem, 13vw, 4rem); }
  .grenze-fallback-booking,
  .mphb_sc_search-form { grid-template-columns: 1fr; }
  .grenze-fallback-booking button,
  .mphb_sc_search-submit-button-wrapper { grid-column: auto; }
  .grenze-meta-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}
