/* ============================================================
   التدريب التعاوني — أنماط خاصة بهذه الصفحة وحدها.
   المُحدِّدات مسبوقة بـcp- تجنّباً لأي تعارض مع site.css.
   ============================================================ */

.cp-open, .cp-benefits, .cp-tracks, .cp-programs, .cp-info, .cp-cta{ --cp-pad: clamp(46px, 4.8vw, 74px); }
.cp-inner, .cp-open-inner{max-width:1180px; margin:0 auto;}

.cp-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-head); font-size:11.5px; font-weight:700;
  color:var(--teal); background:var(--mint-pale);
  border:1px solid rgba(31,120,116,.16); padding:6px 15px; border-radius:999px;
}
.cp-eyebrow::before{content:''; width:5px; height:5px; border-radius:50%; background:var(--teal);}
.cp-eyebrow-light{color:var(--mint); background:rgba(179,222,202,.10); border-color:rgba(179,222,202,.24);}
.cp-eyebrow-light::before{background:var(--mint);}
.cp-head{margin-bottom:clamp(24px,2.8vw,36px); max-width:70ch;}
.cp-head h2{
  font-family:var(--font-head); color:var(--navy);
  font-size:clamp(22px,2.6vw,32px); font-weight:800; line-height:1.3; margin-top:13px;
}
.cp-head-light h2{color:#fff;}
.cp-head-lede{margin-top:12px; font-size:15px; line-height:1.9; color:#4b5f72;}
.cp-head-lede p{margin:0;}

/* ---------- الافتتاحية ---------- */
.cp-open{
  position:relative; overflow:hidden; isolation:isolate; text-align:center;
  background:linear-gradient(152deg, #04203A 0%, var(--navy) 52%, #0B3A5E 100%);
  color:#fff; padding:clamp(84px,8.6vw,126px) 28px clamp(50px,5.2vw,72px);
}
.cp-open-bg{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(58% 76% at 86% 8%, rgba(44,148,142,.28), transparent 60%),
    radial-gradient(46% 62% at 8% 96%, rgba(65,127,193,.18), transparent 62%);
}
.cp-kicker{
  display:inline-block; font-family:var(--font-head); font-size:12.5px; font-weight:700;
  color:var(--mint); background:rgba(179,222,202,.10);
  border:1px solid rgba(179,222,202,.22); padding:7px 16px; border-radius:999px; margin-bottom:18px;
}
.cp-open h1{
  font-family:var(--font-head); font-weight:800; color:#fff;
  font-size:clamp(26px,3.7vw,45px); line-height:1.25; letter-spacing:-.5px;
  max-width:20ch; margin-inline:auto; text-wrap:balance;
}
.cp-lede{
  margin:16px auto 0; max-width:66ch;
  font-size:clamp(14.5px,1.3vw,16.5px); line-height:1.85; color:rgba(255,255,255,.78);
}
.cp-lede p{margin:0;}
.cp-open-actions{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:28px;
}
.cp-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 30px; border-radius:999px; font-weight:700; font-size:14.5px; color:#fff;
  border:1px solid rgba(255,255,255,.24);
  transition:background .3s ease, transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease;
}
.cp-btn.is-primary{background:linear-gradient(120deg, var(--teal), var(--teal-soft)); border-color:transparent;}
.cp-btn:hover{transform:translateY(-2px); box-shadow:0 16px 30px -14px rgba(31,120,116,.6);}
.cp-btn svg{width:16px; height:16px; transition:transform .35s cubic-bezier(.16,1,.3,1);}
.cp-btn:hover svg{transform:translateX(-4px);}
.cp-mail{
  font-family:'Roboto',sans-serif; font-size:14px; color:var(--mint);
  border-bottom:1px solid rgba(179,222,202,.4); padding-bottom:2px;
  transition:color .25s ease, border-color .25s ease;
}
.cp-mail:hover{color:#fff; border-color:#fff;}

.cp-supervisor{
  display:inline-flex; align-items:center; gap:11px; margin-top:26px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.13);
  border-radius:999px; padding:9px 18px 9px 12px;
}
.cp-sup-ic{
  width:32px; height:32px; border-radius:50%; flex-shrink:0;
  background:rgba(179,222,202,.12); color:var(--mint);
  display:flex; align-items:center; justify-content:center;
}
.cp-sup-ic svg{width:16px; height:16px;}
.cp-supervisor b{font-family:var(--font-head); font-size:14px; font-weight:800; color:#fff;}
.cp-supervisor span{font-size:12.5px; color:rgba(255,255,255,.6);}

/* ---------- المزايا ---------- */
.cp-benefits{padding:var(--cp-pad) 28px;}
.cp-benefit-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px;
}
.cp-benefit-grid li{
  background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-sm);
  padding:26px 24px 28px; display:flex; flex-direction:column; gap:8px;
  transition:transform .42s cubic-bezier(.16,1,.3,1), box-shadow .42s ease, border-color .35s ease;
}
.cp-benefit-grid li:hover{transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:rgba(31,120,116,.3);}
.cp-benefit-ic{
  width:48px; height:48px; border-radius:50%; margin-bottom:8px;
  background:var(--mint-pale); color:var(--teal);
  display:flex; align-items:center; justify-content:center;
  transition:background .35s ease, color .35s ease, transform .45s cubic-bezier(.16,1,.3,1);
}
.cp-benefit-ic svg{width:22px; height:22px;}
.cp-benefit-grid li:hover .cp-benefit-ic{background:var(--teal); color:#fff; transform:translateY(-2px);}
.cp-benefit-grid b{font-family:var(--font-head); font-size:16.5px; font-weight:800; color:var(--navy); line-height:1.45;}
.cp-benefit-grid span{font-size:13.8px; line-height:1.8; color:#5d7285;}

/* ---------- مسارات التدريب ---------- */
.cp-tracks{padding:var(--cp-pad) 28px; background:linear-gradient(165deg, #06264A, var(--navy));}
.cp-track-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.10);
}
.cp-track-grid li{
  background:#06264A; padding:clamp(24px,2.6vw,32px);
  display:flex; flex-direction:column; gap:12px;
  transition:background .35s ease;
}
.cp-track-grid li:hover{background:#0a3457;}
.cp-track-num{
  font-family:'Roboto',sans-serif; font-size:12.5px; font-weight:800; letter-spacing:.5px;
  color:var(--teal); background:rgba(179,222,202,.12); border:1px solid rgba(179,222,202,.2);
  min-width:36px; height:26px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center; align-self:flex-start;
  color:var(--mint);
}
.cp-track-grid b{font-family:var(--font-head); font-size:16px; font-weight:800; color:#fff; line-height:1.5;}

/* ---------- برامج معلنة ---------- */
.cp-programs{padding:var(--cp-pad) 28px;}
.cp-prog-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr)); gap:16px;}
.cp-prog{
  background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-sm); padding:24px;
  display:flex; flex-direction:column; gap:10px;
  transition:transform .42s cubic-bezier(.16,1,.3,1), box-shadow .42s ease;
}
.cp-prog:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.cp-prog h3{font-family:var(--font-head); font-size:17px; font-weight:800; color:var(--navy); line-height:1.45;}
.cp-prog p{font-size:14px; line-height:1.85; color:#5d7285;}
.cp-prog-cta{
  margin-top:auto; align-self:flex-start; padding-top:8px;
  font-size:13.5px; font-weight:800; color:var(--teal);
  border-bottom:1px solid rgba(31,120,116,.35);
}

/* ---------- التقديم والتواصل ---------- */
.cp-info{padding:var(--cp-pad) 28px; background:var(--paper-tint);}
.cp-info-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px;}
.cp-info-card{
  background:#fff; border:1px solid var(--line); padding:24px 22px 26px;
  transition:transform .42s cubic-bezier(.16,1,.3,1), box-shadow .42s ease, border-color .35s ease;
}
.cp-info-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-sm); border-color:rgba(31,120,116,.3);}
.cp-info-ic{
  width:44px; height:44px; border-radius:50%; margin-bottom:14px;
  background:var(--mint-pale); color:var(--teal);
  display:flex; align-items:center; justify-content:center;
}
.cp-info-ic svg{width:20px; height:20px;}
.cp-info-card h3{
  font-family:var(--font-head); font-size:15.5px; font-weight:800; color:var(--navy);
  padding-bottom:11px; margin-bottom:11px; border-bottom:1px solid var(--line);
}
.cp-info-card ul{list-style:none; margin:0; padding:0;}
.cp-info-card li{
  position:relative; padding:7px 16px 7px 0; font-size:13.5px; line-height:1.7; color:#5d7285;
}
.cp-info-card li::before{
  content:''; position:absolute; inset-inline-start:0; top:15px;
  width:5px; height:5px; border-radius:50%; background:var(--teal-soft);
}
.cp-info-card a{color:var(--teal); font-weight:700; border-bottom:1px solid rgba(31,120,116,.3);}
.cp-info-card a:hover{color:var(--navy); border-color:var(--navy);}

/* ---------- الدعوة ---------- */
.cp-cta{padding:var(--cp-pad) 28px; background:linear-gradient(120deg, #0F5F5A, var(--teal) 60%, #24837D);}
.cp-cta-inner{display:flex; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap;}
.cp-cta h2{font-family:var(--font-head); color:#fff; font-size:clamp(19px,2.2vw,27px); font-weight:800; line-height:1.4;}
.cp-cta p{margin-top:9px; font-size:14.5px; line-height:1.8; color:rgba(255,255,255,.84); max-width:58ch;}
.cp-cta .cp-btn.is-primary{background:#fff; color:var(--teal); border-color:transparent;}
.cp-cta .cp-btn.is-primary:hover{box-shadow:0 16px 30px -14px rgba(0,0,0,.45);}

/* ---------- الحركة ---------- */
@media (prefers-reduced-motion: no-preference){
  [data-reveal] .cp-benefit-grid li,
  [data-reveal] .cp-track-grid li,
  [data-reveal] .cp-prog,
  [data-reveal] .cp-info-card{
    animation:cp-rise .66s cubic-bezier(.16,1,.3,1) both;
    animation-delay:calc(var(--i, 0) * 70ms);
    animation-play-state:paused;
  }
  [data-reveal].in-view .cp-benefit-grid li,
  [data-reveal].in-view .cp-track-grid li,
  [data-reveal].in-view .cp-prog,
  [data-reveal].in-view .cp-info-card{animation-play-state:running;}
  @keyframes cp-rise{from{opacity:0; translate:0 16px;} to{opacity:1; translate:0 0;}}
}

/* ---------- الاستجابة ---------- */
@media (max-width:620px){
  .cp-cta-inner{flex-direction:column; align-items:flex-start;}
  .cp-open-actions{flex-direction:column; align-items:stretch;}
  .cp-btn{width:100%;}
  .cp-supervisor{width:100%; justify-content:flex-start;}
}
