/* =========================================
   SECTION 1: HERO (Dark/Hosting Style)
   Parent Class: .pm-section-hero
   ========================================= */
.pm-section-hero {
    --pm-primary: #4f46e5;
    --pm-accent: #ec4899;
    --pm-dark: #0f172a;
    --pm-text: #f8fafc;
    --pm-text-muted: #94a3b8;
    --pm-glass: rgba(255, 255, 255, 0.05);
    --pm-border: rgba(255, 255, 255, 0.1);

    position: relative;
    background-color: var(--pm-dark);
    color: var(--pm-text);
    padding-top: 6rem; padding-bottom: 8rem;
    overflow: hidden; direction: rtl; font-family: inherit;
}
.pm-section-hero .pm-relative-z { position: relative; z-index: 2; }
.pm-section-hero .pm-hero-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; overflow: hidden; }
.pm-section-hero .pm-grid-pattern {
    position: absolute; width: 100%; height: 100%;
    background-image: linear-gradient(var(--pm-border) 1px, transparent 1px),
                      linear-gradient(90deg, var(--pm-border) 1px, transparent 1px);
    background-size: 40px 40px; opacity: 0.3;
    mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
}
.pm-section-hero .pm-glow-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.4; }
.pm-section-hero .orb-1 { width: 400px; height: 400px; background: var(--pm-primary); top: -100px; left: -100px; }
.pm-section-hero .orb-2 { width: 300px; height: 300px; background: var(--pm-accent); bottom: 20%; right: -50px; }
.pm-section-hero .pm-hero-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 3rem; align-items: center; }
.pm-section-hero .pm-trust-badge {
    display: inline-flex; align-items: center; gap: 8px; padding: 6px 16px;
    background: rgba(79, 70, 229, 0.15); border: 1px solid rgba(79, 70, 229, 0.3);
    border-radius: 50px; color: #818cf8; font-size: 0.9rem; font-weight: 500; margin-bottom: 1.5rem;
}
.pm-section-hero .pm-hero-title { font-size: 3.5rem; line-height: 1.2; font-weight: 800; margin-bottom: 1.5rem; color: #fff; }
.pm-section-hero .text-gradient {
    background: linear-gradient(135deg, #fff 0%, #818cf8 50%, #c084fc 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-section-hero .pm-hero-desc { font-size: 1.15rem; color: var(--pm-text-muted); line-height: 1.8; margin-bottom: 2.5rem; max-width: 90%; }
.pm-section-hero .pm-hero-desc strong { color: #fff; font-weight: 600; }
.pm-section-hero .pm-hero-actions { display: flex; gap: 1rem; margin-bottom: 2.5rem; }
.pm-section-hero .pm-btn { display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px; border-radius: 12px; font-weight: 600; font-size: 1rem; transition: all 0.3s ease; text-decoration: none; }
.pm-section-hero .pm-btn-primary { background: var(--pm-primary); color: #fff; box-shadow: 0 4px 20px rgba(79, 70, 229, 0.4); }
.pm-section-hero .pm-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(79, 70, 229, 0.6); }
.pm-section-hero .pm-btn-glass { background: rgba(255,255,255,0.05); color: #fff; border: 1px solid var(--pm-border); }
.pm-section-hero .pm-btn-glass:hover { background: rgba(255,255,255,0.1); }
.pm-section-hero .pm-social-proof { display: flex; align-items: center; gap: 15px; }
.pm-section-hero .pm-avatars { display: flex; }
.pm-section-hero .pm-avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--pm-dark); margin-left: -10px; background-color: #334155; background-size: cover; }
.pm-section-hero .av-1 { background-color: #fca5a5; }
.pm-section-hero .av-2 { background-color: #86efac; }
.pm-section-hero .av-3 { background-color: #93c5fd; }
.pm-section-hero .pm-proof-text { font-size: 0.9rem; color: var(--pm-text-muted); }
.pm-section-hero .pm-proof-text .highlight { color: #fff; font-weight: 700; }
.pm-section-hero .pm-hero-visual { position: relative; text-align: center; }
.pm-section-hero .pm-floating-img { width: 100%; max-width: 500px; height: auto; animation: pm-float 6s ease-in-out infinite; position: relative; z-index: 2; }
.pm-section-hero .visual-glow-back { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 300px; height: 300px; background: radial-gradient(circle, rgba(79,70,229,0.4) 0%, transparent 70%); z-index: 1; }
.pm-section-hero .pm-float-card { position: absolute; top: 20%; right: 0; background: rgba(15, 23, 42, 0.8); backdrop-filter: blur(10px); border: 1px solid var(--pm-border); padding: 12px 20px; border-radius: 12px; display: flex; align-items: center; gap: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); animation: pm-float 5s ease-in-out infinite reverse; }
.pm-section-hero .pm-float-card .icon { font-size: 1.5rem; }
.pm-section-hero .pm-float-card .text { display: flex; flex-direction: column; text-align: right; }
.pm-section-hero .pm-float-card .label { font-size: 0.75rem; color: var(--pm-text-muted); }
.pm-section-hero .pm-float-card .value { font-size: 1rem; font-weight: 700; color: #4ade80; }
@keyframes pm-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } }
.pm-section-hero .pm-glass-features { background: rgba(30, 41, 59, 0.7); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 20px; padding: 2rem; display: flex; justify-content: space-between; align-items: center; margin-top: -60px; position: relative; box-shadow: 0 20px 40px -5px rgba(0, 0, 0, 0.3); }
.pm-section-hero .pm-feature-item { display: flex; align-items: center; gap: 15px; flex: 1; justify-content: center; }
.pm-section-hero .pm-feat-icon { font-size: 2rem; background: rgba(255,255,255,0.05); width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 12px; }
.pm-section-hero .pm-feat-info h3 { font-size: 1.1rem; margin: 0 0 5px 0; color: #fff; }
.pm-section-hero .pm-feat-info p { font-size: 0.9rem; margin: 0; color: var(--pm-text-muted); }
.pm-section-hero .pm-feature-separator { width: 1px; height: 50px; background: var(--pm-border); }
@media (max-width: 992px) {
    .pm-section-hero .pm-hero-grid { grid-template-columns: 1fr; text-align: center; }
    .pm-section-hero .pm-hero-content { display: flex; flex-direction: column; align-items: center; }
    .pm-section-hero .pm-hero-title { font-size: 2.5rem; }
    .pm-section-hero .pm-hero-actions { justify-content: center; }
    .pm-section-hero .pm-glass-features { flex-direction: column; gap: 2rem; margin-top: 2rem; align-items: flex-start; }
    .pm-section-hero .pm-feature-item { justify-content: flex-start; width: 100%; }
    .pm-section-hero .pm-feature-separator { display: none; }
    .pm-section-hero .pm-float-card { display: none; }
}

/* =========================================
   SECTION 2: SERVICES (Light/Card Style)
   Parent Class: .pm-section-services
   ========================================= */
.pm-section-services {
    --bg-light: #f8fafc;
    --card-white: #ffffff;
    --text-dark: #1e293b;
    --text-gray: #64748b;
    --border-light: #e2e8f0;
    --c-blue: #0ea5e9;
    --c-purple: #8b5cf6;
    --c-gold: #f59e0b;
    --c-green: #10b981;

    background-color: var(--bg-light);
    padding: 6rem 0; position: relative; overflow: hidden; font-family: inherit;
}
.pm-section-services .mesh-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.6; pointer-events: none; }
.pm-section-services .mesh-orb { position: absolute; border-radius: 50%; filter: blur(80px); }
.pm-section-services .orb-1 { width: 600px; height: 600px; top: -200px; left: -100px; background: radial-gradient(circle, rgba(14, 165, 233, 0.08) 0%, transparent 70%); }
.pm-section-services .orb-2 { width: 500px; height: 500px; bottom: -100px; right: -100px; background: radial-gradient(circle, rgba(139, 92, 246, 0.08) 0%, transparent 70%); }
.pm-section-services .pm-relative-z { position: relative; z-index: 2; }
.pm-section-services .light-head { text-align: center; margin-bottom: 4rem; }
.pm-section-services .light-head .section-title { font-size: 2.5rem; font-weight: 800; color: var(--text-dark); margin-bottom: 2.5rem; letter-spacing: -1px; }
.pm-section-services .text-gradient { background: linear-gradient(135deg, #1e293b 0%, #475569 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.pm-section-services .light-head .section-subtitle { color: var(--text-gray); font-size: 1.1rem; }
.pm-section-services .cluster-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(min-content, max-content); gap: 2rem; max-width: 1200px; margin: 0 auto; }
.pm-section-services .service-card { background: var(--card-white); border-radius: 24px; padding: 2rem; position: relative; border: 1px solid white; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 10px 15px -3px rgba(0, 0, 0, 0.03); transition: all 0.4s ease; display: flex; flex-direction: column; overflow: hidden; }
.pm-section-services .service-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px -5px rgba(0, 0, 0, 0.08); border-color: rgba(255,255,255,0); }
.pm-section-services .service-card:hover .card-icon img { transform: scale(1.15) translateY(-10px) rotate(-3deg); filter: drop-shadow(0 25px 35px rgba(0,0,0,0.2)); }
.pm-section-services .featured-card { border: 2px solid rgba(139, 92, 246, 0.1); transform: scale(1.02); z-index: 2; }
.pm-section-services .featured-card:hover { transform: scale(1.02) translateY(-8px); }
.pm-section-services .card-decoration { position: absolute; top: 0; left: 0; width: 100%; height: 6px; }
.pm-section-services .deco-blue { background: linear-gradient(90deg, var(--c-blue), transparent); }
.pm-section-services .deco-purple { background: linear-gradient(90deg, var(--c-purple), transparent); }
.pm-section-services .deco-gold { background: linear-gradient(90deg, var(--c-gold), transparent); }
.pm-section-services .deco-green { background: linear-gradient(90deg, var(--c-green), transparent); }
.pm-section-services .card-badge { position: absolute; top: 1rem; left: 1rem; background: rgba(139, 92, 246, 0.1); color: var(--c-purple); font-size: 0.75rem; font-weight: 700; padding: 4px 10px; border-radius: 20px; }
.pm-section-services .card-icon { width: 160px; height: 160px; margin: -30px auto 1.5rem auto; background: radial-gradient(circle, rgba(255,255,255,0.8) 0%, transparent 70%); border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; z-index: 5; }
.pm-section-services .card-icon img { width: 130px; height: auto; object-fit: contain; filter: drop-shadow(0 15px 25px rgba(0,0,0,0.15)); transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.pm-section-services .card-body h3 { font-size: 1.4rem; font-weight: 800; color: var(--text-dark); margin-bottom: 0.5rem; }
.pm-section-services .seo-desc { color: var(--text-gray); font-size: 0.95rem; line-height: 1.6; margin-bottom: 2rem; }
.pm-section-services .seo-links-wrapper { margin-top: 1.5rem; }
.pm-section-services .link-head { display: block; font-size: 0.85rem; color: #94a3b8; margin-bottom: 0.8rem; font-weight: 600; }
.pm-section-services .link-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.pm-section-services .tag-link { display: inline-block; padding: 8px 14px; background-color: #f8fafc; border: 1px solid var(--border-light); border-radius: 10px; color: #475569; font-size: 0.9rem; font-weight: 500; text-decoration: none; transition: all 0.2s ease; }
.pm-section-services .tag-link:hover { background-color: var(--card-white); border-color: var(--c-blue); color: var(--c-blue); box-shadow: 0 4px 12px rgba(14, 165, 233, 0.15); }
.pm-section-services .featured-card .tag-link:hover { border-color: var(--c-purple); color: var(--c-purple); box-shadow: 0 4px 12px rgba(139, 92, 246, 0.15); }
.pm-section-services .tag-link.highlight { background: rgba(14, 165, 233, 0.05); border-color: rgba(14, 165, 233, 0.3); color: var(--c-blue); }
.pm-section-services .big-action-area { margin-bottom: 2rem; }
.pm-section-services .big-seo-btn { display: flex; align-items: center; gap: 12px; background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); padding: 12px 20px; border-radius: 14px; color: white; text-decoration: none; box-shadow: 0 10px 20px -5px rgba(124, 58, 237, 0.4); transition: transform 0.2s; }
.pm-section-services .big-seo-btn:hover { transform: translateY(-3px); box-shadow: 0 15px 25px -5px rgba(124, 58, 237, 0.5); }
.pm-section-services .btn-icon { font-size: 1.5rem; }
.pm-section-services .btn-txt { display: flex; flex-direction: column; line-height: 1.3; }
.pm-section-services .btn-txt small { opacity: 0.9; font-size: 0.75rem; font-weight: 400; }
.pm-section-services .wide-card { grid-column: span 3; padding: 1.5rem 2rem; }
.pm-section-services .flex-row-body { display: flex; align-items: center; gap: 2rem; }
.pm-section-services .mini-icon { width: 80px; height: 80px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: #f1f5f9; border-radius: 20px; }
.pm-section-services .mini-icon img { width: 50px; height: auto; }
.pm-section-services .card-body { padding-top: 1rem; }
.pm-section-services .links-horizontal { display: flex; align-items: center; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.pm-section-services .links-horizontal h3 { margin: 0; font-size: 1.2rem; }
@media (max-width: 992px) {
    .pm-section-services .cluster-grid { grid-template-columns: 1fr; }
    .pm-section-services .wide-card { grid-column: span 1; }
    .pm-section-services .flex-row-body { flex-direction: column; align-items: flex-start; gap: 1rem; }
    .pm-section-services .links-horizontal { flex-direction: column; align-items: flex-start; }
    .pm-section-services .featured-card { transform: scale(1); }
    .pm-section-services .featured-card:hover { transform: translateY(-5px); }
}

/* =========================================
   SECTION 3: INFRASTRUCTURE (Vibrant/Control Panel)
   Parent Class: .pm-section-infrastructure
   ========================================= */
.pm-section-infrastructure {
    --pm-bg-deep: #050b14;
    --pm-bg-rich: #0f172a;
    --pm-accent-glow: rgba(6, 182, 212, 0.15);
    --pm-text-muted: #94a3b8;
    --pm-glass-border: rgba(255, 255, 255, 0.12);
    --btn-cyan: #06b6d4;
    --btn-purple: #8b5cf6;
    --btn-gold: #fbbf24;
    --btn-green: #34d399;

    background: radial-gradient(ellipse at top center, #1e1b4b 0%, var(--pm-bg-deep) 70%);
    padding: 5rem 0 8rem 0; position: relative; font-family: inherit; overflow: hidden; color: #fff;
}
.pm-section-infrastructure::before,
.pm-section-infrastructure::after {
    content: ''; position: absolute; width: 600px; height: 600px; border-radius: 50%;
    filter: blur(100px); opacity: 0.25; z-index: 0;
}
.pm-section-infrastructure::before { background: #06b6d4; top: -20%; left: -10%; }
.pm-section-infrastructure::after { background: #8b5cf6; bottom: -20%; right: -10%; }
.pm-section-infrastructure .pm-grid-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-image: linear-gradient(var(--pm-accent-glow) 1px, transparent 1px),
                      linear-gradient(90deg, var(--pm-accent-glow) 1px, transparent 1px);
    background-size: 50px 50px; pointer-events: none;
    mask-image: radial-gradient(circle at center, rgba(0,0,0,1) 20%, rgba(0,0,0,0.1) 90%);
    -webkit-mask-image: radial-gradient(circle at center, rgba(0,0,0,1) 20%, rgba(0,0,0,0.1) 90%);
    z-index: 1;
}
.pm-section-infrastructure .pm-relative-z { position: relative; z-index: 3; }
.pm-section-infrastructure .pm-section-head { text-align: center; margin-bottom: 4rem; position: relative; }
.pm-section-infrastructure .pm-section-head .section-title {
    color: #fff; font-size: 2.5rem; font-weight: 800; margin-bottom: 2.5rem;
    letter-spacing: -0.5px; text-shadow: 0 0 20px rgba(6, 182, 212, 0.3);
}
.pm-section-infrastructure .pm-section-head .section-subtitle { color: var(--pm-text-muted); font-size: 1.1rem; }
.pm-section-infrastructure .pm-control-deck { display: grid; grid-template-columns: 320px 1fr; gap: 2.5rem; max-width: 1200px; margin: 0 auto; align-items: center; }
.pm-section-infrastructure .pm-nav-hub { display: flex; flex-direction: column; gap: 1.2rem; }
.pm-section-infrastructure .pm-hub-item {
    display: flex; align-items: center; gap: 1.5rem; padding: 1.2rem;
    background: rgba(255, 255, 255, 0.03); border: 1px solid var(--pm-glass-border);
    border-radius: 16px; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative; overflow: hidden; backdrop-filter: blur(5px);
}
.pm-section-infrastructure .pm-hub-item:hover { background: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.2); transform: translateX(-5px); }
.pm-section-infrastructure .pm-hub-item.active { background: rgba(15, 23, 42, 0.6); border-color: var(--accent); box-shadow: 0 0 25px -5px var(--accent), inset 0 0 10px -5px var(--accent); }
.pm-section-infrastructure .pm-hub-item.active .active-bg {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(90deg, var(--accent) 0%, transparent 40%); opacity: 0.15; pointer-events: none;
}
.pm-section-infrastructure .hub-icon-box { width: 80px; height: 80px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: transform 0.4s ease; }
.pm-section-infrastructure .pm-icon-3d { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 5px 8px rgba(0,0,0,0.5)); transition: filter 0.3s; }
.pm-section-infrastructure .pm-hub-item:hover .pm-icon-3d { filter: drop-shadow(0 10px 15px rgba(0,0,0,0.6)); }
.pm-section-infrastructure .pm-hub-item.active .hub-icon-box { transform: scale(1.15) rotate(-5deg); }
.pm-section-infrastructure .hub-text { display: flex; flex-direction: column; gap: 4px; }
.pm-section-infrastructure .hub-title { color: #e2e8f0; font-weight: 700; font-size: 1.1rem; }
.pm-section-infrastructure .hub-desc { color: #64748b; font-size: 0.85rem; font-weight: 400;}
.pm-section-infrastructure .pm-hub-item.active .hub-title { color: #fff; }
.pm-section-infrastructure .pm-hub-item.active .hub-desc { color: var(--accent); }
.pm-section-infrastructure .pm-display-terminal { position: relative; min-height: 450px; }
.pm-section-infrastructure .terminal-glass {
    height: 100%; background: rgba(20, 30, 50, 0.5); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.15); border-top-color: rgba(255, 255, 255, 0.3); border-bottom-color: rgba(255, 255, 255, 0.05);
    border-radius: 24px; padding: 3.5rem; position: relative; overflow: hidden;
    box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.5), 0 0 30px rgba(6, 182, 212, 0.1) inset;
}
.pm-section-infrastructure .terminal-content { display: none; transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); opacity: 0; transform: translateY(20px) scale(0.98); }
.pm-section-infrastructure .terminal-content.active { display: block; opacity: 1; transform: translateY(0) scale(1); }
.pm-section-infrastructure .content-header { margin-bottom: 2.5rem; position: relative; z-index: 2; }
.pm-section-infrastructure .term-title { font-size: 2.2rem; font-weight: 800; color: #fff; margin-bottom: 1.2rem; display: flex; align-items: center; gap: 15px; flex-wrap: wrap; text-shadow: 0 2px 10px rgba(0,0,0,0.3); }
.pm-section-infrastructure .term-badge { font-size: 0.85rem; padding: 6px 12px; border-radius: 8px; font-weight: 600; vertical-align: middle; box-shadow: 0 0 10px currentColor; }
.pm-section-infrastructure .term-desc { color: #cbd5e1; font-size: 1.15rem; line-height: 1.7; max-width: 95%; }
.pm-section-infrastructure .term-specs { display: grid; grid-template-columns: 1fr; gap: 1.2rem; margin-bottom: 3.5rem; position: relative; z-index: 2; padding-left: 2rem; border-right: 3px solid rgba(255,255,255,0.1); }
.pm-section-infrastructure .spec-row { display: flex; justify-content: space-between; align-items: center; padding-bottom: 0.8rem; border-bottom: 1px dashed rgba(255,255,255,0.15); }
.pm-section-infrastructure .spec-row span { color: #94a3b8; font-size: 1rem; display: flex; align-items: center; gap: 10px; }
.pm-section-infrastructure .spec-row strong { color: #fff; font-size: 1.05rem; text-shadow: 0 0 5px rgba(255,255,255,0.2); }
.pm-section-infrastructure .term-footer { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 2; background: rgba(0,0,0,0.25); padding: 1.5rem; border-radius: 16px; border: 1px solid rgba(255,255,255,0.05); }
.pm-section-infrastructure .term-price { display: flex; flex-direction: column; }
.pm-section-infrastructure .term-price span { font-size: 2.2rem; font-weight: 800; color: #fff; line-height: 1; margin: 5px 0; text-shadow: 0 0 10px rgba(255,255,255,0.3);}
.pm-section-infrastructure .term-price small { color: #94a3b8; font-size: 0.9rem; }
.pm-section-infrastructure .term-btn { padding: 14px 35px; border-radius: 12px; font-weight: 700; font-size: 1.05rem; text-decoration: none; color: #0f172a; transition: all 0.3s ease; display: inline-block; position: relative; overflow: hidden; }
.pm-section-infrastructure .term-btn::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent); transition: 0.5s; }
.pm-section-infrastructure .term-btn:hover::before { left: 100%; }
.pm-section-infrastructure .term-btn:hover { transform: translateY(-4px); box-shadow: 0 15px 35px rgba(0,0,0,0.4); }
.pm-section-infrastructure .btn-cyan { background: var(--btn-cyan); box-shadow: 0 0 25px rgba(6,182,212,0.4); }
.pm-section-infrastructure .btn-purple { background: var(--btn-purple); box-shadow: 0 0 25px rgba(167,139,250,0.4); }
.pm-section-infrastructure .btn-gold { background: var(--btn-gold); box-shadow: 0 0 25px rgba(251,191,36,0.4); }
.pm-section-infrastructure .btn-green { background: var(--btn-green); box-shadow: 0 0 25px rgba(52,211,153,0.4); }
.pm-section-infrastructure .bg-glow { position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; z-index: 1; pointer-events: none; opacity: 0.6; filter: blur(80px); mix-blend-mode: screen; }
@media (max-width: 992px) {
    .pm-section-infrastructure .pm-control-deck { grid-template-columns: 1fr; gap: 2rem; }
    .pm-section-infrastructure .pm-nav-hub { flex-direction: row; overflow-x: auto; padding-bottom: 20px; scroll-snap-type: x mandatory; }
    .pm-section-infrastructure .pm-hub-item { min-width: 260px; flex: 0 0 auto; scroll-snap-align: start; flex-direction: column; text-align: center; padding: 1.5rem; }
    .pm-section-infrastructure .hub-icon-box { margin-bottom: 0.5rem; }
    .pm-section-infrastructure .pm-hub-item:hover { transform: translateY(-5px); }
    .pm-section-infrastructure .term-specs { border-right: none; padding-left: 0; }
    .pm-section-infrastructure .term-footer { flex-direction: column; gap: 1.5rem; align-items: stretch; text-align: center; }
}

/* ========================================================================
   SECTION: DOMAIN SEARCH (Professional Light Theme + Dark Results)
   Parent Class: .pm-section-domain
   ======================================================================== */

.pm-section-domain {
    /* --- Local Variables for Isolation --- */
    --ds-bg: #ffffff;
    --ds-text-main: #0f172a;      /* Slate-900 */
    --ds-text-muted: #64748b;     /* Slate-500 */
    --ds-primary: #3b82f6;        /* Blue-500 */
    --ds-border: #e2e8f0;         /* Slate-200 */
    
    /* --- Main Layout --- */
    background-color: var(--ds-bg);
    padding: 6rem 0;
    position: relative;
    font-family: inherit;
    /* حیاتی: اجازه می‌دهد باکس شناور از کادر سکشن بیرون بزند */
    overflow: visible !important; 
    z-index: 50;
    direction: rtl;
    text-align: right;
}

/* 1. Background & Decorations
   ======================================================================== */
.pm-section-domain .bg-grid-pattern {
    position: absolute; inset: 0; width: 100%; height: 100%;
    background-image: radial-gradient(#cbd5e1 1.5px, transparent 1.5px);
    background-size: 30px 30px; opacity: 0.4; z-index: 0;
    mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
    pointer-events: none;
}

.pm-section-domain .light-decor {
    position: absolute; border-radius: 50%; filter: blur(90px); z-index: 0; opacity: 0.5;
}
.pm-section-domain .decor-1 { width: 400px; height: 400px; background: #dbeafe; top: -10%; left: -5%; }
.pm-section-domain .decor-2 { width: 350px; height: 350px; background: #f3e8ff; bottom: 0; right: 15%; }

.pm-section-domain .relative-z { position: relative; z-index: 2; }

.pm-section-domain .domain-layout-grid {
    display: grid; grid-template-columns: 1.2fr 0.8fr; align-items: center; gap: 4rem;
}

/* 2. Typography & Badges
   ======================================================================== */
.pm-section-domain .section-badge {
    display: inline-flex; align-items: center; gap: 8px;
    background: #eff6ff; color: var(--ds-primary);
    padding: 6px 16px; border-radius: 50px; 
    font-size: 0.85rem; font-weight: 700; margin-bottom: 1.5rem;
}
.pm-section-domain .pulse-dot {
    width: 8px; height: 8px; background: var(--ds-primary); border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7);
    animation: pm-pulse 2s infinite;
}

.pm-section-domain .hero-title {
    font-size: 2.8rem; font-weight: 900; color: var(--ds-text-main);
    line-height: 1.3; margin-bottom: 1.5rem; letter-spacing: -0.5px;
}
.pm-section-domain .highlight-text {
    color: var(--ds-primary); position: relative; white-space: nowrap;
}
.pm-section-domain .hero-desc {
    font-size: 1.1rem; color: var(--ds-text-muted); max-width: 90%; 
    margin-bottom: 2.5rem; line-height: 1.8;
}

/* 3. Search Box Container (The White Box)
   ======================================================================== */
.pm-section-domain .search-box-container {
    background: #ffffff;
    border-radius: 24px;
    padding: 12px;
    box-shadow: 0 20px 40px -5px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0,0,0,0.03);
    max-width: 650px;
    position: relative; /* لنگرگاه برای باکس نتایج */
    z-index: 100;
}

/* 4. The Form & Input (Fixed Black Text)
   ======================================================================== */
.pm-section-domain .search-form-modern {
    display: flex; align-items: center; gap: 10px;
    background: #f8fafc; border: 1px solid var(--ds-border);
    border-radius: 18px; padding: 6px;
    transition: all 0.3s ease;
    position: relative; z-index: 20;
}
.pm-section-domain .search-form-modern:focus-within {
    background: #fff; border-color: var(--ds-primary);
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15);
}

.pm-section-domain .input-wrapper {
    flex-grow: 1; display: flex; align-items: center; padding: 0 15px;
}
.pm-section-domain .www-prefix {
    color: #cbd5e1; font-weight: 600; font-size: 1.1rem; user-select: none; margin-left: 8px;
}

/* اصلاح حیاتی رنگ متن ورودی */
.pm-section-domain .search-form-modern input {
    width: 100%; border: none; background: transparent; outline: none;
    font-size: 1.1rem; font-weight: 700; font-family: sans-serif;
    padding: 12px 0;
    
    /* اجبار به رنگ مشکی */
    color: #1e293b !important;
    -webkit-text-fill-color: #1e293b !important;
    
    text-align: left; direction: ltr;
}
.pm-section-domain .search-form-modern input::placeholder {
    color: #94a3b8 !important; -webkit-text-fill-color: #94a3b8 !important;
    font-weight: 400; text-align: right; direction: rtl; font-family: inherit;
}

/* دکمه جستجو */
.pm-section-domain .btn-search-action {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    color: white; border: none; padding: 12px 24px; border-radius: 14px;
    font-weight: 700; cursor: pointer; display: flex; align-items: center; gap: 8px;
    transition: all 0.2s; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    flex-shrink: 0;
}
.pm-section-domain .btn-search-action:hover {
    transform: translateY(-2px); box-shadow: 0 8px 20px rgba(37, 99, 235, 0.4);
}

/* 5. Chips (Pricing)
   ======================================================================== */
.pm-section-domain .price-chips {
    display: flex; gap: 10px; margin-top: 15px; padding-right: 5px; flex-wrap: wrap;
    position: relative; z-index: 10;
}
.pm-section-domain .chip {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.85rem; color: var(--ds-text-muted);
    background: #f1f5f9; padding: 6px 12px; border-radius: 10px;
}
.pm-section-domain .chip .ext { font-weight: 800; color: var(--ds-text-main); }
.pm-section-domain .chip .price { color: var(--ds-primary); font-weight: 600; }
.pm-section-domain .badge-off { 
    background: #ffe4e6; color: #f43f5e; padding: 2px 6px; 
    border-radius: 4px; font-size: 0.75rem; font-weight: 700; 
}

/* 6. DARK RESULTS DROPDOWN (The Critical Fix)
   ======================================================================== */
.pm-section-domain .ds-results-dropdown {
    /* موقعیت شناور مطلق */
    position: absolute !important;
    top: calc(100% + 15px) !important;
    left: 0 !important; right: 0 !important;
    width: 100% !important;

    /* استایل تیره و شیشه‌ای */
    background-color: #0f172a !important; /* سرمه‌ای تیره */
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 20px !important;
    padding: 20px !important;
    
    /* سایه و اولویت نمایش */
    box-shadow: 0 30px 80px rgba(0,0,0,0.6) !important;
    z-index: 99999 !important;
    
    /* اسکرول */
    max-height: 450px;
    overflow-y: auto;
    text-align: right;
    
    /* رنگ متون عمومی داخل باکس */
    color: #e2e8f0 !important; 
}

/* تیترهای داخلی مثل "نتایج جستجو" */
.pm-section-domain .ds-results-dropdown > div:not(.ds-result-card),
.pm-section-domain .ds-results-dropdown strong {
    color: #94a3b8 !important; /* طوسی روشن */
    font-size: 0.85rem !important;
    margin-bottom: 10px !important;
    display: block !important;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding-bottom: 5px;
}

/* کارت‌های هر نتیجه */
.pm-section-domain .ds-result-card {
    display: flex !important; justify-content: space-between !important; align-items: center !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
    padding: 12px 16px !important;
}

/* نام دامنه (چپ چین و سفید) */
.pm-section-domain .ds-res-name {
    color: #ffffff !important;
    font-weight: 700 !important;
    font-family: sans-serif !important;
    direction: ltr !important; text-align: left !important;
    font-size: 1.05rem !important;
}

/* وضعیت (راست چین) */
.pm-section-domain .ds-res-status {
    text-align: right !important; font-size: 0.8rem !important; display: block !important;
}

/* رنگ‌بندی وضعیت‌ها */
.pm-section-domain .ds-result-card.available {
    background: rgba(16, 185, 129, 0.1) !important;
    border-color: rgba(16, 185, 129, 0.3) !important;
}
.pm-section-domain .ds-result-card.available .ds-res-status { color: #34d399 !important; }

.pm-section-domain .ds-result-card.unavailable {
    background: rgba(239, 68, 68, 0.1) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}
.pm-section-domain .ds-result-card.unavailable .ds-res-status { color: #f87171 !important; }

/* دکمه‌ها */
.pm-section-domain .ds-btn-buy {
    background: #3b82f6 !important; color: #fff !important;
    padding: 6px 16px !important; border-radius: 8px !important;
    text-decoration: none !important; font-size: 0.9rem !important;
}

.pm-section-domain .ds-close-btn {
    filter: invert(1); opacity: 0.7; cursor: pointer; margin-bottom: 10px; margin-left: auto;
}

/* 7. Visuals & Image
   ======================================================================== */
.pm-section-domain .domain-visual {
    position: relative; display: flex; justify-content: flex-end;
}
.pm-section-domain .person-wrapper { position: relative; max-width: 480px; }
.pm-section-domain .hero-person-img {
    width: 100%; height: auto; display: block;
    filter: drop-shadow(0 25px 50px rgba(0,0,0,0.15));
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}

.pm-section-domain .float-card {
    position: absolute; bottom: 12%; left: -20px;
    background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(12px);
    padding: 12px 24px; border-radius: 16px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1); border: 1px solid #fff;
    display: flex; align-items: center; gap: 15px;
    animation: pm-float-card 5s ease-in-out infinite;
}
.pm-section-domain .float-card .icon { font-size: 1.6rem; }
.pm-section-domain .float-card strong { display: block; color: var(--ds-text-main); font-size: 0.95rem; }
.pm-section-domain .float-card small { display: block; color: var(--ds-text-muted); font-size: 0.8rem; }

/* Animations */
@keyframes pm-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); }
    50% { box-shadow: 0 0 0 10px rgba(59, 130, 246, 0); }
}
@keyframes pm-float-card {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

/* 8. Responsive
   ======================================================================== */
@media (max-width: 992px) {
    .pm-section-domain .domain-layout-grid { grid-template-columns: 1fr; text-align: center; gap: 3rem; }
    .pm-section-domain .hero-title { font-size: 2.2rem; }
    .pm-section-domain .search-box-container { margin: 0 auto; }
    .pm-section-domain .search-form-modern { flex-direction: column; }
    .pm-section-domain .input-wrapper { width: 100%; border-bottom: 1px solid #e2e8f0; padding-bottom: 10px; margin-bottom: 10px; justify-content: center; }
    .pm-section-domain .search-form-modern input { text-align: center; }
    .pm-section-domain .btn-search-action { width: 100%; justify-content: center; }
    .pm-section-domain .price-chips { justify-content: center; }
    .pm-section-domain .domain-visual { justify-content: center; order: -1; }
    .pm-section-domain .person-wrapper { max-width: 320px; }
    .pm-section-domain .float-card { left: 50%; transform: translateX(-50%); bottom: 10px; animation: none; }
}

/* =========================================
   SECTION 5: LIVE CHAT / TESTIMONIALS (Neon Cyan/Dark)
   Parent Class: .pm-chat-section
   ========================================= */
.pm-chat-section {
    --chat-bg: #0b1120;
    --bubble-bg: #162032;
    --bubble-hover: #1c2840;
    --chat-accent: #06b6d4;
    --chat-accent-glow: rgba(6, 182, 212, 0.15);
    --chat-text: #e2e8f0;
    --chat-meta: #94a3b8;
    --tick-read: #38bdf8;

    background-color: var(--chat-bg);
    padding: 7rem 0; position: relative; overflow: hidden; font-family: inherit; direction: rtl;
}
.pm-chat-section .tech-bg-lines {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-image: radial-gradient(circle at 20% 80%, rgba(6, 182, 212, 0.05) 0%, transparent 40%),
                      radial-gradient(circle at 80% 20%, rgba(139, 92, 246, 0.05) 0%, transparent 40%);
    opacity: 1; pointer-events: none;
}
.pm-chat-section .relative-z { position: relative; z-index: 2; }
.pm-chat-section .chat-header { text-align: center; margin-bottom: 4rem; }
.pm-chat-section .status-indicator {
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--chat-accent-glow); color: var(--chat-accent);
    padding: 6px 16px; border-radius: 50px; font-size: 0.85rem; font-weight: 700;
    margin-bottom: 1rem; border: 1px solid rgba(6, 182, 212, 0.1);
}
.pm-chat-section .pulse-accent {
    width: 8px; height: 8px; background: var(--chat-accent); border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.7);
    animation: pm-pulse-cyan 2s infinite;
}
.pm-chat-section .section-title { color: #fff; font-size: 2.5rem; margin-bottom: 2.5rem; font-weight: 800; }
.pm-chat-section .section-subtitle { color: var(--chat-meta); font-size: 1.1rem; }
.pm-chat-section .chat-masonry { column-count: 2; column-gap: 2.5rem; }
.pm-chat-section .chat-bubble {
    background-color: var(--bubble-bg);
    border-radius: 18px; border-bottom-right-radius: 4px;
    padding: 1.5rem; margin-bottom: 2rem; break-inside: avoid;
    position: relative; box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: all 0.3s ease; border: 1px solid rgba(255,255,255,0.03);
}
.pm-chat-section .chat-bubble:hover {
    transform: translateY(-4px); background-color: var(--bubble-hover);
    border-color: rgba(6, 182, 212, 0.1); box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}
.pm-chat-section .bubble-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.pm-chat-section .sender-avatar { position: relative; width: 48px; height: 48px; flex-shrink: 0; }
.pm-chat-section .sender-avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--chat-bg); }
.pm-chat-section .online-badge {
    position: absolute; bottom: 2px; left: 2px; width: 11px; height: 11px;
    background: var(--chat-accent); border: 2px solid var(--bubble-bg); border-radius: 50%;
    box-shadow: 0 0 5px var(--chat-accent);
}
.pm-chat-section .sender-info { display: flex; flex-direction: column; gap: 2px; }
.pm-chat-section .sender-name { color: var(--chat-accent); font-weight: 700; font-size: 1.05rem; }
.pm-chat-section .service-meta { color: var(--chat-meta); font-size: 0.8rem; display: flex; align-items: center; gap: 5px; }
.pm-chat-section .service-meta svg { opacity: 0.7; }
.pm-chat-section .bubble-body p { color: var(--chat-text); font-size: 1rem; line-height: 1.7; margin: 0; }
.pm-chat-section .bubble-foot {
    display: flex; justify-content: flex-end; align-items: center; gap: 8px;
    margin-top: 12px; padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.03);
}
.pm-chat-section .msg-time { font-size: 0.75rem; color: var(--chat-meta); }
.pm-chat-section .tick-icon { width: 18px; height: auto; color: var(--tick-read); filter: drop-shadow(0 0 2px rgba(56,189,248,0.3)); }
.pm-chat-section .chat-input-area { max-width: 650px; margin: 3rem auto 0; position: relative; }
.pm-chat-section .fake-input-box {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--bubble-bg); border-radius: 35px; padding: 10px 25px;
    text-decoration: none; border: 1px solid rgba(255,255,255,0.05); transition: 0.3s;
}
.pm-chat-section .fake-input-box:hover {
    background: var(--bubble-hover); border-color: var(--chat-accent);
    box-shadow: 0 0 15px rgba(6, 182, 212, 0.1);
}
.pm-chat-section .placeholder-text { color: #94a3b8; font-size: 1.05rem; }
.pm-chat-section .send-btn {
    width: 48px; height: 48px; border-radius: 50%;
    background: linear-gradient(135deg, var(--chat-accent), #38bdf8);
    border: none; color: #fff; display: flex; align-items: center; justify-content: center;
    cursor: pointer; box-shadow: 0 5px 15px rgba(6, 182, 212, 0.3); transition: transform 0.2s;
}
.pm-chat-section .send-btn:hover { transform: scale(1.05) rotate(-5deg); }
.pm-chat-section .send-btn svg { width: 22px; height: 22px; transform: rotate(180deg); margin-right: -3px; }
@keyframes pm-pulse-cyan {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(6, 182, 212, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(6, 182, 212, 0); }
}
@media (max-width: 992px) {
    .pm-chat-section .chat-masonry { column-count: 1; }
    .pm-chat-section .section-title { font-size: 2rem; }
    .pm-chat-section .chat-bubble { padding: 1.2rem; }
}

/* =========================================
   SECTION 6: COMPACT TECH STACK
   Parent Class: .pm-compact-section
   ========================================= */
.pm-compact-section {
    --bg-silver: #f8fafc;
    --text-dark: #0f172a;
    --text-soft: #64748b;

    background-color: var(--bg-silver);
    padding: 5rem 0; position: relative; overflow: hidden; font-family: inherit; direction: rtl;
}
.pm-compact-section .bg-noise {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.05;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    pointer-events: none;
}
.pm-compact-section .bg-glow-center {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 80%; height: 80%;
    background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(248,250,252,0) 70%);
    z-index: 1; pointer-events: none;
}
.pm-compact-section .relative-z { position: relative; z-index: 2; }
.pm-compact-section .compact-header { text-align: center; margin-bottom: 3.5rem; }
.pm-compact-section .section-title { font-size: 2.5rem; font-weight: 900; color: var(--text-dark); margin-bottom: 2.5rem; letter-spacing: -1px; }
.pm-compact-section .gradient-text {
    background: linear-gradient(135deg, #1e293b 0%, #475569 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-compact-section .section-subtitle { font-size: 1.1rem; color: var(--text-soft); }
.pm-compact-section .compact-grid {
    display: grid; grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem; max-width: 1100px; margin: 0 auto;
}
.pm-compact-section .tech-card-landscape {
    display: flex; align-items: center; background: #ffffff;
    border-radius: 20px; padding: 1.2rem; gap: 1.2rem;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(255,255,255,0.5); height: 100px;
}
.pm-compact-section .tech-card-landscape:hover {
    transform: translateY(-5px); box-shadow: 0 15px 30px -5px rgba(0, 0, 0, 0.1);
}
.pm-compact-section .landscape-icon {
    width: 70px; height: 70px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
}
.pm-compact-section .landscape-icon img { 
    width: 100%; height: auto; object-fit: contain; 
    filter: drop-shadow(0 5px 10px rgba(0,0,0,0.1)); transition: transform 0.3s;
}
.pm-compact-section .tech-card-landscape:hover .landscape-icon img { transform: scale(1.1) rotate(-5deg); }
.pm-compact-section .landscape-content {
    flex-grow: 1; display: flex; flex-direction: column; justify-content: center;
    border-right: 1px solid #f1f5f9; padding-right: 15px;
}
.pm-compact-section .info-top { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.pm-compact-section .info-top h3 { margin: 0; font-size: 1.1rem; font-weight: 800; color: var(--text-dark); }
.pm-compact-section .badge-tech {
    font-size: 0.7rem; background: #f1f5f9; color: var(--text-soft);
    padding: 2px 6px; border-radius: 6px; font-weight: 600;
}
.pm-compact-section .landscape-content p {
    margin: 0; font-size: 0.85rem; color: var(--text-soft);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 250px;
}
.pm-compact-section .landscape-stat {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    width: 60px; flex-shrink: 0; gap: 5px;
}
.pm-compact-section .radial-progress {
    width: 45px; height: 45px; border-radius: 50%;
    background: conic-gradient(var(--clr) calc(var(--p)*1%), #f1f5f9 0deg);
    display: flex; align-items: center; justify-content: center; position: relative;
}
.pm-compact-section .radial-progress::before {
    content: ''; position: absolute; width: 37px; height: 37px;
    background: #fff; border-radius: 50%;
}
.pm-compact-section .radial-progress .overlay {
    position: relative; z-index: 2; font-size: 0.75rem; font-weight: 800; color: var(--text-dark);
}
.pm-compact-section .stat-label { font-size: 0.7rem; color: var(--text-soft); }
.pm-compact-section .card-blue:hover { border-color: rgba(59, 130, 246, 0.3); }
.pm-compact-section .card-pink:hover { border-color: rgba(236, 72, 153, 0.3); }
.pm-compact-section .card-green:hover { border-color: rgba(16, 185, 129, 0.3); }
.pm-compact-section .card-orange:hover { border-color: rgba(245, 158, 11, 0.3); }
@media (max-width: 992px) {
    .pm-compact-section .compact-grid { grid-template-columns: 1fr; max-width: 500px; }
    .pm-compact-section .tech-card-landscape { height: auto; padding: 1.5rem; flex-wrap: wrap; text-align: center; justify-content: center; }
    .pm-compact-section .landscape-content { border-right: none; padding-right: 0; border-bottom: 1px solid #f1f5f9; padding-bottom: 10px; margin-bottom: 10px; width: 100%; align-items: center; }
    .pm-compact-section .landscape-content p { white-space: normal; max-width: 100%; }
    .pm-compact-section .info-top { justify-content: center; }
}

/* =========================================
   SECTION 7: 3D STACK CARDS (Final)
   Parent Class: .pm-stack-section
   ========================================= */
.pm-stack-section {
    /* --- Scoped Variables --- */
    --st-bg: #0b1120;
    --st-card: #1e293b;
    --st-accent: #f43f5e;
    --st-text: #fff;
    --st-muted: #94a3b8;

    background-color: var(--st-bg);
    padding: 6rem 0 8rem 0; position: relative; overflow: hidden; font-family: inherit; direction: rtl;
    perspective: 1000px;
}

/* Background FX */
.pm-stack-section .deep-space-bg {
    position: absolute; inset: 0;
    background: radial-gradient(circle at 50% -20%, #1e1b4b 0%, var(--st-bg) 60%);
    z-index: 0;
}
.pm-stack-section .floating-particles {
    position: absolute; inset: 0; opacity: 0.3;
    background-image: radial-gradient(#fff 1px, transparent 1px);
    background-size: 50px 50px;
    mask-image: linear-gradient(to bottom, black, transparent);
    z-index: 0;
}
.pm-stack-section .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-stack-section .stack-header { text-align: center; margin-bottom: 4rem; position: relative; z-index: 10; }
.pm-stack-section .section-title { font-size: 2.5rem; font-weight: 900; color: var(--st-text); margin-bottom: 2.5rem; }
.pm-stack-section .highlight-text { color: var(--st-accent); position: relative; display: inline-block; }
.pm-stack-section .highlight-text::after {
    content: ''; position: absolute; bottom: 5px; left: 0; width: 100%; height: 10px;
    background: rgba(244, 63, 94, 0.2); transform: skewX(-20deg); z-index: -1;
}
.pm-stack-section .section-subtitle { color: var(--st-muted); font-size: 1.1rem; }

/* Stack Wrapper */
.pm-stack-section .stack-wrapper {
    display: flex; flex-direction: column; align-items: center;
    position: relative; height: 500px;
}
.pm-stack-section .cards-container {
    position: relative; width: 100%; max-width: 800px; height: 450px;
    perspective: 1500px; transform-style: preserve-3d;
}

/* The Card */
.pm-stack-section .stack-card {
    position: absolute; top: 0; left: 0; right: 0; margin: auto;
    width: 100%; height: 100%; background: var(--st-card);
    border-radius: 24px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
    border: 1px solid rgba(255,255,255,0.1); overflow: hidden;
    opacity: 0; transform-origin: center bottom;
}
/* Thrown State */
.pm-stack-section .stack-card.thrown {
    transform: translate3d(-120%, -100px, 0) rotate(-20deg) !important;
    opacity: 0 !important; pointer-events: none;
}

/* Card Inner */
.pm-stack-section .card-inner { display: grid; grid-template-columns: 1.2fr 1fr; height: 100%; }
.pm-stack-section .card-visual { position: relative; height: 100%; overflow: hidden; }
.pm-stack-section .card-visual img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.pm-stack-section .stack-card:hover .card-visual img { transform: scale(1.05); }
.pm-stack-section .card-badge {
    position: absolute; top: 20px; right: 20px;
    background: rgba(0,0,0,0.6); backdrop-filter: blur(5px);
    color: #fff; padding: 6px 12px; border-radius: 8px; font-size: 0.8rem; font-weight: 700;
    border: 1px solid rgba(255,255,255,0.2);
}

/* Card Info */
.pm-stack-section .card-info {
    padding: 3rem 2rem; display: flex; flex-direction: column; justify-content: center;
    background: linear-gradient(to left, var(--st-card), rgba(30, 41, 59, 0.9));
}
.pm-stack-section .info-head { display: flex; gap: 15px; font-size: 0.8rem; color: var(--st-muted); margin-bottom: 1rem; }
.pm-stack-section .info-title { font-size: 1.8rem; line-height: 1.3; margin: 0 0 1rem 0; font-weight: 800; }
.pm-stack-section .info-title a { color: #fff; text-decoration: none; transition: 0.3s; }
.pm-stack-section .info-title a:hover { color: var(--st-accent); }
.pm-stack-section .info-desc {
    color: #cbd5e1; font-size: 1rem; line-height: 1.7; margin-bottom: 2rem;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pm-stack-section .info-btn {
    display: inline-flex; align-items: center; gap: 10px;
    color: var(--st-accent); font-weight: 700; text-decoration: none; font-size: 1rem; transition: 0.3s;
}
.pm-stack-section .info-btn .arr { transition: transform 0.3s; }
.pm-stack-section .info-btn:hover .arr { transform: translateX(-5px); }

/* Controls */
.pm-stack-section .stack-controls {
    position: absolute; bottom: 0px; right: 0; left: 0;
    display: flex; justify-content: center; gap: 20px; z-index: 200;
}
.pm-stack-section .control-btn {
    width: 56px; height: 56px; border-radius: 50%;
    background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.1);
    color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center;
    transition: all 0.3s; backdrop-filter: blur(5px);
}
.pm-stack-section .control-btn:hover {
    background: var(--st-accent); border-color: var(--st-accent);
    transform: scale(1.1); box-shadow: 0 0 20px rgba(244, 63, 94, 0.4);
}
.pm-stack-section .control-btn svg { width: 24px; height: 24px; }

/* Responsive */
@media (max-width: 992px) {
    .pm-stack-section .cards-container { height: auto; min-height: 500px; }
    .pm-stack-section .card-inner { grid-template-columns: 1fr; grid-template-rows: 250px auto; }
    .pm-stack-section .card-info { padding: 2rem; text-align: center; }
    .pm-stack-section .info-head { justify-content: center; }
    .pm-stack-section .info-title { font-size: 1.4rem; }
    .pm-stack-section .stack-card.thrown { transform: translate3d(-150%, 0, 0) rotate(-20deg) !important; }
}

/* ==========================================================================
   PAGE: HOSTING | SECTION 1: HERO (Neon Command Center)
   Parent Class: .pm-host-hero
   ========================================================================== */
.pm-host-hero {
    /* --- Scoped Variables --- */
    --host-bg: #020617;
    --host-cyan: #22d3ee;
    --host-blue: #3b82f6;
    --host-text-muted: #94a3b8;
    --host-text-light: #cbd5e1;

    position: relative;
    background-color: var(--host-bg);
    background-image: radial-gradient(circle at 50% 0%, #1e293b 0%, #020617 80%);
    min-height: 750px;
    padding-top: 120px;
    padding-bottom: 0;
    overflow: hidden;
    display: flex; align-items: flex-end;
    direction: rtl; font-family: inherit; color: #fff;
}

/* Background Layers */
.pm-host-hero .hero-backdrop {
    position: absolute; inset: 0;
    background: url('/assets/img/real-datacenter-bg.webp') no-repeat center bottom;
    background-size: cover; z-index: 0;
    opacity: 0.4; filter: blur(3px) grayscale(40%);
}
.pm-host-hero .hero-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(90deg, 
        rgba(2, 6, 23, 0.98) 0%, 
        rgba(2, 6, 23, 0.85) 45%, 
        rgba(2, 6, 23, 0.4) 100%);
    z-index: 1;
}
.pm-host-hero .relative-z { position: relative; z-index: 10; height: 100%; width: 100%; }
.pm-host-hero .h-100 { height: 100%; }

/* Grid Layout */
.pm-host-hero .hero-grid-layout {
    display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 4rem;
    align-items: center; height: 100%; min-height: 600px;
}

/* Text Column */
.pm-host-hero .text-column {
    display: flex; flex-direction: column; justify-content: center; padding-bottom: 5rem;
}

/* Badge */
.pm-host-hero .hero-badge-wrapper { margin-bottom: 1.5rem; }
.pm-host-hero .hero-badge {
    display: inline-flex; align-items: center; gap: 10px;
    background: rgba(6, 182, 212, 0.1); border: 1px solid rgba(6, 182, 212, 0.3);
    color: var(--host-cyan); padding: 8px 16px; border-radius: 50px;
    font-size: 0.85rem; font-weight: 700;
    box-shadow: 0 0 15px rgba(6, 182, 212, 0.1);
}
.pm-host-hero .pulse-dot {
    width: 6px; height: 6px; background: var(--host-cyan); border-radius: 50%;
    box-shadow: 0 0 8px var(--host-cyan); animation: pm-host-pulse 2s infinite;
}

/* Typography */
.pm-host-hero .main-headline {
    font-size: 3.5rem; font-weight: 900; line-height: 1.15; margin-bottom: 1.5rem;
    color: #fff; text-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
.pm-host-hero .highlight-cyan {
    color: var(--host-cyan); display: inline-block; position: relative;
    text-shadow: 0 0 20px rgba(34, 211, 238, 0.4);
}
.pm-host-hero .highlight-cyan::after {
    content: ''; position: absolute; bottom: 8px; left: 0; width: 100%; height: 8px;
    background: rgba(34, 211, 238, 0.3); z-index: -1; transform: skewX(-12deg);
}
.pm-host-hero .sub-headline {
    display: block; font-size: 1.4rem; color: var(--host-text-muted); font-weight: 500; margin-top: 10px;
}
.pm-host-hero .hero-description {
    color: var(--host-text-light); font-size: 1.1rem; line-height: 1.8;
    max-width: 600px; margin-bottom: 2.5rem;
    border-right: 3px solid var(--host-blue); padding-right: 15px;
}

/* Buttons */
.pm-host-hero .action-buttons {
    display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-bottom: 2.5rem;
}
.pm-host-hero .btn-action.primary {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    color: #fff; padding: 16px 32px; border-radius: 14px;
    font-weight: 700; font-size: 1.1rem; text-decoration: none;
    display: inline-flex; align-items: center; gap: 10px;
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.4), inset 0 1px 0 rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.1); transition: all 0.3s ease;
}
.pm-host-hero .btn-action.primary:hover {
    transform: translateY(-4px); box-shadow: 0 20px 40px rgba(37, 99, 235, 0.6);
}
.pm-host-hero .guarantee-box {
    display: flex; align-items: center; gap: 8px;
    color: #e2e8f0; font-weight: 600; font-size: 0.9rem;
    background: rgba(255,255,255,0.05); padding: 8px 16px; border-radius: 10px;
}
.pm-host-hero .check-icon { color: #10b981; font-weight: bold; }

/* Tech Specs (Holographic Bar) */
.pm-host-hero .tech-specs {
    position: relative; display: inline-flex; width: fit-content; align-items: center; gap: 25px;
    background: rgba(15, 23, 42, 0.6); backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px; padding: 12px 25px;
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.5); transition: all 0.3s ease;
}
.pm-host-hero .tech-specs:hover {
    background: rgba(15, 23, 42, 0.9); border-color: rgba(255, 255, 255, 0.3);
    transform: translateY(-5px);
    box-shadow: 0 20px 50px -10px rgba(0, 0, 0, 0.6), 0 0 25px rgba(59, 130, 246, 0.2);
}
.pm-host-hero .tech-specs::after {
    content: ''; position: absolute; top: 0; left: -100%; width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
    transform: skewX(-25deg); transition: 0.7s ease; pointer-events: none;
}
.pm-host-hero .tech-specs:hover::after { left: 200%; }
.pm-host-hero .spec-item { display: flex; flex-direction: column; justify-content: center; text-align: left; }
.pm-host-hero .lbl { font-size: 0.65rem; font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: 1.5px; display: block; }
.pm-host-hero .val {
    font-size: 1.1rem; font-weight: 800; letter-spacing: -0.5px;
    background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    text-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
.pm-host-hero .val-blue   { background-image: linear-gradient(135deg, #22d3ee 0%, #3b82f6 100%); }
.pm-host-hero .val-purple { background-image: linear-gradient(135deg, #f472b6 0%, #c084fc 100%); }
.pm-host-hero .val-green  { background-image: linear-gradient(135deg, #4ade80 0%, #10b981 100%); }
.pm-host-hero .divider { width: 1px; height: 30px; background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.2), transparent); }

/* Visual Column */
.pm-host-hero .visual-column {
    position: relative; height: 100%;
    display: flex; align-items: flex-end; justify-content: center;
}
.pm-host-hero .image-anchor-wrapper {
    position: relative; width: 100%; max-width: 550px;
    display: flex; justify-content: center; align-items: flex-end;
}
.pm-host-hero .manager-img {
    display: block; width: auto; max-width: 100%; max-height: 700px;
    filter: drop-shadow(0 0 40px rgba(0,0,0,0.6)); position: relative; z-index: 5;
    mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
}
.pm-host-hero .back-glow {
    position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4) 0%, transparent 70%);
    mix-blend-mode: screen; filter: blur(80px); z-index: 1;
    animation: pm-host-glow 4s infinite alternate;
}

/* Floating UI */
.pm-host-hero .floating-ui {
    position: absolute;
    background: rgba(2, 6, 23, 0.8); backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.1);
    padding: 12px 18px; border-radius: 12px; z-index: 6;
    box-shadow: 0 15px 35px rgba(0,0,0,0.5); min-width: 140px;
    animation: pm-host-float 4s ease-in-out infinite;
}
.pm-host-hero .speed-ui { top: 30%; right: -30px; border-left: 3px solid #06b6d4; }
.pm-host-hero .status-ui {
    bottom: 30%; left: -30px; border-right: 3px solid #10b981;
    display: flex; align-items: center; gap: 10px; animation-delay: 1s;
}
.pm-host-hero .ui-label { font-size: 0.7rem; color: #94a3b8; text-transform: uppercase; }
.pm-host-hero .ui-value { font-size: 1.4rem; font-weight: 800; color: #fff; }
.pm-host-hero .status-ui .ui-value { color: #10b981; font-size: 1.2rem; }
.pm-host-hero .ui-bar { width: 100%; height: 4px; background: rgba(255,255,255,0.1); margin-top: 6px; border-radius: 2px; }
.pm-host-hero .ui-bar .fill { width: 90%; height: 100%; background: #06b6d4; border-radius: 2px; box-shadow: 0 0 8px #06b6d4; }
.pm-host-hero .ui-icon { font-size: 1.5rem; }

/* Animations (Scoped) */
@keyframes pm-host-pulse { 0% { box-shadow: 0 0 0 0 rgba(34, 211, 238, 0.7); } 100% { box-shadow: 0 0 0 10px transparent; } }
@keyframes pm-host-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-10px);} }
@keyframes pm-host-glow { 0%{opacity: 0.5; transform:translateX(-50%) scale(1);} 100%{opacity: 0.8; transform:translateX(-50%) scale(1.1);} }

/* Responsive */
@media (max-width: 992px) {
    .pm-host-hero { align-items: center; padding-top: 80px; height: auto; display: block; }
    .pm-host-hero .hero-grid-layout { grid-template-columns: 1fr; gap: 3rem; }
    .pm-host-hero .text-column { text-align: center; align-items: center; padding-bottom: 2rem; }
    .pm-host-hero .hero-description { border-right: none; padding-right: 0; margin: 0 auto 2rem auto; }
    .pm-host-hero .action-buttons { justify-content: center; }
    .pm-host-hero .tech-specs { width: 100%; justify-content: space-around; gap: 10px; }
    .pm-host-hero .divider { display: none; }
    .pm-host-hero .spec-item { align-items: center; width: auto; }
    .pm-host-hero .visual-column { height: 500px; align-items: flex-end; overflow: hidden; }
    .pm-host-hero .manager-img { max-height: 100%; }
    .pm-host-hero .floating-ui { display: none; } 
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 2: QUANTUM NEXUS LINKS
   Parent Class: .pm-host-nexus
   ========================================================================== */
.pm-host-nexus {
    /* --- Scoped Variables --- */
    --nexus-bg: #020617; /* Matches Hero BG */
    --nexus-card-bg: rgba(15, 23, 42, 0.4);
    --nexus-card-hover: rgba(15, 23, 42, 0.9);
    --nexus-border: rgba(255, 255, 255, 0.08);
    --nexus-cyan: #22d3ee;
    --nexus-text-muted: #94a3b8;

    position: relative;
    background-color: var(--nexus-bg);
    padding: 20px 0 60px 0;
    z-index: 25; /* Higher than normal sections */
    margin-top: -1px; /* Remove gaps */
    direction: rtl; font-family: inherit;
}

/* Grid */
.pm-host-nexus .nexus-grid {
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 16px; padding: 10px; margin-bottom: -2rem;
}

/* Nexus Card */
.pm-host-nexus .nexus-card {
    position: relative; display: flex; align-items: center; justify-content: center;
    gap: 12px; padding: 14px 30px; min-width: 160px;
    background: var(--nexus-card-bg); backdrop-filter: blur(8px);
    border-radius: 100px; /* Capsule shape */
    text-decoration: none !important; cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid var(--nexus-border); overflow: hidden;
}

/* Hover Effects (Charging) */
.pm-host-nexus .nexus-card:hover {
    background: var(--nexus-card-hover);
    transform: translateY(-3px) scale(1.02);
    border-color: rgba(34, 211, 238, 0.3);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6), 0 0 15px rgba(34, 211, 238, 0.15);
}

/* Typography */
.pm-host-nexus .nexus-text {
    color: var(--nexus-text-muted); font-size: 0.95rem; font-weight: 500;
    letter-spacing: 0.5px; z-index: 2; transition: color 0.3s; white-space: nowrap;
}
.pm-host-nexus .nexus-card:hover .nexus-text {
    color: #fff; text-shadow: 0 0 10px rgba(255,255,255,0.3);
}

/* Indicator Light */
.pm-host-nexus .nexus-indicator {
    position: relative; width: 8px; height: 8px; border-radius: 50%;
    background-color: #334155; transition: all 0.4s; z-index: 2;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.5);
}
.pm-host-nexus .nexus-card:hover .nexus-indicator {
    background-color: var(--nexus-cyan);
    box-shadow: 0 0 8px var(--nexus-cyan), 0 0 15px var(--nexus-cyan);
}

/* Border Flow Effect */
.pm-host-nexus .nexus-border {
    position: absolute; inset: 0; border-radius: 100px; padding: 1px; 
    background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.5), transparent);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    opacity: 0; transition: opacity 0.4s;
}
.pm-host-nexus .nexus-card:hover .nexus-border { opacity: 1; }

/* Glare Effect */
.pm-host-nexus .nexus-glow {
    position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.03), transparent);
    transform: skewX(-20deg); transition: 0s; pointer-events: none;
}
.pm-host-nexus .nexus-card:hover .nexus-glow { left: 200%; transition: 0.6s ease; }

/* Responsive (Horizontal Scroll) */
@media (max-width: 768px) {
    .pm-host-nexus .nexus-grid {
        display: flex; flex-wrap: nowrap; overflow-x: auto;
        justify-content: flex-start; padding-bottom: 15px;
        -ms-overflow-style: none; scrollbar-width: none;
    }
    .pm-host-nexus .nexus-grid::-webkit-scrollbar { display: none; }
    .pm-host-nexus .nexus-card { flex-shrink: 0; padding: 12px 20px; min-width: auto; }
    .pm-host-nexus .nexus-text { font-size: 0.85rem; }
    
    /* Fade effect for scroll */
    .pm-host-nexus::after {
        content: ''; position: absolute; top: 0; left: 0; width: 30px; height: 100%;
        background: linear-gradient(to right, var(--nexus-bg), transparent);
        pointer-events: none; z-index: 30;
    }
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 3: BROWSER SHOWCASE (cPanel/WHMCS)
   Parent Class: .pm-host-browser
   ========================================================================== */
.pm-host-browser {
    /* --- Scoped Variables --- */
    --br-bg: #f8fafc;
    --br-text-dark: #0f172a;
    --br-text-light: #64748b;
    --br-border: #e2e8f0;
    --br-blue: #2563eb;
    --br-purple: #9333ea;
    --br-gold: #d97706;

    background-color: var(--br-bg);
    padding: 80px 0 100px 0;
    font-family: inherit; overflow: hidden;
    direction: rtl; /* Ensure RTL layout */
}

/* Header & Tabs */
.pm-host-browser .browser-header-text { text-align: center; margin-bottom: 50px; }
.pm-host-browser .section-headline { font-size: 2.2rem; font-weight: 800; color: var(--br-text-dark); margin-bottom: 25px; }
.pm-host-browser .text-gradient { background: linear-gradient(90deg, #2563eb, #06b6d4); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

.pm-host-browser .browser-tabs {
    display: inline-flex; gap: 8px;
    background: #fff; padding: 6px; border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    border: 1px solid var(--br-border);
}
.pm-host-browser .b-tab {
    border: none; background: transparent; padding: 10px 20px;
    font-size: 0.95rem; font-weight: 700; color: var(--br-text-light); cursor: pointer;
    border-radius: 8px; transition: 0.3s;
}
.pm-host-browser .b-tab.active { background: #eff6ff; color: var(--br-blue); }
.pm-host-browser .b-tab:hover:not(.active) { background: #f1f5f9; }

/* Grid & Slide Logic */
.pm-host-browser .browser-display-wrapper { position: relative; max-width: 1100px; margin: 0 auto; }
.pm-host-browser .browser-slide { display: none; animation: pm-host-fade-up 0.5s ease; }
.pm-host-browser .browser-slide.active { display: block; }
@keyframes pm-host-fade-up { from{opacity:0; transform:translateY(15px);} to{opacity:1; transform:translateY(0);} }

.pm-host-browser .browser-grid {
    display: grid; grid-template-columns: 1.2fr 1fr; gap: 50px; align-items: center;
}

/* Visual Col (The Mockup) */
.pm-host-browser .browser-visual-col {
    position: relative; padding: 20px; display: flex; justify-content: center;
}
/* Backdrops */
.pm-host-browser .backdrop-blob {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 100%; height: 100%; filter: blur(70px); opacity: 1; z-index: 0; border-radius: 50%;
}
.pm-host-browser .blue-blob { background: #bae6fd; }
.pm-host-browser .purple-blob { background: #e9d5ff; }
.pm-host-browser .gold-blob { background: #fde68a; }

/* Browser Window */
.pm-host-browser .browser-mockup {
    position: relative; z-index: 2; background: #fff;
    border-radius: 16px; box-shadow: 0 30px 60px -15px rgba(15, 23, 42, 0.15);
    border: 1px solid #cbd5e1; overflow: hidden; width: 100%;
}
.pm-host-browser .mockup-header {
    background: #f8fafc; padding: 12px 18px;
    border-bottom: 1px solid var(--br-border);
    display: flex; align-items: center; gap: 8px; direction: ltr; /* Dots on left */
}
.pm-host-browser .dot { width: 10px; height: 10px; border-radius: 50%; }
.pm-host-browser .red { background: #ef4444; } 
.pm-host-browser .yellow { background: #f59e0b; } 
.pm-host-browser .green { background: #22c55e; }

.pm-host-browser .address-bar {
    margin-left: 15px; background: #fff; color: #94a3b8;
    font-size: 0.7rem; padding: 5px 12px; border-radius: 6px;
    width: 100%; max-width: 250px; text-align: left; font-family: monospace;
    border: 1px solid var(--br-border); opacity: 0.8;
}

/* Mockup Body (Image Stage) */
.pm-host-browser .mockup-body {
    width: 100%; height: 400px;
    background: radial-gradient(circle at center, #ffffff 0%, #f1f5f9 100%);
    display: flex; align-items: center; justify-content: center;
    padding: 20px; position: relative;
}
.pm-host-browser .mockup-body img {
    width: 100%; height: 100%; object-fit: contain;
    filter: drop-shadow(0 15px 30px rgba(0,0,0,0.12));
    transform: scale(1.05); transition: transform 0.5s ease;
}
.pm-host-browser .browser-slide:hover .mockup-body img { transform: scale(1.1); }

/* Content Col */
.pm-host-browser .browser-content-col { padding: 10px; text-align: right; }

.pm-host-browser .tag-label {
    display: inline-block; padding: 6px 14px; border-radius: 30px;
    font-size: 0.8rem; font-weight: 700; margin-bottom: 20px;
}
.pm-host-browser .blue-tag { background: #eff6ff; color: var(--br-blue); }
.pm-host-browser .purple-tag { background: #f3e8ff; color: var(--br-purple); }
.pm-host-browser .gold-tag { background: #fffbeb; color: var(--br-gold); }

.pm-host-browser .content-title { font-size: 2.2rem; font-weight: 900; color: var(--br-text-dark); margin-bottom: 20px; line-height: 1.3; }
.pm-host-browser .content-desc { font-size: 1.05rem; line-height: 1.8; color: #475569; margin-bottom: 35px; }

.pm-host-browser .spec-grid { display: flex; gap: 30px; margin-bottom: 35px; border-top: 1px solid var(--br-border); padding-top: 25px; }
.pm-host-browser .spec-item { display: flex; flex-direction: column; }
.pm-host-browser .spec-item strong { font-size: 1.3rem; color: var(--br-text-dark); font-weight: 800; letter-spacing: -0.5px; }
.pm-host-browser .spec-item span { font-size: 0.85rem; color: var(--br-text-light); margin-top: 4px; }

.pm-host-browser .action-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 14px 40px; border-radius: 12px;
    color: #fff; font-weight: 700; text-decoration: none; font-size: 1rem;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1); transition: all 0.3s ease;
}
.pm-host-browser .action-btn:hover { transform: translateY(-3px); box-shadow: 0 15px 35px rgba(0,0,0,0.2); }
.pm-host-browser .blue-btn { background: var(--br-blue); }
.pm-host-browser .purple-btn { background: var(--br-purple); }
.pm-host-browser .gold-btn { background: var(--br-gold); }

/* Responsive */
@media (max-width: 992px) {
    .pm-host-browser .browser-grid { grid-template-columns: 1fr; gap: 30px; }
    .pm-host-browser .browser-content-col { text-align: center; }
    .pm-host-browser .spec-grid { justify-content: center; }
    .pm-host-browser .mockup-body { height: 300px; }
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 4: TRUST & FEATURES (Crystal Cards)
   Parent Class: .pm-host-trust
   ========================================================================== */
.pm-host-trust {
    /* --- Scoped Variables --- */
    --trust-bg: #0B1120;
    --trust-card-bg: rgba(30, 41, 59, 0.2);
    --trust-card-hover: rgba(30, 41, 59, 0.5);
    --trust-border: rgba(255, 255, 255, 0.05);
    --trust-neon: #38bdf8;
    --trust-text-muted: #94a3b8;

    background-color: var(--trust-bg);
    padding: 100px 0; position: relative; overflow: hidden;
    direction: rtl; color: #fff; font-family: inherit;
}

/* Background Mesh Pattern */
.pm-host-trust .tr-v3-bg-mesh {
    position: absolute; inset: 0;
    background-image: radial-gradient(#1e293b 1px, transparent 1px);
    background-size: 30px 30px; opacity: 0.3; pointer-events: none;
}
.pm-host-trust .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-host-trust .tr-v3-header { text-align: center; max-width: 750px; margin: 0 auto 70px; }
.pm-host-trust .tr-v3-title { font-size: 2.5rem; font-weight: 800; margin-bottom: 20px; }
.pm-host-trust .text-neon-blue { color: var(--trust-neon); text-shadow: 0 0 25px rgba(56, 189, 248, 0.5); }
.pm-host-trust .tr-v3-subtitle { color: var(--trust-text-muted); font-size: 1.1rem; line-height: 1.7; }

/* Grid Layout */
.pm-host-trust .tr-v3-grid {
    display: grid; grid-template-columns: 1fr 1.2fr; gap: 70px; align-items: center;
}

/* Content Side (Cards) */
.pm-host-trust .tr-v3-content-side { display: flex; flex-direction: column; gap: 30px; }

.pm-host-trust .tr-v3-card {
    display: flex; align-items: center; gap: 25px; padding: 25px 30px;
    background: var(--trust-card-bg); border: 1px solid var(--trust-border);
    border-radius: 24px; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative; overflow: hidden;
}
/* Hover & Active */
.pm-host-trust .tr-v3-card:hover, 
.pm-host-trust .tr-v3-card.active {
    background: var(--trust-card-hover);
    border-color: rgba(56, 189, 248, 0.3);
    transform: translateX(-15px);
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.4);
}

/* Icon Styling */
.pm-host-trust .tr-v3-icon-wrapper {
    position: relative; flex-shrink: 0; width: 90px; height: 90px;
    display: flex; align-items: center; justify-content: center;
}
.pm-host-trust .icon-glow {
    position: absolute; inset: 0; border-radius: 50%;
    filter: blur(25px); opacity: 0.2; transition: 0.4s;
}
.pm-host-trust .glow-green { background: #22c55e; }
.pm-host-trust .glow-blue { background: #3b82f6; }
.pm-host-trust .glow-purple { background: #a855f7; }

.pm-host-trust .tr-v3-card:hover .icon-glow, 
.pm-host-trust .tr-v3-card.active .icon-glow {
    opacity: 0.6; filter: blur(35px);
}

.pm-host-trust .tr-v3-icon {
    width: 100%; height: 100%; object-fit: contain;
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.5)); transition: transform 0.4s;
}
.pm-host-trust .tr-v3-card:hover .tr-v3-icon, 
.pm-host-trust .tr-v3-card.active .tr-v3-icon {
    transform: scale(1.15) rotate(-5deg);
}

/* Text Content */
.pm-host-trust .tr-v3-text h3 { font-size: 1.3rem; font-weight: 800; color: #fff; margin-bottom: 8px; }
.pm-host-trust .tr-v3-text p { font-size: 1rem; color: #cbd5e1; line-height: 1.6; margin: 0; }

/* Visual Side */
.pm-host-trust .tr-v3-visual-side { display: flex; justify-content: center; order: -1; }
.pm-host-trust .tr-v3-shield-container {
    position: relative; width: 450px; height: 450px;
    display: flex; justify-content: center; align-items: center;
}
.pm-host-trust .shield-back-glow {
    position: absolute; width: 300px; height: 300px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.25) 0%, transparent 70%);
    filter: blur(60px); animation: pm-trust-pulse 4s infinite alternate;
}
.pm-host-trust .tr-v3-main-img {
    width: 100%; height: auto;
    filter: drop-shadow(0 30px 60px rgba(0,0,0,0.5));
    animation: pm-trust-float 6s ease-in-out infinite;
    position: relative; z-index: 2;
}
.pm-host-trust .tr-v3-status-badge {
    position: absolute; bottom: 40px; right: 20px; z-index: 3;
    background: rgba(15, 23, 42, 0.85);
    border: 1px solid rgba(56, 189, 248, 0.3);
    padding: 10px 20px; border-radius: 50px;
    color: #fff; font-size: 0.9rem;
    display: flex; align-items: center; gap: 10px;
    backdrop-filter: blur(10px);
}
.pm-host-trust .pulse-ring {
    width: 10px; height: 10px; background: #22c55e; border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
    animation: pm-trust-ring 2s infinite;
}

/* Animations (Scoped) */
@keyframes pm-trust-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-15px);} }
@keyframes pm-trust-pulse { 0%{opacity: 0.6;} 100%{opacity: 1;} }
@keyframes pm-trust-ring { 
    0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7); } 
    70% { box-shadow: 0 0 0 10px rgba(0,0,0,0); } 
    100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); } 
}

/* Responsive */
@media (max-width: 992px) {
    .pm-host-trust .tr-v3-grid { grid-template-columns: 1fr; gap: 50px; }
    .pm-host-trust .tr-v3-visual-side { order: -1; }
    .pm-host-trust .tr-v3-card { flex-direction: column; text-align: center; gap: 15px; padding: 30px 20px; }
    .pm-host-trust .tr-v3-card:hover, .pm-host-trust .tr-v3-card.active { transform: translateY(-5px); }
    .pm-host-trust .tr-v3-shield-container { width: 320px; height: 320px; }
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 5: ULTRA PLANS (Spotlight Effect)
   Parent Class: .pm-host-ultra
   ========================================================================== */
.pm-host-ultra {
    /* --- Scoped Variables --- */
    --ultra-bg: #f8fafc;
    --ultra-text-dark: #0f172a;
    --ultra-text-light: #64748b;
    --ultra-blue: #2563eb;
    --ultra-cyan: #06b6d4;
    --ultra-card-bg: rgba(255, 255, 255, 0.8);
    --ultra-border: rgba(255, 255, 255, 0.6);

    background-color: var(--ultra-bg);
    padding: 100px 0; position: relative; overflow: hidden;
    font-family: inherit; direction: rtl;
}

/* Background Glow */
.pm-host-ultra .ultra-bg-glow {
    position: absolute; top: -20%; left: 50%; transform: translateX(-50%);
    width: 80%; height: 600px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.05) 0%, transparent 70%);
    z-index: 0; pointer-events: none;
}
.pm-host-ultra .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-host-ultra .ultra-header { text-align: center; max-width: 800px; margin: 0 auto 70px; }
.pm-host-ultra .ultra-title { font-size: 2.8rem; font-weight: 900; color: var(--ultra-text-dark); margin-bottom: 20px; letter-spacing: -1px; }
.pm-host-ultra .highlight-text { 
    background: linear-gradient(120deg, var(--ultra-blue) 0%, var(--ultra-cyan) 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-host-ultra .ultra-subtitle { font-size: 1.15rem; color: var(--ultra-text-light); line-height: 1.8; }

/* Grid System */
.pm-host-ultra .ultra-grid {
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 25px; perspective: 1000px;
}

/* Card Styling */
.pm-host-ultra .plan-card {
    position: relative; width: 340px;
    background: var(--ultra-card-bg);
    border: 1px solid var(--ultra-border);
    border-radius: 24px; padding: 2px;
    cursor: pointer; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    overflow: hidden; box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.05);
}

.pm-host-ultra .card-content {
    background: #ffffff; border-radius: 22px; padding: 30px;
    height: 100%; position: relative; z-index: 2;
    display: flex; flex-direction: column;
}

/* Spotlight Effect */
.pm-host-ultra .card-spotlight {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: radial-gradient(
        600px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
        rgba(37, 99, 235, 0.1), transparent 40%
    );
    opacity: 0; transition: opacity 0.3s; pointer-events: none; z-index: 1;
}

/* Hover State */
.pm-host-ultra .plan-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 25px 50px -12px rgba(37, 99, 235, 0.15);
    border-color: rgba(37, 99, 235, 0.2);
}
.pm-host-ultra .plan-card:hover .card-spotlight { opacity: 1; }

/* Featured Card */
.pm-host-ultra .plan-card.featured-card {
    transform: scale(1.05);
    border: 1px solid rgba(37, 99, 235, 0.3);
    box-shadow: 0 20px 40px -10px rgba(37, 99, 235, 0.1);
    z-index: 5;
}
.pm-host-ultra .plan-card.featured-card:hover { transform: scale(1.08) translateY(-10px); }

/* Badge */
.pm-host-ultra .plan-badge {
    position: absolute; top: 20px; left: 20px;
    background: #f1f5f9; color: #475569;
    font-size: 0.75rem; font-weight: 700;
    padding: 6px 12px; border-radius: 30px;
}
.pm-host-ultra .featured-card .plan-badge {
    background: linear-gradient(90deg, var(--ultra-blue), #3b82f6);
    color: #fff; box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
}

/* Icon Area */
.pm-host-ultra .plan-icon-area {
    position: relative; width: 90px; height: 90px;
    margin: 0 auto 20px auto;
    display: flex; justify-content: center; align-items: center;
}
.pm-host-ultra .icon-blob {
    position: absolute; inset: 0;
    background: radial-gradient(circle, #f1f5f9 0%, transparent 70%);
    border-radius: 50%; z-index: 0; transition: 0.4s;
}
.pm-host-ultra .plan-img {
    position: relative; z-index: 1; width: 80px; height: 80px; object-fit: contain;
    transition: transform 0.4s; filter: drop-shadow(0 10px 15px rgba(0,0,0,0.1));
}
.pm-host-ultra .plan-card:hover .plan-img { transform: scale(1.15) rotate(-5deg); }
.pm-host-ultra .plan-card:hover .icon-blob { transform: scale(1.2); background: radial-gradient(circle, #eff6ff 0%, transparent 70%); }

/* Content */
.pm-host-ultra .plan-name { font-size: 1.5rem; font-weight: 800; color: var(--ultra-text-dark); margin-bottom: 10px; text-align: center; }
.pm-host-ultra .plan-desc { font-size: 0.95rem; color: var(--ultra-text-light); line-height: 1.6; text-align: center; margin-bottom: 25px; flex-grow: 1; }
.pm-host-ultra .plan-divider { height: 1px; background: #f1f5f9; width: 100%; margin-bottom: 20px; }

/* Price & Action */
.pm-host-ultra .plan-price-area { display: flex; justify-content: space-between; align-items: center; }
.pm-host-ultra .price-data { display: flex; flex-direction: column; }
.pm-host-ultra .price-data .amount { font-size: 1.3rem; font-weight: 800; color: var(--ultra-text-dark); }
.pm-host-ultra .price-data .unit { font-size: 0.8rem; color: var(--ultra-text-light); }

.pm-host-ultra .plan-btn {
    width: 45px; height: 45px; border-radius: 12px;
    background: #f8fafc; border: 1px solid #e2e8f0;
    color: var(--ultra-text-dark); cursor: pointer;
    display: flex; align-items: center; justify-content: center; transition: 0.3s;
}
.pm-host-ultra .plan-card:hover .plan-btn {
    background: var(--ultra-blue); border-color: var(--ultra-blue); color: #fff;
    transform: rotate(-10deg) scale(1.1);
    box-shadow: 0 5px 15px rgba(37, 99, 235, 0.3);
}

/* Responsive */
@media (max-width: 768px) {
    .pm-host-ultra .ultra-grid { flex-direction: column; align-items: center; }
    .pm-host-ultra .plan-card { width: 100%; max-width: 400px; }
    .pm-host-ultra .plan-card.featured-card { transform: scale(1); margin: 10px 0; }
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 6: THE TECH HALL (Holographic Pedestals)
   Parent Class: .pm-host-tech
   ========================================================================== */
.pm-host-tech {
    /* --- Scoped Variables --- */
    --tech-bg: #010409;
    --tech-border: rgba(255,255,255,0.1);
    --tech-cyan: #22d3ee;
    --tech-blue: #3b82f6;
    --tech-purple: #a855f7;
    --tech-orange: #f59e0b;
    --tech-text-muted: #94a3b8;

    background-color: var(--tech-bg);
    padding: 120px 0; position: relative; overflow: hidden;
    direction: rtl; color: #fff; perspective: 1000px; font-family: inherit;
}

/* Background Floor */
.pm-host-tech .tech-hub-floor {
    position: absolute; bottom: 0; left: 0; width: 100%; height: 50%;
    background-image: 
        linear-gradient(to bottom, transparent, rgba(34, 211, 238, 0.1)),
        linear-gradient(90deg, rgba(34, 211, 238, 0.05) 1px, transparent 1px),
        linear-gradient(0deg, rgba(34, 211, 238, 0.05) 1px, transparent 1px);
    background-size: 100% 100%, 40px 40px, 40px 40px;
    transform: perspective(500px) rotateX(60deg);
    opacity: 0.3; pointer-events: none;
}
.pm-host-tech .tech-hub-bg-glow {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 80%; height: 80%;
    background: radial-gradient(circle, rgba(30, 64, 175, 0.2) 0%, transparent 70%);
    filter: blur(100px); opacity: 0.5; z-index: 0;
}
.pm-host-tech .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-host-tech .tech-hub-header { text-align: center; max-width: 800px; margin: 0 auto 80px; padding: 0 20px; }
.pm-host-tech .tech-hub-title { font-size: 2.6rem; font-weight: 900; margin-bottom: 20px; letter-spacing: -1px; }
.pm-host-tech .neon-text-cyan { color: var(--tech-cyan); text-shadow: 0 0 15px rgba(34, 211, 238, 0.8); }
.pm-host-tech .tech-hub-subtitle { color: var(--tech-text-muted); font-size: 1.15rem; line-height: 1.8; }

/* Grid System */
.pm-host-tech .tech-hub-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 30px; align-items: flex-start;
}

/* Individual Pedestal Item */
.pm-host-tech .tech-pedestal {
    position: relative; display: flex; flex-direction: column; align-items: center;
    padding: 30px 20px;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0) 0%, rgba(15, 23, 42, 0.8) 100%);
    border-radius: 20px; border-bottom: 3px solid var(--tech-border);
    transition: all 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: default; width: 100%; box-sizing: border-box;
}
.pm-host-tech .tech-pedestal:hover {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.2) 0%, rgba(30, 41, 59, 0.9) 100%);
    transform: translateY(-10px);
}

/* Base Ring */
.pm-host-tech .pedestal-base {
    position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
    width: 100%; height: 60px; display: flex; justify-content: center; align-items: flex-end;
    opacity: 0.5; transition: opacity 0.7s ease;
}
.pm-host-tech .tech-pedestal:hover .pedestal-base { opacity: 1; }
.pm-host-tech .energy-ring {
    width: 80%; height: 20px; border-radius: 50%; background: transparent;
    box-shadow: 0 0 20px rgba(255,255,255,0.2); filter: blur(5px);
    transition: all 0.7s ease;
}

/* Hologram Image */
.pm-host-tech .holo-stage {
    position: relative; width: 200px; height: 200px;
    display: flex; justify-content: center; align-items: center; margin-bottom: 30px;
}
.pm-host-tech .holo-object {
    width: 100%; height: auto; object-fit: contain;
    filter: drop-shadow(0 20px 30px rgba(0,0,0,0.6));
    animation: pm-tech-float 6s ease-in-out infinite;
    transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.6s ease;
}
.pm-host-tech .tech-pedestal:hover .holo-object {
    transform: scale(1.15) translateY(-10px);
    filter: drop-shadow(0 30px 50px rgba(0,0,0,0.8));
}

/* Content */
.pm-host-tech .tech-content { text-align: center; position: relative; z-index: 2; width: 100%; }
.pm-host-tech .tech-content h3 {
    font-size: 1.3rem; font-weight: 800; color: #fff; margin-bottom: 10px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5); transition: color 0.4s ease;
}
.pm-host-tech .tech-content p {
    font-size: 0.95rem; color: #cbd5e1; line-height: 1.7;
    max-height: 0; opacity: 0; transform: translateY(10px);
    overflow: hidden; margin-top: 0;
    transition: max-height 0.8s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.6s ease 0.2s, transform 0.6s ease 0.2s, margin-top 0.6s ease;
}
.pm-host-tech .tech-pedestal:hover .tech-content p {
    max-height: 200px; opacity: 1; transform: translateY(0); margin-top: 15px;
}

/* Themes */
.pm-host-tech .theme-cyan:hover { border-bottom-color: var(--tech-cyan); }
.pm-host-tech .theme-cyan:hover .energy-ring { box-shadow: 0 0 30px var(--tech-cyan), inset 0 0 20px var(--tech-cyan); background: rgba(34, 211, 238, 0.1); }
.pm-host-tech .theme-cyan:hover h3 { color: var(--tech-cyan); text-shadow: 0 0 10px rgba(34, 211, 238, 0.5); }
.pm-host-tech .theme-cyan .holo-object { animation-delay: 0s; }

.pm-host-tech .theme-blue:hover { border-bottom-color: var(--tech-blue); }
.pm-host-tech .theme-blue:hover .energy-ring { box-shadow: 0 0 30px var(--tech-blue), inset 0 0 20px var(--tech-blue); background: rgba(59, 130, 246, 0.1); }
.pm-host-tech .theme-blue:hover h3 { color: var(--tech-blue); text-shadow: 0 0 10px rgba(59, 130, 246, 0.5); }
.pm-host-tech .theme-blue .holo-object { animation-delay: 0.5s; }

.pm-host-tech .theme-purple:hover { border-bottom-color: var(--tech-purple); }
.pm-host-tech .theme-purple:hover .energy-ring { box-shadow: 0 0 30px var(--tech-purple), inset 0 0 20px var(--tech-purple); background: rgba(168, 85, 247, 0.1); }
.pm-host-tech .theme-purple:hover h3 { color: var(--tech-purple); text-shadow: 0 0 10px rgba(168, 85, 247, 0.5); }
.pm-host-tech .theme-purple .holo-object { animation-delay: 1s; }

.pm-host-tech .theme-orange:hover { border-bottom-color: var(--tech-orange); }
.pm-host-tech .theme-orange:hover .energy-ring { box-shadow: 0 0 30px var(--tech-orange), inset 0 0 20px var(--tech-orange); background: rgba(245, 158, 11, 0.1); }
.pm-host-tech .theme-orange:hover h3 { color: var(--tech-orange); text-shadow: 0 0 10px rgba(245, 158, 11, 0.5); }
.pm-host-tech .theme-orange .holo-object { animation-delay: 1.5s; }

@keyframes pm-tech-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-15px);} }

/* Responsive */
@media (max-width: 1200px) {
    .pm-host-tech .tech-hub-grid { gap: 20px; }
}
@media (max-width: 992px) {
    .pm-host-tech .tech-hub-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    .pm-host-tech .tech-content p { max-height: 200px; opacity: 1; transform: translateY(0); margin-top: 15px; }
}
@media (max-width: 576px) {
    .pm-host-tech .tech-hub-grid { grid-template-columns: 1fr; }
    .pm-host-tech .tech-pedestal { padding-bottom: 40px; }
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 7: MASTERPIECE STATS (Bento Grid)
   Parent Class: .pm-host-stats
   ========================================================================== */
.pm-host-stats {
    /* --- Scoped Variables --- */
    --stats-bg: #fcfcfc;
    --stats-text-dark: #0f172a;
    --stats-text-muted: #64748b;
    --stats-border: rgba(255, 255, 255, 0.9);
    --stats-glass: rgba(255, 255, 255, 0.75);
    --stats-blue: #2563eb;
    --stats-green: #059669;
    --stats-orange: #ea580c;
    --stats-purple: #9333ea;

    background-color: var(--stats-bg);
    padding: 120px 0; position: relative; overflow: hidden;
    font-family: inherit; direction: rtl;
}

/* Dotted Pattern */
.pm-host-stats .mp-bg-dots {
    position: absolute; inset: 0;
    background-image: radial-gradient(#cbd5e1 1.5px, transparent 1.5px);
    background-size: 30px 30px; opacity: 0.6; pointer-events: none; z-index: 0;
}

/* Animated Blobs */
.pm-host-stats .mp-blobs { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.pm-host-stats .blob {
    position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.5;
    animation: pm-stats-blob 20s infinite alternate;
}
.pm-host-stats .blob-1 {
    top: -10%; right: -10%; width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.1), transparent 70%);
}
.pm-host-stats .blob-2 {
    bottom: -10%; left: -10%; width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.1), transparent 70%);
}
.pm-host-stats .relative-z { position: relative; z-index: 2; }

/* Layout Wrapper */
.pm-host-stats .mp-wrapper {
    display: grid; grid-template-columns: 1.1fr 1fr; gap: 80px; align-items: center;
}

/* Visual Side (Typography) */
.pm-host-stats .mp-visual-col {
    position: relative; display: flex; justify-content: center; align-items: center;
    min-height: 500px;
}
.pm-host-stats .mp-image-stage {
    position: relative; width: 100%; max-width: 600px;
    animation: pm-stats-float 6s ease-in-out infinite;
}
.pm-host-stats .typo-glow {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 70%; height: 60%;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.2), transparent 70%);
    filter: blur(50px); z-index: -1;
}
.pm-host-stats .mp-typography-img {
    width: 100%; height: auto; filter: drop-shadow(0 20px 40px rgba(15, 23, 42, 0.1));
    z-index: 2; position: relative;
}
.pm-host-stats .trust-floating-badge {
    position: absolute; bottom: 0; left: 10%; z-index: 3;
    background: #ffffff; padding: 12px 24px; border-radius: 50px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08); display: flex; align-items: center; gap: 10px;
    border: 1px solid #f1f5f9; font-size: 0.95rem; color: #334155; font-weight: 700;
    animation: pm-stats-bounce 4s ease-in-out infinite;
}
.pm-host-stats .check-mark {
    width: 24px; height: 24px; background: #dcfce7; color: #16a34a;
    border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.8rem;
}
.pm-host-stats .floating-particle {
    position: absolute; border-radius: 50%;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    box-shadow: 0 5px 15px rgba(37, 99, 235, 0.3);
    animation: pm-stats-particle 5s infinite;
}
.pm-host-stats .p1 { width: 14px; height: 14px; top: 10%; right: 10%; }
.pm-host-stats .p2 { width: 10px; height: 10px; bottom: 30%; left: 5%; animation-delay: 2s; }

/* Stats Side (Bento Grid) */
.pm-host-stats .mp-header { margin-bottom: 40px; }
.pm-host-stats .mp-title { font-size: 2.2rem; font-weight: 900; color: var(--stats-text-dark); margin-bottom: 15px; }
.pm-host-stats .text-gradient { 
    background: linear-gradient(90deg, #2563eb, #06b6d4); 
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; 
}
.pm-host-stats .mp-desc { color: var(--stats-text-muted); font-size: 1.05rem; }

.pm-host-stats .mp-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}

/* Glass Card */
.pm-host-stats .glass-card {
    background: var(--stats-glass); backdrop-filter: blur(12px);
    border: 1px solid var(--stats-border); border-radius: 28px; padding: 24px;
    box-shadow: 0 10px 25px -5px rgba(148, 163, 184, 0.1);
    display: flex; flex-direction: column; justify-content: space-between;
    transition: all 0.3s ease; position: relative; transform-style: preserve-3d;
}
.pm-host-stats .glass-card:hover {
    background: rgba(255, 255, 255, 0.95); border-color: #fff;
    box-shadow: 0 20px 40px -10px rgba(37, 99, 235, 0.15); transform: translateY(-5px);
}
.pm-host-stats .overflow-hidden { overflow: hidden; }

/* Card Content */
.pm-host-stats .card-header-simple {
    display: flex; align-items: center; justify-content: space-between; width: 100%; margin-bottom: 10px;
}
.pm-host-stats .mp-label { font-size: 0.9rem; font-weight: 700; color: var(--stats-text-muted); }
.pm-host-stats .icon-mini {
    width: 36px; height: 36px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
}
.pm-host-stats .bg-green { background: #d1fae5; color: var(--stats-green); }
.pm-host-stats .bg-blue { background: #dbeafe; color: var(--stats-blue); }

/* Chart */
.pm-host-stats .chart-center { display: flex; justify-content: center; align-items: center; flex-grow: 1; padding: 10px 0; }
.pm-host-stats .chart-container { position: relative; width: 120px; height: 120px; }
.pm-host-stats .progress-ring__circle { 
    transition: stroke-dashoffset 1.5s ease-out; transform: rotate(-90deg); 
    transform-origin: 50% 50%; stroke-linecap: round; 
}
.pm-host-stats .chart-text {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    font-size: 1.8rem; font-weight: 800; color: var(--stats-text-dark);
}

/* Big Number Card */
.pm-host-stats .stat-center-big { display: flex; justify-content: center; align-items: center; flex-grow: 1; z-index: 2; position: relative; }
.pm-host-stats .stat-big-number { font-size: 2.4rem; font-weight: 900; color: var(--stats-text-dark); }
.pm-host-stats .plus { color: var(--stats-blue); font-size: 1.6rem; margin-left: 5px; }
.pm-host-stats .wave-graph { position: absolute; bottom: 0; left: 0; width: 100%; height: 60px; z-index: 1; }

/* Wide Card */
.pm-host-stats .wide-card { grid-column: span 2; padding: 30px; }
.pm-host-stats .flex-row-center { display: flex; align-items: center; gap: 25px; width: 100%; }
.pm-host-stats .icon-box-large {
    width: 65px; height: 65px; border-radius: 20px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    background: #fff7ed; color: var(--stats-orange);
}
.pm-host-stats .text-group-wide { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; }
.pm-host-stats .stat-row { display: flex; align-items: baseline; margin-bottom: 8px; }
.pm-host-stats .big-font { font-size: 2.2rem; font-weight: 900; color: var(--stats-text-dark); line-height: 1; }
.pm-host-stats .suffix { font-size: 1.1rem; font-weight: 700; color: #475569; margin-right: 10px; }
.pm-host-stats .progress-line-container {
    width: 100%; height: 8px; background: #f1f5f9; border-radius: 4px; margin-bottom: 8px; overflow: hidden;
}
.pm-host-stats .progress-line-fill {
    height: 100%; background: linear-gradient(90deg, #f97316, #fbbf24);
    border-radius: 4px; width: 0; transition: width 1.5s ease-out;
}
.pm-host-stats .text-group-wide small { color: var(--stats-text-muted); font-size: 0.9rem; }

/* Hosted Card */
.pm-host-stats .host-stat-layout { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.pm-host-stats .mp-tag-purple {
    background: #f3e8ff; color: var(--stats-purple); padding: 8px 16px; border-radius: 30px;
    font-size: 0.9rem; font-weight: 700;
}
.pm-host-stats .stat-huge-number { font-size: 2.8rem; font-weight: 900; color: var(--stats-text-dark); }
.pm-host-stats .purple-text { color: #7c3aed; }
.pm-host-stats .plus-icon { font-size: 1.8rem; color: #a855f7; vertical-align: top; }

/* Animations (Scoped) */
@keyframes pm-stats-blob { 0%{transform: translate(0,0) scale(1);} 100%{transform: translate(50px, -50px) scale(1.1);} }
@keyframes pm-stats-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-15px);} }
@keyframes pm-stats-bounce { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-5px);} }
@keyframes pm-stats-particle { 0%,100%{transform: translate(0,0);} 50%{transform: translate(10px, -20px);} }

/* Responsive */
@media (max-width: 992px) {
    .pm-host-stats .mp-wrapper { grid-template-columns: 1fr; gap: 60px; }
    .pm-host-stats .mp-visual-col { order: -1; min-height: auto; margin-bottom: 30px; }
    .pm-host-stats .wide-card { grid-column: span 1; }
    .pm-host-stats .flex-row-center { flex-direction: column; text-align: center; }
    .pm-host-stats .text-group-wide { align-items: center; }
    .pm-host-stats .stat-row { justify-content: center; }
}
@media (max-width: 576px) {
    .pm-host-stats .mp-grid { grid-template-columns: 1fr; }
    .pm-host-stats .wide-card { grid-column: span 1; }
}
/* ==========================================================================
   PAGE: HOSTING | SECTION 8: FAQ MASTERPIECE (Accordion)
   Parent Class: .pm-host-faq
   ========================================================================== */
.pm-host-faq {
    /* --- Scoped Variables --- */
    --faq-bg: #0b1120;
    --faq-card-bg: rgba(30, 41, 59, 0.25);
    --faq-card-hover: rgba(30, 41, 59, 0.5);
    --faq-card-active: rgba(15, 23, 42, 0.6);
    --faq-border: rgba(255, 255, 255, 0.06);
    --faq-neon: #38bdf8;
    --faq-text-muted: #94a3b8;

    background-color: var(--faq-bg);
    padding: 100px 0 80px; position: relative; overflow: hidden;
    direction: rtl; color: #fff; font-family: inherit;
}

/* Background Effects */
.pm-host-faq .ambient-glow-top {
    position: absolute; top: -150px; left: 50%; transform: translateX(-50%);
    width: 80%; height: 500px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.15) 0%, transparent 70%);
    filter: blur(80px); z-index: 0; pointer-events: none;
}
.pm-host-faq .bg-pattern-dots {
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 40px 40px; opacity: 0.3; pointer-events: none; z-index: 0;
}
.pm-host-faq .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-host-faq .faq-header-wrapper {
    text-align: center; margin-bottom: 60px;
    display: flex; flex-direction: column; align-items: center;
}
.pm-host-faq .faq-3d-icon-box {
    margin-bottom: 20px; filter: drop-shadow(0 0 30px rgba(56, 189, 248, 0.2));
}
.pm-host-faq .faq-3d-icon-box img { display: block; max-width: 100%; height: auto; }
.pm-host-faq .floating-anim { animation: pm-faq-float 6s ease-in-out infinite; }

.pm-host-faq .faq-main-title { font-size: 2.2rem; font-weight: 800; margin-bottom: 15px; color: #fff; }
.pm-host-faq .highlight-cyan { 
    color: var(--faq-neon); text-shadow: 0 0 20px rgba(56, 189, 248, 0.5); 
}
.pm-host-faq .faq-subtitle { color: var(--faq-text-muted); font-size: 1.05rem; max-width: 600px; line-height: 1.6; }

/* FAQ Grid */
.pm-host-faq .faq-grid-container {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 20px; max-width: 1100px; margin: 0 auto;
}

/* Card Style */
.pm-host-faq .faq-item {
    background: var(--faq-card-bg); border: 1px solid var(--faq-border);
    border-radius: 18px; overflow: hidden; cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative;
}
.pm-host-faq .faq-item:hover {
    background: var(--faq-card-hover); border-color: rgba(255, 255, 255, 0.15);
    transform: translateY(-2px);
}
.pm-host-faq .faq-item.active {
    background: var(--faq-card-active); border-color: rgba(56, 189, 248, 0.3);
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.5);
}

/* Question Row */
.pm-host-faq .faq-question-row {
    padding: 22px 25px; display: flex; align-items: center; gap: 15px; user-select: none;
}
.pm-host-faq .q-icon-wrapper {
    color: #64748b; transition: 0.3s; display: flex; align-items: center; justify-content: center;
}
.pm-host-faq .faq-item.active .q-icon-wrapper { 
    color: var(--faq-neon); filter: drop-shadow(0 0 8px rgba(56,189,248,0.4)); 
}
.pm-host-faq .q-text {
    flex-grow: 1; font-size: 1.05rem; font-weight: 700; color: #e2e8f0; margin: 0; transition: 0.3s;
}
.pm-host-faq .faq-item.active .q-text { color: #fff; }
.pm-host-faq .toggle-indicator {
    color: #64748b; transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.pm-host-faq .faq-item.active .toggle-indicator { transform: rotate(180deg); color: var(--faq-neon); }

/* Answer Animation */
.pm-host-faq .faq-answer-wrapper {
    display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.pm-host-faq .faq-item.active .faq-answer-wrapper { grid-template-rows: 1fr; }
.pm-host-faq .faq-answer-content { overflow: hidden; position: relative; }

.pm-host-faq .answer-text {
    padding: 0 60px 25px 25px; color: var(--faq-text-muted);
    font-size: 0.95rem; line-height: 1.8; opacity: 0;
    transform: translateY(-10px); transition: all 0.4s ease;
}
.pm-host-faq .faq-item.active .answer-text { 
    opacity: 1; transform: translateY(0); transition-delay: 0.1s; 
}

/* Decor Line */
.pm-host-faq .answer-decor-line {
    position: absolute; top: 5px; bottom: 30px; right: 30px;
    width: 2px; border-radius: 2px;
    background: linear-gradient(to bottom, var(--faq-neon), transparent);
    opacity: 0; transition: 0.4s;
}
.pm-host-faq .faq-item.active .answer-decor-line { opacity: 1; }

/* Active Glow Border */
.pm-host-faq .active-glow-border {
    position: absolute; bottom: 0; left: 0; width: 0%; height: 2px;
    background: var(--faq-neon); box-shadow: 0 0 15px var(--faq-neon);
    transition: width 0.6s ease; margin: 0 auto; right: 0;
}
.pm-host-faq .faq-item.active .active-glow-border { width: 100%; }

/* Animation (Scoped) */
@keyframes pm-faq-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-15px);} }

/* Responsive */
@media (max-width: 768px) {
    .pm-host-faq .faq-grid-container { grid-template-columns: 1fr; }
    .pm-host-faq .faq-header-wrapper { margin-bottom: 40px; }
    .pm-host-faq .answer-text { padding: 0 20px 20px 20px; }
    .pm-host-faq .answer-decor-line { display: none; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 1: JAGUAR HERO
   Parent Class: .pm-wp-hero
   ========================================================================== */
.pm-wp-hero {
    /* --- Scoped Variables --- */
    --wp-bg: #020617;
    --wp-cyan: #38bdf8;
    --wp-blue: #2563eb;
    --wp-text-muted: #94a3b8;
    --wp-border: rgba(56, 189, 248, 0.3);

    background-color: var(--wp-bg);
    padding: 140px 0 100px;
    position: relative; overflow: hidden;
    direction: rtl; color: #fff; min-height: 750px;
    display: flex; align-items: center; font-family: inherit;
}

/* Background Atmosphere */
.pm-wp-hero .jaguar-bg-grid {
    position: absolute; inset: 0;
    background-image: 
        linear-gradient(rgba(56, 189, 248, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, 0.03) 1px, transparent 1px);
    background-size: 50px 50px; opacity: 0.4;
    mask-image: radial-gradient(circle at center, black 40%, transparent 90%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 90%);
}
.pm-wp-hero .jaguar-ambient-light {
    position: absolute; top: -30%; right: -10%; width: 800px; height: 800px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.25), transparent 70%);
    filter: blur(120px); z-index: 0;
}
.pm-wp-hero .relative-z { position: relative; z-index: 2; width: 100%; }

/* Layout Wrapper */
.pm-wp-hero .jaguar-wrapper {
    display: grid; grid-template-columns: 1.1fr 1fr; gap: 60px; align-items: center;
}

/* Content Column */
.pm-wp-hero .series-badge {
    display: inline-flex; align-items: center; gap: 10px;
    background: rgba(15, 23, 42, 0.6); border: 1px solid var(--wp-border);
    padding: 6px 14px; border-radius: 4px; margin-bottom: 25px;
    backdrop-filter: blur(5px);
}
.pm-wp-hero .status-dot {
    width: 8px; height: 8px; background: var(--wp-cyan); border-radius: 50%;
    box-shadow: 0 0 10px var(--wp-cyan); animation: pm-wp-pulse 2s infinite;
}
.pm-wp-hero .badge-txt { font-family: monospace; color: var(--wp-cyan); font-size: 0.85rem; letter-spacing: 1px; }

.pm-wp-hero .jaguar-title {
    font-size: 3.8rem; font-weight: 900; line-height: 1.1; margin-bottom: 25px; color: #fff;
}
.pm-wp-hero .text-stroke {
    display: block; -webkit-text-stroke: 1px rgba(255,255,255,0.4); color: transparent;
    font-size: 2.5rem; margin-bottom: 5px;
}
.pm-wp-hero .text-neon-blue {
    background: linear-gradient(90deg, #fff, var(--wp-cyan));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 30px rgba(56, 189, 248, 0.4));
}

/* Rating */
.pm-wp-hero .rating-wrapper {
    border-right: 3px solid var(--wp-cyan); padding-right: 20px; margin-bottom: 40px;
    background: linear-gradient(90deg, rgba(56, 189, 248, 0.05), transparent);
}
.pm-wp-hero .stars-gold { color: #facc15; font-size: 1.3rem; letter-spacing: 3px; margin-bottom: 5px; }
.pm-wp-hero .rating-desc { margin: 0; font-size: 0.95rem; color: #cbd5e1; line-height: 1.6; }
.pm-wp-hero .rating-count { font-size: 0.8rem; opacity: 0.7; }

.pm-wp-hero .jaguar-desc {
    font-size: 1.1rem; color: var(--wp-text-muted); line-height: 1.8; margin-bottom: 40px; max-width: 580px;
}

/* Command Deck */
.pm-wp-hero .jaguar-command-deck {
    display: flex; flex-direction: column; gap: 25px; width: 100%; max-width: 550px;
}
.pm-wp-hero .deck-actions { display: flex; align-items: stretch; gap: 20px; }

.pm-wp-hero .btn-hunt-neon {
    position: relative; background: #fff; color: #020617;
    padding: 16px 35px; border-radius: 12px; font-weight: 800; text-decoration: none; font-size: 1.1rem;
    display: flex; align-items: center; justify-content: center; overflow: hidden;
    box-shadow: 0 0 25px rgba(255, 255, 255, 0.2), inset 0 0 0 2px rgba(255,255,255,0.5);
    transition: 0.3s cubic-bezier(0.25, 1, 0.5, 1); flex-shrink: 0;
}
.pm-wp-hero .btn-hunt-neon:hover {
    transform: scale(1.05) translateY(-3px); background: #e0f2fe;
    box-shadow: 0 0 40px rgba(56, 189, 248, 0.6), 0 0 10px #fff;
}
.pm-wp-hero .btn-content { display: flex; align-items: center; gap: 10px; position: relative; z-index: 2; }

.pm-wp-hero .guarantee-neon {
    flex-grow: 1; display: flex; align-items: center; gap: 15px;
    background: rgba(15, 23, 42, 0.6); border: 1px solid var(--wp-border);
    padding: 10px 20px; border-radius: 12px; position: relative; overflow: hidden;
    backdrop-filter: blur(10px); transition: 0.3s;
}
.pm-wp-hero .guarantee-neon:hover {
    background: rgba(15, 23, 42, 0.8); border-color: var(--wp-cyan);
    box-shadow: 0 0 20px rgba(56, 189, 248, 0.15);
}

.pm-wp-hero .g-icon-box {
    width: 48px; height: 48px; background: rgba(56, 189, 248, 0.1); border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid rgba(56, 189, 248, 0.25); flex-shrink: 0; transition: 0.3s;
}
.pm-wp-hero .neon-timer-icon {
    width: 28px; height: auto; filter: drop-shadow(0 0 8px var(--wp-cyan)); transition: 0.3s;
}
.pm-wp-hero .guarantee-neon:hover .g-icon-box { border-color: var(--wp-cyan); background: rgba(56, 189, 248, 0.2); }
.pm-wp-hero .guarantee-neon:hover .neon-timer-icon { transform: scale(1.15) rotate(-10deg); filter: drop-shadow(0 0 15px var(--wp-cyan)); }

.pm-wp-hero .g-text strong { display: block; color: #fff; font-size: 0.95rem; }
.pm-wp-hero .g-text small { color: var(--wp-text-muted); font-size: 0.8rem; }
.pm-wp-hero .g-glow-line {
    position: absolute; bottom: 0; left: 0; width: 100%; height: 2px;
    background: linear-gradient(90deg, transparent, var(--wp-cyan), transparent);
    animation: pm-wp-scan 3s infinite linear;
}

/* Specs Chips */
.pm-wp-hero .deck-specs { display: flex; gap: 15px; flex-wrap: wrap; padding-left: 5px; }
.pm-wp-hero .spec-chip {
    display: flex; align-items: center; gap: 8px;
    background: rgba(30, 41, 59, 0.4); border: 1px solid rgba(255,255,255,0.08);
    padding: 6px 14px; border-radius: 50px; font-size: 0.85rem; font-family: monospace;
    cursor: default; transition: 0.3s;
}
.pm-wp-hero .spec-chip:hover { background: rgba(30, 41, 59, 0.8); transform: translateY(-2px); }
.pm-wp-hero .spec-chip .dot { width: 6px; height: 6px; border-radius: 50%; }
.pm-wp-hero .spec-chip .txt { color: #cbd5e1; font-weight: 600; }

.pm-wp-hero .cyan-chip { border-color: rgba(56,189,248,0.3); } 
.pm-wp-hero .cyan-chip .dot { background: #38bdf8; box-shadow: 0 0 8px #38bdf8; }
.pm-wp-hero .purple-chip { border-color: rgba(168,85,247,0.3); } 
.pm-wp-hero .purple-chip .dot { background: #a855f7; box-shadow: 0 0 8px #a855f7; }
.pm-wp-hero .green-chip { border-color: rgba(34,197,94,0.3); } 
.pm-wp-hero .green-chip .dot { background: #22c55e; box-shadow: 0 0 8px #22c55e; }

/* Visual Column */
.pm-wp-hero .jaguar-visual-col {
    position: relative; height: 700px; display: flex; align-items: flex-end; justify-content: center;
}
.pm-wp-hero .visual-frame {
    position: relative; width: 100%; height: 100%; max-width: 600px;
    display: flex; align-items: flex-end; justify-content: center;
}
.pm-wp-hero .aura-back {
    position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
    width: 90%; height: 70%;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.35), transparent 70%);
    filter: blur(100px); z-index: 0;
}
.pm-wp-hero .hero-main-img {
    width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain;
    transform: translateY(0); position: relative; z-index: 1;
    mask-image: linear-gradient(to bottom, black 70%, transparent 98%);
    -webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 98%);
    filter: drop-shadow(0 0 50px rgba(56, 189, 248, 0.2));
}

/* Cyber Monitor */
.pm-wp-hero .cyber-monitor-card {
    position: absolute; bottom: 20%; left: -30px;
    background: rgba(15, 23, 42, 0.9); border: 1px solid var(--wp-border);
    padding: 15px; border-radius: 10px; backdrop-filter: blur(10px);
    z-index: 2; animation: pm-wp-float 5s ease-in-out infinite;
    box-shadow: 0 15px 40px rgba(0,0,0,0.4);
}
.pm-wp-hero .mon-header { font-size: 0.7rem; color: var(--wp-text-muted); display: flex; align-items: center; gap: 6px; margin-bottom: 10px; letter-spacing: 1px; }
.pm-wp-hero .blink-dot { width: 6px; height: 6px; background: #ef4444; border-radius: 50%; animation: pm-wp-blink 1s infinite; }
.pm-wp-hero .metric strong { display: block; font-size: 1.3rem; color: #fff; margin-bottom: 8px; font-family: monospace; }
.pm-wp-hero .metric-bar { width: 120px; height: 4px; background: #334155; border-radius: 2px; }
.pm-wp-hero .metric-bar .fill { width: 92%; height: 100%; background: #22c55e; border-radius: 2px; box-shadow: 0 0 8px #22c55e; }

/* Animations (Scoped) */
@keyframes pm-wp-pulse { 0% { box-shadow: 0 0 0 0 rgba(56, 189, 248, 0.7); } 70% { box-shadow: 0 0 0 10px rgba(56, 189, 248, 0); } 100% { box-shadow: 0 0 0 0 rgba(56, 189, 248, 0); } }
@keyframes pm-wp-scan { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
@keyframes pm-wp-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-10px);} }
@keyframes pm-wp-blink { 50% { opacity: 0; } }

/* Responsive */
@media (max-width: 992px) {
    .pm-wp-hero { padding-top: 120px; }
    .pm-wp-hero .jaguar-wrapper { grid-template-columns: 1fr; text-align: center; gap: 40px; }
    .pm-wp-hero .jaguar-content-col { align-items: center; }
    .pm-wp-hero .rating-wrapper { border-right: none; padding-right: 0; padding: 15px; width: 100%; background: rgba(56, 189, 248, 0.05); border-radius: 10px; }
    .pm-wp-hero .jaguar-desc { text-align: center; }
    .pm-wp-hero .jaguar-command-deck { align-items: center; max-width: 100%; }
    .pm-wp-hero .deck-actions { flex-direction: column; width: 100%; gap: 15px; }
    .pm-wp-hero .btn-hunt-neon { width: 100%; justify-content: center; padding: 18px; }
    .pm-wp-hero .guarantee-neon { width: 100%; justify-content: center; text-align: right; }
    .pm-wp-hero .deck-specs { justify-content: center; width: 100%; gap: 10px; }
    .pm-wp-hero .jaguar-visual-col { order: -1; height: 500px; }
    .pm-wp-hero .visual-frame { max-width: 100%; }
    .pm-wp-hero .hero-main-img { max-height: 550px; mask-image: linear-gradient(to bottom, black 85%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, black 85%, transparent 100%); }
    .pm-wp-hero .cyber-monitor-card { left: 0; right: 0; margin: auto; width: fit-content; bottom: 30px; }
}
@media (max-width: 576px) {
    .pm-wp-hero .jaguar-title { font-size: 2.8rem; }
    .pm-wp-hero .text-stroke { font-size: 2rem; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 2: HOSTING SOLUTIONS (Crystal Light)
   Parent Class: .pm-wp-solutions
   ========================================================================== */
.pm-wp-solutions {
    /* --- Scoped Variables --- */
    --sol-bg: #f8fafc;
    --sol-text-dark: #1e293b;
    --sol-text-light: #64748b;
    --sol-blue: #2563eb;
    --sol-border: #e2e8f0;
    --sol-card-bg: #ffffff;

    background-color: var(--sol-bg);
    padding: 100px 0; position: relative; overflow: hidden;
    direction: rtl; color: var(--sol-text-dark); font-family: inherit;
}

/* Background Pattern */
.pm-wp-solutions .light-bg-grid {
    position: absolute; inset: 0;
    background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
    background-size: 24px 24px; opacity: 0.4; pointer-events: none;
}
.pm-wp-solutions .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-wp-solutions .light-header { text-align: center; margin-bottom: 60px; }
.pm-wp-solutions .light-title {
    font-size: 2.2rem; font-weight: 800; margin-bottom: 15px; color: #0f172a;
}
.pm-wp-solutions .text-blue { color: var(--sol-blue); }
.pm-wp-solutions .light-subtitle {
    color: var(--sol-text-light); font-size: 1.1rem; max-width: 600px; margin: 0 auto;
}

/* Grid System */
.pm-wp-solutions .solutions-grid-light {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 30px; align-items: stretch;
}

/* Card Styling */
.pm-wp-solutions .sol-card-light {
    background: var(--sol-card-bg); border-radius: 24px; padding: 30px;
    text-align: center; transition: all 0.4s ease;
    border: 1px solid var(--sol-border);
    box-shadow: 0 10px 40px -10px rgba(0,0,0,0.05);
    display: flex; flex-direction: column; position: relative; z-index: 1;
}
.pm-wp-solutions .sol-card-light:hover {
    transform: translateY(-8px); border-color: #bfdbfe;
    box-shadow: 0 20px 50px -10px rgba(37, 99, 235, 0.1);
}

/* Icons */
.pm-wp-solutions .card-icon-wrapper {
    width: 90px; height: 90px; margin: 0 auto 20px;
    background: #0080ff; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; transition: 0.3s;
}
.pm-wp-solutions .sol-card-light:hover .card-icon-wrapper {
    background: #eff6ff; transform: scale(1.05);
}
.pm-wp-solutions .card-icon-wrapper img { transition: 0.3s; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.1)); }

/* Body Content */
.pm-wp-solutions .card-body { flex-grow: 1; margin-bottom: 25px; }
.pm-wp-solutions .card-body h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: 12px; color: var(--sol-text-dark); }
.pm-wp-solutions .card-body p { font-size: 0.95rem; color: var(--sol-text-light); line-height: 1.7; margin: 0; }
.pm-wp-solutions .card-body strong { color: var(--sol-blue); font-weight: 600; }

/* Footer & Buttons */
.pm-wp-solutions .card-footer { margin-top: auto; }
.pm-wp-solutions .multi-btn-group {
    display: inline-flex; align-items: center;
    background: #f8fafc; border: 1px solid var(--sol-border);
    border-radius: 12px; padding: 5px; width: 100%;
}
.pm-wp-solutions .btn-outline-light {
    flex: 1; font-size: 0.9rem; color: var(--sol-text-light); text-decoration: none;
    padding: 8px 10px; border-radius: 8px; font-weight: 500;
    transition: 0.3s; text-align: center;
}
.pm-wp-solutions .btn-outline-light:hover {
    background: #fff; color: var(--sol-blue);
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); font-weight: 700;
}
.pm-wp-solutions .divider { width: 1px; height: 20px; background: var(--sol-border); margin: 0 5px; }

/* Active Card (Current Page) */
.pm-wp-solutions .active-light-card {
    border: 2px solid var(--sol-blue); transform: scale(1.05);
    z-index: 2; overflow: visible;
}
.pm-wp-solutions .active-wrapper { background: #0f172a; }

.pm-wp-solutions .status-badge {
    position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
    background: var(--sol-blue); color: #fff;
    padding: 6px 16px; border-radius: 20px; font-size: 0.8rem; font-weight: 700;
    display: flex; align-items: center; gap: 6px;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3); white-space: nowrap;
}
.pm-wp-solutions .pulsing-dot {
    width: 6px; height: 6px; background: #fff; border-radius: 50%;
    animation: pm-wp-pulse-light 1.5s infinite;
}

.pm-wp-solutions .current-page-indicator {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 50%; padding: 12px;
    background: #eff6ff; color: var(--sol-blue);
    font-weight: 700; border-radius: 12px; font-size: 0.95rem;
}
.pm-wp-solutions .soft-glow {
    position: absolute; inset: 0; z-index: -1; border-radius: 24px;
    box-shadow: 0 20px 60px -10px rgba(37, 99, 235, 0.25);
}

/* Animations */
@keyframes pm-wp-pulse-light { 0% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(1.2); } 100% { opacity: 1; transform: scale(1); } }

/* Responsive */
@media (max-width: 992px) {
    .pm-wp-solutions .active-light-card { transform: scale(1); border-width: 1px; }
    .pm-wp-solutions .status-badge { top: 15px; left: 15px; transform: none; font-size: 0.75rem; }
    .pm-wp-solutions .solutions-grid-light { gap: 20px; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 3: ENERGY PLANS (Pricing)
   Parent Class: .pm-wp-pricing
   ========================================================================== */
.pm-wp-pricing {
    /* --- Scoped Variables --- */
    --pricing-bg: #020617;
    --pricing-card-bg: rgba(15, 23, 42, 0.6);
    --pricing-card-hover: rgba(15, 23, 42, 0.8);
    --pricing-border: rgba(255, 255, 255, 0.08);
    --pricing-text-muted: #94a3b8;
    /* Theme Colors (Default) */
    --glow-color: rgba(34, 211, 238, 0.3); 
    --accent: #22d3ee;

    background-color: var(--pricing-bg);
    padding: 120px 0; position: relative; overflow: visible;
    direction: rtl; color: #fff; font-family: inherit;
}

/* Atmosphere */
.pm-wp-pricing .galaxy-bg {
    position: absolute; inset: 0;
    background-image: radial-gradient(circle at 50% 0%, #1e293b 0%, #020617 60%);
    opacity: 0.6; z-index: 0;
}
.pm-wp-pricing .ambient-light-top {
    position: absolute; top: -200px; left: 50%; transform: translateX(-50%);
    width: 80%; height: 500px;
    background: radial-gradient(ellipse, rgba(56, 189, 248, 0.15), transparent 70%);
    filter: blur(80px); pointer-events: none; z-index: 0;
}
.pm-wp-pricing .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-wp-pricing .energy-header { text-align: center; margin-bottom: 80px; position: relative; z-index: 3; }
.pm-wp-pricing .energy-title { 
    font-size: 2.8rem; font-weight: 900; margin-bottom: 10px; text-shadow: 0 0 30px rgba(255,255,255,0.1); 
}
.pm-wp-pricing .text-glow-blue { color: #38bdf8; text-shadow: 0 0 25px rgba(56, 189, 248, 0.6); }
.pm-wp-pricing .energy-subtitle { color: var(--pricing-text-muted); font-size: 1.1rem; }

/* Switch */
.pm-wp-pricing .neon-switch-wrapper {
    display: inline-flex; align-items: center; gap: 15px; margin-top: 30px;
    background: rgba(255,255,255,0.05); padding: 10px 25px; border-radius: 50px;
    border: 1px solid rgba(255,255,255,0.1); backdrop-filter: blur(10px);
}
.pm-wp-pricing .sw-label { color: #cbd5e1; font-weight: 600; transition: 0.3s; }
.pm-wp-pricing .sw-label.active-mode { color: #f59e0b; text-shadow: 0 0 15px rgba(245, 158, 11, 0.4); }

.pm-wp-pricing .neon-toggle { position: relative; width: 56px; height: 30px; cursor: pointer; }
.pm-wp-pricing .neon-toggle input { display: none; }
.pm-wp-pricing .neon-track {
    position: absolute; inset: 0; background: #0f172a; border-radius: 30px;
    border: 1px solid rgba(255,255,255,0.2); transition: 0.3s;
}
.pm-wp-pricing .neon-knob {
    position: absolute; top: 3px; left: 3px; width: 24px; height: 24px;
    background: #94a3b8; border-radius: 50%; transition: 0.3s; box-shadow: 0 0 10px rgba(255,255,255,0.2);
}
.pm-wp-pricing input:checked ~ .neon-track { border-color: #f59e0b; box-shadow: 0 0 15px rgba(245, 158, 11, 0.2); }
.pm-wp-pricing input:checked ~ .neon-knob { transform: translateX(26px); background: #f59e0b; box-shadow: 0 0 20px #f59e0b; }

/* Grid */
.pm-wp-pricing .energy-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; align-items: stretch;
}

/* Card Structure */
.pm-wp-pricing .energy-card {
    position: relative; border-radius: 24px; transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); z-index: 1;
}
.pm-wp-pricing .card-inner {
    background: var(--pricing-card-bg); border: 1px solid var(--pricing-border);
    border-radius: 24px; padding: 30px 20px; height: 100%;
    display: flex; flex-direction: column; align-items: center;
    backdrop-filter: blur(20px); position: relative; z-index: 2; transition: border-color 0.3s;
}

/* Glow Effect */
.pm-wp-pricing .glow-effect {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 100%; height: 100%; border-radius: 24px;
    background: radial-gradient(circle at center, var(--glow-color) 0%, transparent 70%);
    opacity: 0; transition: opacity 0.5s ease, transform 0.5s ease;
    z-index: 0; filter: blur(40px);
}

/* Themes */
.pm-wp-pricing .cyan-theme { --glow-color: rgba(34, 211, 238, 0.3); --accent: #22d3ee; }
.pm-wp-pricing .blue-theme { --glow-color: rgba(59, 130, 246, 0.3); --accent: #3b82f6; }
.pm-wp-pricing .gold-theme { --glow-color: rgba(245, 158, 11, 0.35); --accent: #f59e0b; }
.pm-wp-pricing .purple-theme { --glow-color: rgba(168, 85, 247, 0.3); --accent: #a855f7; }

/* Hover Effects */
.pm-wp-pricing .energy-card:hover { transform: translateY(-10px) scale(1.02); z-index: 5; }
.pm-wp-pricing .energy-card:hover .glow-effect { opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
.pm-wp-pricing .energy-card:hover .card-inner { border-color: var(--accent); background: var(--pricing-card-hover); }

/* Icons */
.pm-wp-pricing .icon-stage {
    position: relative; width: 120px; height: 120px; margin-bottom: 20px;
    display: flex; align-items: center; justify-content: center;
}
.pm-wp-pricing .floating-icon {
    width: 100%; height: 100%; object-fit: contain;
    filter: drop-shadow(0 0 15px var(--glow-color));
    animation: pm-wp-float 6s ease-in-out infinite;
}
.pm-wp-pricing .delay-1 { animation-delay: 1s; } 
.pm-wp-pricing .delay-2 { animation-delay: 2s; } 
.pm-wp-pricing .delay-3 { animation-delay: 3s; }

.pm-wp-pricing .icon-reflection {
    position: absolute; bottom: -10px; width: 60%; height: 10px;
    background: radial-gradient(ellipse, var(--accent), transparent 70%);
    opacity: 0.4; filter: blur(5px);
}

/* Content */
.pm-wp-pricing .plan-name { font-size: 1.5rem; font-weight: 800; color: #fff; margin-bottom: 15px; }
.pm-wp-pricing .text-gold { color: #f59e0b; text-shadow: 0 0 15px rgba(245, 158, 11, 0.5); }

/* Price Box */
.pm-wp-pricing .price-box { min-height: 50px; margin-bottom: 25px; }
.pm-wp-pricing .monthly-price, .pm-wp-pricing .yearly-price { display: block; font-size: 1.8rem; font-weight: 700; color: #fff; }
.pm-wp-pricing .price-box small { font-size: 0.8rem; color: var(--pricing-text-muted); font-weight: 400; }

.pm-wp-pricing .view-monthly .yearly-price { display: none; }
.pm-wp-pricing .view-yearly .monthly-price { display: none; }

/* Specs */
.pm-wp-pricing .specs-list { width: 100%; margin-bottom: 30px; }
.pm-wp-pricing .spec-row {
    display: flex; justify-content: space-between; padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 0.95rem;
}
.pm-wp-pricing .spec-row span { color: var(--pricing-text-muted); }
.pm-wp-pricing .spec-row strong { color: var(--accent); font-family: monospace; font-size: 1.1rem; }
.pm-wp-pricing .spec-row.bonus { color: #f59e0b; justify-content: center; font-weight: 700; border-bottom: none; padding-top: 15px; }

/* Buttons */
.pm-wp-pricing .energy-btn {
    width: 100%; padding: 14px; border-radius: 12px; text-decoration: none; text-align: center;
    color: #fff; font-weight: 700; background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1); transition: 0.3s;
}
.pm-wp-pricing .energy-btn:hover {
    background: var(--accent); border-color: var(--accent); box-shadow: 0 0 20px var(--glow-color); color: #000;
}
.pm-wp-pricing .btn-fill-gold {
    background: linear-gradient(135deg, #f59e0b, #d97706); border: none; color: #000;
    box-shadow: 0 5px 15px rgba(245, 158, 11, 0.3);
}
.pm-wp-pricing .btn-fill-gold:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(245, 158, 11, 0.5); }

/* Popular Card (King) */
.pm-wp-pricing .popular-highlight { transform: scale(1.08); z-index: 4; }
.pm-wp-pricing .popular-highlight .card-inner { border: 1px solid rgba(245, 158, 11, 0.4); background: rgba(15, 23, 42, 0.7); }
.pm-wp-pricing .popular-highlight .glow-effect { opacity: 0.2; }

.pm-wp-pricing .king-crown {
    position: absolute; top: -15px; left: 50%; transform: translateX(-50%);
    background: linear-gradient(90deg, #f59e0b, #b45309); color: #fff;
    padding: 6px 16px; border-radius: 20px; font-size: 0.8rem; font-weight: 700;
    box-shadow: 0 5px 15px rgba(245, 158, 11, 0.4); z-index: 5;
}

/* Animations */
@keyframes pm-wp-float { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-10px);} }

/* Responsive */
@media (max-width: 1200px) {
    .pm-wp-pricing .energy-grid { grid-template-columns: 1fr 1fr; }
    .pm-wp-pricing .popular-highlight { transform: scale(1); margin-top: 20px; }
}
@media (max-width: 600px) {
    .pm-wp-pricing .energy-grid { grid-template-columns: 1fr; }
    .pm-wp-pricing .energy-title { font-size: 2rem; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 4: COMPARISON TABLE (Glass UI)
   Parent Class: .pm-wp-compare
   ========================================================================== */
.pm-wp-compare {
    /* --- Scoped Variables --- */
    --comp-bg: #f8fafc;
    --comp-text: #334155;
    --comp-border: #e2e8f0;
    --comp-blue-grad: linear-gradient(135deg, #2563eb, #0ea5e9);
    --comp-gold: #f59e0b;
    --comp-gold-dark: #d97706;

    background-color: var(--comp-bg);
    padding: 120px 0; position: relative; overflow: hidden;
    direction: rtl; color: var(--comp-text); font-family: inherit;
}

/* Background Grid */
.pm-wp-compare .tech-grid-bg {
    position: absolute; inset: 0;
    background-image: 
        linear-gradient(#e2e8f0 1px, transparent 1px),
        linear-gradient(90deg, #e2e8f0 1px, transparent 1px);
    background-size: 40px 40px; opacity: 0.4;
    mask-image: radial-gradient(circle at center, black 40%, transparent 80%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 80%);
}
.pm-wp-compare .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-wp-compare .glass-header { text-align: center; margin-bottom: 70px; }
.pm-wp-compare .glass-title { font-size: 2.5rem; font-weight: 900; margin-bottom: 10px; color: #0f172a; }
.pm-wp-compare .text-gradient-blue {
    background: var(--comp-blue-grad);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-wp-compare .glass-subtitle { color: #64748b; font-size: 1.1rem; }

/* Table Wrapper */
.pm-wp-compare .table-glass-wrapper {
    overflow-x: auto; padding: 40px 20px; margin: -40px -20px;
}
.pm-wp-compare .glass-table {
    width: 100%; border-collapse: separate; border-spacing: 0; min-width: 900px;
}

/* Headers (Capsules) */
.pm-wp-compare .glass-table thead th {
    padding: 0 10px 25px; vertical-align: bottom;
    position: sticky; top: 0; z-index: 20; background: transparent;
}
.pm-wp-compare .head-pill {
    background: #fff; padding: 12px 20px; border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03); font-weight: 700;
    color: #94a3b8; text-align: right; border: 1px solid #f1f5f9; display: inline-block;
}

/* Plan Capsules */
.pm-wp-compare .plan-capsule {
    background: #fff; border: 1px solid var(--comp-border);
    padding: 15px; border-radius: 16px;
    display: flex; align-items: center; gap: 10px; justify-content: center;
    box-shadow: 0 10px 20px -5px rgba(0,0,0,0.05); transition: 0.3s;
}
.pm-wp-compare .plan-capsule:hover { transform: translateY(-5px); }
.pm-wp-compare .p-icon { font-size: 1.5rem; }
.pm-wp-compare .p-info { display: flex; flex-direction: column; align-items: flex-start; }
.pm-wp-compare .p-info .name { font-weight: 800; font-size: 1.1rem; color: #0f172a; }
.pm-wp-compare .p-info .type { font-size: 0.8rem; color: #64748b; }

/* Gold Capsule */
.pm-wp-compare .popular-head { position: relative; z-index: 30; }
.pm-wp-compare .gold-capsule {
    background: linear-gradient(135deg, #fffbeb, #fff);
    border: 1px solid #fcd34d;
    box-shadow: 0 15px 30px -5px rgba(245, 158, 11, 0.2);
    transform: scale(1.05);
}
.pm-wp-compare .floating-badge {
    position: absolute; top: -15px; left: 50%; transform: translateX(-50%);
    background: var(--comp-gold); color: #fff; font-size: 0.75rem; font-weight: 700;
    padding: 4px 12px; border-radius: 20px; white-space: nowrap;
    box-shadow: 0 4px 10px rgba(245, 158, 11, 0.3); z-index: 35;
}

/* Body Rows */
.pm-wp-compare .glass-table tbody tr td {
    padding: 18px 15px; text-align: center;
    border-bottom: 1px dashed var(--comp-border);
    color: #475569; font-size: 0.95rem; background: #fff; transition: 0.2s;
}
.pm-wp-compare .glass-table tbody td.feat-name {
    text-align: right; font-weight: 600; color: #334155;
    background: rgba(255,255,255,0.8); backdrop-filter: blur(5px);
    position: sticky; left: 0; z-index: 10; border-right: 1px solid transparent;
}

/* Separator */
.pm-wp-compare .sep-row td {
    background: #f1f5f9 !important; border: none; padding: 10px 20px; text-align: right;
}
.pm-wp-compare .sep-row span {
    font-size: 0.8rem; font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: 1px;
}

/* Popular Column */
.pm-wp-compare .pop-cell {
    background-color: #fffbeb !important;
    border-left: 1px solid #fde68a; border-right: 1px solid #fde68a;
    border-bottom: 1px dashed #fcd34d; color: #0f172a !important; position: relative;
    box-shadow: 10px 0 20px -10px rgba(0,0,0,0.05), -10px 0 20px -10px rgba(0,0,0,0.05);
}
.pm-wp-compare .glass-table tbody tr:first-child td.pop-cell {
    border-top-left-radius: 16px; border-top-right-radius: 16px; border-top: 1px solid #fcd34d;
}
.pm-wp-compare .glass-table tbody tr:last-child td.pop-cell {
    border-bottom-left-radius: 16px; border-bottom-right-radius: 16px; border-bottom: 1px solid #fcd34d;
}

.pm-wp-compare .text-bold { font-weight: 800; }
.pm-wp-compare .text-gold { color: var(--comp-gold-dark); font-weight: 800; }

/* Icons */
.pm-wp-compare .icon-yes::before { content: '✔'; color: #22c55e; font-weight: 900; font-size: 1.1rem; }
.pm-wp-compare .icon-no::before { content: '✖'; color: #cbd5e1; font-weight: 700; font-size: 1rem; }

/* Hover Effects */
.pm-wp-compare .glass-table tbody tr:hover td { background-color: #f8fafc; }
.pm-wp-compare .glass-table tbody tr:hover td.pop-cell {
    background-color: #fef3c7; transform: scale(1.02); z-index: 5;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1); border-color: transparent;
}
.pm-wp-compare .glass-table tbody tr:hover td.feat-name { background-color: #fff; }

/* Action Buttons */
.pm-wp-compare .action-row td { border: none; background: transparent !important; padding-top: 30px; box-shadow: none !important; }

.pm-wp-compare .btn-glass {
    display: inline-block; padding: 10px 24px; border-radius: 12px;
    background: #fff; border: 1px solid #cbd5e1; color: #64748b;
    text-decoration: none; font-weight: 600; transition: 0.3s;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.pm-wp-compare .btn-glass:hover {
    border-color: #3b82f6; color: #3b82f6; transform: translateY(-2px);
}

.pm-wp-compare .btn-gold-shadow {
    display: inline-block; padding: 14px 35px; border-radius: 12px;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #fff; text-decoration: none; font-weight: 800;
    box-shadow: 0 10px 25px rgba(245, 158, 11, 0.4); transition: 0.3s;
}
.pm-wp-compare .btn-gold-shadow:hover {
    transform: translateY(-4px) scale(1.05); box-shadow: 0 15px 35px rgba(245, 158, 11, 0.5);
}

/* Responsive */
@media (max-width: 992px) {
    .pm-wp-compare .glass-table { min-width: 800px; }
    .pm-wp-compare .glass-header { margin-bottom: 40px; }
    .pm-wp-compare .p-info .name { font-size: 0.95rem; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 6: NEXUS GRID (Premium Glow)
   Parent Class: .pm-wp-nexus
   ========================================================================== */
.pm-wp-nexus {
    /* --- Scoped Variables --- */
    --nexus-bg: #0b1120;
    --nexus-text-muted: #94a3b8;
    --nexus-border: rgba(255,255,255,0.06);
    --nexus-card-bg: rgba(15, 23, 42, 0.6);
    --nexus-neon-blue: #38bdf8;

    background-color: var(--nexus-bg);
    padding: 100px 0; position: relative; overflow: hidden;
    direction: rtl; color: #fff; font-family: inherit;
    border-top: 1px solid rgba(255,255,255,0.03);
}

/* Texture Background */
.pm-wp-nexus .nexus-bg-texture {
    position: absolute; inset: 0;
    background-image: 
        radial-gradient(circle at center, transparent 0%, var(--nexus-bg) 80%),
        url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M54.627 0l.83.828-1.415 1.415L51.8 0h2.827zM5.373 0l-.83.828L5.96 2.243 8.2 0H5.374zM48.97 0l3.657 3.657-1.414 1.414L46.143 0h2.828zM11.03 0L7.372 3.657 8.787 5.07 13.857 0H11.03zm32.284 0L49.8 6.485 48.384 7.9l-7.9-7.9h2.83zM16.686 0L10.2 6.485 11.616 7.9l7.9-7.9h-2.83zM22.344 0L13.858 8.485 15.272 9.9l7.9-7.9h-.828zm5.656 0L19.515 8.485 18.1 7.07 25.172 0h2.828zM32 0l-8.485 8.485 1.414 1.414L34.828 0H32zm5.657 0l-8.485 8.485 1.414 1.414L40.485 0h-2.828zM6.485 0L0 6.485 1.414 7.9l7.9-7.9H6.485zM0 16.686L6.485 10.2 7.9 11.616 0 19.515v-2.83zm0-5.657L3.657 7.372 5.07 8.787 0 13.857v-2.828zm0-5.657L.828 4.543 2.243 5.96 0 8.2V5.374zm0 21.213l8.485-8.485 1.414 1.414L1.414 28H0v-1.414zM0 32l8.485-8.485 1.414 1.414L1.414 33.414H0V32z' fill='%231e293b' fill-opacity='0.2' fill-rule='evenodd'/%3E%3C/svg%3E");
    opacity: 0.4; pointer-events: none;
}
.pm-wp-nexus .relative-z { position: relative; z-index: 2; }

/* Header */
.pm-wp-nexus .nexus-header { text-align: center; margin-bottom: 70px; padding: 0 15px; }
.pm-wp-nexus .nexus-title { font-size: 2.2rem; font-weight: 900; margin-bottom: 15px; color: #fff; }
.pm-wp-nexus .highlight-neon { 
    color: var(--nexus-neon-blue); text-shadow: 0 0 25px rgba(56, 189, 248, 0.4); 
}
.pm-wp-nexus .nexus-subtitle { color: var(--nexus-text-muted); font-size: 1.1rem; max-width: 700px; margin: 0 auto; }

/* Grid System */
.pm-wp-nexus .nexus-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; align-items: stretch;
}

/* Card Design */
.pm-wp-nexus .nexus-card {
    background: var(--nexus-card-bg); border: 1px solid var(--nexus-border);
    border-radius: 20px; padding: 35px 25px; position: relative; overflow: hidden;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex; flex-direction: column; align-items: center; text-align: center;
    backdrop-filter: blur(10px);
}
.pm-wp-nexus .nexus-card:hover {
    transform: translateY(-10px); background: rgba(15, 23, 42, 0.9);
    border-color: rgba(255,255,255,0.15); box-shadow: 0 15px 40px -10px rgba(0,0,0,0.5);
}

/* Inner Glow */
.pm-wp-nexus .inner-glow {
    position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
    background: radial-gradient(circle at center, var(--glow-color, transparent) 0%, transparent 60%);
    opacity: 0; transition: opacity 0.5s ease; pointer-events: none; z-index: 0;
    mix-blend-mode: screen;
}
.pm-wp-nexus .nexus-card:hover .inner-glow { opacity: 0.25; animation: pm-wp-pulse-glow 3s infinite alternate; }

/* Glow Colors */
.pm-wp-nexus .blue-glow { --glow-color: #3b82f6; }
.pm-wp-nexus .purple-glow { --glow-color: #a855f7; }
.pm-wp-nexus .green-glow { --glow-color: #22c55e; }
.pm-wp-nexus .gold-glow { --glow-color: #f59e0b; }

/* Icon Wrapper */
.pm-wp-nexus .n-icon-wrapper {
    position: relative; z-index: 2; width: 100px; height: 100px; margin-bottom: 25px;
    background: rgba(255,255,255,0.03); border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid rgba(255,255,255,0.05); box-shadow: inset 0 0 20px rgba(0,0,0,0.3);
    transition: 0.4s;
}
.pm-wp-nexus .n-icon-wrapper img {
    width: 76px; height: 76px; object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(255,255,255,0.1)); transition: 0.4s;
}
.pm-wp-nexus .nexus-card:hover .n-icon-wrapper {
    background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.2);
    transform: scale(1.1); box-shadow: 0 0 25px var(--glow-color);
}
.pm-wp-nexus .nexus-card:hover .n-icon-wrapper img {
    filter: drop-shadow(0 0 15px var(--glow-color)) brightness(1.2); transform: scale(1.1);
}

/* Content */
.pm-wp-nexus .n-content { position: relative; z-index: 2; width: 100%; }
.pm-wp-nexus .nexus-card h3 { font-size: 1.25rem; font-weight: 700; color: #fff; margin-bottom: 12px; }
.pm-wp-nexus .nexus-card p {
    font-size: 0.9rem; color: var(--nexus-text-muted); line-height: 1.7; margin-bottom: 25px; min-height: 48px;
}

/* Feature List */
.pm-wp-nexus .n-features {
    list-style: none; padding: 0; margin: 0; text-align: right;
    background: rgba(0,0,0,0.2); padding: 15px; border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.03);
}
.pm-wp-nexus .n-features li {
    display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px;
    font-size: 0.85rem; color: #cbd5e1;
}
.pm-wp-nexus .n-features li:last-child { margin-bottom: 0; }
.pm-wp-nexus .n-features span:first-child {
    color: #22c55e; font-weight: 800; font-size: 1rem; line-height: 1.2;
}

/* Animation */
@keyframes pm-wp-pulse-glow { 0% { opacity: 0.15; transform: scale(0.9); } 100% { opacity: 0.3; transform: scale(1.1); } }

/* Responsive */
@media (max-width: 1200px) {
    .pm-wp-nexus .nexus-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; max-width: 800px; margin: 0 auto; }
}
@media (max-width: 768px) {
    .pm-wp-nexus .nexus-grid { grid-template-columns: 1fr; }
    .pm-wp-nexus .nexus-header { margin-bottom: 40px; }
    .pm-wp-nexus .nexus-title { font-size: 1.8rem; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 7: JAGUAR FINAL STORY (Clean Light)
   Parent Class: .pm-wp-final
   ========================================================================== */
.pm-wp-final {
    /* --- Scoped Variables --- */
    --final-bg: #ffffff;
    --final-text-dark: #0f172a;
    --final-text-muted: #64748b;
    --final-blue: #2563eb;
    --final-gold: #d97706;
    --final-border: #e2e8f0;

    background-color: var(--final-bg);
    /* Subtle Grid Pattern */
    background-image: 
        linear-gradient(#f1f5f9 1px, transparent 1px),
        linear-gradient(90deg, #f1f5f9 1px, transparent 1px);
    background-size: 50px 50px;
    padding: 100px 0; font-family: inherit; direction: rtl; text-align: right; overflow: hidden;
}
.pm-wp-final * { box-sizing: border-box; }

.pm-wp-final .jaguar-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.pm-wp-final .jaguar-final-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}

/* Visual Architecture */
.pm-wp-final .jaguar-visual-side { position: relative; padding: 2px; }
.pm-wp-final .jaguar-image-architecture { position: relative; z-index: 1; }

.pm-wp-final .arch-bg-shape {
    position: absolute; top: -20px; left: -20px; width: 80%; height: 90%;
    background: #eff6ff; border-radius: 30px; z-index: -1;
}
.pm-wp-final .arch-dot-pattern {
    position: absolute; bottom: -30px; right: -20px; width: 100px; height: 100px;
    background-image: radial-gradient(#fcd34d 2px, transparent 2px);
    background-size: 15px 15px; z-index: -1;
}

.pm-wp-final .arch-img-holder {
    border-radius: 24px; overflow: hidden;
    box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.1);
    background: #fff; padding: 8px; border: 1px solid #f1f5f9;
}
.pm-wp-final .jaguar-master-img {
    width: 100%; height: auto; display: block; border-radius: 18px; filter: saturate(1.05);
}

/* Glass Badge */
.pm-wp-final .jaguar-glass-badge {
    position: absolute; bottom: 30px; left: -20px;
    background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(12px);
    border: 1px solid var(--final-border); padding: 12px 20px; border-radius: 16px;
    display: flex; align-items: center; gap: 15px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08); z-index: 5;
    animation: pm-wp-float-badge 4s ease-in-out infinite;
}
.pm-wp-final .badge-icon { font-size: 24px; }
.pm-wp-final .badge-content { display: flex; flex-direction: column; }
.pm-wp-final .b-title { font-size: 14px; font-weight: 800; color: #1e293b; }
.pm-wp-final .b-sub { font-size: 12px; color: var(--final-text-muted); }

/* Content Side */
.pm-wp-final .jaguar-subtitle {
    display: flex; align-items: center; gap: 10px;
    color: var(--final-text-muted); font-size: 14px; font-weight: 700; margin-bottom: 20px;
}
.pm-wp-final .line { width: 30px; height: 2px; background: #cbd5e1; }

.pm-wp-final .jaguar-heading {
    font-size: 38px; font-weight: 900; color: var(--final-text-dark);
    line-height: 1.4; margin-bottom: 30px;
}
.pm-wp-final .text-primary { color: var(--final-blue); }
.pm-wp-final .text-gold { color: var(--final-gold); position: relative; z-index: 1; }
.pm-wp-final .text-gold::after {
    content: ''; position: absolute; bottom: 2px; right: 0; left: 0; height: 8px;
    background: #fef3c7; z-index: -1; border-radius: 4px;
}

.pm-wp-final .jaguar-seo-text {
    font-size: 16px; line-height: 1.8; color: #475569; margin-bottom: 45px;
}
.pm-wp-final .jaguar-seo-text strong { color: var(--final-text-dark); font-weight: 700; }
.pm-wp-final .clean-link {
    color: var(--final-blue); text-decoration: none; border-bottom: 1px dashed #93c5fd;
    transition: 0.2s;
}
.pm-wp-final .clean-link:hover { border-bottom-style: solid; }

/* Features Grid */
.pm-wp-final .jaguar-features-grid {
    display: grid; grid-template-columns: 1fr; gap: 20px;
}
.pm-wp-final .j-feature-box {
    background: #fff; border: 1px solid var(--final-border);
    border-radius: 18px; padding: 20px;
    display: flex; align-items: center; gap: 20px; transition: all 0.3s ease;
}
.pm-wp-final .j-feature-box:hover {
    border-color: #bfdbfe; transform: translateY(-3px);
    box-shadow: 0 10px 30px -5px rgba(37, 99, 235, 0.1);
}

.pm-wp-final .j-icon-wrapper {
    width: 125px; height: 125px; border-radius: 10%;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.pm-wp-final .tech-bg { background: #eff6ff; color: var(--final-blue); }
.pm-wp-final .human-bg { background: #fffbeb; color: var(--final-gold); }
.pm-wp-final .j-icon-wrapper img { width: 115px; height: 115px; object-fit: contain; }

.pm-wp-final .j-feat-data h3 { font-size: 16px; font-weight: 800; color: #1e293b; margin: 0 0 5px 0; }
.pm-wp-final .j-feat-data p { font-size: 14px; color: var(--final-text-muted); margin: 0; line-height: 1.5; }

/* Animation (Scoped) */
@keyframes pm-wp-float-badge {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Responsive */
@media (max-width: 992px) {
    .pm-wp-final .jaguar-final-grid { grid-template-columns: 1fr; text-align: center; gap: 50px; }
    .pm-wp-final .jaguar-visual-side { order: -1; max-width: 550px; margin: 0 auto; }
    .pm-wp-final .jaguar-subtitle { justify-content: center; }
    .pm-wp-final .j-feature-box { text-align: right; }
    .pm-wp-final .jaguar-glass-badge { left: 50%; transform: translateX(-50%); bottom: -15px; animation: none; }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 8: JAGUAR DARK SHOWCASE (Neon & Cyber Style)
   Parent Class: .pm-wp-dark-showcase
   ========================================================================== */
.pm-wp-dark-showcase {
    /* --- Scoped Variables --- */
    --dark-bg: #020617;
    --dark-text: #f8fafc;
    --dark-muted: #cbd5e1;
    --dark-border: rgba(56, 189, 248, 0.3);
    --dark-neon: #38bdf8;
    --dark-card-bg: rgba(15, 23, 42, 0.85);

    background-color: var(--dark-bg);
    padding: 100px 0; position: relative; direction: rtl; color: var(--dark-text);
    overflow: hidden; font-family: inherit; box-sizing: border-box;
}
.pm-wp-dark-showcase * { box-sizing: border-box; }

/* Cyber Grid Pattern */
.pm-wp-dark-showcase .j-dark-pattern {
    position: absolute; inset: 0;
    background-image: 
        linear-gradient(rgba(56, 189, 248, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, 0.03) 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: radial-gradient(circle at 70% 50%, black 20%, transparent 80%);
    -webkit-mask-image: radial-gradient(circle at 70% 50%, black 20%, transparent 80%);
    pointer-events: none; z-index: 1;
}

.pm-wp-dark-showcase .j-dark-container {
    max-width: 1200px; margin: 0 auto; padding: 0 25px;
    position: relative; z-index: 2;
}

.pm-wp-dark-showcase .j-dark-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}

/* Content Column */
.pm-wp-dark-showcase .j-dark-col-content { position: relative; }
.pm-wp-dark-showcase .j-dark-quote-box { position: relative; padding-right: 20px; }
.pm-wp-dark-showcase .j-dark-quote-icon {
    font-size: 90px; line-height: 1; color: #1e293b;
    position: absolute; top: -45px; right: -15px; z-index: -1;
    font-family: serif; opacity: 0.5;
}

.pm-wp-dark-showcase .j-dark-testimonial p {
    font-size: 18px; line-height: 1.9; color: var(--dark-muted);
    margin-bottom: 35px; text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}
.pm-wp-dark-showcase .j-dark-testimonial strong {
    color: #fff; font-weight: 700; border-bottom: 2px solid #0ea5e9;
}

/* Neon Link */
.pm-wp-dark-showcase .j-neon-link {
    color: var(--dark-neon); text-decoration: none; border-bottom: 1px dashed var(--dark-neon);
    transition: 0.3s; text-shadow: 0 0 10px rgba(56, 189, 248, 0.3);
}
.pm-wp-dark-showcase .j-neon-link:hover {
    color: #fff; border-bottom-style: solid; text-shadow: 0 0 15px rgba(56, 189, 248, 0.8);
}

/* Footer Info */
.pm-wp-dark-showcase .j-dark-testimonial footer {
    display: flex; align-items: center; gap: 15px;
    border-top: 1px solid rgba(255,255,255,0.1); padding-top: 25px;
}
.pm-wp-dark-showcase .j-dark-avatar img {
    border-radius: 50%; border: 2px solid var(--dark-border);
    box-shadow: 0 0 15px rgba(56, 189, 248, 0.2);
}
.pm-wp-dark-showcase .j-dark-info { display: flex; flex-direction: column; }
.pm-wp-dark-showcase .j-dark-author { font-size: 18px; font-weight: 700; color: #fff; font-style: normal; }
.pm-wp-dark-showcase .j-dark-position { font-size: 14px; color: #94a3b8; margin-top: 4px; }

/* CTA Button */
.pm-wp-dark-showcase .j-dark-cta { margin-top: 35px; }
.pm-wp-dark-showcase .j-btn-neon {
    color: var(--dark-neon); font-weight: 700; text-decoration: none;
    display: inline-flex; align-items: center; gap: 10px; transition: 0.3s; font-size: 16px;
    padding: 12px 26px; border: 1px solid var(--dark-border);
    border-radius: 50px; background: rgba(56, 189, 248, 0.05);
}
.pm-wp-dark-showcase .j-btn-neon:hover {
    background: rgba(56, 189, 248, 0.15); border-color: var(--dark-neon); color: #fff;
    box-shadow: 0 0 20px rgba(56, 189, 248, 0.4); transform: translateX(-5px);
}

/* Visual Column (Laptop) */
.pm-wp-dark-showcase .j-dark-col-visual { position: relative; padding: 20px; }
.pm-wp-dark-showcase .j-dark-macbook-wrap {
    width: 100%; max-width: 550px; margin: 0 auto; perspective: 1500px; position: relative;
}
.pm-wp-dark-showcase .j-back-glow {
    position: absolute; inset: 10%; background: #0ea5e9;
    filter: blur(60px); opacity: 0.25; z-index: 0;
    animation: pm-wp-pulse-glow 4s infinite alternate;
}

/* Laptop Lid */
.pm-wp-dark-showcase .j-dm-lid {
    background: #1e293b; border-radius: 18px 18px 0 0;
    padding: 12px 12px 0 12px; border: 1px solid #334155;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05);
    transform-origin: bottom; transform: rotateX(5deg);
    transition: transform 0.5s ease; position: relative; z-index: 2;
}
.pm-wp-dark-showcase .j-dark-macbook-wrap:hover .j-dm-lid { transform: rotateX(0deg); }

.pm-wp-dark-showcase .j-dm-screen {
    background: #000; border-radius: 6px 6px 0 0; overflow: hidden;
    aspect-ratio: 16/10; position: relative;
}
.pm-wp-dark-showcase .j-dm-img {
    width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0.9;
    transition: transform 0.6s ease;
}
.pm-wp-dark-showcase .j-dark-macbook-wrap:hover .j-dm-img { transform: scale(1.04); opacity: 1; }

/* Laptop Base */
.pm-wp-dark-showcase .j-dm-base {
    height: 14px; background: linear-gradient(to bottom, #334155, #1e293b);
    border-radius: 0 0 20px 20px; margin-top: -1px; position: relative;
    border: 1px solid #334155; border-top: none;
    box-shadow: 0 25px 50px rgba(0,0,0,0.5);
}
.pm-wp-dark-showcase .j-dm-base::after {
    content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
    width: 80px; height: 4px; background: #0f172a; border-radius: 0 0 8px 8px;
}

/* Float Card */
.pm-wp-dark-showcase .j-dark-float-card {
    position: absolute; bottom: 30px; left: -30px;
    background: var(--dark-card-bg); backdrop-filter: blur(12px);
    border: 1px solid rgba(56, 189, 248, 0.2); padding: 15px 20px;
    border-radius: 16px; display: flex; align-items: center; gap: 15px;
    box-shadow: 0 0 20px rgba(56, 189, 248, 0.1); z-index: 5;
    animation: pm-wp-float-dark 5s ease-in-out infinite;
}
.pm-wp-dark-showcase .j-d-icon { font-size: 24px; filter: drop-shadow(0 0 5px #22c55e); }
.pm-wp-dark-showcase .j-d-data { display: flex; flex-direction: column; }
.pm-wp-dark-showcase .j-d-label { font-size: 11px; color: #94a3b8; text-transform: uppercase; letter-spacing: 1px; }
.pm-wp-dark-showcase .j-d-value { font-size: 20px; font-weight: 800; color: #fff; }

.pm-wp-dark-showcase .j-status-dot {
    width: 8px; height: 8px; background: #22c55e; border-radius: 50%;
    box-shadow: 0 0 10px #22c55e; animation: pm-wp-blink 2s infinite; margin-right: 10px;
}

/* Animations (Scoped) */
@keyframes pm-wp-float-dark { 0%,100%{transform: translateY(0);} 50%{transform: translateY(-8px);} }
@keyframes pm-wp-blink { 0%,100%{opacity: 1;} 50%{opacity: 0.5;} }
@keyframes pm-wp-pulse-glow { 0%{opacity: 0.2; transform: scale(0.9);} 100%{opacity: 0.35; transform: scale(1.1);} }

/* Responsive */
@media (max-width: 992px) {
    .pm-wp-dark-showcase .j-dark-grid { grid-template-columns: 1fr; gap: 60px; text-align: center; }
    .pm-wp-dark-showcase .j-dark-col-visual { order: -1; }
    .pm-wp-dark-showcase .j-dark-quote-box { padding-right: 0; }
    .pm-wp-dark-showcase .j-dark-quote-icon { right: 50%; transform: translateX(50%); top: -60px; }
    .pm-wp-dark-showcase .j-dark-testimonial footer { justify-content: center; text-align: right; }
    .pm-wp-dark-showcase .j-dark-float-card {
        left: 50%; transform: translateX(-50%); bottom: -25px; width: max-content; animation: none;
    }
}
/* ==========================================================================
   PAGE: WORDPRESS | SECTION 5: JAGUAR PRESTIGE (Luxury Light Stats)
   Parent Class: .pm-wp-prestige
   ========================================================================== */
.pm-wp-prestige {
    /* --- Scoped Variables --- */
    --prestige-bg: #ffffff;
    --prestige-text-dark: #0f172a;
    --prestige-text-muted: #64748b;
    --prestige-blue: #2563eb;
    --prestige-gold: #d97706;
    --prestige-glass: rgba(255, 255, 255, 0.7);

    background-color: var(--prestige-bg);
    /* Subtle Grid Pattern */
    background-image: radial-gradient(#e2e8f0 1px, transparent 1px);
    background-size: 30px 30px;
    padding: 120px 0; position: relative; direction: rtl; font-family: inherit; overflow: hidden;
}
.pm-wp-prestige * { box-sizing: border-box; }

/* Ambient Orbs */
.pm-wp-prestige .j-light-orb {
    position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.4; z-index: 0;
}
.pm-wp-prestige .orb-1 {
    top: -100px; right: -100px; width: 400px; height: 400px;
    background: radial-gradient(circle, #bfdbfe, transparent); /* Soft Blue */
}
.pm-wp-prestige .orb-2 {
    bottom: -100px; left: -100px; width: 500px; height: 500px;
    background: radial-gradient(circle, #fef3c7, transparent); /* Soft Gold */
}

.pm-wp-prestige .j-prestige-container {
    max-width: 1200px; margin: 0 auto; padding: 0 25px; position: relative; z-index: 2;
}

/* Header */
.pm-wp-prestige .j-prestige-header { text-align: center; margin-bottom: 70px; }

.pm-wp-prestige .j-crown-badge {
    display: inline-flex; align-items: center; gap: 8px;
    background: linear-gradient(135deg, #fffbeb, #fef3c7);
    border: 1px solid #fcd34d; padding: 8px 18px; border-radius: 50px;
    color: var(--prestige-gold); font-weight: 700; font-size: 14px; margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(245, 158, 11, 0.15);
}

.pm-wp-prestige .j-prestige-title {
    font-size: 42px; font-weight: 900; color: var(--prestige-text-dark);
    line-height: 1.3; margin-bottom: 20px;
}
.pm-wp-prestige .text-highlight {
    color: var(--prestige-blue); position: relative; display: inline-block;
}
.pm-wp-prestige .text-highlight::after {
    content: ''; position: absolute; bottom: 5px; left: 0; width: 100%; height: 10px;
    background: rgba(37, 99, 235, 0.1); z-index: -1; transform: skewX(-10deg);
}
.pm-wp-prestige .j-prestige-subtitle {
    font-size: 18px; color: var(--prestige-text-muted); margin: 0 auto; max-width: 600px; line-height: 1.8;
}

/* Prism Grid */
.pm-wp-prestige .j-prism-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px;
}

/* Prism Card (Glass) */
.pm-wp-prestige .j-prism-card {
    background: var(--prestige-glass); backdrop-filter: blur(20px);
    border: 1px solid #fff; border-radius: 24px; padding: 40px 20px;
    text-align: center; position: relative; overflow: hidden;
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.05), inset 0 0 0 1px rgba(255,255,255,0.5);
    transition: all 0.4s ease;
}
.pm-wp-prestige .j-prism-card:hover {
    transform: translateY(-10px); background: #fff; border-color: #bfdbfe;
    box-shadow: 0 25px 50px -12px rgba(37, 99, 235, 0.15);
}

/* Featured Card */
.pm-wp-prestige .featured-card {
    background: linear-gradient(to bottom, #fff, #f8fafc); border-color: #e2e8f0;
    transform: scale(1.05); z-index: 2;
    box-shadow: 0 20px 40px -10px rgba(37, 99, 235, 0.1);
}
.pm-wp-prestige .featured-card:hover { transform: scale(1.05) translateY(-10px); }

/* Shimmer Effect */
.pm-wp-prestige .j-shimmer {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, 0.8) 50%, transparent 100%);
    transform: skewX(-20deg) translateX(-150%); transition: none; pointer-events: none;
}
.pm-wp-prestige .j-prism-card:hover .j-shimmer { animation: pm-wp-shine 1s; }

/* Icons */
.pm-wp-prestige .j-prism-icon {
    width: 70px; height: 70px; margin: 0 auto 25px auto;
    filter: drop-shadow(0 10px 15px rgba(37, 99, 235, 0.15)); transition: 0.3s;
}
.pm-wp-prestige .j-prism-card:hover .j-prism-icon { transform: scale(1.1) rotate(5deg); }
.pm-wp-prestige .j-prism-icon img { width: 100%; height: 100%; object-fit: contain; }

/* Numbers */
.pm-wp-prestige .j-big-num {
    font-size: 48px; font-weight: 900;
    background: linear-gradient(135deg, #1e293b 0%, #475569 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    margin-bottom: 5px; position: relative; display: inline-block;
}
.pm-wp-prestige .j-big-num::after {
    content: attr(data-suffix); font-size: 24px; color: #3b82f6; -webkit-text-fill-color: #3b82f6;
    position: absolute; top: 5px; left: -20px;
}

/* SEO Labels */
.pm-wp-prestige .j-seo-label {
    font-size: 15px; color: var(--prestige-text-muted); font-weight: 600; margin: 0;
}

/* Animation (Scoped) */
@keyframes pm-wp-shine {
    0% { transform: skewX(-20deg) translateX(-150%); }
    100% { transform: skewX(-20deg) translateX(150%); }
}

/* Responsive */
@media (max-width: 992px) {
    .pm-wp-prestige .j-prism-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .pm-wp-prestige .featured-card { transform: scale(1); }
    .pm-wp-prestige .featured-card:hover { transform: translateY(-10px); }
}
@media (max-width: 576px) {
    .pm-wp-prestige .j-prism-grid { grid-template-columns: 1fr; }
    .pm-wp-prestige .j-prestige-title { font-size: 32px; }
    .pm-wp-prestige .j-light-orb { opacity: 0.2; }
}
/* ==========================================================================
   PAGE: IRAN HOSTING | SECTION 1: ART HERO (Masterpiece)
   Parent Class: .pm-ir-hero
   ========================================================================== */
.pm-ir-hero {
    /* --- Scoped Variables --- */
    --ir-bg: #020617;
    --ir-gold: #fbbf24;
    --ir-cyan: #22d3ee;
    --ir-green: #22c55e;
    --ir-glass: rgba(15, 23, 42, 0.5);
    --ir-border: rgba(34, 211, 238, 0.3);

    position: relative; min-height: 100vh;
    display: flex; flex-direction: column; justify-content: center;
    padding-top: 80px; background-color: var(--ir-bg);
    overflow: hidden; direction: rtl; font-family: inherit;
}

.pm-ir-hero .ir-content-layer {
    position: relative; z-index: 10; width: 100%; max-width: 1200px;
    height: 100%; display: flex; flex-direction: column; justify-content: space-between;
    min-height: 80vh; margin: 0 auto; padding: 0 20px;
}

/* Background Art */
.pm-ir-hero .ir-bg-art {
    position: absolute; inset: 0;
    /* Image path should be correct in HTML or here */
    background-image: url('/assets/img/hero-iran-master.webp'); 
    background-size: cover; background-position: center bottom;
    filter: brightness(0.9) contrast(1.1) saturate(1.1); z-index: 1;
}

.pm-ir-hero .ir-gradient-mask {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, 
        rgba(2,6,23,0.1) 0%, 
        rgba(2,6,23,0.3) 50%, 
        rgba(2,6,23,0.95) 100%);
    z-index: 2;
}

/* Dust Motes */
.pm-ir-hero .ir-dust-motes {
    position: absolute; inset: 0;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0IiBoZWlnaHQ9IjQiPgo8cmVjdCB3aWR0aD0iNCIgaGVpZ2h0PSI0IiBmaWxsPSIjZmZmIiBmaWxsLW9wYWNpdHk9IjAuMDUiLz4KPC9zdmc+');
    animation: pm-ir-dust 60s linear infinite; z-index: 2; opacity: 0.6;
}

/* Live Status Badge */
.pm-ir-hero .ir-center-stage { text-align: center; margin-top: auto; margin-bottom: 60px; }

.pm-ir-hero .ir-live-status {
    display: inline-flex; align-items: center; gap: 12px;
    background: rgba(15, 23, 42, 0.7); border: 1px solid var(--ir-border);
    padding: 8px 20px; border-radius: 50px; backdrop-filter: blur(8px);
    margin-bottom: 30px; box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    transition: 0.3s; cursor: default;
}
.pm-ir-hero .ir-live-status:hover { background: rgba(15, 23, 42, 0.9); border-color: var(--ir-green); }

.pm-ir-hero .status-indicator { position: relative; width: 10px; height: 10px; display: flex; align-items: center; justify-content: center; }

.pm-ir-hero .blink-dot {
    width: 8px; height: 8px; background-color: var(--ir-green); border-radius: 50%; z-index: 2;
    box-shadow: 0 0 10px var(--ir-green);
}
.pm-ir-hero .pulse-ring {
    position: absolute; width: 100%; height: 100%; border-radius: 50%;
    background-color: var(--ir-green); animation: pm-ir-pulse 2s infinite ease-out; z-index: 1;
}
.pm-ir-hero .status-text { color: #f0fdf4; font-size: 13px; font-weight: 500; letter-spacing: 0.5px; }

/* Typography */
.pm-ir-hero .ir-title-master {
    font-size: 4rem; font-weight: 900; color: #fff; line-height: 1.2;
    margin-bottom: 20px; letter-spacing: -1px; text-shadow: 0 5px 40px rgba(0,0,0,0.6);
}
.pm-ir-hero .text-gold-art { color: var(--ir-gold); text-shadow: 0 0 30px rgba(251, 191, 36, 0.5); font-family: inherit; }
.pm-ir-hero .text-cyan-light { 
    background: linear-gradient(to right, var(--ir-cyan), #e0f2fe);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 20px rgba(34, 211, 238, 0.5));
}

.pm-ir-hero .ir-subtitle-art {
    font-size: 1.2rem; color: #cbd5e1; line-height: 1.8; margin: 0 auto 40px auto; max-width: 800px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.8);
}
.pm-ir-hero .ir-subtitle-art strong { color: #fff; border-bottom: 1px dashed var(--ir-gold); padding-bottom: 2px; }

/* Actions */
.pm-ir-hero .ir-action-row { display: flex; justify-content: center; align-items: center; gap: 20px; }

.pm-ir-hero .btn-art-primary {
    background: linear-gradient(135deg, #d97706, #fbbf24);
    color: #0f172a; padding: 14px 35px; border-radius: 12px;
    font-weight: 800; text-decoration: none; font-size: 1.1rem;
    box-shadow: 0 0 20px rgba(251, 191, 36, 0.3); transition: 0.3s;
    border: 1px solid rgba(255,255,255,0.2);
}
.pm-ir-hero .btn-art-primary:hover {
    transform: translateY(-3px); box-shadow: 0 10px 40px rgba(251, 191, 36, 0.6); background: #fbbf24;
}

.pm-ir-hero .hero-rating-minimal {
    display: flex; align-items: center; gap: 8px; color: #fff; font-size: 13px; font-weight: 500;
    background: rgba(0,0,0,0.3); padding: 8px 16px; border-radius: 50px; border: 1px solid rgba(255,255,255,0.1);
}
.pm-ir-hero .rating-stars-gold::before {
    content: '★★★★★'; font-family: "Times New Roman", serif; color: var(--ir-gold); letter-spacing: 2px;
}

/* Glass Deck */
.pm-ir-hero .ir-glass-deck {
    display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
    align-items: center; background: var(--ir-glass);
    backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1); border-top: 1px solid var(--ir-border);
    border-radius: 20px; padding: 15px 30px; margin-bottom: 40px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5); transition: 0.3s;
}
.pm-ir-hero .ir-glass-deck:hover { background: rgba(15, 23, 42, 0.7); border-color: rgba(34, 211, 238, 0.6); }

/* Deck Items */
.pm-ir-hero .deck-item {
    display: flex; align-items: center; gap: 15px; padding: 10px; transition: 0.3s; border-radius: 12px;
}
.pm-ir-hero .deck-item:hover { background: rgba(255,255,255,0.05); }

.pm-ir-hero .deck-icon-box {
    width: 70px; height: 70px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.3)); transition: 0.3s;
}
.pm-ir-hero .deck-item:hover .deck-icon-box {
    transform: scale(1.15) rotate(-5deg); filter: drop-shadow(0 10px 20px rgba(34,211,238,0.4));
}
.pm-ir-hero .deck-icon-box img { width: 100%; height: 100%; object-fit: contain; }

.pm-ir-hero .deck-info h3 { font-size: 1rem; color: #fff; margin: 0 0 4px 0; font-weight: 700; white-space: nowrap; }
.pm-ir-hero .deck-info p { font-size: 0.8rem; color: #94a3b8; margin: 0; white-space: nowrap; }

.pm-ir-hero .deck-divider {
    width: 1px; height: 40px; background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.2), transparent);
}

/* Animations */
@keyframes pm-ir-pulse {
    0% { transform: scale(0.8); opacity: 1; }
    100% { transform: scale(2.5); opacity: 0; }
}
@keyframes pm-ir-dust { from { background-position: 0 0; } to { background-position: 0 -1000px; } }

/* Responsive */
@media (max-width: 992px) {
    .pm-ir-hero .ir-title-master { font-size: 3rem; }
    .pm-ir-hero .ir-glass-deck { grid-template-columns: 1fr 1fr; gap: 20px; padding: 20px; }
    .pm-ir-hero .deck-divider { display: none; }
}
@media (max-width: 576px) {
    .pm-ir-hero .ir-title-master { font-size: 2.5rem; }
    .pm-ir-hero .ir-glass-deck { grid-template-columns: 1fr; background: rgba(15,23,42,0.8); }
    .pm-ir-hero .deck-item { justify-content: center; text-align: center; flex-direction: column; }
    .pm-ir-hero .deck-info p { white-space: normal; }
}
/* ==========================================================================
   PAGE: IRAN HOSTING | COMPONENT: RATING BADGE
   Parent Class: .pm-ir-rating
   ========================================================================== */
.pm-ir-rating {
    /* --- Scoped Variables --- */
    --rate-gold: #fbbf24;
    --rate-gold-dark: #d97706;
    --rate-cyan: #00f2ff;
    --rate-border: rgba(255, 255, 255, 0.12);
    --rate-bg: rgba(255, 255, 255, 0.08);

    display: inline-flex; align-items: center; gap: 12px;
    padding: 6px 16px; background: var(--rate-bg);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    border: 1px solid var(--rate-border);
    border-radius: 50px; margin-bottom: 20px;
    direction: rtl; transition: transform 0.3s ease;
    font-family: inherit;
}
.pm-ir-rating:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.25);
    transform: translateY(-2px);
}

/* Stars Box */
.pm-ir-rating .rating-stars-box {
    display: flex; align-items: center;
    padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, 0.15);
}

/* Star Display */
.pm-ir-rating .rating-display {
    font-size: 18px; font-family: sans-serif; /* Fallback for symbol rendering */
    display: inline-block; position: relative;
    line-height: 1; letter-spacing: 2px;
}
.pm-ir-rating .rating-display::before {
    content: '★★★★★';
    background: linear-gradient(180deg, var(--rate-gold) 0%, var(--rate-gold-dark) 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 2px rgba(251, 191, 36, 0.4));
}
.pm-ir-rating .rating-display::after {
    content: '★★★★★'; position: absolute; top: 0; left: 0;
    color: rgba(255, 255, 255, 0.2); z-index: -1;
}

/* Text Info */
.pm-ir-rating .rating-info {
    display: flex; align-items: center; gap: 8px;
    color: #e2e8f0; font-size: 13px;
}
.pm-ir-rating .rating-score-row {
    display: flex; align-items: baseline; gap: 2px;
}
.pm-ir-rating .score-num { font-weight: 800; font-size: 15px; color: #fff; }
.pm-ir-rating .score-max { font-size: 11px; opacity: 0.6; }

/* Description */
.pm-ir-rating .rating-desc {
    margin: 0; font-size: 12px; color: #cbd5e1;
    display: flex; align-items: center;
}
.pm-ir-rating .rating-desc strong { color: #fff; font-weight: 700; margin: 0 3px; }
.pm-ir-rating .tech-highlight {
    color: var(--rate-cyan); font-weight: 600; margin-right: 3px;
}
.pm-ir-rating .separator { margin: 0 8px; opacity: 0.3; font-size: 10px; }

/* Responsive */
@media (max-width: 576px) {
    .pm-ir-rating { padding: 5px 12px; gap: 8px; }
    .pm-ir-rating .rating-display { font-size: 16px; letter-spacing: 1px; }
    .pm-ir-rating .rating-info { align-items: center; }
    .pm-ir-rating .rating-desc { font-size: 11px; }
    .pm-ir-rating .separator, 
    .pm-ir-rating .tech-highlight, 
    .pm-ir-rating .rating-desc span:last-child { display: none; }
}
/* ==========================================================================
   PAGE: IRAN HOSTING | SECTION 2: DATA NEXUS (Modern Neon Pricing)
   Parent Class: .pm-ir-nexus
   ========================================================================== */
.pm-ir-nexus {
    /* --- Scoped Variables --- */
    --n-bg: #020617;
    --n-card-bg: rgba(15, 23, 42, 0.6);
    --n-cyan: #00f2ff;
    --n-gold: #ffaa00;
    --n-purple: #8a2be2;
    --n-text: #e2e8f0;

    position: relative; padding: 120px 0;
    background-color: var(--n-bg);
    font-family: inherit; direction: rtl; color: var(--n-text);
    overflow: hidden;
}
.pm-ir-nexus .relative-z { position: relative; z-index: 10; }

/* 1. Atmospheric Background */
.pm-ir-nexus .nexus-bg-image {
    position: absolute; inset: 0;
    /* Ensure image path is correct */
    background-image: url('/assets/img/dark-network-bg.webp'); 
    background-size: cover; background-position: center;
    opacity: 0.2; mix-blend-mode: luminosity; z-index: 0;
}

/* Ambient Lights */
.pm-ir-nexus .nexus-ambient-light {
    position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.4; z-index: 1;
}
.pm-ir-nexus .color-1 {
    top: -20%; left: -10%; width: 600px; height: 600px;
    background: radial-gradient(circle, var(--n-cyan), transparent 70%);
}
.pm-ir-nexus .color-2 {
    bottom: -20%; right: -10%; width: 700px; height: 700px;
    background: radial-gradient(circle, var(--n-purple), transparent 70%);
}

.pm-ir-nexus .nexus-grid-overlay {
    position: absolute; inset: 0;
    background-image: linear-gradient(rgba(0, 242, 255, 0.05) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(0, 242, 255, 0.05) 1px, transparent 1px);
    background-size: 50px 50px; z-index: 2;
    mask-image: radial-gradient(circle at center, black 40%, transparent 100%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 100%);
}

/* 2. Header & Badges */
.pm-ir-nexus .nexus-header { text-align: center; margin-bottom: 70px; position: relative; z-index: 10; }

.pm-ir-nexus .datacenter-badges {
    display: inline-flex; align-items: center; gap: 15px;
    background: rgba(0,0,0,0.3); border: 1px solid rgba(0, 242, 255, 0.2);
    padding: 8px 20px; border-radius: 50px; margin-bottom: 25px;
    backdrop-filter: blur(10px); box-shadow: 0 0 20px rgba(0, 242, 255, 0.1);
}
.pm-ir-nexus .dc-badge { display: flex; align-items: center; gap: 8px; font-size: 0.9rem; font-weight: 700; color: #fff; }
.pm-ir-nexus .icon-pars { color: var(--n-cyan); }
.pm-ir-nexus .icon-asia { color: var(--n-purple); }
.pm-ir-nexus .dc-divider { color: rgba(255,255,255,0.2); }

.pm-ir-nexus .section-title { font-size: 2.5rem; font-weight: 900; color: #fff; margin-bottom: 15px; }
.pm-ir-nexus .text-glow-cyan {
    color: var(--n-cyan); text-shadow: 0 0 20px var(--n-cyan), 0 0 40px var(--n-cyan);
}
.pm-ir-nexus .section-subtitle { font-size: 1.1rem; color: #94a3b8; max-width: 600px; margin: 0 auto; }

/* 3. Neon Toggle Switch */
.pm-ir-nexus .hidden-switch { display: none; }
.pm-ir-nexus .switch-wrapper {
    display: flex; justify-content: center; align-items: center; gap: 15px; margin-bottom: 60px;
}
.pm-ir-nexus .period-label { font-size: 1rem; color: #64748b; transition: 0.3s; }

/* Switch Logic */
.pm-ir-nexus .hidden-switch:not(:checked) ~ .switch-wrapper .period-label:first-child {
    color: #fff; font-weight: 700; text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.pm-ir-nexus .hidden-switch:checked ~ .switch-wrapper .period-label:last-child {
    color: var(--n-gold); font-weight: 700; text-shadow: 0 0 10px rgba(255, 170, 0, 0.3);
}
.pm-ir-nexus .active-period { color: #fff; font-weight: 700; text-shadow: 0 0 10px rgba(255,255,255,0.3); }

.pm-ir-nexus .neon-switch {
    position: relative; width: 64px; height: 32px; background: rgba(0, 0, 0, 0.5);
    border-radius: 50px; cursor: pointer; border: 1px solid rgba(0, 242, 255, 0.3);
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); transition: 0.3s;
}
.pm-ir-nexus .switch-knob {
    position: absolute; top: 3px; right: 3px; left: auto;
    width: 24px; height: 24px; background: #fff; border-radius: 50%;
    transition: 0.4s cubic-bezier(0.25, 1.5, 0.5, 1);
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
.pm-ir-nexus .hidden-switch:checked ~ .switch-wrapper .switch-knob {
    transform: translateX(-32px); background: var(--n-gold); box-shadow: 0 0 15px var(--n-gold);
}
.pm-ir-nexus .hidden-switch:checked ~ .switch-wrapper .neon-switch {
    border-color: var(--n-gold); box-shadow: 0 0 15px rgba(255, 170, 0, 0.2);
}
.pm-ir-nexus .hidden-switch:checked ~ .switch-wrapper .active-period { color: var(--n-gold); }

.pm-ir-nexus .save-pill {
    background: var(--n-gold); color: #000; font-size: 10px; padding: 2px 8px;
    border-radius: 4px; font-weight: 800; vertical-align: middle; margin-right: 5px;
    box-shadow: 0 0 10px rgba(255, 170, 0, 0.4);
}

/* 4. Pricing Grid */
.pm-ir-nexus .nexus-grid {
    display: flex; gap: 25px; overflow-x: auto; padding: 40px 40px 70px 40px;
    scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch;
}
.pm-ir-nexus .nexus-grid::-webkit-scrollbar { height: 6px; }
.pm-ir-nexus .nexus-grid::-webkit-scrollbar-track { background: transparent; }
.pm-ir-nexus .nexus-grid::-webkit-scrollbar-thumb { background: rgba(0, 242, 255, 0.2); border-radius: 10px; }

/* 5. Glass Card */
.pm-ir-nexus .nexus-card {
    flex: 0 0 280px; background: var(--n-card-bg);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 16px;
    padding: 30px 25px; position: relative; overflow: hidden;
    transition: all 0.4s ease; scroll-snap-align: center; display: flex; flex-direction: column;
}
.pm-ir-nexus .card-glow-border {
    position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: linear-gradient(90deg, transparent, var(--n-cyan), transparent);
    box-shadow: 0 2px 15px var(--n-cyan); opacity: 0.7; transition: 0.4s;
}
.pm-ir-nexus .nexus-card:hover {
    transform: translateY(-10px) scale(1.02); background: rgba(15, 23, 42, 0.8);
    border-color: rgba(0, 242, 255, 0.4); box-shadow: 0 20px 50px -15px rgba(0, 242, 255, 0.2);
}
.pm-ir-nexus .nexus-card:hover .card-glow-border { opacity: 1; height: 4px; }

/* Card Content */
.pm-ir-nexus .card-head { text-align: center; margin-bottom: 20px; }
.pm-ir-nexus .plan-name { font-size: 1.3rem; color: #fff; margin: 0 0 5px 0; font-weight: 800; }
.pm-ir-nexus .plan-tag { font-size: 0.85rem; color: var(--n-cyan); letter-spacing: 1px; text-transform: uppercase; }

.pm-ir-nexus .price-box { 
    text-align: center; margin-bottom: 25px; height: 60px; 
    display: flex; flex-direction: column; justify-content: center; 
}
.pm-ir-nexus .price-q, .pm-ir-nexus .price-y { font-size: 1.8rem; font-weight: 900; color: #fff; }
.pm-ir-nexus .price-q small, .pm-ir-nexus .price-y small { font-size: 0.9rem; color: #94a3b8; font-weight: 400; }
.pm-ir-nexus .billing-cycle { font-size: 0.75rem; color: #64748b; margin-top: 5px; }

/* Price Toggle Logic */
.pm-ir-nexus .price-y { display: none; }
.pm-ir-nexus .hidden-switch:checked ~ .nexus-grid .price-q { display: none; }
.pm-ir-nexus .hidden-switch:checked ~ .nexus-grid .price-y { display: block; animation: pm-ir-fade 0.3s; }

/* Plasma Resources */
.pm-ir-nexus .resources-plasma { margin-bottom: 25px; }
.pm-ir-nexus .res-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; font-size: 0.85rem; }
.pm-ir-nexus .plasma-track {
    flex: 1; height: 8px; background: rgba(0,0,0,0.3); border-radius: 10px; margin: 0 12px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.5); overflow: hidden;
}
.pm-ir-nexus .plasma-fill {
    height: 100%; border-radius: 10px; position: relative; overflow: hidden;
}
.pm-ir-nexus .plasma-fill::after {
    content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
    animation: pm-ir-plasma 2s infinite linear;
}
.pm-ir-nexus .cyan-plasma { background: var(--n-cyan); box-shadow: 0 0 12px var(--n-cyan); }
.pm-ir-nexus .res-val { color: #fff; font-weight: 700; }

/* Specs & Button */
.pm-ir-nexus .specs-list { list-style: none; padding: 0; margin: 0 0 25px 0; text-align: center; flex: 1; }
.pm-ir-nexus .specs-list li { color: #cbd5e1; font-size: 0.9rem; margin-bottom: 10px; }

.pm-ir-nexus .btn-nexus {
    display: block; width: 100%; padding: 12px; text-align: center;
    background: transparent; border: 1px solid rgba(0, 242, 255, 0.3);
    color: var(--n-cyan); text-decoration: none; border-radius: 8px; font-weight: 700;
    transition: 0.3s; position: relative; overflow: hidden;
}
.pm-ir-nexus .btn-nexus:hover {
    background: var(--n-cyan); color: #000; box-shadow: 0 0 30px rgba(0, 242, 255, 0.4);
}

/* Popular Card */
.pm-ir-nexus .popular-nexus {
    transform: scale(1.05); z-index: 5;
    border-color: rgba(255, 170, 0, 0.4);
    background: linear-gradient(to bottom, rgba(30, 20, 5, 0.7), rgba(15, 23, 42, 0.8));
    box-shadow: 0 0 40px rgba(255, 170, 0, 0.15);
}
.pm-ir-nexus .popular-nexus:hover {
    transform: scale(1.05) translateY(-10px);
    border-color: var(--n-gold); box-shadow: 0 20px 60px -10px rgba(255, 170, 0, 0.3);
}
.pm-ir-nexus .popular-badge {
    position: absolute; top: 0; left: 0; right: 0;
    background: var(--n-gold); color: #000; font-size: 11px; font-weight: 800;
    text-align: center; padding: 4px; box-shadow: 0 0 15px var(--n-gold);
}
.pm-ir-nexus .gold-border { background: linear-gradient(90deg, transparent, var(--n-gold), transparent); box-shadow: 0 2px 15px var(--n-gold); }
.pm-ir-nexus .text-gold { color: var(--n-gold) !important; text-shadow: 0 0 15px rgba(255, 170, 0, 0.3); }
.pm-ir-nexus .gold-plasma { background: var(--n-gold); box-shadow: 0 0 12px var(--n-gold); }
.pm-ir-nexus .check-gold { color: #fff; font-weight: 700; }

.pm-ir-nexus .btn-gold { background: var(--n-gold); border-color: var(--n-gold); color: #000; }
.pm-ir-nexus .btn-gold:hover { background: #ffc800; box-shadow: 0 0 40px rgba(255, 170, 0, 0.5); }

/* Animations (Scoped) */
@keyframes pm-ir-plasma { 0% { left: -100%; } 100% { left: 100%; } }
@keyframes pm-ir-fade { from { opacity: 0; filter: blur(5px); } to { opacity: 1; filter: blur(0); } }

/* Responsive */
@media (min-width: 1100px) {
    .pm-ir-nexus .nexus-grid { justify-content: center; flex-wrap: wrap; padding-bottom: 40px; }
}

/* Button Swap Logic (No JS) */
.pm-ir-nexus .btn-y { display: none; }
.pm-ir-nexus .hidden-switch:checked ~ .nexus-grid .btn-q { display: none; }
.pm-ir-nexus .hidden-switch:checked ~ .nexus-grid .btn-y { display: block; animation: pm-ir-fade 0.3s ease-in-out; }
/* ==========================================================================
   PAGE: IRAN HOSTING | SECTION 4: COMPARISON TABLE (Luminous)
   Parent Class: .pm-ir-compare
   ========================================================================== */
.pm-ir-compare {
    /* --- Scoped Variables --- */
    --mt-bg: #f8fafc;
    --mt-cyan: #06b6d4;
    --mt-cyan-dim: rgba(6, 182, 212, 0.1);
    --mt-gold: #f59e0b;
    --mt-gold-dim: rgba(245, 158, 11, 0.15);
    --mt-gold-shadow: rgba(245, 158, 11, 0.4);
    --mt-text: #334155;
    --mt-border: #e2e8f0;

    position: relative; padding: 100px 0;
    background-color: var(--mt-bg); color: var(--mt-text);
    font-family: inherit; direction: rtl; overflow: hidden;
}
.pm-ir-compare .relative-z { position: relative; z-index: 10; }

/* 1. Background Effects */
.pm-ir-compare .modern-dots-bg {
    position: absolute; inset: 0;
    background-image: radial-gradient(#cbd5e1 1.5px, transparent 1.5px);
    background-size: 24px 24px; opacity: 0.6; z-index: 0;
    mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
}

.pm-ir-compare .modern-light-glow {
    position: absolute; top: -20%; left: 50%; transform: translateX(-50%);
    width: 80%; height: 600px;
    background: radial-gradient(ellipse at center, rgba(6, 182, 212, 0.15), transparent 70%);
    z-index: 0; pointer-events: none;
}

/* 2. Header */
.pm-ir-compare .comp-header { text-align: center; margin-bottom: 50px; position: relative; z-index: 2; }
.pm-ir-compare .section-title { font-size: 2.2rem; font-weight: 900; color: #0f172a; margin-bottom: 2.5rem; }
.pm-ir-compare .text-gradient {
    background: linear-gradient(45deg, var(--mt-cyan), #3b82f6);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-ir-compare .section-subtitle { color: #64748b; font-size: 1rem; }

/* 3. Table Frame */
.pm-ir-compare .table-frame {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-radius: 24px; border: 1px solid #fff;
    box-shadow: 0 20px 50px -10px rgba(0,0,0,0.05), 0 0 0 1px rgba(6, 182, 212, 0.1);
    overflow: hidden; position: relative;
}

.pm-ir-compare .table-scroll-area {
    overflow-x: auto; width: 100%; padding-bottom: 10px;
}
.pm-ir-compare .table-scroll-area::-webkit-scrollbar { height: 8px; }
.pm-ir-compare .table-scroll-area::-webkit-scrollbar-track { background: transparent; }
.pm-ir-compare .table-scroll-area::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
.pm-ir-compare .table-scroll-area::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* 4. Table Styles */
.pm-ir-compare .modern-table {
    width: 100%; border-collapse: separate; border-spacing: 0; min-width: 1100px;
}

/* Header Cells */
.pm-ir-compare .modern-table thead th {
    padding: 25px 15px; background: #fff; color: #0f172a;
    font-size: 1.1rem; font-weight: 800; border-bottom: 2px solid var(--mt-border);
    position: relative;
}

/* Sticky Column */
.pm-ir-compare .sticky-head, .pm-ir-compare .sticky-col {
    position: sticky; right: 0; z-index: 20; background: #fff;
    box-shadow: -5px 0 15px rgba(0,0,0,0.03); border-left: 1px solid var(--mt-border);
}
.pm-ir-compare .sticky-col { 
    z-index: 10; color: #1e293b; font-weight: 700; text-align: right; padding-right: 30px !important; 
}

/* Highlight Column Header */
.pm-ir-compare .highlight-th {
    background: #fffcf4 !important; color: var(--mt-gold) !important;
    border-bottom: 2px solid var(--mt-gold) !important; position: relative; overflow: hidden;
}
.pm-ir-compare .highlight-th::after {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 60px;
    background: linear-gradient(to bottom, rgba(245, 158, 11, 0.15), transparent); pointer-events: none;
}

.pm-ir-compare .rec-badge {
    position: absolute; top: 0; left: 50%; transform: translateX(-50%);
    background: var(--mt-gold); color: #fff; font-size: 0.7rem; font-weight: 700;
    padding: 2px 10px; border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 10px rgba(245, 158, 11, 0.4);
}

/* Body Cells */
.pm-ir-compare .modern-table td {
    padding: 18px 10px; font-size: 0.95rem; color: #475569; text-align: center;
    border-bottom: 1px solid #f1f5f9; transition: background 0.2s;
}
.pm-ir-compare .modern-table tr:hover td { background: #f8fafc; }
.pm-ir-compare .modern-table tr:hover td.sticky-col { background: #f8fafc; }

/* Highlight Column Body */
.pm-ir-compare .highlight-td {
    background: var(--mt-gold-dim) !important; color: #78350f !important; font-weight: 700;
    border-left: 1px dashed rgba(245, 158, 11, 0.3);
    border-right: 1px dashed rgba(245, 158, 11, 0.3); position: relative;
}

/* Icons */
.pm-ir-compare .icon-cell { vertical-align: middle; }
.pm-ir-compare .icon-check { width: 22px; height: 22px; color: #10b981; }
.pm-ir-compare .icon-cross { width: 22px; height: 22px; color: #cbd5e1; }
.pm-ir-compare .highlight-td .icon-check {
    color: var(--mt-gold); transform: scale(1.2); filter: drop-shadow(0 0 5px rgba(245, 158, 11, 0.5));
}

/* 5. Buttons */
.pm-ir-compare .action-row td { padding: 25px 10px; border-bottom: none; }

.pm-ir-compare .btn-outline {
    display: inline-block; padding: 8px 20px; border: 1px solid #cbd5e1;
    color: #64748b; border-radius: 50px; font-size: 0.85rem; font-weight: 600;
    text-decoration: none; transition: 0.3s;
}
.pm-ir-compare .btn-outline:hover {
    border-color: var(--mt-cyan); color: var(--mt-cyan); background: #fff;
    transform: translateY(-2px); box-shadow: 0 5px 15px rgba(6, 182, 212, 0.15);
}

.pm-ir-compare .btn-solid-gold {
    display: inline-block; padding: 10px 24px;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #fff; border-radius: 50px; font-size: 0.9rem; font-weight: 700;
    text-decoration: none; box-shadow: 0 5px 20px rgba(245, 158, 11, 0.4);
    transition: 0.3s;
}
.pm-ir-compare .btn-solid-gold:hover {
    transform: translateY(-3px) scale(1.05); box-shadow: 0 10px 30px rgba(245, 158, 11, 0.6);
}

/* Responsive */
@media (max-width: 768px) {
    .pm-ir-compare .section-title { font-size: 1.6rem; }
}
/* ==========================================================================
   PAGE: IRAN HOSTING | SECTION 5: MODERN TRUST CORE (Glassy Features)
   Parent Class: .pm-ir-trust
   ========================================================================== */
.pm-ir-trust {
    /* --- Scoped Variables --- */
    --trust-bg: #020617;
    --trust-text-muted: #94a3b8;
    --trust-border: rgba(255, 255, 255, 0.08);
    --trust-card-bg: rgba(255, 255, 255, 0.03);

    position: relative; padding: 100px 0;
    background-color: var(--trust-bg); color: #e2e8f0;
    overflow: hidden; font-family: inherit; direction: rtl;
}
.pm-ir-trust .relative-z { position: relative; z-index: 10; }

/* 1. Background Lighting */
.pm-ir-trust .ambient-glow {
    position: absolute; width: 600px; height: 600px; border-radius: 50%;
    filter: blur(100px); opacity: 0.4; z-index: 0;
    animation: pm-ir-float 10s infinite alternate ease-in-out;
}
.pm-ir-trust .glow-blue {
    background: radial-gradient(circle, #3b82f6, transparent 70%); top: -10%; right: -10%;
}
.pm-ir-trust .glow-purple {
    background: radial-gradient(circle, #8b5cf6, transparent 70%); bottom: -10%; left: -10%;
    animation-delay: -5s;
}

.pm-ir-trust .digital-grid-overlay {
    position: absolute; inset: 0;
    background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 50px 50px; z-index: 1; opacity: 0.5;
}

/* 2. Header */
.pm-ir-trust .modern-header { text-align: center; margin-bottom: 70px; position: relative; z-index: 2; }
.pm-ir-trust .section-title { font-size: 2.5rem; font-weight: 900; color: #fff; margin-bottom: 15px; }
.pm-ir-trust .text-gradient {
    background: linear-gradient(to right, #22d3ee, #a855f7);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-ir-trust .section-subtitle { font-size: 1.1rem; color: var(--trust-text-muted); max-width: 700px; margin: 0 auto; }
.pm-ir-trust .text-white { color: #fff; }

/* 3. Grid & Cards */
.pm-ir-trust .trust-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px;
}

.pm-ir-trust .glass-card {
    position: relative; background: var(--trust-card-bg);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--trust-border); border-radius: 20px;
    padding: 30px 20px; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    overflow: hidden; display: flex; flex-direction: column; align-items: center; text-align: center;
}
.pm-ir-trust .card-highlight {
    position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);
    opacity: 0; transition: 0.4s;
}
.pm-ir-trust .glass-card:hover {
    transform: translateY(-10px); background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.2); box-shadow: 0 20px 40px -10px rgba(0,0,0,0.5);
}
.pm-ir-trust .glass-card:hover .card-highlight { opacity: 1; }

/* 4. Icon Stage */
.pm-ir-trust .icon-stage {
    position: relative; width: 90px; height: 90px;
    display: flex; align-items: center; justify-content: center; margin-bottom: 25px;
}
.pm-ir-trust .trust-icon {
    width: 130px; height: 105px; object-fit: contain; position: relative; z-index: 2;
    filter: drop-shadow(0 10px 15px rgba(0,0,0,0.3)); transition: 0.4s;
}
.pm-ir-trust .glass-card:hover .trust-icon { transform: scale(1.15) rotate(-3deg); }

.pm-ir-trust .icon-bulb {
    position: absolute; width: 150px; height: 150px; border-radius: 50%;
    filter: blur(30px); opacity: 0.4; transition: 0.4s; z-index: 1;
}
.pm-ir-trust .glass-card:hover .icon-bulb { opacity: 0.8; filter: blur(40px); }

.pm-ir-trust .blue-bulb { background: #3b82f6; }
.pm-ir-trust .cyan-bulb { background: #22d3ee; }
.pm-ir-trust .purple-bulb { background: #a855f7; }
.pm-ir-trust .gold-bulb { background: #fbbf24; }

/* 5. Content */
.pm-ir-trust .card-body h3 { font-size: 1.2rem; font-weight: 800; color: #fff; margin-bottom: 10px; }
.pm-ir-trust .card-body p {
    font-size: 0.9rem; color: #cbd5e1; margin-bottom: 20px; line-height: 1.6;
}

.pm-ir-trust .feature-list {
    list-style: none; padding: 0; margin: 0; width: 100%;
    border-top: 1px solid rgba(255,255,255,0.05); padding-top: 15px;
}
.pm-ir-trust .feature-list li {
    font-size: 0.85rem; color: var(--trust-text-muted); margin-bottom: 8px;
    display: flex; align-items: center; justify-content: center; gap: 6px;
}
.pm-ir-trust .feature-list li::before {
    content: '•'; color: #22d3ee; font-size: 1.2rem; line-height: 0;
}

/* Animation (Scoped) */
@keyframes pm-ir-float {
    0% { transform: translate(0, 0); }
    100% { transform: translate(50px, 50px); }
}

/* Responsive */
@media (max-width: 1024px) {
    .pm-ir-trust .trust-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 600px) {
    .pm-ir-trust .trust-grid { grid-template-columns: 1fr; }
    .pm-ir-trust .ambient-glow { width: 300px; height: 300px; }
}
/* ==========================================================================
   PAGE: PERSIAN MIZBAN | SECTION: STORY (Daylight Neon)
   Parent Class: .pm-story-root
   ========================================================================== */
.pm-story-root {
    /* --- Scoped Variables --- */
    --pm-bg: #ffffff;
    --pm-neon-blue: #00f2ff;
    --pm-purple: #8b5cf6;
    --pm-dark: #0f172a;
    --pm-gray: #64748b;
    --pm-border: #e2e8f0;
    
    position: relative; padding: 100px 0;
    background-color: var(--pm-bg); color: var(--pm-dark);
    font-family: inherit; direction: rtl; overflow: hidden;
}

.pm-story-root .relative-z { position: relative; z-index: 10; }

/* 1. Background Effects */
.pm-story-root .pm-bg-dots {
    position: absolute; inset: 0;
    background-image: radial-gradient(#cbd5e1 1.5px, transparent 1.5px);
    background-size: 24px 24px; opacity: 0.6; z-index: 0;
    mask-image: radial-gradient(circle at center, black 40%, transparent 100%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 100%);
}

.pm-story-root .pm-ambient-light {
    position: absolute; border-radius: 50%; filter: blur(100px); opacity: 0.5; z-index: 0;
}
.pm-story-root .light-cyan {
    width: 500px; height: 500px;
    background: radial-gradient(circle, var(--pm-neon-blue), transparent 70%);
    top: -20%; right: -10%; opacity: 0.25;
}
.pm-story-root .light-purple {
    width: 600px; height: 600px;
    background: radial-gradient(circle, var(--pm-purple), transparent 70%);
    bottom: -20%; left: -10%; opacity: 0.2;
}

/* 2. Grid Layout */
.pm-story-root .pm-grid-wrapper {
    display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}

/* 3. Visual Column */
.pm-story-root .pm-visual-col { position: relative; padding: 20px; }

.pm-story-root .pm-image-card {
    position: relative; border-radius: 24px; overflow: hidden;
    box-shadow: 0 20px 50px -10px rgba(0,0,0,0.15);
    transform: perspective(1000px) rotateY(2deg);
    transition: 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 2; background: #fff; padding: 10px; border: 1px solid var(--pm-border);
}
.pm-story-root .pm-main-img {
    width: 100%; height: auto; display: block; border-radius: 16px; transition: 0.8s;
}

/* Card Glow */
.pm-story-root .pm-card-glow {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    box-shadow: inset 0 0 40px rgba(0, 242, 255, 0.1); border-radius: 24px;
}

.pm-story-root .pm-visual-col:hover .pm-image-card {
    transform: perspective(1000px) rotateY(0deg) translateY(-10px);
    box-shadow: 0 30px 60px -15px rgba(139, 92, 246, 0.25);
    border-color: var(--pm-neon-blue);
}

/* Deco Elements */
.pm-story-root .pm-deco-circle {
    position: absolute; top: -20px; right: -20px; width: 120px; height: 120px;
    border: 2px solid var(--pm-neon-blue); border-radius: 50%; opacity: 0.3;
    z-index: 1; animation: pm-story-spin 20s linear infinite;
    border-right-color: transparent;
}
.pm-story-root .pm-deco-dots {
    position: absolute; bottom: -30px; left: -30px; width: 100px; height: 100px;
    background-image: radial-gradient(var(--pm-purple) 2px, transparent 2px);
    background-size: 15px 15px; opacity: 0.4; z-index: 1;
}

/* Float Badge */
.pm-story-root .pm-trust-float {
    position: absolute; bottom: 30px; left: -20px;
    background: #fff; padding: 12px 20px; border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    display: flex; align-items: center; gap: 12px; z-index: 5;
    border-left: 4px solid var(--pm-neon-blue);
    animation: pm-story-float 4s ease-in-out infinite;
}
.pm-story-root .pm-float-icon {
    width: 40px; height: 40px; background: rgba(0, 242, 255, 0.1);
    color: var(--pm-neon-blue); border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
}
.pm-story-root .pm-float-icon svg { width: 24px; height: 24px; }
.pm-story-root .pm-float-text { display: flex; flex-direction: column; line-height: 1.2; font-size: 0.85rem; }
.pm-story-root .pm-float-text strong { color: var(--pm-dark); font-weight: 800; }
.pm-story-root .pm-float-text span { color: var(--pm-gray); font-size: 0.75rem; }

/* 4. Content Column */
.pm-story-root .pm-badge-pill {
    display: inline-block; font-size: 0.8rem; font-weight: 700;
    color: var(--pm-purple); background: rgba(139, 92, 246, 0.1);
    padding: 6px 14px; border-radius: 50px; margin-bottom: 20px;
}

.pm-story-root .pm-title {
    font-size: 2.6rem; font-weight: 900; line-height: 1.3;
    color: var(--pm-dark); margin-bottom: 25px;
}
.pm-story-root .pm-text-gradient {
    background: linear-gradient(135deg, var(--pm-neon-blue) 0%, var(--pm-purple) 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 1px rgba(0,0,0,0.1));
}

.pm-story-root .pm-description {
    font-size: 1.05rem; color: var(--pm-gray); line-height: 1.8; margin-bottom: 45px;
}
.pm-story-root .pm-highlight { 
    color: var(--pm-purple); font-weight: 700; border-bottom: 1px dashed var(--pm-neon-blue); 
}

/* Features List */
.pm-story-root .pm-features-list { display: flex; flex-direction: column; gap: 30px; margin-bottom: 45px; }

.pm-story-root .pm-feature-item {
    display: flex; gap: 20px; align-items: flex-start;
    padding: 20px; border-radius: 16px; border: 1px solid transparent; transition: 0.3s;
}
.pm-story-root .pm-feature-item:hover {
    background: #fff; box-shadow: 0 15px 40px -10px rgba(0,0,0,0.08);
    border-color: rgba(0, 242, 255, 0.3);
}

.pm-story-root .pm-icon-wrap {
    flex-shrink: 0; width: 90px; height: 90px; border-radius: 16px;
    display: flex; align-items: center; justify-content: center; transition: 0.3s;
}
.pm-story-root .pm-icon-wrap img { width: 85px; height: 85px; object-fit: contain; }

.pm-story-root .icon-tech { background: rgba(0, 242, 255, 0.08); }
.pm-story-root .icon-human { background: rgba(139, 92, 246, 0.08); }

.pm-story-root .pm-feature-item:hover .icon-tech { 
    background: var(--pm-neon-blue); box-shadow: 0 5px 20px rgba(0, 242, 255, 0.3); 
}
.pm-story-root .pm-feature-item:hover .icon-human { 
    background: var(--pm-purple); box-shadow: 0 5px 20px rgba(139, 92, 246, 0.3); 
}
.pm-story-root .pm-feature-item:hover img { filter: brightness(0) invert(1); }

.pm-story-root .pm-text-wrap h3 { font-size: 1.1rem; font-weight: 800; color: var(--pm-dark); margin-bottom: 5px; }
.pm-story-root .pm-text-wrap p { font-size: 0.9rem; color: var(--pm-gray); margin: 0; line-height: 1.6; }

/* Action Area */
.pm-story-root .pm-action-area { display: flex; align-items: center; gap: 25px; }

.pm-story-root .pm-btn-primary {
    display: inline-flex; align-items: center; gap: 10px;
    background: linear-gradient(135deg, var(--pm-neon-blue), #0ea5e9);
    color: #fff; padding: 14px 32px; border-radius: 50px;
    font-weight: 700; text-decoration: none;
    box-shadow: 0 10px 20px -5px rgba(6, 182, 212, 0.4); transition: 0.3s;
}
.pm-story-root .pm-btn-primary:hover {
    transform: translateY(-3px); box-shadow: 0 15px 30px -5px rgba(6, 182, 212, 0.6); gap: 15px;
}
.pm-story-root .pm-btn-primary svg { width: 20px; height: 20px; }

.pm-story-root .pm-guarantee {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.9rem; color: var(--pm-gray); font-weight: 600;
}
.pm-story-root .pm-guarantee svg { width: 20px; height: 20px; color: var(--pm-purple); }

/* Animations (Scoped) */
@keyframes pm-story-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes pm-story-spin { 100% { transform: rotate(360deg); } }

/* Responsive */
@media (max-width: 992px) {
    .pm-story-root .pm-grid-wrapper { grid-template-columns: 1fr; gap: 60px; }
    .pm-story-root .pm-visual-col { order: -1; max-width: 500px; margin: 0 auto; padding: 0; }
    .pm-story-root .pm-title { font-size: 2rem; }
    .pm-story-root .pm-action-area { flex-direction: column; align-items: flex-start; gap: 20px; }
}
/* ==========================================================================
   PAGE: PERSIAN MIZBAN | SECTION: CLIENT SHOWCASE (Dark & Luminous)
   Parent Class: .pm-showcase-root
   ========================================================================== */
.pm-showcase-root {
    /* --- Scoped Variables --- */
    --pm-bg: #020617;
    --pm-text: #e2e8f0;
    --pm-text-muted: #94a3b8;
    --pm-neon-blue: #00f2ff;
    --pm-gold: #fbbf24;
    --pm-border: rgba(255, 255, 255, 0.08);

    position: relative; padding: 100px 0;
    background-color: var(--pm-bg); color: var(--pm-text);
    font-family: inherit; direction: rtl; overflow: hidden;
}

.pm-showcase-root .relative-z { position: relative; z-index: 10; }

/* 1. Background Effects */
.pm-showcase-root .pm-bg-dots {
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.05) 1.5px, transparent 1.5px);
    background-size: 30px 30px; opacity: 0.5; z-index: 0;
    mask-image: radial-gradient(circle at center, black 40%, transparent 100%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 100%);
}

.pm-showcase-root .pm-ambient-light {
    position: absolute; border-radius: 50%; filter: blur(120px); opacity: 0.4; z-index: 0;
    animation: pm-showcase-pulse 8s infinite alternate ease-in-out;
}
.pm-showcase-root .light-blue {
    width: 600px; height: 600px;
    background: radial-gradient(circle, var(--pm-neon-blue), transparent 70%);
    top: 20%; right: -20%;
}
.pm-showcase-root .light-gold {
    width: 500px; height: 500px;
    background: radial-gradient(circle, var(--pm-gold), transparent 70%);
    bottom: -20%; left: -20%; animation-delay: -4s;
}

/* 2. Header */
.pm-showcase-root .pm-section-header { text-align: center; margin-bottom: 60px; }
.pm-showcase-root .pm-title { font-size: 2.4rem; font-weight: 900; color: #fff; margin-bottom: 15px; }
.pm-showcase-root .pm-text-gradient {
    background: linear-gradient(135deg, var(--pm-neon-blue), #3b82f6);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 2px rgba(0, 242, 255, 0.3));
}
.pm-showcase-root .pm-subtitle { font-size: 1.1rem; color: var(--pm-text-muted); }

/* 3. Grid Layout */
.pm-showcase-root .pm-grid-wrapper {
    display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}

/* 4. Visual Column (Laptop) */
.pm-showcase-root .pm-visual-col { position: relative; padding: 20px; }

.pm-showcase-root .pm-laptop-frame {
    position: relative; width: 100%; max-width: 600px; margin: 0 auto;
    transform: perspective(1000px) rotateY(5deg); transition: 0.5s ease;
}
.pm-showcase-root .pm-visual-col:hover .pm-laptop-frame {
    transform: perspective(1000px) rotateY(0deg) translateY(-10px);
}

.pm-showcase-root .pm-laptop-glow {
    position: absolute; inset: -20px;
    background: radial-gradient(ellipse at center, rgba(0, 242, 255, 0.15), transparent 70%);
    filter: blur(20px); z-index: 0; pointer-events: none;
}

.pm-showcase-root .pm-laptop-body {
    position: relative; z-index: 2; background: #0f172a;
    border: 2px solid #334155; border-radius: 16px 16px 4px 4px;
    padding: 12px 12px 4px 12px; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5);
}

.pm-showcase-root .pm-laptop-screen {
    position: relative; background: #020617; border-radius: 8px; aspect-ratio: 16 / 10;
    display: flex; align-items: center; justify-content: center; overflow: hidden;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.5);
}

.pm-showcase-root .pm-client-logo {
    width: 50%; height: auto; object-fit: contain;
    filter: drop-shadow(0 0 15px rgba(0, 242, 255, 0.4));
    animation: pm-showcase-float 4s infinite ease-in-out;
}

.pm-showcase-root .pm-screen-reflection {
    position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, transparent 50%);
    pointer-events: none;
}

.pm-showcase-root .pm-laptop-base {
    height: 12px; background: #1e293b; border-radius: 0 0 16px 16px; margin-top: -4px;
    position: relative; z-index: 1; border-top: 2px solid #334155;
    box-shadow: 0 5px 10px rgba(0,0,0,0.3);
}
.pm-showcase-root .pm-laptop-base::after {
    content: ''; position: absolute; bottom: -10px; left: 5%; width: 90%; height: 10px;
    background: radial-gradient(ellipse at center, rgba(0, 242, 255, 0.3), transparent 70%);
    filter: blur(5px);
}

/* 5. Content Column */
.pm-showcase-root .pm-testimonial-quote {
    position: relative; background: rgba(30, 41, 59, 0.4);
    backdrop-filter: blur(10px); border: 1px solid var(--pm-border);
    border-radius: 20px; padding: 40px 30px; border-right: 4px solid var(--pm-neon-blue);
}

.pm-showcase-root .pm-quote-icon {
    position: absolute; top: -20px; right: 20px; font-size: 80px; line-height: 1;
    color: var(--pm-neon-blue); opacity: 0.2; font-family: serif; pointer-events: none;
}

.pm-showcase-root .pm-testimonial-quote p {
    font-size: 1.15rem; line-height: 1.8; color: var(--pm-text);
    margin: 0 0 30px 0; font-style: normal;
}
.pm-showcase-root .pm-highlight {
    color: var(--pm-neon-blue); font-weight: 700;
    border-bottom: 1px dashed rgba(0, 242, 255, 0.3);
}

.pm-showcase-root .pm-testimonial-quote footer {
    display: flex; align-items: center; gap: 15px;
}

.pm-showcase-root .pm-author-info { display: flex; flex-direction: column; }
.pm-showcase-root .pm-client-name { font-size: 1.1rem; font-weight: 800; color: #fff; font-style: normal; }
.pm-showcase-root .pm-client-role { font-size: 0.9rem; color: var(--pm-text-muted); }

/* CTA Link */
.pm-showcase-root .pm-cta-link {
    display: inline-flex; align-items: center; gap: 10px; margin-top: 30px;
    color: var(--pm-text); font-weight: 700; text-decoration: none;
    border-bottom: 2px solid var(--pm-gold); padding-bottom: 2px; transition: 0.3s;
}
.pm-showcase-root .pm-cta-link:hover { color: var(--pm-gold); gap: 15px; }
.pm-showcase-root .pm-cta-link svg { width: 20px; height: 20px; }

/* Animations (Scoped) */
@keyframes pm-showcase-pulse { 0%, 100% { opacity: 0.4; } 50% { opacity: 0.6; transform: scale(1.05); } }
@keyframes pm-showcase-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* Responsive */
@media (max-width: 992px) {
    .pm-showcase-root .pm-grid-wrapper { grid-template-columns: 1fr; gap: 60px; }
    .pm-showcase-root .pm-visual-col { order: -1; }
    .pm-showcase-root .pm-title { font-size: 2rem; }
}
/* ==========================================================================
   PAGE: GERMANY HOSTING | SECTION 1: OVH HERO (Final Revised)
   Parent Class: .pm-de-hero
   ========================================================================== */
.pm-de-hero {
    /* --- Scoped Variables --- */
    --ovh-navy: #0f172a;
    --ovh-blue: #125297;
    --ovh-light-blue: #5992d5;
    --ovh-cyan: #00f2ff;
    --ovh-text: #e2e8f0;

    position: relative; padding: 160px 0 100px;
    background-color: var(--ovh-navy); color: var(--ovh-text);
    overflow: hidden; font-family: inherit; direction: rtl;
}

.pm-de-hero .relative-z { position: relative; z-index: 5; }

/* 1. Atmosphere */
.pm-de-hero .ovh-atmosphere { position: absolute; inset: 0; pointer-events: none; }
.pm-de-hero .glow-orb { position: absolute; border-radius: 50%; filter: blur(100px); opacity: 0.3; }

.pm-de-hero .deep-blue-orb {
    width: 800px; height: 800px; background: var(--ovh-blue); top: -30%; right: -20%;
}
.pm-de-hero .cyan-orb {
    width: 600px; height: 600px; background: var(--ovh-cyan);
    bottom: -20%; left: -10%; opacity: 0.15;
}

.pm-de-hero .tech-grid-bg {
    position: absolute; inset: 0;
    background-image: 
        linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
}

/* 2. Layout & Text */
.pm-de-hero .ovh-hero-layout {
    display: grid; grid-template-columns: 1.2fr 1fr; gap: 50px; align-items: center;
    margin-bottom: 100px;
}

.pm-de-hero .ovh-badge {
    display: inline-flex; align-items: center; gap: 10px;
    background: rgba(18, 82, 151, 0.2); border: 1px solid rgba(18, 82, 151, 0.4);
    color: #fff; padding: 6px 16px; border-radius: 50px;
    font-size: 0.85rem; margin-bottom: 25px;
}
.pm-de-hero .shield-icon svg { width: 18px; height: 18px; color: var(--ovh-cyan); }

.pm-de-hero .ovh-main-title { font-weight: 900; line-height: 1.2; margin-bottom: 25px; }
.pm-de-hero .sub-heading { display: block; font-size: 1.4rem; color: var(--ovh-light-blue); margin-bottom: 5px; }
.pm-de-hero .main-heading {
    display: block; font-size: 3.8rem; color: #fff; text-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.pm-de-hero .highlight-heading { display: block; font-size: 1.6rem; color: #cbd5e1; margin-top: 10px; }
.pm-de-hero .ovh-brand { color: #fff; background: var(--ovh-blue); padding: 0 8px; border-radius: 4px; }

.pm-de-hero .ovh-description {
    font-size: 1.1rem; line-height: 1.8; color: #94a3b8; max-width: 550px; margin-bottom: 40px;
}

/* 3. CTA Buttons & Status */
.pm-de-hero .ovh-cta-wrapper-redesigned {
    display: flex; align-items: center; gap: 25px; flex-wrap: wrap;
}

.pm-de-hero .ovh-btn-cyber {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    padding: 18px 36px; background: linear-gradient(180deg, #125297, #0a2e5a);
    border: 1px solid #00f2ff; border-radius: 12px;
    color: #fff; font-weight: 800; font-size: 1.1rem; text-decoration: none;
    overflow: hidden; transition: all 0.4s ease;
    box-shadow: 0 0 20px rgba(0, 242, 255, 0.2);
}
.pm-de-hero .btn-content { position: relative; z-index: 2; display: flex; align-items: center; gap: 12px; }
.pm-de-hero .icon-rocket { font-size: 1.4rem; filter: drop-shadow(0 0 8px rgba(255, 165, 0, 0.6)); transition: 0.4s; }

.pm-de-hero .cyber-glare {
    position: absolute; top: -50%; left: -100%; width: 200%; height: 200%;
    background: linear-gradient(45deg, transparent 20%, rgba(0, 242, 255, 0.3) 50%, transparent 80%);
    transform: skewX(-30deg); transition: 0.6s; opacity: 0;
}
.pm-de-hero .ovh-btn-cyber:hover {
    transform: translateY(-4px); background: linear-gradient(180deg, #1a6ec5, #0f4383);
    box-shadow: 0 10px 30px rgba(0, 242, 255, 0.4);
}
.pm-de-hero .ovh-btn-cyber:hover .cyber-glare { left: 100%; opacity: 1; }
.pm-de-hero .ovh-btn-cyber:hover .icon-rocket { transform: translate(-3px, -3px) rotate(-10deg); }

.pm-de-hero .ovh-status-module {
    display: flex; align-items: center; gap: 15px;
    background: rgba(15, 23, 42, 0.6); backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.08); padding: 12px 24px;
    border-radius: 50px; transition: 0.3s;
}
.pm-de-hero .ovh-status-module:hover { background: rgba(15, 23, 42, 0.8); border-color: rgba(16, 185, 129, 0.3); }

.pm-de-hero .status-light {
    position: relative; width: 14px; height: 14px; background: #10b981; border-radius: 50%;
    box-shadow: 0 0 10px #10b981;
}
.pm-de-hero .pulse-ring {
    position: absolute; top: 50%; left: 50%; width: 100%; height: 100%;
    border-radius: 50%; border: 2px solid #10b981;
    transform: translate(-50%, -50%) scale(1); animation: pm-de-pulse 2s infinite; opacity: 0;
}
.pm-de-hero .status-text { display: flex; flex-direction: column; line-height: 1.3; }
.pm-de-hero .status-label { font-size: 0.75rem; color: #94a3b8; }
.pm-de-hero .status-value { font-size: 0.95rem; color: #fff; font-weight: 700; }

/* 4. Visual (3D) */
.pm-de-hero .ovh-visual-col { position: relative; height: 500px; perspective: 1000px; }
.pm-de-hero .ovh-3d-stage {
    width: 100%; height: 100%; position: relative; transform-style: preserve-3d;
    animation: pm-de-float-stage 6s ease-in-out infinite;
}
.pm-de-hero .ovh-server-img {
    width: 100%; height: 100%; object-fit: contain;
    filter: drop-shadow(0 20px 60px rgba(18, 82, 151, 0.4));
}
.pm-de-hero .float-card {
    position: absolute; background: rgba(15, 23, 42, 0.8);
    backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.1);
    padding: 10px 20px; border-radius: 12px; color: #fff; font-size: 0.9rem;
    display: flex; align-items: center; gap: 8px; box-shadow: 0 10px 20px rgba(0,0,0,0.3);
}
.pm-de-hero .shield-float { top: 20%; right: 0; animation: pm-de-float 4s infinite alternate; }

/* 5. Specs Deck */
.pm-de-hero .ovh-specs-deck {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; position: relative; z-index: 10;
}

.pm-de-hero .glass-spec-card {
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%);
    backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px; padding: 30px 20px;
    display: flex; flex-direction: column; align-items: center; text-align: center;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative; overflow: hidden;
}
.pm-de-hero .glass-spec-card:hover {
    transform: translateY(-10px);
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.02) 100%);
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.5);
}

.pm-de-hero .spec-visual-large {
    position: relative; width: 100px; height: 100px; margin-bottom: 20px;
    display: flex; align-items: center; justify-content: center;
}
.pm-de-hero .large-icon {
    width: 100%; height: 100%; object-fit: contain;
    filter: drop-shadow(0 10px 15px rgba(0,0,0,0.5)); transition: transform 0.4s ease; z-index: 2;
}
.pm-de-hero .icon-glow-bg {
    position: absolute; width: 60px; height: 60px;
    background: radial-gradient(circle, var(--ovh-cyan), transparent 70%);
    filter: blur(20px); opacity: 0.3; z-index: 1; transition: opacity 0.4s;
}

.pm-de-hero .glass-spec-card:hover .large-icon { transform: scale(1.15) rotate(3deg); }
.pm-de-hero .glass-spec-card:hover .icon-glow-bg { opacity: 0.6; }

/* Highlight Spec (Anti-DDoS) */
.pm-de-hero .highlight-spec {
    border-color: rgba(0, 242, 255, 0.3);
    background: linear-gradient(160deg, rgba(0, 242, 255, 0.08) 0%, rgba(15, 23, 42, 0.6) 100%);
}
.pm-de-hero .highlight-spec .icon-glow-bg {
    background: radial-gradient(circle, #ff4500, transparent 70%);
}

.pm-de-hero .spec-content h3 { font-size: 1.1rem; color: #fff; font-weight: 700; margin-bottom: 8px; }
.pm-de-hero .spec-content p { font-size: 0.9rem; color: #94a3b8; line-height: 1.5; margin: 0; }

/* Animations (Scoped) */
@keyframes pm-de-pulse { 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.8; } 100% { transform: translate(-50%, -50%) scale(3); opacity: 0; } }
@keyframes pm-de-float-stage { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }
@keyframes pm-de-float { 0% { transform: translateY(0); } 100% { transform: translateY(-10px); } }

/* Responsive */
@media (max-width: 992px) {
    .pm-de-hero .ovh-hero-layout { grid-template-columns: 1fr; text-align: center; }
    .pm-de-hero .ovh-specs-deck { grid-template-columns: 1fr 1fr; }
    .pm-de-hero .main-heading { font-size: 3rem; }
    .pm-de-hero .ovh-cta-wrapper-redesigned { justify-content: center; }
    .pm-de-hero .ovh-content-col { align-items: center; }
}
@media (max-width: 576px) {
    .pm-de-hero .ovh-specs-deck { grid-template-columns: 1fr; }
    .pm-de-hero .main-heading { font-size: 2.5rem; }
}
/* ==========================================================================
   PAGE: GERMANY HOSTING | SECTION 3: LUMI PLANS (Fixed Layout)
   Parent Class: .pm-de-lumi
   ========================================================================== */
.pm-de-lumi {
    /* --- Scoped Variables --- */
    --lumi-bg: #0b1120;
    --lumi-text: #fff;
    --lumi-cyan: #00f2ff;
    --lumi-gold: #facc15;
    --lumi-dark-grad: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
    --lumi-border: rgba(255, 255, 255, 0.08);

    background-color: var(--lumi-bg); color: var(--lumi-text);
    padding: 100px 0; position: relative; overflow: hidden;
    font-family: inherit; direction: rtl;
}

.pm-de-lumi .relative-z { position: relative; z-index: 5; }

/* Atmosphere */
.pm-de-lumi .ambient-light {
    position: absolute; border-radius: 50%; filter: blur(120px); opacity: 0.4; pointer-events: none;
}
.pm-de-lumi .light-blue { width: 600px; height: 600px; background: #0ea5e9; top: -200px; left: -200px; }
.pm-de-lumi .light-purple { width: 500px; height: 500px; background: #8b5cf6; bottom: -100px; right: -100px; opacity: 0.3; }

.pm-de-lumi .tech-grid-overlay {
    position: absolute; inset: 0;
    background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 50px 50px;
    mask-image: radial-gradient(circle, black 40%, transparent 80%);
    -webkit-mask-image: radial-gradient(circle, black 40%, transparent 80%);
}

/* Header */
.pm-de-lumi .lumi-header { text-align: center; margin-bottom: 50px; }
.pm-de-lumi .section-title { font-size: 2.5rem; font-weight: 900; color: #fff; margin-bottom: 15px; }
.pm-de-lumi .highlight-cyan { color: var(--lumi-cyan); text-shadow: 0 0 25px rgba(0, 242, 255, 0.4); }
.pm-de-lumi .text-cyan { color: var(--lumi-cyan); }

.pm-de-lumi .subtitle-badge {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(15, 23, 42, 0.8); border: 1px solid rgba(255,255,255,0.1);
    padding: 8px 25px; border-radius: 50px; color: #cbd5e1; font-size: 1rem;
    backdrop-filter: blur(5px);
}

/* Card Design */
.pm-de-lumi .lumi-slider { padding: 50px 20px !important; margin: -50px -20px !important; }

.pm-de-lumi .graphic-card {
    background: var(--lumi-dark-grad); border: 1px solid var(--lumi-border);
    border-radius: 24px; position: relative; overflow: hidden; height: 100%;
    display: flex; flex-direction: column; transition: all 0.4s ease;
    box-shadow: 0 15px 30px -5px rgba(0,0,0,0.4);
}
.pm-de-lumi .graphic-card:hover {
    transform: translateY(-10px); box-shadow: 0 20px 40px -5px rgba(0,0,0,0.5);
    border-color: rgba(255,255,255,0.2);
}

/* Card Header */
.pm-de-lumi .card-header-visual {
    padding: 30px 20px 20px; text-align: center; position: relative;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.pm-de-lumi .card-header-visual::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px;
    background: currentColor; box-shadow: 0 0 15px currentColor;
}
.pm-de-lumi .visual-cyan { color: var(--lumi-cyan); }
.pm-de-lumi .visual-gold { color: var(--lumi-gold); }

.pm-de-lumi .plan-level { font-size: 0.85rem; color: #94a3b8; letter-spacing: 1px; text-transform: uppercase; }
.pm-de-lumi .plan-title { font-size: 1.8rem; font-weight: 800; color: #fff; margin-top: 5px; letter-spacing: -0.5px; }

/* Specs Grid */
.pm-de-lumi .card-body { padding: 25px 20px; flex-grow: 1; }

.pm-de-lumi .spec-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
    background: rgba(0,0,0,0.2); padding: 15px 10px; border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.03);
}

.pm-de-lumi .spec-cell { display: flex; flex-direction: column; align-items: center; text-align: center; }
.pm-de-lumi .spec-icon { font-size: 1.4rem; margin-bottom: 8px; opacity: 0.9; }
.pm-de-lumi .spec-val { font-size: 1.1rem; font-weight: 800; color: #fff; line-height: 1.1; }
.pm-de-lumi .spec-val small { font-size: 0.7em; font-weight: normal; margin-right: 2px; }
.pm-de-lumi .spec-name { font-size: 0.75rem; color: #64748b; margin-top: 4px; }

/* Card Footer */
.pm-de-lumi .card-footer {
    padding: 0 20px 30px; text-align: center; margin-top: auto;
    display: flex; flex-direction: column; align-items: center; gap: 15px;
}

.pm-de-lumi .billing-tag {
    font-size: 0.8rem; color: var(--lumi-cyan);
    background: rgba(0, 242, 255, 0.08); padding: 4px 15px; border-radius: 20px;
    font-weight: bold; border: 1px solid rgba(0, 242, 255, 0.1);
}

.pm-de-lumi .price-block {
    display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 5px;
}
.pm-de-lumi .amount { font-size: 2.6rem; font-weight: 800; color: #fff; line-height: 1; letter-spacing: -1px; }
.pm-de-lumi .unit { font-size: 0.95rem; color: #cbd5e1; font-weight: bold; margin-top: 8px; }

.pm-de-lumi .graphic-btn {
    display: block; width: 100%; padding: 14px; border-radius: 14px;
    text-decoration: none; font-weight: 700; font-size: 1rem; color: #fff;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2); transition: 0.3s;
}
.pm-de-lumi .btn-cyan-grad { background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%); }
.pm-de-lumi .btn-cyan-grad:hover {
    background: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%);
    box-shadow: 0 8px 25px rgba(14, 165, 233, 0.4); transform: translateY(-2px);
}

/* Popular Card */
.pm-de-lumi .popular-graphic {
    background: linear-gradient(180deg, #1e293b 0%, #171205 100%);
    border: 1px solid rgba(250, 204, 21, 0.4); transform: scale(1.05); z-index: 2;
    box-shadow: 0 20px 50px -10px rgba(250, 204, 21, 0.15);
}
.pm-de-lumi .pop-tag {
    position: absolute; top: 0; left: 50%; transform: translate(-50%, -20%);
    background: var(--lumi-gold); color: #000; padding: 6px 18px; border-radius: 0 0 12px 12px;
    font-weight: 800; font-size: 0.85rem; box-shadow: 0 5px 15px rgba(250, 204, 21, 0.4);
}
.pm-de-lumi .text-gold { color: var(--lumi-gold) !important; }
.pm-de-lumi .text-white { color: #fff !important; }
.pm-de-lumi .tag-gold { color: var(--lumi-gold); background: rgba(250, 204, 21, 0.1); border-color: rgba(250, 204, 21, 0.2); }
.pm-de-lumi .highlight-grid { background: rgba(250, 204, 21, 0.05); border-color: rgba(250, 204, 21, 0.15); }

.pm-de-lumi .btn-gold-grad {
    background: linear-gradient(135deg, #facc15 0%, #ca8a04 100%); color: #000;
}
.pm-de-lumi .btn-gold-grad:hover {
    background: linear-gradient(135deg, #fde047 0%, #eab308 100%);
    box-shadow: 0 8px 25px rgba(250, 204, 21, 0.4); transform: translateY(-2px);
}

/* Navigation */
.pm-de-lumi .lumi-arrow {
    width: 48px; height: 48px; border-radius: 50%;
    background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.1);
    color: #fff; display: flex; align-items: center; justify-content: center;
    transition: 0.3s; backdrop-filter: blur(5px);
}
.pm-de-lumi .lumi-arrow::after { display: none !important; }
.pm-de-lumi .lumi-arrow svg { width: 24px; height: 24px; }
.pm-de-lumi .lumi-arrow:hover { background: var(--lumi-cyan); color: #000; border-color: var(--lumi-cyan); }

.pm-de-lumi .swiper-button-next { right: 0; }
.pm-de-lumi .swiper-button-prev { left: 0; }

.pm-de-lumi .lumi-dots .swiper-pagination-bullet { background: #fff; opacity: 0.2; width: 8px; height: 8px; }
.pm-de-lumi .lumi-dots .swiper-pagination-bullet-active { background: var(--lumi-cyan); opacity: 1; width: 24px; border-radius: 12px; }

/* Responsive */
@media (max-width: 1024px) {
    .pm-de-lumi .popular-graphic { transform: scale(1); }
}
/* ==========================================================================
   PAGE: GERMANY HOSTING | SECTION 4: COMPARISON TABLE (Light Lab)
   Parent Class: .pm-de-compare
   ========================================================================== */
.pm-de-compare {
    /* --- Scoped Variables --- */
    --cp-bg: #f8fafc;
    --cp-text: #334155;
    --cp-border: #e2e8f0;
    --cp-blue: #0ea5e9;
    --cp-blue-dark: #0284c7;
    --cp-pop-bg: #f0f9ff;

    background-color: var(--cp-bg); padding: 100px 0;
    position: relative; overflow: hidden;
    font-family: inherit; direction: rtl; color: var(--cp-text);
}
.pm-de-compare .relative-z { position: relative; z-index: 5; }

/* 1. Atmosphere */
.pm-de-compare .light-cp-pattern {
    position: absolute; inset: 0;
    background-image: radial-gradient(#cbd5e1 1.5px, transparent 1.5px);
    background-size: 24px 24px; opacity: 0.5;
}
.pm-de-compare .light-cp-orb {
    position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.6;
}
.pm-de-compare .orb-1 { width: 500px; height: 500px; background: #e0f2fe; top: -150px; left: -100px; }
.pm-de-compare .orb-2 { width: 400px; height: 400px; background: #f3e8ff; bottom: -100px; right: -100px; }

/* 2. Header */
.pm-de-compare .light-cp-header { text-align: center; margin-bottom: 50px; position: relative; z-index: 2; }
.pm-de-compare .section-title { font-size: 2.2rem; font-weight: 800; color: #0f172a; margin-bottom: 15px; }
.pm-de-compare .text-gradient-blue {
    background: linear-gradient(135deg, #0ea5e9, #2563eb);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-de-compare .section-subtitle { font-size: 1rem; color: #64748b; max-width: 700px; margin: 0 auto; }
.pm-de-compare .txt-blue { color: var(--cp-blue-dark); }
.pm-de-compare .txt-green { color: #16a34a; font-weight: 800; }

/* 3. Table Wrapper */
.pm-de-compare .light-cp-wrapper {
    background: #fff; border-radius: 24px;
    box-shadow: 0 20px 50px -10px rgba(148, 163, 184, 0.2);
    border: 1px solid #fff; position: relative; max-width: 100%;
}

.pm-de-compare .light-cp-scroll {
    overflow-x: auto; max-height: 800px; border-radius: 24px;
    -webkit-overflow-scrolling: touch; padding-bottom: 20px;
}

.pm-de-compare .light-cp-table {
    width: 100%; border-collapse: separate; border-spacing: 0; min-width: 1200px;
}

/* Table Cells */
.pm-de-compare .light-cp-table th, 
.pm-de-compare .light-cp-table td {
    padding: 18px 20px; text-align: center; border-bottom: 1px solid #f1f5f9;
    font-size: 0.95rem; white-space: nowrap; vertical-align: middle; background: #fff;
}

/* Sticky Logic */
.pm-de-compare .sticky-head-col {
    position: sticky; top: 0; right: 0; z-index: 30;
    background: #f8fafc !important; border-bottom: 2px solid var(--cp-border);
}
.pm-de-compare .sticky-col {
    position: sticky; right: 0; z-index: 20;
    background: #f8fafc !important; border-left: 2px solid #f1f5f9;
    text-align: right !important; font-weight: 700; color: #475569;
    width: 180px; min-width: 180px;
}
.pm-de-compare .corner-box { font-size: 1rem; color: #334155; font-weight: 900; }

/* Headers */
.pm-de-compare .light-cp-table thead th {
    position: sticky; top: 0; z-index: 10;
    background: rgba(255,255,255,0.95); border-bottom: 2px solid var(--cp-border);
    padding-top: 30px; padding-bottom: 20px;
}
.pm-de-compare .plan-head { display: flex; flex-direction: column; gap: 5px; }
.pm-de-compare .ph-title { font-weight: 800; color: #1e293b; font-size: 1.1rem; }
.pm-de-compare .ph-sub { font-size: 0.75rem; color: #94a3b8; font-weight: normal; }

/* Popular Column */
.pm-de-compare .popular-col-head {
    background-color: var(--cp-pop-bg) !important; position: relative;
    border-top: 3px solid var(--cp-blue);
}
.pm-de-compare .popular-col-body {
    background-color: var(--cp-pop-bg) !important; color: #0c4a6e;
    border-left: 1px dashed #bae6fd; border-right: 1px dashed #bae6fd;
}
.pm-de-compare .light-cp-table tbody tr td.popular-col-body { border-bottom-color: #e0f2fe; }

.pm-de-compare .pop-badge {
    position: absolute; top: 0.4rem; left: 50%; transform: translateX(-50%);
    background: var(--cp-blue); color: #fff; font-size: 0.7rem;
    padding: 3px 12px; border-radius: 20px; font-weight: bold; white-space: nowrap;
    box-shadow: 0 4px 10px rgba(14, 165, 233, 0.3);
}

/* Hover Effects */
.pm-de-compare .light-cp-table tbody tr:hover td { background-color: #fffbeb; }
.pm-de-compare .light-cp-table tbody tr:hover .sticky-col { background-color: #f1f5f9; }
.pm-de-compare .light-cp-table tbody tr:hover .popular-col-body { background-color: #e0f2fe; }

/* Price Row */
.pm-de-compare .tr-price td { padding-top: 30px; padding-bottom: 20px; vertical-align: top; }
.pm-de-compare .price-wrap {
    display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.2;
}
.pm-de-compare .amount {
    font-size: 1.6rem; font-weight: 800; color: #0f172a; letter-spacing: -1px;
}
.pm-de-compare .unit {
    font-size: 0.85rem; color: #64748b; font-weight: normal; margin-top: 4px;
}

/* Buttons */
.pm-de-compare .light-btn {
    display: inline-block; padding: 10px 25px;
    border: 1px solid #cbd5e1; border-radius: 12px;
    text-decoration: none; color: #64748b; font-weight: 700; font-size: 0.9rem;
    transition: 0.2s; white-space: nowrap;
}
.pm-de-compare .light-btn:hover {
    border-color: #475569; color: #0f172a; background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.pm-de-compare .btn-filled {
    background: var(--cp-blue); border-color: var(--cp-blue); color: #fff;
    box-shadow: 0 5px 15px rgba(14, 165, 233, 0.25);
}
.pm-de-compare .btn-filled:hover {
    background: var(--cp-blue-dark); color: #fff; transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(14, 165, 233, 0.35);
}

/* Scrollbar */
.pm-de-compare .light-cp-scroll::-webkit-scrollbar { height: 10px; }
.pm-de-compare .light-cp-scroll::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 5px; }
.pm-de-compare .light-cp-scroll::-webkit-scrollbar-thumb {
    background: #cbd5e1; border-radius: 5px; border: 2px solid #f1f5f9;
}
.pm-de-compare .light-cp-scroll::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Responsive */
@media (max-width: 768px) {
    .pm-de-compare .amount { font-size: 1.4rem; }
    .pm-de-compare .unit { font-size: 0.75rem; }
}
/* ==========================================================================
   PAGE: DOMAIN REGISTRATION | SECTION 1: HERO (Safe & Scoped)
   Parent Class: .pm-dm-hero
   ========================================================================== */
.pm-dm-hero {
    /* --- Scoped Variables --- */
    --ds-bg-navy: #0a1128;
    --ds-accent-cyan: #00f2ff;
    --ds-accent-gold: #d4af37;
    --ds-text-light: #e2e8f0;
    --ds-text-muted: #94a3b8;

    background-color: var(--ds-bg-navy);
    color: var(--ds-text-light);
    padding: 120px 0 100px;
    position: relative; overflow: hidden; z-index: 1;
    font-family: inherit; direction: rtl;
}

/* 1. Atmosphere */
.pm-dm-hero .ds-ambient-glow {
    position: absolute; border-radius: 50%; filter: blur(150px); z-index: -1; opacity: 0.25;
}
.pm-dm-hero .glow-cyan-top {
    width: 60vw; height: 60vw; background: var(--ds-accent-cyan); top: -30%; left: -20%;
}
.pm-dm-hero .glow-gold-bottom {
    width: 50vw; height: 50vw; background: var(--ds-accent-gold); bottom: -25%; right: -15%; opacity: 0.15;
}
.pm-dm-hero .ds-bg-grid-overlay {
    position: absolute; inset: 0;
    background-image: 
        linear-gradient(to right, rgba(255,255,255,0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 40px 40px; z-index: -1;
}
.pm-dm-hero .opacity-10 { opacity: 0.1; }

/* 2. Grid Layout */
.pm-dm-hero .ds-hero-grid {
    display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 70px; align-items: center;
}

/* 3. Content Elements */
.pm-dm-hero .ds-eyebrow-badge {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 8px 16px; border-radius: 50px; font-size: 0.9rem; font-weight: 600;
    color: var(--ds-accent-gold); margin-bottom: 25px; backdrop-filter: blur(5px);
}
.pm-dm-hero .badge-icon-glow { text-shadow: 0 0 10px rgba(212, 175, 55, 0.5); }

.pm-dm-hero .ds-hero-title {
    font-size: 3.2rem; font-weight: 800; line-height: 1.4; margin-bottom: 30px;
    letter-spacing: -0.02em; text-align: right;
}
.pm-dm-hero .block-light { display: block; color: #fff; }
.pm-dm-hero .block-gradient-gold {
    display: block; background: linear-gradient(135deg, #fff 30%, var(--ds-accent-gold) 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

.pm-dm-hero .ds-hero-subtitle {
    font-size: 1.15rem; line-height: 1.8; color: var(--ds-text-muted);
    margin-bottom: 45px; max-width: 90%;
}
.pm-dm-hero .text-gold-highlight {
    color: var(--ds-accent-gold); font-weight: 700; border-bottom: 1px dashed rgba(212, 175, 55, 0.5);
}

/* 4. Trust Pillars */
.pm-dm-hero .ds-trust-pillars {
    display: flex; gap: 30px; margin-bottom: 50px;
    border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 30px;
}
.pm-dm-hero .ds-pillar-item { display: flex; align-items: center; gap: 12px; }

.pm-dm-hero .pillar-icon-box {
    width: 42px; height: 42px; display: flex; align-items: center; justify-content: center;
    background: rgba(0, 242, 255, 0.1); border-radius: 12px; color: var(--ds-accent-cyan);
    border: 1px solid rgba(0, 242, 255, 0.2); transition: all 0.3s ease;
}
.pm-dm-hero .ds-pillar-item:hover .pillar-icon-box {
    background: var(--ds-accent-cyan); color: var(--ds-bg-navy);
    box-shadow: 0 0 15px rgba(0, 242, 255, 0.4);
}
.pm-dm-hero .pillar-text { font-weight: 600; font-size: 1rem; }

/* 5. CTA Button */
.pm-dm-hero .ds-cta-btn-premium {
    display: inline-flex; align-items: center; gap: 15px;
    background: linear-gradient(135deg, var(--ds-accent-cyan) 0%, #0066ff 100%);
    color: #fff; padding: 16px 32px; border-radius: 14px; font-weight: 700; font-size: 1.1rem;
    text-decoration: none; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 10px 30px -10px rgba(0, 242, 255, 0.5); border: 1px solid rgba(255, 255, 255, 0.1);
}
.pm-dm-hero .ds-cta-btn-premium:hover {
    transform: translateY(-4px); box-shadow: 0 20px 40px -10px rgba(0, 242, 255, 0.7);
    filter: brightness(1.1);
}
.pm-dm-hero .arrow-down-anim { width: 22px; height: 22px; transition: transform 0.3s ease; }
.pm-dm-hero .ds-cta-btn-premium:hover .arrow-down-anim { transform: translateY(4px); }

/* 6. Visual Column */
.pm-dm-hero .ds-visual-col { position: relative; perspective: 1000px; }
.pm-dm-hero .ds-jewel-container { position: relative; z-index: 2; padding: 20px; }

.pm-dm-hero .floating-levitate { animation: pm-dm-float 6s ease-in-out infinite; }

.pm-dm-hero .ds-hero-image-asset {
    width: 100%; height: auto; display: block; position: relative; z-index: 3;
    border-radius: 24px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.pm-dm-hero .ds-glass-frame-glow {
    position: absolute; inset: 0; border-radius: 28px; border: 2px solid transparent;
    background: linear-gradient(135deg, var(--ds-accent-cyan), var(--ds-accent-gold)) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    opacity: 0.6; z-index: 4; pointer-events: none;
    filter: drop-shadow(0 0 10px rgba(0, 242, 255, 0.3));
}

.pm-dm-hero .ds-light-platform-base {
    position: absolute; bottom: -40px; left: 10%; width: 80%; height: 40px;
    background: radial-gradient(ellipse at center, rgba(0, 242, 255, 0.4) 0%, transparent 70%);
    filter: blur(20px); z-index: 1; transform: scaleY(0.5); opacity: 0.6;
    animation: pm-dm-pulse 6s ease-in-out infinite;
}

/* Animations (Scoped) */
@keyframes pm-dm-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } }
@keyframes pm-dm-pulse { 0%, 100% { opacity: 0.6; transform: scaleY(0.5) scaleX(1); } 50% { opacity: 0.3; transform: scaleY(0.5) scaleX(0.9); } }
@keyframes pm-dm-fadeUp { to { opacity: 1; transform: translateY(0); } }
@keyframes pm-dm-fadeDown { to { opacity: 1; transform: translateY(0); } }

/* Helper Animations */
.pm-dm-hero .animate-fade-in { opacity: 0; transform: translateY(20px); animation: pm-dm-fadeUp 0.8s ease forwards; }
.pm-dm-hero .animate-fade-down { opacity: 0; transform: translateY(-20px); animation: pm-dm-fadeDown 0.8s ease forwards; }
.pm-dm-hero .delay-1 { animation-delay: 0.2s; }
.pm-dm-hero .delay-2 { animation-delay: 0.4s; }
.pm-dm-hero .delay-3 { animation-delay: 0.6s; }

/* Responsive */
@media (max-width: 1024px) {
    .pm-dm-hero .ds-hero-grid { grid-template-columns: 1fr; gap: 50px; }
    .pm-dm-hero .ds-hero-title { font-size: 2.5rem; }
}
@media (max-width: 768px) {
    .pm-dm-hero { padding: 80px 0 60px; }
    .pm-dm-hero .ds-hero-grid { text-align: center; }
    .pm-dm-hero .ds-eyebrow-badge { margin-left: auto; margin-right: auto; }
    .pm-dm-hero .ds-hero-subtitle { margin-left: auto; margin-right: auto; }
    .pm-dm-hero .ds-trust-pillars { flex-wrap: wrap; justify-content: center; gap: 20px; }
    .pm-dm-hero .ds-trust-pillars .ds-pillar-item { flex: 1 1 auto; justify-content: center; }
    .pm-dm-hero .ds-visual-col { order: -1; margin-bottom: -30px; }
    .pm-dm-hero .ds-hero-title { font-size: 2rem; text-align: center; line-height: 1.5; }
    .pm-dm-hero .ds-cta-btn-premium { width: 100%; justify-content: center; }
}
/* ==========================================================================
   PAGE: DOMAIN REGISTRATION | SECTION 2: FLOATING DOCK (Fixed & Scoped)
   Parent Class: .pm-dm-dock-wrapper
   ========================================================================== */

/* --- کانتینر نگهداره اصلی (Scoped) --- */
.pm-dm-dock-wrapper {
    position: relative;
    z-index: 50; /* اولویت بالا */
    height: 0;   /* ارتفاع صفر برای شناور بودن */
    display: flex;
    justify-content: center;
    direction: rtl;
    font-family: inherit;
}

/* --- پنل شیشه‌ای (HUD) --- */
.pm-dm-dock-wrapper .glass-hud-panel {
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 15px; /* فاصله بین آیتم‌ها را کمی بیشتر کردم */
    
    background-color: rgba(11, 17, 32, 0.9); /* کمی تیره‌تر برای دیده شدن بهتر */
    
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.15);
    
    /* تغییر اصلی اینجاست: پدینگ را زیاد کردم */
    padding: 12px 40px; 
    
    border-radius: 100px;
    white-space: nowrap;
    max-width: 95vw;
    
    /* اطمینان از ارتفاع مناسب */
    min-height: 70px; 
}
/* --- لینک‌ها (آیتم‌ها) --- */
.pm-dm-dock-wrapper .hud-link {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 20px; border-radius: 50px;
    color: #94a3b8; text-decoration: none;
    font-weight: 500; font-size: 0.95rem;
    transition: all 0.3s ease; position: relative;
}

.pm-dm-dock-wrapper .icon-box svg {
    width: 20px; height: 20px; opacity: 0.7; transition: transform 0.3s;
}

/* --- جداکننده --- */
.pm-dm-dock-wrapper .hud-sep {
    width: 1px; height: 24px;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.1), transparent);
}

/* --- حالت هاور (Hover) --- */
.pm-dm-dock-wrapper .hud-link:hover {
    color: #fff; background: rgba(255, 255, 255, 0.05);
}
.pm-dm-dock-wrapper .hud-link:hover .icon-box svg {
    opacity: 1; transform: scale(1.15);
}

/* --- حالت فعال (Active) --- */
.pm-dm-dock-wrapper .hud-link.active {
    color: #fff;
    background: linear-gradient(135deg, rgba(0, 242, 255, 0.1) 0%, rgba(0, 102, 255, 0.1) 100%);
    border: 1px solid rgba(0, 242, 255, 0.2);
    font-weight: 700;
}

.pm-dm-dock-wrapper .hud-link.active .icon-box svg {
    stroke: #00f2ff; opacity: 1;
    filter: drop-shadow(0 0 8px rgba(0, 242, 255, 0.6));
}

/* چراغ LED کوچک زیر آیتم فعال */
.pm-dm-dock-wrapper .active-led {
    position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%);
    width: 12px; height: 2px;
    background: #00f2ff;
    border-radius: 4px; box-shadow: 0 -2px 10px #00f2ff;
}

/* --- ریسپانسیو (موبایل) --- */
@media (max-width: 768px) {
    .pm-dm-dock-wrapper .glass-hud-panel {
        /* تنظیم عرض و پدینگ مناسب موبایل */
        width: 95%; 
        padding: 8px 10px; /* پدینگ کمتر نسبت به دسکتاپ */
        min-height: 55px;  /* ارتفاع کمتر نسبت به دسکتاپ */
        
        /* تنظیم اسکرول افقی */
        justify-content: flex-start; /* آیتم‌ها از راست چیده شوند */
        gap: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .pm-dm-dock-wrapper .glass-hud-panel::-webkit-scrollbar { 
        display: none; 
    }
    
    .pm-dm-dock-wrapper .hud-link {
        padding: 8px 12px;
        font-size: 0.85rem;
        flex-shrink: 0; /* جلوگیری از جمع شدن دکمه‌ها */
    }
    .pm-dm-dock-wrapper .link-text { font-size: 0.85rem; }
    .pm-dm-dock-wrapper .hud-sep { display: none; }
}
/* ==========================================================================
   PAGE: DOMAIN REGISTRATION | SECTION: SMART MATRIX (SPX Theme)
   Parent Class: .pm-dm-matrix
   ========================================================================== */

/* --- 1. تنظیمات هسته و کانتینر --- */
.pm-dm-matrix {
    /* Scoped Variables */
    --mx-bg-grad: linear-gradient(180deg, #F8FAFC 0%, #EFF6FF 100%);
    --mx-primary: #3B82F6;
    --mx-purple: #8B5CF6;
    --mx-text-dark: #1E293B;
    --mx-text-muted: #64748B;

    background: var(--mx-bg-grad) !important;
    padding: 120px 0 100px !important;
    font-family: inherit; direction: rtl; text-align: right;
    position: relative; z-index: 2;
    
    /* اتصال نرم به سکشن بالا */
    border-top-left-radius: 60px;
    border-top-right-radius: 60px;
    margin-top: -70px;
    box-shadow: 0 -25px 60px rgba(0,0,0,0.04);
}

.pm-dm-matrix .spx-wrapper {
    max-width: 1150px; margin: 0 auto; position: relative; padding: 0 15px;
}
.pm-dm-matrix .spx-mt-80 { margin-top: 100px; }

/* --- 2. تایپوگرافی --- */
.pm-dm-matrix .spx-head-group { text-align: center; margin-bottom: 40px; }

.pm-dm-matrix .spx-title {
    font-size: 2.4rem !important; font-weight: 800 !important; color: var(--mx-text-dark) !important;
    margin-bottom: 15px !important; display: inline-flex; align-items: center;
    justify-content: center; gap: 12px; line-height: 1.2;
}

.pm-dm-matrix .spx-highlight {
    background: linear-gradient(120deg, var(--mx-primary) 0%, var(--mx-purple) 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; position: relative;
}

.pm-dm-matrix .spx-subtitle {
    color: var(--mx-text-muted) !important; font-size: 1.1rem !important;
    font-weight: 500; max-width: 600px; margin: 0 auto;
}

.pm-dm-matrix .spx-icon-pulse { animation: pm-mx-pulse 3s infinite ease-in-out; display: inline-block; }

/* --- 3. کارت‌های هوشمند --- */
.pm-dm-matrix .spx-cards-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 25px;
}

.pm-dm-matrix .spx-card {
    background: #ffffff; border-radius: 24px; padding: 25px 20px;
    position: relative; border: 1px solid rgba(255,255,255,0.8);
    box-shadow: 0 10px 30px -5px rgba(148, 163, 184, 0.15);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex; flex-direction: column; align-items: center; text-align: center;
    overflow: hidden;
}

.pm-dm-matrix .spx-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px -12px rgba(37, 99, 235, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.pm-dm-matrix .spx-card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--mx-primary), var(--mx-purple));
    opacity: 0; transition: 0.3s;
}
.pm-dm-matrix .spx-card:hover::before { opacity: 1; }

.pm-dm-matrix .spx-smart-tag {
    background: #F1F5F9; color: #475569; font-size: 0.8rem; font-weight: 700;
    padding: 6px 14px; border-radius: 50px; margin-bottom: 12px;
    display: inline-flex; gap: 6px; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.03);
}

.pm-dm-matrix .spx-c-ext {
    font-size: 2.2rem; font-weight: 900; color: #0F172A;
    margin-bottom: 5px; direction: ltr; letter-spacing: -1px;
}

.pm-dm-matrix .spx-price-box { margin: 10px 0 20px; width: 100%; }
.pm-dm-matrix .spx-main-price { font-size: 1.3rem; font-weight: 800; color: #10B981; }
.pm-dm-matrix .spx-sub-price { font-size: 0.9rem; color: #94A3B8; margin-top: 4px; }

.pm-dm-matrix .spx-btn-float {
    background: #EFF6FF; color: var(--mx-primary); width: 100%; padding: 14px;
    border-radius: 16px; font-weight: 700; text-decoration: none;
    transition: 0.3s; border: 1px solid transparent;
}
.pm-dm-matrix .spx-card:hover .spx-btn-float {
    background: var(--mx-primary); color: #fff;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

/* --- 4. نوار ابزار --- */
.pm-dm-matrix .spx-toolbar {
    display: flex; justify-content: space-between; align-items: center;
    gap: 20px; margin-bottom: 35px; background: #ffffff; padding: 12px;
    border-radius: 24px; box-shadow: 0 4px 25px rgba(0,0,0,0.03);
    border: 1px solid #F1F5F9; flex-wrap: wrap;
}

.pm-dm-matrix .spx-smart-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.pm-dm-matrix .spx-smart-tabs::-webkit-scrollbar { display: none; }

.pm-dm-matrix .spx-chip {
    background: transparent; border: none; padding: 10px 20px; border-radius: 14px;
    color: var(--mx-text-muted); font-weight: 600; cursor: pointer; transition: 0.2s;
    white-space: nowrap; font-size: 0.95rem;
}
.pm-dm-matrix .spx-chip:hover { background: #F8FAFC; color: #334155; }
.pm-dm-matrix .spx-chip.active {
    background: #0F172A; color: #fff; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.2);
}

.pm-dm-matrix .spx-prompt-box { position: relative; flex: 1; min-width: 280px; }
.pm-dm-matrix .spx-prompt-box input {
    width: 100%; background: #F8FAFC; border: 2px solid #E2E8F0;
    padding: 14px 45px 14px 20px; border-radius: 16px; outline: none;
    transition: 0.3s; color: #334155; font-size: 1rem;
}
.pm-dm-matrix .spx-prompt-box input:focus {
    background: #fff; border-color: var(--mx-purple);
    box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.1);
}
.pm-dm-matrix .spx-sparkle {
    position: absolute; right: 18px; top: 50%; transform: translateY(-50%);
    color: var(--mx-purple); font-size: 1.2rem;
}

/* --- 5. ماتریس کپسولی --- */
.pm-dm-matrix .spx-matrix-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 15px;
}

.pm-dm-matrix .spx-capsule {
    background: #ffffff; border: 1px solid #F1F5F9; border-radius: 20px;
    padding: 15px 25px; display: flex; align-items: center; justify-content: space-between;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); position: relative;
    box-shadow: 0 2px 5px rgba(0,0,0,0.01);
}
.pm-dm-matrix .spx-capsule:hover {
    border-color: var(--mx-primary); transform: translateX(-5px) translateY(-2px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.06); z-index: 5;
}

.pm-dm-matrix .spx-cap-info { display: flex; align-items: center; gap: 15px; flex: 1; }
.pm-dm-matrix .spx-cap-icon { font-size: 1.5rem; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1)); }
.pm-dm-matrix .spx-cap-name { font-size: 1.4rem; font-weight: 800; color: #334155; direction: ltr; }

.pm-dm-matrix .spx-cap-pricing {
    display: flex; flex-direction: column; align-items: flex-end;
    margin: 0 25px; text-align: left; min-width: 100px;
}
.pm-dm-matrix .spx-cap-price { color: #0F172A; font-weight: 700; font-size: 1.1rem; }
.pm-dm-matrix .spx-cap-renew { color: #94A3B8; font-size: 0.85rem; margin-top: 2px; }

.pm-dm-matrix .spx-cap-action {
    width: 42px; height: 42px; border-radius: 12px;
    background: #F1F5F9; color: var(--mx-primary);
    display: flex; align-items: center; justify-content: center; transition: 0.3s;
}
.pm-dm-matrix .spx-capsule:hover .spx-cap-action {
    background: var(--mx-primary); color: #fff; transform: rotate(90deg);
}

/* --- 6. نوار اعتماد --- */
.pm-dm-matrix .spx-trust-strip {
    margin: 60px auto 0 auto !important; display: flex !important;
    align-items: center; justify-content: center; width: fit-content;
    background: #ffffff; padding: 14px 40px; border-radius: 100px;
    box-shadow: 0 15px 40px -5px rgba(0,0,0,0.06);
    border: 1px solid rgba(255,255,255,0.8); gap: 5px;
}

.pm-dm-matrix .spx-trust-item {
    display: flex; align-items: center; gap: 12px; padding: 0 20px;
    transition: all 0.3s ease; cursor: default; position: relative;
}
.pm-dm-matrix .spx-trust-sep { width: 1px; height: 24px; background: #E2E8F0; }

.pm-dm-matrix .spx-t-icon {
    font-size: 1.5rem; filter: grayscale(0%); transition: 0.3s; transform: scale(1);
}
.pm-dm-matrix .spx-t-text {
    font-size: 0.95rem; font-weight: 700; color: #334155; transition: 0.3s; white-space: nowrap;
}

.pm-dm-matrix .spx-trust-item:hover .spx-t-icon {
    filter: grayscale(100%); opacity: 0.6; transform: scale(0.9);
}
.pm-dm-matrix .spx-trust-item:hover .spx-t-text { color: #94A3B8; }

/* --- 7. ابزارها --- */
.pm-dm-matrix .spx-center-btn { text-align: center; margin-top: 40px; }
.pm-dm-matrix .spx-btn-outline {
    background: #fff; border: 1px solid #CBD5E1; color: var(--mx-text-muted);
    padding: 12px 35px; border-radius: 50px; cursor: pointer;
    font-weight: 600; transition: 0.2s; font-size: 0.95rem;
}
.pm-dm-matrix .spx-btn-outline:hover {
    border-color: var(--mx-primary); color: var(--mx-primary);
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

/* Animations */
@keyframes pm-mx-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.15); filter: drop-shadow(0 0 5px rgba(59,130,246,0.5)); } }

/* Responsive */
@media (max-width: 992px) {
    .pm-dm-matrix .spx-matrix-grid { grid-template-columns: 1fr; }
    .pm-dm-matrix .spx-toolbar { flex-direction: column-reverse; align-items: stretch; }
    .pm-dm-matrix .spx-prompt-box { width: 100%; }
    .pm-dm-matrix .spx-capsule { padding: 15px; flex-wrap: wrap; gap: 10px; }
    .pm-dm-matrix .spx-cap-info { width: 100%; justify-content: flex-start; }
    .pm-dm-matrix .spx-cap-pricing {
        width: 100%; margin: 10px 0; flex-direction: row; justify-content: space-between;
        align-items: center; border-top: 1px dashed #E2E8F0; padding-top: 10px;
    }
    .pm-dm-matrix .spx-cap-action { width: 100%; border-radius: 12px; height: 45px; }
    
    .pm-dm-matrix .spx-trust-strip {
        flex-direction: column; width: 100%; background: transparent;
        box-shadow: none; border: none; padding: 0; margin-top: 40px !important; gap: 15px;
    }
    .pm-dm-matrix .spx-trust-sep { display: none; }
    .pm-dm-matrix .spx-trust-item {
        background: #fff; width: 100%; justify-content: center;
        padding: 15px; border-radius: 16px; box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    }
}
/* ==========================================================================
   PAGE: DOMAIN REGISTRATION | SECTION: HERO SEARCH (Optimized)
   Parent Class: .pm-dm-search
   ========================================================================== */

/* --- 1. Core Layout & Background --- */
.pm-dm-search {
    position: relative;
    background-color: #0B1120;
    color: #fff;
    padding-top: 120px;
    padding-bottom: 40px;
    direction: rtl;
    text-align: right;
    overflow: visible !important; /* حیاتی برای نمایش نتایج */
    z-index: 50;
    font-family: inherit;
}

.pm-dm-search .ds-bg-layer {
    position: absolute; inset: 0; pointer-events: none; z-index: 0;
    overflow: hidden;
}

.pm-dm-search .ds-grid-network {
    position: absolute; inset: 0; opacity: 0.15;
    background-image: linear-gradient(#334155 1px, transparent 1px), linear-gradient(90deg, #334155 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: radial-gradient(circle at center, black 40%, transparent 80%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 80%);
}

.pm-dm-search .ds-glow-spot {
    position: absolute; top: -100px; right: -20%; width: 700px; height: 700px;
    background: #3B82F6; filter: blur(180px); opacity: 0.2;
}

.pm-dm-search .ds-container {
    position: relative; z-index: 10;
    display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 30px; align-items: center;
}

/* --- 2. Typography --- */
.pm-dm-search .ds-headline {
    font-size: 3rem; font-weight: 900; line-height: 1.2; margin-bottom: 20px;
}
.pm-dm-search .ds-text-gradient {
    background: linear-gradient(90deg, #60A5FA, #A78BFA);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.pm-dm-search .ds-description {
    font-size: 1.1rem; color: #94A3B8; max-width: 520px;
    margin-bottom: 35px; line-height: 1.7;
}
.pm-dm-search .ds-subtitle-badge {
    background: rgba(56, 189, 248, 0.1); color: #38BDF8; padding: 5px 14px;
    border-radius: 20px; font-size: 0.85rem; border: 1px solid rgba(56, 189, 248, 0.2);
    margin-bottom: 15px; display: inline-block;
}

/* --- 3. Search Form & Inputs --- */
.pm-dm-search .ds-search-wrapper { position: relative; max-width: 600px; z-index: 100; }

.pm-dm-search .ds-form {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 16px; padding: 8px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.25);
    transition: 0.3s;
}
.pm-dm-search .ds-form:focus-within {
    background: #0F172A; border-color: #3B82F6;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.2);
}

.pm-dm-search .ds-input-group { display: flex; align-items: center; gap: 10px; }
.pm-dm-search .ds-search-icon { color: #94A3B8; padding: 0 12px; display: flex; }

.pm-dm-search .ds-input {
    flex: 1; background: transparent; border: none; outline: none;
    color: #fff; font-size: 1.15rem; padding: 12px 0; text-align: left; direction: ltr;
}
.pm-dm-search .ds-input::placeholder { text-align: right; direction: rtl; color: #64748B; font-size: 1rem; }

.pm-dm-search .ds-submit-btn {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%);
    color: #fff; border: none; padding: 12px 28px;
    border-radius: 12px; cursor: pointer; font-weight: 700; transition: 0.2s;
    font-size: 1rem; box-shadow: 0 5px 15px rgba(37, 99, 235, 0.3);
}
.pm-dm-search .ds-submit-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(37, 99, 235, 0.4); }

.pm-dm-search .ds-tags { margin-top: 15px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 0.9rem; color: #64748B; }
.pm-dm-search .ds-trend-tag {
    background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08);
    color: #94A3B8; padding: 5px 12px; border-radius: 8px; cursor: pointer;
    font-family: sans-serif; transition: 0.2s; font-size: 0.85rem;
}
.pm-dm-search .ds-trend-tag:hover { background: #3B82F6; color: #fff; border-color: #3B82F6; }

/* --- 4. Results Dropdown --- */
.pm-dm-search .ds-results-dropdown {
    position: absolute; top: calc(100% + 15px); left: 0; right: 0;
    background: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border-radius: 20px; padding: 15px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 30px 80px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.05);
    z-index: 9999; transform-origin: top;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    max-height: 60vh; overflow-y: auto;
    scrollbar-width: thin; scrollbar-color: #334155 transparent;
}

.pm-dm-search .ds-results-dropdown::-webkit-scrollbar { width: 6px; }
.pm-dm-search .ds-results-dropdown::-webkit-scrollbar-track { background: transparent; }
.pm-dm-search .ds-results-dropdown::-webkit-scrollbar-thumb { background-color: #334155; border-radius: 20px; }

/* --- 5. Result Header & Items --- */
.pm-dm-search .ds-results-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 15px; padding-bottom: 10px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.pm-dm-search .ds-res-title { font-size: 0.95rem; color: #94A3B8; font-weight: 700; }

.pm-dm-search .ds-close-btn {
    background: rgba(255,255,255,0.05); border: none; color: #CBD5E1;
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: all 0.2s;
}
.pm-dm-search .ds-close-btn:hover { background: rgba(239, 68, 68, 0.2); color: #F87171; transform: rotate(90deg); }

.pm-dm-search .ds-result-card {
    display: flex; justify-content: space-between; align-items: center;
    padding: 14px 18px; background: rgba(255,255,255,0.03);
    border-radius: 12px; margin-bottom: 10px; border: 1px solid rgba(255,255,255,0.03);
}
.pm-dm-search .ds-result-card.available { border-color: rgba(16, 185, 129, 0.3); background: rgba(16, 185, 129, 0.08); }
.pm-dm-search .ds-result-card.unavailable { border-color: rgba(239, 68, 68, 0.3); background: rgba(239, 68, 68, 0.08); }

.pm-dm-search .ds-res-name { font-weight: bold; font-family: sans-serif; font-size: 1.15rem; color: #fff; letter-spacing: 0.5px; }
.pm-dm-search .ds-res-status { display: block; font-size: 0.85rem; opacity: 0.9; margin-top: 4px; }
.pm-dm-search .ds-result-card.available .ds-res-status { color: #34D399; }
.pm-dm-search .ds-result-card.unavailable .ds-res-status { color: #F87171; }

.pm-dm-search .ds-btn-buy {
    background: #10B981; color: #fff; padding: 8px 20px; border-radius: 10px;
    text-decoration: none; font-size: 0.9rem; font-weight: bold; transition: 0.2s;
}
.pm-dm-search .ds-btn-buy:hover { background: #059669; transform: translateY(-2px); }
.pm-dm-search .ds-btn-whois { background: transparent; color: #94A3B8; border: none; text-decoration: underline; cursor: pointer; }
.pm-dm-search .ds-res-taken { font-size: 0.8rem; cursor: not-allowed; opacity: 0.7; }

/* --- 6. Loading & Extras --- */
.pm-dm-search .ds-suggestion-divider {
    font-size: 0.85rem; color: #64748B; margin: 20px 0 10px;
    padding-right: 5px; display: flex; align-items: center; gap: 10px;
}
.pm-dm-search .ds-suggestion-divider::after { content: ''; flex: 1; height: 1px; background: rgba(255,255,255,0.05); }

.pm-dm-search .ds-suggestion-item { padding: 10px 14px; opacity: 0.9; font-size: 0.95rem; }
.pm-dm-search .ds-suggestion-item .ds-res-name { font-size: 1rem; }

.pm-dm-search .ds-loading-box { text-align: center; padding: 25px; color: #94A3B8; }
.pm-dm-search .ds-spinner {
    width: 26px; height: 26px; border: 3px solid rgba(255,255,255,0.15);
    border-top-color: #3B82F6; border-radius: 50%; margin: 0 auto 10px;
    animation: pm-dm-spin 0.8s linear infinite;
}
.pm-dm-search .loading-skeleton { animation: pm-dm-pulse 1.5s infinite; background: rgba(255,255,255,0.02); }

/* Animations (Scoped) */
.pm-dm-search .fade-in { animation: pm-dm-fadeIn 0.4s ease-out; }
@keyframes pm-dm-fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pm-dm-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes pm-dm-pulse { 0% { opacity: 0.6; } 50% { opacity: 1; } 100% { opacity: 0.6; } }

/* --- 7. Visual Image --- */
.pm-dm-search .ds-visual-col {
    position: relative; text-align: center; display: flex;
    justify-content: center; align-items: flex-end; height: 100%;
}
.pm-dm-search .ds-fixed-img {
    position: relative; z-index: 2; width: auto; max-width: 100%;
    max-height: 550px; object-fit: contain;
    mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
    filter: drop-shadow(0 20px 40px rgba(0,0,0,0.4));
}
.pm-dm-search .ds-visual-glow {
    position: absolute; top: 20%; left: 50%; transform: translateX(-50%);
    width: 400px; height: 400px; background: #8B5CF6; filter: blur(120px); opacity: 0.3;
}
.pm-dm-search .ds-curve-divider {
    position: absolute; bottom: -1px; left: 0; width: 100%; overflow: hidden; line-height: 0;
    z-index: 1; pointer-events: none;
}
.pm-dm-search .ds-curve-divider svg { display: block; width: calc(100% + 1.3px); height: 60px; }

/* --- 8. Responsive --- */
@media (max-width: 992px) {
    .pm-dm-search { padding-top: 100px; padding-bottom: 0; text-align: center; }
    .pm-dm-search .ds-container { grid-template-columns: 1fr; gap: 40px; }
    .pm-dm-search .ds-visual-col { order: -1; margin-bottom: -20px; }
    .pm-dm-search .ds-fixed-img { max-height: 350px; }
    .pm-dm-search .ds-headline { font-size: 2.2rem; }
    .pm-dm-search .ds-search-wrapper { margin: 0 auto; width: 100%; }
    .pm-dm-search .ds-input { text-align: center; }
    .pm-dm-search .ds-tags { justify-content: center; }
    .pm-dm-search .ds-results-dropdown { position: relative; top: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
}
/* ==========================================================================
   PAGE: SEO CONTENT | SECTION: LIGHT THEME (Optimized)
   Parent Class: .pm-seo-light
   ========================================================================== */

/* --- 1. تنظیمات هسته --- */
.pm-seo-light {
    position: relative;
    background-color: #F8FAFC; /* سفید یخی */
    padding: 110px 0;
    overflow: hidden;
    font-family: inherit; direction: rtl; text-align: right;
    color: #334155;
    z-index: 1;
}

/* --- 2. نورپردازی محیطی --- */
.pm-seo-light .slx-ambient-light {
    position: absolute; border-radius: 50%; filter: blur(120px); z-index: -1; opacity: 0.6;
}
.pm-seo-light .light-blue {
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
    top: -10%; left: -10%;
}
.pm-seo-light .light-warm {
    width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(249, 115, 22, 0.08) 0%, transparent 70%);
    bottom: -10%; right: -5%;
}

.pm-seo-light .slx-container { position: relative; z-index: 2; }

/* --- 3. هدر --- */
.pm-seo-light .slx-header { text-align: center; max-width: 850px; margin: 0 auto 70px; }

.pm-seo-light .slx-badge {
    display: inline-block; background: #EFF6FF; color: #3B82F6;
    font-size: 0.85rem; font-weight: 800; padding: 6px 18px;
    border-radius: 50px; margin-bottom: 20px;
    border: 1px solid rgba(59, 130, 246, 0.2);
}

.pm-seo-light .slx-title {
    font-size: 2.4rem; font-weight: 900; color: #0F172A;
    margin-bottom: 25px; line-height: 1.3;
}

.pm-seo-light .slx-highlight { color: #3B82F6; position: relative; z-index: 1; }
.pm-seo-light .slx-highlight::after {
    content: ''; position: absolute; bottom: 2px; right: 0; left: 0;
    height: 10px; background: rgba(59, 130, 246, 0.1); z-index: -1; border-radius: 4px;
}

.pm-seo-light .slx-desc { font-size: 1.15rem; color: #64748B; line-height: 1.9; }

/* --- 4. گرید کارت‌ها --- */
.pm-seo-light .slx-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; align-items: stretch;
}

/* --- 5. استایل کارت --- */
.pm-seo-light .slx-card {
    background: #FFFFFF; border: 1px solid #E2E8F0; border-radius: 28px;
    padding: 40px 30px; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative; display: flex; flex-direction: column;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02);
}
.pm-seo-light .slx-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px -5px rgba(0, 0, 0, 0.08); border-color: #CBD5E1;
}

.pm-seo-light .slx-icon-box {
    width: 65px; height: 65px; background: #F8FAFC; border-radius: 20px;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 25px; font-size: 1.8rem; transition: 0.3s; border: 1px solid #F1F5F9;
}
.pm-seo-light .slx-card:hover .slx-icon-box {
    background: #EFF6FF; border-color: #DBEAFE; transform: scale(1.1) rotate(5deg);
}

.pm-seo-light .slx-card-title {
    font-size: 1.3rem; font-weight: 800; color: #1E293B;
    margin-bottom: 15px; letter-spacing: -0.5px;
}

.pm-seo-light .slx-card-text p {
    font-size: 0.95rem; line-height: 1.9; color: #475569; text-align: justify;
}
.pm-seo-light .slx-card-text strong {
    color: #0F172A; font-weight: 700;
    background: linear-gradient(180deg, transparent 60%, rgba(59, 130, 246, 0.1) 60%);
}

/* --- 6. کارت ویژه --- */
.pm-seo-light .slx-card.slx-featured {
    border: 1px solid rgba(59, 130, 246, 0.4); transform: scale(1.05); z-index: 10;
    box-shadow: 0 25px 50px -12px rgba(59, 130, 246, 0.1);
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
}
.pm-seo-light .slx-card.slx-featured:hover {
    transform: scale(1.05) translateY(-10px);
    box-shadow: 0 30px 60px -15px rgba(59, 130, 246, 0.2);
}

.pm-seo-light .slx-icon-box.featured-icon {
    background: #EFF6FF; color: #2563EB; border-color: #BFDBFE;
}
.pm-seo-light .slx-glow-overlay {
    position: absolute; top: 0; left: 0; right: 0; height: 6px;
    background: linear-gradient(90deg, #3B82F6, #60A5FA); opacity: 1;
}

/* --- 7. نتیجه‌گیری --- */
.pm-seo-light .slx-conclusion { margin-top: 60px; text-align: center; }
.pm-seo-light .slx-conclusion p {
    display: inline-flex; align-items: center; gap: 10px;
    background: #fff; border: 1px solid #E2E8F0; padding: 15px 30px;
    border-radius: 50px; font-weight: 600; color: #334155;
    box-shadow: 0 10px 20px -5px rgba(0,0,0,0.03);
}
.pm-seo-light .slx-check { color: #10B981; font-weight: 900; font-size: 1.2rem; }

/* --- 8. ریسپانسیو --- */
@media (max-width: 992px) {
    .pm-seo-light .slx-grid { grid-template-columns: 1fr; gap: 40px; }
    .pm-seo-light .slx-card.slx-featured { transform: scale(1); }
    .pm-seo-light .slx-card.slx-featured:hover { transform: translateY(-10px); }
    .pm-seo-light .slx-title { font-size: 2rem; }
    .pm-seo-light .slx-conclusion p { width: 100%; border-radius: 20px; justify-content: center; }
}
/* ==========================================================================
   PAGE: DOMAIN REGISTRATION | SECTION: PRICING (DPX Theme)
   Parent Class: .pm-dm-pricing
   ========================================================================== */

/* --- 1. تنظیمات اصلی --- */
.pm-dm-pricing {
    position: relative;
    background-color: #0B1120;
    color: #fff;
    padding-top: 100px;
    padding-bottom: 100px;
    direction: rtl; text-align: right;
    font-family: inherit; overflow: hidden; z-index: 2;
}

.pm-dm-pricing .dpx-container {
    position: relative; z-index: 5; max-width: 1200px; margin: 0 auto;
    padding-left: 20px; padding-right: 20px;
}

/* --- 2. نورپردازی پس‌زمینه --- */
.pm-dm-pricing .dpx-glow {
    position: absolute; border-radius: 50%; filter: blur(140px);
    z-index: -1; opacity: 0.2; pointer-events: none;
}
.pm-dm-pricing .dpx-glow-purple {
    width: 600px; height: 600px; background: #8B5CF6; top: 10%; left: -15%;
}
.pm-dm-pricing .dpx-glow-teal {
    width: 500px; height: 500px; background: #14B8A6; bottom: 20%; right: -10%;
}

/* --- 3. تایپوگرافی --- */
.pm-dm-pricing .dpx-header { text-align: center; max-width: 800px; margin: 0 auto 60px; }

.pm-dm-pricing .dpx-headline {
    font-size: 2.6rem; font-weight: 900; color: #ffffff;
    margin-bottom: 20px; line-height: 1.3;
}
.pm-dm-pricing .dpx-highlight {
    color: #2DD4BF; text-shadow: 0 0 25px rgba(45, 212, 191, 0.3);
}
.pm-dm-pricing .dpx-subheadline {
    font-size: 1.1rem; color: #94A3B8; line-height: 1.8;
}
.pm-dm-pricing .dpx-subheadline strong { color: #E2E8F0; }

/* --- 4. گرید کارت‌ها --- */
.pm-dm-pricing .dpx-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; margin-bottom: 60px;
}

/* --- 5. استایل کارت‌ها --- */
.pm-dm-pricing .dpx-card {
    background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px; padding: 30px 20px; text-align: center;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative; display: flex; flex-direction: column; align-items: center;
}

.pm-dm-pricing .dpx-card:hover {
    background: rgba(255, 255, 255, 0.07); transform: translateY(-10px);
    border-color: #3B82F6; box-shadow: 0 20px 50px -10px rgba(0,0,0,0.5);
}

/* کارت ویژه */
.pm-dm-pricing .dpx-card.dpx-featured {
    background: linear-gradient(180deg, rgba(45, 212, 191, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%);
    border: 1px solid rgba(45, 212, 191, 0.3);
    box-shadow: 0 0 30px rgba(45, 212, 191, 0.1);
}
.pm-dm-pricing .dpx-card.dpx-featured:hover {
    border-color: #2DD4BF; box-shadow: 0 0 50px rgba(45, 212, 191, 0.25);
}

.pm-dm-pricing .dpx-badge {
    position: absolute; top: 12px; left: 50%; transform: translateX(-50%);
    background: #2DD4BF; color: #0f172a; font-size: 0.75rem; font-weight: 800;
    padding: 4px 12px; border-radius: 20px;
}

/* محتویات کارت */
.pm-dm-pricing .dpx-icon { font-size: 2.8rem; margin-bottom: 15px; display: block; }

.pm-dm-pricing .dpx-card-title {
    font-size: 1.5rem; font-weight: 800; color: #fff;
    margin-bottom: 10px; letter-spacing: 1px; direction: ltr;
}

.pm-dm-pricing .dpx-card-desc {
    font-size: 0.9rem; color: #94A3B8; margin-bottom: 25px;
    line-height: 1.6; height: 50px; overflow: hidden;
}

.pm-dm-pricing .dpx-price-area { margin-bottom: 25px; }
.pm-dm-pricing .dpx-amount { display: block; font-size: 1.6rem; font-weight: 800; color: #F8FAFC; }
.pm-dm-pricing .dpx-currency { display: block; font-size: 0.8rem; color: #64748B; margin-top: 4px; }

/* دکمه‌ها */
.pm-dm-pricing .dpx-btn {
    display: block; width: 100%; padding: 12px; border-radius: 12px;
    font-weight: 700; text-decoration: none; transition: 0.2s; font-size: 0.95rem;
}
.pm-dm-pricing .dpx-btn-primary {
    background: #2DD4BF; color: #0F172A;
    box-shadow: 0 4px 15px rgba(45, 212, 191, 0.2);
}
.pm-dm-pricing .dpx-btn-primary:hover { background: #14B8A6; transform: translateY(-2px); }

.pm-dm-pricing .dpx-btn-outline {
    background: transparent; border: 1px solid rgba(255,255,255,0.15); color: #fff;
}
.pm-dm-pricing .dpx-btn-outline:hover {
    border-color: #3B82F6; color: #3B82F6; background: rgba(59, 130, 246, 0.05);
}

/* --- 6. نوار اعتماد --- */
.pm-dm-pricing .dpx-trust-container {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;
    margin-top: 40px; border-top: 1px solid rgba(255, 255, 255, 0.08); padding-top: 50px;
}

.pm-dm-pricing .dpx-trust-box {
    display: flex; align-items: flex-start; gap: 20px;
    background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 25px; border-radius: 20px; transition: all 0.3s ease;
}

.pm-dm-pricing .dpx-trust-box:hover {
    background: rgba(255, 255, 255, 0.05); border-color: rgba(45, 212, 191, 0.3);
    transform: translateY(-5px); box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.3);
}

.pm-dm-pricing .dpx-t-icon-wrap {
    flex-shrink: 0; width: 56px; height: 56px;
    background: rgba(45, 212, 191, 0.1); border-radius: 16px;
    display: flex; align-items: center; justify-content: center;
    color: #2DD4BF; transition: 0.3s;
}
.pm-dm-pricing .dpx-trust-box:hover .dpx-t-icon-wrap {
    background: #2DD4BF; color: #0B1120; transform: scale(1.1) rotate(-5deg);
}
.pm-dm-pricing .dpx-t-svg { stroke-width: 1.5; }

.pm-dm-pricing .dpx-t-content { flex: 1; }
.pm-dm-pricing .dpx-t-title { font-size: 1.1rem; font-weight: 800; color: #F8FAFC; margin-bottom: 8px; }
.pm-dm-pricing .dpx-t-desc { font-size: 0.85rem; color: #94A3B8; line-height: 1.6; margin: 0; }

/* --- 7. ریسپانسیو --- */
@media (max-width: 1200px) {
    .pm-dm-pricing .dpx-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; }
}
@media (max-width: 992px) {
    .pm-dm-pricing .dpx-trust-container { grid-template-columns: 1fr; gap: 20px; }
    .pm-dm-pricing .dpx-trust-box { padding: 20px; }
}
@media (max-width: 768px) {
    .pm-dm-pricing .dpx-grid { grid-template-columns: 1fr; gap: 20px; }
    .pm-dm-pricing .dpx-header { margin-bottom: 40px; }
    .pm-dm-pricing .dpx-headline { font-size: 1.8rem; }
    .pm-dm-pricing .dpx-container { padding-left: 15px; padding-right: 15px; }
}
/* =========================================
   SECTION: Why Us (Scoped & Isolated)
   ========================================= */

.pm-why-section {
    position: relative;
    padding: 100px 0;
    background-color: #f8fafc; /* Slate-50 */
    overflow: hidden;
    color: #334155;
}

.pm-why-bg-pattern {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
    background-size: 30px 30px;
    opacity: 0.4;
    z-index: 1;
}

/* گرید بندی اصلی */
.pm-why-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 60px;
    align-items: center;
}

/* --- بخش متن و تیتر --- */
.pm-why-badge-wrap { margin-bottom: 20px; }
.pm-why-top-badge {
    background: rgba(6, 182, 212, 0.1);
    color: #0891b2;
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 700;
}

.pm-why-title {
    font-size: 2.2rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 40px;
    line-height: 1.4;
}
.pm-why-highlight {
    background: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* --- بلوک ویژگی‌ها --- */
.pm-why-feat-block {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
}
.pm-why-feat-line {
    width: 4px;
    background: #e2e8f0;
    border-radius: 4px;
    flex-shrink: 0;
    transition: 0.3s;
}
.pm-why-feat-block:hover .pm-why-feat-line {
    background: linear-gradient(to bottom, #06b6d4, #8b5cf6);
}
.pm-why-feat-body h3 {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 10px;
}
.pm-why-feat-body p {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #475569;
}

/* --- ردیف آمار (Stats Row) --- */
.pm-why-stats-row {
    display: flex;
    align-items: center;
    margin-top: 40px;
    padding-top: 30px;
    border-top: 1px solid #e2e8f0;
}
.pm-why-stat-item { text-align: center; min-width: 80px; }
.pm-why-stat-item .num {
    display: block;
    font-size: 1.6rem;
    font-weight: 800;
    color: #0f172a;
}
.pm-why-stat-item .lbl {
    font-size: 0.85rem;
    color: #64748b;
}
.pm-why-stat-divider {
    width: 1px;
    height: 35px;
    background: #cbd5e1;
    margin: 0 30px;
}

/* --- ردیف اعتماد (Trust Badges) - جدید --- */
.pm-why-trust-wrapper {
    display: flex;
    gap: 25px;
    margin-top: 35px;
    padding-top: 25px;
    border-top: 1px dashed #cbd5e1; /* خط چین برای تمایز */
}

.pm-why-trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pm-why-trust-item .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: #fff;
    border-radius: 12px;
    font-size: 1.3rem;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05);
}

.pm-why-trust-item .info strong {
    display: block;
    font-size: 0.9rem;
    color: #334155;
    font-weight: 700;
}
.pm-why-trust-item .info small {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
}

/* --- بخش تصویر (بدون کادر) --- */
.pm-why-visual-col {
    position: relative;
    display: flex;
    justify-content: center;
}

.pm-why-torn-img {
    width: 100%;
    max-height: 550px;
    object-fit: contain;
    /* حذف تمام استایل‌های مزاحم قبلی */
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    filter: drop-shadow(0 15px 25px rgba(0,0,0,0.15)); /* سایه نرم فقط زیر خود کاغذ */
}

/* --- ریسپانسیو --- */
@media (max-width: 992px) {
    .pm-why-grid { grid-template-columns: 1fr; gap: 40px; }
    .pm-why-visual-col { order: -1; } /* عکس بره بالا */
}

@media (max-width: 576px) {
    .pm-why-stats-row { justify-content: space-between; }
    .pm-why-stat-divider { margin: 0 10px; }
    .pm-why-trust-wrapper { flex-direction: column; gap: 15px; }
}
/* ==========================================================================
   PAGE: GERMANY HOSTING | SECTION: ARENA COMPARISON (The SEO Battlefield)
   Parent Class: .pm-de-arena
   ========================================================================== */

/* --- 1. تنظیمات اصلی سکشن --- */
.pm-de-arena {
    padding: 7rem 0;
    background-color: #050b14; /* سیاه فضایی */
    background-image: radial-gradient(circle at 50% 0%, #1e293b 0%, #050b14 60%);
    position: relative; overflow: hidden;
    color: #fff; font-family: inherit; direction: rtl;
}

/* Floor Grid Effect */
.pm-de-arena .arena-floor-grid {
    position: absolute; bottom: 0; left: 0; width: 100%; height: 60%;
    background-image: linear-gradient(0deg, transparent 24%, rgba(255, 255, 255, .03) 25%, rgba(255, 255, 255, .03) 26%, transparent 27%, transparent 74%, rgba(255, 255, 255, .03) 75%, rgba(255, 255, 255, .03) 76%, transparent 77%, transparent), 
                      linear-gradient(90deg, transparent 24%, rgba(255, 255, 255, .03) 25%, rgba(255, 255, 255, .03) 26%, transparent 27%, transparent 74%, rgba(255, 255, 255, .03) 75%, rgba(255, 255, 255, .03) 76%, transparent 77%, transparent);
    background-size: 50px 50px;
    transform: perspective(500px) rotateX(60deg);
    opacity: 0.5; z-index: 1; pointer-events: none;
}

/* Spotlights */
.pm-de-arena .arena-spotlight {
    position: absolute; top: -150px; width: 400px; height: 800px;
    filter: blur(80px); opacity: 0.25; z-index: 2; transform: rotate(20deg); pointer-events: none;
}
.pm-de-arena .spot-red { left: 10%; background: linear-gradient(180deg, #ef4444, transparent); }
.pm-de-arena .spot-blue { right: 10%; background: linear-gradient(180deg, #3b82f6, transparent); transform: rotate(-20deg); }

/* --- 2. هدر --- */
.pm-de-arena .arena-header { text-align: center; position: relative; z-index: 10; margin-bottom: 4rem; }

.pm-de-arena .fight-label {
    display: inline-block; background: #eab308; color: #000; font-weight: 900;
    padding: 4px 12px; border-radius: 4px; font-size: 0.8rem; letter-spacing: 2px; margin-bottom: 15px;
    box-shadow: 0 0 15px rgba(234, 179, 8, 0.6);
}

.pm-de-arena .arena-title { font-size: 2.5rem; font-weight: 900; line-height: 1.3; text-shadow: 0 5px 15px rgba(0,0,0,0.5); }
.pm-de-arena .text-hetzner { color: #94a3b8; text-decoration: line-through; text-decoration-color: #ef4444; }
.pm-de-arena .text-ovh { color: #3b82f6; text-shadow: 0 0 20px rgba(59, 130, 246, 0.6); }
.pm-de-arena .arena-subtitle { color: #cbd5e1; max-width: 600px; margin: 15px auto; font-size: 1.1rem; }

/* --- 3. رینگ (کارت‌ها) --- */
.pm-de-arena .fighters-ring {
    display: flex; justify-content: center; align-items: center; gap: 0;
    max-width: 1100px; margin: 0 auto; position: relative; z-index: 10;
}

.pm-de-arena .fighter-card {
    flex: 1; background: rgba(30, 41, 59, 0.4); border: 1px solid rgba(255,255,255,0.1);
    backdrop-filter: blur(10px); padding: 2rem; border-radius: 20px;
    position: relative; transition: all 0.4s ease;
}

/* Hetzner (Loser) */
.pm-de-arena .card-hetzner {
    transform: scale(0.9) perspective(1000px) rotateY(5deg);
    border-right: none; border-top-right-radius: 0; border-bottom-right-radius: 0;
    background: linear-gradient(135deg, rgba(30,41,59,0.9), rgba(15,23,42,0.95));
    opacity: 0.7; filter: grayscale(0.8);
}
.pm-de-arena .card-hetzner:hover { opacity: 1; filter: grayscale(0); transform: scale(0.92) rotateY(0); }

/* OVH (Winner) */
.pm-de-arena .card-ovh {
    transform: scale(1.05); z-index: 20;
    background: linear-gradient(135deg, rgba(15,23,42,0.95), rgba(30,58,138,0.3));
    border: 2px solid #3b82f6;
    box-shadow: 0 20px 60px -10px rgba(59, 130, 246, 0.3);
}

/* Badges */
.pm-de-arena .fighter-status {
    text-align: center; font-size: 0.8rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 1px; margin-bottom: 20px; opacity: 0.6;
}
.pm-de-arena .champion-belt {
    position: absolute; top: -18px; left: 50%; transform: translateX(-50%);
    background: linear-gradient(90deg, #eab308, #ca8a04); color: #fff;
    padding: 8px 20px; border-radius: 50px; font-weight: 800; font-size: 0.9rem;
    box-shadow: 0 5px 20px rgba(234, 179, 8, 0.5); white-space: nowrap; width: max-content;
}

/* Visuals */
.pm-de-arena .fighter-visual { text-align: center; margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid rgba(255,255,255,0.1); }
.pm-de-arena .fighter-logo { height: 50px; margin-bottom: 15px; object-fit: contain; }

.pm-de-arena .power-bar-wrap { max-width: 150px; margin: 0 auto; text-align: left; }
.pm-de-arena .power-bar-wrap .label { font-size: 0.6rem; color: #64748b; display: block; margin-bottom: 3px; text-transform: uppercase; }
.pm-de-arena .power-bar { height: 6px; background: #334155; border-radius: 3px; overflow: hidden; }
.pm-de-arena .card-ovh .power-bar .fill { height: 100%; background: #3b82f6; box-shadow: 0 0 10px #3b82f6; }
.pm-de-arena .card-hetzner .power-bar .fill { height: 100%; background: #ef4444; }

/* Stats List */
.pm-de-arena .stat-row { display: flex; gap: 15px; margin-bottom: 1.5rem; text-align: right; }
.pm-de-arena .stat-row .icon {
    font-size: 1.4rem; background: rgba(255,255,255,0.05); width: 45px; height: 45px;
    display: flex; align-items: center; justify-content: center; border-radius: 12px; flex-shrink: 0;
}
.pm-de-arena .stat-row .info strong { display: block; font-size: 0.95rem; margin-bottom: 4px; color: #f8fafc; }
.pm-de-arena .stat-row .info p { font-size: 0.8rem; color: #94a3b8; line-height: 1.5; margin: 0; }

.pm-de-arena .stat-row.success .icon { color: #10b981; border: 1px solid rgba(16, 185, 129, 0.2); }
.pm-de-arena .stat-row.danger .icon { color: #ef4444; border: 1px solid rgba(239, 68, 68, 0.2); }

/* VS Divider */
.pm-de-arena .vs-column { position: relative; width: 60px; z-index: 30; display: flex; flex-direction: column; align-items: center; }
.pm-de-arena .vs-circle {
    width: 60px; height: 60px; background: #0f172a; border: 3px solid #fff; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 900; font-size: 1.2rem; font-style: italic;
    box-shadow: 0 0 30px rgba(255,255,255,0.3);
}

/* Action Button */
.pm-de-arena .winner-action { text-align: center; margin-top: 2rem; }
.pm-de-arena .btn-select-winner {
    background: linear-gradient(90deg, #2563eb, #3b82f6); color: #fff;
    padding: 12px 30px; border-radius: 50px; font-weight: 800; text-decoration: none;
    box-shadow: 0 10px 25px -5px rgba(37, 99, 235, 0.5);
    display: inline-block; transition: 0.3s;
}
.pm-de-arena .btn-select-winner:hover { transform: scale(1.05); box-shadow: 0 15px 35px -5px rgba(37, 99, 235, 0.7); }

/* --- 4. SEO Content Box --- */
.pm-de-arena .seo-analysis-box {
    margin-top: 5rem; background: rgba(15, 23, 42, 0.5);
    border: 1px solid rgba(59, 130, 246, 0.2); border-radius: 24px;
    padding: 3rem; position: relative; z-index: 10;
}
.pm-de-arena .seo-analysis-box::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 3px;
    background: linear-gradient(90deg, transparent, #3b82f6, transparent);
}
.pm-de-arena .analysis-title {
    text-align: center; font-size: 1.4rem; color: #fff; margin-bottom: 2.5rem;
}
.pm-de-arena .analysis-columns {
    display: grid; grid-template-columns: 1fr 1fr; gap: 3rem;
}
.pm-de-arena .analysis-columns h4 {
    color: #3b82f6; font-size: 1.1rem; margin-bottom: 1rem; border-right: 3px solid #3b82f6; padding-right: 15px;
}
.pm-de-arena .analysis-columns p {
    color: #cbd5e1; line-height: 1.9; font-size: 0.95rem; text-align: justify;
}

/* --- 5. ریسپانسیو --- */
@media (max-width: 992px) {
    .pm-de-arena .fighters-ring { flex-direction: column; gap: 40px; }
    .pm-de-arena .vs-column { display: none; }
    .pm-de-arena .card-hetzner { transform: none; order: 2; width: 100%; border-radius: 20px; border-right: 1px solid rgba(255,255,255,0.1); }
    .pm-de-arena .card-ovh { transform: none; order: 1; width: 100%; }
    .pm-de-arena .analysis-columns { grid-template-columns: 1fr; gap: 2rem; }
    .pm-de-arena .arena-title { font-size: 1.8rem; }
}
/* ==========================================================================
   PAGE: GERMANY HOSTING | SECTION: ENGINE ROOM (Cinematic Edition)
   Parent Class: .pm-de-engine-cine
   ========================================================================== */

/* --- تنظیمات اصلی سکشن --- */
.pm-de-engine-cine {
    padding: 8rem 0;
    background-color: #020617; /* سیاه بسیار عمیق */
    position: relative; overflow: hidden;
    font-family: inherit; color: #fff; direction: rtl; text-align: right;
}

/* --- پس‌زمینه زنده و سینمایی --- */
.pm-de-engine-cine .pm-iso-scene {
    position: absolute; inset: 0; pointer-events: none; overflow: hidden;
}

/* 1. شبکه سه بعدی کف */
.pm-de-engine-cine .pm-iso-grid-floor {
    position: absolute; bottom: -20%; left: -50%; width: 200%; height: 100%;
    background-image: linear-gradient(0deg, transparent 24%, rgba(56, 189, 248, .03) 25%, rgba(56, 189, 248, .03) 26%, transparent 27%, transparent 74%, rgba(56, 189, 248, .03) 75%, rgba(56, 189, 248, .03) 76%, transparent 77%, transparent),
                      linear-gradient(90deg, transparent 24%, rgba(56, 189, 248, .03) 25%, rgba(56, 189, 248, .03) 26%, transparent 27%, transparent 74%, rgba(56, 189, 248, .03) 75%, rgba(56, 189, 248, .03) 76%, transparent 77%, transparent);
    background-size: 60px 60px;
    transform: perspective(800px) rotateX(60deg);
    mask-image: linear-gradient(to top, black 0%, transparent 60%);
    -webkit-mask-image: linear-gradient(to top, black 0%, transparent 60%);
    opacity: 0.6;
}

/* 2. پرتو نور از بالا */
.pm-de-engine-cine .pm-iso-light-beam {
    position: absolute; top: -200px; left: 50%; transform: translateX(-50%);
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.15) 0%, transparent 70%);
    filter: blur(80px); z-index: 1;
}

/* 3. گوی‌های نورانی (اتمسفر) */
.pm-de-engine-cine .pm-iso-orb {
    position: absolute; border-radius: 50%; filter: blur(100px); opacity: 0.4;
    animation: pm-de-float 20s infinite alternate ease-in-out; z-index: 0;
}
.pm-de-engine-cine .orb-blue {
    top: 10%; left: 0; width: 500px; height: 500px; background: #0ea5e9; animation-delay: 0s;
}
.pm-de-engine-cine .orb-purple {
    bottom: 25%; right: -10%; width: 600px; height: 600px; background: #6366f1; animation-delay: -10s;
}

/* --- استایل محتوا --- */
.pm-de-engine-cine .pm-iso-header {
    text-align: center; margin-bottom: 5rem; position: relative; z-index: 5;
}
.pm-de-engine-cine .pm-iso-title {
    font-size: 2.5rem; font-weight: 800; color: #ffffff; margin-bottom: 1.5rem; line-height: 1.3;
    text-shadow: 0 0 40px rgba(56, 189, 248, 0.3);
}
.pm-de-engine-cine .pm-text-highlight {
    background: linear-gradient(120deg, #38bdf8, #818cf8, #c084fc);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 15px rgba(56, 189, 248, 0.3));
}
.pm-de-engine-cine .pm-iso-subtitle {
    font-size: 1.15rem; color: #cbd5e1; max-width: 750px; margin: 0 auto; line-height: 1.9;
}

/* گرید کارت‌ها */
.pm-de-engine-cine .pm-iso-deck {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px;
    max-width: 1150px; margin: 0 auto; position: relative; z-index: 5;
}

/* --- کارت اختصاصی --- */
.pm-de-engine-cine .pm-iso-card {
    --theme-color: #ffffff;
    background: rgba(15, 23, 42, 0.5); border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 28px; padding: 2.5rem; position: relative; overflow: hidden;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex; flex-direction: column; backdrop-filter: blur(10px);
}

.pm-de-engine-cine .theme-litespeed { --theme-color: #ff6b00; }
.pm-de-engine-cine .theme-cloudlinux { --theme-color: #3b82f6; }
.pm-de-engine-cine .theme-imunify   { --theme-color: #10b981; }
.pm-de-engine-cine .theme-jetbackup  { --theme-color: #ef4444; }

.pm-de-engine-cine .pm-iso-card:hover {
    transform: translateY(-10px) scale(1.01);
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(30, 41, 59, 0.6);
    box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.8), 0 0 30px -10px var(--theme-color);
}

/* نور مخفی */
.pm-de-engine-cine .pm-iso-glow {
    position: absolute; top: -50px; right: -50px; width: 200px; height: 200px;
    background: var(--theme-color); filter: blur(90px); opacity: 0.1;
    border-radius: 50%; pointer-events: none; transition: opacity 0.5s;
}
.pm-de-engine-cine .pm-iso-card:hover .pm-iso-glow { opacity: 0.25; }

/* هدر کارت */
.pm-de-engine-cine .pm-card-top { display: flex; align-items: center; gap: 18px; margin-bottom: 1.8rem; }

.pm-de-engine-cine .pm-icon-box {
    width: 100px; height: 100px;
    background: linear-gradient(145deg, rgba(30, 41, 59, 0.8), rgba(15, 23, 42, 0.9));
    border-radius: 18px; display: flex; align-items: center; justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 20px rgba(0,0,0,0.5);
    transition: 0.4s;
}
.pm-de-engine-cine .pm-iso-card:hover .pm-icon-box {
    border-color: var(--theme-color); box-shadow: 0 0 20px -5px var(--theme-color);
}
.pm-de-engine-cine .pm-icon-box img {
    width: 85px; height: 85px; object-fit: contain; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3));
}

.pm-de-engine-cine .pm-brand-name {
    font-size: 1.1rem; font-weight: 700; color: #fff;
    text-transform: uppercase; letter-spacing: 1px;
    text-shadow: 0 0 10px rgba(0,0,0,0.5);
}

/* متن‌ها */
.pm-de-engine-cine .pm-card-heading {
    font-size: 1.5rem; font-weight: 800; color: #ffffff;
    margin-bottom: 1rem; line-height: 1.4;
}

.pm-de-engine-cine .pm-card-desc {
    font-size: 1rem; color: #cbd5e1; line-height: 1.8; margin-bottom: 2rem;
    flex-grow: 1; text-align: justify;
}

/* تگ تکنولوژی */
.pm-de-engine-cine .pm-tech-tag {
    font-size: 0.85rem; font-weight: 700; color: #fff;
    background: rgba(255, 255, 255, 0.05);
    padding: 12px 20px; border-radius: 12px;
    border-left: 4px solid var(--theme-color);
    display: inline-flex; align-items: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* انیمیشن (Scoped) */
@keyframes pm-de-float {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(50px, 50px) scale(1.1); }
}

/* ریسپانسیو */
@media (max-width: 992px) {
    .pm-de-engine-cine .pm-iso-deck { grid-template-columns: 1fr; gap: 25px; }
    .pm-de-engine-cine .pm-de-engine-cine { padding: 5rem 0; }
    .pm-de-engine-cine .pm-iso-title { font-size: 2rem; }
}