/* Extra Small Devices (Phones, up to 480px) */
@media (max-width: 480px) {
    .bunbun-hero-banner-content{
        padding: 3rem 0;
    }

    .bunbun-hero-banner-content h1 {
        padding: 3rem 0 0 0;
        width: 100%;
        font-size: 1.3rem;
    }
    .bunbun-hero-banner-content .bunbun-hero-banner-content-text {
        width: 80%;
        font-size: 0.8rem;
        padding: 1rem;
    }

    .btn-bunbun-black,
    .btn-bunbun-white {
        padding: .5rem 2rem;
        font-size: .7rem;
    }

    .gallary {
        gap: .6rem !important;
    }

    .about-star2 .star::after {
        height: 8rem;
    }

    .about-star1 .star::after {
        height: 11rem;
    }

    .about-star3 .star::after {
        top: 25rem;
        right: -3.5rem;
    }

    .stat-item h2 {
        font-size: 1.5rem;
    }

    .stat-item p {
        font-size: .7rem;
    }

    .about-us-text {
        padding: 0;
    }

    .playfair-title {
        padding-bottom: 1rem !important;
    }

    .about-us-section {
        padding: 0rem 2rem;
    }

    .upper-footer {
        flex-direction: column;
    }

    .lower-footer {
        font-size: 14px;
    }

    .social-media-links {
        width: 100%;
    }
}

/* Small Devices (Tablets, 481px to 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    .bunbun-hero-banner-content {
        padding: 0;
    }
    button:focus {
        outline: none !important;
        box-shadow: none !important;
    }   
    
}

@media (max-width: 768px) {
    .bunbun-hero-banner-content {
        padding: 0;
    }
    .hamburger-lines-checkbox {
        position: absolute;
        display: block;
        height: 32px;
        width: 32px;
        top: 20px;
        right: 20px;
        z-index: 6;
        opacity: 0;
        cursor: pointer;
    }

    .hamburger-lines {
        display: block;
        height: 32px;
        width: 37px;
        position: absolute;
        top: 17px;
        right: 20px;
        z-index: 5;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding: 7px;
        transition: background-color 0.3s ease;
    }

    .hamburger-lines:hover {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .hamburger-lines .line {
        display: block;
        height: 2px;
        width: 100%;
        border-radius: 10px;
        background: white;
        transition: transform 0.4s ease-in-out, background-color 0.3s ease-in-out;
    }

    .hamburger-lines .line1 {
        transform-origin: 0% 0%;
    }

    .hamburger-lines .line2 {
        transform-origin: 50%;
    }

    .hamburger-lines .line3 {
        transform-origin: 0% 100%;
    }

    .navbar-nav {
        display: none;
    }

    /* Menu Items */
    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .navbar-nav {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        position: fixed;
        background: rgba(0, 0, 0, 0.95);
        color: white !important;
        top: 0;
        left: 0;
        height: 105vh;
        z-index: 4;
        overflow: hidden;
        opacity: 0;
        transform: translateY(-10%);
        transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
    }

    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .navbar-nav {
        opacity: 1;
        transform: translateY(0);
    }

    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .navbar-nav .nav-link {
        color: white !important;
        font-size: 1.5rem;
        margin: 10px 0;
        text-align: center;
        text-decoration: none;
        transition: color 0.3s ease;
        animation: fadeIn 0.8s ease-in-out both;
    }

    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .navbar-nav .nav-link:hover {
        color: #FFD700; /* Gold color for hover effect */
    }

    /* Hamburger Lines */
    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .hamburger-lines .line1 {
        transform: rotate(45deg);
    }
    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .hamburger-lines .line2 {
        transform: scaleY(0);
    }
    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .hamburger-lines .line3 {
        transform: rotate(-45deg);
    }

    /* Logo */
    input[type="checkbox"].hamburger-lines-checkbox:checked ~ .logo {
        display: none;
    }

    /* Animations */
    @keyframes fadeIn {
        0% {
            opacity: 0;
            transform: translateY(-20px);
        }
        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* Medium Devices (Small Laptops, 769px to 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    
}

/* Large Devices (Desktops, 1025px to 1200px) */
@media (min-width: 1025px) and (max-width: 1200px) {
    
}

/* Extra Large Devices (Large Desktops, 1201px and up) */
@media (min-width: 1201px) {
    
}