/* ==========================================================
   VIDYANCE PROFESSIONAL HOMEPAGE CSS
   GeneratePress Compatible
   Part 1/3
========================================================== */


/* ==========================
   ROOT VARIABLES
========================== */

:root{

--vid-blue:#2563eb;
--vid-dark-blue:#1d4ed8;
--vid-light-blue:#eff6ff;

--vid-green:#16a34a;

--vid-text:#111827;
--vid-muted:#64748b;

--vid-border:#e5e7eb;

--vid-white:#ffffff;

--vid-shadow:
0 15px 40px rgba(15,23,42,.08);

--vid-radius:18px;

}



/* ==========================
   GLOBAL RESET
========================== */


.vidyance-home{

font-family:
Inter,
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif;

color:var(--vid-text);

overflow:hidden;

}



.vidyance-home *{

box-sizing:border-box;

}



.container{

width:100%;

max-width:1200px;

margin:auto;

padding-left:20px;

padding-right:20px;

}





/* ==========================
   SECTION COMMON STYLE
========================== */


.section-header{

text-align:center;

max-width:700px;

margin:0 auto 45px;

}



.section-header h2{

font-size:38px;

font-weight:700;

line-height:1.2;

margin-bottom:12px;

color:#0f172a;

}



.section-header p{

font-size:17px;

color:var(--vid-muted);

line-height:1.7;

}





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


.vidyance-hero{

background:

linear-gradient(
135deg,
#eff6ff 0%,
#ffffff 70%
);

padding:

80px 0 70px;

position:relative;

}





.hero-container{

display:grid;

grid-template-columns:

1fr 1fr;

align-items:center;

gap:50px;

}





.hero-content h1{

font-size:52px;

line-height:1.15;

font-weight:800;

letter-spacing:-1px;

margin-bottom:25px;

color:#0f172a;

}





.hero-content h1 span{

color:var(--vid-blue);

}





.hero-content p{

font-size:18px;

line-height:1.8;

color:#475569;

max-width:560px;

margin-bottom:35px;

}







/* ==========================
   HERO BUTTONS
========================== */


.hero-buttons{

display:flex;

gap:18px;

align-items:center;

margin-bottom:40px;

}



.primary-btn{


display:inline-flex;

align-items:center;

justify-content:center;

background:

var(--vid-blue);

color:white!important;

padding:

14px 30px;

border-radius:10px;

font-size:16px;

font-weight:600;

text-decoration:none;

transition:.3s;

}



.primary-btn:hover{

background:

var(--vid-dark-blue);

transform:translateY(-2px);

}




.secondary-btn{


display:inline-flex;

align-items:center;

justify-content:center;

padding:

14px 30px;

border-radius:10px;

border:

1px solid var(--vid-blue);

color:var(--vid-blue);

background:white;

font-weight:600;

text-decoration:none;

transition:.3s;

}



.secondary-btn:hover{

background:var(--vid-light-blue);

}





/* ==========================
   HERO FEATURES
========================== */


.hero-features{

display:flex;

gap:35px;

}



.feature-item{

display:flex;

align-items:center;

gap:12px;

}



.feature-icon{

height:38px;

width:38px;

border-radius:50%;

background:#dcfce7;

color:#16a34a;

display:flex;

align-items:center;

justify-content:center;

font-weight:bold;

}



.feature-item strong{

display:block;

font-size:18px;

}



.feature-item p{

font-size:14px;

margin:0;

color:var(--vid-muted);

}






/* ==========================
   HERO IMAGE
========================== */


.hero-image{

position:relative;

}



.hero-image img{


width:100%;

max-width:560px;

display:block;

margin:auto;

border-radius:0;

box-shadow:none;

}





/* ==========================
   TRUST STATS STRIP
========================== */


.trust-strip{

background:white;

padding:

35px 0;

border-bottom:

1px solid var(--vid-border);

}





.trust-grid{

display:grid;

grid-template-columns:

repeat(4,1fr);

gap:25px;

text-align:center;

}



.trust-grid div{


padding:20px;

border-radius:14px;

background:#f8fafc;

}





.trust-grid strong{

display:block;

font-size:34px;

font-weight:800;

color:var(--vid-blue);

}



.trust-grid span{

display:block;

margin-top:8px;

font-size:15px;

color:var(--vid-muted);

}
/* ==========================================================
   VIDYANCE PROFESSIONAL HOMEPAGE CSS
   Part 2/3

   Sections:
   - Popular Exams
   - Exam Cards
   - Why Choose Vidyance
   - Current Affairs
========================================================== */



/* ==========================
   POPULAR EXAMS SECTION
========================== */


.popular-exams{

padding:

80px 0;

background:#ffffff;

}




.exam-grid{

display:grid;

grid-template-columns:

repeat(4,1fr);

gap:25px;

}




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


.exam-card{

background:#ffffff;

border:

1px solid var(--vid-border);

border-radius:

var(--vid-radius);

padding:

30px 25px;

transition:.3s;

position:relative;

overflow:hidden;

}




.exam-card:hover{

transform:translateY(-8px);

box-shadow:

var(--vid-shadow);

border-color:

transparent;

}




.exam-card:before{

content:"";

position:absolute;

top:0;

left:0;

height:5px;

width:100%;

background:

var(--vid-blue);

}




.exam-icon{

height:60px;

width:60px;

display:flex;

align-items:center;

justify-content:center;

background:

var(--vid-light-blue);

border-radius:14px;

font-size:30px;

margin-bottom:20px;

}




.exam-card h3{

font-size:24px;

margin-bottom:12px;

color:#0f172a;

}




.exam-card p{

font-size:15px;

line-height:1.6;

color:var(--vid-muted);

min-height:55px;

}




.exam-card ul{

list-style:none;

padding:0;

margin:

22px 0;

}



.exam-card ul li{

font-size:14px;

color:#334155;

padding:

7px 0;

}




.exam-card a{

font-size:15px;

font-weight:600;

color:

var(--vid-blue);

text-decoration:none;

}



.exam-card a:hover{

color:

var(--vid-dark-blue);

}






/* ==========================
   WHY VIDYANCE SECTION
========================== */


.why-vidyance{

background:

#f8fafc;

padding:

80px 0;

}





.why-grid{


display:grid;

grid-template-columns:

repeat(3,1fr);

gap:30px;

}





.why-card{

background:#ffffff;

padding:

35px 30px;

border-radius:

18px;

text-align:center;

border:

1px solid var(--vid-border);

transition:.3s;

}





.why-card:hover{

transform:translateY(-6px);

box-shadow:

var(--vid-shadow);

}




.why-icon{

height:70px;

width:70px;

margin:

0 auto 20px;

display:flex;

align-items:center;

justify-content:center;

background:

var(--vid-light-blue);

border-radius:50%;

font-size:32px;

}





.why-card h3{

font-size:22px;

margin-bottom:15px;

color:#0f172a;

}




.why-card p{

font-size:15px;

line-height:1.7;

color:

var(--vid-muted);

}








/* ==========================
   CURRENT AFFAIRS SECTION
========================== */


.current-affairs{

padding:

80px 0;

background:#ffffff;

}




.content-grid{


display:grid;

grid-template-columns:

repeat(3,1fr);

gap:30px;

}





.content-card{


padding:

35px 30px;

background:#ffffff;

border:

1px solid var(--vid-border);

border-radius:

18px;

transition:.3s;

}




.content-card:hover{

box-shadow:

var(--vid-shadow);

transform:translateY(-5px);

}





.content-card h3{

font-size:23px;

margin-bottom:15px;

color:#0f172a;

}





.content-card p{

font-size:15px;

line-height:1.7;

color:

var(--vid-muted);

margin-bottom:25px;

}





.content-card a{


color:

var(--vid-blue);

font-weight:600;

text-decoration:none;

}




.content-card a:hover{

color:

var(--vid-dark-blue);

}







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


@media(max-width:1024px){


.exam-grid{

grid-template-columns:

repeat(2,1fr);

}



.why-grid{

grid-template-columns:

repeat(2,1fr);

}



.content-grid{

grid-template-columns:

repeat(2,1fr);

}


}





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


@media(max-width:768px){


.section-header h2{

font-size:30px;

}



.exam-grid,

.why-grid,

.content-grid{

grid-template-columns:

1fr;

}



.exam-card{

padding:25px 20px;

}




}

/* ==========================================================
   VIDYANCE PROFESSIONAL HOMEPAGE CSS
   Part 3/3

   Sections:
   - Test Series Banner
   - Final CTA
   - GeneratePress Compatibility
   - Mobile Optimization
========================================================== */



/* ==========================
   TEST SERIES SECTION
========================== */


.test-series{

padding:

70px 0;

background:

#f8fafc;

}





.test-banner{

background:

linear-gradient(
135deg,
#2563eb,
#1d4ed8
);

border-radius:

24px;

padding:

50px 60px;

display:flex;

align-items:center;

justify-content:space-between;

gap:30px;

color:white;

}




.test-banner h2{

font-size:36px;

font-weight:800;

margin-bottom:12px;

color:white;

}




.test-banner p{

font-size:17px;

line-height:1.7;

margin:0;

color:#dbeafe;

}




.test-banner .primary-btn{

background:white;

color:#2563eb!important;

padding:

15px 35px;

white-space:nowrap;

}




.test-banner .primary-btn:hover{

background:#eff6ff;

transform:translateY(-2px);

}







/* ==========================
   FINAL CTA SECTION
========================== */


.final-cta{

padding:

90px 20px;

background:

#ffffff;

text-align:center;

}





.final-cta h2{

font-size:42px;

font-weight:800;

color:#0f172a;

margin-bottom:15px;

}





.final-cta p{

font-size:18px;

color:

var(--vid-muted);

margin-bottom:35px;

}





.final-cta .primary-btn{

padding:

16px 40px;

}








/* ==========================
   GENERATEPRESS FIXES
========================== */


/* Remove default page spacing */


.vidyance-home{

margin:0;

}




.vidyance-home .entry-content{

margin:0;

}




.vidyance-home .site-main{

padding:0;

}




/* Full width homepage */

.home .site-content{

max-width:100%;

padding:0;

}




.home .content-area{

width:100%;

}




.home .site-main{

margin:0;

}




/* Remove GeneratePress article styling */

.home article{

margin:0;

padding:0;

border:none;

}




.home .inside-article{

padding:0;

}




/* Remove default footer gap */

.site-footer{

margin-top:0;

}





/* ==========================
   BUTTON GLOBAL FIX
========================== */


.primary-btn,
.secondary-btn{

cursor:pointer;

}





.primary-btn:focus,
.secondary-btn:focus{

outline:none;

}






/* ==========================
   LARGE SCREEN POLISH
========================== */


@media(min-width:1200px){


.hero-container{

min-height:560px;

}



.hero-image img{

max-height:520px;

object-fit:contain;

}



}






/* ==========================
   TABLET
========================== */


@media(max-width:1024px){


.hero-container{

grid-template-columns:

1fr;

text-align:center;

}



.hero-content p{

margin-left:auto;

margin-right:auto;

}



.hero-buttons{

justify-content:center;

}



.hero-features{

justify-content:center;

}




.hero-image{

margin-top:20px;

}



.test-banner{

flex-direction:column;

text-align:center;

padding:

45px 30px;

}



.final-cta h2{

font-size:34px;

}



}








/* ==========================
   MOBILE
========================== */


@media(max-width:768px){



.vidyance-hero{

padding:

50px 0;

}




.hero-content h1{

font-size:34px;

line-height:1.25;

}




.hero-content p{

font-size:16px;

}



.hero-buttons{

flex-direction:column;

width:100%;

}



.hero-buttons a{

width:100%;

}





.hero-features{

flex-direction:column;

gap:18px;

align-items:center;

}





.trust-grid{

grid-template-columns:

repeat(2,1fr);

gap:15px;

}




.trust-grid strong{

font-size:26px;

}




.section-header h2{

font-size:28px;

}



.test-banner h2{

font-size:28px;

}




.final-cta{

padding:

60px 20px;

}



.final-cta h2{

font-size:28px;

}




}



@media(max-width:480px){


.trust-grid{

grid-template-columns:

1fr;

}



.hero-image img{

width:100%;

}



}
/* =================================
   VIDYANCE HERO FINAL ADJUSTMENT
================================= */


.vidyance-hero{

padding:45px 0 60px;

}


.hero-container{

grid-template-columns:55% 45%;

gap:20px;

}



.hero-content h1{

font-size:48px;

line-height:1.12;

letter-spacing:-1.5px;

max-width:600px;

}



.hero-image{

display:flex;

justify-content:center;

align-items:center;

}



.hero-image img{

width:115%;

max-width:620px;

height:auto;

}



@media(max-width:768px){

.hero-content h1{

font-size:34px;

}

}
.home .site-content{

padding-top:0!important;

}


.home .inside-article{

padding-top:0!important;

}


.vidyance-home{

margin-top:0!important;

}
.site-header{

box-shadow:none;

}



.main-navigation{

background:white;

}



.main-navigation .main-nav ul li a{

padding-left:22px;

padding-right:22px;

font-weight:600;

}
.hero-image{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
}

.hero-image img{
    display:block !important;
    width:100% !important;
    max-width:550px !important;
    height:auto !important;
}