/*
==================================================

ACCESS HOLIDAYS V3.5
Responsive Styles

==================================================
*/

/*==================================================
≤ 1400px
==================================================*/

@media (max-width:1400px){

.container{

max-width:1200px;

}

.hero-container{

gap:50px;

}

.hero-content h1{

font-size:62px;

}

.journey-gallery img{

height:620px;

}

.destination-grid{

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.plan-grid{

gap:30px;

}

.review-grid{

gap:28px;

}

.footer-grid{

gap:45px;

}

}

/*==================================================
≤ 1200px
==================================================*/

@media (max-width:1200px){

.container{

width:min(calc(100% - 40px),1100px);

}

.hero-container{

grid-template-columns:1fr;

text-align:center;

padding:170px 0 110px;

}

.hero-content{

max-width:850px;

margin:auto;
text-align:center;

}

.hero-content p{

margin-inline:auto;

}

.hero-buttons{

justify-content:center;

}



.hero-package{

justify-content:center;

margin-top:60px;

}

.package-card{

max-width:600px;

}

.journey-showcase{

grid-template-columns:1fr;

}

.women-wrapper{

grid-template-columns:1fr;

}

.flexi-wrapper{

grid-template-columns:1fr;

}

.planner-wrapper{

grid-template-columns:1fr;

}

.featured-story{

grid-template-columns:1fr;

}

.newsletter-wrapper{

flex-direction:column;

text-align:center;

}

.footer-grid{

grid-template-columns:repeat(2,1fr);

}

}

/*==================================================
≤ 992px
==================================================*/

@media (max-width:992px){

section{

padding:90px 0;

}

#mobileMenu{

display:block;

}

.nav-menu{

position:fixed;

top:0;

right:-100%;

width:320px;

height:100vh;

padding:120px 40px;

background:#fff;

display:flex;

flex-direction:column;

align-items:flex-start;

gap:30px;

box-shadow:var(--shadow-xl);

transition:.45s ease;

}

.nav-menu.active{

right:0;

}

.nav-menu a{

color:var(--dark)!important;

}

.nav-actions .btn-header{

display:none;

}

.hero{

min-height:auto;

}

.hero-container{

padding:160px 0 90px;

}

.hero-content h1{

font-size:52px;

}


.hero-stats{

grid-template-columns:repeat(2,1fr);

}

.destination-grid{

grid-template-columns:repeat(2,1fr);

}

.cruise-grid{

grid-template-columns:repeat(2,1fr);

}

.why-grid{

grid-template-columns:repeat(2,1fr);

}

.review-grid{

grid-template-columns:repeat(2,1fr);

}

.plan-grid{

grid-template-columns:1fr;

}

.flexi-trust{

grid-template-columns:repeat(2,1fr);

}

.achievement-grid{

grid-template-columns:repeat(2,1fr);

}

.moments-gallery{

grid-template-columns:repeat(3,1fr);

}

.footer-bottom{

flex-direction:column;

text-align:center;

}

}

/*==================================================
≤ 768px
==================================================*/

@media (max-width:768px){

:root{

    --section-space:80px;

}

.container{

    width:min(calc(100% - 30px),100%);

}

.section-header{

    margin-bottom:50px;

}

.section-header h2{

    font-size:36px;

}

.section-header p{

    font-size:16px;

}

.hero-container{

    padding:140px 0 70px;

    gap:45px;

}


.hero-tag{

    font-size:13px;

    padding:10px 18px;

}

.hero-content h1{

    font-size:42px;

}

.hero-content p{

    font-size:16px;

}

.hero-buttons{

    flex-direction:column;

    width:100%;

}

.hero-buttons .btn-primary,
.hero-buttons .btn-secondary,
.hero-buttons .btn-glass{

    width:100%;

}

.hero-stats{

    grid-template-columns:repeat(2,1fr);

    gap:16px;

}

.hero-stats article{

    padding:18px;

}

.hero-stats h3{

    font-size:28px;

}

.package-card{

    max-width:100%;

}

.package-body{

    padding:28px;

}

.package-body h2{

    font-size:30px;

}

.package-footer{

    flex-direction:column;

    align-items:flex-start;

    gap:25px;

}

.destination-grid{

    grid-template-columns:1fr;

}

.search-box{

    flex-direction:column;

    border-radius:24px;

}

.search-box button{

    width:100%;

}

.destination-categories{

    justify-content:flex-start;

    overflow-x:auto;

    flex-wrap:nowrap;

    padding-bottom:10px;

}

.destination-categories::-webkit-scrollbar{

    display:none;

}

.flexi-highlights{

    grid-template-columns:1fr;

}

.flexi-buttons{

    flex-direction:column;

}

.plan-grid{

    grid-template-columns:1fr;

}

.flexi-trust{

    grid-template-columns:1fr;

}

.women-wrapper{

    gap:45px;

}

.women-image img{

    height:500px;

}

.women-features{

    grid-template-columns:1fr;

}

.cruise-grid{

    grid-template-columns:1fr;

}

.why-grid{

    grid-template-columns:1fr;

}

.achievement-grid{

    grid-template-columns:repeat(2,1fr);

}

.planner-row{

    grid-template-columns:1fr;

}

.travel-style{

    justify-content:center;

}

.planner-actions{

    flex-direction:column;

}

.planner-preview{

    position:relative;

    top:auto;

}

.featured-story{

    gap:40px;

}

.story-video img{

    height:520px;

}

.moments-gallery{

    grid-template-columns:repeat(2,1fr);

}

.review-grid{

    grid-template-columns:1fr;

}

.newsletter-form{

    flex-direction:column;

}

.footer-grid{

    grid-template-columns:1fr;

    text-align:center;

}

.social-links{

    justify-content:center;

}

.footer-bottom{

    flex-direction:column;

}

.footer-bottom div{

    flex-wrap:wrap;

    justify-content:center;

}

}

/*==================================================
≤ 576px
==================================================*/

@media (max-width:576px){

#header{

    height:85px;

}

.logo img{

    width:150px;

}

.offer-ticker{

    margin-top:85px;

    height:50px;

}

.hero-container{

    padding:120px 0 60px;

}

.hero-content h1{

    font-size:34px;

    line-height:1.15;

}

.hero-content p{

    font-size:15px;

}


.hero-stats{

    grid-template-columns:1fr;

}

.section-header h2{

    font-size:30px;

}

.section-header p{

    font-size:15px;

}

.package-media{

    height:220px;

}

.package-body{

    padding:24px;

}

.package-body h2{

    font-size:26px;

}

.price-box h3{

    font-size:30px;

}

.destination-image{

    height:220px;

}

.destination-content{

    padding:24px;

}

.destination-content h3{

    font-size:24px;

}

.flexi-card{

    padding:28px;

}

.flexi-content h2{

    font-size:34px;

}

.plan-card{

    padding:30px;

}

.plan-card h3{

    font-size:28px;

}

.women-content h3{

    font-size:34px;

}

.story-video img{

    height:420px;

}

.moments-gallery{

    grid-template-columns:1fr;

}

.achievement-grid{

    grid-template-columns:1fr;

}

.achievement-grid h2{

    font-size:46px;

}

.planner-form{

    padding:30px;

}

.planner-preview{

    padding:30px;

}

.review-card{

    padding:30px;

}

.faq-question{

    padding:22px;

}

.faq-question span{

    font-size:17px;

}

.faq-answer p{

    padding:0 22px 22px;

}

.newsletter{

    text-align:center;

}

.newsletter h2{

    font-size:32px;

}

.footer{

    padding-top:70px;

}

.footer-logo{

    margin-inline:auto;

}

}

/*==================================================
≤ 400px
==================================================*/

@media (max-width:400px){

.container{

    width:min(calc(100% - 20px),100%);

}

.hero-content h1{

    font-size:30px;

}

.hero-tag{

    font-size:12px;

}

.hero-buttons .btn-primary,
.hero-buttons .btn-secondary,
.hero-buttons .btn-outline,
.hero-buttons .btn-glass{

    min-height:52px;

    font-size:15px;

    padding:0 20px;

}

.hero-stats article{

    padding:16px;

}

.package-body{

    padding:20px;

}

.package-body h2{

    font-size:24px;

}

.section-header h2{

    font-size:28px;

}

.flexi-card{

    padding:22px;

}

.plan-card{

    padding:24px;

}

.women-image img{

    height:400px;

}

.story-video img{

    height:360px;

}

.planner-form{

    padding:24px;

}

.planner-preview{

    padding:24px;

}

.newsletter-form input{

    height:54px;

}

.footer-bottom{

    font-size:14px;

}

}