/* =====================================================
   AGRISTARTEX SPONSORSHIP PAGE
   PROFESSIONAL EXHIBITION DESIGN
===================================================== */


/* ===============================
   GLOBAL VARIABLES
================================ */

:root{

--primary:#006400;
--secondary:#0a8f3c;
--gold:#ffd700;
--dark:#1d1d1d;
--light:#f7faf7;
--white:#ffffff;
--shadow:0 15px 40px rgba(0,0,0,.10);

}



/* ===============================
   GENERAL
================================ */


body{

background:#f6f8f6;

}



.container{

width:min(1200px,92%);

margin:auto;

}



section{

padding:80px 0;

}



h2{

text-align:center;

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

color:var(--primary);

margin-bottom:20px;

font-weight:800;

}



.section-text,
section p{

line-height:1.8;

font-size:1.05rem;

color:#555;

}




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


.sponsor-hero{

height:75vh;

background:

linear-gradient(
90deg,
rgba(0,100,0,.9),
rgba(0,0,0,.45)
),

url("../images/yessaimage4.jpg.jpg");

background-size:cover;

background-position:center;

display:flex;

align-items:center;

position:relative;

color:white;

}



.hero-content{

width:min(900px,90%);

margin:auto;

position:relative;

z-index:2;

}



.hero-content h1{

font-size:clamp(2.5rem,6vw,4.5rem);

line-height:1.1;

margin-bottom:25px;

}



.hero-content p{

font-size:1.25rem;

color:white;

max-width:750px;

}




.hero-buttons{

margin-top:35px;

display:flex;

gap:20px;

flex-wrap:wrap;

}



.btn{

display:inline-block;

background:var(--gold);

color:#000;

padding:15px 35px;

border-radius:50px;

font-weight:bold;

text-decoration:none;

transition:.3s;

}



.btn:hover{

transform:translateY(-5px);

background:white;

}




.btn-outline{

background:transparent;

border:2px solid white;

color:white;

}




/* ===============================
 INTRO WHY SPONSOR
================================ */


.intro-section{

background:white;

}



.why-grid{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(250px,1fr));

gap:30px;

margin-top:40px;

}



.why-card{

background:white;

padding:35px;

border-radius:18px;

box-shadow:var(--shadow);

text-align:center;

transition:.3s;

}



.why-card:hover{

transform:translateY(-10px);

}



.why-card i{

font-size:45px;

color:var(--primary);

margin-bottom:20px;

}




.why-card h3{

color:var(--primary);

}



/* ===============================
 BENEFITS
================================ */


.benefits-section{

background:#f0f7f0;

}



.benefit-grid{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(250px,1fr));

gap:30px;

margin-top:40px;

}



.benefit-card{

background:white;

padding:35px;

border-radius:18px;

box-shadow:var(--shadow);

text-align:center;

}



.benefit-card i{

font-size:40px;

color:#0b7d35;

}



/* ===============================
 SPONSOR LOGOS
================================ */


.current-partners{

background:white;

}



.sponsors-container{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(180px,1fr));

gap:30px;

margin-top:40px;

}



.sponsor-card{

background:white;

padding:20px;

border-radius:15px;

box-shadow:var(--shadow);

display:flex;

align-items:center;

justify-content:center;

height:180px;

transition:.3s;

}



.sponsor-card:hover{

transform:scale(1.05);

}



.sponsor-card img{

max-width:100%;

max-height:130px;

object-fit:contain;

}



/* ===============================
 SPONSOR LEVELS
================================ */


.sponsorship-levels{

background:#f7faf7;

}



.levels-grid{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(280px,1fr));

gap:30px;

margin-top:50px;

}



.level-card{

background:white;

padding:40px 30px;

border-radius:20px;

box-shadow:var(--shadow);

}



.level-card.featured{

border-top:8px solid var(--gold);

}



.level-card i{

font-size:40px;

color:var(--primary);

}



.level-card h3{

font-size:1.6rem;

color:var(--primary);

}



.level-card ul{

padding-left:20px;

line-height:2;

}





/* ===============================
 BRANDING GALLERY
================================ */


.branding-section{

background:white;

}



.branding-grid{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(260px,1fr));

gap:30px;

margin-top:40px;

}



.branding-item{

background:white;

border-radius:18px;

overflow:hidden;

box-shadow:var(--shadow);

transition:.3s;

}



.branding-item:hover{

transform:translateY(-8px);

}



.branding-item img{

width:100%;

height:280px;

object-fit:cover;

}



.branding-item h3{

padding:20px;

color:var(--primary);

}




/* ===============================
 MAJOR ITEMS
================================ */


.major-items{

background:#f0f7f0;

}



.items-grid{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(250px,1fr));

gap:30px;

}



.item-card{

background:white;

padding:30px;

border-radius:18px;

box-shadow:var(--shadow);

text-align:center;

}



.item-card i{

font-size:40px;

color:var(--primary);

}





/* ===============================
 APPRECIATION
================================ */


.appreciation-section{

background:white;

}



.appreciation-grid{

display:grid;

grid-template-columns:

repeat(auto-fit,minmax(250px,1fr));

gap:30px;

}



.appreciation-grid div{

padding:35px;

text-align:center;

background:#f7faf7;

border-radius:20px;

}



.appreciation-grid i{

font-size:40px;

color:var(--primary);

}




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


.sponsor-cta{

background:

linear-gradient(
135deg,
#006400,
#003300
);

color:white;

text-align:center;

}



.sponsor-cta h2{

color:white;

}



.sponsor-cta p{

color:white;

font-size:1.2rem;

}



.contact-info{

margin-top:25px;

}





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


@media(max-width:768px){


section{

padding:55px 0;

}


.hero-content{

text-align:center;

}


.hero-buttons{

justify-content:center;

}


.hero-content p{

font-size:1rem;

}



}




@media(max-width:480px){


.btn{

width:100%;

text-align:center;

}


.sponsor-hero{

height:90vh;

}



.branding-item img{

height:220px;

}


}