/**
 * Lahdod — Landing Page Styles: dc-landing
 * v5.3.0 — مستخرج من page-dc-landing.php (T3 Fix: إزالة inline CSS)
 * يُحمَّل فقط في الصفحة المخصصة له
 */

/* ═══ DC Design Tokens — يتوافق مع متغيرات البلاجن v5.2 ══════════ */
.dc-page {
    --dc-cyan:    var(--color-cyan, #00d4ff);
    --dc-violet:  var(--color-violet, #7c3aed);
    --dc-viol-l:  var(--color-violet-light, #a855f7);
    --dc-bg:      var(--color-bg-primary, #060d1f);
    --dc-surface: var(--color-bg-card, rgba(10,22,40,.7));
    --dc-border:  rgba(0,212,255,.15);
    --dc-bord-h:  rgba(0,212,255,.35);
    --dc-text:    var(--color-text, #e2e8f0);
    --dc-muted:   var(--color-text-muted, #94a3b8);
    --dc-glow-c:  rgba(0,212,255,.22);
    --dc-glow-v:  rgba(124,58,237,.22);
    --dc-r-md: 16px; --dc-r-lg: 24px; --dc-r-xl: 32px;
    --dc-tr: .2s ease; --dc-tr-m: .4s ease;
}
/* ═══ Typography from Customizer ════════════════════════════════════ */
.hero-title {
    font-size: <?php echo $title_size; ?>px !important;
    line-height: <?php echo $title_lh; ?> !important;
    letter-spacing: <?php echo $title_spacing; ?>px !important;
}
.hero-desc {
    font-size: <?php echo $desc_size; ?>px !important;
    line-height: <?php echo $desc_lh; ?> !important;
}
@media(max-width:768px){ .hero-title{ font-size:<?php echo $title_size_mob; ?>px !important; } }

/* ═══ Shared Helpers ═════════════════════════════════════════════════ */
.dc-sec { padding:100px 0; position:relative; 
    overflow-x: clip;
}
.dc-sec-alt { background:rgba(10,22,40,.45); border-top:1px solid var(--dc-border); border-bottom:1px solid var(--dc-border); }
.dc-wrap  { max-width:1200px; margin:0 auto; padding:0 24px; }
.dc-wrap-sm { max-width:820px; margin:0 auto; padding:0 24px; }
.dc-head  { text-align:center; margin-bottom:64px; }
/* tag pill */
.dc-tag { display:inline-flex;align-items:center;gap:8px;padding:7px 18px;border:1px solid var(--dc-border);border-radius:50px;background:rgba(0,212,255,.06);color:var(--dc-cyan);font-size:13px;font-weight:600;letter-spacing:.05em;margin-bottom:18px;backdrop-filter:blur(10px); }
.dc-tag-dot { width:6px;height:6px;border-radius:50%;background:var(--dc-cyan);box-shadow:0 0 8px var(--dc-cyan);animation:dc-pulse 2s ease infinite; }
/* headings */
.dc-h2 { font-size:clamp(28px,3.5vw,44px);font-weight:800;color:#fff;margin:0 0 14px;line-height:1.2;font-family:var(--font-heading,'Space Grotesk',sans-serif); }
.dc-h2 .grad { background:linear-gradient(135deg,var(--dc-cyan),var(--dc-viol-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.dc-sub { font-size:17px;color:var(--dc-muted);line-height:1.7;max-width:600px;margin:0 auto; }
/* glass card */
.dc-glass { background:var(--dc-surface);border:1px solid var(--dc-border);border-radius:var(--dc-r-xl);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);position:relative;overflow:hidden; }
.dc-glass::before { content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--dc-cyan),var(--dc-violet));border-radius:var(--dc-r-xl) var(--dc-r-xl) 0 0; }
/* buttons */
.dc-btn { display:inline-flex;align-items:center;gap:9px;padding:14px 28px;border-radius:50px;font-weight:700;font-size:15px;text-decoration:none;transition:all var(--dc-tr-m);white-space:nowrap; }
.dc-btn-p { background:linear-gradient(135deg,var(--dc-cyan),var(--dc-violet));color:#fff;box-shadow:0 4px 24px var(--dc-glow-c); }
.dc-btn-p:hover { transform:translateY(-3px);box-shadow:0 8px 36px var(--dc-glow-c);color:#fff; }
.dc-btn-o { border:1px solid var(--dc-border);color:var(--dc-cyan);background:transparent; }
.dc-btn-o:hover { border-color:var(--dc-cyan);background:rgba(0,212,255,.08);transform:translateY(-3px);color:#fff; }
/* animations */
@keyframes dc-pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(1.6)} }
@keyframes dc-float { 0%,100%{transform:perspective(900px) rotateY(-10deg) rotateX(4deg) translateY(0)} 50%{transform:perspective(900px) rotateY(-10deg) rotateX(4deg) translateY(-12px)} }
@keyframes dc-up    { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
.dc-up { animation:dc-up .7s ease both; }
.dc-up-1 { animation-delay:.1s; }
.dc-up-2 { animation-delay:.22s; }
.dc-up-3 { animation-delay:.34s; }

/* ═══ Hero ═══════════════════════════════════════════════════════════ */
.dc-hero { padding:120px 0 80px;min-height:92vh;display:flex;align-items:center;overflow:hidden; }
.dc-hero-inner { display:grid;grid-template-columns:1fr auto;gap:80px;align-items:center; }
.dc-hero-text { text-align:right; }
.dc-hero-badge { display:inline-flex;align-items:center;gap:10px;padding:8px 20px;border:1px solid var(--dc-border);border-radius:50px;background:rgba(0,212,255,.06);color:var(--dc-cyan);font-size:13px;font-weight:600;letter-spacing:.05em;margin-bottom:24px;backdrop-filter:blur(12px); }
.dc-badge-dot { width:7px;height:7px;border-radius:50%;background:var(--dc-cyan);box-shadow:0 0 10px var(--dc-cyan);animation:dc-pulse 2s ease infinite; }
.dc-hero-ctas { display:flex;gap:14px;flex-wrap:wrap;margin-top:36px; }
/* stats bar */
.dc-stats-row { display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:0;margin-top:72px;padding:28px 24px;border:1px solid var(--dc-border);border-radius:var(--dc-r-lg);backdrop-filter:blur(12px);background:rgba(0,212,255,.03);max-width:640px; }
.dc-stat { flex:1;min-width:110px;text-align:center;padding:14px 18px; }
.dc-stat-div { width:1px;height:44px;background:var(--dc-border);flex-shrink:0; }
.dc-stat-n { font-size:38px;font-weight:900;background:linear-gradient(135deg,var(--dc-cyan),var(--dc-viol-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;font-family:var(--font-heading,'Space Grotesk'); }
.dc-stat-l { font-size:13px;color:var(--dc-muted);margin-top:5px;font-weight:500; }

/* ═══ Mockup ══════════════════════════════════════════════════════════ */
.dc-mockup-wrap { flex-shrink:0;position:relative; }
.dc-mockup-glow { position:absolute;inset:-50px;background:radial-gradient(circle at 50% 50%,rgba(0,212,255,.1),transparent 70%);pointer-events:none;border-radius:50%; }
.dc-mockup { width:290px;background:rgba(8,18,38,.9);border:1px solid var(--dc-border);border-radius:28px;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.6),0 0 40px rgba(0,212,255,.07);backdrop-filter:blur(24px);position:relative;animation:dc-float 7s ease-in-out infinite; }
.dc-mockup-top { padding:28px 18px 36px;text-align:center;background:linear-gradient(160deg,rgba(0,212,255,.09),rgba(124,58,237,.11));position:relative;overflow:hidden; }
.dc-mockup-top::after { content:'';position:absolute;width:130px;height:130px;border-radius:50%;background:var(--dc-violet);filter:blur(48px);opacity:.14;top:-55px;right:-35px; }
.dc-mockup-av { width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,rgba(0,212,255,.15),rgba(124,58,237,.15));border:2px solid rgba(0,212,255,.4);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;color:var(--dc-cyan);margin:0 auto 10px;position:relative;z-index:1;box-shadow:0 0 18px rgba(0,212,255,.2); }
.dc-mockup-nm { color:#fff;font-size:15px;font-weight:800;margin:0 0 3px;position:relative;z-index:1; }
.dc-mockup-st { color:rgba(148,163,184,.8);font-size:10px;margin:0;position:relative;z-index:1; }
.dc-mockup-body { padding:16px 14px 18px; }
.dc-mockup-sv { background:linear-gradient(135deg,var(--dc-cyan),var(--dc-violet));color:#fff;border-radius:50px;padding:9px 14px;text-align:center;font-size:11px;font-weight:700;margin-bottom:12px;box-shadow:0 3px 14px rgba(0,212,255,.2); }
.dc-mockup-qa { display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:12px; }
.dc-mockup-qa-btn { background:rgba(255,255,255,.04);border:1px solid rgba(0,212,255,.1);border-radius:10px;padding:9px 6px;text-align:center;font-size:15px; }
.dc-mockup-lks { border-top:1px solid rgba(0,212,255,.08);padding-top:10px;display:flex;flex-direction:column;gap:6px; }
.dc-mockup-lk { display:flex;align-items:center;gap:9px;padding:7px 9px;background:rgba(255,255,255,.03);border:1px solid rgba(0,212,255,.07);border-radius:9px;font-size:10px;color:rgba(148,163,184,.75); }
.dc-mockup-lk-ic { width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;flex-shrink:0; }

/* ═══ Steps ═══════════════════════════════════════════════════════════ */
.dc-steps-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%, 260px), 1fr));gap:22px; }
.dc-step { padding:36px 28px;text-align:center;transition:transform var(--dc-tr-m),border-color var(--dc-tr); }
.dc-step:hover { transform:translateY(-8px);border-color:var(--dc-bord-h); }
.dc-step-num { position:absolute;top:-13px;right:26px;background:linear-gradient(135deg,var(--dc-cyan),var(--dc-viol-l));color:#060d1f;font-size:10px;font-weight:900;padding:4px 12px;border-radius:20px;letter-spacing:1.5px; }
.dc-step-ic  { font-size:46px;display:block;margin-bottom:16px;filter:drop-shadow(0 4px 10px rgba(0,212,255,.18)); }
.dc-step-h3  { font-size:18px;font-weight:700;color:#fff;margin:0 0 9px;font-family:var(--font-heading,'Space Grotesk'); }
.dc-step-p   { font-size:13px;color:var(--dc-muted);line-height:1.7;margin:0; }

/* ═══ Features ════════════════════════════════════════════════════════ */
.dc-feat-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%, 260px), 1fr));gap:18px; }
.dc-feat { padding:26px 22px;transition:transform var(--dc-tr-m),border-color var(--dc-tr); }
.dc-feat:hover { transform:translateY(-6px);border-color:var(--dc-bord-h);box-shadow:0 12px 40px rgba(0,0,0,.3); }
.dc-feat-ic { font-size:34px;display:block;margin-bottom:12px;filter:drop-shadow(0 3px 8px rgba(0,212,255,.15)); }
.dc-feat-h3 { font-size:15px;font-weight:700;color:#fff;margin:0 0 7px;font-family:var(--font-heading,'Space Grotesk'); }
.dc-feat-p  { font-size:13px;color:var(--dc-muted);line-height:1.65;margin:0; }

/* ═══ Pricing ═════════════════════════════════════════════════════════ */
.dc-price-wrap { display:flex;justify-content:center; }
.dc-price-card {
    max-width:600px;width:100%;padding:0;
    text-align:center;
    border-color:rgba(124,58,237,.45);
    box-shadow:0 0 100px rgba(124,58,237,.15), 0 0 40px rgba(0,212,255,.06), 0 24px 64px rgba(0,0,0,.5);
    overflow:visible !important; /* السماح لـ badge بالظهور فوق البطاقة */
    margin-top:16px; /* مساحة للـ badge */
}
/* Top: السعر */
.dc-price-top {
    padding:48px 48px 36px;
    background:linear-gradient(160deg,rgba(0,212,255,.06),rgba(124,58,237,.1));
    border-bottom:1px solid rgba(255,255,255,.06);
    position:relative;
}
/* Badge */
.dc-price-badge {
    position:absolute;top:-16px;left:50%;transform:translateX(-50%);
    background:linear-gradient(135deg,var(--dc-cyan),var(--dc-viol-l));
    color:#060d1f;font-size:12px;font-weight:900;
    padding:6px 28px;border-radius:50px;
    white-space:nowrap;letter-spacing:.04em;
    box-shadow:0 4px 20px rgba(0,212,255,.25);
}
/* Amount */
.dc-price-amt {
    font-size:84px;font-weight:900;line-height:1;
    background:linear-gradient(135deg,var(--dc-cyan),var(--dc-viol-l));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    font-family:var(--font-heading,'Space Grotesk');
    filter:drop-shadow(0 0 24px rgba(0,212,255,.3));
}
.dc-price-per { color:var(--dc-muted);font-size:15px;margin:8px 0 0; }
/* Bottom: المزايا */
.dc-price-bottom { padding:36px 48px 44px; }
.dc-price-ul {
    list-style:none;padding:0;margin:0 0 32px;
    text-align:right;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0;
}
.dc-price-ul li {
    display:flex;align-items:center;gap:10px;
    padding:11px 8px;
    border-bottom:1px solid rgba(255,255,255,.05);
    font-size:13.5px;color:var(--dc-text);
    line-height:1.4;
}
.dc-price-ul li:nth-child(odd)  { border-left:1px solid rgba(255,255,255,.05); padding-right:0; padding-left:16px; }
.dc-price-ul li:nth-child(even) { padding-right:16px; }
.dc-price-ul li .dc-check {
    width:20px;height:20px;border-radius:50%;
    background:rgba(0,212,255,.1);border:1px solid rgba(0,212,255,.25);
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;font-size:10px;color:var(--dc-cyan);font-weight:800;
}
.dc-price-note { font-size:12px;color:var(--dc-muted);margin-top:16px; }
@media(max-width:600px){
    .dc-price-ul { grid-template-columns:1fr; }
    .dc-price-ul li:nth-child(odd) { border-left:none;padding-left:0; }
    .dc-price-top,.dc-price-bottom { padding:36px 24px; }
}

/* ═══ Testimonials ════════════════════════════════════════════════════ */
.dc-testi-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%, 280px), 1fr));gap:18px; }
.dc-testi { padding:26px 22px;transition:transform var(--dc-tr-m),border-color var(--dc-tr); }
.dc-testi:hover { transform:translateY(-6px);border-color:var(--dc-bord-h); }
.dc-testi-stars { color:#f59e0b;font-size:14px;margin-bottom:12px;letter-spacing:2px; }
.dc-testi-txt { font-size:13.5px;color:var(--dc-muted);line-height:1.75;margin:0 0 18px;font-style:italic; }
.dc-testi-user { display:flex;align-items:center;gap:12px; }
.dc-testi-av { width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,rgba(0,212,255,.14),rgba(124,58,237,.14));border:2px solid var(--dc-border);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:var(--dc-cyan);flex-shrink:0;font-family:var(--font-heading,'Space Grotesk'); }
.dc-testi-nm { display:block;font-size:14px;font-weight:700;color:#fff; }
.dc-testi-jb { font-size:12px;color:var(--dc-muted); }

/* ═══ CTA ═════════════════════════════════════════════════════════════ */
.dc-cta-wrap { padding:100px 24px;text-align:center; }
.dc-cta-box { max-width:680px;margin:0 auto;padding:60px 48px; }
.dc-cta-h2 { font-size:clamp(26px,3.5vw,42px);font-weight:900;color:#fff;margin:0 0 14px;font-family:var(--font-heading,'Space Grotesk'); }
.dc-cta-p  { font-size:17px;color:var(--dc-muted);margin:0 0 34px;line-height:1.7; }
.dc-cta-btns { display:flex;gap:14px;justify-content:center;flex-wrap:wrap; }

/* ═══ Responsive ══════════════════════════════════════════════════════ */
@media(max-width:960px){
    .dc-hero-inner { grid-template-columns:1fr;gap:52px; }
    .dc-hero { min-height:auto;padding:80px 0 60px; }
    .dc-hero-text { text-align:center; }
    .dc-hero-ctas,.dc-hero-badge { justify-content:center; }
    .dc-mockup-wrap { display:flex;justify-content:center; }
    .dc-mockup { animation:none;transform:none !important; }
    .dc-stats-row { margin-left:0;margin-right:0; }
}
@media(max-width:520px){
    .dc-price-card,.dc-cta-box { padding:36px 22px; }
    .dc-sec { padding:72px 0; }
}
@media(max-width:480px){
    .dc-price-top,.dc-price-bottom { padding:28px 18px !important; }
    .dc-cta-box { padding:28px 18px !important; }
    .dc-hero { padding:90px 0 50px !important; }
    .dc-feat-grid,.dc-testi-grid { gap:14px !important; }
    .dc-sec { padding:60px 0 !important; }
}
@media(max-width:360px){
    .dc-price-top,.dc-price-bottom { padding:20px 12px !important; }
    .dc-cta-box { padding:20px 12px !important; }
}
