/* Responsive styles — @media blocks extracted from main.css (loaded right after it; order preserved). */

@media (max-width: 1024px) {
  header {
    padding: 22px 0;
  }
  header.scrolled {
    padding: 11px 0;
  }
  .nav-links,
  .nav-right .btn {
    display: none;
  }
  .mobar {
    display: flex;
  }
  .fab-call {
    display: none;
  }
  .fab-stack {
    bottom: calc(64px + env(safe-area-inset-bottom, 0) + 14px);
  }
  body {
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0));
  }
  .mnav {
    padding-bottom: calc(90px + env(safe-area-inset-bottom, 0));
  }
  .foot-grid {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }
  .foot-grid > .foot-col,
  .foot-hours {
    display: none;
  }
  .foot-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .foot-brand p {
    margin-left: auto;
    margin-right: auto;
  }
  .foot-contact {
    margin-left: auto;
    margin-right: auto;
  }
  .socials {
    justify-content: center;
  }
  .foot-bottom {
    justify-content: center;
    text-align: center;
  }
  .sec-head {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .menu-grid,
  .split,
  .reserve-grid {
    grid-template-columns: 1fr;
  }
  .split.rev .split-media {
    order: 0;
  }
  .split-media {
    min-height: 340px;
  }
  .menu-feature {
    min-height: 300px;
  }
  .split-media > .ph {
    min-height: 340px;
  }
  .menu-feature > .ph {
    min-height: 300px;
  }
  .stats {
    grid-template-columns: 1fr 1fr;
  }
  .exp-grid {
    grid-template-columns: 1fr;
  }
  .reserve-media {
    min-height: 280px;
  }
  .reserve-media > .ph {
    min-height: 280px;
  }
  .gallery {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 150px;
  }
  .g1,
  .g2,
  .g3,
  .g4,
  .g5,
  .g6,
  .g7 {
    grid-column: auto;
    grid-row: auto;
  }
  .g1,
  .g5 {
    grid-column: 1/3;
  }
  .mlist {
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .mnote {
    grid-template-columns: 1fr;
  }
  .ggrid {
    --h: 240px;
  }
  .cgrid {
    grid-template-columns: 1fr;
  }
  .bnote-grid {
    grid-template-columns: 1fr;
  }
  .page-hero {
    min-height: 52vh;
    min-height: 52svh;
  }
  .hh2-top {
    grid-template-columns: 1fr;
  }
  .hh2-right {
    padding-top: 0;
  }
  .tdots {
    width: 104px;
  }
}
@media (max-width: 767px) {
	.trust {
      padding: 18px 26px;
	}
	
  .faq summary {
    padding: 0 24px;
    font-size: 16px;
  }
  .stat {
    padding: 20px 16px;
  }
  .stat .num {
    font-size: 28px;
  }
  .scroll-cue {
    display: none;
  }
  .exp {
    padding: 26px 22px;
  }
  .hh2-card {
    padding: 34px 20px 28px;
  }
  .r-meta,
  .mini {
    grid-template-columns: 1fr 1fr;
  }
  .hero h1 {
    font-size: clamp(34px, 9vw, 52px);
  }
  .reserve-media {
    order: -1;
  }
  /* Karte: stack the sidebar above the content — no side column on phones. */
  .mcard {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .msidebar {
    position: static;
    top: auto;
  }
  .ggrid {
    --h: 200px;
  }
  .page-hero h1 {
    font-size: clamp(34px, 9vw, 52px);
  }
  .hh2-choice {
    grid-template-columns: 1fr;
    gap: 30px;
    margin-top: 14px;
  }
  .hh2-or {
    margin: 10px auto;
  }
  .hh2-or:before {
    width: 150px;
    height: 150px;
  }
  .hh2-or b:before {
    inset: auto auto 100% 50%;
    width: 1px;
    height: 16px;
    margin: 0 0 8px;
  }
  .hh2-or b:after {
    left: 50%;
    top: 100%;
    width: 1px;
    height: 16px;
    margin: 8px 0 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
  }
  .reveal {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
  .sig-track,
  .ticker-track,
  .credit .heart,
  .fab-call:hover svg,
  .fab-top.show:hover svg,
  .fab-whatsapp:hover svg,
  .crow:has(a:hover) .ci svg {
    animation: none;
  }
  .ticker-track {
    justify-content: center;
  }
  .hero h1,
  .hero .lead,
  .hero-actions,
  .hero-eyebrow,
  .trust,
  .scroll-cue,
  .page-hero .eyebrow,
  .page-hero h1,
  .page-hero .intro {
    opacity: 1 !important;
    transform: none !important;
    transition: none;
  }
  .scroll-cue .bar:after {
    animation: none;
  }
  .spotlight {
    display: none;
  }
  .mnav a {
    transition: none;
  }
}

@media (max-width: 560px) {
  .ls-404__actions .btn {
    width: 100%;
    max-width: 300px;
  }
}

@media (max-width: 480px) {
  .trust {
    flex-wrap: wrap;
    max-width: 100%;
    row-gap: 4px;
    justify-content: flex-start;
  }
  .trust .div {
    display: none;
  }
}