@media (max-width: 1024px){
  .stats-grid{ grid-template-columns:repeat(2, 1fr); }
  .reviews-grid{ grid-template-columns:repeat(2, 1fr); }
  .insta-grid{ grid-template-columns:repeat(3, 1fr); }
  .katalog{ grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); }
  .katalog--rehber{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); }
  .contact-grid{ grid-template-columns:1fr; }
  .map-frame{ min-height:380px; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .footer-about{ grid-column:1 / -1; }
}

@media (max-width: 1100px){
  .site-header{ background:var(--cream); }
  .nav-toggle{ display:flex; position:relative; z-index:895; }
  .nav{
    position:fixed; top:0; right:0; bottom:0;
    z-index:890;
    width:min(84vw, 340px);
    flex-direction:column; align-items:flex-start;
    justify-content:flex-start;
    gap:2rem;
    padding:calc(var(--header-h) + 2rem) 2rem 2.5rem;
    background:var(--cream);
    box-shadow:-24px 0 60px -30px rgba(43,34,38,.7);
    transform:translateX(100%);
    visibility:hidden;
    transition:transform .4s cubic-bezier(.2,.7,.2,1), visibility 0s linear .4s;
    overflow-y:auto;
  }
  .nav.is-open{
    transform:translateX(0);
    visibility:visible;
    transition:transform .4s cubic-bezier(.2,.7,.2,1), visibility 0s;
  }
  .nav-list{
    flex-direction:column; align-items:flex-start;
    gap:1.35rem; width:100%;
  }
  .nav-list a{ font-size:.95rem; letter-spacing:.18em; }
  .nav .btn{ width:100%; }
}

@media (max-width: 900px){
  .about-grid{ grid-template-columns:1fr; }
  .about-media{ max-width:460px; margin-inline:auto; }
  .about-media .about-sub{ right:-4%; bottom:-7%; width:44%; }
  .ornament--start{ justify-content:center; }
  .ornament--start::before{ display:block; }
  .about-text{ text-align:center; }
  .about-text .features{ text-align:left; }
  .package-grid{ grid-template-columns:repeat(2, 1fr); }
  .ikram-grid{ grid-template-columns:repeat(2, 1fr); }
  .katalog{ grid-template-columns:1fr; text-align:center; }
  .katalog--rehber{ grid-template-columns:1fr; }
  .katalog--rehber .katalog-media{ order:1; }
  .katalog--rehber .katalog-body{ order:2; }
  .katalog-list{ justify-content:center; }
  .katalog-media,
  .katalog--rehber .katalog-media{ max-width:400px; margin-inline:auto; }
  .katalog-actions{ justify-content:center; }
}

@media (max-width: 640px){
  .reviews-grid{ grid-template-columns:1fr; }
  .gallery-grid{ grid-template-columns:repeat(2, 1fr); gap:.7rem; }
  .insta-grid{ grid-template-columns:repeat(2, 1fr); }
  .package-grid{ grid-template-columns:1fr; }
  .package-card{ max-width:420px; margin-inline:auto; width:100%; }
  .ikram-grid{ grid-template-columns:repeat(2, 1fr); gap:.8rem; }
  .ikram-caption{ font-size:.6rem; letter-spacing:.1em; padding:.7rem .5rem; }
  .tag-grid{ grid-template-columns:1fr; }
  .katalog{ padding:1.2rem; }
  .katalog-actions .btn{ width:100%; }
  .hero{ text-align:center; }
  .hero-actions{ justify-content:center; }
  .hero-actions .btn{ width:100%; max-width:320px; }
  .rating-meta{ text-align:center; }
  .footer-grid{ grid-template-columns:1fr; text-align:center; }
  .footer-about p{ margin-inline:auto; }
  .site-footer .brand{ justify-content:center; }
  .socials{ justify-content:center; }
  .footer-bottom{ justify-content:center; text-align:center; }
  .footer-links a:hover{ padding-left:0; }
  .footer-links a::before{ display:none; }
  .contact-actions .btn{ width:100%; }
  .insta-panel{ padding:clamp(1.6rem, 6vw, 4rem); }
  .insta-panel .btn{ width:100%; white-space:normal; padding-inline:1rem; }
  .lightbox-btn{
    background:rgba(46,13,24,.62);
    border-color:rgba(255,255,255,.4);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
  }
  .lightbox-prev{ left:8px; }
  .lightbox-next{ right:8px; }
  .lightbox-close{ top:12px; right:12px; }
  .wa-float{ width:56px; height:56px; right:16px; bottom:16px; }
  .wa-float .wa-tip{ display:none; }
  .to-top{ right:22px; bottom:84px; }
}

@media (max-width: 400px){
  .stats-grid{ grid-template-columns:1fr; }
  .review-card{ padding:2rem 1.4rem 1.7rem; }
  .header-inner{ gap:.9rem; }
  .brand{ gap:.6rem; min-width:0; }
  .brand-mark{ width:40px; height:40px; font-size:1.2rem; }
  .brand-text strong{ font-size:1.18rem; }
  .brand-text small{ letter-spacing:.3em; font-size:.55rem; }
  .ikram-grid{ grid-template-columns:1fr; }
}
