/* ============================================================
   MAHARAJA TRAVEL — responsive.css
   Type and icon scales step down together so the visual
   hierarchy from the reference holds at every width.
   Section padding, gutters and card spacing are unchanged.
   ============================================================ */


/* ---------- 1920px and up ---------- */
@media (min-width:1921px){
  :root{
    --container:1440px;
    --fs-h1:66px; --fs-h2:54px; --fs-h3:29px;
    --fs-base:18px; --fs-sm:17px; --fs-xs:16px;
  }
  .hero-slide__img{ height:400px; }
  .destination-expander{ height:460px; }
}

/* ---------- 1600px ---------- */
@media (max-width:1600px){
  :root{ --container:1240px; }
}

/* ---------- 1440px ---------- */
@media (max-width:1440px){
  :root{ --container:1180px; --fs-h1:54px; --fs-h2:45px; }
  .hero-slide__img{ height:330px; }
}

/* ---------- 1366px ---------- */
@media (max-width:1366px){
  :root{ --container:1120px; --gutter:18px; }
  .hero-grid{ grid-template-columns:minmax(0,1fr) 300px; }
  .hero-slide__img{ height:315px; }
  .destination-expander{ height:380px; }
}

/* ---------- 1280px ---------- */
@media (max-width:1280px){
  :root{
    --container:1060px;
    --fs-h1:50px; --fs-h2:42px; --fs-h3:24px; --fs-h4:21px;
  }
  .hero-grid{ grid-template-columns:minmax(0,1fr) 285px; }
  .packages-layout{ grid-template-columns:210px minmax(0,1fr); }
  .about-card{ grid-template-columns:210px minmax(0,1fr); }
}

/* ---------- 1024px : tablet landscape ---------- */
@media (max-width:1024px){
  :root{
    --container:100%;
    --fs-h1:46px; --fs-h2:38px; --fs-h3:23px; --fs-h4:20px;
    --fs-base:16px; --fs-sm:15px; --fs-xs:14px; --fs-xxs:13px;
    --icon-lg:28px; --icon-xl:36px;
  }

  /* Hero stacks, sidebar moves below */
  .hero-grid{ grid-template-columns:minmax(0,1fr); }
  .hero-aside{ order:2; }
  .aside-actions{ justify-content:flex-start; }
  .sticky-sidebar{
    position:static;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
  }
  .hero-slide__img{ height:300px; }

  /* Filters become a collapsible bar above the results */
  .packages-layout{ grid-template-columns:minmax(0,1fr); }
  .filter-panel{ position:static; }
  .filter-panel__body{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 24px;
  }
  .filter-panel__body .accordion{ grid-column:1 / -1; }
  .btn--clear{ width:auto; padding:10px 24px; }

  .destination-expander{ height:340px; }
  .destination-card__vtitle{ font-size:32px; }

  .why-item{ min-width:33.333%; }
}

/* ---------- 991px ---------- */
@media (max-width:991px){
  :root{ --section-y:42px; }
  .city-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .logo-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .review-strip{ gap:26px; }
  .review-platforms{ gap:24px; }
  .hero-usp{ right:16px; gap:11px; }
  .hero-usp__icon{ width:38px; height:38px; }
  .video-thumb img{ height:175px; }
}

/* ---------- 768px : tablet portrait ---------- */
@media (max-width:768px){
  :root{
    --fs-h1:40px; --fs-h2:33px; --fs-h3:22px;
    --gutter:16px;
  }

  .page-title-inner{ gap:12px; }
  .count-badge{ min-width:76px; }
  .count-badge__num{ font-size:36px; }

  .hero-slide__img{ height:250px; }

  /* USP list drops below the image so text stays legible */
  .hero-usp{
    position:static;
    transform:none;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
  }
  .hero-usp__label{ color:var(--dark); text-shadow:none; }
  .hero-usp__icon{ background:#FDF1F5; }
  .hero-cta{
    position:static;
    transform:none;
    justify-content:center;
    margin-top:14px;
    flex-wrap:wrap;
  }
  .hero-slider .owl-dots{ bottom:12px; }

  /* About card: image on top */
  .about-card{
    grid-template-columns:minmax(0,1fr);
    padding:0 18px 20px;
    margin-top:60px;
    text-align:center;
  }
  .about-card__media{ margin-top:-56px; }
  .about-card__media img{ max-width:200px; }
  .about-card__btn{ float:none; }

  .sticky-sidebar{ grid-template-columns:minmax(0,1fr); }

  .faq-grid{ grid-template-columns:minmax(0,1fr); gap:26px; }
  .section-title--left{ text-align:center; }

  .why-item{ min-width:50%; }

  .destination-expander{ height:auto; }

  .video-modal__close{ top:-46px; }
}

/* ---------- 576px : large phone ---------- */
@media (max-width:576px){
  :root{
    --fs-h1:36px; --fs-h2:30px; --fs-h3:21px; --fs-h4:19px;
    --section-y:34px;
  }

  .section-more{ justify-content:center; }

  .page-title-inner{ flex-direction:column; align-items:flex-start; gap:10px; }

  .filter-panel__body{ grid-template-columns:minmax(0,1fr); }

  .city-grid{ grid-template-columns:minmax(0,1fr); }
  .logo-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }

  .review-strip{ flex-direction:column; gap:22px; }
  .review-platforms{ justify-content:center; gap:20px; }
  .travellers-count__text strong{ font-size:38px; }

  .why-item{ min-width:100%; border-right:0; border-bottom:1px solid var(--border-soft); }
  .why-item:last-child{ border-bottom:0; }

  /* Centre-mode sliders lose their scale offset on one-up layouts */
  .insta-card,
  .instagram-slider .center .insta-card{ transform:none; }

  /* Pull arrows inside the viewport */
  .owl-carousel .owl-nav button.owl-prev,
  .instagram-slider .owl-nav button.owl-prev{ left:4px; }
  .owl-carousel .owl-nav button.owl-next,
  .instagram-slider .owl-nav button.owl-next{ right:4px; }
}

/* ---------- 480px ---------- */
@media (max-width:480px){
  :root{ --fs-h1:33px; --fs-h2:28px; }

  .hero-slide__img{ height:210px; }
  .aside-actions{ flex-wrap:wrap; }
  .aside-actions .btn{ flex:1 1 auto; }
  .tabs{ gap:16px; overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none; }
  .tabs::-webkit-scrollbar{ display:none; }
  .tab{ white-space:nowrap; }
  .destination-expander.owl-carousel .destination-card{ height:320px; }
  .video-thumb__play{ width:56px; height:56px; }
}

/* ---------- 425px ---------- */
@media (max-width:425px){
  :root{ --gutter:14px; }
  .hero-usp{ grid-template-columns:minmax(0,1fr); }
  .hero-cta .btn{ width:100%; }
  .package-card__price ins{ font-size:28px; }
}

/* ---------- 390px ---------- */
@media (max-width:390px){
  :root{ --fs-h1:31px; --fs-h2:26px; --fs-base:16px; }
  .hero-slide__img{ height:190px; }
  .review-platforms{ gap:16px; }
  .review-platform img{ height:36px; width:36px; }
  .review-platform__score{ font-size:26px; }
}

/* ---------- 375px ---------- */
@media (max-width:375px){
  .count-badge{ min-width:68px; padding:6px 10px 8px; }
  .experience-card__media img{ height:135px; }
  .insta-card img{ height:145px; }
  .video-thumb img{ height:165px; }
}

/* ---------- 360px ---------- */
@media (max-width:360px){
  :root{ --gutter:12px; --fs-h1:29px; --fs-h2:24px; }
  .btn{ padding:11px 18px; }
  .btn--sm{ padding:9px 16px; }
  .destination-expander.owl-carousel .destination-card{ height:290px; }
}

/* ---------- 320px ---------- */
@media (max-width:320px){
  :root{
    --fs-h1:27px; --fs-h2:22px; --fs-h3:19px;
    --fs-base:15px; --fs-sm:14px; --fs-xs:13px; --fs-xxs:12px;
    --fs-btn:14px; --fs-btn-sm:13px;
  }
  .hero-slide__img{ height:170px; }
  .package-card__body{ padding:10px 11px 11px; }
  .logo-grid{ grid-template-columns:minmax(0,1fr); }
  .travellers-count__text strong{ font-size:32px; }
}


/* ============================================================
   PRINT
============================================================ */
@media print{
  .hero-cta,.scroll-top,.owl-nav,.owl-dots,
  .filter-panel,.video-modal{ display:none !important; }
  body{ color:#000; }
}
