body{
background:#0b0b0b;
color:white;
font-family:Arial;
margin:0;
}

/* HEADER */

.header{
background:#000;
border-bottom:1px solid #222;
}

/* TOP ROW */

.header-top{

display:flex;
align-items:center;
justify-content:space-between;
padding:15px 40px;

}

/* LOGO */

.logo{
display:flex;
align-items:center;
gap:8px;
}

.logo img{
height:60px;
width:auto;
}

.logo-text{
font-size:18px;
}

.zebra{
font-weight:bold;
}

.logo{
color:#fff !important;   /* 🔥 white */
}

/* SEARCH BAR CONTAINER */

.search-container{

display:flex;
align-items:center;
background:#0f0f0f;

border:1px solid #2a2a2a;
border-radius:30px;

padding:6px 10px;

gap:20px;

}

/* SEARCH BOX */

.search-box{

display:flex;
align-items:center;
gap:8px;

}

.search-container{

display:flex;
align-items:center;

background:#0f0f0f;

border-radius:10px;

padding:10px 20px;

}

.search-box input{

width:460px;
height: 1px;

padding:12px;

border:none;
background:transparent;

color:white;

}

/* SEARCH ICON */

.search-icon{

font-size:14px;
color:#aaa;

}

/* LINKS */

.search-links{

display:flex;
align-items:center;
gap:20px;

}

.search-links a{

color:white;
text-decoration:none;
font-size:14px;
padding:8px 16px;
position:relative;

}

/* vertical divider */

.search-links a:not(:last-child)::after{

content:"";

position:absolute;

right:0;
top:25%;
height:50%;

width:1px;

background:#444;

}



/* BADGE */



/* RIGHT LINKS */

.header-right{

display:flex;
align-items:center;
gap:20px;

}

.header-right a{

color:white;
text-decoration:none;
font-size:14px;

}

/* ===== HERO ARROW FIX ===== */


.hero-slider{
position:relative;
width:90%;
margin:auto;
overflow:hidden;
}

/* slide */

.slide{
display:none;
}

.slide.active{
display:block;
}

.slide img{
width:100%;
border-radius:12px;
}

/* 🔥 PERFECT ARROWS */

.hero-slider .prev,
.hero-slider .next{
position:absolute;
top:50%;
transform:translateY(-50%);

background:rgba(0,0,0,0.6);
color:#fff;
border:none;

width:50px;
height:50px;

border-radius:50%;
cursor:pointer;
z-index:10;

display:flex;
align-items:center;
justify-content:center;
}

/* inside image */

.hero-slider .prev{
left:20px;
}

.hero-slider .next{
right:20px;
}

.hero-slider .prev:hover,
.hero-slider .next:hover{
background:#ff6a2c;
}

/* BADGE */

.badge{

background:red;
padding:2px 6px;
border-radius:6px;
font-size:11px;
margin-left:4px;

}

.learn-btn{

position:absolute;
left:60px;
bottom:60px;

/* 🔥 size increase */
width:150px;
height:45px;

/* 🔥 center text */
display:flex;
align-items:center;
justify-content:center;

/* design */
background:#fff;
color:#080808;
border:none;
border-radius:15px;

font-size:16px;
font-weight:500;
cursor:pointer;

transition:0.3s;
}

/* hover */

.learn-btn:hover{
background:#ff8a50;
transform:scale(1.05);
}

/* ICONS */

.icons{

display:flex;
align-items:center;
gap:10px;

}

/* COMMON BUTTON STYLE */

.icon-btn{

display:flex;
align-items:center;
gap:6px;

background:#1a1a1a;
padding:6px 10px;

border-radius:25px;

cursor:pointer;

}

.icons img{

height:22px;

}

.coin{

background:#111;
padding:4px 8px;
border-radius:20px;
font-size:14px;
}


/* FLAG */

.flag{
height:22px;
}

/* PROFILE + DRAWER */

.profile-menu{
display:flex;
align-items:center;
gap:8px;
background:#1a1a1a;
padding:5px 10px;
border-radius:20px;
}

/* USER IMAGE */

.user{
height:26px;
width:26px;
border-radius:50%;
}

/* HAMBURGER */

.hamburger{
display:flex;
flex-direction:column;
gap:3px;
cursor:pointer;
}

.hamburger span{
width:16px;
height:2px;
background:white;
display:block;
}

/* SECOND ROW */

.header-bottom{

display:flex;
justify-content: center;
align-items:center;
gap:20px;
padding:12px 40px;
border-top:1px solid #222;

}
/* MENU */

.nav-menu{

display:flex;

gap:15px;

}

.nav-menu a{

background:#1a1a1a;

padding:8px 16px;

border-radius:10px;

color:white;

text-decoration:none;

}

.header-bottom nav{

display:flex;
gap:15px;

}

.header-bottom nav a{

background:#1a1a1a;
padding:8px 16px;
border-radius:10px;
color:white;
text-decoration:none;

}

/* ZAI BUTTON */

.zai{

background:#111;
border:1px solid #444;
color:white;
padding:6px 14px;
border-radius:8px;

}

/*Top banner */
.hero{
width:100%;
background:black;
padding:40px 0;
}

.hero-slider{
position:relative;
width:90%;
margin:auto;
display:flex;
justify-content:center;
align-items:center;
}

.slide{
display:none;
}

.slide.active{
display:block;
}

.slide img{
width:100%;
border-radius:12px;
}

.prev,
.next{

position:absolute;
top:50%;
transform:translateY(-50%);
background:#222;
border:none;
color:white;
font-size:24px;
width:45px;
height:45px;
border-radius:50%;
cursor:pointer;

}

.prev{
left:-25px;
}

.next{
right:-25px;
}

.prev:hover,
.next:hover{
background:#444;
}

.book-detail{
display:flex;
gap:60px;
padding:60px;
background:#000;
color:white;
}

.book-right img{
width:260px;
border-radius:10px;
}

/* FOOTER */

.footer{
background:#000;
color:#ccc;
padding:60px 40px;
font-family:Arial;
}

.footer-container{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:40px;
margin-bottom:50px;

}

.footer-col h4{

color:white;
margin-bottom:15px;
font-size:16px;

}

.footer-col ul{

list-style:none;
padding:0;
margin:0;

}

.footer-col li{

margin-bottom:8px;
font-size:14px;
color:#aaa;
cursor:pointer;

}

.footer-col li:hover{

color:white;

}

/* BANNER */

.footer-banner{

background:#6b1208;
padding:30px;

display:flex;
align-items:center;
justify-content:space-between;

color:white;
margin:40px 0;

}

.footer-banner button{

background:white;
border:none;

padding:10px 20px;
border-radius:6px;

cursor:pointer;

}

/* BOTTOM */

.footer-bottom{

display:flex;
align-items:center;
justify-content:space-between;

padding:30px 0;

border-top:1px solid #222;
border-bottom:1px solid #222;

}

.footer-logo{

font-size:28px;
color:white;

}

.zebra{

font-weight:bold;

}

.social{

display:flex;
gap:15px;

}

.social a{

color:white;

font-size:18px;

background:#1a1a1a;

padding:10px;

border-radius:6px;

transition:0.3s;

}

.social a:hover{

background:#333;

}

.social span{

margin-right:10px;
font-size:18px;

}

.back-top{

background:#222;
padding:10px 14px;
border-radius:50%;

}

/* COPYRIGHT */

.footer-copy{

display:flex;
align-items:center;
justify-content:space-between;

margin-top:20px;

}

.footer-copy a{

color:#ccc;
margin-left:15px;
text-decoration:none;

}

.footer-copy a:hover{

color:white;

}
/* ================= TOP BOOKS ================= */

/* ===== TOP BOOKS SECTION ===== */

.top-books{
background:#000;
padding:40px 20px;   /* 🔥 padding kam */
}

/* wrapper */

.books-wrapper{
position:relative;
display:flex;
align-items:center;
}

/* slider */

.books-slider{
display:flex;
gap:30px; 
overflow-x:auto;
scroll-behavior:smooth;
}

.books-slider::-webkit-scrollbar{
display:none;
}

/* card */

.book-card{
position:relative;
min-width:120px;
height:200px;
flex-shrink:0;
}

/* 🔥 NUMBER IMAGE (90%) */

.number-bg{
position:absolute;
left:0;
bottom:0;

width:100%;
opacity:0.9;
z-index:1;
}

/* 🔥 BOOK IMAGE (10% overlap) */

.top-book-img{
position:absolute;
left:70px;   /* 🔥 overlap control */
bottom:0;

width:110px;
height:150px;

object-fit:cover;
border-radius:8px;

z-index:2;
}

.top-books h2,
.top-books p{
color:#fff;
}
/* arrows */

.books-wrapper .arrow{
position:absolute;
top:50%;
transform:translateY(-50%);

background:#222;
color:#fff;
border:none;

width:45px;
height:45px;

border-radius:50%;
cursor:pointer;
z-index:5;
}

.books-wrapper .arrow.left{
left:-15px;
}

.books-wrapper .arrow.right{
right:-15px;
}

.books-wrapper .arrow:hover{
background:#ff6a2c;
}
/* ================== Top Books free ==================*/

/* ===== FREE SECTION ===== */

.free-section{
background:#000;
padding:60px 20px;
}

/* header */

.free-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:20px;
}

.free-header h2{
color:#fff;
}

.free-explore{
color:#ff6a2c;
text-decoration:none;
font-weight:600;
margin-right:1000px;   /* extra spacing */
}

/* wrapper */

.free-wrapper{
position:relative;
display:flex;
align-items:center;
gap:15px;   
}

/* 🔥 MAIN FIX (one line scroll) */

.free-slider{
display:flex;
flex-direction:row;      /* 🔥 force row */
gap:12px;

overflow-x:auto;
scroll-behavior:smooth;
}

.free-slider::-webkit-scrollbar{
display:none;
}

/* 🔥 CARD SIZE FIX */

.free-card{
position:relative;
min-width:120px;     /* 🔥 small size */
flex-shrink:0;
}

/* 🔥 IMAGE SIZE SMALL */

.free-card img{
width:120px;
height:170px;

object-fit:cover;
border-radius:10px;
}

/* FREE TAG */

.free-card::before{
content:"FREE";
position:absolute;
top:1px;
left:1px;

background:#000;
color:#fff;

font-size:10px;
padding:3px 6px;
border-radius:5px;
}

/* arrows */

.free-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);

background:#222;
color:#fff;
border:none;

width:40px;
height:40px;

border-radius:50%;
cursor:pointer;
z-index:10;
}

.free-arrow.left{
left:-10px;
}

.free-arrow.right{
right:-10px;
}

.free-arrow:hover{
background:#ff6a2c;
}

/* ===== FEATURED SECTION ===== */

.featured-section{
background:#000;
padding:60px 30px;
}

/* heading */

.featured-heading{
color:#fff;
font-size:28px;
margin-bottom:25px;
}

/* wrapper */

.featured-container{
position:relative;
display:flex;
align-items:center;
}

/* slider */

.featured-slider{
display:flex;
gap:18px;

overflow-x:auto;
scroll-behavior:smooth;
}

.featured-slider::-webkit-scrollbar{
display:none;
}

/* card */

.featured-card{
min-width:160px;   /* 🔥 bigger */
flex-shrink:0;
}

/* image */

.featured-card img{
width:160px;
height:220px;

object-fit:cover;
border-radius:12px;
}

/* arrows */

.featured-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);

background:#222;
color:#fff;
border:none;

width:45px;
height:45px;

border-radius:50%;
cursor:pointer;
z-index:10;
}

.featured-arrow.left{
left:-15px;
}

.featured-arrow.right{
right:-15px;
}

.featured-arrow:hover{
background:#ff6a2c;
}

/* ===== BESTSELLER SECTION ===== */

.bestseller-section{
background:#000;
padding:60px 30px;
}

/* title */

.bestseller-title{
color:#fff;
font-size:28px;
margin-bottom:25px;
}

/* wrapper */

.bestseller-wrapper{
position:relative;
display:flex;
align-items:center;
}

/* slider */

.bestseller-slider{
display:flex;
gap:18px;

overflow-x:auto;
scroll-behavior:smooth;
}

.bestseller-slider::-webkit-scrollbar{
display:none;
}

/* card */

.bestseller-card{
min-width:160px;
flex-shrink:0;
}

/* image */

.bestseller-card img{
width:160px;
height:220px;

object-fit:cover;
border-radius:12px;

transition:0.3s;
}

/* hover */

.bestseller-card img:hover{
transform:scale(1.05);
}

/* arrows */

.bestseller-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);

background:#222;
color:#fff;
border:none;

width:45px;
height:45px;

border-radius:50%;
cursor:pointer;
z-index:10;
}

.bestseller-arrow.left{
left:-15px;
}

.bestseller-arrow.right{
right:-15px;
}

.bestseller-arrow:hover{
background:#ff6a2c;
}

/* ===== SECTION ===== */

.coming-section{
background:#000;
padding:60px 30px;
}

/* TITLE */

.coming-title{
color:#fff;
font-size:26px;
margin-bottom:25px;
}

/* WRAPPER */

.coming-wrapper{
display:flex;
}

/* SLIDER */

.coming-slider{
display:flex;
gap:20px;
}

/* CARD */

.coming-card{
position:relative;   /* 🔥 IMPORTANT */
min-width:180px;
flex-shrink:0;
text-decoration:none;
}

/* IMAGE */

.coming-card img{
width:180px;
height:240px;

object-fit:cover;
border-radius:12px;

transition:0.3s;
}

/* 🔥 PRE ORDER TAG (TOP LEFT) */

.coming-card::before{
content:"Pre Order";

position:absolute;
top:1px;
right:1px;

background:#7b2cff;   /* purple */
color:#fff;

font-size:11px;
font-weight:600;

padding:5px 10px;
border-radius:8px;

z-index:2;
}

/* HOVER */

.coming-card img:hover{
transform:translateY(-6px);
box-shadow:0 10px 25px rgba(0,0,0,0.6);
}

/* ===== COURSES (FREE STYLE) ===== */

.courses-section{
background:#000;
padding:60px 30px;
}

/* TITLE */

.courses-heading{
color:#fff;
font-size:28px;
margin-bottom:25px;
}

/* WRAPPER */

.courses-wrapper{
display:flex;
}

/* 🔥 MAIN SLIDER */

.courses-slider{
display:flex;
gap:15px;

overflow-x:auto;
scroll-behavior:smooth;
}

.courses-slider::-webkit-scrollbar{
display:none;
}

/* CARD */

.courses-card{
min-width:140px;
flex-shrink:0;
}

/* IMAGE */

.courses-card img{
width:140px;
height:180px;

object-fit:cover;
border-radius:10px;

display:block;
}

/* TITLE */

.courses-card p{
color:#fff;
font-size:13px;
margin-top:8px;
}

/* HOVER */

.courses-card img:hover{
transform:translateY(-5px);
transition:0.3s;
}

/* ===== COURSES FIX ===== */

.courses-card{
min-width:220px;
flex-shrink:0;
}

/* 🔥 SAME SIZE FOR ALL IMAGES */

.courses-card img{
width:350px;
height:180px;        /* 🔥 fixed height */

object-fit:cover;    /* 🔥 image crop fit */
border-radius:12px;  /* 🔥 rounded corners */

display:block;
}

/* TITLE */

.courses-card p{
color:#fff;
font-size:14px;
margin-top:8px;
}

/* HOVER (optional premium look) */

.courses-card:hover img{
transform:scale(1.05);
transition:0.3s;
}

/* ===== SCHOOLS SECTION ===== */

.schools-section{
background:#000;
padding:60px 20px;
}

/* TITLE */

.school-title{
color:#fff;
font-size:26px;
margin-bottom:25px;
}

/* WRAPPER */

.schools-wrapper{
position:relative;
display:flex;
align-items:center;
}

/* 🔥 SLIDER */

.school-row{
display:flex;
gap:12px;

overflow-x:auto;
scroll-behavior:smooth;
}

.school-row::-webkit-scrollbar{
display:none;
}

/* CARD */

.school-card{
min-width:130px;
flex-shrink:0;
}

/* IMAGE (SMALL SIZE) */

.school-card img{
width:370px;
height:320px;

object-fit:cover;
border-radius:8px;
}

/* TEXT */

.chapter{
color:#aaa;
font-size:11px;
margin-top:6px;
}

.school-card h3{
color:#fff;
font-size:12px;
margin-top:3px;
}

/* 🔥 ARROWS */

.school-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);

background:#222;
color:#fff;
border:none;

width:40px;
height:40px;

border-radius:50%;
cursor:pointer;
z-index:10;
}

.school-arrow.left{
left:-10px;
}

.school-arrow.right{
right:-10px;
}

.school-arrow:hover{
background:#ff6a2c;
}

/* ===== BUNDLES FORCE FIX ===== */

.bundles{
background:#000 !important;
padding:70px 30px !important;
}

/* 🔥 TITLE LEFT FIX */

.bundles .bundle-title{
text-align:left !important;
color:#fff !important;
font-size:28px !important;
margin-bottom:25px !important;
}

/* 🔥 SCROLL ROW */

.bundles .bundle-row{
display:flex !important;
flex-direction:row !important;

gap:20px !important;

overflow-x:auto !important;
scroll-behavior:smooth;
}

.bundles .bundle-row::-webkit-scrollbar{
display:none;
}

/* 🔥 CARD SIZE */

.bundles .bundle-card{
min-width:280px !important;   /* 🔥 bigger width */
flex-shrink:0 !important;

background:#111 !important;
padding:12px !important;
border-radius:12px !important;
}

/* 🔥 IMAGE SIZE FORCE */

.bundles .bundle-card img{
width:100% !important;
height:180px !important;   /* 🔥 increase height */

object-fit:cover !important;
border-radius:10px !important;

display:block;
}

/* TEXT */

.bundles .bundle-card h3{
color:#fff !important;
font-size:15px !important;
margin-top:10px !important;
}

/* HOVER */

.bundles .bundle-card:hover{
transform:translateY(-6px);
border:1px solid #ff6a2c;
}
/* ===== PRICING CARD ===== */

.pricing-card{
position:relative;
background:#111;
border:1px solid #444;
border-radius:16px;
padding:30px 20px;
color:#fff;
}

/* 🔥 HIGHLIGHT CARD */

.pricing-card.highlight{
border:0px solid #fff;
}

/* 🔥 BADGE (CENTER OVER BORDER) */

.pricing-card .badge{
position:absolute;
top:-25px;
left:50%;
transform:translateX(-90%);

background:#2ecc71;   /* green */
color:#000;

padding:6px 18px;
border-radius:20px;

font-size:12px;
font-weight:600;

white-space:nowrap;
}

/* 🔥 BUTTON */

.pricing-card button{
width:100%;
padding:12px;

background:#ff6a2c;
color:#fff;

border:none;
border-radius:10px;

font-weight:600;
margin:15px 0;
cursor:pointer;
}

/* 🔥 LIST */

.pricing-card ul{
list-style:none;
padding:0;
margin:0;
}

.pricing-card li{
margin-bottom:10px;
font-size:14px;
}

/* ✅ CHECK GREEN */

.pricing-card li::before{
content:"✔ ";
color:#2ecc71;
font-weight:bold;
}

/* ❌ CROSS RED (last item manually class se control karenge) */

.pricing-card li.cross::before{
content:"✖ ";
color:#e74c3c;
}
/* 🔥 BADGE CLEAN STYLE */

.pricing-card .badge{
position:absolute;
top:-14px;
left:50%;
transform:translateX(-50%);

/* 🔥 transparent background */
background:transparent;

/* 🔥 green border */
border:2px solid #2ecc71;

/* 🔥 green text */
color:#2ecc71;

padding:5px 16px;
border-radius:20px;

font-size:12px;
font-weight:600;

white-space:nowrap;
}

/* ===== SECTION GAP FIX ===== */


.top-books,
.free-books,
.featured,
.bundles,
.schools,
.courses{
padding-top:10px !important;
padding-bottom:10px !important;
}

/* ===== HEADING GAP FIX ===== */

.top-books h2,
.free-books h2{
margin-bottom:5px !important;
}

/* sub text */

.top-books p{
margin-bottom:15px !important;
color:#aaa;
}

/* ===== FREE HEADER FIX ===== */

.section-head{
margin-bottom:10px !important;  
}

/* Explore All spacing */

.explore-btn{
margin-left:10px;
font-size:14px;
}

/* ===== SLIDER GAP FIX ===== */

.books-wrapper{
margin-top:10px !important;
}

/* ===== EXTRA GAP REMOVE ===== */

h2, h3, p{
margin-top:0;
}

/* optional ultra compact */

.top-books{
padding-bottom:20px !important;
}

.free-books{
padding-top:20px !important;
}
/* ================== download app ==================*/

/* APP BANNER */

.app-banner{

width:100%;
height:420px;

background-size:cover;
background-position:right center;
background-repeat:no-repeat;

display:flex;
align-items:center;

padding-left:80px;

}

/* TITLE */

.app-title{

font-size:44px;
color:#ff6a2c;

font-weight:bold;
margin-bottom:10px;

}

/* TEXT */

.app-text{

font-size:18px;
margin-bottom:20px;
color:#fff !important;
}

/* DOWNLOAD BUTTON */

.download-btn{

display:inline-block;

background:#ff6a2c;
color:white;

padding:16px 40px;

font-size:18px;
font-weight:bold;

border-radius:40px;

text-decoration:none;

margin-bottom:25px;

}

/* QR + STORES */

.app-download{

display:flex;
align-items:center;
gap:20px;

}

.qr{

width:110px;

}

.store-img{

width:150px;
display:block;

margin-bottom:10px;

}
/* ===== TESTIMONIAL SLIDER FIX ===== */

.testimonial-slider{
position:relative;
max-width:900px;
margin:auto;
text-align:center;
}

.testimonial-item{
display:none;
}

.testimonial-item.active{
display:block;
}

.testimonial-item p{
font-size:22px;
line-height:1.7;
color:#ddd;
margin-bottom:25px;
}

.testimonial-item h4{
color:white;
font-size:18px;
margin-bottom:5px;
}

.testimonial-item span{
color:#aaa;
font-size:14px;
}

/* dots */

.testimonial-dots{
margin-top:20px;
}

.testimonial-dots span{
width:8px;
height:8px;
background:#555;
display:inline-block;
border-radius:50%;
margin:5px;
}

.testimonial-dots span.active{
background:#ff6a2c;
}
/* ===== TESTIMONIAL SECTION ===== */

.testimonial{

background:#000;

padding:80px 20px;

display:flex;

justify-content:center;

}

/* frame/card */

.testimonial-card{

background:#111;

border-radius:18px;

padding:60px 80px;

max-width:900px;

width:100%;

text-align:center;

}

/* quote icon */

.quote{

font-size:60px;

color:#ff6a2c;

margin-bottom:20px;

}

/* slider */

.testimonial-slider{

position:relative;

}

/* hide all */

.testimonial-item{

display:none;

}

/* show active */

.testimonial-item.active{

display:block;

}

/* text */

.testimonial-item p{

font-size:22px;

color:#ddd;

line-height:1.7;

margin-bottom:25px;

}

/* name */

.testimonial-item h4{

color:white;

font-size:18px;

margin-bottom:4px;

}

/* role */

.testimonial-item span{

color:#aaa;

font-size:14px;

}

/* ===== DOTS ===== */

.testimonial-dots{

display:flex;

justify-content:center;

gap:10px;

margin-top:30px;

}

.testimonial-dots span{

width:8px;

height:8px;

background:#444;

border-radius:50%;

display:block;

}

.testimonial-dots span.active{

background:#ff6a2c;

}
/* ===== COURSES SECTION ===== */

.courses{
background:#000;
padding:80px 40px;
text-align:center;
}

/* TITLE */

.course-title{
color:#fff;
font-size:32px;
margin-bottom:50px;
}

/* GRID */

.course-row{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
gap:130px;
max-width:1100px;
margin:0 auto;
}

/* CARD */

.course-card{
background:#111;
padding:15px;
border-radius:12px;
border:1px solid #222;
transition:0.3s;
}

/* IMAGE */

.course-card img{
width:100%;
height:120px;   /* 🔥 size control */
object-fit:cover;
border-radius:10px;
margin-bottom:10px;
}

/* TITLE */

.course-card h3{
color:#fff;
font-size:14px;
margin:0;
}

/* HOVER */

.course-card:hover{
transform:translateY(-6px);
border:1px solid #ff6a2c;
}

/* ===== SCHOOLS FIX ===== */

.school-row{
display:flex !important;     /* 🔥 MAIN FIX */
flex-direction:row !important;
gap:20px;

overflow-x:auto;
scroll-behavior:smooth;
}

.school-card{
min-width:120px;   /* 🔥 important */
flex-shrink:0;

background:#111;
padding:12px;
border-radius:10px;
}

/* ===== BUNDLES SECTION ===== */

.bundles{
background:#000;
padding:80px 40px;
}

/* TITLE */

.bundle-title{
color:#fff;
text-align:center;
margin-bottom:40px;
font-size:28px;
}

/* 🔥 MAIN FIX */

.bundle-row{
display:flex;              /* row me lane ke liye */
gap:25px;

overflow-x:auto;           /* scroll */
scroll-behavior:smooth;
}

.bundle-row::-webkit-scrollbar{
display:none;
}

/* CARD */

.bundle-card{
min-width:220px;           /* 🔥 important */
flex-shrink:0;

background:#111;
padding:12px;
border-radius:12px;
transition:0.3s;
}

/* IMAGE */

.bundle-card img{
width:100%;
height:130px;
object-fit:cover;
border-radius:10px;
margin-bottom:10px;
}

/* TEXT */

.bundle-card h3{
color:#fff;
font-size:14px;
margin:0;
}

/* HOVER */

.bundle-card:hover{
transform:translateY(-5px);
border:1px solid #ff6a2c;
}
/* ===== BRANDS SECTION ===== */

.brands{
background:#000;
padding:80px 0;
text-align:center;
}

/* TITLE CENTER */

.brand-title{
color:#fff;
font-size:32px;
margin-bottom:40px;
text-align:center;
}

/* FRAME */

.brand-wrapper{
background:#111;
border:1px solid #333;
border-radius:12px;
padding:30px 20px;

max-width:900px;
margin:0 auto;   /* 🔥 center */
}

/* 🔥 MAIN ROW FIX */

.brand-row{
display:flex !important;
flex-direction:row !important;

justify-content:center;
align-items:center;

gap:60px;

flex-wrap:nowrap;     /* 🔥 prevent next line */
overflow:hidden;      /* clean look */
}

/* LOGO BOX */

.brand{
width:120px;
height:60px;

display:flex;
justify-content:center;
align-items:center;
}

/* IMAGE SAME SIZE */

.brand img{
width:100%;
height:100%;
object-fit:contain;


}

/* HOVER */

.brand img:hover{
filter:grayscale(0%);
opacity:1;
transform:scale(1.1);
}
/* ===== PRICING SECTION ===== */

.pricing-section{
background:#000;
padding:100px 40px;
color:#fff;
}

/* REMOVE BOOTSTRAP WHITE ISSUE */

.pricing-section .container,
.pricing-section .row{
background:transparent;
}

/* LEFT TEXT */

.pricing-section h5{
color:#ff6a2c;
margin-bottom:10px;
}

.pricing-section h2{
color:#fff;
margin-bottom:15px;
}

.pricing-section ul{
list-style:none;
padding:0;
}

.pricing-section li{
color:#ccc;
margin-bottom:10px;
}

/* ===== 🔥 MAIN FRAME (Prime + Prime Plus) ===== */

.pricing-wrapper{
display:flex;
gap:40px;
align-items:stretch;
}

/* RIGHT SIDE FRAME */

.pricing-wrapper .col-md-4:nth-child(2),
.pricing-wrapper .col-md-4:nth-child(3){

border:1px solid #fff;        /* 🔥 white border */
border-radius:15px;

background:#000;              /* 🔥 black inside */

padding:25px;

display:flex;
}

/* REMOVE CARD BACKGROUND */

.pricing-card{
background:transparent;
border:none;
box-shadow:none;
width:100%;
color:#fff;
}

/* TITLE */

.pricing-card h3{
font-size:20px;
margin-bottom:10px;
color:#fff;
}

/* PRICE */

.pricing-card h2{
font-size:32px;
color:#fff;
}

.pricing-card span{
color:#aaa;
}

/* BUTTON */

.pricing-card button{
width:100%;
padding:12px;

background:#ff6a2c;
border:none;
color:#fff;

border-radius:8px;
font-weight:bold;
margin:15px 0;
cursor:pointer;
}

/* LIST */

.pricing-card ul{
list-style:none;
padding:0;
}

.pricing-card li{
color:#ccc;
margin-bottom:10px;
}

/* DIVIDER */

.pricing-card hr{
border-color:#333;
}

/* BADGE */

.pricing-card .badge{
position:absolute;
top:-10px;
right:10px;

background:#2ecc71;
color:#000;

padding:5px 10px;
border-radius:20px;
font-size:12px;
}
/* ===== PRICING ROW FIX ===== */

.pricing-wrapper{
display:flex !important;
flex-wrap:nowrap !important;   /* 🔥 main fix */
gap:30px;
align-items:stretch;
}

/* equal width */

.pricing-wrapper > div{
flex:1;
}

/* remove bootstrap break */

.col-md-4{
max-width:100% !important;
flex:1 !important;
}

/*==========================================================================*/


/* ===== BUSINESS PAGE ===== */

.business-hero{
background:#000;
color:#fff;
text-align:center;
padding:80px 20px;
}

.business-hero h1{
font-size:48px;
font-weight:bold;
}

.business-hero h1 span{
color:#ff6a2c;
}

.business-hero p{
margin-top:20px;
color:#aaa;
font-size:16px;
}

/* book row */

.book-row{
display:flex;
gap:20px;
overflow-x:auto;
margin-top:40px;
padding:10px;
}

.book-row img{
width:160px;
border-radius:10px;
}

/* scroll hide */

.book-row::-webkit-scrollbar{
display:none;
}

/* ===== BUSINESS HERO ===== */

.business-hero{
background:#000;
color:#fff;
text-align:center;
padding:80px 20px;
overflow:hidden;
}

.business-hero h1{
font-size:48px;
font-weight:bold;
}

.business-hero h1 span{
color:#ff6a2c;
}

.business-hero p{
margin-top:20px;
color:#aaa;
font-size:16px;
}

/* ===== MARQUEE ===== */

.marquee{
overflow:hidden;
margin-top:40px;
}

.marquee-track{
display:flex;
gap:20px;
width:max-content;
animation:scroll 50s linear infinite;
}

.marquee.reverse .marquee-track{
animation:scroll-reverse 60s linear infinite;
}

/* images */

.marquee img{
width:160px;
height:220px;
object-fit:cover;
border-radius:10px;
}

/* animation */

@keyframes scroll{
0%{
transform:translateX(0);
}
100%{
transform:translateX(-50%);
}
}

@keyframes scroll-reverse{
0%{
transform:translateX(-50%);
}
100%{
transform:translateX(0);
}
}

/* ===== COMMON ===== */

.common-books{
background:#000;
padding:100px 8%;
text-align:center;
color:#fff;
}

/* TITLE */
.common-books h2{
font-size:40px;
font-weight:700;
margin-bottom:60px;
}

.common-books h2 span{
color:#ff6a00;
}

/* GRID */
.common-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:40px;
align-items:center;
}

/* CARD */
.common-card{
background:linear-gradient(145deg,#111,#1a1a1a);
padding:40px 25px;
border-radius:20px;
transition:0.4s;
}

.common-card.active{
transform:scale(1.05);
background:linear-gradient(145deg,#1a1a1a,#222);
}

/* HOVER */
.common-card:hover{
transform:translateY(-10px);
}

/* NUMBER */
.number{
color:#ff6a00;
font-weight:700;
font-size:20px;
margin-bottom:10px;
}

/* LINE */
.line{
width:30px;
height:2px;
background:#666;
margin:10px auto 20px;
}

/* TITLE */
.common-card h3{
font-size:22px;
font-weight:700;
margin-bottom:20px;
}

/* IMAGES */
.card-images{
display:flex;
justify-content:center;
gap:10px;
margin-bottom:20px;
}

.card-images img{
width:70px;
height:100px;
border-radius:8px;
object-fit:cover;
}

/* TEXT */
.common-card p{
font-size:14px;
color:#aaa;
line-height:1.6;
}

/* BOTTOM TEXT */
.bottom-text{
margin-top:50px;
color:#aaa;
font-size:15px;
}

/* RESPONSIVE */
@media(max-width:992px){
.common-grid{
grid-template-columns:1fr;
}
.common-card.active{
transform:none;
}
}
/* ===== BUSINESS ===== */

.business-section{
background:#000;
color:#fff;
text-align:center;
margin-left: auto;
margin-right: auto;
padding-left:20px;
padding-right:20px;
}

.buusiness-section{
    background-color: #000; 
}

.business-section span{
color:#ff6a2c;
}

.business-grid{
grid-template-columns:repeat(3,1fr);
display:grid;
gap:40px;
justify-content:center;
margin-top:40px;
}

.business-card{
background:#111;
padding:20px;
border-radius:15px;
width:300px;
}

.business-card img{
width:100%;
border-radius:10px;
}

/* ===== CLIENTS ===== */

/* ===== CLIENT SECTION ===== */

.clients{
background:#000;
padding:120px 0;
}

/* center layout like zebralearn */

.client-container{
max-width:1100px;
margin:0 auto;
}

/* ===== HEADING ===== */

.clients h2{
color:#aaa;
font-size:22px;
margin-bottom:50px;
font-weight:600;
letter-spacing:1px;
}

.clients h2 span{
color:#ff6a2c;
}

/* ===== GRID ===== */

.client-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;
}

/* ===== CARD ===== */

.client-card{
background:#e9e9e9;
border-radius:16px;

height:110px;

display:flex;
align-items:center;
justify-content:center;

transition:0.3s;
}

/* logo */

.client-card img{
max-width:190%;
max-height:100px;
object-fit:contain;
}

/* hover */

.client-card:hover{
transform:translateY(-6px);
box-shadow:0 10px 30px rgba(0,0,0,0.6);
}

/* ===== BUTTON ===== */

.inquire-btn{
display:block;
margin:60px auto 0;

background:#2a2a2a;
color:#fff;

padding:14px 35px;
border:none;
border-radius:10px;

font-size:15px;
cursor:pointer;

transition:0.3s;
}

.inquire-btn:hover{
background:#ff6a2c;
}

/* ===== RESPONSIVE ===== */

@media(max-width:992px){
.client-grid{
grid-template-columns:repeat(2,1fr);
}
}

@media(max-width:500px){
.client-grid{
grid-template-columns:1fr;
}
}

/* ===== NUMBERS ===== */

/* ===== NUMBERS SECTION ===== */

.numbers{
background:#000;
color:#fff;
text-align:center;
padding:100px 20px;
}

/* 🔥 heading box (top border box) */

.numbers h2{
display:inline-block;
padding:15px 30px;
border:1px dashed #333;
border-radius:12px;
font-size:18px;
margin-bottom:60px;
letter-spacing:1px;
}

.numbers h2 span{
color:#ff6a2c;
}

/* ===== GRID ===== */

.number-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
max-width:900px;
margin:0 auto;
position:relative;
}

/* 🔥 vertical lines */

.number-grid::before,
.number-grid::after{
content:"";
position:absolute;
top:0;
bottom:0;
width:1px;
background:#333;
}

.number-grid::before{
left:33.33%;
}

.number-grid::after{
left:66.66%;
}

/* 🔥 horizontal line */

.number-grid{
border-top:1px solid #333;
border-bottom:1px solid #333;
}

/* ===== ITEM ===== */

.number-grid div{
padding:50px 20px;
}

/* big numbers */

.number-grid h3{
font-size:42px;
font-weight:700;
margin-bottom:10px;
}

/* orange text */

.number-grid p{
color:#ff6a2c;
font-size:14px;
}

/* ===== BUTTON ===== */

.inquire-btn{
margin-top:50px;
background:#2a2a2a;
color:#fff;
padding:12px 30px;
border:none;
border-radius:8px;
cursor:pointer;
font-size:14px;
transition:0.3s;
}

.inquire-btn:hover{
background:#ff6a2c;
}

/* ===== RESPONSIVE ===== */

@media(max-width:768px){

.number-grid{
grid-template-columns:1fr;
border:none;
}

.number-grid::before,
.number-grid::after{
display:none;
}

.number-grid div{
border-bottom:4px solid #f7f4f4;
}

}

/* ===== ABOUT ===== */

.about{
background:#000;
color:#fff;
display:flex;
align-items:center;
justify-content:space-between;
padding:80px;
}

.about img{
width:800px;
}

/* ===== BUTTON ===== */

.inquire-btn{
margin-top:30px;
background:#333;
color:#fff;
padding:12px 25px;
border:none;
border-radius:8px;
cursor:pointer;
}

/* ===== RESPONSIVE ===== */

@media(max-width:768px){

.common-grid,
.business-grid{
flex-direction:column;
align-items:center;
}

.number-grid{
grid-template-columns:1fr;
}


.client-grid{
grid-template-columns:1fr 1fr;
}

.about{
flex-direction:column;
text-align:center;
}

}
/*==================================================================*/
/*====== second header =======*/

.business-header{
background:#000;
padding:20px 40px;
}

/* MAIN FLEX */
.nav-container{
display:flex;
align-items:center;
justify-content:space-between;
max-width:1300px;
margin:auto;
}

/* LEFT */
.nav-left{
display:flex;
align-items:center;
gap:10px;
}

.logo-img{
height:70px;
}

.logo-text{
color:#fff;
font-weight:600;
font-size:16px;
}

/* BUSINESS TAG */
.tag{
background:#ff6a00;
color:#fff;
font-size:12px;
padding:3px 10px;
border-radius:6px;
margin-left:8px;
}

/* CENTER NAV */
.nav-center{
display:flex;
gap:35px;
flex:1;               /* 👈 IMPORTANT */
justify-content:center; /* 👈 CENTER ALIGN */
}

.nav-center a{
color:#ccc;
text-decoration:none;
font-size:14px;
transition:0.3s;
}

.nav-center a:hover{
color:#fff;
}

/* RIGHT */
.nav-right{
display:flex;
}

/* BUTTON */
.inquire-btn{
background:#ff6a00;
color:#fff;
padding:10px 22px;
border-radius:3px;
text-decoration:none;
font-weight:400;
}
/*================================== footer-business ================================*/

.footer{
background:#0d0d0d;
color:#fff;
padding:80px 40px 30px;
position:relative;
}

/* MAIN GRID */
.footer-container{
max-width:1200px;
margin:auto;
display:flex;
justify-content:space-between;
gap:60px;
flex-wrap:wrap;
}

/* LEFT */
.footer-left{
display:flex;
flex-direction:column;
gap:10px;
}

.footer-logo{
width:60px;
}

.footer-left h2{
font-size:22px;
font-weight:600;
}

/* LINKS */
.footer-links h4{
margin-bottom:15px;
}

.footer-links ul{
list-style:none;
padding:0;
}

.footer-links li{
margin-bottom:10px;
}

.footer-links a{
color:#aaa;
text-decoration:none;
font-size:14px;
}

.footer-links a:hover{
color:#fff;
}

/* SOCIAL */
.footer-social h4{
margin-bottom:15px;
}

.social-icons{
display:flex;
gap:15px;
}

.social-icons a{
background:#fff;
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
text-decoration:none;
color:#000;
font-size:18px;
transition:0.3s;
}

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

/* BOTTOM */
.footer-bottom{
border-top:1px solid #222;
margin-top:50px;
padding-top:20px;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:10px;
}

.footer-bottom p{
color:#aaa;
font-size:13px;
}

.footer-policy a{
color:#aaa;
margin-left:20px;
font-size:13px;
text-decoration:none;
}

.footer-policy a:hover{
color:#fff;
}

/* SCROLL BUTTON */
.scroll-top{
position:fixed;
right:30px;
bottom:40px;
background:#1a1a1a;
width:50px;
height:50px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
font-size:18px;
color:#fff;
transition:0.3s;
}

.scroll-top:hover{
background:#ff6a00;
}

/*========================= nexted Book page indivisual =========================*/

body {
    background: #0c0c0c;
    color: #fff;
    font-family: sans-serif;
}

/* MAIN GRID */
.book-detail {
    margin-top: 40px; /* navbar ke niche spacing */
}

.book-detail .container {
    display: grid;
    grid-template-columns: 1.8fr 1.2fr;
    gap: 50px;
    max-width: 1200px;
    margin: auto;
}

/* LEFT SIDE */
.book-left h1 {
    font-size: 32px;
    margin-bottom: 10px;
}

.author {
    color: #aaa;
    margin-bottom: 10px;
}

.desc {
    color: #ccc;
    line-height: 1.6;
    margin-bottom: 15px;
}

.rating {
    margin-bottom: 15px;
}

.tags span {
    background: #1a1a1a;
    padding: 6px 12px;
    border-radius: 6px;
    margin-right: 8px;
    font-size: 13px;
}

.badge {
    background: #0d6efd;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 12px;
}

/* LEARN SECTION */
.learn-section {
    margin-top: 40px;
}

.learn-title {
    font-size: 18px;
    margin-bottom: 15px;
    color: #fff;
    letter-spacing: 1px;
}

/* CARD */
.learn-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;

    background: linear-gradient(135deg, #1a1a1a, #111);
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #2a2a2a;
}

/* COLUMN */
.learn-col {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* ROW */
.learn-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

/* TICK ICON */
.tick {
    background: #2a2a2a;
    border-radius: 50%;
    padding: 6px;
    font-size: 12px;
    margin-top: 3px;
}

/* TEXT */
.learn-row p {
    font-size: 14px;
    color: #ccc;
    line-height: 1.6;
}

.bulk-box {
    display: flex;
    justify-content: space-between;
    align-items: center;

    background: linear-gradient(135deg, #1a1a1a, #111);
    padding: 25px;
    border-radius: 12px;
    margin: 40px 0;
    border: 1px solid #2a2a2a;
}

.bulk-left h2 {
    font-size: 22px;
    color: #fff;
}

.bulk-left span {
    color: #ff6a00;
}

.contact-btn {
    background: linear-gradient(90deg, #ff6a00, #ff3c00);
    border: none;
    padding: 12px 20px;
    border-radius: 8px;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

.review-box {
    background: linear-gradient(135deg, #1a1a1a, #111);
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #2a2a2a;
    margin-bottom: 30px;
}

.badge-rec {
    background: linear-gradient(90deg, #00c6ff, #0072ff);
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 12px;
    display: inline-block;
    margin-bottom: 10px;
}

.review-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.review-header img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.review-header h4 {
    font-size: 14px;
}

.review-box p {
    font-size: 14px;
    color: #ccc;
    line-height: 1.6;
}

.includes-section {
    margin-top: 40px;
}

.section-title {
    font-size: 18px;
    margin-bottom: 15px;
}

.includes-box {
    display: flex;
    gap: 30px;
}

.include-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #ccc;
}

.icon {
    background: #1c1c1c;
    padding: 8px;
    border-radius: 50%;
    font-size: 14px;
}

/* SECTION */
.section {
    margin-top: 30px;
}

.section h2 {
    margin-bottom: 10px;
}

/* ACCORDION */
.acc-item {
    background: #161616;
    padding: 12px;
    margin-bottom: 10px;
    border-radius: 6px;
    cursor: pointer;
}

/* RIGHT SIDE */
.book-right {
    position: relative;
}

/* STICKY CARD */
.sticky-box {
    position: sticky;
    top: 110px; /* navbar ke niche perfect */
    background: #111;
    padding: 20px;
    border-radius: 14px;
    box-shadow: 0 0 25px rgba(255,255,255,0.05);
}

/* IMAGE BOX */
.img-box {
    position: relative;
    margin-bottom: 15px;
}

/* IMAGE (IMPORTANT FIX) */
.book-img {
    width: 110px;
    height: 150px;
    object-fit: cover;
    border-radius: 10px;
    margin: 0 auto; 
    

    /* 🔥 MOST IMPORTANT FIX */
    position: static !important;
    transform: none !important;
}

/* DOWNLOAD ICON */
.download-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #1c1c1c;
    padding: 6px;
    border-radius: 50%;
    font-size: 12px;
    cursor: pointer;
}

/* BUTTON */
.sample-btn {
    width: 100%;
    padding: 14px;
    background: #3a3a3a;
    color: #fff;
    border: none;
    margin: 15px 0;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
}

/* PRICE */
.price-box {
    display: flex;
    gap: 12px;
}

.price-card {
    flex: 1;
    padding: 14px;
    background: #1c1c1c;
    border-radius: 10px;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
}

.price-card:hover {
    transform: translateY(-3px);
}

.price-card.active {
    background: #fff;
    color: #000;
}

.price-card h4 {
    font-size: 13px;
    margin-bottom: 5px;
}

.price-card p {
    font-size: 18px;
    font-weight: bold;
}

.old {
    display: block;
    font-size: 12px;
    text-decoration: line-through;
    color: gray;
}

/* SECURE */
.secure {
    text-align: center;
    margin-top: 12px;
    color: #aaa;
}

/* ======== curriculam ========= */