/*
Theme Name: MantraWebGraphics Light Mega
Theme URI: https://example.com/
Author: MantraWebGraphics
Author URI: https://example.com/
Description: Lightweight, premium, mega-menu WordPress agency theme starter with 150+ service-ready mega nav, matching footer, and one landing page.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mantrawebgraphics
Tags: custom-menu, one-column, blog, portfolio
*/

/* Base + page defaults */
:root{
  --mw-bg:#F7F8FB;
  --mw-text:rgba(18,26,41,.92);
  --mw-muted:rgba(18,26,41,.62);
  --mw-stroke:rgba(18,26,41,.10);
  --mw-stroke2:rgba(18,26,41,.14);
  --mw-surface:rgba(255,255,255,.82);
  --mw-shadow: 0 24px 60px rgba(18,26,41,.12);
  --mw-shadow2: 0 10px 26px rgba(18,26,41,.08);
  --mw-brand1:#6D28D9;
  --mw-brand2:#0891B2;
  --mw-brand3:#F59E0B;
  --mw-focus: 0 0 0 3px rgba(8,145,178,.22);
  --mw-r:18px;
  --mw-r2:14px;
  --mw-maxw: 1360px;
  --mw-font: "Manrope", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: var(--mw-font);
  color:var(--mw-text);
  background:
    radial-gradient(1000px 520px at 10% -10%, rgba(109,40,217,.10), transparent 55%),
    radial-gradient(900px 500px at 90% 10%, rgba(8,145,178,.08), transparent 55%),
    radial-gradient(1000px 600px at 60% 120%, rgba(245,158,11,.08), transparent 55%),
    var(--mw-bg);
}
a{ color:inherit; text-decoration:none; }
:focus-visible{ outline:none; box-shadow: var(--mw-focus); border-radius: 12px; }

.mw-container{
  max-width: var(--mw-maxw);
  margin: 0 auto;
  padding: 0 14px;
}

.mw-hero{
  margin: 36px auto 0;
  padding: 0 14px 80px;
  max-width: var(--mw-maxw);
}
.mw-heroCard{
  border-radius: 24px;
  border: 1px solid var(--mw-stroke);
  background: rgba(255,255,255,.82);
  box-shadow: var(--mw-shadow2);
  padding: 28px;
}
.mw-heroCard h1{
  margin:0 0 10px;
  font-size: clamp(26px, 3.2vw, 44px);
  line-height: 1.08;
  letter-spacing: -.2px;
  font-weight: 600;
}
.mw-heroCard p{
  margin:0;
  color: var(--mw-muted);
  max-width: 86ch;
  line-height: 1.65;
  font-size: 14px;
  font-weight: 400;
}
.mw-section{
  margin-top: 18px;
  display:grid;
  gap: 14px;
  grid-template-columns: 1.1fr .9fr;
}
.mw-card{
  border-radius: 20px;
  border: 1px solid var(--mw-stroke);
  background: rgba(255,255,255,.82);
  box-shadow: var(--mw-shadow2);
  padding: 18px;
}
.mw-card h2{
  margin:0 0 8px;
  font-size: 16px;
  font-weight: 600;
}
.mw-card ul{
  margin:0;
  padding-left: 18px;
  color: var(--mw-muted);
  line-height: 1.65;
  font-size: 13px;
}
@media (max-width: 980px){
  .mw-section{ grid-template-columns: 1fr; }
}