
:root{
  --bg:#f2f7ff;
  --text:#0a1d2f;
  --muted:#4b6272;
  --brand:#1d74f2; /* dominant blue */
  --accent:#12c36a; /* green accent */
  --card:#ffffff;
  --line:#e3ecf6;
  --shadow:0 12px 32px rgba(29,116,242,.12);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:20px}

.logo{display:flex;align-items:center;gap:10px;font-weight:800}
.logo img{height:28px}
.nav a{margin-left:16px;color:var(--text);opacity:.9}
.nav a:hover{opacity:1}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:var(--shadow)}
.hero{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;align-items:center}
h1{font-size:2.1rem;margin:0 0 10px 0}
h2{font-size:1.45rem;margin:18px 0 10px 0}
h3{font-size:1.1rem;margin:12px 0 6px 0}
p{color:var(--muted);line-height:1.7}
.search{display:flex;gap:10px;margin-top:10px}
input[type=search],input[type=number],select{
  flex:1;padding:14px;border-radius:12px;border:1px solid var(--line);background:#fff;outline:none
}
input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(30,136,229,.15)}
button{
  padding:12px 16px;border-radius:12px;border:0;background:linear-gradient(180deg,#21a1f3,#1e88e5);
  color:#fff;font-weight:700;cursor:pointer;box-shadow:0 8px 22px rgba(30,136,229,.25)
}
button:hover{filter:brightness(1.05)}
.badges{display:flex;gap:8px;flex-wrap:wrap}
.badge{background:linear-gradient(180deg,#e7f1ff,#e5fff4);border:1px solid var(--line);padding:8px 12px;border-radius:999px;color:#0b1f2e;font-weight:600}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.food-card{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow);transition:transform .08s}
.food-card:hover{transform:translateY(-1px)}
.table{width:100%;border-collapse:collapse;margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.table th,.table td{border-bottom:1px solid var(--line);padding:12px;text-align:left}
.kpi{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.kpi .pill{background:#e8fff5;border:1px solid #c4f1da;padding:8px 10px;border-radius:999px;color:#0f7046}



.footer{
  margin:40px 0 50px;
  padding:24px 0 14px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:0.95rem;
}
.footer a{
  color:var(--text);
  text-decoration:none;
}
.footer a:hover{
  text-decoration:underline;
}
.footer-grid{
  display:grid;
  grid-template-columns:2fr 1.2fr 1.2fr 2fr;
  gap:24px;
  align-items:flex-start;
}
.footer-title{
  font-weight:800;
  font-size:1.05rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
  margin-bottom:6px;
  color:var(--text);
}
.footer-tagline{
  margin:0 0 8px;
}
.footer-links h3{
  font-size:0.85rem;
  text-transform:uppercase;
  letter-spacing:0.08em;
  margin-bottom:8px;
  color:var(--text);
}
.footer-links ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.footer-links li{
  opacity:0.9;
}
.footer-quote{
  font-style:italic;
  font-size:0.85rem;
  margin-top:4px;
}
.footer-mini-list{
  list-style:none;
  padding:0;
  margin:8px 0 0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.footer-mini-list li{
  opacity:0.9;
}
.footer-meta{
  margin-top:18px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  opacity:0.85;
}

/* Mobile footer layout */
@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:600px){
  .footer-grid{
    grid-template-columns:1fr;
  }
}
@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:600px){
  .footer-grid{
    grid-template-columns:1fr;
  }
}
@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:600px){
  .footer-grid{
    grid-template-columns:1fr;
  }
}

.notice{font-size:.9rem;color:#5a7284}
@media(max-width:900px){.hero{grid-template-columns:1fr}.grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.grid{grid-template-columns:1fr}}


.logo.brand-inline{display:flex;align-items:center;gap:10px}
.logo.brand-inline img{height:32px}
.logo.brand-inline span{font-weight:800;font-size:1.05rem;letter-spacing:.2px}


/* Blue-dominant theme with green accents */
button{
  padding:12px 16px;border-radius:12px;border:0;background:linear-gradient(180deg,#2a82ff,#1d74f2);
  color:#fff;font-weight:800;letter-spacing:.2px;cursor:pointer;box-shadow:0 8px 22px rgba(29,116,242,.28)
}
button:hover{filter:brightness(1.06)}
.badge{background:linear-gradient(180deg,#e8f1ff,#eafff4);border:1px solid var(--line);padding:9px 14px;border-radius:999px;color:var(--text);font-weight:700}
.kpi .pill{background:#eafff4;border:1px solid #c5f1db;color:#0d6a43}

.hero-banner{
  background: radial-gradient(1000px 400px at 20% -10%, rgba(29,116,242,.15), transparent),
              radial-gradient(1000px 400px at 90% 0%, rgba(18,195,106,.12), transparent);
  border:1px solid var(--line); border-radius:18px; padding:28px; box-shadow:var(--shadow)
}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
.feature{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}
.section{margin-top:22px}
.section h2{margin-bottom:10px}
.tools{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cta{display:flex;justify-content:space-between;align-items:center;gap:14px;background:linear-gradient(90deg,#1d74f2,#12c36a);color:#fff;border-radius:16px;padding:18px}
.cta a{background:#fff;color:#0a1d2f;padding:10px 12px;border-radius:10px;font-weight:800;text-decoration:none}
@media(max-width:900px){.features,.cards,.tools{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.features,.cards,.tools{grid-template-columns:1fr}}
.logo.brand-inline span{font-weight:900;font-size:1.1rem}


/* Header styling: solid blue bar, white text, larger logo */


.nav a{color:#fff ; opacity:1}
.logo.brand-inline img{height:44px}


/* ---- New site header ---- */






.site-nav a:hover{opacity:1; text-decoration:underline}
/* Push page content down a bit in case header overlay differs on some pages */
body{margin:0; padding:0;}







.site-nav a:hover{opacity:1; text-decoration:underline}

/* --- Unified brand header --- */






.site-nav a:hover{opacity:1; text-decoration:underline}

.site-header{width:100%; background:linear-gradient(90deg,#1b6efe 0%, #12c36a 100%); color:#fff}
.site-header .inner{max-width:1100px; margin:0 auto; padding:16px 20px; display:flex; align-items:center; justify-content:space-between}
.brand{display:flex; align-items:center; gap:14px}
.brand img{height:60px; width:auto}
.brand .title{color:#fff; font-weight:900; font-size:1.28rem; letter-spacing:.2px; white-space:nowrap}
.site-nav a{color:#fff; margin-left:16px; font-weight:600; opacity:.95; text-decoration:none}
.site-nav a:hover{opacity:1; text-decoration:underline}

.brand-logo{height:60px; width:auto; display:block}
@media(max-width:600px){.brand-logo{height:48px}}
