*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial,sans-serif;
}

body{
    background:#f5f5f5;
    color:#111;
}


/* HEADER */

header{
    background:#0b0b0b;
    padding:25px 8%;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.logo{
    color:white;
    font-size:36px;
    font-weight:900;
    letter-spacing:2px;
}

nav a{
    color:white;
    text-decoration:none;
    margin-left:25px;
    font-weight:bold;
}

nav a:hover{
    color:#ff6b00;
}


/* BUTTON */

.button{
    display:inline-block;
    background:#ff6b00;
    color:white;
    padding:15px 35px;
    border-radius:30px;
    text-decoration:none;
    font-weight:bold;
    transition:.3s;
}

.button:hover{
    transform:translateY(-5px);
}


/* HOME HERO */

.hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:90px 8%;
    background:white;
}

.hero-text{
    width:50%;
}

.hero-text h1{
    font-size:65px;
    font-weight:900;
}

.hero-text p{
    font-size:20px;
    color:#666;
    margin:25px 0 35px;
}

.hero-image{
    width:45%;
}

.hero-image img{
    width:100%;
    border-radius:30px;
}


/* PRODUCTS */

.featured{
    padding:90px 8%;
}

.featured h2{
    text-align:center;
    font-size:50px;
    margin-bottom:60px;
}


.products{
    display:flex;
    justify-content:center;
    gap:40px;
}


.product{
    width:330px;
    background:white;
    border-radius:30px;
    overflow:hidden;
    text-align:center;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
    padding-bottom:30px;
    transition:.3s;
}

.product:hover{
    transform:translateY(-12px);
}


.product img{
    width:100%;
    height:280px;
    object-fit:cover;
}


.product h3{
    font-size:28px;
    margin:25px 0 10px;
}


.product p{
    color:#ff6b00;
    font-size:25px;
    font-weight:bold;
    margin-bottom:20px;
}


/* PRODUCT DETAILS */

.product-page{
    display:flex;
    align-items:center;
    gap:70px;
    padding:100px 8%;
    background:white;
}


.product-image{
    width:50%;
}


.product-image img{
    width:100%;
    border-radius:30px;
    box-shadow:0 20px 40px rgba(0,0,0,.2);
}


.product-info{
    width:50%;
}


.product-info h1{
    font-size:55px;
}


.product-info h2{
    color:#ff6b00;
    font-size:40px;
    margin:20px 0;
}


.product-info p{
    font-size:20px;
    color:#666;
}


.details{
    background:#f5f5f5;
    padding:25px;
    border-radius:20px;
    margin:30px 0;
}


/* CART */

#cart-items{
    display:flex;
    justify-content:center;
    gap:40px;
    flex-wrap:wrap;
}


#cart-items .product{
    width:350px;
}


#total{
    text-align:center;
    margin:40px;
    font-size:40px;
    font-weight:bold;
}


/* FOOTER */

footer{
    background:#0b0b0b;
    color:white;
    text-align:center;
    padding:25px;
}

/* BEAUTIFUL CART */

.cart-section{
    padding:80px 8%;
    background:#f5f5f5;
    min-height:700px;
}

.cart-section h2{
    text-align:center;
    font-size:50px;
    margin-bottom:40px;
}


#cart-items{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:40px;
}


#cart-items .product{
    width:330px;
    background:white;
    border-radius:25px;
    overflow:hidden;
    text-align:center;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
    transition:.3s;
}


#cart-items .product:hover{
    transform:translateY(-10px);
}


#cart-items img{
    width:100%;
    height:280px;
    object-fit:cover;
}


#cart-items h3{
    font-size:26px;
    margin:20px 0 10px;
}


#cart-items p{
    color:#ff6b00;
    font-size:25px;
    font-weight:bold;
    margin-bottom:25px;
}


#total{
    background:#111;
    color:white;
    width:320px;
    margin:50px auto;
    padding:20px;
    text-align:center;
    border-radius:30px;
    font-size:30px;
    font-weight:bold;
}

/* NEW CART DESIGN */

.cart-page{
    padding:80px 8%;
    background:#f5f5f5;
    min-height:700px;
}

.cart-page h2{
    text-align:center;
    font-size:50px;
    margin-bottom:50px;
}

#cart-items{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:40px;
}


#cart-items .product{
    width:320px;
    background:white;
    border-radius:25px;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,0.15);
    text-align:center;
    transition:.3s;
}


#cart-items .product:hover{
    transform:translateY(-10px);
}


#cart-items .product img{
    width:100%;
    height:260px;
    object-fit:cover;
}


#cart-items .product h3{
    font-size:26px;
    margin:20px 0 10px;
}


#cart-items .product p{
    font-size:24px;
    color:#ff6b00;
    font-weight:bold;
    margin-bottom:25px;
}


#total{
    margin:50px auto 0;
    background:#111;
    color:white;
    width:300px;
    padding:20px;
    border-radius:30px;
    text-align:center;
    font-size:30px;
    font-weight:bold;
}

/* CLEAN CART */

.cart-page{
    padding:90px 8%;
    background:#f5f5f5;
    min-height:700px;
}

.cart-page h2{
    text-align:center;
    font-size:55px;
    margin-bottom:50px;
    font-weight:900;
}


#cart-items{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:35px;
}


#cart-items .product{
    width:330px;
    background:white;
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 20px 45px rgba(0,0,0,.15);
    text-align:center;
    transition:.3s;
}


#cart-items .product:hover{
    transform:translateY(-10px);
}


#cart-items .product img{
    width:100%;
    height:280px;
    object-fit:cover;
}


#cart-items .product h3{
    font-size:28px;
    margin:25px 0 10px;
}


#cart-items .product p{
    color:#ff6b00;
    font-size:26px;
    font-weight:bold;
    margin-bottom:25px;
}


#total{
    margin:50px auto;
    background:#111;
    color:white;
    width:300px;
    padding:20px;
    border-radius:30px;
    text-align:center;
    font-size:30px;
    font-weight:bold;
}

.login-page{
    min-height:600px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:#f5f5f5;
}

.login-box{
    background:white;
    width:400px;
    padding:40px;
    border-radius:30px;
    text-align:center;
    box-shadow:0 20px 40px rgba(0,0,0,.15);
}

.login-box h1{
    font-size:45px;
    margin-bottom:30px;
}

.login-box input{
    width:100%;
    padding:15px;
    margin:10px 0;
    border-radius:15px;
    border:1px solid #ccc;
    font-size:18px;
}

.login-box .button{
    border:none;
    margin-top:20px;
    cursor:pointer;
}

.login-box textarea{
    width:100%;
    height:120px;
    padding:15px;
    margin:10px 0;
    border-radius:15px;
    border:1px solid #ccc;
    font-size:18px;
    resize:none;
}

body{
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

footer{
    margin-top:auto;
}

.details select{
    width:120px;
    padding:10px;
    font-size:18px;
    border-radius:10px;
    border:1px solid #ccc;
    margin-top:10px;
}