/* BASE MOBILE STYLES (0px - 767px)
   Your existing code is already here.
*/


/* ==========================================================================
   1. TABLETS (Portrait) & LARGE PHONES
   Breakpoint: 768px
   Usage: Scale up the card width and adjust grid from 1 to 2 columns.
   ========================================================================== */
@media screen and (min-width:768px){

.schedule_cards_container{

    display:flex; 
    flex-direction:row;
    gap:24px; 
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    padding:10px 20px;
}

/* each card */
.schedule_component_father{

flex:0 0 423px;
scroll-snap-align:start;
height: 440px;
    }


    /* King of the Court Badge */
.event_type_indicator > :nth-child(1) {
    display: flex;
    align-items: center;
    justify-content: center; 
    padding: 13px 40px;
    background-color: rgba(239, 68, 68, 0.15);
    border-radius: 99px;
    
}

.event_type_title h2 {
    font-size: 1.70rem;
    color: #ffffff; margin-top:20px;
    line-height: 1.2;
}

.event_details_small_container > :nth-child(1) {
    height: 55px; width:55px; 
}


.event_details_small_container > :nth-child(2) > p {
font-size:15px;
}

.event_details_small_container > :nth-child(2) > a {
font-size:15px;
}

.event_details_small_container > div > img {
    height: 24px; width:24px;
}

.event_type_indicator > :nth-child(1) p {
    color: #F87171;
    letter-spacing: 0.6px;
    font-size:14px;
}

.event_details_small_container > :nth-child(2) h4 {
    letter-spacing: 0.6px;
    font-size:16px;
}

.join_now_like_button {
    height: 62px;
    width: 172px;
}

.sold_out_like_button {
    height: 64px;
    width: 174px;

}

/* hide scrollbar */
.schedule_cards_container::-webkit-scrollbar{
display:none;
}

.schedule_cards_container{
-ms-overflow-style:none;
scrollbar-width:none;
}


.faq {
    max-width:1100px;
}

.accordion-item {
    border-radius: 12px;
    background: #101012; box-shadow:inset 0 0 0 1px #27272A;
    overflow: hidden;
    margin-bottom: 20px; 
    transition: border 0.3s ease; 
    border: 2px solid transparent; 
}

.accordion-item.active {
    border: 1px solid #ffd400;
  
}

.accordion-header {
    background: transparent;
    width: 100%;
    padding: 20px; padding-bottom:30px; padding-top:30px;
    border: none;
    font-size: 24px; 
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.accordion-header .icon {
    transition: transform 0.3s ease, color 0.3s ease;
}

.accordion-header span {
   letter-spacing:0.8px;
}

.accordion-item.active .icon {
    transform: rotate(180deg);
}

.accordion-content {
    height: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.4s ease, padding 0.3s ease;
}

.accordion-content p {
    font-size: 20px;
    color: #9ca3af;
    line-height: 1.4;
}

.got_questions_container { 
     height:150px; width:417px; margin:auto; margin-top:50px; 
    display:flex; flex-direction:column; align-items:center; justify-content:center;
}

.got_questions_container > h3 { color:#FFD700; letter-spacing:4.2px; font-size:22px;}
.got_questions_container > h2 { color:#FFFFFF;  font-size:46px; }

.label_container > span { 
    font-size:26px; 
}

.legal_container  { 
    width:899px;
}

#legal_container_child p { font-size:25px;}
#legal_container_child h3 { font-size:28px;}


#nike_elite_gear_heading_container_child { 
    text-align:center; display:flex; align-items:center; justify-content:space-between; 
    flex-direction:column; height:200px;  width:417px;  width:500px;  
}
    #nike_elite_gear_heading_container_child > h3 { color:#FFD700; font-size:46px; letter-spacing:4.2px;}
        #nike_elite_gear_heading_container_child > h4 { color:#FFD700; font-size:22px; letter-spacing:4.2px;}

    #nike_elite_gear_heading_container_child > h2 { color:#FFFFFF; font-size:60px; letter-spacing:4.2px;}
    #nike_elite_gear_heading_container_child > p { color:#A1A1AA; margin-top:10px; font-size:24px; text-align:start;}

section#upcoming_runs_container { 
    min-height:215px; min-width:537px; 
    display:flex; align-items:center; justify-content:center; 
    margin:auto;margin-bottom:30px; margin-top:30px;
}

article#upcoming_runs_container_child  { 
    min-height:180px; 
    min-width:500px; display:flex;  
    align-items:center; justify-content:center;  
    flex-direction:column; gap:15px;
}

article#upcoming_runs_container_child > h3 { color:#FFD700; letter-spacing:3.2px; font-size:22px;}
article#upcoming_runs_container_child > h2 { color:#FFFFFF; letter-spacing:1.8px; font-size:60px; }
article#upcoming_runs_container_child > p { color:#A1A1AA; font-size:24px; line-height:30px; text-align:center; width:290px; }

.got_questions_container { 
    height:150px; width:500px; }
.got_questions_container > h3 { color:#FFD700; letter-spacing:4.2px; font-size:24px;}
.got_questions_container > h2 { color:#FFFFFF;  font-size:60px; }


header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 110px; /* Slightly taller for a premium feel */
    padding: 0 30px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    box-sizing: border-box;
    background-color: transparent;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); /* Smoother curve */
}

/* The Glass Effect on Scroll */
header.scrolled {
    background-color: var(--glass-bg);
    backdrop-filter: blur(var(--blur-strength));
    -webkit-backdrop-filter: blur(var(--blur-strength)); /* Safari support */
    border-bottom: 1px solid rgba(255, 255, 255, 0.1); /* Subtle "edge" */
    height: 80px; /* Slight shrink effect on scroll */
}

#main-header > .logo-link > img {
    height: 12px; /* Slightly larger logo */
    transition: height 0.3s ease;
}

#main-header > .store-link > img {
    height: 18px; /* Slightly larger logo */
    transition: height 0.3s ease;
}


#main-header > #menu-open > img {
    height: 25px; /* Slightly larger logo */
    transition: height 0.3s ease;
}

.auth-title { font-size:40px;}
#auth-name { font-size:27px;}
#home_page_merch_button {
    position: relative;
    height: 74px; 
    width: 280px;
    margin: 50px auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    background: linear-gradient(145deg, #1a1a1d, #111113);
    border-radius: 14px;
    border: 1px solid #2a2a2e;
    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.5),
        inset 0 0 0 1px rgba(255,255,255,0.04);
    cursor: pointer;
    overflow: hidden;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background 0.3s ease;
}
.event_details_small_container :nth-child(1)> i { font-size:20px; color: #FFD700; width:auto;}


/* ============================= */
/* PREMIUM CLICK SPRING          */
/* ============================= */

#home_page_merch_button:active {
    animation: nikePress 0.4s cubic-bezier(.34,1.56,.64,1); 
}

@keyframes nikePress {
    0%   { transform: scale(1); }
    35%  { transform: scale(0.88) translateY(2px); } /* compression */
    65%  { transform: scale(1.04); }                 /* overshoot */
    100% { transform: scale(1); }                    /* settle */
}


/* ============================= */
/* TEXT                          */
/* ============================= */

#home_page_merch_button span {
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 1px;
    color: #ffffff;
    transition: letter-spacing 0.25s ease;
}

#home_page_merch_button:hover span {
    letter-spacing: 2px;     max-height:100vh; 

}
.products_box{
    width:calc(50% - 14px);
    height:550px;

}

.product_info{

    height:90px;
    padding:15px;
    display:flex;

}

.product_name{

    font-size:22px;
    color:#E4E4E7;
    margin-bottom:4px;
}

.product_price{

    font-size:22px;
    color:#FFD400;
    font-weight:600;
}


.modal_content {
    max-width:700px;
}

.modal_image_wrapper {
    width: 100%;
    height: 520px;
}

#products_show_case_main_child_container {
    height: 680px; 

}

.modal_description {
    color: #a1a1aa;
    font-size: 1.3rem;
    line-height: 1.5;
}

.modal_variant_group {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.modal_variant_group h4 {
    color: white;
    font-size: 22px;
    margin: 0;
}

.variant_pills {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.pill {

    padding: 20px 30px;
    font-size: 20px; font-weight: bold;
}

.close_modal {

    color: #a20606;
    font-size: 2.2rem;
    cursor: pointer;

}

#products_show_case_container { margin-top:100px;}

.auth-container {
        margin-top:200px;
    }

    .input-group label {
        font-size:1.1rem;;
     }

/* ============================= */
/* ICON MOTION                   */
/* ============================= */

#home_page_merch_button lord-icon {
    transition: transform 0.3s ease; height:37px; width:37px;
}

#home_page_merch_button:hover lord-icon {
    transform: translateX(5px);
}

.home_page_product_boxes {
    flex: 0 0 360px;
    height:390px;
  
}

.carousel_track {
    gap: 30px;

}



/* ============================= */
/* PREMIUM LIGHT SWEEP           */
/* ============================= */

#home_page_merch_button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 120%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent 30%,
        rgba(255,255,255,0.08),
        transparent 70%
    );
    transition: left 0.6s ease;
}

#home_page_merch_button:hover::before {
    left: 120%;
}

}



@media screen and (min-width: 1440px) {

.schedule_cards_container{

    display:flex;
    flex-direction:row;
    gap:24px;
    overflow-x:auto;
    overflow-y:hidden;  margin:auto;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    padding:10px 20px; margin:auto; 
}
.event_details_small_container :nth-child(1)> i { font-size:21px; color: #FFD700; width:auto;}

/* each card */
.schedule_component_father{

flex:0 0 523px; 
scroll-snap-align:start; 
height: 440px;
    }

    #products_show_case_main_child_container {
    height: 1080px; 

}

    /* King of the Court Badge */
.event_type_indicator > :nth-child(1) {
    display: flex;
    align-items: center;
    justify-content: center; 
    padding: 13px 40px;
    background-color: rgba(239, 68, 68, 0.15);
    border-radius: 99px;
}

.event_type_title h2 {
    font-size: 1.70rem;
    color: #ffffff; margin-top:20px;
    line-height: 1.2;
}

.event_details_small_container > :nth-child(1) {
    height: 55px; width:55px; 
}


.event_details_small_container > :nth-child(2) > p {
font-size:15px;
}

.event_details_small_container > :nth-child(2) > a {
font-size:15px;
}

.event_details_small_container > div > img {
    height: 24px; width:24px;
}

.event_type_indicator > :nth-child(1) p {
    color: #F87171;
    letter-spacing: 0.6px;
    font-size:14px;
}

.event_details_small_container > :nth-child(2) h4 {
    letter-spacing: 0.6px;
    font-size:16px;
}

.join_now_like_button {
    height: 62px;
    width: 172px;
}

.sold_out_like_button {
    height: 64px;
    width: 174px;

}

.auth-title { font-size:28px;}

/* hide scrollbar */
.schedule_cards_container::-webkit-scrollbar{
display:none;
}

.schedule_cards_container{
-ms-overflow-style:none;
scrollbar-width:none;
}


.faq {
    max-width:1100px; 
}

.accordion-item {
    border-radius: 12px;
    background: #101012; box-shadow:inset 0 0 0 1px #27272A;
    overflow: hidden;
    margin-bottom: 20px;
    transition: border 0.3s ease; 
    border: 2px solid transparent; 
}

.accordion-item.active {
    border: 1px solid #ffd400;
  
}

.accordion-header {
    background: transparent;
    width: 100%;
    padding: 20px; padding-bottom:27px; padding-top:27px;
    border: none;
    font-size: 24px; 
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.accordion-header .icon {
    transition: transform 0.3s ease, color 0.3s ease;
}

.accordion-header span {
   letter-spacing:0.8px; font-size:20px;
}

.accordion-item.active .icon {
    transform: rotate(180deg);
}

.accordion-content {
    height: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.4s ease, padding 0.3s ease;
}

.accordion-content p {
    font-size: 19px;
    color: #9ca3af;
    line-height: 1.4;
}

.got_questions_container { 
    height:150px; width:417px; margin:auto; margin-top:50px;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
}

.got_questions_container > h3 { color:#FFD700; letter-spacing:4.2px; font-size:22px;}
.got_questions_container > h2 { color:#FFFFFF;  font-size:46px; }

.label_container > span { 
    font-size:26px; 
}

.legal_container  { 
    width:899px;
}

#legal_container_child p { font-size:25px;}
#legal_container_child h3 { font-size:28px;}


#nike_elite_gear_heading_container_child { text-align:center; display:flex; align-items:center; justify-content:space-between; 
    flex-direction:column; height:200px;  width:417px; margin-bottom:30px; width:500px;
}
    #nike_elite_gear_heading_container_child > h3 { color:#FFD700; font-size:46px; letter-spacing:4.2px;}
        #nike_elite_gear_heading_container_child > h4 { color:#FFD700; font-size:22px; letter-spacing:4.2px;}

    #nike_elite_gear_heading_container_child > h2 { color:#FFFFFF; font-size:60px; letter-spacing:4.2px;}
    #nike_elite_gear_heading_container_child > p { color:#A1A1AA; margin-top:10px; font-size:24px; text-align:start;}

section#upcoming_runs_container { 
    min-height:215px; min-width:537px; 
    display:flex; align-items:center; justify-content:center; 
    margin:auto;margin-bottom:30px; margin-top:30px;
}

article#upcoming_runs_container_child  { 
    min-height:180px; 
    min-width:500px; display:flex;  
    align-items:center; justify-content:center;  
    flex-direction:column; gap:15px;
}

article#upcoming_runs_container_child > h3 { color:#FFD700; letter-spacing:3.2px; font-size:22px;}
article#upcoming_runs_container_child > h2 { color:#FFFFFF; letter-spacing:1.8px; font-size:60px; }
article#upcoming_runs_container_child > p { color:#A1A1AA; font-size:24px; line-height:30px; text-align:center; width:290px; }

.got_questions_container { 
    height:150px; width:500px; }
.got_questions_container > h3 { color:#FFD700; letter-spacing:4.2px; font-size:24px;}
.got_questions_container > h2 { color:#FFFFFF;  font-size:60px; }


header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 110px; /* Slightly taller for a premium feel */
    padding: 0 30px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    box-sizing: border-box;
    background-color: transparent;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); /* Smoother curve */
}

#products_show_case_container { margin-top:120px;
}

/* The Glass Effect on Scroll */
header.scrolled {
    background-color: var(--glass-bg);
    backdrop-filter: blur(var(--blur-strength));
    -webkit-backdrop-filter: blur(var(--blur-strength)); /* Safari support */
    border-bottom: 1px solid rgba(255, 255, 255, 0.1); /* Subtle "edge" */
    height: 80px; /* Slight shrink effect on scroll */
}

#main-header > .logo-link > img {
    height: 12px; /* Slightly larger logo */
    transition: height 0.3s ease;
}

#main-header > .store-link > img {
    height: 18px; /* Slightly larger logo */
    transition: height 0.3s ease;
}


#main-header > #menu-open > img {
    height: 25px; /* Slightly larger logo */
    transition: height 0.3s ease;
}


#home_page_merch_button {
    position: relative;
    height: 74px;
    width: 280px;
    margin: 20px auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    background: linear-gradient(145deg, #1a1a1d, #111113);
    border-radius: 14px;
    border: 1px solid #2a2a2e;
    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.5),
        inset 0 0 0 1px rgba(255,255,255,0.04);
    cursor: pointer;
    overflow: hidden;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background 0.3s ease;
}


/* ============================= */
/* PREMIUM CLICK SPRING          */
/* ============================= */

#home_page_merch_button:active {
    animation: nikePress 0.4s cubic-bezier(.34,1.56,.64,1); 
}

@keyframes nikePress {
    0%   { transform: scale(1); }
    35%  { transform: scale(0.88) translateY(2px); } /* compression */
    65%  { transform: scale(1.04); }                 /* overshoot */
    100% { transform: scale(1); }                    /* settle */
}


/* ============================= */
/* TEXT                          */
/* ============================= */

#home_page_merch_button span {
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 1px;
    color: #ffffff;
    transition: letter-spacing 0.25s ease;
}

#home_page_merch_button:hover span {
    letter-spacing: 2px;     
    max-height:100vh; 

}
.products_box{
    width:calc(50% - 398px);
    height:400px;

}

.product_info{

    height:80px;
    padding:15px;
    display:flex;

}

.product_name{

    font-size:19px;
    color:#E4E4E7;
    margin-bottom:4px;
}

.product_price{

    font-size:22px;
    color:#FFD400;
    font-weight:600;
}
.modal_content {
    max-width:700px;
}

.modal_image_wrapper {
    width: 100%;
    height: 520px;
}

.modal_description {
    color: #a1a1aa;
    font-size: 1.3rem;
    line-height: 1.5;
}

.modal_variant_group {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.modal_variant_group h4 {
    color: white;
    font-size: 22px;
    margin: 0;
}

.variant_pills {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.pill {

    padding: 20px 30px;
    font-size: 20px; font-weight: bold;
}

.close_modal {

    color: #a20606;
    font-size: 2.2rem;
    cursor: pointer;

}



#drop_down_menu_container 
    {
display:none;
}


/* ============================= */
/* ICON MOTION                   */
/* ============================= */

#home_page_merch_button lord-icon {
    transition: transform 0.3s ease; height:37px; width:37px;
}

#home_page_merch_button:hover lord-icon {
    transform: translateX(5px);
}

.home_page_product_boxes {
    flex: 0 0 360px;
    height:390px;
  
}

.home_page

.carousel_track {
    gap: 30px;

}


/* ============================= */
/* PREMIUM LIGHT SWEEP           */
/* ============================= */

#home_page_merch_button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 120%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent 30%,
        rgba(255,255,255,0.08),
        transparent 70%
    );
    transition: left 0.6s ease;
}

#home_page_merch_button:hover::before {
    left: 120%;
}
.home_page_product_father_container { margin:auto;  width:1500px;}    

.carousel_viewport::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

.carousel_viewport:active { 
    cursor: grabbing; 
}

.carousel_track {
    display: flex;
    gap: 20px; align-items:center; justify-content:center;
    padding-bottom: 10px; /* Slight breathing room */
}

#products_show_case_main_child_container {
    height: 680px; 

}

}


/* ==========================================================================
   4. 4K & ULTRA-WIDE (Optional)
   Breakpoint: 2560px
   Usage: Only use if you want the cards to remain massive on 4K TVs.
   ========================================================================== */
@media screen and (min-width: 2560px) {

}