/*=========================================================
SAINIK SCHOOL GOPALGANJ
Heritage + Cadet Academy Design
=========================================================*/


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

:root{

    --maroon:#641F2B;
    --maroon-dark:#42131C;
    --maroon-light:#7E3442;

    --sand:#C99A62;
    --sand-light:#DFC29B;

    --cream:#F5F0E7;
    --ivory:#FBF9F4;

    --charcoal:#252321;

    --text:#65615C;
    --muted:#89837B;

    --white:#FFFFFF;

    --border:#DED7CB;

    --shadow:
        0 20px 55px rgba(48,29,24,.12);

    --transition:.35s ease;


    /*
    IMPORTANT:

    Desktop:
    topbar ≈ 38px
    navbar ≈ 82px
    total ≈ 120px

    Mobile:
    topbar hidden
    navbar ≈ 82px
    */

}


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

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}


html{

    scroll-behavior:smooth;

}


html,
body{

    font-family:'Montserrat',sans-serif;

    background:var(--ivory);

    color:var(--text);

    line-height:1.8;

    overflow-x:hidden;


}

html {
    scroll-behavior:smooth;

    scroll-padding-top:var(--header-height);
}


img{

    max-width:100%;

    display:block;

}


a{

    text-decoration:none;

    transition:var(--transition);

}


button,
input,
textarea,
select{

    font-family:inherit;

}


.container{

    width:100%;

    max-width:1240px;

}


.section-padding{

    padding:110px 0;

}


section{

    width:100%;

}


/*=========================================================
TYPOGRAPHY
=========================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:'Libre Baskerville',serif;

    color:var(--charcoal);

    font-weight:700;

}


.section-kicker{

    color:var(--maroon);

    font-size:10px;

    font-weight:800;

    letter-spacing:2.5px;

    text-transform:uppercase;

    margin-bottom:16px;

}


.section-kicker::before{

    content:"";

    display:inline-block;

    vertical-align:middle;

    width:28px;

    height:2px;

    margin-right:10px;

    background:var(--sand);

}


.section-kicker.light{

    color:var(--sand-light);

}


.section-title{

    font-size:45px;

    line-height:1.3;

    margin-bottom:24px;

}


.section-title span{

    color:var(--maroon);

}


.section-text{

    color:var(--text);

    font-size:14px;

    line-height:1.9;

    margin-bottom:18px;

}


/*=========================================================
FIXED HEADER
=========================================================*/

.site-header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:9999;

}


/*=========================================================
TOPBAR
=========================================================*/

.topbar{

    width:100%;

    height:38px;

    background:var(--maroon-dark);

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

    font-size:10px;

    letter-spacing:.8px;

    text-transform:uppercase;

}


.topbar .container{

    height:100%;

}


.topbar-inner{

    height:100%;

    display:flex;

    align-items:center;

    justify-content:space-between;

}


.topbar-left,
.topbar-right{

    display:flex;

    align-items:center;

    gap:25px;

}


.topbar-left span,
.topbar-right span{

    display:flex;

    align-items:center;

    gap:7px;

}


.topbar i{

    color:var(--sand);

}


.topbar-right span{

    padding-left:25px;

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

}


/*=========================================================
NAVBAR
=========================================================*/

.navbar{

    width:100%;

    min-height:82px;

    background:var(--ivory);

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

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

    padding:0;

}


.navbar > .container{

    min-height:82px;

}


.navbar-brand{

    display:flex;

    align-items:center;

    gap:12px;

    padding:0;

}


.navbar-brand img{

    width:54px;

    height:54px;

    object-fit:contain;

}


.brand-content{

    display:flex;

    flex-direction:column;

    line-height:1.15;

}


.brand-content strong{

    font-family:'Libre Baskerville',serif;

    font-size:16px;

    color:var(--maroon);

    letter-spacing:.5px;

}


.brand-content span{

    color:var(--sand);

    font-size:10px;

    font-weight:700;

    letter-spacing:2px;

    margin-top:5px;

}


.navbar-nav{

    align-items:center;

}


.nav-link{

    position:relative;

    color:var(--charcoal);

    font-size:12px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.6px;

    margin-left:26px;

    padding:31px 0 !important;

}


.nav-link::before{

    content:"";

    position:absolute;

    left:0;

    bottom:20px;

    width:0;

    height:2px;

    background:var(--sand);

    transition:var(--transition);

}


.nav-link:hover,
.nav-link.active{

    color:var(--maroon);

}


.nav-link:hover::before,
.nav-link.active::before{

    width:100%;

}


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

.admission-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    margin-left:28px;

    padding:13px 20px;

    background:var(--maroon);

    color:#fff;

    font-size:11px;

    font-weight:700;

    letter-spacing:.7px;

    text-transform:uppercase;

    white-space:nowrap;

}


.admission-btn:hover{

    background:var(--sand);

    color:#fff;

}


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

.navbar-toggler{

    border:1px solid var(--maroon);

    border-radius:0;

    padding:7px 10px;

}


.navbar-toggler:focus{

    box-shadow:none;

}


.navbar-toggler-icon{

    background-image:

    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23641F2B' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");

}


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

@media(max-width:992px){

    :root{

        --header-height:82px;

    }


    .topbar{

        display:none;

    }


    .navbar{

        min-height:82px;

    }


    .navbar > .container{

        min-height:82px;

    }


    .navbar-collapse{

        background:var(--ivory);

        padding:15px 20px 20px;

        margin-top:0;

        border-top:1px solid var(--border);

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

    }


    .navbar-nav{

        align-items:flex-start;

    }


    .nav-link{

        width:100%;

        margin-left:0;

        padding:12px 0 !important;

    }


    .nav-link::before{

        bottom:4px;

    }


    .admission-btn{

        margin:12px 0 0;

    }

}


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

.hero-section{

    position:relative;

    min-height:760px;

    display:flex;

    align-items:center;

    background:var(--maroon-dark);

    overflow:hidden;

}


.hero-image{

    position:absolute;

    inset:0;

    background-image:url("images/hero.png");

    background-size:cover;

    background-position:center;

    z-index:0;

}


.hero-overlay{

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            90deg,
            rgba(40,12,18,.96) 0%,
            rgba(65,19,28,.82) 42%,
            rgba(65,19,28,.25) 100%
        );

    z-index:1;

}


.hero-section::before{

    content:"";

    position:absolute;

    width:430px;

    height:430px;

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

    border-radius:50%;

    right:-160px;

    top:-100px;

    z-index:2;

}


.hero-section::after{

    content:"";

    position:absolute;

    width:220px;

    height:220px;

    border:1px solid rgba(201,154,98,.35);

    right:80px;

    bottom:-120px;

    transform:rotate(45deg);

    z-index:2;

}


.hero-section .container{

    position:relative;

    z-index:3;

}


.hero-content{

    max-width:760px;

    padding:110px 0 130px;

}


.hero-kicker{

    display:flex;

    align-items:center;

    gap:12px;

    color:var(--sand-light);

    font-size:10px;

    font-weight:700;

    letter-spacing:3px;

    margin-bottom:25px;

}


.hero-kicker span{

    width:40px;

    height:2px;

    background:var(--sand);

}


.hero h1{

    color:#fff;

    font-size:76px;

    line-height:1.12;

    letter-spacing:-2px;

    margin-bottom:25px;

}


.hero h1 span{

    color:var(--sand-light);

}


.hero-content > p{

    max-width:650px;

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

    font-size:15px;

    line-height:1.9;

    margin-bottom:35px;

}


.hero-actions{

    display:flex;

    align-items:center;

    gap:14px;

    flex-wrap:wrap;

}


.btn-main{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    padding:15px 25px;

    background:var(--sand);

    color:#fff;

    border:1px solid var(--sand);

    font-size:11px;

    font-weight:700;

    letter-spacing:.7px;

    text-transform:uppercase;

}


.btn-main:hover{

    background:#B5824D;

    border-color:#B5824D;

    color:#fff;

    transform:translateY(-3px);

}


.btn-outline{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:15px 25px;

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

    color:#fff;

    font-size:11px;

    font-weight:700;

    letter-spacing:.7px;

    text-transform:uppercase;

}


.btn-outline:hover{

    background:#fff;

    color:var(--maroon);

    border-color:#fff;

}


.hero-motto{

    display:flex;

    flex-direction:column;

    margin-top:50px;

    padding-top:20px;

    border-top:1px solid rgba(255,255,255,.17);

    max-width:380px;

}


.hero-motto span{

    color:#fff;

    font-family:'Libre Baskerville',serif;

    font-size:19px;

}


.hero-motto small{

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

    font-size:10px;

    margin-top:4px;

    letter-spacing:1px;

}


.hero-bottom{

    position:absolute;

    left:0;

    bottom:25px;

    width:100%;

    z-index:4;

}


.hero-bottom-inner{

    display:flex;

    align-items:center;

    justify-content:space-between;

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

    font-size:9px;

    font-weight:700;

    letter-spacing:1.5px;

}


.scroll-down{

    display:flex;

    align-items:center;

    gap:12px;

}


.scroll-down i{

    color:var(--sand);

    font-size:17px;

    animation:heroArrow 1.6s infinite;

}


@keyframes heroArrow{

    0%,
    100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(6px);

    }

}


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

.about-section{

    background:var(--ivory);

}


.about-image-wrap{

    position:relative;

    padding:0 35px 35px 0;

}


.about-image-wrap::before{

    content:"";

    position:absolute;

    top:-25px;

    left:-25px;

    width:150px;

    height:150px;

    background:var(--cream);

    z-index:0;

}


.about-image-main{

    position:relative;

    z-index:2;

    overflow:hidden;

}


.about-image-main img{

    width:100%;

    height:560px;

    object-fit:cover;

    transition:.7s;

}


.about-image-main:hover img{

    transform:scale(1.05);

}


.about-image-wrap::after{

    content:"";

    position:absolute;

    right:0;

    bottom:0;

    width:190px;

    height:190px;

    background:var(--maroon);

    z-index:1;

}


.about-year{

    position:absolute;

    z-index:3;

    right:20px;

    bottom:20px;

    width:155px;

    padding:22px;

    background:var(--sand);

    color:#fff;

}


.about-year strong{

    display:block;

    color:#fff;

    font-family:'Libre Baskerville',serif;

    font-size:34px;

    line-height:1;

}


.about-year span{

    display:block;

    font-size:10px;

    line-height:1.5;

    margin-top:8px;

}


.about-highlights{

    display:grid;

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

    gap:12px;

    margin-top:30px;

    padding-top:25px;

    border-top:1px solid var(--border);

}


.about-highlights > div{

    display:flex;

    gap:10px;

    align-items:flex-start;

}


.about-highlights i{

    color:var(--maroon);

    font-size:20px;

}


.about-highlights strong{

    display:block;

    color:var(--charcoal);

    font-size:11px;

}


.about-highlights span{

    display:block;

    color:var(--muted);

    font-size:9px;

    line-height:1.4;

    margin-top:3px;

}


.heritage-link{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:var(--maroon);

    font-size:11px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;

    margin-top:28px;

}


.heritage-link:hover{

    color:var(--sand);

}


.heritage-link i{

    transition:.3s;

}


.heritage-link:hover i{

    transform:translateX(5px);

}


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

@media(max-width:1100px){

    .hero h1{

        font-size:62px;

    }


    .section-title{

        font-size:40px;

    }


    .nav-link{

        margin-left:15px;

    }


    .admission-btn{

        margin-left:18px;

    }

}


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

@media(max-width:768px){

    .section-padding{

        padding:75px 0;

    }


    .hero-section{

        min-height:650px;

    }


    .hero-image{

        background-position:center;

    }


    .hero-overlay{

        background:

            linear-gradient(
                rgba(40,12,18,.90),
                rgba(40,12,18,.90)
            );

    }


    .hero-content{

        padding:75px 0 100px;

    }


    .hero h1{

        font-size:46px;

        letter-spacing:-1px;

    }


    .hero-content > p{

        font-size:14px;

    }


    .hero-actions{

        flex-direction:column;

        align-items:stretch;

    }


    .btn-main,
    .btn-outline{

        width:100%;

    }


    .hero-motto{

        margin-top:35px;

    }


    .hero-bottom{

        bottom:15px;

    }


    .hero-bottom-inner{

        justify-content:center;

    }


    .hero-bottom-inner > span{

        display:none;

    }


    .scroll-down{

        margin:auto;

    }


    .section-title{

        font-size:34px;

    }


    .about-image-wrap{

        padding-right:20px;

        padding-bottom:25px;

    }


    .about-image-main img{

        height:420px;

    }


    .about-year{

        right:5px;

        bottom:15px;

    }


    .about-highlights{

        grid-template-columns:1fr;

        gap:18px;

    }

}


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

@media(max-width:576px){

    .hero h1{

        font-size:37px;

    }


    .hero-kicker{

        font-size:8px;

        letter-spacing:2px;

    }


    .hero-motto span{

        font-size:16px;

    }


    .section-title{

        font-size:30px;

    }


    .about-image-main img{

        height:350px;

    }


    .about-year{

        width:140px;

        padding:18px;

    }


    .about-year strong{

        font-size:30px;

    }

}


/*=========================================================
ACCESSIBILITY
=========================================================*/

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible{

    outline:2px solid var(--sand);

    outline-offset:3px;

}


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

img{

    user-select:none;

}


/*=========================================================
SCROLLBAR
=========================================================*/

::-webkit-scrollbar{

    width:9px;

}


::-webkit-scrollbar-track{

    background:var(--cream);

}


::-webkit-scrollbar-thumb{

    background:var(--maroon);

}


::-webkit-scrollbar-thumb:hover{

    background:var(--sand);

}


/*=========================================================
VALUES / FOUNDATION
=========================================================*/

.values-section{

    position:relative;

    background:var(--maroon-dark);

    color:#fff;

    overflow:hidden;

}


.values-section::before{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

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

    border-radius:50%;

    right:-220px;

    top:-180px;

}


.values-section::after{

    content:"";

    position:absolute;

    width:260px;

    height:260px;

    border:1px solid rgba(201,154,98,.2);

    left:-150px;

    bottom:-130px;

    transform:rotate(45deg);

}


.values-section .container{

    position:relative;

    z-index:2;

}


.values-heading{

    display:flex;

    justify-content:space-between;

    align-items:flex-end;

    gap:50px;

    margin-bottom:55px;

}


.values-heading h2{

    color:#fff;

    font-size:45px;

    line-height:1.3;

    margin:0;

}


.values-heading h2 span{

    color:var(--sand-light);

}


.values-heading > p{

    max-width:430px;

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

    font-size:13px;

    line-height:1.9;

    margin:0;

}


.values-grid{

    display:grid;

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

    gap:1px;

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

}


.value-card{

    position:relative;

    min-height:350px;

    padding:42px 38px;

    background:var(--maroon-dark);

    overflow:hidden;

}


.value-card.featured{

    background:var(--maroon);

}


.value-number{

    position:absolute;

    top:30px;

    right:32px;

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

    font-family:'Libre Baskerville',serif;

    font-size:13px;

}


.value-icon{

    width:58px;

    height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:65px;

    border:1px solid rgba(201,154,98,.45);

    color:var(--sand-light);

    font-size:21px;

}


.value-card h3{

    color:#fff;

    font-size:25px;

    margin-bottom:15px;

}


.value-card p{

    max-width:300px;

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

    font-size:12px;

    line-height:1.9;

}


.value-line{

    position:absolute;

    left:38px;

    bottom:30px;

    width:42px;

    height:2px;

    background:var(--sand);

}


/*=========================================================
PRINCIPAL MESSAGE
=========================================================*/

.principal-section{

    background:var(--cream);

}


.principal-layout{

    display:grid;

    grid-template-columns:42% 58%;

    align-items:center;

}


.principal-image{

    position:relative;

    padding:0 35px 35px 0;

}


.principal-image::after{

    content:"";

    position:absolute;

    right:0;

    bottom:0;

    width:190px;

    height:190px;

    background:var(--sand);

    z-index:0;

}


.principal-image img{

    position:relative;

    z-index:2;

    width:100%;

    height:590px;

    object-fit:cover;

}


.principal-label{

    position:absolute;

    left:25px;

    bottom:20px;

    z-index:3;

    background:var(--maroon);

    color:#fff;

    padding:18px 22px;

    min-width:200px;

}


.principal-label span{

    display:block;

    color:var(--sand-light);

    font-size:8px;

    font-weight:700;

    letter-spacing:2px;

}


.principal-label strong{

    display:block;

    color:#fff;

    font-size:11px;

    margin-top:5px;

}


.principal-content{

    padding-left:80px;

}


.quote-mark{

    color:var(--sand);

    font-family:Georgia,serif;

    font-size:80px;

    line-height:.5;

    height:38px;

}


.principal-content blockquote{

    max-width:620px;

    color:var(--maroon);

    font-family:'Libre Baskerville',serif;

    font-size:22px;

    line-height:1.7;

    margin:15px 0 25px;

}


.principal-signature{

    display:flex;

    flex-direction:column;

    margin-top:30px;

    padding-top:20px;

    border-top:1px solid var(--border);

    width:220px;

}


.principal-signature span{

    color:var(--muted);

    font-size:9px;

    text-transform:uppercase;

    letter-spacing:1px;

}


.principal-signature strong{

    color:var(--maroon);

    font-family:'Libre Baskerville',serif;

    font-size:18px;

    margin-top:5px;

}


/*=========================================================
SCHOOL AT A GLANCE
=========================================================*/

.glance-section{

    background:var(--maroon);

}


.glance-grid{

    display:grid;

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

}


.glance-item{

    min-height:175px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:25px;

    border-right:1px solid rgba(255,255,255,.14);

}


.glance-item:last-child{

    border-right:0;

}


.glance-item i{

    color:var(--sand-light);

    font-size:22px;

    margin-bottom:13px;

}


.glance-item strong{

    color:#fff;

    font-family:'Libre Baskerville',serif;

    font-size:25px;

    line-height:1.2;

}


.glance-item span{

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

    font-size:9px;

    text-transform:uppercase;

    letter-spacing:1.2px;

    margin-top:6px;

}


/*=========================================================
SAINIK SCHOOL EXPERIENCE
=========================================================*/

.experience-section{

    background:var(--ivory);

}


.experience-grid{

    display:grid;

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

    gap:25px;

}


.experience-card{

    background:#fff;

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

    overflow:hidden;

    transition:var(--transition);

}


.experience-card:hover{

    transform:translateY(-8px);

    box-shadow:var(--shadow);

}


.experience-image{

    height:290px;

    overflow:hidden;

}


.experience-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.7s;

}


.experience-card:hover .experience-image img{

    transform:scale(1.07);

}


.experience-content{

    position:relative;

    padding:28px 28px 32px;

}


.experience-content > span{

    color:var(--sand);

    font-size:10px;

    font-weight:800;

    letter-spacing:1px;

}


.experience-content h3{

    font-size:22px;

    margin:9px 0 10px;

}


.experience-content p{

    color:var(--text);

    font-size:12px;

    line-height:1.8;

    margin:0;

}


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

.academics-section{

    background:var(--cream);

}


.academic-feature{

    display:grid;

    grid-template-columns:1fr 1fr;

    min-height:510px;

    margin-bottom:30px;

    background:#fff;

}


.academic-feature-image{

    overflow:hidden;

}


.academic-feature-image img{

    width:100%;

    height:100%;

    min-height:510px;

    object-fit:cover;

    transition:.7s;

}


.academic-feature:hover
.academic-feature-image img{

    transform:scale(1.04);

}


.academic-feature-content{

    display:flex;

    flex-direction:column;

    justify-content:center;

    padding:60px;

}


.feature-number{

    color:var(--sand);

    font-size:10px;

    font-weight:800;

    letter-spacing:2px;

    margin-bottom:20px;

}


.academic-feature-content h3{

    font-size:34px;

    margin-bottom:20px;

}


.academic-feature-content > p{

    color:var(--text);

    font-size:13px;

    line-height:1.9;

    max-width:500px;

    margin-bottom:25px;

}


.academic-list{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:14px;

}


.academic-list > div{

    display:flex;

    align-items:flex-start;

    gap:9px;

    color:var(--charcoal);

    font-size:10px;

    font-weight:600;

    line-height:1.5;

}


.academic-list i{

    flex-shrink:0;

    color:var(--maroon);

    font-size:13px;

}


/*=========================================================
ACADEMIC CARDS
=========================================================*/

.academic-cards{

    display:grid;

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

    gap:20px;

}


.academic-card{

    padding:35px;

    background:#fff;

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

    transition:var(--transition);

}


.academic-card:hover{

    border-color:var(--sand);

    transform:translateY(-6px);

    box-shadow:var(--shadow);

}


.academic-card-icon{

    width:52px;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:25px;

    background:var(--cream);

    color:var(--maroon);

    font-size:20px;

}


.academic-card h3{

    font-size:20px;

    margin-bottom:12px;

}


.academic-card p{

    color:var(--text);

    font-size:12px;

    line-height:1.8;

    margin:0;

}


/*=========================================================
LEARNING SPACES
=========================================================*/

.learning-spaces-section{

    background:var(--ivory);

}


.learning-spaces{

    display:grid;

    grid-template-columns:1fr 1fr;

    min-height:570px;

}


.learning-space-image{

    position:relative;

    overflow:hidden;

}


.learning-space-image img{

    width:100%;

    height:100%;

    min-height:570px;

    object-fit:cover;

    transition:.7s;

}


.learning-space-image:hover img{

    transform:scale(1.04);

}


.image-label{

    position:absolute;

    left:25px;

    bottom:25px;

    padding:10px 16px;

    background:var(--maroon);

    color:#fff;

    font-size:9px;

    font-weight:800;

    letter-spacing:2px;

}


.learning-space-content{

    display:flex;

    flex-direction:column;

    justify-content:center;

    padding:65px;

    background:var(--cream);

}


.space-feature{

    display:flex;

    gap:18px;

    padding:20px 0;

    border-top:1px solid var(--border);

}


.space-feature:last-child{

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

}


.space-feature > i{

    flex-shrink:0;

    color:var(--maroon);

    font-size:22px;

    margin-top:3px;

}


.space-feature strong{

    display:block;

    color:var(--charcoal);

    font-family:'Libre Baskerville',serif;

    font-size:16px;

}


.space-feature p{

    color:var(--text);

    font-size:11px;

    line-height:1.7;

    margin:5px 0 0;

}


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

@media(max-width:1100px){

    .values-heading{

        align-items:flex-start;

    }


    .principal-content{

        padding-left:50px;

    }


    .academic-feature-content{

        padding:45px;

    }


    .learning-space-content{

        padding:45px;

    }

}


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

@media(max-width:768px){

    .values-heading{

        display:block;

        margin-bottom:35px;

    }


    .values-heading h2{

        font-size:34px;

        margin-bottom:18px;

    }


    .values-grid{

        grid-template-columns:1fr;

        gap:1px;

    }


    .value-card{

        min-height:300px;

        padding:32px;

    }


    .value-icon{

        margin-bottom:45px;

    }


    .principal-layout{

        grid-template-columns:1fr;

    }


    .principal-image{

        padding-right:20px;

        padding-bottom:25px;

    }


    .principal-image img{

        height:480px;

    }


    .principal-content{

        padding:20px 0 0;

    }


    .principal-content blockquote{

        font-size:18px;

    }


    .glance-grid{

        grid-template-columns:1fr 1fr;

    }


    .glance-item{

        min-height:150px;

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

    }


    .glance-item:nth-child(2){

        border-right:0;

    }


    .glance-item:nth-child(3){

        border-bottom:0;

    }


    .glance-item:nth-child(4){

        border-bottom:0;

        border-right:0;

    }


    .experience-grid{

        grid-template-columns:1fr;

    }


    .experience-image{

        height:320px;

    }


    .academic-feature{

        grid-template-columns:1fr;

    }


    .academic-feature-image img{

        min-height:350px;

        height:350px;

    }


    .academic-feature-content{

        padding:40px 30px;

    }


    .academic-feature-content h3{

        font-size:28px;

    }


    .academic-list{

        grid-template-columns:1fr;

    }


    .academic-cards{

        grid-template-columns:1fr;

    }


    .learning-spaces{

        grid-template-columns:1fr;

    }


    .learning-space-image img{

        min-height:380px;

        height:380px;

    }


    .learning-space-content{

        padding:45px 30px;

    }

}


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

@media(max-width:576px){

    .value-card{

        min-height:280px;

    }


    .principal-image img{

        height:400px;

    }


    .principal-label{

        left:15px;

        bottom:15px;

    }


    .glance-item{

        min-height:135px;

        padding:18px 10px;

    }


    .glance-item strong{

        font-size:21px;

    }


    .experience-image{

        height:270px;

    }


    .academic-feature-image img{

        height:300px;

        min-height:300px;

    }


    .academic-feature-content{

        padding:35px 22px;

    }


    .academic-card{

        padding:28px 24px;

    }


    .learning-space-image img{

        height:300px;

        min-height:300px;

    }


    .learning-space-content{

        padding:35px 22px;

    }

}

/*=========================================================
HOSTEL / RESIDENTIAL LIFE
=========================================================*/

.hostel-section{

    background:var(--ivory);

}


.hostel-features{

    margin-top:30px;

    border-top:1px solid var(--border);

}


.hostel-feature{

    display:flex;

    align-items:flex-start;

    gap:16px;

    padding:19px 0;

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

}


.hostel-icon{

    width:45px;

    height:45px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    background:var(--cream);

    color:var(--maroon);

    font-size:17px;

}


.hostel-feature strong{

    display:block;

    color:var(--charcoal);

    font-family:'Libre Baskerville',serif;

    font-size:14px;

    line-height:1.4;

}


.hostel-feature p{

    color:var(--text);

    font-size:11px;

    line-height:1.7;

    margin:5px 0 0;

}


.hostel-image-wrap{

    position:relative;

    padding:0 0 30px 30px;

}


.hostel-image-wrap::before{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:180px;

    height:180px;

    background:var(--maroon);

    z-index:0;

}


.hostel-image-wrap img{

    position:relative;

    z-index:2;

    width:100%;

    height:580px;

    object-fit:cover;

}


.hostel-badge{

    position:absolute;

    z-index:3;

    right:25px;

    bottom:0;

    display:flex;

    align-items:center;

    gap:12px;

    padding:18px 22px;

    background:var(--sand);

    color:#fff;

}


.hostel-badge i{

    font-size:22px;

}


.hostel-badge strong{

    display:block;

    color:#fff;

    font-family:'Libre Baskerville',serif;

    font-size:14px;

}


.hostel-badge span{

    display:block;

    font-size:9px;

    margin-top:2px;

    opacity:.8;

}


/*=========================================================
SPORTS
=========================================================*/

.sports-section{

    background:var(--cream);

}


.sports-heading{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:50px;

    margin-bottom:50px;

}


.sports-heading > p{

    max-width:430px;

    margin:0;

}


.sports-grid{

    display:grid;

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

    gap:18px;

}


.sport-card{

    position:relative;

    background:#fff;

    overflow:hidden;

    transition:var(--transition);

}


.sport-card:hover{

    transform:translateY(-7px);

    box-shadow:var(--shadow);

}


.sport-image{

    height:300px;

    overflow:hidden;

}


.sport-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.7s;

}


.sport-card:hover .sport-image img{

    transform:scale(1.07);

}


.sport-content{

    position:relative;

    padding:22px 24px 27px;

}


.sport-content > span{

    color:var(--sand);

    font-size:9px;

    font-weight:800;

    letter-spacing:1px;

}


.sport-content h3{

    font-size:19px;

    margin:7px 0 7px;

}


.sport-content p{

    color:var(--text);

    font-size:10px;

    line-height:1.7;

    margin:0;

}


/*=========================================================
DRILL / PHYSICAL TRAINING
=========================================================*/

.training-section{

    background:var(--ivory);

}


.training-wrapper{

    display:grid;

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

    min-height:570px;

    background:var(--maroon-dark);

}


.training-image{

    overflow:hidden;

}


.training-image img{

    width:100%;

    height:100%;

    min-height:570px;

    object-fit:cover;

    transition:.7s;

}


.training-wrapper:hover .training-image img{

    transform:scale(1.04);

}


.training-content{

    display:flex;

    flex-direction:column;

    justify-content:center;

    padding:60px;

}


.training-content h2{

    color:#fff;

    font-size:42px;

    line-height:1.35;

    margin-bottom:20px;

}


.training-content h2 span{

    color:var(--sand-light);

}


.training-content > p{

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

    font-size:13px;

    line-height:1.9;

    margin-bottom:30px;

}


.training-points{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:15px;

}


.training-points > div{

    display:flex;

    align-items:center;

    gap:10px;

    padding:13px;

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

}


.training-points i{

    color:var(--sand-light);

    font-size:16px;

}


.training-points span{

    color:#fff;

    font-size:10px;

    font-weight:600;

}


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

.leadership-section{

    background:var(--cream);

}


.leadership-image-wrap{

    position:relative;

    padding:0 25px 25px 0;

}


.leadership-image-wrap::after{

    content:"";

    position:absolute;

    right:0;

    bottom:0;

    width:170px;

    height:170px;

    background:var(--maroon);

    z-index:0;

}


.leadership-image-wrap img{

    position:relative;

    z-index:2;

    width:100%;

    height:560px;

    object-fit:cover;

}


.leadership-tag{

    position:absolute;

    z-index:3;

    left:20px;

    bottom:15px;

    display:flex;

    align-items:center;

    gap:9px;

    padding:13px 18px;

    background:#fff;

    color:var(--maroon);

    font-size:9px;

    font-weight:800;

    letter-spacing:1.5px;

}


.leadership-tag i{

    color:var(--sand);

}


.leadership-points{

    margin-top:30px;

    border-top:1px solid var(--border);

}


.leadership-points > div{

    display:flex;

    align-items:flex-start;

    gap:18px;

    padding:18px 0;

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

}


.leadership-points > div > span{

    color:var(--sand);

    font-size:10px;

    font-weight:800;

    padding-top:3px;

}


.leadership-points strong{

    display:block;

    color:var(--charcoal);

    font-family:'Libre Baskerville',serif;

    font-size:14px;

}


.leadership-points p{

    color:var(--text);

    font-size:10px;

    line-height:1.7;

    margin:4px 0 0;

}


/*=========================================================
DEFENCE / NDA
=========================================================*/

.defence-section{

    background:var(--ivory);

}


.defence-wrapper{

    display:grid;

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

    min-height:570px;

    background:var(--maroon-dark);

}


.defence-content{

    padding:65px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}


.defence-content h2{

    color:#fff;

    font-size:42px;

    line-height:1.35;

    margin-bottom:20px;

}


.defence-content h2 span{

    color:var(--sand-light);

}


.defence-content > p{

    max-width:570px;

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

    font-size:13px;

    line-height:1.9;

    margin-bottom:30px;

}


.defence-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:1px;

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

}


.defence-grid > div{

    display:flex;

    flex-direction:column;

    padding:20px;

    background:var(--maroon-dark);

}


.defence-grid i{

    color:var(--sand-light);

    font-size:19px;

    margin-bottom:12px;

}


.defence-grid strong{

    color:#fff;

    font-size:11px;

}


.defence-grid span{

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

    font-size:9px;

    margin-top:3px;

}


.defence-image{

    position:relative;

    overflow:hidden;

}


.defence-image img{

    width:100%;

    height:100%;

    min-height:570px;

    object-fit:cover;

    transition:.7s;

}


.defence-wrapper:hover .defence-image img{

    transform:scale(1.04);

}


.defence-caption{

    position:absolute;

    left:25px;

    bottom:25px;

    display:flex;

    flex-direction:column;

    padding:18px 20px;

    background:rgba(40,12,18,.88);

    border-left:3px solid var(--sand);

}


.defence-caption span{

    color:var(--sand-light);

    font-size:8px;

    font-weight:800;

    letter-spacing:2px;

}


.defence-caption strong{

    color:#fff;

    font-family:'Libre Baskerville',serif;

    font-size:16px;

    margin-top:5px;

}


/*=========================================================
ADMISSION
=========================================================*/

.admission-section{

    background:var(--cream);

}


.admission-process{

    display:grid;

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

    gap:18px;

}


.admission-card{

    position:relative;

    padding:35px 28px;

    min-height:285px;

    background:#fff;

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

    transition:var(--transition);

}


.admission-card:hover{

    border-color:var(--sand);

    transform:translateY(-7px);

    box-shadow:var(--shadow);

}


.admission-number{

    position:absolute;

    top:22px;

    right:24px;

    color:var(--sand);

    font-size:10px;

    font-weight:800;

}


.admission-card > i{

    display:flex;

    align-items:center;

    justify-content:center;

    width:50px;

    height:50px;

    margin-bottom:30px;

    background:var(--cream);

    color:var(--maroon);

    font-size:19px;

}


.admission-card h3{

    font-size:19px;

    margin-bottom:12px;

}


.admission-card p{

    color:var(--text);

    font-size:11px;

    line-height:1.8;

    margin:0;

}


.admission-alert{

    display:flex;

    align-items:flex-start;

    gap:15px;

    margin-top:25px;

    padding:22px 25px;

    background:var(--ivory);

    border-left:3px solid var(--sand);

}


.admission-alert > i{

    color:var(--maroon);

    font-size:20px;

}


.admission-alert strong{

    display:block;

    color:var(--charcoal);

    font-family:'Libre Baskerville',serif;

    font-size:13px;

}


.admission-alert p{

    color:var(--text);

    font-size:10px;

    line-height:1.8;

    margin:4px 0 0;

}


/*=========================================================
HOSTEL + SPORTS TABLET
=========================================================*/

@media(max-width:1100px){

    .sports-grid{

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

    }


    .admission-process{

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

    }


    .training-content{

        padding:45px;

    }


    .defence-content{

        padding:45px;

    }

}


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

@media(max-width:768px){

    .hostel-image-wrap{

        padding-left:15px;

        padding-bottom:20px;

    }


    .hostel-image-wrap img{

        height:450px;

    }


    .hostel-badge{

        right:10px;

    }


    .sports-heading{

        display:block;

        margin-bottom:35px;

    }


    .sports-grid{

        grid-template-columns:1fr;

    }


    .sport-image{

        height:320px;

    }


    .training-wrapper{

        grid-template-columns:1fr;

    }


    .training-image img{

        min-height:350px;

        height:350px;

    }


    .training-content{

        padding:45px 30px;

    }


    .training-content h2{

        font-size:34px;

    }


    .training-points{

        grid-template-columns:1fr;

    }


    .leadership-image-wrap{

        padding-right:15px;

        padding-bottom:20px;

    }


    .leadership-image-wrap img{

        height:430px;

    }


    .defence-wrapper{

        grid-template-columns:1fr;

    }


    .defence-content{

        padding:45px 30px;

    }


    .defence-content h2{

        font-size:34px;

    }


    .defence-image img{

        min-height:400px;

        height:400px;

    }


    .admission-process{

        grid-template-columns:1fr;

    }


    .admission-card{

        min-height:250px;

    }

}


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

@media(max-width:576px){

    .hostel-image-wrap img{

        height:350px;

    }


    .hostel-badge{

        padding:14px 16px;

    }


    .sport-image{

        height:280px;

    }


    .training-image img{

        height:300px;

        min-height:300px;

    }


    .training-content{

        padding:35px 22px;

    }


    .leadership-image-wrap img{

        height:350px;

    }


    .defence-content{

        padding:35px 22px;

    }


    .defence-image img{

        height:320px;

        min-height:320px;

    }


    .defence-grid{

        grid-template-columns:1fr;

    }


    .admission-card{

        padding:30px 24px;

    }

}

/*=========================================================
SEO INFORMATION
=========================================================*/

.seo-section{

    background:var(--ivory);

}


.seo-layout{

    display:grid;

    grid-template-columns:1.3fr .7fr;

    gap:80px;

    align-items:start;

}


.seo-content{

    max-width:760px;

}


.seo-content strong{

    color:var(--maroon);

    font-weight:700;

}


.seo-sidebar{

    position:sticky;

    top:140px;

}


.seo-card{

    position:relative;

    padding:40px;

    background:var(--maroon-dark);

    overflow:hidden;

}


.seo-card::before{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

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

    border-radius:50%;

    right:-80px;

    top:-70px;

}


.seo-card-icon{

    width:52px;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(201,154,98,.15);

    color:var(--sand-light);

    font-size:19px;

    margin-bottom:25px;

}


.seo-card > span{

    color:var(--sand-light);

    font-size:8px;

    font-weight:800;

    letter-spacing:2px;

}


.seo-card h3{

    color:#fff;

    font-size:25px;

    line-height:1.4;

    margin:10px 0 25px;

}


.seo-card ul{

    list-style:none;

    padding:0;

    margin:0 0 25px;

}


.seo-card li{

    display:flex;

    align-items:center;

    gap:10px;

    padding:9px 0;

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

    font-size:10px;

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

}


.seo-card li i{

    color:var(--sand);

}


.seo-link{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:#fff;

    font-size:10px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1px;

}


.seo-link:hover{

    color:var(--sand-light);

}


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

.gallery-section{

    background:var(--cream);

}


.gallery-header{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:50px;

    margin-bottom:45px;

}


.gallery-header > p{

    max-width:420px;

    margin:0;

}


.gallery-grid{

    display:grid;

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

    grid-template-rows:270px 270px;

    gap:12px;

}


.gallery-item{

    position:relative;

    overflow:hidden;

    background:var(--maroon-dark);

}


.gallery-item::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(40,12,18,.35),
        transparent 45%
    );

    pointer-events:none;

}


.gallery-item img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.7s;

}


.gallery-item:hover img{

    transform:scale(1.07);

}


.gallery-main{

    grid-row:span 2;

}


.gallery-wide{

    grid-column:span 2;

}


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

.faq-section{

    background:var(--ivory);

}


.accordion{

    border-top:1px solid var(--border);

}


.accordion-item{

    background:transparent;

    border:0;

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

    border-radius:0 !important;

}


.accordion-button{

    padding:25px 5px;

    background:transparent;

    color:var(--charcoal);

    box-shadow:none !important;

    font-family:'Libre Baskerville',serif;

    font-size:15px;

    font-weight:700;

}


.accordion-button:not(.collapsed){

    background:transparent;

    color:var(--maroon);

}


.accordion-button::after{

    width:15px;

    height:15px;

    background-size:15px;

}


.accordion-body{

    padding:0 45px 25px 5px;

    color:var(--text);

    font-size:12px;

    line-height:1.9;

}


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

.contact-section{

    background:var(--cream);

}


.contact-wrapper{

    display:grid;

    grid-template-columns:.85fr 1.15fr;

    background:var(--maroon-dark);

}


.contact-intro{

    padding:60px;

    color:#fff;

}


.contact-intro h2{

    color:#fff;

    font-size:42px;

    line-height:1.35;

    margin-bottom:20px;

}


.contact-intro h2 span{

    color:var(--sand-light);

}


.contact-intro > p{

    max-width:430px;

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

    font-size:12px;

    line-height:1.9;

}


.contact-details{

    margin-top:40px;

}


.contact-details > div{

    display:flex;

    align-items:flex-start;

    gap:15px;

    padding:17px 0;

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

}


.contact-details i{

    color:var(--sand-light);

    font-size:17px;

    margin-top:2px;

}


.contact-details span{

    display:block;

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

    font-size:8px;

    font-weight:800;

    letter-spacing:1.5px;

}


.contact-details strong{

    display:block;

    color:#fff;

    font-size:10px;

    font-weight:600;

    margin-top:4px;

}


.contact-form{

    padding:60px;

    background:#fff;

}


.contact-form h3{

    font-size:28px;

    margin-bottom:30px;

}


.contact-form form{

    display:flex;

    flex-direction:column;

    gap:16px;

}


.contact-form .row{

    --bs-gutter-x:16px;

    --bs-gutter-y:16px;

}


.contact-form .form-control{

    width:100%;

    min-height:50px;

    padding:13px 15px;

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

    border-radius:0;

    background:var(--ivory);

    color:var(--charcoal);

    font-size:11px;

    box-shadow:none;

}


.contact-form textarea.form-control{

    resize:vertical;

    min-height:130px;

}


.contact-form .form-control:focus{

    border-color:var(--sand);

    background:#fff;

    box-shadow:0 0 0 2px rgba(201,154,98,.1);

}


.contact-form .btn-main{

    align-self:flex-start;

    cursor:pointer;

}


/*=========================================================
FOOTER
=========================================================*/

.footer{

    background:var(--maroon-dark);

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

    padding-top:75px;

}


.footer-brand{

    display:inline-flex;

    align-items:center;

    gap:12px;

    margin-bottom:22px;

}


.footer-brand img{

    width:52px;

    height:52px;

    object-fit:contain;

}


.footer-brand div{

    display:flex;

    flex-direction:column;

    line-height:1.2;

}


.footer-brand strong{

    color:#fff;

    font-family:'Libre Baskerville',serif;

    font-size:15px;

}


.footer-brand span{

    color:var(--sand-light);

    font-size:9px;

    font-weight:700;

    letter-spacing:2px;

    margin-top:4px;

}


.footer p{

    max-width:380px;

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

    font-size:10px;

    line-height:1.9;

}


.footer h4{

    color:#fff;

    font-family:'Montserrat',sans-serif;

    font-size:10px;

    font-weight:800;

    letter-spacing:1.5px;

    text-transform:uppercase;

    margin-bottom:20px;

}


.footer ul{

    list-style:none;

    padding:0;

    margin:0;

}


.footer li{

    margin-bottom:10px;

}


.footer li a{

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

    font-size:10px;

}


.footer li a:hover{

    color:var(--sand-light);

    padding-left:4px;

}


.footer-social{

    display:flex;

    gap:8px;

    margin-top:25px;

}


.footer-social a{

    width:34px;

    height:34px;

    display:flex;

    align-items:center;

    justify-content:center;

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

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

    font-size:13px;

}


.footer-social a:hover{

    background:var(--sand);

    border-color:var(--sand);

    color:#fff;

}


.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    margin-top:60px;

    padding:22px 0;

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

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

    font-size:8px;

    letter-spacing:.5px;

}


/*=========================================================
BACK TO TOP
=========================================================*/

.back-to-top{

    position:fixed;

    right:25px;

    bottom:25px;

    z-index:9990;

    width:45px;

    height:45px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:var(--maroon);

    color:#fff;

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

    opacity:0;

    visibility:hidden;

    transform:translateY(15px);

    transition:var(--transition);

}


.back-to-top.show{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}


.back-to-top:hover{

    background:var(--sand);

    color:#fff;

}


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

@media(max-width:1100px){

    .seo-layout{

        grid-template-columns:1fr;

        gap:45px;

    }


    .seo-sidebar{

        position:static;

        max-width:600px;

    }


    .contact-intro,
    .contact-form{

        padding:45px;

    }


    .gallery-grid{

        grid-template-columns:1fr 1fr;

        grid-template-rows:300px 220px 220px;

    }


    .gallery-main{

        grid-row:span 1;

        grid-column:span 2;

    }


    .gallery-wide{

        grid-column:span 2;

    }

}


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

@media(max-width:768px){

    .gallery-header{

        display:block;

        margin-bottom:35px;

    }


    .gallery-grid{

        grid-template-columns:1fr 1fr;

        grid-template-rows:240px 240px 240px;

    }


    .gallery-main{

        grid-column:span 2;

        grid-row:span 1;

    }


    .gallery-wide{

        grid-column:span 2;

    }


    .contact-wrapper{

        grid-template-columns:1fr;

    }


    .contact-intro{

        padding:45px 30px;

    }


    .contact-form{

        padding:40px 30px;

    }


    .contact-intro h2{

        font-size:34px;

    }


    .footer{

        padding-top:60px;

    }


    .footer-bottom{

        flex-direction:column;

        align-items:flex-start;

        margin-top:45px;

    }


    .back-to-top{

        right:15px;

        bottom:15px;

        width:42px;

        height:42px;

    }

}


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

@media(max-width:576px){

    .seo-card{

        padding:30px 25px;

    }


    .gallery-grid{

        grid-template-columns:1fr;

        grid-template-rows:250px 220px 220px 220px 220px;

    }


    .gallery-main,
    .gallery-wide{

        grid-column:span 1;

    }


    .gallery-main{

        grid-row:span 1;

    }


    .gallery-wide{

        grid-column:span 1;

    }


    .accordion-button{

        padding:20px 0;

        font-size:13px;

        padding-right:25px;

    }


    .accordion-body{

        padding:0 0 20px;

        font-size:11px;

    }


    .contact-intro{

        padding:35px 22px;

    }


    .contact-form{

        padding:35px 22px;

    }


    .contact-form h3{

        font-size:24px;

    }


    .contact-form .btn-main{

        width:100%;

    }


    .footer-bottom{

        font-size:7px;

    }

}


/*=========================================================
FINAL MOBILE HEADER SAFETY
=========================================================*/

@media(max-width:992px){

    /*
    The topbar disappears.
    Navbar remains fixed at 82px.
    Body receives the same offset through
    --header-height.
    */

    .site-header{

        width:100%;

    }


    .navbar-collapse{

        max-height:calc(100vh - var(--header-height));

        overflow-y:auto;

    }


    .navbar-collapse::-webkit-scrollbar{

        width:5px;

    }


    .navbar-collapse::-webkit-scrollbar-thumb{

        background:var(--sand);

    }

}


/*=========================================================
REDUCED MOTION
=========================================================*/

@media(prefers-reduced-motion:reduce){

    html{

        scroll-behavior:auto;

    }


    *,
    *::before,
    *::after{

        animation-duration:.01ms !important;

        animation-iteration-count:1 !important;

        transition-duration:.01ms !important;

    }

}

/*=========================================================
JAVASCRIPT EFFECTS
=========================================================*/

.reveal-element{

    opacity:0;

    transform:translateY(25px);

    transition:
        opacity .7s ease,
        transform .7s ease;

}


.reveal-element.revealed{

    opacity:1;

    transform:translateY(0);

}


.navbar-scrolled{

    box-shadow:
        0 8px 30px rgba(0,0,0,.10);

}


/*=========================================================
GALLERY LIGHTBOX
=========================================================*/

.image-lightbox{

    position:fixed;

    inset:0;

    z-index:10000;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:30px;

    background:rgba(25,8,12,.94);

}


.image-lightbox img{

    max-width:92vw;

    max-height:88vh;

    width:auto;

    height:auto;

    object-fit:contain;

}


.lightbox-close{

    position:absolute;

    top:20px;

    right:25px;

    width:45px;

    height:45px;

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

    background:transparent;

    color:#fff;

    font-size:30px;

    line-height:1;

    cursor:pointer;

}


.lightbox-close:hover{

    background:var(--sand);

    border-color:var(--sand);

}


@media(max-width:576px){

    .image-lightbox{

        padding:15px;

    }


    .lightbox-close{

        top:12px;

        right:12px;

    }

}


/*=========================================================
FIXED HEADER + SECTION NAVIGATION
=========================================================*/

:root{

    --header-height:120px;

}


section[id]{

    scroll-margin-top:var(--header-height);

}


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

@media(max-width:992px){

    :root{

        --header-height:82px;

    }


    html{

        scroll-padding-top:var(--header-height);

    }


    section[id]{

        scroll-margin-top:var(--header-height);

    }

}