/* =========================================================
   LUBICA PREMIUM CSS 2026
 
   ========================================================= */

:root{
    --primary:#005eff;
    --maroon:#7a0026;
    --gold:#f8c400;
    --purple:#7e3af2;
    --white:#ffffff;
    --light:#f5f9ff;
    --dark:#1f2937;
}

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

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Segoe UI',sans-serif;
    background:linear-gradient(
        135deg,
        #ffffff,
        #f8fbff,
        #f5f9ff
    );
    background-size:300% 300%;
    animation:bgMove 15s infinite;
}

@keyframes bgMove{
    0%{background-position:0% 0%;}
    50%{background-position:100% 100%;}
    100%{background-position:0% 0%;}
}

/* HEADER */

header{
    background:rgba(255,255,255,.92)!important;
    backdrop-filter:blur(15px);
    position:sticky;
    top:0;
    z-index:999;
    box-shadow:
        0 10px 40px rgba(0,94,255,.08);
}

/* NAVIGATION */

nav a{
    transition:.4s;
}

nav a:hover{
    color:var(--primary)!important;
    text-shadow:
        0 0 10px rgba(0,94,255,.4);
}

/* HERO */
/*
.hero{
    position:relative;
    overflow:hidden;
    background:
    linear-gradient(
        135deg,
        #ffffff,
        #eef5ff,
        #f5f9ff
    );
} 

*/


.hero{
    position:relative;
    overflow:hidden;
    background:
    linear-gradient(
        135deg,
          #c92f2f, #133666, #af0dc3);
} 



.hero::before{
    content:"";
    position:absolute;
    width:500px;
    height:500px;
    right:-100px;
    top:-100px;
    border-radius:50%;
    background:rgba(0,94,255,.12);
    filter:blur(120px);
    animation:floatGlow 10s infinite;
}

@keyframes floatGlow{
    0%{transform:translateY(0);}
    50%{transform:translateY(40px);}
    100%{transform:translateY(0);}
}

.hero h1{
    background:
    linear-gradient(
        90deg,
        #005eff,
        #7e3af2,
        #f8c400
    );

    background-size:300%;

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

    animation:textGlow 6s infinite;
}

@keyframes textGlow{
    0%{background-position:0%;}
    100%{background-position:300%;}
}

/* PREMIUM CARD */

.course-card,
.project-card,
.article-card,
.gallery-card,
.feature,
.testimonial{

    position:relative;

    background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(
        90deg,
        #005eff,
        #7a0026,
        #f8c400,
        #7e3af2
    ) border-box;

    border:2px solid transparent;

    border-radius:25px;

    overflow:hidden;

    backdrop-filter:blur(15px);

    transition:.5s;

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

.course-card::before,
.project-card::before,
.article-card::before,
.gallery-card::before,
.feature::before,
.testimonial::before{

    content:"";

    position:absolute;

    top:0;
    left:-100%;

    width:100%;
    height:4px;

    background:
    linear-gradient(
        90deg,
        #005eff,
        #7a0026,
        #f8c400,
        #7e3af2
    );

    animation:borderRun 5s linear infinite;
}

@keyframes borderRun{

    0%{
        left:-100%;
    }

    100%{
        left:100%;
    }
}

.course-card:hover,
.project-card:hover,
.article-card:hover,
.gallery-card:hover,
.feature:hover,
.testimonial:hover{

    transform:
    translateY(-15px)
    scale(1.03);

    box-shadow:
    0 30px 80px rgba(0,94,255,.22);
}

/* IMAGES */

.course-card img,
.project-card img,
.article-card img,
.gallery-card img{

    transition:.6s;
}

.course-card:hover img,
.project-card:hover img,
.article-card:hover img,
.gallery-card:hover img{

    transform:scale(1.08);
}

/* TITLES */

h2{
    background:
    linear-gradient(
        90deg,
        #005eff,
        #7a0026,
        #7e3af2
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* BUTTONS */

.btn,
button{

    border:none;

    border-radius:50px;

    transition:.4s;
}

.btn:hover,
button:hover{

    transform:
    translateY(-5px);

    box-shadow:
    0 10px 30px rgba(0,94,255,.2);
}

.btn-primary{

    background:
    linear-gradient(
        90deg,
        #005eff,
        #7e3af2
    );

    color:#fff;
}

.btn-secondary{

    background:
    linear-gradient(
        90deg,
        #7a0026,
        #f8c400
    );

    color:#fff;
}

/* GLASS CARD */

.glass{

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

    backdrop-filter:blur(20px);

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

    border-radius:25px;
}

/* FLOATING */

.float{
    animation:float 4s infinite;
}

@keyframes float{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-15px);
    }

    100%{
        transform:translateY(0);
    }
}

/* GLOW TEXT */

.glow-text{

    text-shadow:
    0 0 15px rgba(0,94,255,.5);
}

/* FOOTER */

footer{

    background:
    linear-gradient(
        135deg,
        #1e293b,
        #111827
    );

    color:#fff;
}

/* RESPONSIVE */

@media(max-width:768px){

    .hero h1{
        font-size:2rem;
    }

    h2{
        font-size:1.8rem;
    }

}

 .hero-title{

background:linear-gradient(
90deg,
#1B4F72,
#2874A6,
#117864,
#B7950B,
#7D6608
);

background-size:400%;

-webkit-background-clip:text;
-webkit-text-fill-color:transparent;

}
footer{

background:
linear-gradient(
135deg,
#4A0E4E,
#6C3483,
#7D6608,
#A04000
);

color:white;

}