/* =========================================================   HERO SECTION - NATURAL IMAGE / GLASS TEXT CARD   ========================================================= */
.hero-wrap{padding:24px 0;}
.hero-card{position:relative;min-height:300px;border-radius:26px;overflow:hidden;display:flex;align-items:center;justify-content:flex-start;background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:var(--shadow);}
/* Keep overlay very subtle instead of tinting the full image */
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.38) 0%,rgba(0,0,0,.18) 38%,rgba(0,0,0,.04) 72%,rgba(0,0,0,0) 100%);}
/* Text panel instead of tinting the whole hero */
.hero-content{position:relative;z-index:2;width:min(92%,520px);margin-left:18px;padding:20px;text-align:left;color:#fff;border-radius:24px;background:rgba(15,81,50,.05);border:1px solid rgba(255,255,255,.22);box-shadow:0 18px 42px rgba(0,0,0,.22);backdrop-filter:blur(4px);}
.hero-badge{display:inline-block;margin-bottom:12px;padding:7px 7px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.24);color:#fff;font-size:.82rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;}
.hero-content h1{margin:0 0 8px;font-size:clamp(1.2rem,2.5vw,1.5rem);line-height:1.05;letter-spacing:-.035em;}
.hero-content p{margin:0;font-size:clamp(1rem,2vw,1.16rem);line-height:1.45;color:rgba(255,255,255,.92);}

@media(max-width:768px){
  .hero-wrap{padding:18px 0;}
  .hero-card{min-height:300px;border-radius:20px;align-items:flex-end;}
  .hero-overlay{background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.18) 45%,rgba(0,0,0,.56) 100%);}
.hero-content{width:auto;margin:18px;padding:22px;text-align:center;border-radius:20px;background:rgba(15,81,50,.25);}
.hero-content h1{font-size:1.85rem;}
.hero-content p{font-size:.96rem;line-height:1.5;}
}

/* =========================================================   AYA   ========================================================= */
.aya-section{padding:10px 10px;}
.aya-card{background:#ffffff; border-radius:18px; padding:10px; text-align:center; box-shadow:0 10px 35px rgba(0,0,0,.05); border-top:5px solid #16a34a;}
.aya-badge{display:inline-block; background:#dcfce7; color:#166534; padding:6px 10px; border-radius:50px; font-size:22px; font-weight:600; margin-bottom:10px;}
.aya-arabic{font-family:'Amiri','Noto Naskh Arabic',serif; font-size:18px; line-height:26px; direction:rtl; color:#065f46; margin-bottom:10px;}
.aya-divider{width:80px; height:3px; background:linear-gradient(to right, #22c55e, #16a34a); margin:10px auto; border-radius:10px;}
.aya-english{font-size:14px; color:#374151; max-width:700px; margin:auto;}
.aya-reference{margin-top:8px;color:#16a34a;font-weight:600;text-align:right;}

/* =========================================================   INTRO SECTION   ========================================================= */
.intro-section{padding:10px 0;}
.intro-card{background:#fff;border:1px solid rgba(15,81,50,.14);border-radius:24px;padding:14px;box-shadow:0 14px 34px rgba(0,0,0,.07);}
.intro-card h2{margin:14px 0 14px;color:#0f5132;font-size:clamp(28px,4vw,44px);line-height:1.12;letter-spacing:-.035em;}
.intro-card p{margin:0 0 14px;color:#374151;font-size:17px;line-height:1.75;}
.intro-card p:last-child{margin-bottom:0;}
.intro-actions{margin-top:24px;}

@media(max-width:700px){
  .intro-section{padding:30px 0;}
  .intro-card{padding:24px;border-radius:20px;}
}

/* =========erase==============================================   PAGE INTRO / STATS   ========================================================= */
.page-intro{padding:34px 0 8px;}
.page-intro-grid{display:grid; grid-template-columns:1.0fr .8fr; gap:12px; align-items:stretch;}
.intro-card,.stats-card{background:rgba(255,255,255,.88); border:1px solid rgba(20,83,45,.08); border-radius:var(--radius); box-shadow:var(--shadow); padding:26px; backdrop-filter:blur(8px);}
.intro-card h2,.stats-card h3{margin:0 0 12px; color:var(--nav);}
.intro-card p,.stats-card p{margin:0; color:var(--muted); line-height:1.8;}
.stats-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:14px; margin-top:18px;}
.stat{padding:16px; border-radius:16px; background:linear-gradient(180deg, #f8fff9, #ffffff); border:1px solid rgba(34,197,94,.16);}
.stat strong{display:block; font-size:1.35rem; color:var(--nav2); margin-bottom:4px;}
.stat span{color:var(--muted); font-size:.92rem;}

/* =========================================================   PRE CTA   ========================================================= */
.pre-cta{padding:10px 0 10px; display:flex;justify-content:center;}
.pre-cta-card{text-align:center;max-width:720px;margin:0 auto;padding:10px 10px;border-radius:18px;background:rgba(15,81,50,.04);border:1px solid rgba(15,81,50,.08);}
.pre-cta-card p{margin:0;font-size:1rem;color:var(--txt);line-height:1.6;}

/* ========================================================= CTA ========================================================= */
.media-cta{padding:0 0 20px;}
.cta-card{background:linear-gradient(135deg,var(--nav),var(--nav2));color:#fff;border-radius:26px;padding:32px;box-shadow:var(--shadow);}
.media-cta .cta-card,.cta-card-dual,.cta-flex{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;}
.cta-copy,.cta-left{flex:1 1 420px;}
.cta-card h3{margin:0 0 10px;font-size:1.6rem;}
.cta-card p{margin:0;max-width:720px;color:rgba(255,255,255,.9);line-height:1.75;}
.cta-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;}
.cta-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:999px;background:#fff;color:var(--nav);text-decoration:none;font-weight:800;white-space:nowrap;transition:.22s ease;}
.cta-btn-primary{background:#fff;color:#0f5132;}
.cta-btn:hover{background:#f0fdf4;transform:translateY(-1px);}
.cta-btn-secondary{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.55);}
.cta-btn-secondary:hover{background:#fff;color:#0f5132;}
.cta-logo img{transition:transform .25s ease;}
.cta-logo:hover img{transform:scale(1.10);}
.whatsapp-btn{display:inline-flex;align-items:center;gap:10px;}
.whatsapp-icon{width:22px;height:22px;object-fit:contain;}
.cta-partner{text-align:center;margin-bottom:14px;}
.cta-partner-label{display:block;margin-bottom:4px;color:#fff;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}
.cta-partner img{max-height:clamp(48px,5vw,64px);width:auto;object-fit:contain;opacity:.95;transition:.25s ease;}
.cta-partner:hover img{transform:scale(1.10);}

@media(max-width:768px){
.media-cta{padding:24px 0 46px;}
.cta-card,.media-cta .cta-card,.cta-card-dual,.cta-flex{flex-direction:column;align-items:stretch;text-align:center;gap:18px;padding:22px 18px;border-radius:20px;}
.cta-card h3{font-size:1.3rem;line-height:1.25;}
.cta-card p{font-size:.96rem;line-height:1.65;}
.cta-actions{width:100%;justify-content:stretch;flex-direction:column;}
.cta-actions .cta-btn,.cta-btn{width:100%;text-align:center;}
.cta-right{width:100%;}
.cta-logo img{margin:0 auto;max-width:160px;}
.cta-actions .cta-btn,.cta-btn{width:100%;text-align:center;}
@media(max-width:768px){
  .cta-copy,
  .cta-left,
  .cta-right{
    flex:0 1 auto;
    width:100%;
  }
}
}