/* =========================================
HERO
========================================= */
@import url('https://fonts.cdnfonts.com/css/adams-script');

.hero{

min-height:100vh;

position:relative;

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

overflow:hidden;

padding-top:180px;
padding-bottom:120px;
padding-left:20px;
padding-right:20px;
}

.hero video{

position:absolute;

top:0;
left:0;

width:100%;
height:100%;

object-fit:cover;
}

.hero-overlay{

position:absolute;

inset:0;

background:
linear-gradient(
to bottom,
rgba(0,0,0,0.45),
rgba(0,0,0,0.92)
);
}

.hero-content{

position:relative;

z-index:2;

max-width:1000px;

text-align:center;

padding:20px;

margin:auto;
}

.hero-tagg{

display:inline-flex;

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

width:auto;

margin-bottom:25px;

padding:4px 14px;

font-size:15px;

font-weight:700;

letter-spacing:0.5px;

line-height:1;

text-transform:none;

font-family:"Adams Script", cursive;

color:#e53935;

text-shadow:
0 0 18px rgba(193,18,47,0.45);

box-shadow:
0 8px 20px rgba(0,0,0,0.15);
}


.hero-tag{

display:inline-block;

margin-bottom:25px;

font-size:13px;

letter-spacing:3px;

text-transform:uppercase;

color:var(--gold);

font-weight:600;
}

.hero-content h1{

margin-bottom:30px;
}

.hero-content p{

max-width:750px;

margin:auto;

margin-bottom:45px;

font-size:18px;

line-height:1.9;
}

.hero-buttons{

display:flex;

justify-content:center;

gap:20px;

flex-wrap:wrap;
}

/* =========================================
MISSION
========================================= */

.mission-section{
background:#0b0b0b;
}

.mission-grid{

display:grid;

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

gap:25px;
}

.mission-card{

padding:40px 35px;

min-height:280px;
}

.mission-card h3{

margin-bottom:20px;

color:var(--gold);
}

.mission-card p{
margin-bottom:0;
}

/* =========================================
PLATFORMS
========================================= */

.platforms-section{

background:
linear-gradient(
180deg,
#050505,
#0d0d0d
);
}

.platforms-grid{

display:grid;

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

gap:30px;
}

.platform-card{

padding:50px 40px;

position:relative;

overflow:hidden;
}

.platform-card span{

display:inline-block;

margin-bottom:20px;

font-size:60px;

font-weight:800;

color:rgba(212,175,55,0.15);

line-height:1;
}

.platform-card h3{

margin-bottom:20px;

color:var(--gold);
}

.platform-card p{
margin-bottom:0;
}

.platform-card::before{

content:"";

position:absolute;

top:0;
left:0;

width:4px;
height:100%;

background:
linear-gradient(
to bottom,
var(--gold),
#7a0019
);
}

/* =========================================
FOUNDER
========================================= */

.founder-section{

background:#111;
}

.founder-grid{

display:grid;

grid-template-columns:
500px 1fr;

gap:80px;

align-items:center;
}

.founder-image{

position:relative;
}

.founder-image img{

width:100%;

height:650px;

object-fit:cover;

border-radius:20px;

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

box-shadow:
0 20px 60px rgba(0,0,0,0.4);
}

.founder-content span{

display:inline-block;

margin-bottom:15px;

font-size:13px;

font-weight:700;

letter-spacing:3px;

text-transform:uppercase;

color:var(--gold);
}

.founder-content h2{

margin-bottom:10px;
}

.founder-content h3{

font-size:24px;

margin-bottom:30px;

color:#8b0015;
}

.founder-content p{

margin-bottom:22px;

max-width:700px;
}

/* =========================================
SMALL PREMIUM EFFECT
========================================= */

.mission-card:hover,
.platform-card:hover{

transform:translateY(-10px);

transition:0.4s ease;
}

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

@media(max-width:1200px){

.founder-grid{

grid-template-columns:
420px 1fr;

gap:50px;
}

.founder-image img{
height:580px;
}

}

@media(max-width:992px){

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

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

.founder-grid{

grid-template-columns:1fr;

gap:50px;
}

.founder-image{

max-width:500px;

margin:auto;
}

.founder-image img{
height:550px;
}

}

@media(max-width:768px){

.founder-image img{
height:450px;
}

.platform-card{

padding:40px 30px;
}

.mission-card{

padding:35px 30px;
}

.platform-card span{
font-size:50px;
}

}

@media(max-width:480px){

.founder-image img{
height:380px;
}

.platform-card span{
font-size:42px;
}

.founder-content h3{
font-size:20px;
}

}

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

.ecosystem-grid{

display:grid;

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

gap:25px;
}

.ecosystem-card{

padding:40px 30px;

min-height:260px;
}

.ecosystem-card h3{

margin-bottom:20px;
}



/* =========================================
PRODUCTIONS
========================================= */

.production-grid{

display:grid;

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

gap:25px;
}


.production-card{

height:420px;

border-radius:14px;

overflow:hidden;

position:relative;
}

.production-card img{

width:100%;
height:100%;

object-fit:cover;

transition:0.6s;
}

.production-card:hover img{
transform:scale(1.08);
}

.production-info{

position:absolute;

bottom:0;
left:0;

width:100%;

padding:10px;

background:
linear-gradient(
to top,
rgba(0,0,0,0.95),
transparent
);
}

/* =========================================
IMPACT
========================================= */

.stats{

display:grid;

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

gap:30px;

text-align:center;
}

.stat{

padding:40px 20px;

background:#111;

border-radius:14px;
}

.stat h3{

font-size:54px;

color:var(--gold);

margin-bottom:10px;
}

/* =========================================
PARTNERS
========================================= */

.partners{

display:flex;

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

gap:60px;

flex-wrap:wrap;

opacity:0.7;
}

.partners img{

height:60px;

filter:grayscale(100%);

transition:0.4s;
}

.partners img:hover{

filter:grayscale(0%);

opacity:1;
}

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

.cta{

text-align:center;

background:#111;
}

.cta p{

max-width:750px;

margin:auto;

margin-top:20px;

margin-bottom:40px;
}

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

footer{

padding:30px;

text-align:center;

background:black;

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

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

@media(max-width:1200px){

.hero-content{
max-width:900px;
}

.hero-content h1{
font-size:62px;
}

}

@media(max-width:992px){

.hero{
padding:
160px 20px 90px;
}

.ecosystem-grid,
.production-grid,
.stats{

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

.hero-content h1{
font-size:52px;
}

.hero-content p{
font-size:17px;
}

}

@media(max-width:768px){

.hero{

min-height:auto;

}

.hero-content{
text-align:center;
}

.hero-content h1{
font-size:42px;
}

.hero-content p{
font-size:16px;
margin-bottom:35px;
}

.hero-buttons{

flex-direction:column;

align-items:center;
}

.hero-buttons .btn{
width:100%;
max-width:320px;
}

.ecosystem-grid,
.production-grid,
.stats{

grid-template-columns:1fr;
}

}

@media(max-width:480px){


.hero-tag{
font-size:11px;
letter-spacing:2px;
}

.hero-content h1{
font-size:34px;
}

.hero-content p{
font-size:15px;
line-height:1.8;
}

}