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

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

body{
font-family: "Poppins", sans-serif;
background:#ffffff;
color:#333;
line-height:1.7;
}

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

.fy-hero-section{
position:relative;
width:100%;
height:90vh;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
}

.fy-hero-img{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
z-index:1;
}

/* overlay */

.fy-hero-content{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.7));
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
text-align:center;
padding:30px;
z-index:2;
}

/* hero title */

.fy-hero-content h1{
font-size:52px;
font-weight:600;
color:#ffffff;
margin-bottom:15px;
letter-spacing:1px;
}

/* hero subtitle */

.fy-hero-content p{
font-size:20px;
max-width:720px;
color:#f1f5f9;
}

/* ================= ABOUT SECTION ================= */

.fy-about-section{
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:center;
gap:50px;
padding:80px 8%;
background:#ffffff;
}

.fy-about-text{
flex:1 1 520px;
max-width:720px;
}

.fy-about-text h2{
font-size:34px;
font-weight:600;
margin-bottom:18px;
color:#0f172a;
position:relative;
}

/* underline accent */

.fy-about-text h2::after{
content:"";
display:block;
width:70px;
height:4px;
background:#ff6b35;
margin-top:8px;
border-radius:2px;
}

/* paragraphs */

.fy-about-text p{
font-size:17px;
color:#475569;
margin-bottom:14px;
line-height:1.8;
}

/* image */

.fy-about-image{
flex:1 1 420px;
max-width:520px;
}

.fy-about-image img{
width:100%;
border-radius:18px;
box-shadow:0 12px 30px rgba(0,0,0,0.12);
transition:0.3s;
}

.fy-about-image img:hover{
transform:scale(1.04);
}

/* ================= FEATURE SECTION ================= */

.fy-feature-section{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
padding:80px 8%;
background:#f8fafc;
text-align:center;
}

/* feature cards */

.fy-card{
background:#ffffff;
padding:35px 25px;
border-radius:18px;
box-shadow:0 8px 22px rgba(0,0,0,0.08);
transition:all 0.35s ease;
position:relative;
overflow:hidden;
}

.fy-card-link{
text-decoration:none;
color:inherit;
display:block;
}

.fy-card-link:hover .fy-card{
transform:translateY(-4px);
transition:0.2s;
}

/* hover effect */

.fy-card:hover{
transform:translateY(-10px);
box-shadow:0 16px 35px rgba(0,0,0,0.12);
}

/* icon */

.fy-icon{
font-size:42px;
margin-bottom:10px;
}

/* title */

.fy-card h3{
font-size:20px;
margin-top:10px;
color:#0f172a;
font-weight:600;
}

/* description */

.fy-card p{
font-size:15.5px;
color:#64748b;
margin-top:10px;
line-height:1.6;
}

/* ================= WHY / MISSION SECTIONS ================= */

.fy-about-section:nth-child(even){
background:#f8fafc;
}

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

.fy-footer{
background:#0f172a;
color:#ffffff;
text-align:center;
padding:22px;
font-size:14px;
}

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

@media (max-width:1024px){

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

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

.fy-about-section{
padding:70px 6%;
}

}

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

@media (max-width:768px){

.fy-hero-section{
height:70vh;
}

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

.fy-hero-content p{
font-size:16px;
max-width:90%;
}

.fy-about-section{
flex-direction:column;
text-align:center;
padding:60px 6%;
}

.fy-about-text h2::after{
margin-left:auto;
margin-right:auto;
}

.fy-feature-section{
padding:60px 6%;
}

}

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

@media (max-width:480px){

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

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

.fy-about-text p{
font-size:15px;
}

.fy-card{
padding:28px 20px;
}

}