:root{
  --primary:#7ec8ff;
  --primary-dark:#0a2a3f;
  --bg:#0b1b28;
  --text:#e7f3ff;
  --muted:#9ab3c7;
  --card:#0f2436;
  --accent:#74b4ff;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji';background:var(--bg);color:var(--text)}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:32px 20px}
.navbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:linear-gradient(90deg,var(--primary-dark),#0d3048);border-bottom:1px solid #10324d}
.navbar .brand{display:flex;gap:10px;align-items:center;font-weight:700}
.navbar .logo{width:36px;height:36px;object-fit:cover;border-radius:8px}
.navbar nav{display:flex;gap:18px;align-items:center}
.navbar nav a{padding:8px 10px;border-radius:12px}
.navbar nav a:hover{background:#0f3652}
.navbar nav a.cta{background:var(--accent);color:#001a2b;font-weight:700}
#nav-toggle{display:none}
.burger{display:none;cursor:pointer}
.burger span{display:block;width:26px;height:3px;background:var(--text);margin:5px 0;border-radius:2px}
@media (max-width:820px){
  .burger{display:block}
  .navbar nav{position:absolute;right:10px;top:60px;background:#0d3048;padding:12px;border-radius:14px;display:none;flex-direction:column;min-width:200px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
  #nav-toggle:checked ~ nav{display:flex}
}
.hero{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(1200px 600px at 30% 10%,#12344d 0%,transparent 60%);}
.hero-full{min-height:92vh}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,42,63,.4),rgba(11,27,40,.9))}
.hero-content{position:relative;text-align:center;padding:20px;z-index:2}
.hero h1{font-size:52px;margin:0 0 10px}
.hero h1 span{color:var(--primary)}
.hero p{color:var(--muted);margin:0 0 16px}
.hero .btn{margin:6px}
#heroChart{position:absolute;inset:0;opacity:.35}
.btn{display:inline-block;background:var(--accent);color:#001a2b;padding:10px 16px;border-radius:14px;font-weight:700;border:none;cursor:pointer}
.btn.ghost{background:transparent;color:var(--text);border:1px solid #2a4b66}
.btn:hover{filter:brightness(1.05)}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:32px 20px;max-width:1100px;margin:0 auto}
.feature{background:var(--card);padding:18px;border-radius:18px;border:1px solid #143f5e}
.feature.big{grid-column:span 2}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.panel{background:var(--card);padding:18px;border-radius:18px;border:1px solid #143f5e}
.big-num{font-size:40px;font-weight:700}
.muted{color:var(--muted)}
.articles{display:grid;gap:18px}
.link{font-weight:600}
.checklist{line-height:1.9}
.ticker{overflow:hidden;border-top:1px solid #143f5e;border-bottom:1px solid #143f5e;background:#0d2c44}
.ticker-track{display:flex;gap:30px;white-space:nowrap;animation:ticker 20s linear infinite;padding:8px 10px}
.ticker-track span{font-weight:700}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* Footer alignment fix */
.footer{margin-top:40px;background:#081722;border-top:1px solid #10324d}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:20px;max-width:1100px;margin:0 auto;align-items:flex-start}
.footer h4{margin:0 0 6px}
.footer p, .footer li{color:var(--muted)}
.footer ul{list-style:none;padding:0;margin:0}
.footer-col ul li{margin:4px 0}
.copyright{padding:10px 20px;border-top:1px solid #0e2a42;color:#77a2c4;font-size:14px;text-align:center}
/* Carousel */
.section-title{font-size:28px;margin:0 0 12px}
.carousel{position:relative;overflow:hidden;border:1px solid #143f5e;border-radius:18px;background:var(--card);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.carousel .track{display:flex;transition:transform .5s ease}
.carousel .slide{min-width:100%}
.slide-card{padding:30px;min-height:180px;display:grid;place-items:center;text-align:center}
.carousel .nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.35);border:1px solid #2a4b66;color:#e7f3ff;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;cursor:pointer}
.carousel .nav:hover{background:rgba(0,0,0,.5)}
.carousel .prev{left:10px}.carousel .next{right:10px}
.carousel .dots{display:flex;gap:8px;justify-content:center;padding:10px}
.carousel .dots button{width:8px;height:8px;border-radius:50%;border:1px solid #4e78a1;background:transparent;cursor:pointer}
.carousel .dots button.active{background:#74b4ff}
/* WhatsApp button */
.whatsapp-float{position:fixed;right:16px;bottom:16px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:white;border:0;box-shadow:0 10px 30px rgba(0,0,0,.35);z-index:9999;transition:transform .15s ease}
.whatsapp-float:hover{transform:scale(1.05)}
.whatsapp-float svg{width:28px;height:28px;fill:white}
/* Responsive tweaks */

.hero-section {
  background: linear-gradient(rgba(0,43,91,0.8), rgba(0,43,91,0.8)), url('assets/images/market-bg.jpg') center/cover;
  color: white;
  text-align: center;
  padding: 100px 20px;
}
.hero-section h1 {
  font-size: 2.5rem;
  margin-bottom: 10px;
}
.hero-section p {
  font-size: 1.2rem;
}

.research-cards h2, 
.market-trends h2,
.downloads h2,
.newsletter h2 {
  margin-bottom: 20px;
  text-align: center;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.card {
  background: #032851;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  text-align: center;
}
.card h3 {
  margin-bottom: 10px;
}
.card p {
  margin-bottom: 15px;
}
.card .btn {
  background: #25d366;
  color: white;
  padding: 10px 15px;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.3s;
}
.card .btn:hover {
  background: #FFD700;
  color: #002B5B;
}

.chart-widget {
  background: #fff;
  padding: 15px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.downloads ul {
  list-style: none;
  text-align: center;
}
.downloads ul li {
  margin: 10px 0;
}
.downloads a {
  color: #002B5B;
  text-decoration: none;
  font-weight: 600;
}

.newsletter form {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 15px;
}
.newsletter input {
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
}
.newsletter button {
  background: #FFD700;
  border: none;
  padding: 10px 15px;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
}

@media (max-width:720px){
  .hero h1{font-size:36px}
  .slide-card{min-height:140px}
}