/*
==========================================================
ALTERMIND THEME
Main Stylesheet
Version: 3.0
Author: AlterMind
==========================================================
*/


/*=========================================================
RESET
=========================================================*/

*,
*::before,
*::after{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
    -webkit-text-size-adjust:100%;
}

body{
    font-family:'Inter',sans-serif;
    font-size:16px;
    line-height:1.7;
    color:#FFFFFF;
    background:#07111F;
    overflow-x:hidden;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section{
    display:block;
}

img{
    display:block;
    max-width:100%;
    height:auto;
    border:0;
}

svg{
    display:block;
    max-width:100%;
}

a{
    color:inherit;
    text-decoration:none;
    transition:.3s ease;
}

button{
    font:inherit;
    cursor:pointer;
    border:none;
    background:none;
}

input,
textarea,
select{
    font:inherit;
}

ul,
ol{
    list-style:none;
}

table{
    border-collapse:collapse;
    border-spacing:0;
    width:100%;
}

iframe{
    border:0;
}


/*=========================================================
DESIGN TOKENS
=========================================================*/

:root{

    /* Colors */

    --bg:#07111F;
    --bg-alt:#081322;

    --surface:#0D1B33;
    --surface-2:#10203A;

    --primary:#38BDF8;
    --primary-dark:#2563EB;

    --accent:#D4AF37;

    --text:#FFFFFF;
    --muted:#B7C3D7;

    --border:rgba(255,255,255,.08);

    --shadow:
        0 15px 45px rgba(0,0,0,.28);

    --transition:.3s ease;

    --radius-sm:12px;
    --radius:20px;
    --radius-lg:28px;
    --radius-pill:999px;

    --container:1400px;

    --section-space:100px;

}


/*=========================================================
TYPOGRAPHY
=========================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    color:var(--text);

    font-family:'Poppins',sans-serif;

    line-height:1.15;

    font-weight:700;

}

h1{

    font-size:68px;

    line-height:1.05;

    letter-spacing:-.03em;

    margin-bottom:28px;

}

h2{

    font-size:48px;

    letter-spacing:-.02em;

    margin-bottom:22px;

}

h3{

    font-size:30px;

    margin-bottom:18px;

}

h4{

    font-size:22px;

    margin-bottom:14px;

}

p{

    color:var(--muted);

    font-size:18px;

    line-height:1.8;

    margin-bottom:24px;

}

strong{

    font-weight:700;

}

small{

    font-size:.875rem;

}


/*=========================================================
LAYOUT
=========================================================*/

.site-main{

    position:relative;

    overflow:hidden;

    min-height:100vh;

}

.am-container{

    width:min(var(--container),92%);

    margin-inline:auto;

}

section{

    position:relative;

    padding:var(--section-space) 0;

}


/*=========================================================
PAGE HEADER
=========================================================*/

.page-header{

    padding:170px 0 80px;

    background:#081322;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.page-header h1{

    margin-bottom:15px;

}

.archive-description{

    max-width:760px;

    color:var(--muted);

}


/*=========================================================
HELPERS
=========================================================*/

.text-center{

    text-align:center;

}

.text-white{

    color:#FFFFFF;

}

.text-primary{

    color:var(--primary);

}

.text-muted{

    color:var(--muted);

}

.mt-20{margin-top:20px;}
.mt-30{margin-top:30px;}
.mt-40{margin-top:40px;}
.mt-60{margin-top:60px;}

.mb-20{margin-bottom:20px;}
.mb-30{margin-bottom:30px;}
.mb-40{margin-bottom:40px;}
.mb-60{margin-bottom:60px;}

.d-flex{

    display:flex;

}

.align-center{

    align-items:center;

}

.justify-between{

    justify-content:space-between;

}

.justify-center{

    justify-content:center;

}

.w-100{

    width:100%;

}


/*=========================================================
GRID
=========================================================*/

.grid-2{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:40px;

}

.grid-3{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.grid-4{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}


/*=========================================================
BUTTONS
=========================================================*/

.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:15px 34px;

    border-radius:999px;

    font-weight:600;

    transition:var(--transition);

}

.btn-primary{

    color:#fff;

    background:
        linear-gradient(
            135deg,
            var(--primary),
            var(--primary-dark)
        );

    box-shadow:
        0 12px 35px rgba(37,99,235,.30);

}

.btn-primary:hover{

    transform:translateY(-3px);

    box-shadow:
        0 18px 40px rgba(37,99,235,.45);

}

.btn-secondary{

    color:#fff;

    border:1px solid rgba(255,255,255,.10);

    background:rgba(255,255,255,.04);

}

.btn-secondary:hover{

    border-color:var(--primary);

    color:var(--primary);

}

.am-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:18px;

    margin-top:40px;

}


/*=========================================================
CARDS
=========================================================*/

.card{

    position:relative;

    overflow:hidden;

    background:var(--surface);

    border:1px solid rgba(255,255,255,.08);

    border-radius:24px;

    padding:40px;

    transition:var(--transition);

    box-shadow:var(--shadow);

}

.card::before{

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(

            180deg,

            rgba(255,255,255,.04),

            transparent 45%

        );

    opacity:0;

    transition:.3s;

}

.card:hover{

    transform:translateY(-8px);

    border-color:var(--primary);

}

.card:hover::before{

    opacity:1;

}

.card h3{

    margin-bottom:18px;

}

.card p:last-child{

    margin-bottom:0;

}
/*=========================================================
HEADER
=========================================================*/

.site-header{

    position:fixed;

    top:0;
    left:0;

    width:100%;

    z-index:9999;

    transition:.35s ease;

    background:rgba(7,17,31,.55);

    backdrop-filter:blur(18px);

    border-bottom:1px solid rgba(255,255,255,.05);

}

.site-header.scrolled{

    background:rgba(5,11,22,.92);

    box-shadow:0 12px 35px rgba(0,0,0,.30);

}

.site-header .am-container{

    display:flex;

    align-items:center;

    justify-content:space-between;

    min-height:90px;

}


/*=========================================================
LOGO
=========================================================*/

.logo,
.am-logo{

    display:flex;

    align-items:center;

    gap:14px;

}

.custom-logo,
.am-logo img{

    display:block;

    max-height:58px;

    width:auto;

}

.am-logo h2{

    margin:0;

    font-size:30px;

    line-height:1;

}

.am-logo p{

    margin:4px 0 0;

    font-size:12px;

    color:#9CB2D4;

}


/*=========================================================
PRIMARY NAVIGATION
=========================================================*/

.main-nav{

    display:flex;

    align-items:center;

}

.nav-menu{

    display:flex;

    align-items:center;

    gap:38px;

    margin:0;

    padding:0;

    list-style:none;

}

.nav-menu li{

    position:relative;

}

.nav-menu a{

    display:block;

    position:relative;

    color:#FFFFFF;

    font-weight:600;

    padding:10px 0;

    transition:var(--transition);

}

.nav-menu a:hover,

.nav-menu .current-menu-item > a,

.nav-menu .current_page_item > a,

.nav-menu .current-menu-ancestor > a{

    color:var(--primary);

}


/*=========================================================
NAVIGATION UNDERLINE
=========================================================*/

.nav-menu li::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    border-radius:999px;

    background:var(--primary);

    transition:.3s ease;

}

.nav-menu li:hover::after,

.nav-menu .current-menu-item::after,

.nav-menu .current_page_item::after{

    width:100%;

}


/*=========================================================
HEADER CTA
=========================================================*/

.header-actions{

    display:flex;

    align-items:center;

    gap:18px;

}


/*=========================================================
MOBILE TOGGLE
=========================================================*/

.mobile-toggle{

    display:none;

    width:46px;

    height:46px;

    border-radius:50%;

    color:#FFFFFF;

    background:rgba(255,255,255,.06);

    transition:.3s;

}

.mobile-toggle:hover{

    background:rgba(255,255,255,.12);

}


/*=========================================================
MOBILE DRAWER
=========================================================*/

.mobile-menu{

    position:fixed;

    top:0;

    right:-360px;

    width:340px;

    max-width:90%;

    height:100vh;

    padding:100px 30px 40px;

    background:#08111F;

    transition:right .35s ease;

    z-index:10001;

    overflow-y:auto;

    display:flex;

    flex-direction:column;

    box-shadow:-10px 0 40px rgba(0,0,0,.45);

}

.mobile-menu.open{

    right:0;

}

.mobile-close{

    position:absolute;

    top:24px;

    right:24px;

    width:42px;

    height:42px;

    border-radius:50%;

    display:grid;

    place-items:center;

    color:#FFFFFF;

    font-size:28px;

    transition:.3s;

}

.mobile-close:hover{

    background:rgba(255,255,255,.08);

}


/*=========================================================
MOBILE MENU LIST
=========================================================*/

.mobile-menu-list{

    display:flex;

    flex-direction:column;

    gap:22px;

    list-style:none;

    margin:0;

    padding:0;

}

.mobile-menu-list li{

    margin:0;

}

.mobile-menu-list a{

    display:block;

    color:#FFFFFF;

    font-size:1.05rem;

    font-weight:500;

    transition:.3s;

}

.mobile-menu-list a:hover{

    color:var(--primary);

}


/*=========================================================
MOBILE CTA
=========================================================*/

.mobile-cta{

    margin-top:40px;

    display:flex;

    flex-direction:column;

    gap:16px;

}


/*=========================================================
MOBILE OVERLAY
=========================================================*/

.mobile-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.50);

    backdrop-filter:blur(4px);

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:10000;

}

.mobile-overlay.show{

    opacity:1;

    visibility:visible;

}


/*=========================================================
STICKY HEADER TRANSITION
=========================================================*/

.site-header,
.site-header *{

    transition:

        background .3s ease,

        color .3s ease,

        border-color .3s ease,

        transform .3s ease,

        opacity .3s ease;

}
/*=========================================================
HERO
=========================================================*/

.hero{

    position:relative;
    overflow:hidden;

    padding:180px 0 140px;

    background:
        radial-gradient(circle at 15% 20%, rgba(56,189,248,.18), transparent 35%),
        radial-gradient(circle at 85% 10%, rgba(37,99,235,.14), transparent 35%),
        radial-gradient(circle at 50% 120%, rgba(212,175,55,.08), transparent 45%),
        linear-gradient(
            180deg,
            #050B16 0%,
            #07111F 40%,
            #09172B 100%
        );

}

.hero::before{

    content:"";

    position:absolute;

    inset:0;

    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);

    background-size:40px 40px;

    opacity:.06;

    pointer-events:none;

}

.hero::after{

    content:"";

    position:absolute;

    width:950px;
    height:950px;

    right:-220px;
    top:-200px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(56,189,248,.16),
            transparent 70%
        );

    filter:blur(140px);

    pointer-events:none;

    animation:heroFloat 16s ease-in-out infinite;

}

@keyframes heroFloat{

    0%{

        transform:
            translateY(0)
            translateX(0);

    }

    50%{

        transform:
            translateY(25px)
            translateX(-15px);

    }

    100%{

        transform:
            translateY(0)
            translateX(0);

    }

}

.hero .am-container{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:70px;

}

.hero .am-container::before{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-180px;

    width:500px;
    height:500px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(56,189,248,.08),
            transparent 70%
        );

    filter:blur(120px);

    pointer-events:none;

    z-index:0;

}

.hero-content{

    position:relative;

    z-index:2;

    flex:1 1 55%;

    max-width:700px;

    padding-top:20px;

}

.hero-sub{

    display:inline-flex;

    align-items:center;

    padding:8px 18px;

    border-radius:999px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    margin-bottom:28px;

    color:#7FD6FF;

    font-size:14px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:.18em;

}

.hero h1{

    font-size:72px;

    line-height:1.02;

    letter-spacing:-.04em;

    max-width:12ch;

    margin-bottom:32px;

}

.hero p{

    max-width:620px;

    font-size:21px;

    line-height:1.75;

    color:#B7C3D7;

    margin-bottom:48px;

}

.hero-visual{

    flex:1 1 45%;

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:520px;

    position:relative;

    isolation:isolate;

}

.hero-visual::before{

    content:"";

    position:absolute;

    inset:10%;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(56,189,248,.18) 0%,
            rgba(37,99,235,.10) 35%,
            transparent 70%
        );

    filter:blur(70px);

    animation:auraFloat 12s ease-in-out infinite;

    z-index:-2;

}

.hero-visual::after{

    content:"";

    position:absolute;

    width:520px;

    height:520px;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.05);

    animation:haloSpin 60s linear infinite;

    z-index:-1;

}


/*=========================================================
INTELLIGENCE SPHERE
=========================================================*/

.intelligence-sphere{

    width:100%;

    max-width:560px;

    height:auto;

    overflow:visible;

    animation:sphereFloat 10s ease-in-out infinite;

}

#aiSphere{

    width:100%;

    height:560px;

    display:block;

}

.orbit{

    transform-origin:center;

}

.orbit circle{

    fill:none;

    stroke:rgba(56,189,248,.16);

    stroke-width:2;

}

.orbit-1{

    animation:orbitClockwise 42s linear infinite;

}

.orbit-2{

    animation:orbitCounter 30s linear infinite;

}

.orbit-3{

    animation:orbitClockwise 22s linear infinite;

}

.orbit-4{

    animation:orbitCounter 14s linear infinite;

}

.connections line{

    stroke:url(#lineGradient);

    stroke-width:1.6;

    stroke-linecap:round;

    opacity:.55;

    filter:url(#glow);

}

.nodes circle{

    fill:#38BDF8;

    filter:url(#glow);

    animation:nodeBlink 3s ease-in-out infinite;

}

.nodes circle:nth-child(2){animation-delay:.4s;}
.nodes circle:nth-child(3){animation-delay:.8s;}
.nodes circle:nth-child(4){animation-delay:1.2s;}
.nodes circle:nth-child(5){animation-delay:1.6s;}
.nodes circle:nth-child(6){animation-delay:2s;}
.nodes circle:nth-child(7){animation-delay:2.4s;}
.nodes circle:nth-child(8){animation-delay:.7s;}
.nodes circle:nth-child(9){animation-delay:1.5s;}
.nodes circle:nth-child(10){animation-delay:.2s;}
.nodes circle:nth-child(11){animation-delay:2.2s;}
.nodes circle:nth-child(12){animation-delay:1.1s;}
.nodes circle:nth-child(13){animation-delay:2.8s;}

.core{

    fill:url(#coreGradient);

    filter:url(#glow);

    animation:pulseCore 4s ease-in-out infinite;

}

.core-glow{

    fill:#38BDF8;

    opacity:.18;

    animation:glowCore 5s ease-in-out infinite;

}

.gold-node{

    fill:#D4AF37;

    filter:url(#glow);

    animation:goldPulse 5s ease-in-out infinite;

}

.hero-visual:hover .orbit-1{animation-duration:22s;}
.hero-visual:hover .orbit-2{animation-duration:16s;}
.hero-visual:hover .orbit-3{animation-duration:12s;}
.hero-visual:hover .orbit-4{animation-duration:8s;}
.hero-visual:hover .core{transform:scale(1.15);}


/*=========================================================
SPHERE KEYFRAMES
=========================================================*/

@keyframes goldPulse{

    0%,100%{

        opacity:.5;
        transform:scale(1);

    }

    50%{

        opacity:1;
        transform:scale(1.5);

    }

}

@keyframes orbitClockwise{

    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}

}

@keyframes orbitCounter{

    from{transform:rotate(360deg);}
    to{transform:rotate(0deg);}

}

@keyframes pulseCore{

    0%,100%{transform:scale(1);}
    50%{transform:scale(1.08);}

}

@keyframes glowCore{

    0%,100%{opacity:.18;}
    50%{opacity:.40;}

}

@keyframes nodeBlink{

    0%,100%{

        opacity:.45;
        transform:scale(1);

    }

    50%{

        opacity:1;
        transform:scale(1.7);

    }

}

@keyframes sphereFloat{

    0%,100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

}

@keyframes auraFloat{

    0%,100%{

        transform:translate(0,0) scale(1);

    }

    50%{

        transform:translate(-20px,-12px) scale(1.08);

    }

}

@keyframes haloSpin{

    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}

}

@keyframes dataFlow{

    from{stroke-dashoffset:0;}
    to{stroke-dashoffset:-120;}

}
/*=========================================================
SECTION TITLES
=========================================================*/

.section-title{
    margin-bottom:70px;
}

.section-title span{
    display:block;
    color:var(--primary);
    font-size:15px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:2px;
    margin-bottom:15px;
}

.section-title h2{
    color:var(--text);
}

.section-title p{
    max-width:760px;
}

.philosophy .section-title,
.ecosystem .section-title,
.impact .section-title,
.cta .section-title{
    text-align:center;
}

.philosophy .section-title p,
.ecosystem .section-title p,
.impact .section-title p,
.cta .section-title p{
    margin-left:auto;
    margin-right:auto;
}


/*=========================================================
ECOSYSTEM
=========================================================*/

.ecosystem{
    background:var(--bg-alt);
}

.ecosystem-map{
    margin-top:60px;
}

.ecosystem-center{
    text-align:center;
    max-width:520px;
    margin:0 auto 60px;
    padding:45px;
    background:var(--surface-2);
    border:1px solid #274567;
    border-radius:24px;
}

.ecosystem-center h3{
    color:var(--primary);
    font-size:38px;
    margin-bottom:15px;
}

.ecosystem-center p{
    color:#D5E3F4;
    margin:0;
}

.ecosystem-pillars{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.ecosystem-card{
    text-align:center;
}

.ecosystem-card h3{
    margin-bottom:20px;
}

.ecosystem-card .btn{
    margin-top:25px;
}


/*=========================================================
PROGRAMS
=========================================================*/

.programs{
    background:var(--bg);
}

.programs .card{
    position:relative;
    overflow:hidden;
    padding:45px;
}

.programs .card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:6px;
    height:100%;
    background:var(--primary);
}

.programs .card h3{
    color:var(--text);
    margin-bottom:20px;
}

.programs .card p{
    margin-bottom:0;
}

.programs .card:hover{
    transform:translateY(-10px);
}
/*=========================================================
PHILOSOPHY
=========================================================*/

.philosophy{
    background:var(--bg);
}

.philosophy .card{
    padding:70px;
}

.philosophy h2{
    color:var(--text);
}

.philosophy h2 span{
    color:var(--primary);
}

.philosophy p{
    font-size:19px;
    color:var(--muted);
}


/*=========================================================
EVOCO CLUB
=========================================================*/

.evoco{
    background:#091427;
}

.evoco .card{
    text-align:center;
    padding:45px;
    border-radius:24px;
}

.evoco .card h3{
    color:var(--text);
    margin-bottom:20px;
}

.evoco .card p{
    margin-bottom:0;
}

.evoco .am-buttons{
    justify-content:center;
    margin-top:60px;
}

.evoco .card:hover{
    transform:translateY(-6px);
    background:#11213B;
}


/*=========================================================
PARTNERSHIPS
=========================================================*/

.partnerships{
    background:var(--bg);
}

.partnerships .card{
    padding:50px;
    border-left:5px solid var(--primary);
}

.partnerships .card h3{
    margin-bottom:20px;
}

.partnerships .card p{
    margin-bottom:35px;
}

.partnerships .card:hover{
    transform:translateY(-8px);
}


/*=========================================================
IMPACT
=========================================================*/

.impact{
    background:#081322;
}

.impact .section-title{
    margin-bottom:60px;
}

.impact .grid-4{
    gap:30px;
}

.impact .card{
    text-align:center;
    padding:50px 30px;
    border-radius:24px;
    background:var(--surface-2);
}

.impact .card h3{
    font-size:28px;
    color:var(--primary);
    margin-bottom:0;
}

.impact .card:hover{
    transform:translateY(-8px);
    border-color:var(--primary);
}


/*=========================================================
FINAL CTA
=========================================================*/

.cta{
    background:linear-gradient(
        180deg,
        #081322 0%,
        var(--bg) 100%
    );
}

.cta .card{
    position:relative;
    overflow:hidden;
    text-align:center;
    padding:90px 70px;
    border-radius:28px;
}

.cta .card::before{
    content:"";
    position:absolute;
    top:-120px;
    right:-120px;
    width:260px;
    height:260px;
    border-radius:50%;
    background:rgba(56,189,248,.08);
}

.cta .card > *{
    position:relative;
    z-index:2;
}

.cta h2{
    margin-bottom:25px;
}

.cta p{
    max-width:760px;
    margin:0 auto 40px;
}

.cta .am-buttons{
    justify-content:center;
}
/*=========================================================
BACKGROUND HELPERS
=========================================================*/

.bg-dark{
    background:var(--bg);
}

.bg-surface{
    background:var(--surface);
}


/*=========================================================
SPACING HELPERS
=========================================================*/

.mt-20{margin-top:20px;}
.mt-30{margin-top:30px;}
.mt-40{margin-top:40px;}
.mt-60{margin-top:60px;}

.mb-20{margin-bottom:20px;}
.mb-30{margin-bottom:30px;}
.mb-40{margin-bottom:40px;}
.mb-60{margin-bottom:60px;}


/*=========================================================
TEXT HELPERS
=========================================================*/

.text-center{
    text-align:center;
}

.text-white{
    color:var(--text);
}

.text-primary{
    color:var(--primary-dark);
}

.text-secondary{
    color:var(--primary);
}

.text-muted{
    color:var(--muted);
}


/*=========================================================
FOOTER
=========================================================*/

.am-footer{
    background:#050B17;
    border-top:1px solid #1A2742;
    padding:70px 0;
}

.am-footer p{
    margin:0;
    text-align:center;
    color:var(--muted);
}


/*=========================================================
WORDPRESS IMAGES
=========================================================*/

.wp-post-image{
    display:block;
    width:100%;
    height:auto;
    margin-bottom:20px;
    border-radius:18px;
}

.alignleft{
    float:left;
    margin:0 25px 20px 0;
}

.alignright{
    float:right;
    margin:0 0 20px 25px;
}

.aligncenter{
    display:block;
    margin:20px auto;
}

.alignnone{
    display:block;
}

.wp-caption{
    max-width:100%;
    margin-bottom:20px;
}

.wp-caption img{
    display:block;
}

.wp-caption-text{
    margin-top:10px;
    font-size:14px;
    text-align:center;
    color:var(--muted);
}

.gallery{
    overflow:hidden;
}

.gallery img{
    display:block;
}


/*=========================================================
TABLES
=========================================================*/

table{
    width:100%;
    border-collapse:collapse;
    margin-bottom:30px;
}

table th{
    padding:16px;
    text-align:left;
    color:var(--text);
    background:var(--surface);
}

table td{
    padding:16px;
    border:1px solid #223552;
}


/*=========================================================
FORMS
=========================================================*/

input,
textarea,
select{
    width:100%;
    padding:16px;
    margin-bottom:20px;
    color:var(--text);
    background:var(--surface);
    border:1px solid #223552;
    border-radius:12px;
}

textarea{
    min-height:180px;
    resize:vertical;
}

input:focus,
textarea:focus,
select:focus{
    outline:none;
    border-color:var(--primary);
}

label{
    display:block;
    margin-bottom:8px;
    font-weight:700;
}


/*=========================================================
BLOG GRID
=========================================================*/

.posts-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:35px;
}

.post-card{
    overflow:hidden;
    background:var(--surface);
    border-radius:20px;
    transition:transform .3s ease;
}

.post-card:hover{
    transform:translateY(-8px);
}

.post-card img{
    width:100%;
    height:260px;
    object-fit:cover;
}

.post-content{
    padding:30px;
}

.post-meta{
    margin-bottom:15px;
    font-size:14px;
    color:var(--muted);
}

.post-title{
    margin-bottom:20px;
}

.post-title a:hover{
    color:var(--primary);
}
/*=========================================================
SINGLE POST
=========================================================*/

.single-post{
    max-width:850px;
    margin:0 auto;
}

.single-post h2{
    margin-top:45px;
}

.single-post img{
    display:block;
    max-width:100%;
    height:auto;
    margin:35px auto;
    border-radius:10px;
}

.single-post ul{
    list-style:disc;
    margin:20px 0 20px 30px;
}

.single-post ol{
    margin:20px 0 20px 30px;
}

.single-post li{
    margin-bottom:10px;
}


/*=========================================================
PAGINATION
=========================================================*/

.post-tags{
    margin-top:40px;
    padding-top:20px;
    border-top:1px solid #1A2742;
}

.post-tags a{
    display:inline-block;
    margin:5px;
    padding:6px 12px;
    color:var(--text);
    background:#13233A;
    border-radius:4px;
}

.post-tags a:hover{
    background:#1C3555;
}

.pagination{
    display:flex;
    justify-content:center;
    margin-top:60px;
}

.pagination a,
.pagination span{
    display:inline-block;
    width:46px;
    height:46px;
    line-height:46px;
    text-align:center;
    border-radius:50%;
    background:var(--surface);
    margin:0 5px;
}

.pagination .current{
    color:var(--text);
    background:var(--primary-dark);
}


/*=========================================================
COMMENTS
=========================================================*/

.comments-area{
    margin-top:80px;
}

.comments-title{
    margin-bottom:30px;
}

.comment-list{
    list-style:none;
}

.comment{
    margin-bottom:30px;
    padding:30px;
    background:var(--surface);
    border-radius:20px;
}

.comment-author{
    font-weight:700;
    margin-bottom:10px;
}

.comment-meta{
    margin-bottom:15px;
    font-size:14px;
    color:var(--muted);
}

.comment-content{
    line-height:1.8;
}

.comment-form{
    margin-top:40px;
}

.comment-form input,
.comment-form textarea{
    width:100%;
    padding:14px;
    margin-bottom:20px;
    color:var(--text);
    background:var(--bg-alt);
    border:1px solid #1A2742;
    border-radius:6px;
}

.comment-form input[type="submit"]{
    width:auto;
    padding:14px 30px;
    color:#081322;
    background:var(--primary);
    border:none;
    cursor:pointer;
}

.comment-form input[type="submit"]:hover{
    background:#0EA5E9;
}


/*=========================================================
SEARCH FORM
=========================================================*/

.search-form{
    display:flex;
}

.search-form input{
    margin-bottom:0;
    border-radius:12px 0 0 12px;
}

.search-form button{
    padding:16px 30px;
    color:var(--text);
    background:var(--primary-dark);
    border:none;
    border-radius:0 12px 12px 0;
    cursor:pointer;
}


/*=========================================================
SIDEBAR
=========================================================*/

.widget{
    margin-bottom:30px;
    padding:30px;
    background:var(--surface);
    border-radius:20px;
}

.widget-title{
    margin-bottom:20px;
}

.widget ul{
    list-style:none;
}

.widget li{
    padding:12px 0;
    border-bottom:1px solid #1F3150;
}

.widget li:last-child{
    border-bottom:none;
}


/*=========================================================
TUTOR LMS
=========================================================*/

.tutor-dashboard{
    background:transparent;
}

.tutor-course-card,
.tutor-card{
    overflow:hidden;
    background:var(--surface);
    border:1px solid #223552;
    border-radius:20px;
}

.tutor-course-thumbnail img{
    width:100%;
    height:220px;
    object-fit:cover;
}

.tutor-course-content{
    padding:25px;
}

.tutor-course-price{
    color:var(--primary);
    font-size:22px;
    font-weight:700;
}

.tutor-btn{
    display:inline-block;
    padding:14px 28px;
    color:var(--text);
    background:var(--primary-dark);
    border:none;
    border-radius:40px;
    cursor:pointer;
    transition:var(--transition);
}

.tutor-btn:hover{
    background:#1D4ED8;
}


/*=========================================================
BBPRESS
=========================================================*/

#bbpress-forums{
    padding:30px;
    background:var(--surface);
    border-radius:20px;
}

#bbpress-forums a{
    color:var(--primary);
}

#bbpress-forums li{
    color:var(--text);
}

#bbpress-forums table{
    margin-bottom:0;
}


/*=========================================================
LOGIN PAGE
=========================================================*/

.login-page{
    max-width:500px;
    margin:60px auto;
}

.login-page form{
    padding:40px;
    background:var(--surface);
    border-radius:20px;
}


/*=========================================================
404 PAGE
=========================================================*/

.error404{
    min-height:80vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.error404 h1{
    font-size:120px;
    margin-bottom:20px;
}

.error404 p{
    margin-bottom:35px;
}

.error404 .page-header{
    text-align:center;
}

.error404 .page-header h1{
    font-size:80px;
    margin-bottom:15px;
}

.error404 .card{
    max-width:700px;
    margin:0 auto;
}


/*=========================================================
LOADER
=========================================================*/

.loader{
    width:48px;
    height:48px;
    border:5px solid #2B3F61;
    border-top:5px solid var(--primary);
    border-radius:50%;
    animation:spin 1s linear infinite;
}

@keyframes spin{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}


/*=========================================================
UTILITY CLASSES
=========================================================*/

.d-flex{display:flex;}
.d-block{display:block;}
.d-inline{display:inline-block;}

.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.align-center{align-items:center;}

.w-100{width:100%;}
.h-100{height:100%;}

.hidden{display:none;}

.clearfix::after{
    content:"";
    display:block;
    clear:both;
}


/*=========================================================
SCROLLBAR
=========================================================*/

::-webkit-scrollbar{
    width:10px;
}

::-webkit-scrollbar-track{
    background:var(--bg);
}

::-webkit-scrollbar-thumb{
    background:var(--primary-dark);
}

::-webkit-scrollbar-thumb:hover{
    background:var(--primary);
}

/*=========================================================
RESPONSIVE
=========================================================*/

@media screen and (max-width:991px){

    .hero .am-container{
        flex-direction:column;
    }

    .hero-visual{
        order:-1;
        min-height:380px;
    }

    .ecosystem-pillars{
        grid-template-columns:1fr;
    }

    h1{
        font-size:48px;
    }

    h2{
        font-size:36px;
    }

    .grid-4{
        grid-template-columns:repeat(2,1fr);
    }

    .grid-3{
        grid-template-columns:repeat(2,1fr);
    }

    .grid-2{
        grid-template-columns:1fr;
    }

    .hero{
        padding-top:120px;
    }

    .philosophy .card{
        padding:40px;
    }
}

@media screen and (max-width:767px){

    .partnerships .card{
        padding:35px;
    }

    h1{
        font-size:36px;
    }

    h2{
        font-size:30px;
    }

    h3{
        font-size:24px;
    }

    .site-header .am-container{
        flex-wrap:wrap;
    }

    .mobile-toggle{
        display:block;
    }

    .main-nav{
        display:none;
        width:100%;
    }

    .main-nav.active{
        display:flex;
        justify-content:flex-end;
        width:100%;
    }

    .nav-menu{
        display:flex;
        flex-direction:column;
        width:100%;
        gap:18px;
        margin-top:20px;
    }

    .posts-grid,
    .grid-4,
    .grid-3{
        grid-template-columns:1fr;
    }

    .hero{
        text-align:center;
    }

    .hero p{
        font-size:18px;
    }

    .cta .card{
        padding:40px 25px;
    }

    .search-form{
        display:block;
    }

    .search-form input{
        margin-bottom:15px;
        border-radius:12px;
    }

    .search-form button{
        width:100%;
        border-radius:12px;
    }
}


/*=========================================================
PAGE TEMPLATE
=========================================================*/

.page-header{
    padding:160px 0 70px;
    background:#081322;
    border-bottom:1px solid #1A2742;
}

.page-header h1{
    margin-bottom:15px;
}

.breadcrumbs{
    color:var(--muted);
    font-size:14px;
}

.page-content{
    padding:80px 0;
}

.page-content img{
    display:block;
    max-width:100%;
    height:auto;
    margin:30px auto;
    border-radius:10px;
}

.page-content h2{
    margin-top:40px;
}

.page-content h3{
    margin-top:30px;
}

.page-content ul{
    list-style:disc;
    margin-left:25px;
    margin-bottom:25px;
}

.page-content ol{
    margin-left:25px;
    margin-bottom:25px;
}

.page-content blockquote{
    margin:30px 0;
    padding-left:20px;
    border-left:4px solid var(--primary);
    color:var(--muted);
}


/*=========================================================
ARCHIVE
=========================================================*/

.archive-description{
    max-width:700px;
    margin-top:20px;
    color:var(--muted);
}

.blog-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:30px;
}

.blog-card{
    overflow:hidden;
    background:#13233A;
    border-radius:12px;
    transition:transform .3s ease;
}

.blog-card:hover{
    transform:translateY(-6px);
}

.blog-card img{
    display:block;
    width:100%;
    height:auto;
}

.blog-content{
    padding:25px;
}

.blog-content h2{
    margin-bottom:15px;
}

.blog-content h2 a{
    color:var(--text);
    text-decoration:none;
}

.blog-content h2 a:hover{
    color:var(--primary);
}


/*=========================================================
SEARCH
=========================================================*/

.search-form{
    margin-top:30px;
}

.search-form label{
    display:block;
}

.search-form input[type="search"]{
    width:100%;
    padding:14px;
    margin-bottom:15px;
    color:var(--text);
    background:#081322;
    border:1px solid #1A2742;
    border-radius:6px;
}

.search-form input[type="submit"]{
    padding:14px 25px;
    font-weight:700;
    color:#081322;
    background:var(--primary);
    border:none;
    border-radius:6px;
    cursor:pointer;
}

.search-form input[type="submit"]:hover{
    background:#0EA5E9;
}


/*=========================================================
NAVIGATION FIX
=========================================================*/

.main-nav .nav-menu > ul{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:36px;
    margin:0;
    padding:0;
    list-style:none;
}

.main-nav .nav-menu > ul > li{
    margin:0;
    list-style:none;
}

.main-nav .nav-menu > ul > li > a{
    display:block;
    padding:10px 0;
}

/*=========================================================
END OF FILE
=========================================================*/