/* =========================================================
   HOME DARK MODE
   File: static/css/dark-mode/home-dark.css

   نسخه اصلاح‌شده:
   - بک‌گراند اصلی از dark-base.css / body می‌آید
   - سکشن‌ها دیگر بک‌گراند مشکی جدا نمی‌گیرند
   - Start Now grid حفظ می‌شود اما روی بک‌گراند اصلی سایت می‌نشیند
   ========================================================= */


/* ------------------------------
   General
------------------------------ */

[data-theme="dark"] body {
    background:
        radial-gradient(circle at 8% 0%, rgba(125, 167, 140, 0.13), transparent 32%),
        radial-gradient(circle at 92% 4%, rgba(217, 104, 104, 0.10), transparent 34%),
        radial-gradient(circle at 50% 38%, rgba(86, 182, 198, 0.08), transparent 42%),
        linear-gradient(135deg, #0f172a 0%, #020617 100%);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

[data-theme="dark"] .side-brand {
    color: rgba(248, 250, 252, 0.08);
}


/* ------------------------------
   HERO
------------------------------ */

[data-theme="dark"] .hero-box {
    background:
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        radial-gradient(circle at 18% 28%, rgba(217, 243, 255, 0.14), transparent 34%),
        radial-gradient(circle at 80% 70%, rgba(183, 189, 247, 0.10), transparent 38%),
        linear-gradient(135deg, rgba(17, 24, 39, 0.72) 0%, rgba(15, 23, 42, 0.58) 52%, rgba(2, 6, 23, 0.62) 100%);
    background-size: 42px 42px, 42px 42px, auto, auto, auto;
    border: 1px solid var(--dark-border);
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.30),
        inset 0 0 0 1px rgba(255, 255, 255, 0.035);
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
}

[data-theme="dark"] .hero-title span {
    color: var(--dark-text);
    text-shadow: 0 14px 42px rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .hero-text,
[data-theme="dark"] .choice-message,
[data-theme="dark"] .choice-message.typing,
[data-theme="dark"] .choice-message.active {
    color: var(--dark-muted);
}

[data-theme="dark"] .choice-btn {
    background: rgba(55, 65, 81, 0.82);
    color: #ffffff;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.26);
}

[data-theme="dark"] .choice-btn:hover {
    background: rgba(17, 24, 39, 0.92);
    color: #ffffff;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.34);
}

[data-theme="dark"] .phone-input {
    background: #ffffff;
    border-color: #dbeafe;
    color: #111827;
}

[data-theme="dark"] .phone-input::placeholder {
    color: #94a3b8;
}

[data-theme="dark"] .phone-input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 5px rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] .phone-btn {
    background: #bbf7d0;
    color: #14532d;
    box-shadow: 0 14px 28px rgba(20, 83, 45, 0.18);
}

[data-theme="dark"] .phone-btn:hover {
    background: #a7f3c0;
    color: #14532d;
    box-shadow: 0 18px 36px rgba(20, 83, 45, 0.24);
}

[data-theme="dark"] .phone-error {
    background: rgba(220, 38, 38, 0.14);
    border-color: rgba(220, 38, 38, 0.34);
    color: #fca5a5;
}

[data-theme="dark"] .orbit-ring {
    border-color: rgba(255, 255, 255, 0.13);
}

[data-theme="dark"] .orbit-ring::before {
    border-color: rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] .orbit-core-svg,
[data-theme="dark"] .tech-node svg {
    filter: drop-shadow(0 18px 26px rgba(0, 0, 0, 0.42));
}

[data-theme="dark"] .orbit-glow-one {
    background: rgba(37, 99, 235, 0.20);
}

[data-theme="dark"] .orbit-glow-two {
    background: rgba(236, 72, 153, 0.18);
}


/* ------------------------------
   SERVICES
------------------------------ */

[data-theme="dark"] .services-section {
    background: transparent;
}

[data-theme="dark"] .section-heading h2 {
    color: var(--dark-text);
}

[data-theme="dark"] .section-heading p {
    color: var(--dark-muted);
}

[data-theme="dark"] .service-card {
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.045), transparent 34%),
        linear-gradient(145deg, rgba(26, 35, 53, 0.78) 0%, rgba(17, 24, 39, 0.68) 58%, rgba(11, 18, 32, 0.72) 100%);
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow:
        0 24px 58px rgba(0, 0, 0, 0.28),
        inset 0 0 0 1px rgba(255, 255, 255, 0.025);
    backdrop-filter: blur(20px) saturate(150%);
    -webkit-backdrop-filter: blur(20px) saturate(150%);
}

[data-theme="dark"] .service-card:hover {
    transform: translateY(-8px);
    box-shadow:
        0 30px 70px rgba(0, 0, 0, 0.36),
        0 0 24px rgba(255, 255, 255, 0.04),
        inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

[data-theme="dark"] .service-card:nth-child(1) {
    --card-line: #f59e0b;
}

[data-theme="dark"] .service-card:nth-child(2) {
    --card-line: #ec4899;
}

[data-theme="dark"] .service-card:nth-child(3) {
    --card-line: #8b5e4a;
}

[data-theme="dark"] .service-card:nth-child(4) {
    --card-line: #14b8a6;
}

[data-theme="dark"] .service-card::before {
    opacity: 1;
    filter: drop-shadow(0 0 8px var(--card-line));
}

[data-theme="dark"] .service-icon {
    background: rgba(255, 255, 255, 0.10);
    color: #f8fafc;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

[data-theme="dark"] .service-card h3 {
    color: #f8fafc;
}

[data-theme="dark"] .service-card p {
    color: #cbd5e1;
}


/* ------------------------------
   WHY / REASON BANNER
------------------------------ */

[data-theme="dark"] .reason-banner {
    background:
        radial-gradient(circle at 15% 15%, rgba(255, 255, 255, 0.15), transparent 32%),
        linear-gradient(135deg, rgba(134, 155, 126, 0.94), rgba(95, 115, 88, 0.94));
}

[data-theme="dark"] .reason-banner h2,
[data-theme="dark"] .reason-column h3 {
    color: #ffffff;
}

[data-theme="dark"] .reason-column {
    background: rgba(255, 255, 255, 0.13);
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: none;
}

[data-theme="dark"] .reason-column-second {
    background: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .reason-item {
    border-top-color: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .reason-item span {
    background: #ffffff;
    color: #869B7E;
}

[data-theme="dark"] .reason-item p {
    color: rgba(255, 255, 255, 0.86);
}

[data-theme="dark"] .reason-more-btn {
    background: rgba(255, 255, 255, 0.94);
    color: #5f7358;
    box-shadow:
        0 18px 42px rgba(42, 56, 38, 0.18),
        inset 0 0 0 1px rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .reason-more-btn::before {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.95),
        rgba(238, 246, 234, 0.92)
    );
}

[data-theme="dark"] .reason-more-btn::after {
    background: linear-gradient(
        120deg,
        transparent,
        rgba(134, 155, 126, 0.18),
        transparent
    );
}

[data-theme="dark"] .reason-more-btn:hover {
    color: #4f6349;
    box-shadow:
        0 24px 54px rgba(42, 56, 38, 0.24),
        inset 0 0 0 1px rgba(255, 255, 255, 0.95);
}


/* ------------------------------
   REVIEWS
------------------------------ */

[data-theme="dark"] .reviews-section {
    background: transparent;
}

[data-theme="dark"] .reviews-heading h2 {
    color: var(--dark-text);
}

[data-theme="dark"] .reviews-heading p {
    color: var(--dark-muted);
}

[data-theme="dark"] .review-card {
    background:
        radial-gradient(
            circle at bottom right,
            rgba(var(--review-rgb), 0.28) 0%,
            rgba(var(--review-rgb), 0.15) 34%,
            transparent 68%
        ),
        linear-gradient(
            145deg,
            rgba(var(--review-rgb), 0.18) 0%,
            rgba(17, 24, 39, 0.78) 56%,
            rgba(2, 6, 23, 0.82) 100%
        );
    border-color: rgba(var(--review-rgb), 0.58);
    box-shadow:
        0 26px 66px rgba(0, 0, 0, 0.30),
        inset 0 0 0 1px rgba(255, 255, 255, 0.035);
    backdrop-filter: blur(22px) saturate(150%);
    -webkit-backdrop-filter: blur(22px) saturate(150%);
}

[data-theme="dark"] .review-card::before {
    color: rgba(var(--review-rgb), 0.24);
}

[data-theme="dark"] .review-card::after {
    background: radial-gradient(
        circle at bottom right,
        rgba(var(--review-rgb), 0.34) 0%,
        rgba(var(--review-rgb), 0.18) 28%,
        rgba(var(--review-rgb), 0.08) 48%,
        rgba(var(--review-rgb), 0) 72%
    );
}

[data-theme="dark"] .review-card:hover {
    border-color: rgba(var(--review-rgb), 0.82);
    box-shadow:
        0 34px 78px rgba(0, 0, 0, 0.38),
        0 0 34px rgba(var(--review-rgb), 0.12);
}

[data-theme="dark"] .review-card p {
    color: #dbeafe;
}

[data-theme="dark"] .review-user {
    border-top-color: rgba(var(--review-rgb), 0.28);
}

[data-theme="dark"] .review-user strong {
    color: #f8fafc;
}

[data-theme="dark"] .review-user span {
    color: #b6c2d4;
}

[data-theme="dark"] .review-dot {
    background: rgba(255, 255, 255, 0.24);
}

[data-theme="dark"] .review-dot:hover {
    background: rgba(255, 255, 255, 0.34);
}

[data-theme="dark"] .review-dot.active {
    background: #facc15;
}


/* ------------------------------
   SHOAR BANNER
------------------------------ */

[data-theme="dark"] .shoar-banner-section {
    background: transparent;
}

[data-theme="dark"] .shoar-tag-track span {
    color: rgba(200, 210, 235, 0.30);
}

[data-theme="dark"] .shoar-tag-track span:nth-child(3n) {
    color: rgba(95, 93, 210, 0.34);
}

[data-theme="dark"] .shoar-tag-track span:nth-child(4n) {
    color: rgba(255, 84, 190, 0.30);
}

[data-theme="dark"] .shoar-tag-track span:nth-child(5n) {
    color: rgba(50, 145, 235, 0.34);
}


/* ------------------------------
   DOMAIN CHECK
------------------------------ */

[data-theme="dark"] .domain-check-section {
    background: transparent;
}

[data-theme="dark"] .domain-check-box {
    background:
        radial-gradient(circle at top left, rgba(87, 106, 143, 0.30) 0%, rgba(87, 106, 143, 0.14) 28%, transparent 54%),
        radial-gradient(circle at bottom right, rgba(183, 189, 247, 0.28) 0%, rgba(183, 189, 247, 0.16) 34%, transparent 60%),
        linear-gradient(135deg, rgba(17, 24, 39, 0.76) 0%, rgba(15, 23, 42, 0.66) 55%, rgba(2, 6, 23, 0.72) 100%);
    border: 1px solid rgba(183, 189, 247, 0.18);
    box-shadow:
        0 30px 80px rgba(0, 0, 0, 0.34),
        inset 0 0 0 1px rgba(255, 255, 255, 0.035);
    backdrop-filter: blur(24px) saturate(150%);
    -webkit-backdrop-filter: blur(24px) saturate(150%);
}

[data-theme="dark"] .domain-check-box::before {
    display: none;
}

[data-theme="dark"] .domain-check-badge {
    background: rgba(183, 189, 247, 0.12);
    border: 1px solid rgba(183, 189, 247, 0.26);
    color: #c7cdfb;
    box-shadow: 0 12px 30px rgba(87, 106, 143, 0.20);
}

[data-theme="dark"] .domain-check-badge::before {
    border-color: rgba(183, 189, 247, 0.32);
    box-shadow:
        0 0 0 4px rgba(183, 189, 247, 0.08),
        0 0 34px rgba(183, 189, 247, 0.16);
}

[data-theme="dark"] .domain-check-content h2,
[data-theme="dark"] .domain-suggestions-header h3,
[data-theme="dark"] .domain-suggestion-card strong {
    color: #f8fafc;
}

[data-theme="dark"] .domain-check-content p,
[data-theme="dark"] .domain-example,
[data-theme="dark"] .domain-suggestions-header p,
[data-theme="dark"] .domain-suggestion-hint,
[data-theme="dark"] .domain-suggestion-card p {
    color: #cbd5e1;
}

[data-theme="dark"] .domain-example span,
[data-theme="dark"] .domain-gift-popup p span {
    color: #b7bdf7;
}

[data-theme="dark"] .domain-input {
    background: rgba(2, 6, 23, 0.72);
    border: 1px solid rgba(183, 189, 247, 0.18);
    color: #f8fafc;
    box-shadow:
        0 14px 34px rgba(0, 0, 0, 0.22),
        inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

[data-theme="dark"] .domain-input::placeholder {
    color: #94a3b8;
}

[data-theme="dark"] .domain-input:focus {
    border-color: rgba(183, 189, 247, 0.42);
    box-shadow:
        0 0 0 5px rgba(183, 189, 247, 0.12),
        0 18px 42px rgba(0, 0, 0, 0.26);
}

[data-theme="dark"] .domain-check-btn,
[data-theme="dark"] .domain-category-btn.active,
[data-theme="dark"] .domain-check-small-btn,
[data-theme="dark"] .domain-gift-popup-btn {
    background: linear-gradient(135deg, #576A8F 0%, #B7BDF7 100%);
    color: #ffffff;
    box-shadow: 0 16px 34px rgba(87, 106, 143, 0.26);
}

[data-theme="dark"] .domain-check-btn:hover,
[data-theme="dark"] .domain-check-small-btn:hover,
[data-theme="dark"] .domain-gift-popup-btn:hover {
    box-shadow: 0 20px 44px rgba(183, 189, 247, 0.26);
}

[data-theme="dark"] .domain-category-btn {
    background: rgba(255, 255, 255, 0.07);
    color: #c7cdfb;
    box-shadow: inset 0 0 0 1px rgba(183, 189, 247, 0.16);
}

[data-theme="dark"] .domain-category-btn:hover {
    background: rgba(255, 255, 255, 0.11);
}

[data-theme="dark"] .domain-suggestions-icon {
    background: rgba(183, 189, 247, 0.12);
    color: #b7bdf7;
}

[data-theme="dark"] .domain-suggestion-card {
    background:
        radial-gradient(circle at bottom left, rgba(183, 189, 247, 0.12), transparent 45%),
        rgba(17, 24, 39, 0.72);
    border: 1px solid rgba(183, 189, 247, 0.14);
}

[data-theme="dark"] .domain-suggestion-card::before {
    background: rgba(183, 189, 247, 0.13);
}

[data-theme="dark"] .domain-suggestion-card:hover {
    border-color: rgba(183, 189, 247, 0.28);
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .domain-suggestion-card-top span {
    background: rgba(183, 189, 247, 0.11);
    color: #c7cdfb;
}

[data-theme="dark"] .domain-use-btn {
    background: rgba(183, 189, 247, 0.12);
    color: #c7cdfb;
}

[data-theme="dark"] .domain-gift-trigger {
    background: linear-gradient(135deg, rgba(87, 106, 143, 0.20), rgba(183, 189, 247, 0.24));
    color: #c7cdfb;
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.34),
        inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}


/* ------------------------------
   START NOW
------------------------------ */

[data-theme="dark"] .start-now-section {
    background-color: transparent;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.040) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.040) 1px, transparent 1px),
        radial-gradient(circle at 50% 28%, rgba(86, 182, 198, 0.10), transparent 38%),
        radial-gradient(circle at 80% 55%, rgba(183, 163, 227, 0.08), transparent 36%);
    background-size: 52px 52px, 52px 52px, auto, auto;
    background-repeat: repeat, repeat, no-repeat, no-repeat;
}

[data-theme="dark"] .start-now-title {
    color: var(--dark-text);
}

[data-theme="dark"] .start-now-content p {
    color: var(--dark-muted);
}

[data-theme="dark"] .design-site {
    color: #7DA78C;
}

[data-theme="dark"] .redesign-site {
    color: #F96E5B;
}

[data-theme="dark"] .wordpress-site {
    color: #D96868;
}

[data-theme="dark"] .logo-design {
    color: #744577;
}

[data-theme="dark"] .banner-design {
    color: #547792;
}

[data-theme="dark"] .start-now-btn {
    background: #D6DAC8;
    color: #5f6652;
    box-shadow: 0 18px 44px rgba(214, 218, 200, 0.32);
}

[data-theme="dark"] .start-now-btn:hover {
    background: #c8ceb8;
    color: #515744;
    box-shadow:
        0 0 0 14px rgba(214, 218, 200, 0.18),
        0 24px 58px rgba(214, 218, 200, 0.40);
}


/* ------------------------------
   CONTACT
------------------------------ */

[data-theme="dark"] .home-contact-section {
    --contact-dark: #f8fafc;
    --contact-text: #cbd5e1;
    --contact-muted: #94a3b8;
    --contact-border: rgba(255, 255, 255, 0.10);

    background:
        radial-gradient(circle at bottom right, rgba(111, 202, 198, 0.20), transparent 42%),
        linear-gradient(135deg, rgba(15, 23, 42, 0.36) 0%, rgba(2, 6, 23, 0.28) 100%);
}

[data-theme="dark"] .home-contact-title {
    color: var(--contact-accent);
}

[data-theme="dark"] .home-contact-description {
    color: var(--dark-muted);
}

[data-theme="dark"] .home-contact-badge {
    background: rgba(111, 202, 198, 0.10);
    border-color: rgba(111, 202, 198, 0.42);
    color: var(--contact-accent);
}

[data-theme="dark"] .home-contact-badge-icon {
    background: rgba(111, 202, 198, 0.14);
    color: var(--contact-accent);
}

[data-theme="dark"] .home-contact-method {
    background: rgba(17, 24, 39, 0.72);
    border-color: rgba(255, 255, 255, 0.10);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);
}

[data-theme="dark"] .home-contact-method:hover,
[data-theme="dark"] .home-contact-method[open] {
    background: rgba(17, 24, 39, 0.86);
    border-color: rgba(111, 202, 198, 0.42);
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.30);
}

[data-theme="dark"] .home-contact-method-label {
    color: var(--contact-accent);
}

[data-theme="dark"] .home-contact-method-preview {
    color: var(--dark-soft-muted);
}

[data-theme="dark"] .home-contact-method:hover .home-contact-method-preview,
[data-theme="dark"] .home-contact-method[open] .home-contact-method-preview {
    color: var(--dark-muted);
}

[data-theme="dark"] .home-contact-method-body {
    border-top-color: rgba(255, 255, 255, 0.10);
}

[data-theme="dark"] .home-contact-method-body p {
    color: var(--dark-muted);
}

[data-theme="dark"] .home-contact-action-pill {
    background: var(--contact-accent-soft);
    border-color: var(--contact-accent-border);
    color: var(--contact-accent);
}

[data-theme="dark"] .home-contact-action-pill:hover {
    background: var(--contact-accent);
    border-color: var(--contact-accent);
    color: #ffffff;
}


/* ------------------------------
   POPUPS
------------------------------ */

[data-theme="dark"] .lead-popup-overlay,
[data-theme="dark"] .domain-gift-popup-overlay {
    background: rgba(2, 6, 23, 0.72);
}

[data-theme="dark"] .lead-popup {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.94)),
        linear-gradient(135deg, rgba(187, 247, 208, 0.36), rgba(219, 234, 254, 0.36));
    border: 1px solid rgba(255, 255, 255, 0.88);
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.34),
        inset 0 0 0 1px rgba(15, 23, 42, 0.03);
}

[data-theme="dark"] .lead-popup h3 {
    color: #111827;
}

[data-theme="dark"] .lead-popup p {
    color: #475569;
}

[data-theme="dark"] .lead-popup-close {
    background: rgba(15, 23, 42, 0.06);
    color: #111827;
}

[data-theme="dark"] .lead-popup-btn {
    background: #374151;
    color: #ffffff;
}

[data-theme="dark"] .lead-popup-btn:hover {
    background: #111827;
}

[data-theme="dark"] .domain-gift-popup {
    background:
        radial-gradient(circle at bottom left, rgba(183, 189, 247, 0.12), transparent 44%),
        linear-gradient(135deg, rgba(17, 24, 39, 0.88) 0%, rgba(2, 6, 23, 0.92) 100%);
    border: 1px solid rgba(183, 189, 247, 0.16);
    box-shadow:
        0 26px 80px rgba(0, 0, 0, 0.38),
        inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .domain-gift-popup h4 {
    color: #f8fafc;
}

[data-theme="dark"] .domain-gift-popup p {
    color: #cbd5e1;
}

[data-theme="dark"] .domain-gift-popup-close {
    background: rgba(183, 189, 247, 0.10);
    color: #c7cdfb;
}

[data-theme="dark"] .domain-gift-popup-note {
    background: rgba(183, 189, 247, 0.12);
    color: #c7cdfb;
}


/* ------------------------------
   Mobile
------------------------------ */

@media (max-width: 620px) {
    [data-theme="dark"] .hero-box {
        background:
            linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
            linear-gradient(135deg, rgba(17, 24, 39, 0.72) 0%, rgba(2, 6, 23, 0.64) 100%);
        background-size: 36px 36px, 36px 36px, auto;
    }

    [data-theme="dark"] .service-card,
    [data-theme="dark"] .review-card,
    [data-theme="dark"] .domain-check-box {
        box-shadow: 0 18px 46px rgba(0, 0, 0, 0.24);
    }

    [data-theme="dark"] .start-now-section {
        background-size: 38px 38px, 38px 38px, auto, auto;
    }
}