* {
  box-sizing:border-box
}
html,
body {
  margin:0;
  width:100%;
  height:100%;
  overflow:hidden
}
html {
  background:#2e0000
}
body {
  font-family:system-ui,
  -apple-system,
  BlinkMacSystemFont,
  "Segoe UI",
  sans-serif;
  color:#fff;
  overscroll-behavior:none
}
button,
input,
textarea {
  font:inherit
}
.page-shell {
  position:relative;
  width:100%;
  height:100vh;
  height:100dvh;
  overflow:hidden;
  opacity:1
}
.page-shell.is-leaving-left {
  animation:leaveLeft .24s ease forwards
}
.page-shell.is-leaving-right {
  animation:leaveRight .24s ease forwards
}
.page-shell.is-entering-left {
  animation:enterLeft .24s ease both
}
.page-shell.is-entering-right {
  animation:enterRight .24s ease both
}
@keyframes leaveLeft {
  to {
    transform:translateX(-22%);
    opacity:.15
  }
}
@keyframes leaveRight {
  to {
    transform:translateX(22%);
    opacity:.15
  }
}
@keyframes enterLeft {
  from {
    transform:translateX(-20%);
    opacity:.2
  }
}
@keyframes enterRight {
  from {
    transform:translateX(20%);
    opacity:.2
  }
}

.page-home {
  background:#111 url("../images/LandingLogo.jpg") center/auto 100dvh no-repeat fixed
}
.page-home .overlay {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:0
}
.page-flat {
  background:#2e0000
}
.page-flat a.Admin_Login_Link {
  color:#240000
}
.content {
  position:relative;
  z-index:1
}
.app-content {
  height:100%;
  padding:calc(.75rem + env(safe-area-inset-top)) .7rem calc(3.25rem + env(safe-area-inset-bottom));
  display:flex;
  align-items:center;
  justify-content:center
}
.container,
.screen-panel {
  width:min(100%,480px);
  max-height:80%;
  margin:auto
}
.landing-panel {
  height:100%;
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr);
  align-content:center;
  gap:.25rem;
  padding-top:2.8rem
}
.headline {
  margin:0;
  text-align:center;
  font-size:clamp(1.2rem,6vw,2.25rem);
  white-space:nowrap
}
.subline {
  margin:.15rem 0 .65rem;
  text-align:center;
  color:#e7f4fa
}
.scrollable {
  min-height:0;
  max-height:100%;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:.9rem;
  background:rgba(0,0,0,.28);
  text-align:left;
  scrollbar-width:thin
}
.content-entry+ .content-entry {
  border-top:1px solid rgba(255,255,255,.18);
  margin-top:1rem;
  padding-top:1rem
}
.content-entry h2,
.richtext h2,
.richtext h3 {
  margin-top:0
}
.richtext img {
  max-width:100%;
  height:auto
}
.richtext a {
  color:#fff;
  text-decoration:underline
}
.screen-panel {
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  padding-top:2.8rem
}
.screen-header {
  text-align:center;
  padding:.35rem .25rem .75rem
}
.screen-header h1 {
  margin:0 0 .25rem;
  font-size:clamp(1.55rem,7vw,2.5rem)
}
.screen-header p {
  margin:0;
  font-size:.9rem
}
.screen-scroll {
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:.25rem .15rem 1rem
}
.gallery-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.7rem
}
.gallery-card {
  min-width:0;
  background:rgba(255,255,255,.96);
  color:#17313c;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 4px 18px rgba(0,0,0,.12)
}
.gallery-card img {
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover
}
.gallery-card-body {
  padding:.6rem
}
.gallery-card h2 {
  font-size:.95rem;
  margin:0 0 .25rem
}
.gallery-card p {
  font-size:.8rem;
  margin:0;
  line-height:1.35
}
.empty-state {
  text-align:center;
  background:rgba(255,255,255,.16);
  padding:1rem;
  border-radius:12px;
  grid-column:1/-1
}
.carousel {
  margin-top:1.15rem
}
.carousel>h2 {
  margin:.2rem 0;
  font-size:1.2rem
}
.carousel>p {
  margin:.2rem 0 .55rem
}
.carousel-viewport {
  position:relative;
  overflow:hidden;
  border-radius:14px;
  background:rgba(0,0,0,.18)
}
.carousel-track {
  display:flex;
  transition:transform .35s ease
}
.carousel-slide {
  min-width:100%;
  margin:0
}
.carousel-slide img {
  display:block;
  width:100%;
  height:min(48vh,420px);
  object-fit:contain;
  background:rgba(0,0,0,.2)
}
.carousel-slide figcaption {
  text-align:center;
  padding:.45rem
}
.carousel-btn {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  border:0;
  border-radius:50%;
  background:rgba(0,0,0,.52);
  color:#fff;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer
}
.carousel-btn.prev {
  left:.4rem
}
.carousel-btn.next {
  right:.4rem
}
.contact-form {
  background:rgba(255,255,255,.97);
  color:#17313c;
  padding:.85rem;
  border-radius:14px;
  box-shadow:0 4px 20px rgba(0,0,0,.12)
}
.contact-form label {
  display:block;
  font-weight:650;
  margin-bottom:.65rem
}
.contact-form input,
.contact-form textarea {
  display:block;
  width:100%;
  margin-top:.25rem;
  border:1px solid #a8c4d0;
  border-radius:8px;
  padding:.68rem;
  background:#fff;
  color:#111
}
.contact-form textarea {
  resize:vertical;
  min-height:7rem
}
.optional {
  font-weight:400;
  color:#61717a
}
.turnstile-wrap {
  min-height:65px;
  overflow:hidden
}
.form-actions {
  display:flex;
  gap:.6rem;
  flex-wrap:wrap
}
.form-actions button,
.cookie-banner button,
.modal-footer button {
  border:0;
  border-radius:8px;
  padding:.7rem .9rem;
  background:#126b8e;
  color:#fff;
  font-weight:700;
  cursor:pointer
}
.form-actions button:disabled {
  opacity:.55;
  cursor:wait
}
.form-feedback {
  min-height:1.4rem;
  margin-top:.65rem;
  font-size:.9rem
}
.form-feedback.error {
  color:#a00000
}
.form-feedback.success {
  color:#08752f
}
.verification-row {
  margin-top:.45rem
}
.contact-details {
  padding:.8rem .3rem
}
.contact-details h2 {
  margin-bottom:.2rem
}
.contact-details p {
  margin-top:0
}
.site-footer {
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  bottom:0;
  padding:.55rem max(.75rem,env(safe-area-inset-right)) calc(.55rem + env(safe-area-inset-bottom));
  pointer-events:none
}
.policies {
  display:flex;
  justify-content:center;
  gap:1.25rem
}
.policies a {
  pointer-events:auto;
  color:#fff;
  text-decoration:none;
  font-size:.82rem;
  text-shadow:0 1px 4px rgba(0,0,0,.75)
}
.policies a.Admin_Login_Link {
  color:#240000
}
.desktop-nav {
  display:none
}
.modal-overlay {
  position:fixed;
  z-index:50;
  inset:0;
  background:rgba(0,0,0,.72);
  padding:1rem;
  align-items:center;
  justify-content:center
}
.modal-overlay:not([hidden]) {
  display:flex
}
.modal-box {
  width:min(100%,760px);
  max-height:min(88dvh,800px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  background:#fff;
  color:#1e2b31;
  border-radius:14px;
  overflow:hidden
}
.modal-header,
.modal-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.75rem 1rem;
  background:#f0f5f7
}
.modal-header h2 {
  margin:0;
  font-size:1.2rem
}
.modal-header button {
  border:0;
  background:transparent;
  font-size:1.8rem;
  cursor:pointer
}
.modal-body {
  overflow:auto;
  padding:1rem
}
.modal-footer {
  justify-content:flex-end
}
.cookie-banner {
  position:fixed;
  z-index:60;
  left:.65rem;
  right:.65rem;
  bottom:calc(2.8rem + env(safe-area-inset-bottom));
  max-width:760px;
  margin:auto;
  background:#fff;
  color:#17242a;
  border-radius:12px;
  padding:.8rem;
  box-shadow:0 8px 30px rgba(0,0,0,.3);
  align-items:center;
  gap:.75rem
}
.cookie-banner:not([hidden]) {
  display:flex
}
.cookie-banner p {
  margin:0;
  flex:1;
  font-size:.83rem
}
.cookie-banner a {
  color:#126b8e
}
.swipe-hint {
  display:none
}

@media (max-width:319px) {
  .app-content {
    padding-left:.38rem;
    padding-right:.38rem
  }
  .headline {
    font-size:1.08rem
  }
  .gallery-grid {
    gap:.4rem
  }
  .gallery-card-body {
    padding:.45rem
  }
  .contact-form {
    padding:.6rem
  }
  .cookie-banner {
    left:.3rem;
    right:.3rem;
    flex-direction:column;
    align-items:stretch
  }
}

@media (min-width:480px) {
  .app-content {
    padding-inline:1rem
  }
  .gallery-grid {
    gap:1rem
  }
  .gallery-card h2 {
    font-size:1.05rem
  }
  .gallery-card p {
    font-size:.9rem
  }
}

@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  body {
    overflow:hidden
  }
  .desktop-nav {
    position:absolute;
    z-index:10;
    top:0;
    left:0;
    right:0;
    display:flex;
    justify-content:center;
    gap:.4rem;
    padding:.65rem;
    background:rgba(0,0,0,.28);
    backdrop-filter:blur(7px)
  }
  .desktop-nav a {
    color:#fff;
    text-decoration:none;
    padding:.48rem .9rem;
    border-radius:8px
  }
  .desktop-nav a:hover,
  .desktop-nav a.active {
    background:rgba(255,255,255,.2)
  }
  .landing-panel,
  .screen-panel {
    padding-top:3.4rem
  }
  .gallery-grid {
    grid-template-columns:repeat(4,1fr)
  }
  .page-flat .screen-panel {
    width:min(100%,1100px)
  }
  .site-footer {
    padding-bottom:.75rem
  }
}

@media (prefers-reduced-motion:reduce) {
  .page-shell,
  .carousel-track {
    animation:none!important;
    transition:none!important
  }
}

/* Anpassungen September 2026 */
html,
body {
  min-height: 100%;
}

body.page-flat {
  background: #2e0000;
}

.page-flat .page-shell {
  background: #2e0000;
}

.page-flat .app-content,
.full-page-content {
  overflow: visible;
}

.page-flat .page-shell {
  height: auto;
  min-height: 100dvh;
  overflow: visible;
}

.page-flat {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
}

.home-content {
  overflow-y: auto;
}

.scrollable {
  height: min(500px, 55dvh);
  max-height: 500px;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.home-before-scroll,
.home-after-scroll {
  width: 100%;
}

.home-after-scroll {
  margin-top: 1.5rem;
}

.home-carousel {
  margin-bottom: 1rem;
}

.screen-panel {
  overflow: visible;
}

.gallery-screen,
.contact-screen {
  min-height: calc(100dvh - var(--footer-height, 0px));
}

.gallery-grid {
  overflow: visible;
}

.lightbox-trigger {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: zoom-in;
}

.lightbox-trigger img {
  display: block;
  width: 100%;
}

.lightbox[hidden] {
  display: none;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
  background: rgba(0, 0, 0, 0.88);
}

.lightbox img {
  display: block;
  max-width: 95vw;
  max-height: 90vh;
  max-height: 90dvh;
  object-fit: contain;
  box-shadow: 0 0 2rem rgba(0, 0, 0, 0.5);
}

.lightbox-close {
  position: fixed;
  top: max(0.75rem, env(safe-area-inset-top));
  right: max(0.75rem, env(safe-area-inset-right));
  z-index: 10001;
  width: 2.75rem;
  height: 2.75rem;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
}

body.lightbox-open {
  overflow: hidden;
}


@media (min-height: 768px) and (hover: none), (min-height: 768px) and (pointer: coarse) {
  .scrollable {
    height: 500px;
    max-height: 500px;
  }
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .scrollable {
    height: 75vh;
    max-height: 75vh;
  }
}

/* Strukturkorrekturen für frei ergänzbare Seiteninhalte */
.landing-panel {
  display: block;
  height: auto;
  min-height: 100%;
  padding-top: 2.8rem;
  padding-bottom: 1rem;
}

.landing-panel .subline {
  margin-bottom: 0.65rem;
}

.full-page-content {
  display: block;
  height: auto;
  min-height: 100dvh;
  padding-bottom: calc(4rem + env(safe-area-inset-bottom));
}

.page-flat .screen-panel {
  display: block;
  height: auto;
  min-height: 100%;
  max-height: none;
  padding-top: 2.8rem;
}

.page-flat .contact-form,
.page-flat .contact-details,
.page-flat .gallery-grid,
.page-flat .carousel {
  position: relative;
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .landing-panel,
  .page-flat .screen-panel {
    padding-top: 3.4rem;
  }
}

/* Navigation, Footer und Viewport-Korrekturen – September 2026 */
html,
body {
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

body {
  padding-top: calc(3.65rem + env(safe-area-inset-top));
}

.page-shell {
  width: 100%;
  height: auto;
  min-height: calc(100dvh - 3.65rem - env(safe-area-inset-top));
  overflow: visible;
  display: flex;
  flex-direction: column;
}

.desktop-nav {
  position: fixed;
  z-index: 40;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: 0.35rem;
  padding: calc(0.55rem + env(safe-area-inset-top)) 0.55rem 0.55rem;
  background: rgba(0, 0, 0, 0.72);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}

.desktop-nav a {
  color: #fff;
  text-decoration: none;
  padding: 0.48rem 0.8rem;
  border-radius: 8px;
  line-height: 1.2;
  white-space: nowrap;
}

.desktop-nav a:hover,
.desktop-nav a:focus-visible,
.desktop-nav a.active {
  background: rgba(255, 255, 255, 0.2);
}

.app-content,
.full-page-content,
.home-content {
  width: 100%;
  height: auto;
  min-height: 0;
  overflow: visible;
  padding-top: 0.75rem;
  flex: 1 0 auto;
}

.container,
.screen-panel {
  max-height: none;
}

.landing-panel,
.page-flat .screen-panel {
  padding-top: 0.5rem;
}

.site-footer,
body.page-home .site-footer {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  margin-top: 1.5rem;
  padding: 0.8rem max(0.75rem, env(safe-area-inset-right)) calc(0.8rem + env(safe-area-inset-bottom));
  pointer-events: auto;
  flex: 0 0 auto;
  background: rgba(0, 0, 0, 0.2);
}

.page-home {
  overflow-x: hidden;
  overflow-y: auto;
}

.page-home .page-shell {
  min-height: calc(100dvh - 3.65rem - env(safe-area-inset-top));
}

.page-home .home-content {
  overflow: visible;
}

.lightbox {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
  background: rgba(0, 0, 0, 0.9);
  overflow: hidden;
}

.lightbox-stage {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 0;
}

.lightbox-stage img,
.lightbox img {
  display: block;
  width: auto;
  height: auto;
  max-width: 94vw;
  max-height: 88vh;
  max-height: 88dvh;
  margin: auto;
  object-fit: contain;
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  body {
    overflow-x: hidden;
    overflow-y: auto;
  }

  .desktop-nav {
    position: fixed;
    padding-top: 0.65rem;
  }

  .landing-panel,
  .page-flat .screen-panel {
    padding-top: 0.5rem;
  }
}


/* Korrektur: normales Seiten-Scrolling + wirklich viewport-fixe Navigation */
html {
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

body,
body.page-home,
body.page-flat {
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
}

/* Kein transformierter containing block im Ruhezustand.
   Transform wird ausschließlich von den Swipe-Animationsklassen gesetzt. */
.page-shell {
  transform: none;
  height: auto;
  min-height: calc(100dvh - 3.65rem - env(safe-area-inset-top));
  overflow: visible;
}

.desktop-nav {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000;
  margin: 0;
}

.page-home .home-content,
.page-home .landing-panel {
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
}

.home-main-content {
  width: 100%;
  height: auto;
  max-height: none;
  overflow: visible;
  padding: 0.9rem;
  background: rgba(0, 0, 0, 0.28);
  text-align: left;
}

.home-before-scroll,
.home-after-content {
  width: 100%;
}

.home-after-content {
  margin-top: 1.5rem;
}

/* Die frühere interne Scrollbox wird auf der Startseite nicht mehr verwendet. */
.page-home .scrollable {
  height: auto;
  max-height: none;
  overflow: visible;
}


/* Newsletter + Kundenbereich */
.special-offer-btn,.primary-action{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:10px;padding:.7rem 1rem;background:#2596be;color:#fff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}.special-offer-btn{margin:.2rem auto 1rem}.special-offer-btn:hover,.primary-action:hover{filter:brightness(1.08)}.newsletter-modal{width:min(100%,620px)}.contact-choice{display:flex;gap:1rem;flex-wrap:wrap;border:0;padding:0;margin:0 0 .9rem}.contact-choice legend{width:100%;font-weight:700}.contact-choice label{display:flex;align-items:center;gap:.35rem}.user-panel{width:min(100%,1000px);margin-inline:auto}.user-auth-grid,.user-tile-grid{display:grid;grid-template-columns:1fr;gap:1rem}.auth-narrow{max-width:560px;margin-inline:auto}.user-tile{display:flex;min-height:150px;flex-direction:column;justify-content:center;gap:.45rem;padding:1.2rem;border-radius:14px;background:rgba(255,255,255,.94);color:#16262d;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.22)}.user-tile strong{font-size:1.3rem}.user-tile span{opacity:.75}.profile-grid{display:grid;grid-template-columns:1fr;gap:.8rem}.password-field{display:grid;grid-template-columns:1fr auto;align-items:stretch}.password-field input{border-radius:8px 0 0 8px}.password-toggle{min-width:44px;border:1px solid #a8b3b8;border-left:0;border-radius:0 8px 8px 0;background:#eef3f5;cursor:pointer}.check-row{display:flex!important;flex-direction:row!important;align-items:center;gap:.5rem;margin:.8rem 0}.check-row input{width:auto!important}.action-code-card{max-width:560px;margin:1rem auto;padding:1.4rem;text-align:center;border-radius:14px;background:rgba(255,255,255,.95);color:#17242a}.action-code-card strong{display:block;margin:.8rem 0;font-size:clamp(1.8rem,8vw,3rem);letter-spacing:.08em}.inline-action{margin-top:1rem}.profile-warning{padding:1rem;border-radius:10px;background:#fff3cd;color:#664d03;margin:.8rem 0}.link-button{border:0;background:transparent;color:#126b8e;text-decoration:underline;cursor:pointer;padding:.5rem 0}.reset-box{max-width:560px;margin:1rem auto}.form-feedback.error{background:#f8d7da;color:#842029;padding:.75rem;border-radius:8px}.form-feedback.success{background:#d1e7dd;color:#0f5132;padding:.75rem;border-radius:8px}
@media(min-width:700px){.user-auth-grid{grid-template-columns:1fr 1fr}.user-tile-grid{grid-template-columns:repeat(3,1fr)}.profile-grid{grid-template-columns:repeat(2,1fr)}}

@media(max-width:380px){.desktop-nav{gap:.1rem;padding-left:.2rem;padding-right:.2rem}.desktop-nav a{font-size:.78rem;padding:.44rem .42rem}}

/* Responsive Google Maps embeds from Contents */
.contact-google-maps iframe,
#contact-google-maps iframe {
  display: block;
  width: 100%;
  max-width: 100%;
  height: min(450px, 60vh);
  border: 0;
}


/* Consent V2 */
.cookie-banner-text{flex:1}.cookie-banner-text strong{display:block;margin-bottom:.2rem}.cookie-banner-text p{margin:0}.cookie-actions{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.consent-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid #ddd}.consent-row input{width:1.25rem;height:1.25rem}.cf-turnstile{margin:.7rem 0;max-width:100%}@media(max-width:520px){.cookie-actions{width:100%;flex-direction:column}.cookie-actions button{width:100%}}


/* Cookie-Consent V2.1: Einstellungen immer oberhalb des Banners; mobil als Vollbilddialog. */
#consentSettings { z-index: 80; }
html.consent-modal-open { overflow: hidden; }
@media (max-width: 620px) {
  #consentSettings { padding: 0; align-items: stretch; }
  #consentSettings .modal-box {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }
  #consentSettings .modal-footer {
    flex-wrap: wrap;
    gap: .5rem;
    padding-bottom: calc(.75rem + env(safe-area-inset-bottom));
  }
  #consentSettings .modal-footer button { flex: 1 1 100%; }
}