/* Sun Gate Tours — responsive.css */

@media(max-width:1050px) {
  .features {
    grid-template-columns:repeat(2,1fr);
  }
  .trip-page {
    grid-template-columns:1fr;
  }
  .trip-side {
    display:none;
  }
  .review-list {
    grid-template-columns:repeat(2,1fr);
  }
  .trip-card {
    flex-basis:calc((100% - 20px)/2);
  }
  .similar-card {
    flex-basis:calc((100% - 40px)/3);
  }
}


@media(max-width:900px) {
  .topbar-right {
    display:none;
  }
  .desktop-nav {
    display:none;
  }
  .menu-toggle {
    display:block;
  }
  .mobile-menu.open {
    display:flex;
    position:fixed;
    top:78px;
    left:0;
    right:0;
    background:#fff;
    padding:16px 20px;
    z-index:49;
    flex-direction:column;
    gap:2px;
    border-bottom:1px solid var(--line);
    box-shadow:0 12px 25px rgba(0,0,0,.1);
  }
  .mobile-menu a {
    padding:13px;
  }
  .menu-contact {
    border-top:1px solid var(--line);
    margin-top:8px;
    padding-top:8px;
  }
  .icon-link {
    display:flex!important;
    align-items:center;
    gap:9px;
  }
  .mobile-menu .whatsapp i {
    color:var(--green);
  }
  .mobile-menu .email i {
    color:#2697ef;
  }
  .mobile-menu .instagram i {
    color:#ee4f98;
  }
  .trip-facts {
    grid-template-columns:repeat(2,1fr);
  }
  .trip-facts>div:nth-child(2) {
    border-right:0;
  }
  .trip-facts>div:nth-child(-n+2) {
    border-bottom:1px solid var(--line);
  }
  .two-column-detail {
    grid-template-columns:1fr;
  }
  .footer {
    grid-template-columns:1fr 1fr;
  }
}


@media(max-width:600px) {
  .topbar {
    display:none;
  }
  .site-header {
    height:70px;
  }
  .logo-frame {
    width:52px;
    height:52px;
  }
  .mobile-menu.open {
    top:70px;
  }
  .hero {
    min-height:680px;
  }
  .hero-slices {
    grid-template-columns:repeat(6,1fr);
  }
  .hero-slice {
    background-position:center;
  }
  .hero-content {
    padding:45px 20px 60px;
    justify-content:end;
  }
  .hero h1 {
    font-size:45px;
  }
  .hero p {
    font-size:15px;
    line-height:1.65;
  }
  .section {
    padding:62px 18px;
  }
  .features,.review-list,.footer,.form-grid,.booking-choice-grid,.contact-action-grid {
    grid-template-columns:1fr;
  }
  .feature {
    padding:22px;
  }
  .group-title {
    align-items:start;
  }
  .trip-card {
    flex-basis:82%;
    min-width:270px;
  }
  .carousel-arrow {
    width:40px;
    height:40px;
  }
  .carousel-arrow.prev {
    left:-7px;
  }
  .carousel-arrow.next {
    right:-7px;
  }
  .all-trip-grid {
    display:grid;
    grid-template-columns:1fr;
    overflow:visible;
  }
  .all-trip-grid .trip-card {
    min-width:0;
  }
  .trip-image {
    height:205px;
  }
  .about {
    grid-template-columns:1fr;
    gap:35px;
  }
  .about-card {
    min-height:330px;
  }
  .about-card strong {
    font-size:34px;
  }
  .about-card span {
    font-size:23px;
  }
  .rating-summary {
    align-items:flex-start;
  }
  .trip-hero {
    min-height:600px;
  }
  .trip-hero-content {
    padding:80px 20px 42px;
  }
  .trip-hero h1 {
    font-size:43px;
  }
  .hero-meta {
    gap:10px;
  }
  .trip-page {
    padding:30px 18px 70px;
  }
  .trip-facts {
    grid-template-columns:1fr 1fr;
    margin-bottom:40px;
  }
  .trip-facts>div {
    border-right:0!important;
  }
  .trip-facts>div:nth-child(odd) {
    border-right:1px solid var(--line)!important;
  }
  .trip-facts>div:nth-child(3),.trip-facts>div:nth-child(4) {
    border-bottom:0;
  }
  .detail-section {
    margin-bottom:42px;
  }
  .detail-section h2 {
    font-size:31px;
  }
  .gallery-grid {
    grid-template-columns:1fr 1fr;
  }
  .gallery-photo-large {
    grid-column:1/-1;
    grid-row:auto;
    min-height:240px;
  }
  .itinerary-day summary {
    grid-template-columns:44px 1fr 20px;
    padding:15px 0;
  }
  .day-content {
    padding:0 8px 17px 55px;
  }
  .similar-card {
    flex-basis:82%;
    min-width:260px;
  }
  .modal-card {
    padding:25px 18px;
    border-radius:22px;
    max-height:94svh;
  }
  .modal-card h2 {
    font-size:28px;
  }
  .field input,.field textarea,.field select {
    font-size:16px;
  }
  .floating-wa {
    right:16px;
    bottom:16px;
    width:54px;
    height:54px;
  }
  .floating-wa span {
    display:none;
  }
  .admin-wrap {
    padding:20px 14px;
  }
  .admin-grid {
    grid-template-columns:1fr;
  }
  .admin-table {
    display:block;
    overflow-x:auto;
    white-space:nowrap;
  }
  .page-hero {
    padding:60px 20px;
  }
  .page-hero h1 {
    font-size:43px;
  }
}


/* Mobile stability pass */
@media(max-width:900px){
  html,body{width:100%;max-width:100%;overflow-x:hidden;}
  .site-header,.mobile-menu,.page-hero,.trip-hero,.trip-page,.section,.footer{max-width:100%;}
  .trip-page{width:100%;min-width:0;}
  .trip-main{min-width:0;width:100%;}
  .trip-hero-content{min-width:0;width:100%;}
  .hero-meta span,.trip-facts strong,.day-title,.trip-body h4{min-width:0;overflow-wrap:anywhere;word-break:normal;}
  .all-trips-page{width:100%;overflow:hidden;}
  .all-trip-grid{width:100%;min-width:0;}
  .all-trip-grid .trip-card{width:100%;min-width:0;}
}
@media(max-width:600px){
  .trip-facts{grid-template-columns:1fr;}
  .trip-facts>div,.trip-facts>div:nth-child(odd){border-right:0!important;border-bottom:1px solid var(--line)!important;}
  .trip-facts>div:last-child{border-bottom:0!important;}
  .all-trip-grid{grid-template-columns:1fr;}
  .trip-hero{min-height:500px;}
  .trip-hero-content{padding:75px 18px 36px;}
}

/* Compact persistent mobile navigation */
@media(max-width:900px){
  body{padding-top:62px;}
  .site-header{height:62px;padding:0 14px;box-shadow:0 5px 18px rgba(10,49,85,.08);}
  .logo-frame{width:44px;height:44px;}
  .menu-toggle{display:grid;place-items:center;width:40px;height:40px;font-size:20px;border-radius:12px;background:#f4f7fa;}
  .mobile-menu.open{top:62px;max-height:calc(100dvh - 62px);overflow-y:auto;padding:10px 14px 14px;z-index:999;}
  .mobile-menu a{padding:10px 12px;}
}
@media(max-width:600px){
  body{padding-top:58px;}
  .site-header{height:58px;padding:0 12px;}
  .logo-frame{width:40px;height:40px;}
  .menu-toggle{width:38px;height:38px;font-size:19px;}
  .mobile-menu.open{top:58px;max-height:calc(100dvh - 58px);}
}

@media(max-width:600px) {
  .modal { padding:10px; }
  .modal-card { width:100%; max-height:95svh; padding:22px 15px; border-radius:20px; }
  .booking-form-heading { gap:10px; }
  .form-mini-icon { flex-basis:42px; width:42px; height:42px; border-radius:13px; }
  .booking-form-heading h2 { font-size:25px; }
  .country-dropdown { position:fixed; left:12px; right:12px; top:50%; transform:translateY(-50%); max-height:70svh; }
  .country-options { max-height:48svh; }
  .guest-btn { width:42px; height:42px; }
}

/* Mobile hero: show five slices; desktop keeps all six original hero images untouched. */
@media (max-width: 600px) {
  .hero-slices { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .hero-slice-6 { display: none; }
}
@media(max-width:600px) {
  .gallery-grid { min-height:285px; grid-template-rows:142px 142px; padding-right:7px; margin-top:16px; }
  .gallery-photo-large { min-height:285px; }
  .gallery-photo { border-width:3px; border-radius:15px; }
  .gallery-photo-float:nth-child(2) { transform:translate(-8px,12px); }
  .gallery-photo-float:nth-child(3) { transform:translate(-8px,-5px); }
  .gallery-photo-float:nth-child(4) { transform:translate(5px,35px); }
  .lightbox { padding:14px; gap:8px; }
  .lightbox-stage { max-width:100%; max-height:88vh; }
  .lightbox img { max-width:100%; max-height:78vh; border-radius:10px; }
  .lightbox-nav { position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; background:rgba(3,22,39,.58); }
  .lightbox-nav:hover { transform:translateY(-50%); }
  .lightbox-prev { left:10px; }
  .lightbox-next { right:10px; }
  .lightbox-counter { left:10px; top:10px; }
  .lightbox-hint { bottom:8px; font-size:10px; }
  .trip-link { padding:9px 11px 9px 14px; font-size:12px; }
}

/* Final image layout overrides */
@media (max-width: 600px) {
  .trip-image { height: 190px; }
  .trip-image-half + .trip-image-half { border-left-width: 2px; }
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 0;
    min-height: 0;
  }
  .gallery-photo,
  .gallery-photo-large,
  .gallery-photo-float {
    width: 100%;
    height: 165px;
    min-height: 165px;
    transform: none !important;
  }
}

/* Final mobile booking modal/header spacing fix — affects booking popups only */
@media (max-width: 900px) {
  .modal {
    align-items: flex-start;
    padding: 72px 10px 12px;
  }
  .modal-card {
    width: calc(100vw - 20px);
    max-width: 720px;
    max-height: calc(100dvh - 84px);
    margin: 0 auto;
  }
}

@media (max-width: 600px) {
  .modal {
    padding: 68px 10px 10px;
  }
  .modal-card {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 78px);
    border-radius: 20px;
  }
}

@media (max-width:1050px) {
  .service-content-wrap { grid-template-columns:1fr; }
  .service-side-card { position:relative; top:auto; }
}

@media (max-width:600px) {
  .daily-services-slider-wrap { gap:7px; }
  .daily-services-grid { display:flex; overflow-x:auto; gap:14px; scroll-snap-type:x mandatory; padding:2px 2px 12px; margin:0; padding-right:2px; scrollbar-width:none; }
  .daily-services-slider-wrap .carousel-arrow { flex:0 0 36px; width:36px; height:36px; font-size:11px; }
  .daily-services-grid::-webkit-scrollbar { display:none; }
  .daily-service-card { flex:0 0 86%; scroll-snap-align:start; }
  .daily-service-image { height:205px; }
  .daily-service-body { padding:19px 18px 21px; }
  .daily-service-body h3 { font-size:21px; }
  .daily-service-body p { min-height:0; }
  .daily-service-topline { align-items:flex-start; }
  .daily-service-type { font-size:8px; padding:4px 7px; }
  .daily-service-actions { align-items:stretch; }
  .daily-service-link { font-size:12px; }
  .daily-service-book { min-height:40px; padding:0 12px; }

  .service-hero { min-height:650px; }
  .service-hero-overlay { background:linear-gradient(180deg,rgba(3,22,39,.28),rgba(3,22,39,.88)); }
  .service-hero-content { padding:85px 20px 42px; }
  .service-hero-content .back-link { margin-bottom:25px; }
  .service-hero-content h1 { font-size:40px; }
  .service-hero-content>p { font-size:14px; line-height:1.7; }
  .service-hero-facts { gap:7px; }
  .service-hero-facts span { font-size:10px; padding:8px 10px; }
  .service-hero-actions { margin-top:20px; gap:9px; }
  .service-hero-actions .btn, .service-hero-contact { min-height:44px; padding:0 16px; font-size:11px; }
  .service-content-wrap { padding:45px 18px 70px; gap:25px; }
  .service-info-heading h2 { font-size:24px; }
  .service-detail-list { grid-template-columns:1fr; }
  .service-side-card { padding:23px; }
  .service-side-card h2 { font-size:31px; }
}

/* Daily Services: touch navigation on tablet/mobile, arrows on desktop only */
@media (max-width: 1050px) {
    .daily-services-slider-wrap .carousel-arrow {
        display: none !important;
    }

    .daily-services-slider-wrap {
        display: block;
        width: 100%;
    }

    .daily-services-grid {
        width: 100%;
        cursor: grab;
        touch-action: pan-x;
        -webkit-user-select: none;
        user-select: none;
    }

    .daily-services-grid.is-dragging {
        cursor: grabbing;
    }
}

@media (max-width:1050px) {
  .daily-service-card { flex:0 0 86%; min-width:0; }
}
@media (max-width:600px) {
  .daily-service-image { height:235px; }
  .daily-service-body { padding:21px; }
}


/* FINAL: Daily Services match the main trip-card dimensions on touch screens. */
@media (max-width:1050px) {
  .daily-services-slider-wrap { display:block; width:100%; }
  .daily-services-grid {
    width:100%;
    gap:20px;
    padding:4px 2px 14px;
    cursor:grab;
    touch-action:pan-x;
  }
  .daily-service-card {
    flex-basis:calc((100% - 20px)/2);
    min-width:285px;
  }
  .daily-services-slider-wrap .carousel-arrow { display:none !important; }
}
@media (max-width:900px) {
  .daily-service-card {
    flex-basis:82%;
    min-width:270px;
  }
  .daily-service-image { height:205px; }
}

@media(max-width:600px) {
  .reviews-page-head {
    align-items:flex-start;
    flex-direction:column;
  }
  .reviews-page-summary {
    margin:0;
  }
  .review-photo-thumb {
    width:54px;
    height:54px;
  }
  .review-lightbox {
    padding:18px;
  }
  .review-lightbox-image {
    max-width:96vw;
    max-height:82vh;
  }
  .review-lightbox-close {
    top:12px;
    right:12px;
  }
}
