:root{

--green:#2A7A3B;
--green-dark:#1d5a2a;
--gold:#F5A623;
--blue:#1A3A6B;
--bg:#FAFAF7;

}

body{

margin:0;
font-family:'Source Sans 3',sans-serif;
background:var(--bg);
padding-top:70px;

}

/* HEADER */

header{

background:white;
position:fixed;
top:0;
left:0;
right:0;
box-shadow:0 6px 18px rgba(0,0,0,0.06);

}

.navbar{

max-width:1200px;
margin:auto;
display:flex;
justify-content:space-between;
align-items:center;
padding:12px 20px;

}

.brand{

display:flex;
align-items:center;
gap:10px;

}

.brand img{

height:48px;

}

.brand-text .gu{

font-family:'Noto Sans Gujarati';
font-weight:700;
font-size:18px;
color:#c68b1f;
line-height:1.1;

}

.brand-text .en{
font-size:13px;
color:#6b7a6b;
line-height:1.1;

}

.nav-links{

display:flex;
gap:12px;

}

.nav-btn{

padding:6px 14px;
background:#eef6ef;
border-radius:10px;
text-decoration:none;
color:#355c3a;
font-size:14px;
font-weight:500;

}

.nav-whatsapp{

background:#25D366;
color:white;
padding:7px 16px;
border-radius:12px;
text-decoration:none;
font-size:14px;
font-weight:600;

}

.nav-btn:hover{
background:#e3efe4;
}

/* HERO */

.hero{

background:linear-gradient(135deg,var(--green-dark),var(--green),var(--blue));
color:white;
text-align:center;
padding:80px 20px;
position:relative;

}

.hero::after{

content:"";
position:absolute;
inset:0;
background-image:
linear-gradient(rgba(255,255,255,0.06) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.06) 1px, transparent 1px);
background-size:40px 40px;
opacity:0.35;

}

.hero-buttons{

margin-top:20px;

}

.btn-primary{

background:var(--gold);
padding:12px 20px;
border-radius:10px;
color:black;
text-decoration:none;

}

.btn-secondary{

border:1px solid white;
padding:12px 20px;
border-radius:10px;
color:white;
text-decoration:none;

}

/* MARKET */

.container{

max-width:1100px;
margin:auto;
padding:40px 20px;

}

.market-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
margin-top:20px;
}

.market-card{
background:#ffffff;
border:1px solid #e5e5e5;
border-radius:14px;
padding:18px;
box-shadow:0 2px 8px rgba(0,0,0,0.05);
transition:all 0.2s ease;
}

.market-card:hover{
transform:translateY(-3px);
box-shadow:0 6px 14px rgba(0,0,0,0.08);
}
.market-price{

font-size:28px;
font-weight:700;
color:var(--green);

}

.table-wrap{

background:white;
border-radius:12px;
overflow:hidden;
box-shadow:0 4px 18px rgba(0,0,0,0.08);

}

table{

width:100%;
border-collapse:collapse;

}

th{

background:var(--green);
color:white;
padding:14px;
text-align:left;

}

td{

padding:14px;
border-bottom:1px solid #eee;

}

/* FOOTER */

.footer{

background:linear-gradient(180deg,#0f2a10,#163d18);
color:#c9d1c9;
padding:50px 20px;

}

.footer-container{

max-width:1100px;
margin:auto;
display:grid;
grid-template-columns:2fr 1fr 1fr;
gap:40px;

}

.footer-bottom{

border-top:1px solid rgba(255,255,255,0.1);
margin-top:30px;
padding-top:15px;

}

.footer-tagline{

color:#F5A623;
font-weight:600;

}
/* ── SECTION TITLES ── */
.section-title{font-size:1.5rem;font-weight:700;color:#1a2e1a;margin:32px 0 4px;}
.section-sub{font-size:.9rem;color:#6b7a6b;margin:0 0 20px;}

/* ── MARKET CARDS ── */
.market-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.market-commodity{font-size:.85rem;font-weight:700;color:#2A7A3B;font-family:'Noto Sans Gujarati',sans-serif;}
.market-icon { width: 36px; height: 36px; flex-shrink: 0; }
.market-market{font-size:.78rem;color:#6b7a6b;margin-top:4px;}
.trend-pill{display:inline-block;font-size:.7rem;padding:3px 10px;border-radius:20px;margin-top:8px;font-weight:600;}
.trend-flat{background:#f0f4f0;color:#5a7a5a;}
.trend-up{background:#e8f5e8;color:#2A7A3B;}
.trend-down{background:#fef2f2;color:#dc2626;}

/* ── SUBSCRIBE ── */
.subscribe{background:linear-gradient(135deg,#1d5a2a,#2A7A3B);color:white;padding:40px;border-radius:16px;text-align:center;margin-top:40px;}
.subscribe h3{font-size:1.3rem;font-weight:700;margin:0 0 8px;}
.subscribe p{margin:0 0 20px;opacity:.85;}
.subscribe input{padding:12px 16px;border-radius:10px;border:none;font-size:.95rem;width:220px;margin-right:10px;}
.subscribe button{background:#F5A623;color:black;padding:12px 20px;border-radius:10px;border:none;font-weight:700;cursor:pointer;font-size:.9rem;font-family:'Source Sans 3',sans-serif;}
.subscribe button:hover{background:#d4891e;}

/* ── FAQ ── */
#faqList h3{font-family:'Noto Sans Gujarati','Source Sans 3',sans-serif;}

/* ── HERO BADGE ── */
.hero-badge{display:inline-block;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);padding:6px 18px;border-radius:20px;font-size:.78rem;font-weight:600;margin-bottom:16px;}
.hero h1{font-size:2.2rem;font-weight:700;margin:0 0 10px;position:relative;z-index:1;}
.hero p{margin:4px 0;opacity:.9;position:relative;z-index:1;}
.hero-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:24px;position:relative;z-index:1;}

@media(max-width:768px){
  .market-grid{grid-template-columns:repeat(2,1fr);}
  .hero h1{font-size:1.6rem;}
  .subscribe input{width:100%;margin:0 0 10px;}
  .nav-links{display:none;}
}
@media(max-width:480px){
  .market-grid{grid-template-columns:1fr;}
}