/* NAWA theme — design system + animations (ported 1:1 from approved HTML design) */
























    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { direction: rtl; scroll-behavior: smooth; }
    body { background: #FAFAF8; color: #0F1923; font-family: 'Cairo', system-ui, sans-serif; line-height: 1.7; overflow-x: hidden; }

    @keyframes fadeUp   { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
    @keyframes fadeIn   { from { opacity:0; } to { opacity:1; } }
    @keyframes float    { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);} }
    @keyframes pulse-g  { 0%,100%{box-shadow:0 0 0 0 rgba(11,92,56,.3);} 70%{box-shadow:0 0 0 14px rgba(11,92,56,0);} }
    @keyframes spin-cw  { from{transform:translate(-50%,-50%) rotate(0deg);} to{transform:translate(-50%,-50%) rotate(360deg);} }
    @keyframes spin-ccw { from{transform:translate(-50%,-50%) rotate(0deg);} to{transform:translate(-50%,-50%) rotate(-360deg);} }
    @keyframes nucleus-glow { 0%,100%{box-shadow:0 0 30px rgba(11,92,56,.6),0 0 60px rgba(200,148,12,.25);} 50%{box-shadow:0 0 50px rgba(11,92,56,.9),0 0 100px rgba(200,148,12,.4);} }

    /* flip */
    .flip { perspective:1400px; cursor:pointer; }
    .flip-inner { position:relative; width:100%; height:100%; transition:transform .6s cubic-bezier(.4,.2,.2,1); transform-style:preserve-3d; }
    .flip:hover .flip-inner { transform:rotateY(180deg); }
    .flip-f,.flip-b { position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:16px; overflow:hidden; }
    .flip-b { transform:rotateY(180deg); }

    /* nav link hover */
    .nav-link { transition:color .2s; }
    .nav-link:hover { color:#0B5C38 !important; }

    /* btn */
    .btn-primary { background:linear-gradient(135deg,#0B5C38,#0d7043); color:#fff; padding:16px 44px; border-radius:10px; font-size:16px; font-weight:700; text-decoration:none; display:inline-block; transition:transform .2s,box-shadow .2s; box-shadow:0 8px 28px rgba(11,92,56,.38); }
    .btn-primary:hover { transform:translateY(-2px); box-shadow:0 14px 40px rgba(11,92,56,.48); }
    .btn-outline { background:transparent; border:1.5px solid rgba(15,25,35,.2); color:#0F1923; padding:16px 44px; border-radius:10px; font-size:16px; font-weight:600; text-decoration:none; display:inline-block; transition:border-color .2s,background .2s; }
    .btn-outline:hover { border-color:#0B5C38; background:rgba(11,92,56,.05); }

    /* lang toggle */
    .lang-btn { background:transparent; border:1.5px solid rgba(15,25,35,.2); color:#0F1923; padding:8px 18px; border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; font-family:'Cairo',sans-serif; transition:all .2s; letter-spacing:.06em; }
    .lang-btn:hover { border-color:#0B5C38; color:#0B5C38; }
    .lang-en .lang-btn { background:#0B5C38; border-color:#0B5C38; color:#fff; }
    /* dual-lang spans JS controls display directly */
    .en-t, .en-b { }
    /* marquee sliders */
    @keyframes marquee-mod-track { 0%{ transform:translateX(0) } 100%{ transform:translateX(-50%) } }
    @keyframes marquee-aud-track { 0%{ transform:translateX(0) } 100%{ transform:translateX(-50%) } }
    .flip { flex-shrink:0; }

    .mod-track::-webkit-scrollbar { display:none; }
    .mod-track { -ms-overflow-style:none; scrollbar-width:none; }

    /* ── MOBILE ── */
    @media (max-width: 768px) {
      #nawa-nav { padding: 14px 20px !important; }
      .nav-links { display: none !important; }
      .mob-menu-btn { display: flex !important; }
      .mob-menu { display: none; position: fixed; inset: 0; background: rgba(250,250,248,.97); backdrop-filter: blur(20px); z-index: 300; flex-direction: column; align-items: center; justify-content: center; gap: 32px; }
      .mob-menu.open { display: flex; }
      .mob-menu a { font-size: 22px; font-weight: 700; color: #0F1923; text-decoration: none; }
      #hero-inner { padding: 100px 24px 60px !important; }
      #hero-inner h1 { font-size: clamp(40px,12vw,72px) !important; }
      #platform, #audience, #how { padding: 60px 20px !important; }
      #pricing { padding: 60px 20px !important; }
      #pricing .price-grid { grid-template-columns: 1fr !important; }
      #contact > div { padding: 80px 24px !important; }
      footer { padding: 56px 20px 28px !important; }
      .footer-inner { flex-direction: column !important; gap: 32px !important; }
      .footer-links { gap: 32px !important; }
      .how-grid { flex-direction: column !important; }
      .about-grid { flex-direction: column !important; }
      .about-stats { flex-direction: column !important; gap: 24px !important; }
      .hero-btns { flex-direction: column !important; align-items: flex-start !important; }
      .hero-btns a { width: 100% !important; text-align: center !important; }
      .full-bleed-text { padding: 0 24px !important; }
      .full-bleed-text h2 { font-size: clamp(22px,7vw,36px) !important; }
    }
    @media (max-width: 480px) {
      #platform, #audience, #how, #pricing { padding: 48px 16px !important; }
    }
    /* lead form modal */
    #lead-modal { position:fixed; inset:0; z-index:400; display:none; align-items:center; justify-content:center; padding:24px; }
    #lead-modal.open { display:flex; }
    #lead-backdrop { position:absolute; inset:0; background:rgba(6,26,14,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
    #lead-card { position:relative; z-index:2; width:100%; max-width:560px; max-height:calc(100vh - 48px); overflow-y:auto; background:#FAFAF8; border-radius:18px; box-shadow:0 32px 90px rgba(0,0,0,.4); animation:fadeUp .35s ease both; }
    .lead-field { display:flex; flex-direction:column; gap:7px; }
    .lead-field label { font-size:13px; font-weight:700; color:rgba(15,25,35,.65); }
    .lead-field input { font-family:'Cairo',sans-serif; font-size:15px; color:#0F1923; background:#fff; border:1.5px solid rgba(11,92,56,.16); border-radius:9px; padding:13px 15px; transition:border-color .2s,box-shadow .2s; width:100%; }
    .lead-field input:focus { outline:none; border-color:#0B5C38; box-shadow:0 0 0 3px rgba(11,92,56,.1); }
    .lead-field input::placeholder { color:rgba(15,25,35,.3); }
    #lead-close { position:absolute; top:16px; inset-inline-end:16px; width:34px; height:34px; border:none; background:rgba(15,25,35,.06); border-radius:8px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; }
    #lead-close:hover { background:rgba(15,25,35,.12); }
    .social-ico { width:36px; height:36px; border:1px solid rgba(255,255,255,.14); border-radius:8px; display:flex; align-items:center; justify-content:center; transition:border-color .2s,background .2s; }
    .social-ico:hover { border-color:#C8940C; background:rgba(200,148,12,.1); }

    /* reveal */
    [data-reveal] { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
    [data-reveal].visible { opacity:1; transform:translateY(0); }
  
/* ---- additions from founders page ---- */
/* ============================================================
   NAWA — نواة التحوّل الرقمي  |  Theme styles
   Base design system (from approved design) + added animations
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
html { direction: rtl; scroll-behavior: smooth; }
body.nawa-body { background:#FAFAF8; color:#0F1923; font-family:'Cairo', system-ui, sans-serif; line-height:1.7; overflow-x:hidden; margin:0; }

/* ---------- keyframes (original) ---------- */
@keyframes fadeUp   { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn   { from { opacity:0; } to { opacity:1; } }
@keyframes float    { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);} }
@keyframes pulse-g  { 0%,100%{box-shadow:0 0 0 0 rgba(11,92,56,.3);} 70%{box-shadow:0 0 0 14px rgba(11,92,56,0);} }
@keyframes spin-cw  { from{transform:translate(-50%,-50%) rotate(0deg);} to{transform:translate(-50%,-50%) rotate(360deg);} }
@keyframes spin-ccw { from{transform:translate(-50%,-50%) rotate(0deg);} to{transform:translate(-50%,-50%) rotate(-360deg);} }
@keyframes nucleus-glow { 0%,100%{box-shadow:0 0 30px rgba(11,92,56,.6),0 0 60px rgba(200,148,12,.25);} 50%{box-shadow:0 0 50px rgba(11,92,56,.9),0 0 100px rgba(200,148,12,.4);} }
@keyframes marquee-mod-track { 0%{ transform:translateX(0) } 100%{ transform:translateX(-50%) } }
@keyframes marquee-aud-track { 0%{ transform:translateX(0) } 100%{ transform:translateX(-50%) } }

/* ---------- keyframes (ADDED animations) ---------- */
@keyframes nawa-logo-spin { to { transform:rotate(360deg); } }
@keyframes nawa-bob { 0%,100%{ transform:translateY(0); opacity:.4;} 50%{ transform:translateY(6px); opacity:.9;} }
@keyframes nawa-shine { 0%{ background-position:-160% 0;} 100%{ background-position:260% 0;} }
@keyframes nawa-pop { 0%{ transform:scale(.9); opacity:0;} 100%{ transform:scale(1); opacity:1;} }
@keyframes nawa-badge-pulse { 0%,100%{ box-shadow:0 0 0 0 rgba(200,148,12,.5);} 70%{ box-shadow:0 0 0 10px rgba(200,148,12,0);} }

/* logo inside hero core keeps rotating gently */
.nawa-logo-spin { animation: nawa-logo-spin 26s linear infinite; }
/* scroll cue */
.nawa-bob { animation: nawa-bob 2.4s ease-in-out infinite; }

/* ---------- flip cards ---------- */
.flip { perspective:1400px; cursor:pointer; flex-shrink:0; }
.flip-inner { position:relative; width:100%; height:100%; transition:transform .6s cubic-bezier(.4,.2,.2,1); transform-style:preserve-3d; }
.flip:hover .flip-inner { transform:rotateY(180deg); }
.flip-f,.flip-b { position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:16px; overflow:hidden; }
.flip-b { transform:rotateY(180deg); }

/* ---------- nav / buttons ---------- */
.nav-link { transition:color .2s; }
.nav-link:hover { color:#0B5C38 !important; }
.btn-primary { background:linear-gradient(135deg,#0B5C38,#0d7043); color:#fff; padding:16px 44px; border-radius:10px; font-size:16px; font-weight:700; text-decoration:none; display:inline-block; transition:transform .2s,box-shadow .2s; box-shadow:0 8px 28px rgba(11,92,56,.38); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 14px 40px rgba(11,92,56,.48); }
.btn-outline { background:transparent; border:1.5px solid rgba(15,25,35,.2); color:#0F1923; padding:16px 44px; border-radius:10px; font-size:16px; font-weight:600; text-decoration:none; display:inline-block; transition:border-color .2s,background .2s; }
.btn-outline:hover { border-color:#0B5C38; background:rgba(11,92,56,.05); }
.lang-btn { background:transparent; border:1.5px solid rgba(15,25,35,.2); color:#0F1923; padding:8px 18px; border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; font-family:'Cairo',sans-serif; transition:all .2s; letter-spacing:.06em; }
.lang-btn:hover { border-color:#0B5C38; color:#0B5C38; }

/* nav logo micro-motion */
#nawa-nav a > svg { transition:transform .5s ease; }
#nawa-nav a:hover > svg { transform:rotate(-12deg) scale(1.06); }

.mod-track::-webkit-scrollbar { display:none; }
.mod-track { -ms-overflow-style:none; scrollbar-width:none; }

/* ---------- dual-language (Arabic first; English on LTR / .nawa-en) ---------- */
/* Arabic shown by default */
.ar-t { display:inline; }
.ar-b { display:block; }
.en-t, .en-b { display:none; }
/* When English is active, hide Arabic and show English */
[dir="ltr"] .ar-t, .nawa-en .ar-t { display:none !important; }
[dir="ltr"] .ar-b, .nawa-en .ar-b { display:none !important; }
[dir="ltr"] .en-t, .nawa-en .en-t { display:inline !important; }
[dir="ltr"] .en-b, .nawa-en .en-b { display:block !important; }

/* ---------- ADDED: hover lift on content cards ---------- */
#nawa-root [data-reveal][data-delay]{ transition:transform .35s ease, box-shadow .35s ease; }
#nawa-root [data-reveal][data-delay]:hover{ transform:translateY(-5px); box-shadow:0 18px 44px rgba(11,92,56,.13); }
/* pricing cards lift a touch more */
#pricing .price-grid > div{ transition:transform .35s ease, box-shadow .35s ease; }
#pricing .price-grid > div:hover{ transform:translateY(-8px); }
/* "most popular" badge pulse */
#pricing .price-grid > div > div:first-child { }

/* mobile menu hidden by default on all sizes (shown via .open on mobile) */
.mob-menu { display:none; }

/* ---------- lead modal ---------- */
#lead-modal { position:fixed; inset:0; z-index:400; display:none; align-items:center; justify-content:center; padding:24px; }
#lead-modal.open { display:flex; }
#lead-backdrop { position:absolute; inset:0; background:rgba(6,26,14,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
#lead-card { position:relative; z-index:2; width:100%; max-width:560px; max-height:calc(100vh - 48px); overflow-y:auto; background:#FAFAF8; border-radius:18px; box-shadow:0 32px 90px rgba(0,0,0,.4); animation:fadeUp .35s ease both; }
.lead-field { display:flex; flex-direction:column; gap:7px; }
.lead-field label { font-size:13px; font-weight:700; color:rgba(15,25,35,.65); }
.lead-field input { font-family:'Cairo',sans-serif; font-size:15px; color:#0F1923; background:#fff; border:1.5px solid rgba(11,92,56,.16); border-radius:9px; padding:13px 15px; transition:border-color .2s,box-shadow .2s; width:100%; }
.lead-field input:focus { outline:none; border-color:#0B5C38; box-shadow:0 0 0 3px rgba(11,92,56,.1); }
.lead-field input::placeholder { color:rgba(15,25,35,.3); }
#lead-close { position:absolute; top:16px; inset-inline-end:16px; width:34px; height:34px; border:none; background:rgba(15,25,35,.06); border-radius:8px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; }
#lead-close:hover { background:rgba(15,25,35,.12); }
.social-ico { width:36px; height:36px; border:1px solid rgba(255,255,255,.14); border-radius:8px; display:flex; align-items:center; justify-content:center; transition:border-color .2s,background .2s,transform .2s; }
.social-ico:hover { border-color:#C8940C; background:rgba(200,148,12,.1); transform:translateY(-3px); }

/* ---------- reveal ---------- */
[data-reveal] { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
[data-reveal].visible { opacity:1; transform:translateY(0); }

/* ---------- mobile ---------- */
@media (max-width: 768px) {
  #nawa-nav { padding: 14px 20px !important; }
  .nav-links { display: none !important; }
  .mob-menu-btn { display: flex !important; }
  .mob-menu { display: none; position: fixed; inset: 0; background: rgba(250,250,248,.97); backdrop-filter: blur(20px); z-index: 300; flex-direction: column; align-items: center; justify-content: center; gap: 32px; }
  .mob-menu.open { display: flex; animation: fadeIn .25s ease; }
  .mob-menu a { font-size: 22px; font-weight: 700; color: #0F1923; text-decoration: none; }
  #hero-inner { padding: 100px 24px 60px !important; }
  #platform, #audience, #how, #about { padding: 60px 20px !important; }
  #pricing { padding: 60px 20px !important; }
  #pricing .price-grid { grid-template-columns: 1fr !important; }
  #contact > div { padding: 80px 24px !important; }
  footer { padding: 56px 20px 28px !important; }
  .footer-inner { flex-direction: column !important; gap: 32px !important; }
  .how-grid { flex-direction: column !important; }
  .about-grid { flex-direction: column !important; }
  .hero-btns { flex-direction: column !important; align-items: flex-start !important; }
  .hero-btns a { width: 100% !important; text-align: center !important; }
}
@media (max-width: 480px) {
  #platform, #audience, #how, #about, #pricing { padding: 48px 16px !important; }
}

/* =========================================================
   ADDED ANIMATIONS — round 2
   ========================================================= */
@keyframes nawa-grad  { 0%{background-position:0% 50%;} 50%{background-position:100% 50%;} 100%{background-position:0% 50%;} }
@keyframes nawa-float2 { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-8px);} }
@keyframes nawa-badge-blink { 0%,100%{box-shadow:0 0 0 0 rgba(200,148,12,.55);} 70%{box-shadow:0 0 0 12px rgba(200,148,12,0);} }
@keyframes nawa-underline { from{width:0;} to{width:100%;} }

/* image hover zoom — any rounded/clipped image container */
[style*="overflow:hidden"] > img { transition: transform .7s cubic-bezier(.2,.6,.2,1); will-change: transform; }
[style*="overflow:hidden"]:hover > img { transform: scale(1.06); }

/* nav links: animated underline */
.nav-link { position: relative; }
.nav-link::after { content:""; position:absolute; bottom:-5px; inset-inline-end:0; width:0; height:2px; background:#0B5C38; border-radius:2px; transition:width .3s ease; }
.nav-link:hover::after { width:100%; }

/* primary buttons: living gradient + shine sweep */
.btn-primary { background-image: linear-gradient(135deg,#0B5C38,#0d7043,#0B5C38); background-size:200% 200%; animation: nawa-grad 7s ease infinite; position:relative; overflow:hidden; }
.btn-primary::after { content:""; position:absolute; top:0; inset-inline-start:-120%; width:60%; height:100%; background:linear-gradient(120deg,transparent,rgba(255,255,255,.28),transparent); transform:skewX(-20deg); transition:none; }
.btn-primary:hover::after { animation: nawa-shine .9s ease; }

/* "most popular" pricing badge pulse */
#pricing .price-grid > div > div:first-child[style*="C8940C"] { animation: nawa-badge-blink 2.6s ease-in-out infinite; }

/* founder / partner logo boxes gently float */
#founding-partner img[alt*="NAQLA"], #founding-partner img[alt*="نقلة"] { animation: nawa-float2 5s ease-in-out infinite; }

/* founder cards: image subtle zoom already covered; add shadow lift */
#team .grid, #team [data-reveal] { }

/* stat ribbon numbers pop when counting */
.nawa-count { display:inline-block; }

/* reduce motion */
@media (prefers-reduced-motion: reduce) {
  .nawa-logo-spin, .nawa-bob, .nawa-nucleus, #mod-track, #aud-track,
  .btn-primary, #founding-partner img { animation: none !important; }
  [style*="overflow:hidden"]:hover > img { transform: none; }
}

/* =========================================================
   v1.2.0 FIXES
   ========================================================= */

/* FIX 1 — Arabic dots detaching / floating above words.
   Negative letter-spacing breaks connected Arabic script and misplaces
   the nuqat (dots). Force normal tracking + a little more line-height on
   any Arabic text. English keeps its tight tracking. */
.ar-t, .ar-b,
[lang="ar"], [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3 {
  letter-spacing: normal !important;
}
#team-hero .ar-b, #hero-h1 .ar-b { line-height: 1.28 !important; }

/* FIX 2 — Elementor editor: scroll-reveal JS doesn't run reliably in the
   editor preview, leaving [data-reveal] text at opacity:0 while images show
   (looks like pics stacked on top of missing text). Force everything visible
   and neutralize entrance animations while editing. */
.elementor-editor-active [data-reveal],
body.elementor-editor-active [data-reveal] {
  opacity: 1 !important;
  transform: none !important;
}
.elementor-editor-active [style*="animation:fadeUp"],
.elementor-editor-active [style*="animation: fadeUp"],
.elementor-editor-active [style*="animation:fadeIn"],
.elementor-editor-active [style*="animation: fadeIn"] {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}