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

:root{

--bg:#f5f2fa;

--white:#ffffff;

--text:#111111;

--text-light:#666666;

--purple:#7b2cbf;

--indigo:#5a67d8;

--cyan:#42c6c6;

--green:#38b000;

--orange:#ff7b00;

--border:#ebe7f5;

--gradient:
linear-gradient(
135deg,
#7b2cbf,
#5a67d8,
#42c6c6
);

--shadow:
0 20px 60px rgba(123,44,191,.08);

}

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

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

html{
scroll-behavior:smooth;
}

body{

 font-family: Inter, Arial, sans-serif;

background:var(--bg);

color:var(--text);

overflow-x:hidden;

}

img{
max-width:100%;
display:block;
}

a{
text-decoration:none;
}

.container{

width:min(1200px,92%);

margin:auto;

}

/* ====================================
FLOATING BLOBS
==================================== */

.blob{

position:fixed;

border-radius:50%;

filter:blur(100px);

opacity:.15;

pointer-events:none;

z-index:-1;

}

.blob-1{

width:300px;
height:300px;

background:#7b2cbf;

top:-100px;
left:-100px;

}

.blob-2{

width:250px;
height:250px;

background:#42c6c6;

right:-80px;
top:300px;

}

.blob-3{

width:350px;
height:350px;

background:#5a67d8;

bottom:-120px;
left:30%;

}

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

.CRT-navbar{

position:fixed;

top:20px;

left:50%;

transform:translateX(-50%);

width:min(1280px,95%);

z-index:9999;

}

.nav-wrapper{

display:flex;

justify-content:space-between;

align-items:center;

padding:16px 28px;

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

backdrop-filter:blur(25px);

border:1px solid rgba(123,44,191,.08);

border-radius:22px;

box-shadow:var(--shadow);

}

.logo-wrap{

display:flex;

align-items:center;

gap:12px;

}

.logo-wrap img{

width:52px;

height:52px;

object-fit:contain;

}

.logo-text h3{

font-size:1.1rem;

color:var(--text);

}

.logo-text span{

font-size:.7rem;

letter-spacing:2px;

color:var(--purple);

}

.desktop-nav{

display:flex;

gap:34px;

}

.desktop-nav a{

font-weight:500;

color:#333;

transition:.3s;

}

.desktop-nav a:hover{

color:var(--purple);

}

.enroll-btn{

padding:14px 24px;

background:var(--gradient);

border-radius:999px;

color:white;

font-weight:600;

transition:.35s;

}

.enroll-btn:hover{

transform:translateY(-3px);

}

.nav-actions{

display:flex;

align-items:center;

gap:14px;

}

.menu-toggle{

display:none;

background:none;

border:none;

font-size:1.3rem;

cursor:pointer;

}

.mobile-menu{

display:none;

}

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

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

.CRT-hero{
    padding:140px 8% 100px;
    background:#f6f4fb;
    overflow:hidden;
    position:relative;
}

.CRT-hero-container{
    max-width:1400px;
    margin:auto;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;

    align-items:center;
}

/* LEFT SIDE */

.CRT-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;

    background:#fff;

    padding:12px 22px;

    border-radius:999px;

    font-weight:600;

    margin-bottom:28px;

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

.CRT-title{
    font-size:6rem;
    line-height:.95;
    font-weight:900;
    color:#111;
    margin-bottom:32px;
}

.gradient-text{
    background:linear-gradient(
        90deg,
        #7b2cbf,
        #4361ee,
        #44c7cf
    );

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

.CRT-description{
    font-size:1.2rem;
    line-height:2;

    color:#666;

    max-width:650px;

    margin-bottom:40px;
}

.CRT-buttons{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.CRT-btn-primary{
    background:
    linear-gradient(
        90deg,
        #7b2cbf,
        #44c7cf
    );

    color:#fff;
    text-decoration:none;

    padding:16px 34px;

    border-radius:999px;

    font-weight:700;

    transition:.4s;
}

.CRT-btn-primary:hover{
    transform:translateY(-4px);
}

.CRT-btn-secondary{
    background:#fff;

    color:#111;
    text-decoration:none;

    padding:16px 34px;

    border-radius:999px;

    font-weight:700;

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

    transition:.4s;
}

.CRT-btn-secondary:hover{
    transform:translateY(-4px);
}

/* RIGHT SIDE */

.CRT-hero-visual{
    position:relative;

    height:650px;

    display:flex;
    flex-direction:column;

    justify-content:center;
    align-items:center;
}

.journey-glow{
    position:absolute;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(
        circle,
        rgba(123,44,191,.12),
        transparent 70%
    );

    animation:pulseGlow 5s infinite;
}

.journey-step{
    width:320px;

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

    backdrop-filter:blur(20px);

    border-radius:28px;

    padding:30px;

    text-align:center;

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

    z-index:2;

    transition:.4s;
}

.journey-step:hover{
    transform:translateY(-8px) scale(1.04);
}

.journey-step i{
    font-size:34px;
    margin-bottom:14px;
}

.journey-step h4{
    font-size:2rem;
    margin-bottom:8px;
}

.journey-step p{
    color:#666;
}

.camp{
    border:2px solid #7b2cbf;
}

.cent{
    border:2px solid #44c7cf;
}

.corp{
    border:2px solid #ff8a00;
}

.journey-line{
    width:5px;
    height:70px;

    background:
    linear-gradient(
        to bottom,
        #7b2cbf,
        #44c7cf
    );

    border-radius:999px;

    margin:12px 0;

    animation:flowLine 2s infinite;
}

/* ANIMATIONS */

@keyframes pulseGlow{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.08);
    }

    100%{
        transform:scale(1);
    }
}

@keyframes flowLine{

    0%{
        opacity:.4;
    }

    50%{
        opacity:1;
    }

    100%{
        opacity:.4;
    }
}

/* MOBILE */

@media(max-width:991px){

    .CRT-hero-container{
        grid-template-columns:1fr;
        gap:60px;
    }

    .CRT-title{
        font-size:4rem;
    }

    .CRT-description{
        font-size:1rem;
        line-height:1.8;
    }

    .CRT-hero-visual{
        height:auto;
    }

    .journey-glow{
        width:380px;
        height:380px;
    }

    .journey-step{
        width:100%;
        max-width:320px;
    }
}

@media(max-width:576px){

    .CRT-hero{
        padding:120px 20px 70px;
    }

    .CRT-title{
        font-size:3.2rem;
    }

    .CRT-buttons{
        flex-direction:column;
    }

    .CRT-btn-primary,
    .CRT-btn-secondary{
        width:100%;
        text-align:center;
    }

    .journey-glow{
        width:280px;
        height:280px;
    }
}
/* ====================================
CAMP CENT CORP
==================================== */

.hero-visual{

display:flex;

align-items:center;

justify-content:center;

gap:20px;

flex-wrap:wrap;

}

.journey-card{

background:white;

border-radius:30px;

padding:30px;

min-width:180px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.journey-card:hover{

transform:
translateY(-10px);

}

.journey-card i{

font-size:2rem;

margin-bottom:15px;

}

.camp{
border-top:5px solid #7b2cbf;
}

.cent{
border-top:5px solid #42c6c6;
}

.corp{
border-top:5px solid #ff7b00;
}

.journey-arrow{

font-size:1.8rem;

color:#7b2cbf;

animation:
pulseArrow 2s infinite;

}

@keyframes pulseArrow{

0%,100%{
transform:translateX(0);
}

50%{
transform:translateX(8px);
}

}

/* ====================================
SECTION HEADING
==================================== */

.section-heading{

margin-bottom:80px;

}

.section-heading.center{

text-align:center;

}

.section-tag{

display:inline-block;

padding:10px 18px;

border-radius:999px;

background:white;

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

font-size:.8rem;

font-weight:700;

letter-spacing:2px;

margin-bottom:20px;

color:var(--purple);

}

.section-heading h2{

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

font-weight:800;

line-height:1.1;

margin-bottom:18px;

}

.section-heading p{

max-width:700px;

margin:auto;

color:var(--text-light);

line-height:1.8;

}



/* ====================================
CRT MODEL SECTION
==================================== */

.CRT-model-section{
padding:140px 0;
position:relative;
}

/*=========================================
CRT MODEL IMAGE
=========================================*/

.CRT-model-wrapper{

margin-top:70px;

display:flex;

justify-content:center;

align-items:center;

}

.CRT-model-image{

width:100%;

max-width:1200px;

border-radius:32px;

overflow:hidden;

background:#fff;

padding:25px;

box-shadow:
0 25px 70px rgba(106,27,154,.12);

border:1px solid rgba(106,27,154,.08);

transition:.4s ease;

}

.CRT-model-image:hover{

transform:translateY(-6px);

box-shadow:
0 35px 80px rgba(106,27,154,.18);

}

.CRT-model-image img{

display:block;

width:100%;

height:auto;

object-fit:contain;

border-radius:18px;

}


@media(max-width:768px){

.CRT-model-section{

padding:80px 0;

}

.CRT-model-wrapper{

margin-top:50px;

}

.CRT-model-image{

padding:12px;

border-radius:20px;

}

.CRT-model-image img{

width:100%;

height:auto;

border-radius:12px;

}

}


/* ====================================
ECOSYSTEM SECTION
==================================== */

.ecosystem-section{

padding:140px 0;

}

.ecosystem-grid{

display:grid;

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

gap:30px;

margin-top:70px;

}

.eco-card{

background:white;

border-radius:32px;

padding:35px;

display:flex;

gap:25px;

align-items:flex-start;

box-shadow:var(--shadow);

transition:.35s;

position:relative;

overflow:hidden;

}

.eco-card:hover{

transform:
translateY(-8px);

}

.eco-card::before{

content:"";

position:absolute;

left:0;
top:0;

width:5px;
height:100%;

}

.cerebral::before{
background:#38b000;
}

.meta4::before{
background:#5a67d8;
}

.maven::before{
background:#ff4d8d;
}

.zerith::before{
background:#42c6c6;
}

.merakey::before{
background:#ff7b00;
}

.eco-icon{

width:75px;
height:75px;

border-radius:40px;

display:flex;
align-items:center;
justify-content:center;

font-size:1.8rem;

color:white;

flex-shrink:0;

}

.meta{
    border-radius: 20px;
    width: 100px;
    height: 70px;
}

.maven{
    border-radius: 30px;
}

.cerebral .eco-icon{
background:#38b000;
}

.meta4 .eco-icon{
background:#5a67d8;
}

.maven .eco-icon{
background:#ff4d8d;
}

.zerith .eco-icon{
background:#42c6c6;
}

.merakey .eco-icon{
background:#ff7b00;
}

.eco-content h3{

font-size:1.7rem;

margin-bottom:5px;

}

.eco-content span{

display:block;

font-weight:600;

color:#666;

margin-bottom:15px;

}

.eco-content p{

line-height:1.8;

color:#666;

margin-bottom:20px;

}

.eco-content ul{

list-style:none;

display:grid;

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

gap:10px;

}

.eco-content li{

font-size:.95rem;

padding:10px 14px;

background:#f8f8fb;

border-radius:12px;

}

/* ====================================
WHY CRT WORKS
==================================== */

.why-CRT-section{

padding:140px 0;

}

.bento-grid{

display:grid;

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

gap:25px;

margin-top:70px;

}

.bento-card{

background:white;

border-radius:28px;

padding:35px;

min-height:250px;

box-shadow:var(--shadow);

transition:.35s;

}

.bento-card:hover{

transform:
translateY(-8px);

}

.bento-card.large{

grid-column:span 2;

}

.gradient-card{

background:var(--gradient);

color:white;

}

.gradient-card p{
color:white;
}

.bento-icon{

width:70px;
height:70px;

border-radius:20px;

display:flex;
align-items:center;
justify-content:center;

background:#f3f0ff;

font-size:1.5rem;

margin-bottom:20px;

color:#7b2cbf;

}

.gradient-card .bento-icon{

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

color:white;

}

.bento-card h3{

margin-bottom:12px;

font-size:1.4rem;

}

.bento-card p{

line-height:1.8;

color:#666;

}

/* ====================================
TIMELINE SECTION
==================================== */

/*=========================================
TECH SECTION
=========================================*/

.tech-section{

padding:120px 0;

background:#faf8fd;

}

.tech-grid{

margin-top:70px;

display:grid;

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

gap:25px;

}

.tech-card{

background:#fff;

padding:35px 28px;

border-radius:24px;

text-align:center;

border:1px solid rgba(106,27,154,.08);

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

transition:.35s;

position:relative;

overflow:hidden;

}

.tech-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(
90deg,
#6A1B9A,
#38C9B9
);

}

.tech-card:hover{

transform:translateY(-10px);

box-shadow:0 25px 55px rgba(106,27,154,.15);

}

.tech-card i{

font-size:44px;

margin-bottom:22px;

background-color:#6A1B9A;

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.tech-card h3{

font-size:22px;

font-weight:800;

margin-bottom:15px;

line-height:1.3;

}

.tech-card p{

font-size:15px;

color:#666;

line-height:1.7;

}



/*==========================
Tablet
==========================*/

@media(max-width:992px){

.tech-grid{

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

}

}



/*==========================
Mobile
==========================*/

@media(max-width:768px){

.tech-section{

padding:80px 0;

}

.tech-grid{

grid-template-columns:1fr;

gap:20px;

}

.tech-card{

padding:30px 22px;

}

.tech-card i{

font-size:38px;

}

.tech-card h3{

font-size:20px;

}

}






/* ====================================
SUCCESS METRICS
==================================== */

.metrics-section{

padding:140px 0;

}

.metrics-grid{

display:grid;

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

gap:25px;

margin-top:70px;

}

.metric-card{

background:white;

padding:40px;

border-radius:28px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.metric-card:hover{

transform:
translateY(-8px);

}

.metric-card h3{

font-size:4rem;

font-weight:900;

background:var(--gradient);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

margin-bottom:10px;

}

.metric-card p{

font-size:1rem;

font-weight:600;

color:#666;

}

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

@media(max-width:1100px){

.ecosystem-grid{
grid-template-columns:1fr;
}

.metrics-grid{
grid-template-columns:repeat(2,1fr);
}

.bento-grid{
grid-template-columns:repeat(2,1fr);
}

.bento-card.large{
grid-column:span 2;
}

}

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

@media(max-width:768px){

.CRT-model-wrapper{
flex-direction:column;
}

.model-arrow{
transform:rotate(90deg);
}

.eco-content ul{
grid-template-columns:1fr;
}

.bento-grid{
grid-template-columns:1fr;
}

.bento-card.large{
grid-column:span 1;
}

.metrics-grid{
grid-template-columns:1fr;
}

.timeline-wrapper{
flex-direction:column;
align-items:center;
}

.timeline-line{
display:none;
}

}
/* ====================================
EXPERIENCE SHOWCASE
==================================== */

.experience-showcase{

padding:140px 0;

position:relative;

}

.showcase-grid{

display:grid;

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

gap:25px;

margin-top:70px;

}

.showcase-card{

background:white;

border-radius:32px;

overflow:hidden;

box-shadow:var(--shadow);

transition:.4s ease;

position:relative;

}

.showcase-card:hover{

transform:
translateY(-10px);

}

.showcase-card img{

width:100%;

height:280px;

object-fit:cover;

transition:.5s;

}

.showcase-card:hover img{

transform:scale(1.05);

}

.large-card img{

height:450px;

}

.showcase-content{

padding:28px;

}

.showcase-content span{

display:inline-block;

padding:8px 14px;

border-radius:999px;

background:#f2edff;

color:#7b2cbf;

font-size:.8rem;

font-weight:700;

letter-spacing:1px;

margin-bottom:15px;

}

.showcase-content h3{

font-size:1.6rem;

font-weight:700;

margin-bottom:12px;

}

.showcase-content p{

line-height:1.8;

color:#666;

}

/* ====================================
TRANSFORMATION SECTION
==================================== */

.transformation-section{

padding:140px 0;

}

.transformation-grid{

display:grid;

grid-template-columns:
1fr 1fr;

gap:80px;

align-items:center;

}

.transformation-content h2{

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

line-height:1.05;

font-weight:900;

margin:20px 0;

}

.transformation-content p{

line-height:2;

font-size:1.05rem;

color:#666;

margin-bottom:30px;

}

.transformation-content ul{

list-style:none;

display:flex;

flex-direction:column;

gap:18px;

}

.transformation-content li{

display:flex;

align-items:center;

gap:12px;

font-weight:600;

}

.transformation-content li i{

color:#42c6c6;

font-size:1.1rem;

}

.transformation-image{

position:relative;

}

.transformation-image img{

border-radius:35px;

box-shadow:var(--shadow);

}

.transformation-image::before{

content:"";

position:absolute;

width:150px;
height:150px;

border-radius:50%;

background:
linear-gradient(
135deg,
#7b2cbf,
#42c6c6
);

filter:blur(80px);

opacity:.25;

top:-40px;
right:-40px;

z-index:-1;

}

/* ====================================
FINAL CTA
==================================== */

.final-cta{

padding:160px 0;

position:relative;

}

.cta-box{

position:relative;

overflow:hidden;

padding:90px 60px;

border-radius:40px;

background:
linear-gradient(
135deg,
#7b2cbf,
#5a67d8,
#42c6c6
);

text-align:center;

color:white;

}

.cta-glow{

position:absolute;

width:400px;
height:400px;

background:white;

opacity:.08;

border-radius:50%;

top:-150px;
right:-100px;

filter:blur(20px);

}

.cta-content{

position:relative;

z-index:2;

}

.cta-content .section-tag{

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

border:none;

color:white;

}

.cta-content h2{

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

line-height:1.05;

font-weight:900;

margin:20px 0;

}

.cta-content p{

max-width:700px;

margin:auto;

line-height:2;

font-size:1.1rem;

opacity:.95;

}

.cta-buttons{

display:flex;

justify-content:center;

gap:20px;

margin-top:40px;

}

.cta-buttons .hero-primary{

background:white;

color:#7b2cbf;

}

.cta-buttons .hero-secondary{

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

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

color:white;

backdrop-filter:blur(10px);

}

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

.CRT-footer{

background:white;

padding:100px 0 40px;

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

}

.footer-grid{

display:grid;

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

gap:40px;

margin-bottom:50px;

}

.footer-column h3{

font-size:2rem;

margin-bottom:15px;

}

.footer-column h4{

margin-bottom:20px;

font-size:1.1rem;

}

.footer-column p{

line-height:1.8;

color:#666;

}

.footer-column a{

display:block;

margin-bottom:12px;

color:#666;

transition:.3s;

}

.footer-column a:hover{

color:#7b2cbf;

}

.footer-social{

display:flex;

gap:12px;

margin-top:10px;

}

.footer-social a{

width:48px;
height:48px;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

background:#f5f2fa;

font-size:1.1rem;

margin:0;

}

.footer-social a:hover{

background:#7b2cbf;

color:white;

}

.footer-bottom{

padding-top:30px;

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

text-align:center;

color:#666;

}

/* ====================================
WHATSAPP FLOAT
==================================== */

.whatsapp-float{

position:fixed;

right:25px;
bottom:25px;

width:65px;
height:65px;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

background:#25d366;

color:white;

font-size:1.8rem;

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

z-index:999;

animation:
floatWhatsapp 3s infinite;

}

@keyframes floatWhatsapp{

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

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

}

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

@media(max-width:992px){

.desktop-nav{
display:none;
}

.enroll-btn{
display:none;
}

.menu-toggle{
display:block;
}

.mobile-menu{

position:absolute;

top:100%;

left:0;

width:100%;

background:white;

border-radius:20px;

padding:20px;

display:none;

flex-direction:column;

gap:16px;

box-shadow:var(--shadow);

}

.mobile-menu.active{
display:flex;
}

.mobile-menu a{

padding:12px;

border-radius:12px;

color:#333;

font-weight:600;

}

.mobile-enroll{

background:var(--gradient);

color:white !important;

text-align:center;

}

}

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

@media(max-width:1100px){

.showcase-grid{
grid-template-columns:1fr;
}

.large-card img{
height:320px;
}

.transformation-grid{
grid-template-columns:1fr;
}

.footer-grid{
grid-template-columns:repeat(2,1fr);
}

}

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

@media(max-width:768px){

.experience-showcase,
.transformation-section,
.final-cta{

padding:90px 0;

}

.cta-box{

padding:60px 25px;

}

.cta-buttons{

flex-direction:column;

}

.footer-grid{

grid-template-columns:1fr;

text-align:center;

}

.footer-social{

justify-content:center;

}

.whatsapp-float{

width:58px;
height:58px;

font-size:1.5rem;

right:18px;
bottom:18px;

}

}

/* ====================================
PREMIUM HOVER EFFECTS
==================================== */

.model-card,
.eco-card,
.metric-card,
.bento-card,
.showcase-card{

will-change:transform;

}

.model-card:hover,
.eco-card:hover,
.metric-card:hover,
.bento-card:hover,
.showcase-card:hover{

box-shadow:
0 30px 70px rgba(123,44,191,.15);

}

/* ====================================
SMOOTH GRADIENT TEXT
==================================== */

.gradient-text{

background:
linear-gradient(
135deg,
#7b2cbf,
#5a67d8,
#42c6c6
);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.desktop-nav a.active{
    color:#7b2cbf;
    font-weight:700;
}




.enquiry-modal{

position:fixed;

inset:0;

background:rgba(0,0,0,.6);

display:flex;

justify-content:center;

align-items:center;

opacity:0;

visibility:hidden;

transition:.3s;

z-index:9999;

}

.enquiry-modal.active{

opacity:1;

visibility:visible;

}

.enquiry-box{

background:#fff;

width:92%;

max-width:480px;

padding:35px;

border-radius:22px;

position:relative;

}

.enquiry-box input,
.enquiry-box select,
.enquiry-box textarea{

width:100%;

padding:14px;

margin:12px 0;

border:1px solid #ddd;

border-radius:12px;

font-size:15px;

}

.submit-enquiry{

width:100%;

padding:15px;

border:none;

border-radius:999px;

background:#6A1B9A;

color:#fff;

font-weight:700;

cursor:pointer;

}

.close-enquiry{

position:absolute;

right:18px;

top:18px;

background:none;

border:none;

font-size:22px;

cursor:pointer;

}



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

.enquiry-btn,
.mobile-enquiry-btn,
.hero-primary,
.hero-secondary{

display:inline-flex;

align-items:center;

justify-content:center;

gap:10px;

padding:15px 32px;

background:#6A1B9A;

color:#fff;

border:none;

border-radius:999px;

font-size:15px;

font-weight:700;

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

cursor:pointer;

text-decoration:none;

transition:.35s ease;

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

}

.enquiry-btn:hover,
.mobile-enquiry-btn:hover,
.hero-primary:hover,
.hero-secondary:hover{

background:#53157d;

transform:translateY(-3px);

box-shadow:0 18px 40px rgba(106,27,154,.28);

}

.enquiry-btn:active,
.mobile-enquiry-btn:active,
.hero-primary:active,
.hero-secondary:active{

transform:translateY(0);

box-shadow:0 8px 20px rgba(106,27,154,.18);

}


/*=========================================
FLAGSHIP TAG
=========================================*/

.eco-card{

position:relative;

}

.flagship-tag{

position:absolute;

top:18px;

right:18px;

padding:8px 16px;

border-radius:999px;

background-color: #6A1B9A;

color:#fff;

font-size:12px;

font-weight:700;

letter-spacing:.5px;

text-transform:uppercase;

box-shadow:
0 8px 20px rgba(106,27,154,.25);

z-index:5;

animation:flagshipPulse 2s infinite;

}

@keyframes flagshipPulse{

0%,100%{

transform:scale(1);

}

50%{

transform:scale(1.05);

}

}

@media(max-width:768px){

.flagship-tag{

top:12px;

right:12px;

padding:6px 12px;

font-size:10px;

}

}



/*==================================================
CRT FEATURE CARDS
==================================================*/

.crt-feature-grid{

display:grid;

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

gap:22px;

margin:50px auto 60px;

max-width:1100px;

}

.crt-feature-card{

position:relative;

background:#fff;

padding:24px 22px;

border-radius:18px;

text-align:center;

border:1px solid rgba(106,27,154,.08);

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

overflow:hidden;

transition:.35s ease;

cursor:pointer;

}

.crt-feature-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:4px;

background-color:#6A1B9A;

transition:.35s;

}

.crt-feature-card:hover{

transform:translateY(-8px);

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

}

.crt-feature-card:hover::before{

height:100%;

opacity:.03;

}

.crt-feature-card h3{

font-size:22px;

font-weight:800;

line-height:1.2;

margin-bottom:10px;

color:#111;

font-family:'Space Grotesk',sans-serif;

}

.crt-feature-card p{

font-size:14px;

line-height:1.7;

color:#666;

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

margin:0;

}



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

@media(max-width:992px){

.crt-feature-grid{

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

gap:18px;

}

.crt-feature-card{

padding:22px 18px;

}

.crt-feature-card h3{

font-size:20px;

}

}



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

@media(max-width:768px){

.crt-feature-grid{

grid-template-columns:1fr;

gap:16px;

margin:35px auto 45px;

}

.crt-feature-card{

padding:18px;

border-radius:16px;

}

.crt-feature-card h3{

font-size:19px;

margin-bottom:6px;

}

.crt-feature-card p{

font-size:13px;

line-height:1.6;

}

}