/*======================================================
  OUROWN SIGMA EDUCATION
  Premium Landing Page
=======================================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root{

--primary:#0B3D91;
--secondary:#081F4D;
--accent:#F5B400;
--white:#ffffff;
--text:#2B3440;
--glass:rgba(255,255,255,.12);

}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{

font-family:'Poppins',sans-serif;
background:#f8fafc;
overflow-x:hidden;

}

/*==========================================
FLOATING WHATSAPP
==========================================*/

.whatsapp-float{

    position:fixed;

    right:25px;

    bottom:25px;

    width:65px;

    height:65px;

    background:#25D366;

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:34px;

    text-decoration:none;

    box-shadow:0 12px 35px rgba(37,211,102,.45);

    z-index:9999;

    transition:.35s;

    animation:whatsappPulse 2s infinite;

}

.whatsapp-float:hover{

    transform:translateY(-5px) scale(1.08);

    color:#fff;

    background:#1ebe5d;

    box-shadow:0 18px 45px rgba(37,211,102,.6);

}

@keyframes whatsappPulse{

    0%{

        box-shadow:0 0 0 0 rgba(37,211,102,.55);

    }

    70%{

        box-shadow:0 0 0 18px rgba(37,211,102,0);

    }

    100%{

        box-shadow:0 0 0 0 rgba(37,211,102,0);

    }

}

/* Mobile */

@media (max-width:768px){

    .whatsapp-float{

        width:58px;

        height:58px;

        font-size:30px;

        right:18px;

        bottom:18px;

    }

}

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

.sigma-nav{

padding:22px 0;

transition:.4s;

background:#0b4db9 !important;
    box-shadow:0 6px 20px rgba(0,0,0,.08);

z-index:999;

}

.sigma-nav.scrolled{

background:rgba(8,31,77,.95);

backdrop-filter:blur(15px);

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

padding:14px 0;

}

.navbar-brand{

font-size:28px;

font-weight:800;

letter-spacing:1px;

}

.nav-link{

color:#fff!important;

margin-left:18px;

font-weight:500;

position:relative;

}

.nav-link:after{

content:"";

position:absolute;

left:0;

bottom:-5px;

width:0;

height:2px;

background:var(--accent);

transition:.35s;

}

.nav-link:hover:after{

width:100%;

}

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

.hero{

position:relative;

height:100vh;

overflow:hidden;

}

.heroSwiper{

height:100%;

}

.swiper-slide{

position:relative;

background-size:cover;

background-position:center;

display:flex;

align-items:center;

}

/* Replace with your own images */

.slide1{

background-image:url("../images/slide1.jpg");

}

.slide2{

background-image:url("../images/slide2.jpg");

}

.slide3{

background-image:url("../images/slide3.jpg");

}

.overlay{

position:absolute;

inset:0;

background:

linear-gradient(

90deg,

rgba(5,18,44,.82),

rgba(5,18,44,.55)

);

}

.hero-content{

position:relative;

z-index:5;

max-width:700px;

color:#fff;

}

.hero-content span{

display:inline-block;

padding:10px 18px;

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

border-radius:40px;

margin-bottom:30px;

font-size:14px;

letter-spacing:2px;

backdrop-filter:blur(10px);

}

.hero-content h1{

font-size:74px;

font-weight:800;

line-height:1.1;

margin-bottom:25px;

}

.hero-content p{

font-size:21px;

max-width:650px;

margin-bottom:35px;

color:#E5E9F4;

}

.hero-buttons .btn{

padding:14px 34px;

margin-right:15px;

font-weight:600;

}

/*======================================================
FLOATING STATS
======================================================*/

.floating-box{

position:absolute;

bottom:40px;

left:50%;

transform:translateX(-50%);

z-index:50;

width:min(1200px,92%);

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

backdrop-filter:blur(20px);

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

border-radius:26px;

display:grid;

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

padding:28px;

box-shadow:

0 30px 80px rgba(0,0,0,.25);

}

.floating-box div{

text-align:center;

}

.floating-box h3{

font-size:42px;

font-weight:800;

color:#fff;

margin-bottom:6px;

}

.floating-box p{

margin:0;

color:#F4F4F4;

}

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

.btn-warning{

background:var(--accent);

border:none;

color:#222;

transition:.35s;

}

.btn-warning:hover{

transform:translateY(-3px);

background:#ffd043;

}

.btn-outline-light:hover{

color:#000;

}

/*======================================================
PAGINATION
======================================================*/

.swiper-pagination-bullet{

background:#fff;

opacity:.5;

}

.swiper-pagination-bullet-active{

opacity:1;

background:var(--accent);

}

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

footer{

background:#07182E;

color:#fff;

padding:90px 0 30px;

}

footer h3{

font-size:30px;

font-weight:800;

margin-bottom:20px;

}

footer h5{

margin-bottom:18px;

}

footer p{

color:#d0d8e5;

}

footer ul{

list-style:none;

padding:0;

}

footer li{

padding:7px 0;

color:#d0d8e5;

}

.social{

margin-top:20px;

}

.social i{

font-size:26px;

margin-left:12px;

cursor:pointer;

transition:.35s;

}

.social i:hover{

color:var(--accent);

transform:translateY(-4px);

}

footer hr{

border-color:rgba(255,255,255,.12);

margin:40px 0 20px;

}

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

@media(max-width:992px){

.hero-content{

text-align:center;

margin:auto;

}

.hero-content h1{

font-size:52px;

}

.hero-content p{

font-size:18px;

}

.floating-box{

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

gap:20px;

position:relative;

margin-top:-90px;

bottom:auto;

left:auto;

transform:none;

width:92%;

}

}

@media(max-width:768px){

.hero{

height:90vh;

}

.hero-content h1{

font-size:38px;

}

.hero-content span{

font-size:12px;

}

.hero-content p{

font-size:16px;

}

.hero-buttons .btn{

display:block;

width:100%;

margin-bottom:15px;

}

.floating-box{

grid-template-columns:1fr;

}

.navbar-brand{

font-size:22px;

}

}

/*=========================================================
SIGMA LANDING V3
=========================================================*/

:root{

--blue:#0B3D91;
--dark:#051935;
--gold:#F5B400;
--white:#ffffff;
--grey:#eef3fb;

}

*{

margin:0;
padding:0;
box-sizing:border-box;

}

html{

scroll-behavior:smooth;

}

body{

font-family:'Poppins',sans-serif;
background:#fff;
overflow-x:hidden;

}

/***************************************************
NAVBAR
***************************************************/

.sigma-nav{

background:transparent;
padding:28px 0;
transition:.4s;
z-index:9999;

}

.sigma-nav.scrolled{

background:rgba(5,25,53,.92);

backdrop-filter:blur(20px);

padding:15px 0;

box-shadow:0 10px 40px rgba(0,0,0,.18);

}

.navbar-brand{

font-size:34px;

font-weight:800;

color:white!important;

letter-spacing:1px;

}

.nav-link{

color:white!important;

font-weight:500;

margin-left:22px;

position:relative;

}

.nav-link:before{

content:"";

position:absolute;

left:0;

bottom:-6px;

width:0;

height:3px;

background:var(--gold);

transition:.35s;

}

.nav-link:hover:before{

width:100%;

}

/***************************************************
HERO
***************************************************/

.hero-section{

position:relative;

height:100vh;

overflow:hidden;

display:flex;

align-items:center;

background:

linear-gradient(

120deg,

rgba(5,25,53,.88),

rgba(11,61,145,.55)

),

url("../images/slide1.jpg");

background-size:cover;

background-position:center;

}

.hero-section:before{

content:"";

position:absolute;

width:900px;

height:900px;

right:-250px;

top:-250px;

border-radius:50%;

background:

radial-gradient(

rgba(245,180,0,.20),

transparent 70%

);

animation:rotateBlob 30s linear infinite;

}

@keyframes rotateBlob{

100%{

transform:rotate(360deg);

}

}

.hero-text{

position:relative;

z-index:5;

color:white;

max-width:720px;

}

.hero-text span{

display:inline-block;

padding:12px 24px;

border-radius:40px;

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

backdrop-filter:blur(20px);

margin-bottom:35px;

font-size:14px;

letter-spacing:2px;

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

}

.hero-text h1{

font-size:78px;

font-weight:800;

line-height:1.05;

margin-bottom:28px;

}

.hero-text p{

font-size:22px;

max-width:640px;

color:#f1f3f7;

margin-bottom:40px;

}

.hero-text .btn{

padding:15px 40px;

font-weight:700;

border-radius:50px;

margin-right:15px;

}

.btn-warning{

background:var(--gold);

border:none;

}

.btn-warning:hover{

transform:translateY(-4px);

}

/***************************************************
FLOATING CARDS
***************************************************/

.floating-box{

position:absolute;

bottom:45px;

left:50%;

transform:translateX(-50%);

width:min(1180px,92%);

display:grid;

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

gap:25px;

z-index:8;

background:none;

}

.floating-box div{

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

backdrop-filter:blur(20px);

border-radius:25px;

padding:28px;

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

text-align:center;

transition:.35s;

}

.floating-box div:hover{

transform:translateY(-8px);

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

}

.floating-box h3{

color:white;

font-size:44px;

font-weight:800;

margin-bottom:6px;

}

.floating-box p{

margin:0;

color:white;

}

/***************************************************
SWIPER
***************************************************/

.heroSwiper{

height:100%;

}

.swiper-slide{

display:flex;

align-items:center;

}

.swiper-pagination-bullet{

background:white;

width:12px;

height:12px;

}

.swiper-pagination-bullet-active{

background:var(--gold);

}

/***************************************************
FOOTER
***************************************************/

footer{

background:#061223;

padding:100px 0 30px;

color:white;

}

footer h3{

font-size:34px;

font-weight:800;

margin-bottom:25px;

}

footer h5{

margin-bottom:20px;

}

footer ul{

padding:0;

list-style:none;

}

footer li{

padding:8px 0;

color:#d4d9e5;

}

footer p{

color:#d4d9e5;

}

footer hr{

margin:40px 0 20px;

border-color:rgba(255,255,255,.12);

}

/***************************************************
RESPONSIVE
***************************************************/

@media(max-width:992px){

.hero-text{

text-align:center;

margin:auto;

}

.hero-text h1{

font-size:50px;

}

.hero-text p{

font-size:18px;

}

.floating-box{

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

bottom:20px;

}

}

@media(max-width:768px){

.hero-text h1{

font-size:36px;

}

.hero-text p{

font-size:16px;

}

.floating-box{

grid-template-columns:1fr;

position:relative;

left:auto;

bottom:auto;

transform:none;

margin:30px auto;

}

}

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

.hero-v2{
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,#062b63 0%,#0b5ed7 100%);
    color:#fff;
    padding-top:120px;
    padding-bottom:120px;
}

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

.hero-v2 h2{
    font-size:58px;
    font-weight:800;
    line-height:1.1;
    margin-bottom:25px;
}

.hero-v2 h2 span{
    color:#ffc107;
}

.hero-v2 p{
    font-size:18px;
    opacity:.95;
    margin-bottom:35px;
    max-width:560px;
}

.hero-buttons{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}

.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 18px;
    border-radius:50px;
    background:rgba(255,255,255,.12);
    backdrop-filter:blur(10px);
    margin-bottom:30px;
    font-weight:600;
}

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

.hero-image-stack{

    position:relative;

    width:100%;

    height:650px;

    display:flex;

    justify-content:center;

    align-items:center;

}

/* Main Student */

.hero-main{

    width:430px;

    max-width:90%;

    border-radius:28px;

    object-fit:cover;

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

    position:absolute;

    z-index:5;

}

/* Common style */

.hero-small{

    position:absolute;

    width:240px;

    border-radius:22px;

    object-fit:cover;

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

    border:8px solid #fff;

    transition:.4s;

    z-index:20;          /* IMPORTANT */

}

.hero-small:hover{

    transform:translateY(-8px);

}

/* Classroom */

.hero-small-1{

    top:10px;

    left:10px;

}

/* Topper */

.hero-small-2{

    bottom:10px;

    right:10px;

}

/* Experience Card */

.experience-card{

    position:absolute;

    left:45px;

    bottom:120px;

    background:#fff;

    color:#111;

    padding:18px 25px;

    border-radius:20px;

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

    z-index:30;

}

.experience-card h2{

    margin:0;

    font-size:36px;

    color:#0d6efd;

    font-weight:800;

}

.experience-card p{

    margin:0;

    color:#555;

    font-size:15px;

}

/*==========================
Background Shapes
===========================*/

.hero-shape{

    position:absolute;

    border-radius:50%;

    filter:blur(60px);

    opacity:.25;

}

.hero-shape-1{

    width:350px;

    height:350px;

    background:#00d4ff;

    top:-120px;

    left:-100px;

}

.hero-shape-2{

    width:450px;

    height:450px;

    background:#ffd54f;

    right:-180px;

    bottom:-150px;

}

.hero-wave{

    position:absolute;

    bottom:0;

    left:0;

    width:100%;

    height:70px;

}

/*==========================
Responsive
===========================*/

@media(max-width:991px){

.hero-v2{

    text-align:center;

}

.hero-v2 h2{

    font-size:42px;

}

.hero-image-stack{

    height:560px;

    margin-top:50px;

}

.hero-main{

    width:340px;

}

.hero-small{

    width:180px;

}

.hero-small-1{

    left:0;

    top:20px;

}

.hero-small-2{

    right:0;

    bottom:20px;

}

.experience-card{

    left:50%;

    transform:translateX(-50%);

    bottom:15px;

}

}

@media(max-width:576px){

.hero-v2 h2{

    font-size:34px;

}

.hero-image-stack{

    height:480px;

}

.hero-main{

    width:280px;

}

.hero-small{

    width:140px;

}

.hero-small-1{

    top:10px;

    left:0;

}

.hero-small-2{

    right:0;

    bottom:50px;

}

}
.main-img{

width:100%;
height:430px;

object-fit:cover;

border-radius:28px;

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

}

.bottom-images{

display:grid;

grid-template-columns:1fr 1fr;

gap:18px;

margin-top:18px;

}

.bottom-images img{

width:100%;

height:180px;

object-fit:cover;

border-radius:22px;

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

transition:.35s;

}

.bottom-images img:hover{

transform:translateY(-6px);

}

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

.page-hero{

background:linear-gradient(135deg,#062b63,#0b5ed7);

padding:170px 0 110px;

position:relative;

overflow:hidden;

color:#fff;

}

.page-title{

position:relative;

z-index:2;

text-align:center;

}

.page-title h1{

font-size:56px;

font-weight:800;

margin-bottom:20px;

}

.breadcrumb-box{

display:inline-flex;

align-items:center;

gap:12px;

padding:12px 28px;

border-radius:50px;

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

backdrop-filter:blur(12px);

font-weight:500;

}

.breadcrumb-box a{

color:#fff;

text-decoration:none;

}

.policy-section{

background:#f5f8fc;

padding:90px 0;

}

.policy-card{

background:#fff;

padding:60px;

border-radius:25px;

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

}

.policy-card h3{

margin-top:40px;

margin-bottom:15px;

font-weight:700;

color:#0b4db9;

}

.policy-card p{

line-height:1.9;

color:#555;

font-size:16px;

}

.policy-card ul{

padding-left:20px;

}

.policy-card li{

padding:8px 0;

color:#555;

}

@media(max-width:768px){

.page-title h1{

font-size:38px;

}

.policy-card{

padding:35px;

}

}