/*
Theme Name: DrMorocoo Jannah Child
Theme URI: https://drmorocoo.com/
Description: هوية عربية هادئة وسريعة لموقع الشيخ الروحاني محمد المغربي.
Author: DrMorocoo
Template: jannah
Version: 1.0.0
Text Domain: drmorocoo
*/

:root {
  --dm-green: #0f766e;
  --dm-green-dark: #12372a;
  --dm-green-soft: #e8f4ef;
  --dm-gold: #c39a42;
  --dm-ink: #17211d;
  --dm-muted: #5e6d65;
  --dm-cream: #fbfaf6;
  --dm-white: #fff;
  --dm-border: #dfe8e2;
  --dm-shadow: 0 18px 55px rgba(18,55,42,.11);
}

body { color: var(--dm-ink); background: var(--dm-cream); }
a { transition: color .2s ease, background .2s ease, transform .2s ease; }
#theme-header { box-shadow: 0 4px 24px rgba(18,55,42,.08); }
.logo-text a, .logo-text h1 { color: var(--dm-green-dark) !important; font-weight: 800; letter-spacing: -.5px; }
.logo-text h1 { font-size: 48px; line-height: 1.25; }
#logo { padding-block: 20px; }
#logo img { width:110px !important; height:110px !important; max-width:110px !important; object-fit:contain; }
@media (min-width: 992px) {
  .logo-wrapper { display:flex !important; justify-content:center !important; }
  .logo-wrapper .logo-container { float:none !important; width:auto !important; margin-inline:auto !important; }
  .logo-wrapper #logo { margin-inline:auto !important; }
}
.main-nav { border: 0 !important; }
.main-menu a { font-weight: 700; }

.dm-home { direction: rtl; overflow: hidden; }
.dm-wrap { width: min(1160px, calc(100% - 36px)); margin-inline: auto; }
.dm-hero { position: relative; padding: 92px 0 76px; background: radial-gradient(circle at 12% 18%, rgba(195,154,66,.20), transparent 30%), linear-gradient(135deg, #eef7f2 0%, #fbfaf6 55%, #f5ead3 140%); border-bottom: 1px solid var(--dm-border); }
.dm-hero::after { content:""; position:absolute; width:320px; height:320px; border:1px solid rgba(15,118,110,.12); border-radius:50%; left:-120px; bottom:-165px; }
.dm-eyebrow { display:inline-flex; align-items:center; gap:8px; color:var(--dm-green); background:#fff; border:1px solid var(--dm-border); border-radius:999px; padding:8px 14px; font-size:14px; font-weight:800; box-shadow:0 8px 24px rgba(18,55,42,.06); }
.dm-eyebrow::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--dm-gold); }
.dm-hero h1 { max-width:850px; margin:22px 0 18px; color:var(--dm-green-dark); font-size:clamp(38px,5.6vw,72px); line-height:1.15; font-weight:900; letter-spacing:-1.5px; }
.dm-hero p { max-width:750px; margin:0; color:var(--dm-muted); font-size:clamp(18px,2vw,23px); line-height:1.9; }
.dm-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.dm-btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 24px; border-radius:14px; font-weight:800; text-decoration:none !important; }
.dm-btn-primary { color:#fff !important; background:var(--dm-green); box-shadow:0 12px 30px rgba(15,118,110,.23); }
.dm-btn-primary:hover { color:#fff !important; background:#0b5f59; transform:translateY(-2px); }
.dm-btn-secondary { color:var(--dm-green-dark) !important; background:#fff; border:1px solid var(--dm-border); }
.dm-btn-secondary:hover { color:var(--dm-green) !important; transform:translateY(-2px); }
.dm-trust { display:flex; flex-wrap:wrap; gap:18px 30px; margin:34px 0 0; padding:0; list-style:none; color:#395248; font-size:14px; font-weight:700; }
.dm-trust li::before { content:"✓"; display:inline-grid; place-items:center; width:22px; height:22px; margin-left:8px; color:#fff; background:var(--dm-green); border-radius:50%; font-size:12px; }

.dm-section { padding:78px 0; }
.dm-section-alt { background:#fff; border-block:1px solid var(--dm-border); }
.dm-heading { max-width:740px; margin-bottom:36px; }
.dm-kicker { color:var(--dm-gold); font-size:14px; font-weight:900; letter-spacing:.2px; }
.dm-heading h2 { margin:8px 0 12px; color:var(--dm-green-dark); font-size:clamp(30px,4vw,46px); line-height:1.25; font-weight:900; }
.dm-heading p { color:var(--dm-muted); font-size:18px; line-height:1.9; }
.dm-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.dm-card { position:relative; padding:28px; background:#fff; border:1px solid var(--dm-border); border-radius:20px; box-shadow:0 10px 34px rgba(18,55,42,.06); }
.dm-card::before { content:""; display:block; width:42px; height:4px; margin-bottom:22px; border-radius:99px; background:linear-gradient(90deg,var(--dm-green),var(--dm-gold)); }
.dm-card h3 { margin:0 0 12px; color:var(--dm-green-dark); font-size:22px; font-weight:900; }
.dm-card p { margin:0; color:var(--dm-muted); line-height:1.85; }
.dm-card a { color:var(--dm-green); font-weight:800; }

.dm-boundary { display:grid; grid-template-columns:1.1fr .9fr; gap:34px; align-items:center; padding:42px; color:#fff; background:linear-gradient(135deg,var(--dm-green-dark),#174d3b); border-radius:28px; box-shadow:var(--dm-shadow); }
.dm-boundary h2 { margin:0 0 14px; color:#fff; font-size:clamp(28px,4vw,44px); font-weight:900; }
.dm-boundary p { margin:0; color:#dcebe4; font-size:18px; line-height:1.9; }
.dm-boundary ul { margin:0; padding:0; list-style:none; }
.dm-boundary li { margin:12px 0; padding:12px 16px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:12px; }
.dm-boundary li::before { content:"•"; margin-left:10px; color:#f1ca75; }

.dm-articles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.dm-article { display:flex; flex-direction:column; min-height:230px; padding:26px; color:inherit; background:var(--dm-cream); border:1px solid var(--dm-border); border-radius:18px; text-decoration:none !important; }
.dm-article:hover { transform:translateY(-4px); border-color:rgba(15,118,110,.35); box-shadow:0 16px 36px rgba(18,55,42,.09); }
.dm-article span { color:var(--dm-green); font-size:13px; font-weight:900; }
.dm-article h3 { margin:14px 0 10px; color:var(--dm-green-dark); font-size:21px; line-height:1.55; font-weight:900; }
.dm-article p { margin:0 0 18px; color:var(--dm-muted); line-height:1.75; }
.dm-article strong { margin-top:auto; color:var(--dm-green); }

.dm-cta { padding:68px 0 86px; text-align:center; }
.dm-cta-box { padding:48px 30px; background:linear-gradient(135deg,#fff,#eef7f2); border:1px solid var(--dm-border); border-radius:28px; box-shadow:var(--dm-shadow); }
.dm-cta h2 { margin:0 0 12px; color:var(--dm-green-dark); font-size:clamp(30px,4vw,46px); font-weight:900; }
.dm-cta p { max-width:690px; margin:0 auto 25px; color:var(--dm-muted); font-size:18px; line-height:1.9; }

.entry-header .post-title, .page-title { color:var(--dm-green-dark); }
body.blog .post-item.no-small-thumbs,
body.archive .post-item.no-small-thumbs,
body.search .post-item.no-small-thumbs { padding:24px; background:#fff; border:1px solid var(--dm-border); border-radius:18px; box-shadow:0 8px 28px rgba(18,55,42,.06); }
body.blog .post-item.no-small-thumbs .post-details,
body.archive .post-item.no-small-thumbs .post-details,
body.search .post-item.no-small-thumbs .post-details { padding:0 !important; }
.container-wrapper, .widget { border-color:var(--dm-border); }
.post-item { border-radius:16px; }
#footer { background:var(--dm-green-dark); }

@media (max-width: 900px) {
  .dm-grid, .dm-articles { grid-template-columns:1fr 1fr; }
  .dm-boundary { grid-template-columns:1fr; padding:34px; }
}
@media (max-width: 620px) {
  #logo { max-width: 86px; margin-inline:auto !important; padding-block: 9px; }
  #logo > a { display:block; max-width:86px; }
  #logo img { width:72px !important; height:72px !important; max-width:72px !important; }
  .logo-text h1 { max-width: 240px; font-size: 27px; line-height: 1.35; }
  #mobile-menu-icon, .tie-search-trigger-mobile { display:flex !important; align-items:center; justify-content:center; min-width:48px; min-height:48px; }
  .dm-wrap { width:min(100% - 24px,1160px); }
  .dm-hero { padding:58px 0 52px; }
  .dm-hero h1 { font-size:40px; letter-spacing:-.6px; }
  .dm-hero p { font-size:17px; }
  .dm-actions { flex-direction:column; }
  .dm-btn { width:100%; }
  .dm-trust { display:grid; gap:13px; }
  .dm-section { padding:54px 0; }
  .dm-grid, .dm-articles { grid-template-columns:1fr; }
  .dm-card, .dm-article { padding:22px; }
  .dm-boundary { padding:28px 22px; border-radius:22px; }
  .dm-cta { padding:46px 0 60px; }
  .dm-cta-box { padding:34px 20px; }
}