body{
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto;
background:#f5f7fb;
scroll-behavior:smooth;
overflow-x:hidden;
}

/* STICKY GLASS NAVBAR */

.navbar{
position:sticky;
top:20px;
z-index:999;
margin:20px;
border-radius:50px;
background:rgba(255,255,255,0.65);
backdrop-filter:blur(20px);
box-shadow:0 10px 40px rgba(0,0,0,0.08);
}

.navbar-brand{
font-weight:700;
font-size:22px;
}

.btn-login{
border-radius:40px;
padding:8px 25px;
}


/* HERO SECTION */
/* HERO WRAPPER */

.hero-wrapper{
margin:30px;
border-radius:50px;
overflow:hidden;
position:relative;
background:#fff;
}
.hero-slide{
height:85vh;
background-size:cover;
background-position:center;
display:flex;
align-items:center;
position:relative;
padding-left:80px;
}

/* overlay */

.hero-slide::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%; 
}

/* text */

.hero-content{
position:relative;
color:white;
max-width:550px;
z-index:2;
}
/* MOBILE */

@media(max-width:768px){

.hero-wrapper{
margin:15px;
border-radius:30px;
overflow:hidden;
}

.hero-slide{
height:65vh;
border-radius:30px;
}

}
/* TEXT */

.hero-content{
position:relative;
color:white;
max-width:650px;
}

.hero-content h1{
font-size:60px;
font-weight:700;
}

.hero-content p{
font-size:20px;
margin-top:20px;
}

.hero-content .btn{
margin-top:18px;
border-radius:10px; 
}

.carousel-indicators [data-bs-target] { background:#ccc; width: 20px; }
/* DOTS */

.hero-dots{
bottom:20px;
}

.hero-dots button{

width:10px;
height:10px;
border-radius:50%;
background:#bbb;
border:none;
margin:5px;
opacity:1;
}

.hero-dots .active{
background:#000;
width:20px;
border-radius:15px;
}


/* MOBILE */

@media(max-width:768px){

.hero-wrapper{
margin:15px;
border-radius:25px;
}

.hero-slide{
height:75vh;
}

.hero-content h1{
font-size:34px;
}

.hero-content p{
font-size:16px;
}

}

    
/* APPLE STYLE PRODUCT SECTIONS */

.product-section{
padding:120px 0;
text-align:center;
}

.product-section h2{
font-size:48px;
font-weight:700;
}

.product-section p{
max-width:650px;
margin:auto;
margin-top:20px;
color:#555;
}

.product-section img{
margin-top:40px;
border-radius:30px;
box-shadow:0 20px 60px rgba(0,0,0,0.1);
}


/* TESLA STYLE FULL SCREEN SECTIONS */

.tesla-section{
height:100vh;
background-size:cover;
background-position:center;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
}

.tesla-overlay{
background:rgba(0,0,0,0.4);
padding:60px;
border-radius:30px;
}

.tesla-section h2{
font-size:50px;
font-weight:700;
}

.tesla-section .btn{
border-radius:40px;
padding:14px 35px;
margin-top:20px;
}


/* 3D CARDS */

.cards-section{
padding:20px 0;
}

.card-3d{
background:white;
border-radius:30px;
padding:40px;
text-align:center;
box-shadow:0 20px 40px rgba(0,0,0,0.08);
transition:all .4s;
transform-style:preserve-3d;
}

.card-3d:hover{
transform:rotateY(10deg) rotateX(10deg) scale(1.05);
box-shadow:0 40px 70px rgba(0,0,0,0.15);
}

.card-icon{
font-size:50px;
color:#4f46e5;
margin-bottom:15px;
}


/* PRICING */

.pricing{
padding:120px 0;
}

.price-card{
background:white;
border-radius:30px;
padding:50px;
text-align:center;
box-shadow:0 20px 60px rgba(0,0,0,0.08);
transition:.4s;
}

.price-card:hover{
transform:translateY(-12px) scale(1.05);
}

.price{
font-size:50px;
font-weight:700;
color:#4f46e5;
}

.featured{
background:linear-gradient(135deg,#4f46e5,#9333ea);
color:white;
}

.featured .price{
color:white;
}


/* FOOTER */

footer{
background:#0f172a;
color:white;
padding:80px 0;
}

.footer-links a{
color:#bbb;
display:block;
margin-bottom:10px;
text-decoration:none;
}

.footer-links a:hover{
color:white;
}


/* MOBILE */

@media(max-width:768px){

.hero h1{
font-size:36px;
}

.product-section h2{
font-size:32px;
}

.tesla-section h2{
font-size:34px;
}

}


    @media (max-width:768px){

section{
padding-top:40px !important;
padding-bottom:0px !important;
}

.card{
border-radius:20px;
}

.hero{
border-radius:25px;
margin:15px;
}

.navbar{
margin:10px;
border-radius:25px;
}

}


.parallax-section{
height:80vh;
 
background-attachment:fixed;
background-position:center;
background-repeat:no-repeat;
background-size:cover;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
position:relative;
}

.parallax-overlay{
background:rgba(0,0,0,0.5);
padding:60px;
border-radius:30px;
}



    .full-parallax{
height:80vh;
background:url('https://images.unsplash.com/photo-1551281044-8d8d3b09f7f2') center/cover fixed;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
}

.full-parallax h2{
font-size:60px;
font-weight:700;
}

.full-parallax p{
font-size:20px;
margin-top:20px;
}



    .parallax-cta{
background-image:url('https://images.unsplash.com/photo-1504384308090-c894fdcc538d');
background-attachment:fixed;
background-size:cover;
background-position:center;
padding:120px 0;
text-align:center;
color:white;
}

.parallax-cta h2{
font-size:50px;
font-weight:700;
}

.parallax-cta p{
font-size:20px;
margin-top:15px;
}


    @media (max-width:768px){

.parallax-section,
.parallax-cta,
.full-parallax{
background-attachment:scroll;
height:auto;
padding:80px 20px;
}

}




    .footer{
background:#0f172a;
color:#cbd5f5;
padding:80px 0 40px;
}

.footer-logo{
color:white;
font-weight:700;
margin-bottom:15px;
}

.footer-text{
font-size:14px;
line-height:1.6;
}

.footer-links h6{
color:white;
margin-bottom:15px;
font-weight:600;
}

.footer-links a{
display:block;
color:#94a3b8;
text-decoration:none;
margin-bottom:8px;
font-size:14px;
transition:.2s;
}

.footer-links a:hover{
color:white;
padding-left:3px;
}

.social-icons a{
display:inline-block;
color:white;
font-size:18px;
margin-right:10px;
background:#1e293b;
padding:8px 10px;
border-radius:8px;
transition:.3s;
}

.social-icons a:hover{
background:#4f46e5;
}

.footer-divider{
border-color:#1e293b;
margin:40px 0 20px;
}

.footer-bottom{
display:flex;
justify-content:space-between;
flex-wrap:wrap;
font-size:14px;
color:#94a3b8;
}

.small-text{
font-size:12px;
}