/*
Theme Name: Marga Modern Minimal
Theme URI: https://example.com/
Author: MargaDev
Author URI: https://example.com/
Description: Theme WordPress classic editor, modular, light modern minimalis.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: marga-modern
*/

:root{
  --mm-bg:#ffffff;
  --mm-surface:#f8fafc;
  --mm-text:#0f172a;
  --mm-muted:#475569;
  --mm-border:#e2e8f0;
  --mm-primary:#2563eb;
  --mm-primary-600:#1d4ed8;
  --mm-radius:14px;
  --mm-shadow:0 10px 30px rgba(2,6,23,.08);
  --mm-container:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
  line-height:1.6;
  color:var(--mm-text);
  background:var(--mm-bg);
}
img{max-width:100%;height:auto}
a{color:inherit}

.mm-container{width:min(100% - 2rem,var(--mm-container));margin-inline:auto}
.mm-header{
  position:sticky;
  top:0;
  z-index:40;
  border-bottom:1px solid var(--mm-border);
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(12px);
}
.mm-header__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 0}
.mm-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none}
.mm-brand__name{font-weight:700;letter-spacing:-0.02em}
.mm-nav{display:flex;align-items:center;gap:1.1rem}
.mm-nav a{text-decoration:none;color:var(--mm-muted);font-weight:600}
.mm-nav a:hover{color:var(--mm-text)}
.mm-nav__list{list-style:none;display:flex;gap:1.1rem;margin:0;padding:0;align-items:center}
.mm-nav__list > li{margin:0;padding:0}
.mm-nav__list .sub-menu{display:none}
.mm-nav-toggle{display:none}

.mm-hero{
  padding:4.5rem 0 3.5rem;
  background:linear-gradient(180deg,var(--mm-surface),transparent 70%);
}
.mm-hero__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:2.5rem;align-items:center}
.mm-eyebrow{display:inline-flex;gap:.5rem;align-items:center;font-size:.9rem;color:var(--mm-muted)}
.mm-title{font-size:clamp(2rem,4vw,3.25rem);line-height:1.1;margin:.6rem 0 1rem;letter-spacing:-.03em}
.mm-lead{font-size:1.05rem;color:var(--mm-muted);margin:0 0 1.5rem}
.mm-actions{display:flex;gap:.75rem;flex-wrap:wrap}
.mm-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.75rem 1.05rem;
  border-radius:999px;
  border:1px solid var(--mm-border);
  text-decoration:none;
  font-weight:700;
}
.mm-btn--primary{background:var(--mm-primary);color:#fff;border-color:transparent}
.mm-btn--primary:hover{background:var(--mm-primary-600)}
.mm-btn--ghost{background:#fff}
.mm-card{
  background:#fff;
  border:1px solid var(--mm-border);
  border-radius:var(--mm-radius);
  box-shadow:var(--mm-shadow);
}
.mm-card__inner{padding:1.25rem}
.mm-section{padding:3.25rem 0}
.mm-section__title{font-size:1.5rem;letter-spacing:-.02em;margin:0 0 1rem}
.mm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.mm-feature{padding:1.1rem;border-radius:var(--mm-radius);border:1px solid var(--mm-border);background:#fff}
.mm-feature__title{margin:.2rem 0 .35rem;font-weight:800}
.mm-feature__desc{margin:0;color:var(--mm-muted)}

.mm-content{padding:2.5rem 0}
.mm-prose{max-width:75ch}
.mm-prose h1,.mm-prose h2,.mm-prose h3{letter-spacing:-.02em;line-height:1.2}
.mm-prose h1{font-size:2rem}
.mm-prose h2{font-size:1.5rem;margin-top:2rem}
.mm-prose p{color:var(--mm-text)}
.mm-prose a{color:var(--mm-primary);text-decoration:underline}
.mm-prose ul{padding-left:1.2rem}
.mm-prose li{margin:.25rem 0}

.mm-footer{border-top:1px solid var(--mm-border);padding:2rem 0;color:var(--mm-muted);background:#fff}
.mm-footer__grid{display:flex;gap:1rem;justify-content:space-between;flex-wrap:wrap}
.mm-footer-nav{list-style:none;margin:0;padding:0;display:flex;gap:1rem;flex-wrap:wrap}
.mm-footer-nav a{text-decoration:none;color:var(--mm-muted);font-weight:600}
.mm-footer-nav a:hover{color:var(--mm-text)}

input[type="text"],input[type="email"],input[type="url"],input[type="password"],textarea{
  width:100%;
  padding:.65rem .75rem;
  border:1px solid var(--mm-border);
  border-radius:12px;
  background:#fff;
  color:var(--mm-text);
}
input[type="text"]:focus,input[type="email"]:focus,input[type="url"]:focus,input[type="password"]:focus,textarea:focus{
  outline:2px solid rgba(37,99,235,.25);
  border-color:rgba(37,99,235,.6);
}
.comment-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.comment-list .comment{border:1px solid var(--mm-border);border-radius:var(--mm-radius);padding:1rem;background:#fff}
.comment-list .comment-meta{color:var(--mm-muted);font-size:.95rem}
.comment-list .comment-content{margin-top:.5rem}
.comment-respond{margin-top:1.5rem;border-top:1px solid var(--mm-border);padding-top:1.25rem}
.form-submit input[type="submit"]{
  background:var(--mm-primary);
  border:0;
  color:#fff;
  font-weight:800;
  border-radius:999px;
  padding:.75rem 1.1rem;
}
.form-submit input[type="submit"]:hover{background:var(--mm-primary-600)}

@media (max-width: 860px){
  .mm-hero__grid{grid-template-columns:1fr}
  .mm-grid{grid-template-columns:1fr}
  .mm-nav{display:none}
  .mm-nav-toggle{display:inline-flex}
  .mm-nav.is-open{display:flex;flex-direction:column;align-items:flex-start;gap:.8rem;padding:1rem 0}
  .mm-nav__list{flex-direction:column;align-items:flex-start}
}