/* =========================
   SewaCode Header & Footer
   ========================= */

/* Brand palette + font */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
:root{
  --sc-accent:#2563eb;           /* link/CTA */
  --sc-ink:#1a2240;              /* text */
  --sc-muted:#5a678a;            /* secondary text */
  --sc-line:#e9edf5;             /* separators */
  --sc-grad-a:#2a2e43;           /* deep blue-purple */
  --sc-grad-b:#4b5cc4;
}

body,
button,input,select,textarea{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  color:var(--sc-ink);
}

/* ---- Top Contact Bar ---- */
.sc-topbar{
  display:flex;align-items:center;gap:16px;
  justify-content:space-between;
  padding:8px 4%;
  color:var(--sc-muted);
  background:#fff;
  border-bottom:1px solid var(--sc-line);
}
.sc-topbar .left, .sc-topbar .right{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.sc-topbar .item{display:flex;align-items:center;gap:8px;font-weight:500}
.sc-topbar .item svg{width:16px;height:16px;color:var(--sc-accent);}

/* ---- Main Header (sticky) ---- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:#fff;
  border-bottom:1px solid var(--sc-line);
  margin:0; padding:12px 4%;
  backdrop-filter:saturate(140%) blur(6px);
}
.site-branding{width:auto; padding:0; display:flex; align-items:center; gap:.5rem}
.site-title{margin:0; font-size:28px; font-weight:700; color:var(--sc-accent)}
.site-description{margin:0; color:var(--sc-muted); font-weight:500}

/* Put nav center, tagline at far right, CTA after it */
.sc-header-row{display:flex; align-items:center; gap:24px}
.sc-spacer{flex:1 1 auto}

/* Nav */
.main-navigation{margin:0; width:auto; text-align:center}
.main-navigation ul{display:flex; gap:26px; align-items:center}
.main-navigation a{
  color:var(--sc-muted); font-weight:600; padding:10px 0; position:relative;
}
.main-navigation a:hover,
.main-navigation li:hover > a{color:var(--sc-accent)}
/* Active underline like screenshot */
.main-navigation .current-menu-item > a::after,
.main-navigation a:hover::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px;
  height:2px; background:var(--sc-accent);
}

/* Tagline (right) */
.sc-tagline{color:var(--sc-muted); font-weight:500; white-space:nowrap}

/* CTA button */
.sc-cta{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 16px; border-radius:8px; font-weight:700; color:#fff;
  background:linear-gradient(135deg,var(--sc-grad-a),var(--sc-grad-b));
  box-shadow:0 8px 22px rgba(75,92,196,.28); margin-left:16px;
}
.sc-cta:hover{transform:translateY(-2px);}

/* Dropdown alignment fix from theme */
.main-navigation .menu-item-has-children > ul{
  top:auto; left:auto; margin-top:12px; border:1px solid var(--sc-line);
}

/* ---- Responsive ---- */
@media (max-width: 1024px){
  .sc-tagline{display:none}
}
@media (max-width: 768px){
  .sc-topbar{padding:8px 16px}
  .site-header{padding:12px 16px}
  .main-navigation ul{gap:16px; flex-wrap:wrap}
  .sc-cta{margin-left:0}
}

/* ---- Footer (gradient + centered) ---- */
.site-footer{
  background:linear-gradient(135deg,var(--sc-grad-a),var(--sc-grad-b));
  color:#fff; text-align:center; padding:52px 4% !important; margin-top:60px;
}
.site-footer a{color:#fff; text-decoration:none; font-weight:600}
.site-footer a:hover{text-decoration:underline}
.site-info{opacity:.95}