/* =====================================================
   MAX-WIDTH: 1399px
   ===================================================== */

@media (max-width: 1399px) {

    /* Hero */
    .hero_title { font-size: 55px; }
    .hero_badge { font-size: 12px; margin-bottom: 35px; }
    .hero_pills { right: 30px; }

    /* about */
    .about_buttons { margin-top: 40px;}

    /* Menu */
    .menu_header_right { max-width: 500px;}
    .menu_header { gap: 100px;}
    .menu_header { margin-bottom: 30px;}
    .menu_chef { bottom: -31px;}
}

/* =====================================================
   MAX-WIDTH: 1199px
   ===================================================== */

@media (max-width: 1199px) {

    p { font-size: 16px; }
    .title { font-size: 35px; }
    .btn_arrow_dark { width: 40px; height: 40px; font-size: 15px; }
    .btn_text_dark { padding: 10px 20px; font-size: 14px; }
    .legacy_badge { font-size: 14px; margin-bottom: 30px; }

    /* Hero */
    .hero_title { font-size: 49px; }
    .hero_pills { right: 30px; }

    /* legacy */
    .legacy_title { font-size: 50px; }
    .legacy_stat h3 { font-size: 35px; }

    /* menu */
    .menu_header { gap: 50px; }
    .menu_chef { width: 120px; right: -85px; }

    /* .experience */
    .experience_slider_wrap { height: 640px; }
    .exp_img { height: 250px; }

    /* why-choose */
    .why_card_title { font-size: 20px; }
    .why_card_header { margin-bottom: 10px; }
    .why_featured_title { font-size: 22px; }

    /* contact */
    .btn_outline_contact { padding: 10px 20px; font-size: 14px; }

    /* footer */
    .footer_wordmark { font-size: clamp(60px, 15vw, 225px); bottom: -20px; }
}

/* =====================================================
   MAX-WIDTH: 1099px
   ===================================================== */

@media (max-width: 1049px) {
    .menu_card { flex: 0 0 calc(100% / 2); min-width: calc(100% / 2); }
}

/* =====================================================
   MAX-WIDTH: 991px
   ===================================================== */

@media (max-width: 991px) {
    .btn_text { padding: 10px 15px; }
    .btn_arrow { width: 40px; height: 40px; font-size: 15px; }
    .btn_outline_hero { padding: 8px 20px; font-size: 14px;}

    /* Header */
    .header-logo img{ width: 130px; }
    header .nav_col { display: none; }
    .hamburger { display: flex; }
    .mobile_nav { display: flex; }
    .header_inner { height: 58px; }
    header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; background: rgba(15,10,5,0.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
    .primary_button a { justify-content: center; }
    /* Hero */
    .hero_sec { padding-top: 58px; }
    .hero_desc { max-width: 800px;}
    .hero_title { font-size: clamp(1.8rem, 5vw, 2.6rem); }
    .hero_pills { right: 20px; bottom: 0px; width: 240px; }
    .pill { font-size: 12px; padding: 7px 16px; }
    .pill_1 { right: 190px; }
    .pill_2 { bottom: 2px; right: 28px;}
    .pill_3 { right: 125px; bottom: 26px; --rotation: 35deg; }
    .pill_4 { right: 230px; bottom: 47px;} 
    .pill_5 { bottom: 48px; right: 82px; --rotation: 19deg; }
    
    /* Legacy */
    .legacy_sec { padding: 70px 0; }
    .legacy_left { padding-right: 20px; }
    .legacy_title { font-size: 36px; padding-bottom: 30px; }
    .legacy_right { border-top: 1px solid rgba(0, 0, 0, 0.15); padding-top: 30px; border-left: none; padding-left: 0px; }
    .legacy_stats { gap: 30px; }
    .legacy_stat h3 { font-size: 28px; }

    /* About */
    .about_sec { padding: 70px 0; }
    .about_img_wrap { padding: 10px 0 30px 0 }
    .about_content { padding-left: 0px; }
    .about_title { font-size: 32px; }
    .about_pills { right: 30px; width: 280px; }

    /* Menu */
    .menu_header { flex-direction: column; gap: 0px; align-items: flex-start; }
    .menu_title { font-size: 36px; }
    .menu_card { flex: 0 0 50%; }
    .menu_chef { width: 120px; right: -179px;}
    .menu_rsp_slider .slick-slide video { height: 150px; }

    /* Experience */
    .exp_img { height: 300px; }
    .experience_slider_wrap { height: 600px; margin-bottom: 80px; }
    .experience_content { padding-left: 0; padding-bottom: 60px; }
    .experience_title { font-size: 32px; }

    /* Why Choose */
    .why_choose_sec { padding: 70px 0; }
    .why_title { font-size: 36px; }
    .why_grid { grid-template-columns: repeat(2, 1fr); }
    .why_card:nth-child(3) { border-right: 1px solid rgba(0,0,0,0.15); }
    .why_card:nth-child(2),
    .why_card:nth-child(4) { border-right: none; }
    .why_card:nth-child(4),
    .why_card:nth-child(5) { border-bottom: 1px solid rgba(0,0,0,0.15); }
    .why_card:nth-child(6) { border-bottom: none; }

    /* contact */
    .contact_sec { padding: 70px 0; }

    /* footer */
    .contact_left p { margin-bottom: 30px; }
    .contact_left { padding-right: 0px; padding-bottom: 60px; }
}


/* =====================================================
   MAX-WIDTH: 767px
   ===================================================== */

@media (max-width: 767px) {

    /* Hero */
    .hero_section { height: auto; min-height: 100svh; align-items: flex-end; padding-bottom: 160px; }
    .hero_title { font-size: 45px; }
    .hero_left { padding-bottom: 0; }
    .hero_overlay { background: linear-gradient(to top, rgba(0,0,0,0.82) 50%, rgba(0,0,0,0.3) 100%); }
    .hero_desc { max-width: 100%; }
    .hero_pills { bottom: 0px; }
    .mobile_nav_link { font-size: 18px;}
    .marquee_content h6 { font-size: 20px; }
    .menu_slider { padding: 15px 0; }
    .marquee_content { gap: 15px; }

    /* Legacy */
    .legacy_sec { padding: 60px 0; }
    .legacy_left { padding-right: 0; margin-bottom: 40px; }
    .legacy_title { padding-bottom: 0; }
    .legacy_right { border-left: none; border-top: 1px solid rgba(0,0,0,0.15); padding-left: 0; padding-top: 35px; }
    .legacy_stats { gap: 20px; }
    .legacy_stat h3 { font-size: 28px; }

    /* About */
    .about_img_wrap { margin-bottom: 40px; }
    .about_content { padding-left: 0; }
    .about_title { font-size: 28px; }
    .about_content p { max-width: 100%; }
    .about_pills { display: none; }

    /* Menu */
    .menu_sec { padding: 60px 0 40px; }
    .menu_title { font-size: 28px; }
    .menu_header_right { flex-direction: column; align-items: flex-start; }
    .menu_card { flex: 0 0 100%; padding: 25px 20px; }
    .menu_card_title { font-size: 22px; }
    .menu_chef { width: 80px; }
    .menu_card_desc { font-size: 15px; margin-bottom: 15px; }
    .slick-list.draggable { margin: 0 30px; }

    /* Responsive Menu Slider */
    .menu_responsive_sec .menu_header { flex-direction: column; gap: 20px; align-items: flex-start; padding-top: 70px; padding-bottom: 30px; }
    .menu_rsp_card { padding: 0; }
    .menu_rsp_prev { left: 12px; transform: translateY(-50%); }
    .menu_rsp_next { right: 12px; transform: translateY(-50%); }
    .menu_tag { padding: 6px 10px; font-size: 14px; }
    .menu_responsive_sec .menu_btn_wrap { margin-top: 60px; }
    .slick-dots li { width: 0px !important; height: 0px !important; }
    /* .slick-dots { bottom: -40px !important; } */

    /* Experience */
    .experience_slider_wrap { height: 340px; }
    .experience_title { font-size: 26px; }
    .exp_img { height: 160px; }

    /* Why Choose */
    .why_title { font-size: 28px; margin-bottom: 35px; }
    .why_grid { grid-template-columns: 1fr; }
    .why_card { border-right: none; border-bottom: 1px solid rgba(0,0,0,0.15); }
    .why_card:nth-child(3),
    .why_card:nth-child(5) { border-right: none; }
    .why_card:nth-child(6) { border-bottom: none; }

    /* Footer */
    .footer_top { flex-direction: column; gap: 25px; align-items: flex-start; }
    .footer_nav { flex-wrap: wrap; gap: 14px 20px; }
    .footer_bottom { flex-direction: column; gap: 12px; align-items: flex-start; }
    .footer_inner { padding: 22px 20px 18px; }
    
    html {
        scroll-padding-top: 40px;
    }

    section {
        scroll-margin-top: 40px;
    }

}


@media (max-width: 600px) {
    .slick-list.draggable { margin: 0 10px; }
    .menu_rsp_slider_wrap { border-bottom: none }
}

/* =====================================================
   MAX-WIDTH: 568px
   ===================================================== */

@media (max-width: 568px) {
    .btn_text { padding: 8px 15px; font-size: 14px; }

    /* Hero */
    .hero_section { padding-bottom: 100px; }
    .hero_badge { font-size: 12px; margin-bottom: 30px; padding: 8px 10px;}
    .hero_title { font-size: 35px; max-width: 400px; }
    .hero_desc { font-size: 16px; line-height: normal; margin-bottom: 45px; }
    .btn_arrow { width: 38px; height: 38px; font-size: 14px; }
    .hero_pills { display: none; }
    /* .pill_1 { right: 80px; }
    .pill_3 { right: 20px; }
    .pill_4 { right: 90px; } */

    /* experince */
    .experience_slider_wrap { height: 500px; }
    .experience_slider_wrap { margin-bottom: 50px; }

    /* menu */
    .menu_tag { font-size: 15px; }
    .menu_tags { max-width: 300px; }
    .menu_card_desc {font-size: 16px; margin-bottom: 25px; }

    /* Legacy */
    .legacy_title { font-size: 28px; }
    .legacy_title .hide-br{ display: none; }
    .legacy_stats { flex-wrap: wrap; gap: 24px; }
    .legacy_stat { min-width: 80px; }

    /* About */
    .about_title { font-size: 24px; }

    /* contact */
    .contact_item_left { align-items: flex-start; flex-direction: column; }
    .contact_item { align-items: flex-start; }
    .nmbr { flex-direction: column; }

    /* footer */
    .site_footer { padding: 50px 0px 80px; }
    .footer_wordmark { font-size: 55px; color: #bdbdbd69; bottom: -10px; }

    .footer_nav{ justify-content: center; }
    .footer_top{ align-items: center; }

}

/* height============================================================================= */


@media (max-height: 700px) and (1200px <= width <= 1400px){
    .title { font-size: 40px; }

    .hero_title { font-size: 45px; }
    .hero_left { padding-bottom: 4rem; }
    .btn_text { padding: 8px 15px; }
    .btn_arrow { width: 38px; height: 38px; }
    .hero_badge { font-size: 10px; margin-bottom: 30px; }
    .btn_outline_hero { padding: 6px 20px; }

    .legacy_title { font-size: 45px; }

    .menu_sec { padding-top: 40px !important; }
    .menu_chef { width: 110px; }
    .menu_card { padding: 20px 20px; }
    .menu_tag { padding: 5px 4px; font-size: 12px; }
    .menu_card_title { font-size: 22px; }
    .menu_card_img { height: 140px; }
    .menu_card_desc { font-size: 14px; margin-bottom: 15px; }

}