/*
Theme Name: MSA Clinic Child
Theme URI: https://msaclinic.com/
Description: Child theme for MSA Clinic. Works with Astra (recommended) or any parent theme.
Author: Abdelrazek Khashaba
Template: astra
Version: 1.0.0
Text Domain: msa-clinic-child
*/

:root{
  --msa-primary:#2E7D32;
  --msa-secondary:#1F2A44;
  --msa-text:#1f2937;
  --msa-muted:#6b7280;
  --msa-bg:#ffffff;
  --msa-surface:#f5f7fa;
  --msa-radius:14px;
}

/* Base */
body{color:var(--msa-text);background:var(--msa-bg);} 

/* Layout helpers */
.msa-container{max-width:1160px;margin:0 auto;padding:0 16px;}
.msa-section{padding:72px 0;}
.msa-muted{color:var(--msa-muted);} 

/* Header */
.msa-header{position:sticky;top:0;z-index:999;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);border-bottom:1px solid #e5e7eb;}
.msa-header__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;}
.msa-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;}
.msa-brand img{height:44px;width:auto;border-radius:10px;background:#fff;padding:6px;border:1px solid #eef2f7;}
.msa-brand__name{font-weight:800;letter-spacing:.2px;line-height:1.1;}
.msa-brand__tag{font-size:12px;color:var(--msa-muted);margin-top:2px;}

.msa-nav{display:flex;flex-wrap:wrap;gap:6px;}
.msa-nav a{font-weight:700;text-decoration:none;color:rgba(31,41,55,.8);padding:10px 12px;border-radius:999px;}
.msa-nav a:hover{background:#f3f4f6;color:#111827;}

.msa-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 14px;border-radius:12px;text-decoration:none;font-weight:800;border:1px solid transparent;}
.msa-btn--primary{background:var(--msa-primary);color:#fff;}
.msa-btn--outline{border-color:#e5e7eb;color:var(--msa-secondary);background:#fff;}

/* Hero */
.msa-hero{position:relative;overflow:hidden;}
.msa-hero__bg{position:absolute;inset:0;background:
  radial-gradient(circle at 20% 20%, rgba(46,125,50,.14), transparent 48%),
  radial-gradient(circle at 80% 15%, rgba(31,42,68,.12), transparent 52%),
  radial-gradient(circle at 60% 90%, rgba(46,125,50,.10), transparent 55%);
}
.msa-hero__grid{position:absolute;inset:0;background-image:linear-gradient(to right, rgba(229,231,235,.65) 1px, transparent 1px);background-size:72px 72px;opacity:.5;}
.msa-hero__inner{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start;padding:72px 0;}
.msa-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;color:var(--msa-muted);font-size:12px;font-weight:700;}
.msa-h1{font-size:46px;line-height:1.15;margin:14px 0 0;font-weight:900;letter-spacing:-.3px;}
.msa-h1 span{color:var(--msa-primary);} 
.msa-hero__p{margin:14px 0 0;color:var(--msa-muted);font-size:18px;line-height:1.9;max-width:42ch;}
.msa-stats{margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.msa-stat{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:12px 14px;}
.msa-stat__l{font-size:12px;color:var(--msa-muted);font-weight:800;}
.msa-stat__v{margin-top:6px;font-weight:900;color:var(--msa-secondary);} 

.msa-card{border:1px solid #e5e7eb;background:#fff;border-radius:18px;box-shadow:0 18px 45px rgba(15,23,42,.10);} 
.msa-card__pad{padding:18px;}

/* Grid cards */
.msa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.msa-card h3{margin:0;font-size:18px;font-weight:900;}
.msa-card p{margin:10px 0 0;line-height:1.9;color:var(--msa-muted);} 

/* Dark section */
.msa-dark{background:var(--msa-secondary);color:#fff;}
.msa-dark .msa-muted{color:rgba(255,255,255,.78);} 

/* Footer */
.msa-footer{border-top:1px solid #e5e7eb;padding:26px 0;color:var(--msa-muted);}

/* Floating WhatsApp */
.msa-wa{position:fixed;left:18px;bottom:18px;z-index:9999;}
.msa-wa a{background:var(--msa-primary);color:#fff;text-decoration:none;font-weight:900;padding:12px 14px;border-radius:999px;display:inline-flex;gap:8px;align-items:center;box-shadow:0 18px 45px rgba(15,23,42,.18);} 

/* Responsive */
@media (max-width: 980px){
  .msa-hero__inner{grid-template-columns:1fr;}
  .msa-stats{grid-template-columns:repeat(2,1fr);} 
  .msa-grid{grid-template-columns:1fr;}
  .msa-nav{display:none;}
}