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

.hero{
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: var(--primary);
}

.hero .container{
    position: relative;
    z-index: 5;
}

.hero-grid{
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    align-items: center;
    gap: 80px;
    min-height: 100vh;
    padding: 140px 0 100px;
}
/*==================================================
BACKGROUND IMAGE
==================================================*/

.hero-background{
    position: absolute;
    inset: 0;
    z-index: 1;
}

.hero-background img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    animation: heroZoom 20s ease-in-out infinite alternate;
}
/*==================================================
OVERLAY
==================================================*/

.hero-overlay{
    position: absolute;
    inset: 0;
    z-index: 2;

    background:
    linear-gradient(
        90deg,
        rgba(2,6,23,.92) 0%,
        rgba(15,23,42,.86) 30%,
        rgba(15,23,42,.65) 55%,
        rgba(15,23,42,.35) 75%,
        rgba(15,23,42,.15) 100%
    );
}
/*==================================================
BACKGROUND GLOW
==================================================*/

.hero::before{
    content:"";
    position:absolute;
    width:500px;
    height:500px;
    background:var(--secondary);
    border-radius:50%;
    filter:blur(140px);
    opacity:.15;
    top:-180px;
    right:-180px;
    z-index:3;
}

.hero::after{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    background:var(--accent);
    border-radius:50%;
    filter:blur(130px);
    opacity:.12;
    left:-120px;
    bottom:-150px;
    z-index:3;
}
/*==================================================
HERO CONTENT
==================================================*/

.hero-content{
    position: relative;
    z-index: 10;
    max-width: 720px;
}

.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:12px;

    padding:14px 28px;

    border-radius:50px;

    background:rgba(255,255,255,.10);

    border:1px solid rgba(255,255,255,.15);

    backdrop-filter:blur(15px);

    color:white;

    font-weight:600;

    margin-bottom:30px;
}
.hero-content h1{

    color:white;

    font-size:clamp(3.4rem,6vw,5.5rem);

    line-height:1.05;

    font-weight:800;

    letter-spacing:-2px;

    margin-bottom:28px;

}

.hero-content h1 span{

    color:var(--accent);

}
.hero-content p{

    color:rgba(255,255,255,.92);

    font-size:1.2rem;

    line-height:2;

    max-width:620px;

    margin-bottom:45px;

}
.hero-buttons{

    display:flex;

    gap:20px;

    margin-bottom:60px;

    flex-wrap:wrap;

}

.btn-outline-light{

    color:white;

    border:2px solid rgba(255,255,255,.25);

    background:transparent;

}

.btn-outline-light:hover{

    background:white;

    color:var(--primary);

}


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

.about-story {

    background: var(--white);

}

.story-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 5rem;

    align-items: center;

}

.story-image img {

    border-radius: 30px;

    box-shadow: var(--shadow-lg);

}

.story-content h2 {

    margin-bottom: 1.5rem;

}

.story-content p {

    margin-bottom: 1.2rem;

}

.vision-mission {

    background: var(--gray-50);

}

.vm-grid {

    display: grid;

    grid-template-columns: repeat(2,1fr);

    gap: 2rem;

}

.vm-card {

    background: var(--white);

    padding: 3rem;

    border-radius: 24px;

    box-shadow: var(--shadow-sm);

}

.vm-card h3 {

    color: var(--secondary);

    margin-bottom: 1rem;

}

.values-grid {

    display: grid;

    grid-template-columns: repeat(4,1fr);

    gap: 2rem;

}

.value-card {

    text-align: center;

    background: var(--white);

    padding: 2rem;

    border-radius: 20px;

    box-shadow: var(--shadow-sm);

}

/* ===================================================
   ACADEMICS PAGE
=================================================== */

.programs-grid {

    display: grid;

    grid-template-columns: repeat(3,1fr);

    gap: 2rem;

}

.program-card {

    background: var(--white);

    border-radius: 24px;

    overflow: hidden;

    box-shadow: var(--shadow-md);

    transition: var(--transition);

}

.program-card:hover {

    transform: translateY(-10px);

}

.program-card img {

    height: 250px;

    object-fit: cover;

}

.program-content {

    padding: 2rem;

}

.program-content h3 {

    margin-bottom: 1rem;

}

.learning-approach {

    background: var(--gray-50);

}

.approach-grid {

    display: grid;

    grid-template-columns: repeat(3,1fr);

    gap: 2rem;

}

.approach-card {

    background: var(--white);

    padding: 2rem;

    border-radius: 24px;

    text-align: center;

}

/* ===================================================
   ADMISSIONS PAGE
=================================================== */

.admission-process {

    background: var(--gray-50);

}

.process-grid {

    display: grid;

    grid-template-columns: repeat(4,1fr);

    gap: 2rem;

}

.process-card {

    position: relative;

    background: var(--white);

    padding: 2rem;

    border-radius: 24px;

    text-align: center;

    box-shadow: var(--shadow-sm);

}

.process-number {

    width: 60px;

    height: 60px;

    margin: auto auto 1rem;

    border-radius: 50%;

    background: var(--secondary);

    color: var(--white);

    display: flex;

    align-items: center;

    justify-content: center;

    font-weight: 800;

}

.fees-section {

    background: var(--white);

}

.fees-card {

    max-width: 800px;

    margin: auto;

    background: var(--white);

    padding: 3rem;

    border-radius: 24px;

    box-shadow: var(--shadow-lg);

}

/* ===================================================
   STUDENT LIFE PAGE
=================================================== */

.life-grid {

    display: grid;

    grid-template-columns: repeat(3,1fr);

    gap: 2rem;

}

.life-card {

    overflow: hidden;

    border-radius: 24px;

    background: var(--white);

    box-shadow: var(--shadow-sm);

}

.life-card img {

    height: 260px;

    object-fit: cover;

}

.life-content {

    padding: 2rem;

}

.clubs-grid {

    display: grid;

    grid-template-columns: repeat(4,1fr);

    gap: 2rem;

}

.club-card {

    background: var(--white);

    padding: 2rem;

    border-radius: 24px;

    text-align: center;

    box-shadow: var(--shadow-sm);

}

/* ===================================================
   GALLERY PAGE
=================================================== */

.gallery-filter {

    display: flex;

    justify-content: center;

    gap: 1rem;

    margin-bottom: 3rem;

    flex-wrap: wrap;

}

.filter-btn {

    padding: .9rem 1.5rem;

    border-radius: 999px;

    background: var(--gray-100);

    transition: var(--transition);

}

.filter-btn.active,
.filter-btn:hover {

    background: var(--secondary);

    color: var(--white);

}

.gallery-masonry {

    columns: 3;

    column-gap: 1.5rem;

}

.gallery-masonry .gallery-item {

    margin-bottom: 1.5rem;

    break-inside: avoid;

}

.gallery-masonry img {

    border-radius: 20px;


.image-card { position: relative; overflow: hidden; border-radius: 20px; }
.image-card img { display:block; width:100%; height:auto; transition: transform .45s var(--ease); }
.image-card:hover img { transform: scale(1.04); }
.image-overlay { position: absolute; left:0; right:0; bottom:0; padding:1rem 1.2rem; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.55) 70%); color: #fff; }
.image-overlay h3 { margin:0 0 .2rem; font-size:1.05rem; }
.image-overlay p { margin:0; font-size:.9rem; opacity:.95; }
}

/* ===================================================
   CONTACT PAGE
=================================================== */

.contact-wrapper {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 4rem;

}

.contact-info {

    background: var(--primary);

    color: var(--white);

    padding: 3rem;

    border-radius: 30px;

}

.contact-info h2 {

    color: var(--white);

    margin-bottom: 1rem;

}

.contact-info p {

    color: rgba(255,255,255,.85);

}

.contact-item {

    display: flex;

    gap: 1rem;

    margin-top: 2rem;

}

.contact-icon {

    width: 60px;

    height: 60px;

    border-radius: 50%;

    background: rgba(255,255,255,.1);

    display: flex;

    align-items: center;

    justify-content: center;

}

.contact-form {

    background: var(--white);

    padding: 3rem;

    border-radius: 30px;

    box-shadow: var(--shadow-md);

}

.map-container {

    margin-top: 4rem;

    border-radius: 30px;

    overflow: hidden;

    box-shadow: var(--shadow-md);

}

.map-container iframe {

    width: 100%;

    height: 500px;

    border: 0;

}

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

.faq-container {

    max-width: 900px;

    margin: auto;

}

.faq-item {

    background: var(--white);

    border-radius: 20px;

    margin-bottom: 1rem;

    overflow: hidden;

    box-shadow: var(--shadow-sm);

}

.faq-question {

    padding: 1.5rem 2rem;

    cursor: pointer;

    font-weight: 700;

}

.faq-answer {

    padding: 0 2rem 2rem;

    color: var(--gray-600);

}

/* ===================================================
   ENRICHED CONTENT SECTIONS
=================================================== */

.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.info-card,
.policy-card,
.download-card {
    background: var(--white);
    border-radius: 24px;
    padding: 2rem;
    box-shadow: var(--shadow-sm);
    border: 1px solid rgba(37,99,235,.08);
}

.info-card .icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(37,99,235,.08);
    font-size: 1.8rem;
    margin-bottom: 1.2rem;
}

.info-card h3,
.policy-card h3,
.download-card h4 {
    margin-bottom: .8rem;
}

.info-card ul,
.policy-card ul {
    margin-top: 1rem;
    padding-left: 1.2rem;
    color: var(--gray-600);
}

.info-card li,
.policy-card li {
    margin-bottom: .6rem;
}

.download-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-top: 1rem;
}

.download-card a {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-top: 1rem;
    font-weight: 700;
    color: var(--secondary);
}

.quality-quote {
    background: linear-gradient(135deg, rgba(37,99,235,.08), rgba(15,23,42,.03));
    border-left: 4px solid var(--secondary);
    border-radius: 20px;
    padding: 1.5rem 2rem;
    margin-top: 1.5rem;
    font-style: italic;
    color: var(--gray-700);
}

.policy-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.contact-highlight {
    background: var(--gray-50);
}

.contact-links {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1.5rem;
}

.contact-links a {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .85rem 1.2rem;
    border-radius: 999px;
    background: var(--white);
    box-shadow: var(--shadow-sm);
    color: var(--secondary);
    font-weight: 700;
}

.testimonial-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--secondary), var(--accent));
    color: var(--white);
    font-weight: 800;
}

/* Leadership styles consolidated further down in this file */

.staff-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.2rem;
    margin-top: 1.5rem;
}

.staff-card {
    background: var(--white);
    border-radius: 14px;
    padding: 1rem;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    cursor: pointer;
}

.staff-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
}

.staff-photo {
    width: 92px;
    height: 92px;
    border-radius: 50%;
    margin: 0 auto 0.8rem;
    object-fit: cover;
}

.vision-mission .vm-grid {
    grid-template-columns: 1fr 1fr;
}

@media (max-width: 1024px) {
    .leadership-section { grid-template-columns: 1fr; }
    .staff-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 768px) {
    .info-grid { grid-template-columns: 1fr 1fr; }
    .programs-grid, .approach-grid { grid-template-columns: 1fr 1fr; }
    .process-grid { grid-template-columns: 1fr 1fr; }
    .gallery-masonry { columns: 2; }
}

@media (max-width: 480px) {
    .staff-grid { grid-template-columns: 1fr; }
    .info-grid { grid-template-columns: 1fr; }
    .download-grid { grid-template-columns: 1fr; }
    .gallery-masonry { columns: 1; }
    .testimonial-avatar { width:48px; height:48px; }
}


/* ===================================================
   PAGE CTA
=================================================== */

.page-cta {

    background:
        linear-gradient(
            135deg,
            var(--secondary),
            #60A5FA
        );

    color: var(--white);

    text-align: center;

    border-radius: 40px;

    padding: 5rem;

}

.page-cta h2 {

    color: var(--white);

    margin-bottom: 1rem;

}

.page-cta p {

    color: rgba(255,255,255,.9);

    max-width: 700px;

    margin: auto auto 2rem;

}

/* ABOUT HERO (premium) */
.about-hero {
    padding: 80px 0 60px;
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(247,250,255,1) 100%);
}
.about-hero-grid {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 2.5rem;
    align-items: center;
}
.about-hero-content h1 { font-size: 2.25rem; line-height:1.05; margin-bottom:1rem; }
.about-hero-visual { position:relative; }
.about-image-main { border-radius: 20px; overflow:hidden; box-shadow: var(--shadow-lg); }
.about-image-main img { width:100%; height:420px; object-fit:cover; display:block; }
.about-floating-card { position:absolute; left:16px; bottom:16px; background:var(--white); padding:1rem 1.2rem; border-radius:14px; box-shadow:var(--shadow-md); max-width:320px; }
.hero-buttons { display:flex; gap:1rem; margin-top:1.2rem; flex-wrap: wrap; }
 .hero-stats { display:flex; gap:1rem; margin-top:1.6rem; flex-wrap: wrap; }
 .hero-stats .stat { background:var(--white); padding:1rem 1.2rem; border-radius:12px; box-shadow:var(--shadow-sm); flex:1 1 220px; min-width:220px; }
.hero-stats .stat strong { display:block; font-size:1.05rem; color:var(--secondary); }

@media (max-width: 1024px) {
    .about-hero-grid { grid-template-columns: 1fr; }
    .about-image-main img { height:320px; }
}

/* STAFF MODAL */
.modal { position: fixed; inset:0; display:flex; align-items:center; justify-content:center; background: rgba(2,6,23,0.6); opacity:0; pointer-events:none; transition: opacity .25s ease; z-index:1200; }
.modal.open { opacity:1; pointer-events:auto; }
.modal-inner { background: var(--white); border-radius:12px; width: min(680px, 94%); max-width:720px; box-shadow:var(--shadow-lg); padding:1.2rem; position:relative; }
.modal-close { position:absolute; right:12px; top:8px; border:0; background:transparent; font-size:1.6rem; cursor:pointer; }
.modal-body h3 { margin:0 0 .25rem; }
.modal-body .modal-role { font-weight:700; color:var(--secondary); margin-bottom:.6rem; }
.modal-body .modal-bio { color:var(--gray-700); line-height:1.5; }

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

.leadership-section{
    position:relative;
    padding:120px 0;
    background:
        radial-gradient(circle at top right,#e8f6ef 0%,transparent 35%),
        radial-gradient(circle at bottom left,#f7f9fc 0%,transparent 40%),
        linear-gradient(to bottom,#ffffff,#f9fcfb);
    overflow:hidden;
}

.leadership-section::before{
    content:"";
    position:absolute;
    width:600px;
    height:600px;
    border-radius:50%;
    background:rgba(21,101,192,.05);
    top:-280px;
    right:-250px;
}

.leadership-section::after{
    content:"";
    position:absolute;
    width:500px;
    height:500px;
    border-radius:50%;
    background:rgba(46,125,50,.05);
    bottom:-250px;
    left:-180px;
}

.leadership-section .container{
    position:relative;
    z-index:2;
}

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

.leadership-card{

    display:grid;
    grid-template-columns:420px 1fr;
    gap:70px;
    align-items:center;

    background:#fff;

    border-radius:32px;

    padding:45px;

    margin-top:70px;

    box-shadow:
        0 15px 45px rgba(0,0,0,.08);

    transition:.45s ease;

    overflow:hidden;

    position:relative;

}

.leadership-card:hover{

    transform:translateY(-10px);

    box-shadow:
        0 35px 80px rgba(0,0,0,.12);

}

/* Decorative Line */

.leadership-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:8px;

    height:100%;

    background:linear-gradient(
        to bottom,
        #0d6efd,
        #2e7d32
    );

}

/* Reverse Layout */

.leadership-card.reverse{

    grid-template-columns:1fr 420px;

}

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

.leader-image{

    position:relative;

}

.leader-image img{

    width:100%;

    height:560px;

    object-fit:cover;

    border-radius:28px;

    display:block;

    transition:.5s;

}

.leadership-card:hover .leader-image img{

    transform:scale(1.04);

}

/* Image Overlay */

.leader-image::after{

    content:"";

    position:absolute;

    inset:0;

    border-radius:28px;

    background:

    linear-gradient(

        to top,

        rgba(0,0,0,.35),

        transparent

    );

}

/* Floating Badge */

.experience-badge{

    position:absolute;

    bottom:25px;

    left:25px;

    z-index:3;

    backdrop-filter:blur(18px);

    background:rgba(255,255,255,.88);

    padding:18px 22px;

    border-radius:18px;

    box-shadow:0 12px 30px rgba(0,0,0,.18);

}

.experience-badge strong{

    display:block;

    font-size:22px;

    color:#2e7d32;

    margin-bottom:4px;

}

.experience-badge span{

    font-size:14px;

    color:#666;

}

/*==================================================
CONTENT
==================================================*/

.leader-content h2{

    font-size:42px;

    line-height:1.2;

    color:#0f172a;

    margin:15px 0 25px;

}

.leader-content p{

    font-size:17px;

    color:#5d6778;

    line-height:1.9;

    margin-bottom:22px;

}

/*==================================================
QUOTE
==================================================*/

.leader-content blockquote{

    position:relative;

    margin:35px 0;

    padding:35px;

    border-radius:20px;

    background:#f8fbff;

    border-left:6px solid #2e7d32;

    font-size:22px;

    line-height:1.7;

    color:#16324f;

    font-weight:600;

    font-style:italic;

}

.leader-content blockquote::before{

    content:"“";

    position:absolute;

    top:-10px;

    left:20px;

    font-size:90px;

    color:#2e7d32;

    opacity:.18;

}

/*==================================================
SIGNATURE
==================================================*/

.leader-footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-top:40px;

    padding-top:30px;

    border-top:1px solid #e7edf4;

}

.leader-footer h4{

    font-size:22px;

    color:#10233d;

    margin-bottom:4px;

}

.leader-footer span{

    color:#777;

    font-size:15px;

}

.signature{

    width:160px;

    opacity:.95;

}

.leader-content blockquote::before{

    content:"\201C";

}

.administrator-mark{

    width:86px;

    padding:10px;

    border-radius:18px;

    background:#f8fbff;

    box-shadow:0 10px 24px rgba(16,35,61,.10);

}

/*==================================================
HOVER EFFECT
==================================================*/

.leadership-card:hover .experience-badge{

    transform:translateY(-6px);

    transition:.4s;

}

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

@media(max-width:1100px){

.leadership-card,
.leadership-card.reverse{

grid-template-columns:1fr;

}

.leader-image{

order:-1;

}

.leadership-card.reverse .leader-content{

order:2;

}

.leader-image img{

height:480px;

}

}

@media(max-width:768px){

.leadership-section{

padding:80px 0;

}

.leadership-card{

padding:25px;

border-radius:24px;

gap:35px;

}

.leader-content h2{

font-size:32px;

}

.leader-content blockquote{

font-size:18px;

padding:25px;

}

.leader-image img{

height:380px;

}

.leader-footer{

flex-direction:column;

align-items:flex-start;

gap:20px;

}

.signature{

width:130px;

}

.experience-badge{

left:15px;

bottom:15px;

padding:14px 18px;

}

}

@media(max-width:576px){

.leader-content h2{

font-size:28px;

}

.leader-content p{

font-size:16px;

}

.leader-image img{

height:320px;

}

.experience-badge strong{

font-size:18px;

}

}
/*==================================================
FUTURE VISION
==================================================*/

.future-vision{
    padding:120px 0;
    background:linear-gradient(180deg,#f8fcff 0%,#eef7f2 100%);
    position:relative;
    overflow:hidden;
}

.future-vision::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    background:rgba(46,125,50,.06);
    border-radius:50%;
    top:-180px;
    right:-120px;
}

.future-vision .section-header{
    max-width:850px;
    margin:0 auto 70px;
    text-align:center;
}

.vision-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
    gap:35px;
}

.vision-card{
    background:#fff;
    border-radius:26px;
    overflow:hidden;
    box-shadow:0 20px 50px rgba(0,0,0,.08);
    transition:.4s ease;
}

.vision-card:hover{
    transform:translateY(-12px);
    box-shadow:0 30px 70px rgba(0,0,0,.12);
}

.vision-image{
    height:240px;
    overflow:hidden;
}

.vision-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.5s;
}

.vision-card:hover img{
    transform:scale(1.08);
}

.vision-content{
    padding:35px;
}

.vision-icon{
    width:72px;
    height:72px;
    border-radius:18px;
    background:linear-gradient(135deg,#2E7D32,#4CAF50);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:25px;
    color:#fff;
    box-shadow:0 15px 35px rgba(46,125,50,.25);
}

.vision-content h3{
    font-size:28px;
    margin-bottom:18px;
    color:#16324f;
}

.vision-content p{
    line-height:1.9;
    color:#5f6b7a;
}

.vision-bottom{
    margin-top:70px;
}

.vision-bottom-content{
    background:linear-gradient(135deg,#1f4f82,#2E7D32);
    color:#fff;
    border-radius:28px;
    padding:60px;
    text-align:center;
    box-shadow:0 25px 60px rgba(0,0,0,.15);
}

.vision-bottom-content h3{
    font-size:38px;
    margin-bottom:20px;
}

.vision-bottom-content p{
    max-width:850px;
    margin:auto;
    line-height:1.9;
    opacity:.95;
}
/*==================================================
CBE PHILOSOPHY
==================================================*/

.cbe-philosophy{

    padding:120px 0;

    background:#ffffff;

}

.cbe-wrapper{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.cbe-image{

    position:relative;

}

.cbe-image img{

    width:100%;

    height:700px;

    object-fit:cover;

    border-radius:30px;

    display:block;

    box-shadow:0 25px 60px rgba(0,0,0,.12);

}

.floating-card{

    position:absolute;

    bottom:35px;

    right:-35px;

    width:280px;

    background:#fff;

    border-radius:22px;

    padding:25px;

    box-shadow:0 20px 45px rgba(0,0,0,.15);

    border-left:6px solid #2E7D32;

}

.floating-card h4{

    margin-bottom:10px;

    color:#16324f;

    font-size:22px;

}

.floating-card p{

    color:#667085;

    line-height:1.7;

}

.cbe-content h3{

    font-size:42px;

    color:#16324f;

    margin-bottom:25px;

    line-height:1.3;

}

.cbe-content>p{

    color:#5f6b7a;

    line-height:1.9;

    margin-bottom:22px;

}

.competencies-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;

    margin-top:45px;

}

.competency-card{

    background:#f8fbff;

    border-radius:22px;

    padding:28px;

    transition:.35s;

    border:1px solid #edf2f7;

}

.competency-card:hover{

    transform:translateY(-8px);

    background:#ffffff;

    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.competency-icon{

    width:65px;

    height:65px;

    border-radius:18px;

    background:linear-gradient(135deg,#2E7D32,#4CAF50);

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    margin-bottom:18px;

}

.competency-card h4{

    margin-bottom:12px;

    color:#16324f;

    font-size:21px;

}

.competency-card p{

    color:#667085;

    line-height:1.8;

    font-size:15px;

}

/* Responsive */

@media(max-width:991px){

.cbe-wrapper{

grid-template-columns:1fr;

}

.cbe-image img{

height:500px;

}

.floating-card{

right:20px;

bottom:20px;

width:240px;

}

}

@media(max-width:768px){

.competencies-grid{

grid-template-columns:1fr;

}

.cbe-content h3{

font-size:32px;

}

.cbe-image img{

height:380px;

}

.floating-card{

position:static;

margin-top:20px;

width:100%;

}

}
/*==================================================
WHY RICHWOOD
==================================================*/

.why-richwood{

    padding:120px 0;

    background:
    linear-gradient(180deg,#ffffff,#f7fbff);

    position:relative;

}

.why-highlight{

    display:grid;

    grid-template-columns:1.1fr .9fr;

    align-items:center;

    gap:50px;

    margin:70px 0;

    background:linear-gradient(135deg,#1c3d72,#2E7D32);

    border-radius:35px;

    overflow:hidden;

    box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.highlight-content{

    padding:70px;

    color:#fff;

}

.highlight-content span{

    display:inline-block;

    padding:8px 18px;

    background:rgba(255,255,255,.15);

    border-radius:50px;

    margin-bottom:20px;

    font-weight:600;

}

.highlight-content h3{

    font-size:44px;

    line-height:1.2;

    margin-bottom:25px;

}

.highlight-content p{

    font-size:18px;

    line-height:1.9;

    opacity:.95;

}

.highlight-image{

    height:100%;

}

.highlight-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}

.features-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.feature-card{

    background:#fff;

    padding:35px;

    border-radius:25px;

    box-shadow:0 15px 45px rgba(0,0,0,.08);

    transition:.4s;

    position:relative;

    overflow:hidden;

}

.feature-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:5px;

    height:100%;

    background:linear-gradient(#2E7D32,#1c3d72);

}

.feature-card:hover{

    transform:translateY(-12px);

    box-shadow:0 25px 55px rgba(0,0,0,.12);

}

.feature-icon{

    width:75px;

    height:75px;

    border-radius:20px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:34px;

    margin-bottom:25px;

    background:linear-gradient(135deg,#2E7D32,#4CAF50);

    color:#fff;

}

.feature-card h3{

    font-size:24px;

    margin-bottom:18px;

    color:#16324f;

}

.feature-card p{

    color:#667085;

    line-height:1.9;

}

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

@media(max-width:1100px){

.why-highlight{

grid-template-columns:1fr;

}

.highlight-image{

height:420px;

}

.features-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.highlight-content{

padding:40px 30px;

}

.highlight-content h3{

font-size:34px;

}

.features-grid{

grid-template-columns:1fr;

}

}
/*==================================================
ACADEMIC PHILOSOPHY
==================================================*/

.academic-philosophy{

    padding:120px 0;

    background:#ffffff;

}

.academic-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

}

.academic-image{

    position:relative;

}

.academic-image img{

    width:100%;

    height:650px;

    object-fit:cover;

    border-radius:30px;

    display:block;

    box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.experience-card{

    position:absolute;

    left:-40px;

    bottom:40px;

    width:300px;

    background:#fff;

    padding:30px;

    border-radius:25px;

    box-shadow:0 20px 50px rgba(0,0,0,.18);

    border-top:6px solid #2E7D32;

}

.experience-card span{

    color:#2E7D32;

    font-weight:700;

    text-transform:uppercase;

    font-size:13px;

    letter-spacing:1px;

}

.experience-card h3{

    margin:15px 0;

    font-size:28px;

    color:#16324F;

    line-height:1.3;

}

.experience-card p{

    color:#667085;

    line-height:1.8;

}

.academic-content h2{

    font-size:48px;

    line-height:1.2;

    margin:20px 0 30px;

    color:#16324F;

}

.academic-content p{

    color:#667085;

    line-height:1.9;

    margin-bottom:22px;

}

.philosophy-features{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

    margin-top:35px;

}

.feature-item{

    display:flex;

    align-items:center;

    gap:15px;

    padding:18px 20px;

    background:#F8FAFC;

    border-radius:18px;

    transition:.35s;

}

.feature-item:hover{

    transform:translateY(-6px);

    background:#EEF7F2;

}

.check{

    width:40px;

    height:40px;

    border-radius:50%;

    background:#2E7D32;

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-weight:bold;

}

.feature-item span{

    font-weight:600;

    color:#16324F;

}

/* Responsive */

@media(max-width:991px){

.academic-grid{

grid-template-columns:1fr;

}

.academic-image img{

height:500px;

}

.experience-card{

position:relative;

left:0;

bottom:0;

margin-top:25px;

width:100%;

}

}

@media(max-width:768px){

.philosophy-features{

grid-template-columns:1fr;

}

.academic-content h2{

font-size:36px;

}

.academic-image img{

height:380px;

}

}
/*=========================================
LEARNING JOURNEY
=========================================*/

.learning-journey{

padding:130px 0;

background:#F8FAFC;

overflow:hidden;

}

.journey-grid{

display:grid;

grid-template-columns:1.1fr .9fr;

gap:90px;

align-items:center;

margin-top:70px;

}

.journey-timeline{

position:relative;

padding-left:45px;

}

.journey-timeline::before{

content:"";

position:absolute;

left:14px;

top:0;

bottom:0;

width:4px;

background:linear-gradient(to bottom,#2E7D32,#4CAF50);

border-radius:50px;

}

.journey-item{

position:relative;

margin-bottom:45px;

}

.timeline-dot{

position:absolute;

left:-39px;

top:30px;

width:24px;

height:24px;

border-radius:50%;

background:#fff;

border:6px solid #2E7D32;

z-index:10;

}

.journey-card{

background:#fff;

padding:35px;

border-radius:24px;

box-shadow:0 20px 45px rgba(0,0,0,.08);

transition:.4s;

border-left:5px solid #2E7D32;

}

.journey-card:hover{

transform:translateX(10px);

}

.journey-card span{

display:inline-block;

margin-bottom:12px;

padding:8px 18px;

background:#EEF7F2;

border-radius:40px;

font-size:13px;

font-weight:700;

color:#2E7D32;

}

.journey-card h3{

font-size:30px;

margin-bottom:18px;

color:#16324F;

}

.journey-card p{

line-height:1.9;

color:#667085;

}

.journey-image{

position:sticky;

top:120px;

}

.journey-image img{

width:100%;

height:760px;

object-fit:cover;

border-radius:35px;

box-shadow:0 35px 70px rgba(0,0,0,.18);

}

.journey-badge{

position:absolute;

right:-20px;

bottom:40px;

background:white;

padding:30px;

width:220px;

border-radius:24px;

box-shadow:0 25px 60px rgba(0,0,0,.15);

text-align:center;

}

.journey-badge h3{

font-size:48px;

color:#2E7D32;

margin-bottom:8px;

}

.journey-badge span{

color:#667085;

line-height:1.6;

display:block;

}

@media(max-width:991px){

.journey-grid{

grid-template-columns:1fr;

}

.journey-image{

position:relative;

top:0;

}

.journey-image img{

height:500px;

}

}

@media(max-width:768px){

.journey-card{

padding:25px;

}

.journey-card h3{

font-size:24px;

}

.journey-image img{

height:380px;

}

.journey-badge{

right:20px;

bottom:20px;

width:180px;

padding:20px;

}

}
/*==================================================
CLASSROOM EXPERIENCE
==================================================*/

.classroom-experience{

    padding:130px 0;

    background:#ffffff;

}

.experience-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:90px;

    align-items:center;

    margin-top:70px;

}

/* IMAGE GALLERY */

.experience-gallery{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:20px;

    height:700px;

}

.gallery-main img{

    width:100%;

    height:100%;

    object-fit:cover;

    border-radius:30px;

    box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.gallery-side{

    display:flex;

    flex-direction:column;

    gap:20px;

}

.gallery-small{

    flex:1;

}

.gallery-small img{

    width:100%;

    height:100%;

    object-fit:cover;

    border-radius:24px;

    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

/* CONTENT */

.experience-content h2{

    font-size:48px;

    line-height:1.2;

    color:#16324F;

    margin:20px 0 25px;

}

.experience-content p{

    color:#667085;

    line-height:1.9;

    margin-bottom:20px;

}

.experience-features{

    margin-top:35px;

    display:grid;

    gap:20px;

}

.experience-item{

    display:flex;

    gap:20px;

    align-items:flex-start;

    padding:22px;

    border-radius:20px;

    background:#F8FAFC;

    transition:.35s;

    border:1px solid #E6EEF4;

}

.experience-item:hover{

    transform:translateX(8px);

    background:#EEF7F2;

    border-color:#4CAF50;

}

.experience-icon{

    width:60px;

    height:60px;

    border-radius:18px;

    background:linear-gradient(135deg,#2E7D32,#4CAF50);

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:24px;

    flex-shrink:0;

}

.experience-item h4{

    color:#16324F;

    margin-bottom:8px;

    font-size:20px;

}

.experience-item p{

    margin:0;

    color:#667085;

}

@media(max-width:991px){

.experience-grid{

grid-template-columns:1fr;

}

.experience-gallery{

height:auto;

grid-template-columns:1fr;

}

.gallery-side{

flex-direction:row;

}

.gallery-main img{

height:420px;

}

.gallery-small img{

height:220px;

}

}

@media(max-width:768px){

.gallery-side{

flex-direction:column;

}

.experience-content h2{

font-size:36px;

}

}
/*=========================================
COMPETENCIES
=========================================*/

.competencies{

padding:140px 0;

background:linear-gradient(135deg,#16324F,#20496C);

overflow:hidden;

position:relative;

}

.competencies::before{

content:"";

position:absolute;

width:700px;

height:700px;

background:rgba(255,255,255,.03);

border-radius:50%;

left:-250px;

top:-250px;

}

.light h2,

.light p{

color:#fff;

}

.competency-wrapper{

position:relative;

height:720px;

margin:100px auto;

max-width:900px;

}

.core-circle{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

width:220px;

height:220px;

border-radius:50%;

background:linear-gradient(135deg,#2E7D32,#4CAF50);

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

box-shadow:0 20px 60px rgba(0,0,0,.4);

}

.core-circle h3{

font-size:32px;

color:#fff;

margin-bottom:10px;

}

.core-circle span{

color:#fff;

font-size:20px;

}

.skill{

position:absolute;

width:170px;

height:170px;

background:#fff;

border-radius:50%;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

font-size:34px;

font-weight:700;

box-shadow:0 20px 45px rgba(0,0,0,.18);

transition:.4s;

text-align:center;

}

.skill span{

display:block;

font-size:15px;

margin-top:12px;

color:#16324F;

line-height:1.5;

padding:0 15px;

}

.skill:hover{

transform:scale(1.08);

}

.skill-one{top:0;left:50%;transform:translateX(-50%);}
.skill-two{top:100px;right:40px;}
.skill-three{top:280px;right:0;}
.skill-four{bottom:100px;right:40px;}
.skill-five{bottom:0;left:50%;transform:translateX(-50%);}
.skill-six{top:280px;left:0;}
.skill-seven{top:100px;left:40px;}
.skill-eight{bottom:100px;left:40px;}

.competency-cards{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

margin-top:50px;

}

.competency-card{

background:rgba(255,255,255,.08);

padding:35px;

border-radius:24px;

backdrop-filter:blur(15px);

border:1px solid rgba(255,255,255,.08);

transition:.35s;

}

.competency-card:hover{

transform:translateY(-10px);

background:rgba(255,255,255,.12);

}

.competency-card h3{

color:#fff;

margin-bottom:18px;

font-size:28px;

}

.competency-card p{

color:#d8e3ec;

line-height:1.8;

}

@media(max-width:991px){

.competency-wrapper{

height:auto;

display:grid;

grid-template-columns:repeat(2,1fr);

gap:25px;

}

.core-circle{

position:relative;

left:auto;

top:auto;

transform:none;

margin:auto;

grid-column:1/3;

}

.skill{

position:relative;

left:auto;

right:auto;

top:auto;

bottom:auto;

transform:none;

margin:auto;

width:150px;

height:150px;

}

.competency-cards{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:768px){

.competency-wrapper{

grid-template-columns:1fr;

}

.core-circle{

grid-column:auto;

}

.competency-cards{

grid-template-columns:1fr;

}

}
/*=========================================
LEARNING ENVIRONMENT
=========================================*/

.learning-environment{

padding:140px 0;

background:#ffffff;

}

.environment-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

.environment-content h2{

font-size:48px;

line-height:1.2;

margin:20px 0 30px;

color:#16324F;

}

.environment-content p{

line-height:1.9;

color:#667085;

margin-bottom:22px;

}

.environment-features{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

margin-top:35px;

}

.env-item{

display:flex;

align-items:center;

gap:15px;

padding:18px 22px;

background:#F8FAFC;

border-radius:18px;

border:1px solid #E6EEF4;

font-weight:600;

transition:.35s;

}

.env-item:hover{

background:#EEF7F2;

transform:translateY(-6px);

}

.env-item span{

width:34px;

height:34px;

border-radius:50%;

background:#2E7D32;

display:flex;

justify-content:center;

align-items:center;

color:#fff;

font-weight:bold;

flex-shrink:0;

}

.environment-gallery{

position:relative;

}

.gallery-large img{

width:100%;

height:430px;

object-fit:cover;

border-radius:28px;

box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.gallery-bottom{

display:grid;

grid-template-columns:1fr 1fr;

gap:18px;

margin-top:18px;

}

.gallery-bottom img{

width:100%;

height:220px;

object-fit:cover;

border-radius:22px;

box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.growth-card{

position:absolute;

left:-35px;

top:45px;

width:280px;

padding:28px;

background:#fff;

border-radius:24px;

box-shadow:0 20px 50px rgba(0,0,0,.18);

border-left:6px solid #2E7D32;

}

.growth-card span{

color:#2E7D32;

font-size:13px;

font-weight:700;

letter-spacing:1px;

text-transform:uppercase;

}

.growth-card h3{

margin-top:15px;

font-size:24px;

color:#16324F;

line-height:1.4;

}

@media(max-width:991px){

.environment-grid{

grid-template-columns:1fr;

}

.growth-card{

position:relative;

left:0;

top:0;

margin-top:25px;

width:100%;

}

}

@media(max-width:768px){

.environment-features{

grid-template-columns:1fr;

}

.environment-content h2{

font-size:36px;

}

.gallery-large img{

height:320px;

}

.gallery-bottom img{

height:170px;

}

}
/*=========================================
ACADEMIC TRUST
=========================================*/

.academic-trust{

padding:140px 0;

background:#F8FAFC;

}

.trust-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

margin-top:70px;

}

.trust-image{

position:relative;

}

.trust-image img{

width:100%;

height:700px;

object-fit:cover;

border-radius:30px;

box-shadow:0 30px 60px rgba(0,0,0,.15);

}

.trust-badge{

position:absolute;

bottom:35px;

left:-30px;

background:#fff;

padding:28px;

border-radius:24px;

width:260px;

box-shadow:0 20px 50px rgba(0,0,0,.18);

border-top:6px solid #2E7D32;

}

.trust-badge h3{

font-size:28px;

color:#16324F;

margin-bottom:10px;

}

.trust-badge span{

color:#667085;

line-height:1.8;

}

.trust-content{

display:flex;

flex-direction:column;

gap:25px;

}

.trust-item{

display:flex;

gap:22px;

padding:28px;

background:#fff;

border-radius:22px;

box-shadow:0 15px 40px rgba(0,0,0,.08);

transition:.35s;

}

.trust-item:hover{

transform:translateX(8px);

}

.trust-icon{

width:70px;

height:70px;

background:linear-gradient(135deg,#2E7D32,#4CAF50);

border-radius:18px;

display:flex;

align-items:center;

justify-content:center;

font-size:28px;

flex-shrink:0;

}

.trust-item h3{

margin-bottom:12px;

color:#16324F;

font-size:24px;

}

.trust-item p{

color:#667085;

line-height:1.8;

}

@media(max-width:991px){

.trust-grid{

grid-template-columns:1fr;

}

.trust-image img{

height:450px;

}

.trust-badge{

position:relative;

left:0;

bottom:0;

margin-top:20px;

width:100%;

}

}

@media(max-width:768px){

.trust-item{

flex-direction:column;

}

}
/*=========================================
ACADEMIC CTA
=========================================*/

.academic-cta{

position:relative;

padding:160px 0;

background:url("../assets/images/academics/cta.jpg") center/cover;

overflow:hidden;

}

.cta-overlay{

position:absolute;

inset:0;

background:linear-gradient(rgba(22,50,79,.82),rgba(22,50,79,.82));

}

.cta-content{

position:relative;

max-width:850px;

margin:auto;

text-align:center;

color:#fff;

z-index:2;

}

.cta-content span{

display:inline-block;

padding:10px 22px;

background:rgba(255,255,255,.12);

border:1px solid rgba(255,255,255,.2);

border-radius:40px;

margin-bottom:25px;

font-weight:600;

letter-spacing:.5px;

}

.cta-content h2{

font-size:58px;

line-height:1.2;

margin-bottom:30px;

color:#fff;

}

.cta-content p{

font-size:18px;

line-height:1.9;

max-width:700px;

margin:0 auto 45px;

opacity:.95;

}

.cta-buttons{

display:flex;

justify-content:center;

gap:20px;

flex-wrap:wrap;

}

.btn-outline-light{

border:2px solid #fff;

color:#fff;

background:transparent;

}

.btn-outline-light:hover{

background:#fff;

color:#16324F;

}

@media(max-width:768px){

.academic-cta{

padding:120px 0;

}

.cta-content h2{

font-size:38px;

}

}
/*==================================================
STUDENT LIFE HERO
==================================================*/

.student-life-hero{

position:relative;

min-height:100vh;

display:flex;

align-items:center;

overflow:hidden;

background:

linear-gradient(rgba(15,23,42,.72),rgba(15,23,42,.78)),

url("../assets/images/activities/student-life-hero.jpg")
center center/cover;

}

.student-hero-grid{

display:grid;

grid-template-columns:1.1fr .9fr;

gap:80px;

align-items:center;

padding:180px 0 140px;

position:relative;

z-index:2;

}

.student-hero-content h1{

font-size:clamp(3rem,6vw,5rem);

line-height:1.08;

color:#fff;

margin:25px 0;

max-width:720px;

}

.student-hero-content p{

font-size:1.15rem;

line-height:2;

color:rgba(255,255,255,.92);

max-width:620px;

margin-bottom:40px;

}

.student-hero-cards{

display:flex;

flex-direction:column;

gap:25px;

}

.hero-info-card{

background:rgba(255,255,255,.12);

backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,.15);

border-radius:24px;

padding:35px;

transition:var(--transition);

box-shadow:var(--shadow-lg);

}

.hero-info-card:hover{

transform:translateY(-8px);

background:rgba(255,255,255,.18);

}

.hero-icon{

width:70px;

height:70px;

border-radius:20px;

background:linear-gradient(135deg,var(--secondary),var(--accent));

display:flex;

align-items:center;

justify-content:center;

font-size:30px;

margin-bottom:22px;

}

.hero-info-card h3{

font-size:1.5rem;

color:#fff;

margin-bottom:12px;

}

.hero-info-card p{

color:rgba(255,255,255,.85);

line-height:1.8;

}

.btn-outline-light{

border:2px solid rgba(255,255,255,.85);

color:#fff;

background:transparent;

}

.btn-outline-light:hover{

background:#fff;

color:var(--primary);

}

.scroll-indicator{

position:absolute;

bottom:90px;

left:50%;

transform:translateX(-50%);

z-index:5;

}

.scroll-indicator span{

display:block;

width:34px;

height:55px;

border:2px solid #fff;

border-radius:30px;

position:relative;

}

.scroll-indicator span::before{

content:"";

position:absolute;

top:10px;

left:50%;

transform:translateX(-50%);

width:8px;

height:8px;

background:#fff;

border-radius:50%;

animation:scrollDown 2s infinite;

}

@keyframes scrollDown{

0%{

opacity:1;

transform:translate(-50%,0);

}

100%{

opacity:0;

transform:translate(-50%,20px);

}

}

.hero-wave{

position:absolute;

bottom:0;

left:0;

width:100%;

height:140px;

}

@media(max-width:991px){

.student-hero-grid{

grid-template-columns:1fr;

padding:160px 0 120px;

}

.student-hero-cards{

margin-top:20px;

}

}

@media(max-width:768px){

.student-hero-content h1{

font-size:3rem;

}

.student-life-hero{

min-height:auto;

}

}
/*=========================================
A DAY AT RICHWOOD
=========================================*/

.school-day{

padding:140px 0;

background:var(--background);

position:relative;

}

.day-timeline{

margin-top:90px;

display:flex;

flex-direction:column;

gap:90px;

position:relative;

}

.day-timeline::before{

content:"";

position:absolute;

left:50%;

top:0;

bottom:0;

width:4px;

background:linear-gradient(
to bottom,
var(--secondary),
var(--accent)
);

transform:translateX(-50%);

border-radius:10px;

}

.timeline-item{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

position:relative;

}

.timeline-item::before{

content:"";

position:absolute;

left:50%;

top:50%;

width:22px;

height:22px;

background:var(--accent);

border:6px solid #fff;

border-radius:50%;

transform:translate(-50%,-50%);

box-shadow:0 0 0 6px rgba(37,99,235,.15);

z-index:5;

}

.timeline-image img{

width:100%;

height:420px;

object-fit:cover;

border-radius:28px;

box-shadow:var(--shadow-lg);

transition:var(--transition);

}

.timeline-image img:hover{

transform:scale(1.03);

}

.timeline-content{

background:#fff;

padding:45px;

border-radius:28px;

box-shadow:var(--shadow-md);

border:1px solid var(--gray-200);

}

.timeline-time{

display:inline-block;

padding:10px 18px;

background:#EEF4FF;

color:var(--secondary);

border-radius:30px;

font-weight:700;

margin-bottom:18px;

}

.timeline-content h3{

font-size:2rem;

color:var(--primary);

margin-bottom:20px;

}

.timeline-content p{

line-height:1.9;

color:var(--gray-600);

}

.reverse .timeline-content{

order:1;

}

.reverse .timeline-image{

order:2;

}

@media(max-width:991px){

.day-timeline::before{

display:none;

}

.timeline-item{

grid-template-columns:1fr;

gap:35px;

}

.timeline-item::before{

display:none;

}

.reverse .timeline-content,

.reverse .timeline-image{

order:initial;

}

.timeline-image img{

height:320px;

}

}
/*==================================================
DISCOVER YOUR TALENTS
==================================================*/

.talent-showcase{

padding:140px 0;

background:#fff;

}

.talent-grid{

margin-top:70px;

display:grid;

grid-template-columns:repeat(3,1fr);

grid-auto-rows:320px;

gap:28px;

}

.talent-card{

position:relative;

overflow:hidden;

border-radius:28px;

box-shadow:var(--shadow-md);

cursor:pointer;

transition:var(--transition);

}

.talent-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

}

.talent-card img{

width:100%;

height:100%;

object-fit:cover;

transition:1s;

}

.talent-card:hover img{

transform:scale(1.08);

}

.featured{

grid-column:span 2;

grid-row:span 2;

}

.talent-overlay{

position:absolute;

inset:0;

padding:35px;

display:flex;

flex-direction:column;

justify-content:flex-end;

background:linear-gradient(
180deg,
rgba(2,6,23,.05),
rgba(2,6,23,.85)
);

}

.talent-overlay span{

display:inline-block;

width:max-content;

padding:8px 16px;

background:rgba(255,255,255,.18);

backdrop-filter:blur(10px);

border-radius:30px;

font-size:.8rem;

font-weight:600;

color:#fff;

margin-bottom:18px;

}

.talent-overlay h3{

font-size:2rem;

color:#fff;

line-height:1.2;

margin-bottom:15px;

}

.featured .talent-overlay p{

color:rgba(255,255,255,.92);

line-height:1.9;

max-width:450px;

}

.talent-card:not(.featured) .talent-overlay{

justify-content:flex-end;

}

.talent-card:not(.featured) h3{

font-size:1.45rem;

margin-bottom:0;

}

@media(max-width:991px){

.talent-grid{

grid-template-columns:1fr 1fr;

}

.featured{

grid-column:span 2;

}

}

@media(max-width:768px){

.talent-grid{

grid-template-columns:1fr;

grid-auto-rows:280px;

}

.featured{

grid-column:span 1;

grid-row:span 1;

}

}
/*==================================================
LEARNING EXPERIENCE
==================================================*/

.learning-experience{

padding:140px 0;

background:linear-gradient(
180deg,
#ffffff 0%,
var(--background) 100%
);

}

.experience-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

margin-top:70px;

}

.experience-image{

position:relative;

}

.experience-image img{

width:100%;

height:700px;

object-fit:cover;

border-radius:32px;

box-shadow:var(--shadow-lg);

}

.experience-badge{

position:absolute;

left:30px;

bottom:30px;

background:white;

padding:18px 30px;

border-radius:60px;

font-weight:700;

color:var(--secondary);

box-shadow:var(--shadow-md);

}

.experience-content{

display:flex;

flex-direction:column;

gap:24px;

}

.experience-card{

display:flex;

gap:25px;

padding:28px;

background:var(--surface);

border-radius:22px;

border:1px solid var(--gray-200);

transition:var(--transition);

box-shadow:var(--shadow-sm);

}

.experience-card:hover{

transform:translateY(-8px);

border-color:var(--secondary);

box-shadow:var(--shadow-lg);

}

.experience-icon{

width:72px;

height:72px;

flex-shrink:0;

display:flex;

align-items:center;

justify-content:center;

font-size:30px;

border-radius:20px;

background:#EFF6FF;

color:var(--secondary);

transition:var(--transition);

}

.experience-card:hover .experience-icon{

background:var(--accent);

color:white;

}

.experience-card h3{

font-size:1.35rem;

color:var(--primary);

margin-bottom:12px;

}

.experience-card p{

color:var(--gray-600);

line-height:1.9;

}

.experience-quote{

margin-top:90px;

padding:70px;

background:white;

border-radius:30px;

box-shadow:var(--shadow-md);

text-align:center;

position:relative;

overflow:hidden;

}

.experience-quote::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:6px;

background:linear-gradient(
90deg,
var(--secondary),
var(--accent)
);

}

.experience-quote span{

font-size:6rem;

line-height:1;

font-weight:700;

color:var(--accent);

display:block;

margin-bottom:10px;

}

.experience-quote h3{

font-size:2rem;

line-height:1.5;

max-width:850px;

margin:auto;

color:var(--primary);

margin-bottom:25px;

}

.experience-quote p{

max-width:700px;

margin:auto;

line-height:1.9;

color:var(--gray-600);

}

@media(max-width:991px){

.experience-grid{

grid-template-columns:1fr;

}

.experience-image img{

height:450px;

}

}

@media(max-width:768px){

.learning-experience{

padding:90px 0;

}

.experience-quote{

padding:40px 25px;

}

.experience-quote span{

font-size:4rem;

}

.experience-quote h3{

font-size:1.6rem;

}

}
/*==================================================
STUDENT WELLBEING
==================================================*/

.student-wellbeing{

padding:140px 0;

background:white;

}

.wellbeing-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

margin-top:70px;

}

.wellbeing-image{

position:relative;

}

.wellbeing-image img{

width:100%;

height:700px;

object-fit:cover;

border-radius:30px;

box-shadow:var(--shadow-lg);

}

.image-badge{

position:absolute;

bottom:30px;

left:30px;

background:white;

padding:16px 30px;

border-radius:50px;

font-weight:700;

color:var(--secondary);

box-shadow:var(--shadow-md);

}

.wellbeing-content{

display:flex;

flex-direction:column;

gap:22px;

}

.wellbeing-card{

display:flex;

gap:22px;

padding:28px;

background:white;

border:1px solid var(--gray-200);

border-radius:22px;

transition:var(--transition);

box-shadow:var(--shadow-sm);

}

.wellbeing-card:hover{

transform:translateX(12px);

border-color:var(--secondary);

box-shadow:var(--shadow-md);

}

.wellbeing-icon{

width:72px;

height:72px;

display:flex;

align-items:center;

justify-content:center;

border-radius:20px;

background:#EFF6FF;

font-size:28px;

flex-shrink:0;

transition:var(--transition);

}

.wellbeing-card:hover .wellbeing-icon{

background:var(--accent);

}

.wellbeing-card h3{

margin-bottom:12px;

font-size:1.35rem;

color:var(--primary);

}

.wellbeing-card p{

line-height:1.9;

color:var(--gray-600);

}

@media(max-width:991px){

.wellbeing-grid{

grid-template-columns:1fr;

}

.wellbeing-image img{

height:450px;

}

}
/*==================================================
CLUBS & LEADERSHIP
==================================================*/

.clubs-leadership{

padding:140px 0;

background:var(--background);

}

.clubs-grid{

margin-top:70px;

display:grid;

grid-template-columns:2fr 1fr 1fr;

grid-auto-rows:260px;

gap:25px;

}

.club-feature{

grid-row:span 2;

position:relative;

overflow:hidden;

border-radius:28px;

box-shadow:var(--shadow-lg);

}

.club-wide{

grid-column:2/span 2;

position:relative;

overflow:hidden;

border-radius:28px;

box-shadow:var(--shadow-lg);

}

.club-feature img,

.club-wide img,

.club-card img{

width:100%;

height:100%;

object-fit:cover;

transition:1s;

}

.club-feature:hover img,

.club-wide:hover img,

.club-card:hover img{

transform:scale(1.08);

}

.club-card{

position:relative;

overflow:hidden;

border-radius:24px;

box-shadow:var(--shadow-md);

}

.club-overlay{

position:absolute;

inset:0;

padding:35px;

display:flex;

flex-direction:column;

justify-content:flex-end;

background:linear-gradient(

180deg,

rgba(15,23,42,.05),

rgba(15,23,42,.88)

);

}

.club-overlay span{

display:inline-block;

width:max-content;

padding:8px 18px;

border-radius:30px;

background:rgba(255,255,255,.15);

backdrop-filter:blur(8px);

color:white;

font-size:.8rem;

margin-bottom:18px;

}

.club-overlay h3{

color:white;

font-size:2rem;

margin-bottom:15px;

}

.club-overlay p{

color:rgba(255,255,255,.9);

line-height:1.8;

}

.club-content{

position:absolute;

left:0;

bottom:0;

width:100%;

padding:24px;

background:white;

}

.club-content h3{

color:var(--primary);

margin-bottom:8px;

}

.club-content p{

color:var(--gray-600);

line-height:1.7;

}

@media(max-width:991px){

.clubs-grid{

grid-template-columns:1fr 1fr;

}

.club-feature{

grid-row:span 1;

grid-column:span 2;

}

.club-wide{

grid-column:span 2;

}

}

@media(max-width:768px){

.clubs-grid{

grid-template-columns:1fr;

grid-auto-rows:300px;

}

.club-feature,

.club-wide{

grid-column:span 1;

}

}
/*==================================================
ADMISSIONS HERO
==================================================*/

.admissions-hero{

padding:170px 0 120px;

background:
linear-gradient(135deg,
rgba(15,23,42,.98),
rgba(30,41,59,.95)),
url("../assets/images/admissions/pattern.png");

background-size:cover;

position:relative;

overflow:hidden;

}

.admissions-hero::before{

content:"";

position:absolute;

top:-250px;

right:-250px;

width:600px;

height:600px;

background:rgba(37,99,235,.08);

border-radius:50%;

}

.admissions-hero-grid{

display:grid;

grid-template-columns:1.1fr 1fr;

gap:80px;

align-items:center;

position:relative;

z-index:2;

}

.hero-content h1{

font-size:clamp(3rem,5vw,4.8rem);

font-weight:800;

line-height:1.1;

color:var(--white);

margin:25px 0;

max-width:700px;

}

.hero-description{

font-size:1.12rem;

line-height:1.9;

color:rgba(255,255,255,.82);

margin-bottom:45px;

max-width:620px;

}

.hero-features{

display:flex;

flex-direction:column;

gap:22px;

margin-bottom:50px;

}

.feature{

display:flex;

gap:20px;

align-items:flex-start;

padding:22px 24px;

background:rgba(255,255,255,.06);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(12px);

border-radius:20px;

transition:var(--transition);

}

.feature:hover{

transform:translateY(-6px);

border-color:rgba(245,158,11,.45);

}

.feature-icon{

width:65px;

height:65px;

border-radius:18px;

background:linear-gradient(135deg,
var(--secondary),
var(--secondary-light));

display:flex;

align-items:center;

justify-content:center;

font-size:1.5rem;

flex-shrink:0;

}

.feature h4{

color:var(--white);

margin-bottom:8px;

font-size:1.15rem;

}

.feature p{

color:rgba(255,255,255,.72);

line-height:1.7;

}

.hero-image{

position:relative;

}

.hero-image img{

width:100%;

border-radius:30px;

box-shadow:var(--shadow-lg);

display:block;

}

.floating-card{

position:absolute;

background:var(--white);

padding:22px;

border-radius:20px;

box-shadow:var(--shadow-lg);

min-width:220px;

}

.card-one{

top:40px;

left:-45px;

}

.card-two{

bottom:40px;

right:-40px;

}

.floating-card h3{

font-size:2rem;

color:var(--secondary);

margin-bottom:8px;

}

.floating-card span{

font-size:.95rem;

color:var(--gray-600);

line-height:1.6;

}

@media(max-width:991px){

.admissions-hero{

padding:140px 0 80px;

}

.admissions-hero-grid{

grid-template-columns:1fr;

}

.hero-image{

order:-1;

}

.card-one{

left:20px;

}

.card-two{

right:20px;

}

}

@media(max-width:768px){

.hero-content h1{

font-size:2.7rem;

}

.floating-card{

position:relative;

left:0;

right:0;

top:0;

bottom:0;

margin-top:20px;

}

.hero-image{

display:flex;

flex-direction:column;

}

}
/*==================================================
WHY CHOOSE RICHWOOD
==================================================*/

.why-richwood-admission{

padding:120px 0;

background:var(--background);

}

.why-grid{

display:grid;

grid-template-columns:1fr 1.1fr;

gap:80px;

align-items:center;

}

.why-image{

position:relative;

}

.why-image img{

width:100%;

display:block;

border-radius:28px;

box-shadow:var(--shadow-lg);

}

.experience-card{

position:absolute;

bottom:40px;

left:-35px;

background:var(--white);

padding:28px;

border-radius:22px;

box-shadow:var(--shadow-lg);

border-left:6px solid var(--accent);

}

.experience-card h3{

font-size:3rem;

color:var(--secondary);

margin-bottom:10px;

}

.experience-card p{

color:var(--gray-600);

line-height:1.7;

font-weight:600;

}

.why-content h2{

font-size:3rem;

color:var(--primary);

line-height:1.2;

margin:20px 0;

max-width:650px;

}

.why-content .intro{

font-size:1.08rem;

line-height:1.9;

color:var(--gray-600);

margin-bottom:45px;

}

.benefits-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:25px;

margin-bottom:50px;

}

.benefit-card{

display:flex;

gap:18px;

padding:28px;

background:var(--white);

border-radius:22px;

box-shadow:var(--shadow-sm);

transition:var(--transition);

border:1px solid transparent;

}

.benefit-card:hover{

transform:translateY(-8px);

border-color:var(--secondary);

box-shadow:var(--shadow-md);

}

.benefit-icon{

width:60px;

height:60px;

border-radius:16px;

background:linear-gradient(135deg,
var(--secondary),
var(--secondary-light));

display:flex;

align-items:center;

justify-content:center;

font-size:1.4rem;

flex-shrink:0;

}

.benefit-card h3{

color:var(--primary);

margin-bottom:8px;

font-size:1.15rem;

}

.benefit-card p{

color:var(--gray-600);

line-height:1.7;

font-size:.95rem;

}

.why-actions{

display:flex;

gap:20px;

flex-wrap:wrap;

}

@media(max-width:991px){

.why-grid{

grid-template-columns:1fr;

}

.experience-card{

left:20px;

bottom:20px;

}

.benefits-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.why-content h2{

font-size:2.4rem;

}

.experience-card{

position:relative;

left:0;

bottom:0;

margin-top:20px;

}

}
/*==================================================
ADMISSION JOURNEY
==================================================*/

.admission-journey{

padding:140px 0;

background:linear-gradient(
180deg,
var(--white),
var(--gray-50)
);

}

.journey-timeline{

position:relative;

margin-top:90px;

max-width:950px;

margin-inline:auto;

}

.journey-timeline::before{

content:"";

position:absolute;

left:45px;

top:0;

bottom:0;

width:4px;

background:linear-gradient(
180deg,
var(--secondary),
var(--secondary-light)
);

border-radius:50px;

}

.journey-step{

position:relative;

display:flex;

gap:40px;

margin-bottom:60px;

align-items:flex-start;

}

.step-circle{

width:90px;

height:90px;

background:linear-gradient(
135deg,
var(--secondary),
var(--secondary-light)
);

color:white;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:1.5rem;

font-weight:700;

flex-shrink:0;

box-shadow:0 20px 40px rgba(37,99,235,.25);

border:6px solid white;

z-index:2;

}

.step-content{

background:white;

padding:35px;

border-radius:24px;

box-shadow:var(--shadow-md);

flex:1;

transition:var(--transition);

border-left:5px solid transparent;

}

.step-content:hover{

transform:translateY(-8px);

border-left-color:var(--accent);

}

.step-content span{

display:inline-block;

margin-bottom:10px;

font-size:.85rem;

font-weight:700;

text-transform:uppercase;

letter-spacing:1px;

color:var(--secondary);

}

.step-content h3{

font-size:1.6rem;

margin-bottom:18px;

color:var(--primary);

}

.step-content p{

color:var(--gray-600);

line-height:1.9;

font-size:1rem;

}

@media(max-width:768px){

.journey-timeline::before{

left:32px;

}

.step-circle{

width:65px;

height:65px;

font-size:1.1rem;

}

.journey-step{

gap:20px;

}

.step-content{

padding:25px;

}

.step-content h3{

font-size:1.3rem;

}

}
/*==================================================
ACADEMIC PATHWAY
==================================================*/

.academic-pathway{

padding:140px 0;

background:var(--background);

}

.pathway-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:35px;

margin-top:70px;

}

.pathway-card{

background:var(--white);

border-radius:28px;

overflow:hidden;

box-shadow:var(--shadow-md);

transition:var(--transition);

border:1px solid var(--gray-200);

}

.pathway-card:hover{

transform:translateY(-12px);

box-shadow:var(--shadow-lg);

}

.pathway-image{

position:relative;

height:260px;

overflow:hidden;

}

.pathway-image img{

width:100%;

height:100%;

object-fit:cover;

transition:.6s;

}

.pathway-card:hover img{

transform:scale(1.08);

}

.pathway-image span{

position:absolute;

top:25px;

left:25px;

background:var(--secondary);

color:var(--white);

padding:10px 18px;

border-radius:40px;

font-size:.85rem;

font-weight:700;

}

.pathway-content{

padding:35px;

}

.pathway-content small{

display:block;

color:var(--accent);

font-weight:700;

text-transform:uppercase;

letter-spacing:1px;

margin-bottom:12px;

}

.pathway-content h3{

font-size:1.7rem;

margin-bottom:18px;

color:var(--primary);

}

.pathway-content p{

color:var(--gray-600);

line-height:1.8;

margin-bottom:25px;

}

.pathway-content ul{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:12px;

padding:0;

margin:0;

list-style:none;

}

.pathway-content li{

background:var(--gray-100);

padding:12px 16px;

border-radius:12px;

font-weight:600;

color:var(--primary);

}

@media(max-width:991px){

.pathway-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.pathway-content ul{

grid-template-columns:1fr;

}

}
/*==================================================
TUITION
==================================================*/

.tuition-section{

padding:140px 0;

background:var(--background);

}

.tuition-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

margin-top:70px;

}

.tuition-card{

position:relative;

background:var(--white);

padding:45px;

border-radius:28px;

box-shadow:var(--shadow-md);

border:1px solid var(--gray-200);

transition:var(--transition);

overflow:hidden;

}

.tuition-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

}

.featured{

border:2px solid var(--secondary);

transform:scale(1.04);

}

.popular{

position:absolute;

top:22px;

right:-42px;

background:var(--accent);

color:white;

padding:8px 50px;

font-size:.8rem;

font-weight:700;

transform:rotate(45deg);

}

.level{

display:inline-block;

padding:8px 18px;

background:var(--gray-100);

border-radius:40px;

font-weight:700;

color:var(--secondary);

margin-bottom:20px;

}

.tuition-card h3{

font-size:1.7rem;

color:var(--primary);

margin-bottom:20px;

}

.price{

font-size:2.6rem;

font-weight:800;

color:var(--secondary);

margin-bottom:25px;

}

.price span{

display:block;

font-size:.9rem;

margin-top:10px;

font-weight:500;

color:var(--gray-500);

}

.tuition-card ul{

list-style:none;

padding:0;

margin:0;

}

.tuition-card li{

padding:14px 0;

border-bottom:1px solid var(--gray-200);

color:var(--gray-600);

}

.payment-box{

margin-top:80px;

display:flex;

justify-content:space-between;

align-items:center;

background:linear-gradient(
135deg,
var(--primary),
var(--primary-light)
);

padding:50px;

border-radius:28px;

color:white;

gap:40px;

}

.payment-content{

flex:1;

}

.payment-content h3{

font-size:2rem;

margin-bottom:15px;

}

.payment-content p{

line-height:1.8;

opacity:.9;

}

.payment-methods{

display:flex;

gap:25px;

}

.method{

width:120px;

height:120px;

border-radius:24px;

background:rgba(255,255,255,.08);

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

font-size:2rem;

backdrop-filter:blur(12px);

transition:.35s;

}

.method:hover{

transform:translateY(-8px);

background:rgba(255,255,255,.14);

}

.method span{

margin-top:10px;

font-size:.9rem;

font-weight:600;

}

@media(max-width:991px){

.tuition-grid{

grid-template-columns:1fr;

}

.payment-box{

flex-direction:column;

text-align:center;

}

.payment-methods{

flex-wrap:wrap;

justify-content:center;

}

.featured{

transform:none;

}

}
/*==================================================
ADMISSION REQUIREMENTS
==================================================*/

.admission-requirements{

padding:140px 0;

background:var(--white);

}

.requirements-layout{

display:grid;

grid-template-columns:2fr 1fr;

gap:50px;

margin-top:70px;

align-items:start;

}

.requirements-list{

display:flex;

flex-direction:column;

gap:24px;

}

.requirement-item{

display:flex;

gap:24px;

padding:30px;

background:var(--background);

border-radius:22px;

transition:var(--transition);

border:1px solid var(--gray-200);

}

.requirement-item:hover{

transform:translateY(-6px);

box-shadow:var(--shadow-md);

border-color:var(--secondary);

}

.requirement-icon{

width:70px;

height:70px;

border-radius:18px;

background:linear-gradient(
135deg,
var(--secondary),
var(--secondary-light)
);

display:flex;

align-items:center;

justify-content:center;

font-size:1.8rem;

flex-shrink:0;

color:white;

}

.requirement-item h3{

margin-bottom:12px;

color:var(--primary);

font-size:1.3rem;

}

.requirement-item p{

line-height:1.8;

color:var(--gray-600);

}

.application-box{

position:sticky;

top:120px;

padding:40px;

border-radius:28px;

background:linear-gradient(
180deg,
var(--primary),
var(--primary-light)
);

color:white;

box-shadow:var(--shadow-lg);

}

.application-box span{

display:inline-block;

padding:8px 18px;

background:rgba(255,255,255,.12);

border-radius:50px;

margin-bottom:20px;

font-size:.85rem;

font-weight:700;

}

.application-box h3{

font-size:2rem;

margin-bottom:20px;

}

.application-box p{

line-height:1.8;

opacity:.9;

margin-bottom:25px;

}

.application-box ul{

list-style:none;

padding:0;

margin:0 0 30px;

}

.application-box li{

padding:14px 0;

border-bottom:1px solid rgba(255,255,255,.12);

}

.application-box .btn{

width:100%;

justify-content:center;

}

@media(max-width:991px){

.requirements-layout{

grid-template-columns:1fr;

}

.application-box{

position:relative;

top:auto;

}

}

@media(max-width:768px){

.requirement-item{

flex-direction:column;

text-align:center;

align-items:center;

}

}
/*==================================================
APPLICATION SECTION
==================================================*/

.application-section{

padding:140px 0;

background:linear-gradient(
180deg,
var(--background),
var(--white)
);

}

.application-layout{

display:grid;

grid-template-columns:420px 1fr;

gap:60px;

margin-top:70px;

align-items:start;

}

.info-card-large{

background:linear-gradient(
135deg,
var(--primary),
var(--primary-light)
);

padding:45px;

border-radius:28px;

color:white;

margin-bottom:30px;

box-shadow:var(--shadow-lg);

}

.info-card-large span{

display:inline-block;

padding:8px 18px;

border-radius:50px;

background:rgba(255,255,255,.1);

margin-bottom:20px;

font-size:.8rem;

font-weight:700;

letter-spacing:1px;

text-transform:uppercase;

}

.info-card-large h3{

font-size:2rem;

margin-bottom:20px;

}

.info-card-large p{

line-height:1.9;

opacity:.92;

}

.contact-list{

margin-top:35px;

display:flex;

flex-direction:column;

gap:25px;

}

.contact-item{

display:flex;

gap:18px;

align-items:flex-start;

}

.contact-icon{

width:55px;

height:55px;

background:rgba(255,255,255,.12);

border-radius:16px;

display:flex;

justify-content:center;

align-items:center;

font-size:1.3rem;

flex-shrink:0;

}

.contact-item h4{

margin-bottom:5px;

}

.contact-item p{

margin:0;

opacity:.9;

}

.visit-card{

background:var(--secondary);

padding:35px;

border-radius:24px;

color:white;

}

.visit-card h3{

margin-bottom:15px;

}

.visit-card p{

margin-bottom:25px;

line-height:1.8;

}

.application-form-wrapper{

background:white;

padding:45px;

border-radius:30px;

box-shadow:var(--shadow-lg);

border:1px solid var(--gray-200);

}

.application-form{

display:flex;

flex-direction:column;

gap:25px;

}

.form-row{

display:grid;

grid-template-columns:1fr 1fr;

gap:25px;

}

.form-group{

display:flex;

flex-direction:column;

}

.form-group label{

font-weight:700;

margin-bottom:10px;

color:var(--primary);

}

.form-group input,
.form-group select,
.form-group textarea{

padding:16px 18px;

border:1px solid var(--gray-300);

border-radius:14px;

background:var(--gray-50);

font-size:1rem;

transition:var(--transition);

}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{

outline:none;

border-color:var(--secondary);

background:white;

box-shadow:0 0 0 4px rgba(37,99,235,.08);

}

.submit-btn{

margin-top:10px;

width:100%;

justify-content:center;

padding:18px;

font-size:1rem;

}

@media(max-width:991px){

.application-layout{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.form-row{

grid-template-columns:1fr;

}

.application-form-wrapper{

padding:30px;

}

}
/*==========================================
FINAL ADMISSIONS CTA
===========================================*/

.admissions-final-cta{

padding:140px 0;

background:
linear-gradient(
135deg,
var(--primary),
var(--primary-light)
);

position:relative;

overflow:hidden;

}

.admissions-final-cta::before{

content:"";

position:absolute;

width:650px;

height:650px;

background:rgba(255,255,255,.04);

border-radius:50%;

top:-250px;

right:-180px;

}

.admissions-final-cta::after{

content:"";

position:absolute;

width:420px;

height:420px;

background:rgba(37,99,235,.08);

border-radius:50%;

bottom:-180px;

left:-120px;

}

.cta-wrapper{

position:relative;

z-index:2;

display:grid;

grid-template-columns:1.4fr .8fr;

gap:70px;

align-items:center;

}

.cta-content .section-tag{

background:rgba(255,255,255,.12);

color:white;

}

.cta-content h2{

font-size:3rem;

color:white;

margin:20px 0;

line-height:1.2;

}

.cta-content p{

color:rgba(255,255,255,.88);

font-size:1.1rem;

line-height:1.9;

max-width:700px;

}

.cta-highlights{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

margin-top:45px;

}

.highlight{

padding:18px 22px;

border-radius:14px;

background:rgba(255,255,255,.08);

color:white;

font-weight:600;

backdrop-filter:blur(12px);

border:1px solid rgba(255,255,255,.12);

}

.cta-card{

background:white;

padding:45px;

border-radius:30px;

text-align:center;

box-shadow:var(--shadow-lg);

}

.cta-icon{

width:90px;

height:90px;

margin:auto;

margin-bottom:25px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

font-size:2.5rem;

background:linear-gradient(
135deg,
var(--secondary),
var(--secondary-light)
);

color:white;

}

.cta-card h3{

font-size:2rem;

color:var(--primary);

margin-bottom:20px;

}

.cta-card p{

color:var(--gray-600);

line-height:1.9;

margin-bottom:35px;

}

.cta-buttons{

display:flex;

flex-direction:column;

gap:18px;

}

.btn-outline-light{

display:flex;

justify-content:center;

align-items:center;

padding:15px;

border:2px solid var(--secondary);

color:var(--secondary);

border-radius:14px;

font-weight:700;

transition:var(--transition);

}

.btn-outline-light:hover{

background:var(--secondary);

color:white;

}

@media(max-width:992px){

.cta-wrapper{

grid-template-columns:1fr;

}

.cta-content h2{

font-size:2.3rem;

}

.cta-highlights{

grid-template-columns:1fr;

}

}
/*==========================================
LOCATION MAP
===========================================*/

.location-section{

padding:120px 0;

background:var(--background);

}

.location-wrapper{

margin-top:60px;

overflow:hidden;

border-radius:30px;

box-shadow:var(--shadow-lg);

border:1px solid var(--gray-200);

}

.location-wrapper iframe{

display:block;

width:100%;

height:520px;

border:none;

}

@media(max-width:768px){

.location-wrapper iframe{

height:400px;

}

}
/*==========================================
CONTACT CTA
===========================================*/

.contact-cta{

padding:120px 0;

background:white;

}

.contact-cta-box{

max-width:900px;

margin:auto;

text-align:center;

padding:70px 60px;

border-radius:32px;

background:linear-gradient(
135deg,
var(--primary),
var(--primary-light)
);

box-shadow:var(--shadow-lg);

}

.contact-cta-box .section-tag{

background:rgba(255,255,255,.12);

color:white;

}

.contact-cta-box h2{

font-size:2.8rem;

color:white;

margin:25px 0;

}

.contact-cta-box p{

max-width:650px;

margin:auto;

margin-bottom:40px;

line-height:1.9;

color:rgba(255,255,255,.9);

}

.contact-cta-box .cta-buttons{

display:flex;

justify-content:center;

gap:20px;

flex-wrap:wrap;

}

.contact-cta-box .btn-outline{

border:2px solid rgba(255,255,255,.25);

color:white;

background:transparent;

}

.contact-cta-box .btn-outline:hover{

background:white;

color:var(--primary);

}

@media(max-width:768px){

.contact-cta-box{

padding:50px 30px;

}

.contact-cta-box h2{

font-size:2rem;

}

}
/*==========================================
QUICK CONTACT
===========================================*/

.quick-contact{

padding:90px 0;

background:var(--white);

}

.quick-contact-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

}

.quick-card{

background:var(--surface);

padding:40px 30px;

border-radius:24px;

text-align:center;

text-decoration:none;

color:inherit;

border:1px solid var(--gray-200);

transition:var(--transition);

box-shadow:var(--shadow-sm);

}

.quick-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

border-color:var(--secondary);

}

.quick-icon{

width:70px;

height:70px;

margin:0 auto 20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

font-size:2rem;

background:linear-gradient(
135deg,
var(--secondary),
var(--secondary-light)
);

color:white;

}

.quick-card h3{

margin-bottom:12px;

color:var(--primary);

font-size:1.3rem;

}

.quick-card p{

color:var(--gray-600);

line-height:1.7;

}

@media(max-width:992px){

.quick-contact-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-contact-grid{

grid-template-columns:1fr;

}

}