/**
 * Venom Store Theme Main Stylesheet
 * 
 * Theme styling: Premium Dark Cyber Gamer aesthetic
 */

/* ==========================================================================
   1. VARIABLES & RESET
   ========================================================================== */
:root {
    --gamer-bg: #020202;
    --gamer-surface: #0a0a0c;
    --gamer-surface-card: #121216;
    --venom-red: #ff1e27;
    --venom-red-rgb: 255, 30, 39;
    --venom-crimson: #b20710;
    --accent-cyan: #00f2fe;
    --accent-cyan-rgb: 0, 242, 254;
    --accent-magenta: #fe0979;
    --accent-magenta-rgb: 254, 9, 121;
    --text-white: #ffffff;
    --text-light: #e2e8f0;
    --text-muted: #718096;
    --border-color: #2d3748;
    --font-sans: 'Space Grotesk', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', SFMono-Regular, Consolas, monospace;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
    background-color: var(--gamer-bg);
}

body {
    background-color: var(--gamer-bg);
    color: var(--text-light);
    font-family: var(--font-sans);
    line-height: 1.6;
    overflow-x: hidden;
    padding-bottom: 72px; /* For bottom navigation space on mobile */
}

a {
    color: var(--text-white);
    text-decoration: none;
    transition: all 0.25s ease;
}

a:hover {
    color: var(--venom-red);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

ul {
    list-style: none;
}

/* ==========================================================================
   2. TYPOGRAPHY & COMMON UTILITIES
   ========================================================================== */
.font-mono { font-family: var(--font-mono); }
.font-bold { font-weight: 700; }
.font-black { font-weight: 900; }
.text-white { color: var(--text-white); }
.text-red { color: var(--venom-red); }
.text-cyan { color: var(--accent-cyan); }
.text-magenta { color: var(--accent-magenta); }
.text-muted { color: var(--text-muted); }
.text-light { color: var(--text-light); }
.text-warning { color: #f59e0b; }
.text-center { text-align: center; }
.uppercase { text-transform: uppercase; }
.tracking-wide { letter-spacing: 0.1em; }
.hidden { display: none !important; }
.block { display: block; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-5 { margin-top: 1.5rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.max-w-600 { max-width: 600px; }
.leading-relaxed { line-height: 1.8; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.text-3xl { font-size: 1.875rem; }
.font-mono-bold { font-family: var(--font-mono); font-weight: 700; }

.divider {
    border: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-color) 20%, var(--border-color) 80%, transparent);
    margin: 1rem 0;
}

/* Container */
.container {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: 1.25rem;
}

/* Custom Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 700;
    border-radius: 6px;
    cursor: pointer;
    border: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    gap: 0.5rem;
}

.btn-block {
    width: 100%;
}

.btn-red {
    background-color: var(--venom-red);
    color: var(--text-white);
    box-shadow: 0 4px 12px rgba(var(--venom-red-rgb), 0.3);
}

.btn-red:hover {
    background-color: #ff333b;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(var(--venom-red-rgb), 0.5);
    color: var(--text-white);
}

.btn-cyan {
    background-color: var(--accent-cyan);
    color: #010101;
    box-shadow: 0 4px 12px rgba(var(--accent-cyan-rgb), 0.3);
}

.btn-cyan:hover {
    background-color: #40f7ff;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(var(--accent-cyan-rgb), 0.5);
    color: #010101;
}

.btn-magenta {
    background-color: var(--accent-magenta);
    color: var(--text-white);
    box-shadow: 0 4px 12px rgba(var(--accent-magenta-rgb), 0.3);
}

.btn-magenta:hover {
    background-color: #ff2a8e;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(var(--accent-magenta-rgb), 0.5);
    color: var(--text-white);
}

.btn-telegram {
    background-color: #0088cc;
    color: var(--text-white);
}

.btn-telegram:hover {
    background-color: #1aa3ff;
    transform: translateY(-2px);
}

.btn-discord {
    background-color: #5865f2;
    color: var(--text-white);
}

.btn-discord:hover {
    background-color: #727eff;
    transform: translateY(-2px);
}

/* Form Controls */
.form-group {
    margin-bottom: 1.25rem;
}

.form-control {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 0.9rem;
    background-color: #0d0d11;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-white);
    font-family: var(--font-sans);
    transition: all 0.25s ease;
}

.form-control:focus {
    outline: none;
    border-color: var(--venom-red);
    box-shadow: 0 0 8px rgba(var(--venom-red-rgb), 0.3);
}

textarea.form-control {
    resize: vertical;
}

/* ==========================================================================
   3. HEADER / TOP BAR
   ========================================================================== */
.site-header {
    background-color: var(--gamer-surface);
    border-bottom: 1px solid rgba(var(--venom-red-rgb), 0.15);
    position: sticky;
    top: 0;
    z-index: 1000;
    height: 64px;
    display: flex;
    align-items: center;
}

.header-container {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: 0 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.site-branding .custom-logo-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.logo-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--venom-red);
    overflow: hidden;
    background-color: #000;
    box-shadow: 0 0 10px rgba(var(--venom-red-rgb), 0.4);
}

.mascot-mini {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.site-title {
    font-family: var(--font-mono);
    font-weight: 900;
    font-size: 1.125rem;
    letter-spacing: -0.02em;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-action-box {
    position: relative;
}

.header-action-btn {
    background-color: #121217;
    border: 1px solid #23232b;
    border-radius: 20px;
    padding: 0.4rem 0.8rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-white);
    font-size: 0.8rem;
    transition: all 0.2s ease;
}

.header-action-btn:hover {
    border-color: var(--venom-red);
    background-color: #1a1a24;
}

/* Country Selector Dropdown */
.country-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 0.5rem;
    background-color: #111116;
    border: 1px solid #262633;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.8);
    width: 240px;
    z-index: 1010;
}

.country-dropdown.active {
    display: block;
    animation: fadeIn 0.2s ease;
}

.country-dropdown ul {
    list-style: none;
    padding: 0.4rem 0;
}

.country-dropdown li {
    padding: 0.75rem 1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    transition: all 0.2s ease;
}

.country-dropdown li:hover {
    background-color: #1d1d28;
    color: var(--venom-red);
}

/* Cart Icon & Counter Badge */
.cart-icon-wrapper {
    position: relative;
}

.cart-icon-wrapper .header-action-btn {
    border-radius: 50%;
    width: 34px;
    height: 34px;
    padding: 0;
    justify-content: center;
}

.cart-counter {
    position: absolute;
    top: -5px;
    right: -5px;
    background-color: var(--venom-red);
    color: var(--text-white);
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 10px;
    font-weight: 700;
    font-family: var(--font-mono);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 6px rgba(var(--venom-red-rgb), 0.7);
}

/* ==========================================================================
   4. HOME SCREEN & SECTIONS
   ========================================================================== */
.site-main-content {
    max-width: 720px;
    margin: 0 auto;
    padding: 1rem;
}

/* Tab contents switcher */
.tab-content-pane {
    display: none;
}

.tab-content-pane.active {
    display: block;
    animation: slideUpFade 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Hero section */
.hero-section {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    padding: 2.5rem 1.5rem;
    text-align: center;
    margin-bottom: 1.5rem;
    background-image: linear-gradient(135deg, #1b0404 0%, #030303 100%);
    border: 1px solid rgba(var(--venom-red-rgb), 0.15);
}

.hero-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(circle at center, rgba(var(--venom-red-rgb), 0.15) 0%, transparent 70%);
}

.hero-content {
    position: relative;
    z-index: 2;
}

.hero-welcome {
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
    letter-spacing: 0.25em;
}

.hero-title {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
    text-shadow: 0 0 15px rgba(var(--venom-red-rgb), 0.5);
}

.hero-desc {
    font-size: 0.95rem;
    max-width: 480px;
    margin: 0 auto 1.5rem;
}

/* Why Choose Us trust badges */
.why-choose-us-section {
    margin-bottom: 2rem;
}

.section-title {
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
    border-left: 3.5px solid var(--venom-red);
    padding-left: 0.75rem;
}

.trust-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.trust-card {
    background-color: var(--gamer-surface-card);
    border: 1px solid #1c1c24;
    border-radius: 8px;
    padding: 0.875rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.trust-icon {
    font-size: 1.5rem;
    color: var(--venom-red);
}

.trust-title {
    font-size: 0.85rem;
}

.trust-subtitle {
    font-size: 0.7rem;
}

/* TikTok Promo Banner */
.tiktok-section-wrapper {
    margin-bottom: 2rem;
}

.tiktok-promo-banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #010101;
    border: 1.5px solid transparent;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    background-clip: padding-box;
    position: relative;
    box-shadow: 0 4px 15px rgba(0,0,0,0.6);
}

.tiktok-promo-banner::after {
    position: absolute;
    top: -1.5px; bottom: -1.5px; left: -1.5px; right: -1.5px;
    background: linear-gradient(90deg, #00f2fe, #fe0979);
    content: '';
    z-index: -1;
    border-radius: 8px;
}

.tiktok-banner-content {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.tiktok-neon-icon {
    font-size: 1.75rem;
    background: linear-gradient(135deg, #00f2fe 0%, #fe0979 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 5px rgba(0, 242, 254, 0.4));
}

.tiktok-banner-title {
    font-size: 0.85rem;
}

.tiktok-banner-handle {
    font-size: 0.8rem;
}

.tiktok-banner-live {
    font-size: 0.7rem;
}

/* Service Shortcuts Section */
.service-shortcuts-section {
    margin-bottom: 2rem;
}

.shortcuts-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.875rem;
}

.shortcut-card {
    background-color: var(--gamer-surface);
    border-radius: 10px;
    border: 1.5px solid transparent;
    padding: 1.25rem 1rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.shortcut-card.border-cyan { border-color: rgba(var(--accent-cyan-rgb), 0.15); }
.shortcut-card.border-red { border-color: rgba(var(--venom-red-rgb), 0.15); }

.shortcut-card.glow-cyan-hover:hover {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 15px rgba(var(--accent-cyan-rgb), 0.15);
    transform: translateY(-2px);
}

.shortcut-card.glow-red-hover:hover {
    border-color: var(--venom-red);
    box-shadow: 0 0 15px rgba(var(--venom-red-rgb), 0.15);
    transform: translateY(-2px);
}

.shortcut-icon-circle {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
}

.bg-cyan-trans { background-color: rgba(var(--accent-cyan-rgb), 0.1); }
.bg-red-trans { background-color: rgba(var(--venom-red-rgb), 0.1); }

.shortcut-title {
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    margin-bottom: 0.4rem;
}

.shortcut-desc {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-bottom: auto;
    padding-bottom: 0.75rem;
}

.btn-shortcut-link {
    font-size: 0.75rem;
    font-weight: 700;
    font-family: var(--font-mono);
}

/* Stats Board */
.stats-board-section {
    margin-bottom: 2rem;
}

.stats-board {
    background-color: #0b0202;
    border: 1px solid var(--venom-crimson);
    border-radius: 10px;
    padding: 1.5rem;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
}

.stat-number {
    font-size: 1.5rem;
}

.stat-label {
    font-size: 0.7rem;
}

/* Home Reviews Quick */
.home-reviews-section {
    margin-bottom: 1.5rem;
}

.home-reviews-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.home-reviews-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ==========================================================================
   5. SERVICES PAGE & PLANS
   ========================================================================== */
.services-header {
    margin-bottom: 1.5rem;
}

.service-group {
    margin-bottom: 2.25rem;
}

.service-group-banner {
    border-radius: 10px;
    padding: 1.25rem;
    background-color: var(--gamer-surface);
    border-width: 1px;
    border-style: solid;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    gap: 1rem;
}

.service-group-banner.glow-cyan {
    border-color: rgba(var(--accent-cyan-rgb), 0.25);
    background-image: linear-gradient(90deg, #001f24 0%, var(--gamer-surface) 100%);
}

.service-group-banner.glow-red {
    border-color: rgba(var(--venom-red-rgb), 0.25);
    background-image: linear-gradient(90deg, #240004 0%, var(--gamer-surface) 100%);
}

.service-group-banner.glow-magenta {
    border-color: rgba(var(--accent-magenta-rgb), 0.25);
    background-image: linear-gradient(90deg, #240014 0%, var(--gamer-surface) 100%);
}

.service-banner-title h3 {
    font-size: 1.1rem;
}

.btn-demo-play {
    font-size: 0.75rem;
    padding: 0.5rem 1rem;
    flex-shrink: 0;
}

.service-plans-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

@media (max-width: 480px) {
    .service-plans-grid {
        grid-template-columns: 1fr;
    }
}

.service-plan-card {
    background-color: var(--gamer-surface-card);
    border: 1px solid #1c1c24;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.service-plan-card.is-premium {
    border-width: 1.5px;
}

.service-plan-card.border-cyan { border-color: var(--accent-cyan); }
.service-plan-card.border-red { border-color: var(--venom-red); }
.service-plan-card.border-magenta { border-color: var(--accent-magenta); }

.premium-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    color: #000;
}

.badge-cyan { background-color: var(--accent-cyan); color: #010101; }
.badge-red { background-color: var(--venom-red); color: #fff; }
.badge-magenta { background-color: var(--accent-magenta); color: #fff; }

.service-card-body {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.service-plan-title {
    font-size: 1rem;
    margin-bottom: 0.5rem;
    max-width: 70%;
}

.service-price-box {
    margin-bottom: 1rem;
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
}

.service-price-amount {
    font-size: 1.75rem;
    font-weight: 900;
}

.service-price-period {
    font-size: 0.75rem;
}

.service-features-list {
    margin-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    font-size: 0.75rem;
    line-height: 1.4;
    flex-grow: 1;
}

.service-features-list li {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.service-features-list li i {
    flex-shrink: 0;
    margin-top: 2px;
}

/* ==========================================================================
   6. PRODUCTS / GAMING GEAR CATALOG
   ========================================================================== */
.products-section {
    margin-bottom: 2rem;
}

.products-header {
    margin-bottom: 1rem;
}

.search-filter-container {
    margin-bottom: 1.25rem;
}

.search-input-wrapper {
    position: relative;
    width: 100%;
}

.search-icon {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
}

.search-input-wrapper .form-control {
    padding-left: 2.5rem;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

@media (max-width: 480px) {
    .products-grid {
        grid-template-columns: 1fr;
    }
}

.product-card {
    background-color: var(--gamer-surface-card);
    border: 1px solid #1c1c24;
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.25s ease;
}

.product-card:hover {
    border-color: var(--venom-red);
    box-shadow: 0 5px 15px rgba(var(--venom-red-rgb), 0.15);
}

.product-img-box {
    width: 100%;
    aspect-ratio: 16/10;
    overflow: hidden;
    position: relative;
    background-color: #0c0c11;
}

.product-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease;
}

.product-card:hover .product-image {
    transform: scale(1.06);
}

.product-category {
    position: absolute;
    bottom: 8px;
    left: 8px;
    background-color: rgba(0, 0, 0, 0.75);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
    font-size: 0.6rem;
    color: var(--text-white);
}

.product-card-details {
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.product-title {
    font-size: 0.875rem;
    margin-bottom: 0.25rem;
}

.text-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-rating {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-bottom: 0.75rem;
}

.product-rating i {
    font-size: 0.7rem;
}

.rating-val {
    font-size: 0.7rem;
}

.product-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
}

.product-price {
    font-size: 1.1rem;
    font-weight: 700;
}

.btn-add-cart {
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 6px;
    font-size: 0.85rem;
}

/* ==========================================================================
   7. REVIEWS PAGE
   ========================================================================== */
.telegram-channel-card {
    background-color: #0b0202;
    border: 1px solid var(--venom-crimson);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
}

.tg-info {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.tg-icon {
    font-size: 2rem;
    color: #0088cc;
}

.reviews-list-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2.25rem;
}

.review-card {
    background-color: var(--gamer-surface-card);
    border: 1px solid #1c1c24;
    border-radius: 10px;
    padding: 1.25rem;
}

.review-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.review-user-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.user-avatar-placeholder {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--border-color);
    color: var(--text-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: 0.95rem;
    border: 1px solid rgba(var(--venom-red-rgb), 0.3);
}

.review-date {
    font-size: 0.7rem;
    display: block;
}

.review-stars {
    font-size: 0.75rem;
    display: flex;
    gap: 0.15rem;
}

.review-text {
    font-size: 0.85rem;
    line-height: 1.5;
}

.add-review-container {
    background-color: var(--gamer-surface);
    border: 1px solid #1c1c24;
    border-radius: 10px;
    padding: 1.5rem;
}

.interactive-rating-stars {
    display: flex;
    gap: 0.5rem;
}

.interactive-rating-stars .star-node {
    cursor: pointer;
    transition: all 0.2s ease;
}

.interactive-rating-stars .star-node:hover {
    transform: scale(1.15);
}

/* ==========================================================================
   8. CONTACT PAGE & SUPPORT TICKETS
   ========================================================================== */
.brand-mascot-card {
    background-color: var(--gamer-surface);
    border: 1px solid rgba(var(--venom-red-rgb), 0.15);
    border-radius: 10px;
    padding: 2rem 1.5rem;
    margin-bottom: 1.5rem;
}

.mascot-circle-lg {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 2px solid var(--venom-red);
    overflow: hidden;
    background-color: #000;
    margin: 0 auto;
    box-shadow: 0 0 15px rgba(var(--venom-red-rgb), 0.5);
}

.mascot-large-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.social-channels-header {
    margin-bottom: 0.75rem;
}

.social-channels-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.875rem;
    margin-bottom: 2rem;
}

@media (max-width: 480px) {
    .social-channels-grid {
        grid-template-columns: 1fr;
    }
}

.social-channel-card {
    background-color: var(--gamer-surface-card);
    border-radius: 8px;
    border-left: 4px solid var(--border-color);
}

.social-channel-card.border-telegram { border-left-color: #0088cc; }
.social-channel-card.border-discord { border-left-color: #5865f2; }

.social-card-body {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    height: 100%;
}

.social-icon {
    font-size: 1.75rem;
}

.social-icon.text-telegram { color: #0088cc; }
.social-icon.text-discord { color: #5865f2; }

.social-card-info h5 {
    font-size: 0.85rem;
}

.social-handle {
    font-size: 0.75rem;
    display: block;
    margin-top: 0.25rem;
}

.support-form-container {
    background-color: var(--gamer-surface);
    border: 1px solid #1c1c24;
    border-radius: 10px;
    padding: 1.5rem;
}

.tickets-container {
    margin-bottom: 1rem;
}

.tickets-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ticket-card {
    background-color: #0d0d11;
    border: 1px solid #22222d;
    border-radius: 8px;
    padding: 1rem;
}

.ticket-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.ticket-tag-pending {
    background-color: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
    border: 1px solid rgba(245, 158, 11, 0.3);
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    font-size: 0.65rem;
}

.ticket-body {
    font-size: 0.8rem;
    line-height: 1.4;
}

/* ==========================================================================
   9. PERSISTENT BOTTOM NAVIGATION
   ========================================================================== */
.bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 56px;
    background-color: var(--gamer-surface);
    border-top: 1px solid #16161f;
    box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.9);
    z-index: 1050;
    display: flex;
    align-items: center;
}

.bottom-nav-container {
    display: flex;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    height: 100%;
}

.bottom-nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    font-size: 1.1rem;
    transition: all 0.25s ease;
    gap: 0.15rem;
}

.bottom-nav-label {
    font-size: 0.625rem;
    font-family: var(--font-sans);
}

.bottom-nav-item.active {
    color: var(--venom-red);
    text-shadow: 0 0 10px rgba(var(--venom-red-rgb), 0.3);
}

.bottom-nav-item.active .bottom-nav-label {
    color: var(--text-white);
    font-weight: 700;
}

/* ==========================================================================
   10. DRAWERS, MODALS, OVERLAYS
   ========================================================================== */
/* Generic Modals background */
.cart-drawer-overlay,
.video-modal,
.product-detail-modal {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 0.85);
    z-index: 2000;
    backdrop-filter: blur(4px);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.3s ease;
}

.cart-drawer-overlay.hidden,
.video-modal.hidden,
.product-detail-modal.hidden {
    opacity: 0;
    pointer-events: none;
}

/* Cart Drawer Specific */
.cart-drawer-overlay {
    justify-content: flex-end;
}

.cart-drawer {
    background-color: var(--gamer-surface);
    width: 100%;
    max-width: 440px;
    height: 100%;
    box-shadow: -10px 0 30px rgba(0, 0, 0, 0.95);
    display: flex;
    flex-direction: column;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    transform: translateX(100%);
}

.cart-drawer-overlay:not(.hidden) .cart-drawer {
    transform: translateX(0);
}

.rtl-layout .cart-drawer-overlay {
    justify-content: flex-start;
}

.rtl-layout .cart-drawer {
    transform: translateX(-100%);
}

.rtl-layout .cart-drawer-overlay:not(.hidden) .cart-drawer {
    transform: translateX(0);
}

.cart-drawer-header {
    padding: 1.25rem;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.close-drawer-btn {
    background: transparent;
    border: none;
    color: var(--text-white);
    font-size: 1.25rem;
    cursor: pointer;
}

.cart-drawer-body {
    padding: 1.25rem;
    flex-grow: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.empty-cart-container {
    text-align: center;
    padding: 3rem 1rem;
    margin: auto;
}

.empty-cart-icon {
    font-size: 3rem;
    margin-bottom: 1rem;
}

.cart-items-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.cart-item {
    background-color: #0c0c11;
    border: 1px solid #1c1c26;
    border-radius: 8px;
    padding: 0.75rem;
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.cart-item-img {
    width: 60px;
    height: 60px;
    border-radius: 6px;
    object-fit: cover;
    background-color: #000;
}

.cart-item-info {
    flex-grow: 1;
}

.cart-item-title {
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.cart-item-price {
    font-size: 0.85rem;
}

.cart-item-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-qty {
    background-color: #20202a;
    border: none;
    border-radius: 4px;
    color: var(--text-white);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    cursor: pointer;
}

.qty-val {
    font-size: 0.8rem;
    font-family: var(--font-mono);
}

.summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    font-size: 0.85rem;
}

.grand-total-row {
    margin-top: 0.5rem;
}

/* Video Modal */
.video-modal-content {
    background-color: var(--gamer-surface);
    border: 1.5px solid var(--accent-cyan);
    border-radius: 12px;
    width: 90%;
    max-width: 540px;
    overflow: hidden;
    box-shadow: 0 0 25px rgba(var(--accent-cyan-rgb), 0.35);
}

.video-modal-header {
    padding: 1rem;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.close-video-btn {
    background: transparent;
    border: none;
    color: var(--text-white);
    font-size: 1.1rem;
    cursor: pointer;
}

.video-container {
    width: 100%;
    aspect-ratio: 16/9;
    background-color: #000;
}

/* Product Detail Modal */
.product-modal-content {
    background-color: var(--gamer-surface);
    border: 1.5px solid var(--venom-red);
    border-radius: 12px;
    width: 90%;
    max-width: 600px;
    padding: 1.5rem;
    position: relative;
    box-shadow: 0 0 25px rgba(var(--venom-red-rgb), 0.35);
    max-height: 90vh;
    overflow-y: auto;
}

.close-product-btn {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: transparent;
    border: none;
    color: var(--text-white);
    font-size: 1.25rem;
    cursor: pointer;
    z-index: 10;
}

.product-detail-grid {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 1.5rem;
    margin-top: 0.5rem;
}

@media (max-width: 480px) {
    .product-detail-grid {
        grid-template-columns: 1fr;
    }
}

.product-detail-image-wrapper {
    width: 100%;
    aspect-ratio: 1/1;
    background-color: #0c0c11;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #1c1c24;
}

.product-detail-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-detail-description {
    font-size: 0.8rem;
    margin-bottom: 1rem;
}

.specs-heading {
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.product-detail-specs-list {
    margin-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    font-size: 0.75rem;
}

.product-detail-specs-list li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ==========================================================================
   11. ANIMATIONS
   ========================================================================== */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUpFade {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==========================================================================
   12. GLOW HOVER UTILITIES
   ========================================================================== */
.glow-card-cyan {
    box-shadow: 0 4px 15px rgba(var(--accent-cyan-rgb), 0.1);
    transition: all 0.3s ease;
}
.glow-card-cyan:hover {
    box-shadow: 0 6px 20px rgba(var(--accent-cyan-rgb), 0.25);
}

.glow-card-red {
    box-shadow: 0 4px 15px rgba(var(--venom-red-rgb), 0.1);
    transition: all 0.3s ease;
}
.glow-card-red:hover {
    box-shadow: 0 6px 20px rgba(var(--venom-red-rgb), 0.25);
}

.glow-card-magenta {
    box-shadow: 0 4px 15px rgba(var(--accent-magenta-rgb), 0.1);
    transition: all 0.3s ease;
}
.glow-card-magenta:hover {
    box-shadow: 0 6px 20px rgba(var(--accent-magenta-rgb), 0.25);
}

/* empty state / fallback styling */
.empty-state-container {
    text-align: center;
    padding: 3rem 1rem;
}

.empty-state-icon {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}


/* ==========================================================================
   13. VENOM HOTFIX: LOCAL ICONS, IMAGES & RESPONSIVE LAYOUT
   ========================================================================== */
/* Icons are self-hosted in assets/vendor/fontawesome from v27 onward. */

.logo-circle.logo-fallback::before,
.logo-fallback-lg::before {
    content: "V";
    color: var(--venom-red);
    font-family: var(--font-mono);
    font-weight: 900;
    font-size: 1.35rem;
    text-shadow: 0 0 12px rgba(var(--venom-red-rgb), .8);
}
.logo-circle.logo-fallback,
.logo-fallback-lg {
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at center, #280207 0%, #020202 70%);
}
.logo-fallback-lg::before { font-size: 3rem; }

/* Show service images; the first generated theme had the image only as data attribute. */
.service-card-media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: linear-gradient(135deg, #0d0d11, #180307);
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.service-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform .45s ease, filter .45s ease;
}
.service-plan-card:hover .service-card-image {
    transform: scale(1.07);
    filter: contrast(1.1) saturate(1.15);
}
.service-card-media-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.65));
    pointer-events: none;
}
.service-card-type-chip {
    position: absolute;
    left: .75rem;
    bottom: .65rem;
    z-index: 2;
    background: rgba(0,0,0,.72);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    padding: .25rem .6rem;
    font-size: .68rem;
    font-weight: 900;
    backdrop-filter: blur(8px);
}
.rtl-layout .service-card-type-chip { left: auto; right: .75rem; }
.service-plan-title { max-width: calc(100% - 68px); }
.product-image, .service-card-image, .mascot-mini, .mascot-large-img {
    background: radial-gradient(circle at 50% 25%, rgba(var(--venom-red-rgb), .18), #060606 66%);
}

/* Stronger responsive layout for mobile, tablet and desktop. */
.container, .site-main-content, .header-container, .bottom-nav-container {
    max-width: 1180px;
}
.site-main-content { padding: 1.25rem; }
.hero-section { min-height: 320px; display: flex; align-items: center; justify-content: center; }
.hero-title { font-size: clamp(2.1rem, 6vw, 4.8rem); }
.hero-desc { font-size: clamp(.95rem, 2vw, 1.18rem); }
.trust-card, .shortcut-card, .service-plan-card, .product-card, .review-card, .social-channel-card {
    min-width: 0;
}
.shortcut-desc, .product-title, .service-plan-title, .review-text, .social-card-info p {
    overflow-wrap: anywhere;
}

@media (min-width: 768px) {
    body { padding-bottom: 78px; }
    .container { padding: 1.5rem 1.75rem; }
    .site-main-content { padding: 1.5rem 1.75rem; }
    .header-container { padding: 0 1.75rem; }
    .hero-section { padding: 4rem 2rem; border-radius: 18px; }
    .trust-grid { grid-template-columns: repeat(4, 1fr); }
    .products-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .service-plans-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .social-channels-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-reviews-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .section-title { font-size: 1.25rem; }
}

@media (min-width: 1100px) {
    .site-header { height: 76px; }
    .logo-circle { width: 48px; height: 48px; }
    .site-title { font-size: 1.35rem; }
    .hero-section { min-height: 430px; }
    .products-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .service-plans-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shortcuts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stats-board { padding: 2rem; }
    .bottom-nav { height: 64px; }
    .bottom-nav-container { max-width: 760px; border-left: 1px solid #16161f; border-right: 1px solid #16161f; }
}

@media (max-width: 767px) {
    .container, .site-main-content { padding: .9rem; }
    .site-header { height: auto; min-height: 62px; }
    .header-container { padding: .55rem .75rem; gap: .6rem; }
    .site-title { font-size: .95rem; }
    .logo-circle { width: 34px; height: 34px; }
    .header-actions { gap: .35rem; }
    .header-action-btn { padding: .35rem .55rem; font-size: .72rem; }
    .language-switcher .lang-label { display: inline; }
    .hero-section { min-height: 240px; padding: 2.25rem 1rem; }
    .trust-grid, .shortcuts-grid, .products-grid, .service-plans-grid, .social-channels-grid, .stats-grid {
        grid-template-columns: 1fr;
    }
    .service-group-banner { flex-direction: column; align-items: stretch; }
    .btn-demo-play { width: 100%; }
    .tiktok-promo-banner { flex-direction: column; align-items: stretch; gap: .75rem; }
    .tiktok-promo-banner .btn { width: 100%; }
    .product-card-footer { gap: .75rem; }
    .product-price { font-size: 1rem; }
    .review-card-header { align-items: flex-start; gap: .75rem; }
    .bottom-nav-label { font-size: .58rem; }
}

@media (max-width: 390px) {
    .site-title { max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .header-action-btn { padding: .32rem .46rem; }
    .country-selector-wrapper .currency-symbol { display: none; }
    .hero-title { font-size: 2rem; }
    .btn { padding: .72rem 1rem; }
}


/* ==========================================================================
   VENOM V2 VISUAL + BUY FLOW PATCH
   ========================================================================== */
/* Branded hero image layer using the VeNoM mascot/logo asset */
.hero-section {
    background-image:
        radial-gradient(circle at 50% 10%, rgba(var(--venom-red-rgb), .22) 0%, transparent 40%),
        linear-gradient(90deg, rgba(0,0,0,.90) 0%, rgba(10,0,2,.76) 47%, rgba(0,0,0,.92) 100%),
        url('../images/img_venom_mascot.jpg');
    background-size: cover, cover, min(76%, 620px);
    background-position: center, center, right 7% center;
    background-repeat: no-repeat;
    border: 1px solid rgba(var(--venom-red-rgb), .32);
    box-shadow: inset 0 0 52px rgba(var(--venom-red-rgb), .14), 0 18px 60px rgba(0,0,0,.55);
}
.hero-section::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255,30,39,.08) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255,30,39,.05) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: radial-gradient(circle at center, #000 0%, transparent 74%);
    opacity: .42;
}
.hero-content {
    width: min(620px, 100%);
    padding: 1rem;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(0,0,0,.40), rgba(0,0,0,.18));
    backdrop-filter: blur(2px);
}

/* Service group icons */
.service-group-banner {
    position: relative;
    overflow: hidden;
    gap: 1rem;
}
.service-banner-icon {
    width: 74px;
    height: 74px;
    flex: 0 0 74px;
    border-radius: 24px;
    display: grid;
    place-items: center;
    background: rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 0 24px rgba(255,255,255,.04);
}
.service-banner-icon img,
.shortcut-image-icon img,
.service-floating-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.service-banner-icon-cyan { box-shadow: 0 0 28px rgba(var(--accent-cyan-rgb), .18); border-color: rgba(var(--accent-cyan-rgb), .35); }
.service-banner-icon-red { box-shadow: 0 0 28px rgba(var(--venom-red-rgb), .22); border-color: rgba(var(--venom-red-rgb), .42); }
.shortcut-image-icon {
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(255,255,255,.12);
}
.shortcut-image-icon img { transform: scale(1.08); }
.service-floating-icon {
    position: absolute;
    top: .75rem;
    right: .75rem;
    z-index: 5;
    width: 48px;
    height: 48px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.18);
    background: #030303;
    box-shadow: 0 0 18px rgba(0,0,0,.65);
}
.rtl-layout .service-floating-icon { right: auto; left: .75rem; }

.service-plan-card {
    cursor: default;
    box-shadow: 0 12px 34px rgba(0,0,0,.26);
}
.service-plan-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 46px rgba(0,0,0,.38), 0 0 28px rgba(var(--venom-red-rgb), .10);
}
.btn-select-service {
    margin-top: auto;
    min-height: 46px;
    letter-spacing: .02em;
}
.btn-select-service::after {
    content: attr(data-buy-label);
}
.service-plan-card .btn-select-service {
    position: relative;
    z-index: 7;
}

/* Cleaner visual rhythm across devices */
.product-card,
.service-plan-card,
.shortcut-card,
.trust-card,
.review-card {
    border-color: rgba(255,255,255,.09);
    background: linear-gradient(180deg, rgba(24,24,30,.98), rgba(8,8,10,.98));
}
.product-card:hover,
.shortcut-card:hover,
.trust-card:hover {
    transform: translateY(-3px);
    border-color: rgba(var(--venom-red-rgb), .32);
}

@media (min-width: 900px) {
    .site-main-content { padding-block: 2.25rem; }
    .hero-section { min-height: 470px; background-size: cover, cover, min(54%, 640px); }
    .service-banner-title { flex: 1; }
}
@media (max-width: 767px) {
    .hero-section {
        background-size: cover, cover, 90%;
        background-position: center, center, center 22%;
        padding-top: 5.5rem;
    }
    .hero-content { background: linear-gradient(180deg, rgba(0,0,0,.54), rgba(0,0,0,.34)); }
    .service-banner-icon { width: 62px; height: 62px; flex-basis: 62px; }
    .service-group-banner { align-items: flex-start; }
    .service-card-media { aspect-ratio: 16/10; }
}
@media (max-width: 430px) {
    .service-floating-icon { width: 42px; height: 42px; border-radius: 14px; }
    .service-plan-title { max-width: calc(100% - 52px); }
}


/* ===== VeNoM V3 uploaded product catalog polish ===== */
.product-img-box {
    aspect-ratio: 16 / 10.5;
    background: radial-gradient(circle at 50% 20%, rgba(255, 24, 45, .18), #050508 64%);
}
.product-image {
    object-fit: contain;
    padding: .35rem;
}
.product-card:hover .product-image {
    transform: scale(1.035);
}
.product-title.text-ellipsis {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    min-height: 2.5em;
    line-height: 1.25;
}
.product-category {
    background: linear-gradient(135deg, rgba(255,24,45,.9), rgba(8,8,10,.9));
    border-color: rgba(255,255,255,.14);
    box-shadow: 0 0 18px rgba(255,24,45,.24);
}
.product-price {
    color: #ff2438;
    text-shadow: 0 0 12px rgba(255,24,45,.34);
}
.service-banner-icon-magenta {
    background: rgba(255,0,120,.12);
    border-color: rgba(255,0,120,.38);
    box-shadow: 0 0 28px rgba(255,0,120,.24);
}
.service-banner-icon-magenta img { width: 46px; height: 46px; object-fit: contain; }
@media (min-width: 1280px) {
    .products-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .product-img-box { aspect-ratio: 16 / 11; }
    .product-card-details { padding: .9rem; }
}

/* v4: user-provided service icons refinement */
.service-banner-icon img,
.service-floating-icon img {
  object-fit: contain !important;
  background: transparent !important;
  filter: drop-shadow(0 0 14px rgba(255, 32, 45, .55));
}
#service-group-redmagic .service-banner-icon {
  background: radial-gradient(circle at center, rgba(255, 32, 45, .18), rgba(0,0,0,.05) 62%, transparent 100%) !important;
  border-color: rgba(255, 32, 45, .45) !important;
}
#service-group-redmagic .service-banner-icon img {
  width: 96% !important;
  height: 96% !important;
  object-fit: contain !important;
}
#service-group-redmagic .service-floating-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}
@media (max-width: 640px) {
  .service-banner-icon { width: 72px !important; height: 72px !important; }
}

/* v5: user-provided GameLoop icon refinement */
#service-group-gameloop .service-banner-icon {
  background: radial-gradient(circle at center, rgba(31, 157, 255, .18), rgba(0,0,0,.05) 62%, transparent 100%) !important;
  border-color: rgba(31, 157, 255, .48) !important;
  box-shadow: 0 0 28px rgba(31, 157, 255, .24) !important;
}
#service-group-gameloop .service-banner-icon img,
.service-plan-card[data-id^="srv_gameloop"] .service-floating-icon img {
  width: 96% !important;
  height: 96% !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 14px rgba(31, 157, 255, .55)) !important;
}
.shortcut-card[href="#service-group-gameloop"] .shortcut-image-icon img,
.shortcut-card[data-target="#service-group-gameloop"] .shortcut-image-icon img {
  object-fit: contain !important;
  filter: drop-shadow(0 0 12px rgba(31, 157, 255, .5)) !important;
}

/* ========================================================================== 
   VeNoM V6 - Uploaded main hero image + services button fix visual support
   ========================================================================== */
.hero-section.hero-section-image-mode {
    display: grid;
    grid-template-columns: minmax(320px, .96fr) minmax(340px, 1.04fr);
    align-items: stretch;
    min-height: clamp(520px, 54vw, 720px);
    padding: 0;
    text-align: inherit;
    background:
        radial-gradient(circle at 72% 18%, rgba(var(--venom-red-rgb), .22), transparent 34%),
        linear-gradient(135deg, #030303 0%, #0c0001 48%, #000 100%);
    border-radius: 24px;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(var(--venom-red-rgb), .35);
    box-shadow: 0 24px 80px rgba(0,0,0,.72), inset 0 0 82px rgba(var(--venom-red-rgb), .12);
}
.hero-section.hero-section-image-mode::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 3;
    background:
        linear-gradient(90deg, rgba(255, 30, 39, .08) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 30, 39, .05) 1px, transparent 1px),
        radial-gradient(circle at center, transparent 38%, rgba(0,0,0,.62) 100%);
    background-size: 44px 44px, 44px 44px, cover;
    opacity: .44;
    mask-image: none;
}
.hero-section.hero-section-image-mode .hero-overlay {
    z-index: 2;
    background:
        linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,.56) 52%, rgba(0,0,0,.84)),
        radial-gradient(circle at 30% 50%, rgba(var(--venom-red-rgb), .16), transparent 42%);
}
.hero-art {
    position: relative;
    z-index: 1;
    order: 2;
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(1rem, 3vw, 2rem);
    background: radial-gradient(circle at center, rgba(var(--venom-red-rgb), .16), transparent 55%);
}
.hero-art::before {
    content: "";
    position: absolute;
    inset: 8%;
    border-radius: 32px;
    background: radial-gradient(circle, rgba(var(--venom-red-rgb), .24), transparent 60%);
    filter: blur(24px);
    opacity: .75;
}
.hero-art img {
    position: relative;
    z-index: 2;
    width: min(100%, 640px);
    height: min(100%, 640px);
    object-fit: contain;
    object-position: center;
    border-radius: 18px;
    filter: drop-shadow(0 0 26px rgba(var(--venom-red-rgb), .34));
}
.hero-section.hero-section-image-mode .hero-content {
    order: 1;
    z-index: 4;
    align-self: center;
    width: min(560px, calc(100% - 2rem));
    margin: clamp(1.25rem, 4vw, 3rem);
    padding: clamp(1.25rem, 3vw, 2.4rem);
    text-align: center;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(0,0,0,.70), rgba(10,0,2,.46));
    box-shadow: 0 18px 55px rgba(0,0,0,.44), 0 0 36px rgba(var(--venom-red-rgb), .12);
    backdrop-filter: blur(5px);
}
.hero-section.hero-section-image-mode .hero-title {
    font-size: clamp(2.25rem, 5vw, 5.2rem);
    line-height: .98;
    letter-spacing: .05em;
}
.hero-section.hero-section-image-mode .hero-desc {
    font-size: clamp(1rem, 1.6vw, 1.25rem);
    line-height: 1.75;
}
.hero-section.hero-section-image-mode .btn-hero {
    min-height: 54px;
    padding-inline: clamp(1.35rem, 3vw, 2.4rem);
    box-shadow: 0 15px 34px rgba(var(--venom-red-rgb), .36);
}
.rtl-layout .hero-section.hero-section-image-mode .hero-art { order: 1; }
.rtl-layout .hero-section.hero-section-image-mode .hero-content { order: 2; }

@media (max-width: 900px) {
    .hero-section.hero-section-image-mode {
        grid-template-columns: 1fr;
        min-height: auto;
    }
    .hero-section.hero-section-image-mode .hero-art,
    .rtl-layout .hero-section.hero-section-image-mode .hero-art {
        order: 1;
        min-height: 0;
        padding: 1rem 1rem .25rem;
    }
    .hero-art img {
        width: min(100%, 560px);
        height: auto;
        aspect-ratio: 1 / 1;
        object-fit: contain;
    }
    .hero-section.hero-section-image-mode .hero-content,
    .rtl-layout .hero-section.hero-section-image-mode .hero-content {
        order: 2;
        width: calc(100% - 2rem);
        margin: .5rem 1rem 1rem;
    }
    .hero-section.hero-section-image-mode .hero-overlay {
        background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.78) 64%, rgba(0,0,0,.92));
    }
}
@media (max-width: 480px) {
    .hero-section.hero-section-image-mode {
        border-radius: 18px;
    }
    .hero-section.hero-section-image-mode .hero-content {
        padding: 1rem;
    }
    .hero-section.hero-section-image-mode .hero-title {
        font-size: clamp(2rem, 10vw, 3rem);
    }
    .hero-section.hero-section-image-mode .hero-desc {
        font-size: .95rem;
    }
}

/* ========================================================================== 
   VeNoM V7 - Full-size hero and product image fit fixes
   ========================================================================== */
.hero-section.hero-section-image-mode {
    grid-template-columns: minmax(360px, 1fr) minmax(360px, 1fr);
    min-height: clamp(560px, 52vw, 760px);
}
.hero-section.hero-section-image-mode::after {
    z-index: 1;
    opacity: .28;
}
.hero-section.hero-section-image-mode .hero-overlay {
    z-index: 1;
    background: linear-gradient(90deg, rgba(0,0,0,.04), rgba(0,0,0,.22) 52%, rgba(0,0,0,.58));
}
.hero-art {
    z-index: 3;
    padding: 0 !important;
    overflow: hidden;
    min-height: 100%;
    background: #050505;
}
.hero-art::before { display: none !important; }
.hero-art img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: 0 !important;
    padding: 0 !important;
    filter: drop-shadow(0 0 22px rgba(var(--venom-red-rgb), .30)) contrast(1.08) brightness(1.05) !important;
}
.hero-section.hero-section-image-mode .hero-content { z-index: 5; }

.product-img-box {
    aspect-ratio: 1.66 / 1 !important;
    background: #07070a !important;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.product-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    padding: 0 !important;
    display: block;
}
.product-card:hover .product-image {
    transform: scale(1.018) !important;
}
.product-card {
    border-radius: 14px;
}
.product-card-details {
    border-top: 1px solid rgba(255,255,255,.05);
}

@media (max-width: 900px) {
    .hero-section.hero-section-image-mode {
        grid-template-columns: 1fr;
        min-height: auto;
    }
    .hero-section.hero-section-image-mode .hero-art,
    .rtl-layout .hero-section.hero-section-image-mode .hero-art {
        min-height: auto;
        aspect-ratio: 1 / 1;
        padding: 0 !important;
    }
    .hero-art img {
        width: 100% !important;
        height: 100% !important;
        aspect-ratio: auto !important;
        object-fit: cover !important;
    }
    .hero-section.hero-section-image-mode .hero-overlay {
        background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.20) 55%, rgba(0,0,0,.55));
    }
}
@media (max-width: 767px) {
    .product-img-box { aspect-ratio: 1.66 / 1 !important; }
}
@media (max-width: 430px) {
    .hero-section.hero-section-image-mode .hero-art { aspect-ratio: 1 / 1; }
    .product-img-box { aspect-ratio: 1.64 / 1 !important; }
}


/* ========================================================================== 
   VeNoM V8 - Full hero background with text overlay
   User request: main image must fill the whole hero box and the text must be on it.
   ========================================================================== */
.hero-section.hero-section-image-mode {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-height: clamp(560px, 56vw, 820px) !important;
    padding: clamp(1.1rem, 4vw, 3.25rem) !important;
    text-align: center !important;
    background-image:
        linear-gradient(90deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.34) 38%, rgba(0,0,0,.78) 66%, rgba(0,0,0,.92) 100%),
        radial-gradient(circle at 28% 50%, rgba(255,30,39,.10), transparent 34%),
        url('../images/img_venom_home_hero.jpg') !important;
    background-size: cover, cover, cover !important;
    background-position: center center, center center, center center !important;
    background-repeat: no-repeat !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    border: 1px solid rgba(var(--venom-red-rgb), .45) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.78), inset 0 0 110px rgba(var(--venom-red-rgb), .13) !important;
}
.hero-section.hero-section-image-mode .hero-art {
    display: none !important;
}
.hero-section.hero-section-image-mode .hero-overlay {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    background:
        linear-gradient(90deg, rgba(0,0,0,.08), rgba(0,0,0,.18) 42%, rgba(0,0,0,.76) 72%, rgba(0,0,0,.94)),
        radial-gradient(circle at 78% 48%, rgba(var(--venom-red-rgb), .28), transparent 38%) !important;
}
.hero-section.hero-section-image-mode::after {
    z-index: 2 !important;
    opacity: .22 !important;
}
.hero-section.hero-section-image-mode .hero-content {
    position: relative !important;
    z-index: 5 !important;
    order: initial !important;
    width: min(520px, 46%) !important;
    margin: 0 !important;
    padding: clamp(1.35rem, 3vw, 2.65rem) !important;
    border-radius: 22px !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    background: linear-gradient(180deg, rgba(0,0,0,.58), rgba(13,0,2,.38)) !important;
    box-shadow: 0 24px 70px rgba(0,0,0,.58), 0 0 48px rgba(var(--venom-red-rgb), .18) !important;
    backdrop-filter: blur(2.5px) !important;
}
.rtl-layout .hero-section.hero-section-image-mode {
    justify-content: flex-end !important;
}
.rtl-layout .hero-section.hero-section-image-mode .hero-content {
    order: initial !important;
}
.hero-section.hero-section-image-mode .hero-title {
    font-size: clamp(2.5rem, 5.2vw, 5.8rem) !important;
    line-height: .96 !important;
    letter-spacing: .07em !important;
}
.hero-section.hero-section-image-mode .hero-desc {
    max-width: 100% !important;
    font-size: clamp(1rem, 1.35vw, 1.25rem) !important;
    color: rgba(255,255,255,.92) !important;
}
.hero-section.hero-section-image-mode .hero-welcome {
    color: var(--venom-red) !important;
    text-shadow: 0 0 12px rgba(var(--venom-red-rgb), .65) !important;
}

/* Make product photos fill the product card image area clearly. */
.product-img-box {
    aspect-ratio: 1.42 / 1 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
.product-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

@media (min-width: 1180px) {
    .site-main-content, .header-container, .container {
        max-width: 1180px !important;
    }
}
@media (max-width: 980px) {
    .hero-section.hero-section-image-mode {
        justify-content: center !important;
        min-height: clamp(520px, 92vw, 760px) !important;
        padding: 1rem !important;
        background-image:
            linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.42) 48%, rgba(0,0,0,.88) 100%),
            url('../images/img_venom_home_hero.jpg') !important;
        background-size: cover, cover !important;
        background-position: center top, center center !important;
    }
    .hero-section.hero-section-image-mode .hero-content,
    .rtl-layout .hero-section.hero-section-image-mode .hero-content {
        width: min(100%, 580px) !important;
        margin-top: auto !important;
        margin-bottom: .25rem !important;
        padding: 1.15rem !important;
    }
}
@media (max-width: 520px) {
    .hero-section.hero-section-image-mode {
        min-height: 620px !important;
        border-radius: 18px !important;
        background-position: center top, center center !important;
    }
    .hero-section.hero-section-image-mode .hero-content {
        border-radius: 16px !important;
        padding: 1rem !important;
        background: linear-gradient(180deg, rgba(0,0,0,.64), rgba(10,0,2,.52)) !important;
    }
    .hero-section.hero-section-image-mode .hero-title {
        font-size: clamp(2.1rem, 11vw, 3.35rem) !important;
    }
    .product-img-box { aspect-ratio: 1.35 / 1 !important; }
}


/* ==========================================================================
   VeNoM v11: stronger bottom navigation + Arabic/AED checkout polish
   ========================================================================== */
.bottom-nav {
    height: 76px !important;
    background: linear-gradient(180deg, rgba(10,10,14,.96), rgba(3,3,5,.98)) !important;
    border-top: 1px solid rgba(255, 31, 43, .45) !important;
    box-shadow: 0 -10px 34px rgba(0,0,0,.95), 0 -1px 22px rgba(255,31,43,.16) !important;
}
.bottom-nav-container {
    max-width: 880px !important;
    gap: .35rem;
    padding: .45rem .55rem;
}
.bottom-nav-item {
    position: relative;
    min-height: 58px;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 16px;
    color: #d6d9e4 !important;
    background: rgba(255,255,255,.025);
    font-size: 1.28rem !important;
    gap: .28rem !important;
}
.bottom-nav-item i {
    width: 28px;
    height: 28px;
    border-radius: 12px;
    background: rgba(255,31,43,.11);
    color: #ffffff !important;
    text-shadow: 0 0 12px rgba(255,31,43,.65);
    font-size: 1.15rem;
}
.bottom-nav-label {
    font-size: .72rem !important;
    font-weight: 800;
    color: #f7f7fb !important;
    letter-spacing: .01em;
}
.bottom-nav-item.active {
    background: radial-gradient(circle at 50% 0%, rgba(255,31,43,.25), rgba(255,31,43,.08) 42%, rgba(255,255,255,.03) 100%) !important;
    border-color: rgba(255,31,43,.8) !important;
    transform: translateY(-4px);
    box-shadow: 0 0 22px rgba(255,31,43,.24), inset 0 0 22px rgba(255,31,43,.08);
}
.bottom-nav-item.active i {
    background: linear-gradient(135deg, #ff1f2b, #8b000b);
    box-shadow: 0 0 18px rgba(255,31,43,.55);
}
.bottom-nav-item.active .bottom-nav-label {
    color: #ffffff !important;
}
#venom-checkout-form .btn-red,
#venom-checkout-form button[type="submit"] {
    box-shadow: 0 0 20px rgba(255,31,43,.38);
}
#venom-checkout-form .btn-red::after,
#venom-checkout-form button[type="submit"]::after {
    content: "  ✈";
}
@media (max-width: 767px) {
    .bottom-nav { height: 78px !important; }
    .bottom-nav-container { padding: .42rem .32rem; gap: .24rem; }
    .bottom-nav-item { min-height: 60px; border-radius: 14px; }
    .bottom-nav-item i { width: 26px; height: 26px; font-size: 1.02rem; }
    .bottom-nav-label { font-size: .62rem !important; }
    body { padding-bottom: 92px; }
}
@media (max-width: 390px) {
    .bottom-nav-label { font-size: .56rem !important; }
    .bottom-nav-container { gap: .18rem; }
}


/* ==========================================================================
   VeNoM V12 - User-provided streaming service card image
   ========================================================================== */
.service-plan-card[data-id="srv_streaming_editing"] .service-card-media {
    aspect-ratio: 16 / 9;
    background: radial-gradient(circle at 50% 20%, rgba(255, 0, 120, .22), #050506 68%);
}
.service-plan-card[data-id="srv_streaming_editing"] .service-card-image {
    object-fit: cover !important;
    padding: 0 !important;
    filter: contrast(1.08) saturate(1.14);
}
.service-plan-card[data-id="srv_streaming_editing"]:hover .service-card-image {
    transform: scale(1.045);
}
#service-group-streaming .service-group-banner {
    background-image:
        linear-gradient(90deg, rgba(36,0,20,.96), rgba(12,8,13,.94)),
        url('../images/img_streaming_venom_setup.jpg');
    background-size: cover;
    background-position: center;
}
#service-group-streaming .service-banner-icon {
    background: rgba(255,0,120,.10);
    border-color: rgba(255,0,120,.42);
}
@media (max-width: 767px) {
    .service-plan-card[data-id="srv_streaming_editing"] .service-card-media { aspect-ratio: 16 / 10; }
}


/* v10: Service details modal + clickable service purchasing flow */
.service-clickable-card {
    cursor: pointer;
    position: relative;
}
.service-clickable-card::after {
    content: "اضغط للتفاصيل";
    position: absolute;
    top: .75rem;
    inset-inline-start: .75rem;
    z-index: 4;
    padding: .32rem .65rem;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(0,0,0,.56);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .01em;
    box-shadow: 0 0 18px rgba(255, 24, 44, .18);
}
body:not(.rtl-layout) .service-clickable-card::after { content: "View details"; }
.service-detail-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(0,0,0,.86);
    backdrop-filter: blur(14px);
}
.service-detail-modal.hidden { display: none !important; }
.service-detail-modal-content {
    width: min(1120px, 96vw);
    max-height: min(88vh, 920px);
    overflow: auto;
    position: relative;
    border: 1px solid rgba(255, 24, 44, .35);
    border-radius: 28px;
    background:
      radial-gradient(circle at 15% 20%, rgba(255, 24, 44, .20), transparent 35%),
      linear-gradient(145deg, rgba(10,10,13,.98), rgba(27,2,6,.96));
    box-shadow: 0 0 46px rgba(255, 24, 44, .22), 0 18px 70px rgba(0,0,0,.72);
    padding: clamp(1rem, 2.5vw, 2rem);
}
.service-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
    gap: clamp(1rem, 2.5vw, 2rem);
    align-items: stretch;
}
.service-detail-video-wrapper {
    min-height: 360px;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    background: #050507;
    box-shadow: inset 0 0 30px rgba(255,24,44,.08);
}
.service-detail-info {
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 22px;
    padding: clamp(1rem, 2vw, 1.5rem);
    background: rgba(0,0,0,.48);
}
.service-detail-price {
    margin-top: .75rem;
    color: var(--venom-red);
    text-shadow: 0 0 18px rgba(255, 24, 44, .35);
}
.service-detail-description {
    line-height: 1.95;
    font-size: clamp(.92rem, 1.05vw, 1.05rem);
    color: rgba(255,255,255,.88);
}
.service-detail-description p {
    margin: 0 0 1rem;
    padding: .85rem 1rem;
    border-radius: 16px;
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.06);
}
#service-detail-add-to-cart-btn {
    margin-top: 1rem;
    min-height: 54px;
    font-size: 1rem;
}
@media (max-width: 860px) {
    .service-detail-grid { grid-template-columns: 1fr; }
    .service-detail-video-wrapper { min-height: 230px; }
    .service-detail-modal { padding: .6rem; }
    .service-detail-modal-content { border-radius: 20px; }
}


/* ========================================================================== 
   VeNoM V14 - clearer luxury service copy and details presentation
   ========================================================================== */
.service-plan-card {
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 15% 0%, rgba(255, 24, 44, .16), transparent 28%),
        linear-gradient(180deg, rgba(22,22,28,.98), rgba(6,6,8,.98)) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.service-plan-card.glow-card-red { box-shadow: 0 16px 42px rgba(0,0,0,.34), 0 0 0 1px rgba(255,24,44,.06); }
.service-plan-card.glow-card-cyan { box-shadow: 0 16px 42px rgba(0,0,0,.34), 0 0 0 1px rgba(31,157,255,.08); }
.service-plan-card.glow-card-magenta { box-shadow: 0 16px 42px rgba(0,0,0,.34), 0 0 0 1px rgba(255,46,181,.08); }
.service-plan-card:hover {
    border-color: rgba(255, 24, 44, .45) !important;
    box-shadow: 0 22px 64px rgba(0,0,0,.54), 0 0 34px rgba(255,24,44,.16) !important;
}
.service-card-media {
    border-radius: 16px 16px 0 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.service-card-body {
    position: relative;
    gap: .75rem;
    padding: 1.25rem 1.2rem 1.2rem !important;
}
.service-card-body::before {
    content: "";
    position: absolute;
    inset-inline: 1.2rem;
    top: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,24,44,.75), transparent);
    opacity: .75;
}
.service-plan-title {
    max-width: 100% !important;
    margin: 0 !important;
    font-size: clamp(1.05rem, 1.8vw, 1.28rem) !important;
    line-height: 1.45;
    letter-spacing: .01em;
    text-shadow: 0 0 18px rgba(255,255,255,.14);
}
.service-price-box {
    margin: .1rem 0 .2rem !important;
    padding: .75rem .85rem;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255,24,44,.13), rgba(255,255,255,.025));
    border: 1px solid rgba(255,255,255,.08);
}
.service-price-amount {
    font-size: clamp(1.65rem, 3vw, 2.25rem) !important;
    letter-spacing: .035em;
    text-shadow: 0 0 18px currentColor;
}
.service-price-period {
    color: rgba(255,255,255,.72) !important;
    font-size: .82rem !important;
}
.service-card-copy-block {
    display: flex;
    flex-direction: column;
    gap: .65rem;
    margin: .15rem 0 .25rem;
}
.service-card-mini-title {
    width: fit-content;
    padding: .34rem .7rem;
    border-radius: 999px;
    background: rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.12);
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .02em;
    box-shadow: inset 0 0 14px rgba(255,255,255,.035);
}
.service-features-list {
    margin: 0 !important;
    gap: .52rem !important;
    font-size: clamp(.86rem, 1.2vw, .98rem) !important;
    line-height: 1.65 !important;
}
.service-features-list li {
    padding: .72rem .8rem;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: inset 0 0 18px rgba(0,0,0,.18);
}
.service-features-list li i {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(255,255,255,.07);
    box-shadow: 0 0 14px currentColor;
    margin-top: .1rem !important;
}
.service-features-list li span {
    color: rgba(255,255,255,.92);
    font-weight: 700;
}
.service-card-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .65rem .8rem;
    border-radius: 14px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255,24,44,.14), rgba(0,0,0,.38));
    border: 1px dashed rgba(255,24,44,.42);
    font-size: .82rem;
    font-weight: 900;
    text-align: center;
    box-shadow: 0 0 18px rgba(255,24,44,.10);
}
.service-card-hint i { color: var(--venom-red); filter: drop-shadow(0 0 8px rgba(255,24,44,.6)); }
.service-clickable-card::after {
    background: linear-gradient(135deg, rgba(255,24,44,.92), rgba(80,0,8,.82)) !important;
    border-color: rgba(255,255,255,.22) !important;
    box-shadow: 0 0 22px rgba(255,24,44,.32) !important;
    font-size: .76rem !important;
    font-weight: 950 !important;
}

/* Luxury service-details modal text */
.service-detail-description {
    line-height: 1.8 !important;
    font-size: clamp(.95rem, 1.08vw, 1.08rem) !important;
}
.detail-rich-list {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}
.detail-headline,
.detail-signature,
.detail-section-title,
.detail-check-row,
.detail-bullet-row,
.detail-line {
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.09);
    background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
    box-shadow: inset 0 0 22px rgba(0,0,0,.18);
}
.detail-headline {
    padding: 1rem 1.05rem;
    color: #fff;
    font-weight: 950;
    text-align: center;
    background: radial-gradient(circle at 50% 0%, rgba(255,24,44,.26), transparent 50%), linear-gradient(135deg, rgba(255,24,44,.16), rgba(0,0,0,.42));
    border-color: rgba(255,24,44,.24);
    text-shadow: 0 0 16px rgba(255,24,44,.30);
}
.detail-section-title {
    width: fit-content;
    padding: .55rem .9rem;
    color: var(--venom-red);
    font-weight: 950;
    border-color: rgba(255,24,44,.25);
    background: rgba(255,24,44,.07);
}
.detail-check-row,
.detail-bullet-row,
.detail-line {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding: .82rem .95rem;
    color: rgba(255,255,255,.92);
    font-weight: 700;
}
.detail-check-row { border-color: rgba(46,255,141,.18); background: linear-gradient(135deg, rgba(46,255,141,.06), rgba(255,255,255,.018)); }
.detail-bullet-row { border-color: rgba(255,24,44,.16); }
.detail-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: rgba(0,0,0,.36);
    color: var(--venom-red);
    box-shadow: 0 0 14px rgba(255,24,44,.24);
    font-size: .85rem;
}
.detail-signature {
    padding: 1rem 1.05rem;
    color: #fff;
    font-weight: 950;
    text-align: center;
    background: linear-gradient(135deg, rgba(255,24,44,.17), rgba(0,0,0,.44));
    border-color: rgba(255,24,44,.30);
    box-shadow: 0 0 26px rgba(255,24,44,.10), inset 0 0 22px rgba(255,255,255,.035);
}
@media (max-width: 640px) {
    .service-card-body { padding: 1rem !important; }
    .service-features-list li { padding: .65rem .7rem; }
    .service-card-hint { font-size: .78rem; }
    .detail-check-row, .detail-bullet-row, .detail-line { padding: .72rem .78rem; }
}


/* ===== VeNoM V16 - Dedicated Store tab after Services ===== */
.home-store-teaser-section {
    padding: 0 1rem 1.4rem;
}
.home-store-teaser {
    max-width: 1120px;
    margin: 0 auto;
    padding: 1rem;
    border: 1px solid rgba(255, 31, 31, .35);
    border-radius: 22px;
    background:
        radial-gradient(circle at 15% 15%, rgba(255,31,31,.18), transparent 32%),
        linear-gradient(135deg, rgba(12,12,15,.96), rgba(24,4,8,.92));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    box-shadow: 0 0 28px rgba(255, 31, 31, .12), inset 0 0 18px rgba(255,255,255,.03);
}
.teaser-eyebrow {
    display: inline-block;
    margin-bottom: .35rem;
    letter-spacing: .08em;
    font-weight: 900;
}
.home-store-teaser h3 {
    margin: 0 0 .35rem;
    font-size: clamp(1.05rem, 2vw, 1.45rem);
}
.home-store-teaser p {
    margin: 0;
    line-height: 1.65;
}
#tab-content-store .products-section {
    padding-top: 1rem;
    padding-bottom: 6.8rem;
}
#tab-content-store .products-header {
    padding-top: .8rem;
}
.bottom-nav-container {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.bottom-nav-item {
    min-width: 0;
}
.bottom-nav-item i {
    font-size: 1.15rem;
}
.bottom-nav-label {
    font-size: .54rem;
    white-space: nowrap;
}
@media (max-width: 520px) {
    .home-store-teaser {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }
    .home-store-teaser .btn {
        width: 100%;
        justify-content: center;
    }
    .bottom-nav-container {
        gap: .1rem;
        padding-inline: .2rem;
    }
    .bottom-nav-label {
        font-size: .49rem;
    }
    .bottom-nav-item i {
        font-size: 1.06rem;
    }
}
@media (min-width: 768px) {
    .bottom-nav-label {
        font-size: .62rem;
    }
    .bottom-nav-item i {
        font-size: 1.25rem;
    }
}


/* v17: product card descriptions + premium categorized reviews */
.product-card-desc {
    margin: .55rem 0 .75rem;
    font-size: .84rem;
    line-height: 1.55;
    color: #b9c0cc !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3.9em;
}
.product-card:hover .product-card-desc { color: #f2f5fb !important; }
.product-detail-description { line-height: 1.8; font-size: 1rem; }
.product-detail-specs-list li { line-height: 1.7; }

.review-videos-zone {
    margin: 1.8rem auto 2.2rem;
    padding: 1.25rem;
    border: 1px solid rgba(255,24,44,.22);
    border-radius: 24px;
    background: radial-gradient(circle at top right, rgba(255,24,44,.16), rgba(8,8,12,.92) 42%, rgba(0,0,0,.96));
    box-shadow: 0 20px 60px rgba(0,0,0,.44), inset 0 0 0 1px rgba(255,255,255,.03);
}
.review-videos-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}
.review-videos-head h3 { margin: 0 0 .25rem; font-size: 1.25rem; }
.review-video-badge {
    border: 1px solid rgba(255,24,44,.35);
    background: rgba(255,24,44,.12);
    color: #ff3147;
    padding: .55rem .75rem;
    border-radius: 999px;
    white-space: nowrap;
}
.review-video-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .8rem;
}
.review-video-card {
    min-height: 150px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: rgba(255,255,255,.035);
    overflow: hidden;
    position: relative;
}
.review-video-card video { width: 100%; height: 100%; min-height: 150px; object-fit: cover; display: block; }
.review-video-placeholder {
    height: 100%; min-height: 150px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: .45rem; color: #dfe6f5; padding: 1rem;
    background: linear-gradient(145deg, rgba(255,24,44,.09), rgba(255,255,255,.025));
}
.review-video-placeholder i { font-size: 1.7rem; filter: drop-shadow(0 0 12px rgba(255,24,44,.55)); }
.review-video-placeholder span { color: #9aa4b6; font-size: .78rem; }

.reviews-split-grid { display: grid; gap: 1.4rem; }
.reviews-category-block {
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 28px;
    padding: 1.2rem;
    background: linear-gradient(180deg, rgba(16,16,22,.94), rgba(5,5,8,.96));
    box-shadow: 0 22px 70px rgba(0,0,0,.42);
}
.redmagic-block { border-color: rgba(255,24,44,.2); }
.gameloop-block { border-color: rgba(31,157,255,.22); background: linear-gradient(180deg, rgba(10,16,24,.96), rgba(5,7,12,.98)); }
.reviews-category-title {
    display: flex; align-items: center; gap: .9rem;
    margin-bottom: 1.1rem; padding-bottom: .9rem;
    border-bottom: 1px solid rgba(255,255,255,.07);
}
.reviews-category-title h3 { margin: 0 0 .25rem; font-size: 1.2rem; }
.category-icon {
    width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 16px; background: rgba(255,24,44,.12); border: 1px solid rgba(255,24,44,.28);
    font-size: 1.45rem; box-shadow: 0 0 20px rgba(255,24,44,.18);
}
.gameloop-block .category-icon { background: rgba(31,157,255,.12); border-color: rgba(31,157,255,.3); box-shadow: 0 0 20px rgba(31,157,255,.18); }
.lux-reviews-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}
.gameloop-reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lux-review-card {
    position: relative; overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.09);
    background: radial-gradient(circle at top right, rgba(255,24,44,.10), rgba(14,14,20,.92) 50%, rgba(3,3,6,.98));
    padding: 1rem;
    box-shadow: 0 16px 44px rgba(0,0,0,.38);
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.gameloop-block .lux-review-card { background: radial-gradient(circle at top right, rgba(31,157,255,.12), rgba(14,14,20,.92) 50%, rgba(3,3,6,.98)); }
.lux-review-card:hover { transform: translateY(-5px); border-color: rgba(255,24,44,.45); box-shadow: 0 24px 70px rgba(255,24,44,.12), 0 20px 60px rgba(0,0,0,.5); }
.gameloop-block .lux-review-card:hover { border-color: rgba(31,157,255,.45); box-shadow: 0 24px 70px rgba(31,157,255,.10), 0 20px 60px rgba(0,0,0,.5); }
.lux-review-top { display: flex; align-items: center; gap: .75rem; margin-bottom: .85rem; }
.lux-review-avatar { width: 52px; height: 52px; border-radius: 16px; object-fit: cover; border: 1px solid rgba(255,255,255,.18); box-shadow: 0 0 18px rgba(255,24,44,.22); }
.lux-review-tag { display: inline-flex; margin-top: .22rem; font-size: .68rem; color: #ff4456; border: 1px solid rgba(255,24,44,.25); background: rgba(255,24,44,.09); padding: .18rem .5rem; border-radius: 999px; }
.gameloop-block .lux-review-tag { color: #49b8ff; border-color: rgba(31,157,255,.25); background: rgba(31,157,255,.08); }
.lux-review-stars { margin-inline-start: auto; color: #ffc247; letter-spacing: 1px; font-size: .78rem; white-space: nowrap; }
.lux-review-text { color: #f3f5fb; line-height: 1.85; font-weight: 700; margin: 0 0 .85rem; }
.lux-review-shot-link { display: block; border-radius: 16px; overflow: hidden; border: 1px solid rgba(255,255,255,.09); background: #050506; }
.lux-review-shot { width: 100%; height: 150px; object-fit: cover; display: block; opacity: .88; transition: transform .25s ease, opacity .25s ease; }
.lux-review-card:hover .lux-review-shot { transform: scale(1.035); opacity: 1; }
.review-tg-card { margin-top: 1.5rem; }
.add-review-container { display: none !important; }

@media (max-width: 1200px) {
    .lux-reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .review-video-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .review-videos-zone, .reviews-category-block { border-radius: 20px; padding: .9rem; }
    .review-videos-head { align-items: flex-start; flex-direction: column; }
    .review-video-grid, .lux-reviews-grid, .gameloop-reviews-grid { grid-template-columns: 1fr; }
    .lux-review-shot { height: 180px; }
    .product-card-desc { -webkit-line-clamp: 4; min-height: auto; font-size: .8rem; }
}

/* ==========================================================================
   VeNoM v19: luxury Store tab icon
   ========================================================================== */
.bottom-nav-item .venom-nav-icon {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: radial-gradient(circle at 50% 15%, rgba(255, 31, 43, .32), rgba(255, 31, 43, .12) 48%, rgba(255,255,255,.035) 100%);
    border: 1px solid rgba(255, 31, 43, .28);
    box-shadow: inset 0 0 10px rgba(255,255,255,.05), 0 0 16px rgba(255,31,43,.22);
    flex: 0 0 auto;
}
.bottom-nav-item .venom-nav-icon img {
    width: 24px;
    height: 24px;
    display: block;
    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(255, 31, 43, .75));
}
.bottom-nav-store-item {
    overflow: hidden;
}
.bottom-nav-store-item::before {
    content: "";
    position: absolute;
    inset: -40% -20%;
    background: radial-gradient(circle at 50% 0%, rgba(255, 31, 43, .22), transparent 56%);
    opacity: .55;
    pointer-events: none;
}
.bottom-nav-store-item:hover .venom-nav-icon,
.bottom-nav-store-item.active .venom-nav-icon {
    background: linear-gradient(135deg, #ff2533, #610009 68%, #07070a);
    border-color: rgba(255, 255, 255, .18);
    box-shadow: 0 0 24px rgba(255,31,43,.5), inset 0 0 14px rgba(255,255,255,.06);
    transform: translateY(-1px) scale(1.05);
}
.bottom-nav-store-item:hover .venom-nav-icon img,
.bottom-nav-store-item.active .venom-nav-icon img {
    filter: drop-shadow(0 0 10px rgba(255,255,255,.65)) drop-shadow(0 0 14px rgba(255,31,43,.9));
}
@media (max-width: 767px) {
    .bottom-nav-item .venom-nav-icon { width: 28px; height: 28px; border-radius: 12px; }
    .bottom-nav-item .venom-nav-icon img { width: 22px; height: 22px; }
}
@media (max-width: 390px) {
    .bottom-nav-item .venom-nav-icon { width: 25px; height: 25px; }
    .bottom-nav-item .venom-nav-icon img { width: 20px; height: 20px; }
}

/* ==========================================================================
   VeNoM v20: Store internal tabs and categorized catalog
   ========================================================================== */
.store-hub-section {
    position: relative;
}

.store-hub-header {
    margin-bottom: 1.25rem;
}

.store-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .42rem .9rem;
    margin-bottom: .75rem;
    border: 1px solid rgba(255, 33, 48, .35);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(255, 33, 48, .14), rgba(0, 0, 0, .45));
    box-shadow: 0 0 24px rgba(255, 33, 48, .18);
    letter-spacing: .08em;
}

.store-category-tabs {
    display: flex;
    gap: .7rem;
    overflow-x: auto;
    padding: .25rem .15rem 1rem;
    margin: .45rem 0 1.35rem;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
}

.store-category-tab {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    min-height: 46px;
    padding: .7rem 1rem;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 16px;
    color: rgba(255, 255, 255, .82);
    background:
        radial-gradient(circle at top left, rgba(255, 33, 48, .16), transparent 45%),
        linear-gradient(135deg, rgba(22, 22, 28, .94), rgba(7, 7, 10, .98));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025), 0 12px 30px rgba(0, 0, 0, .28);
    cursor: pointer;
    font-weight: 800;
    font-family: inherit;
    scroll-snap-align: start;
    transition: transform .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, background .2s ease;
    white-space: nowrap;
}

.store-category-tab:hover,
.store-category-tab.active {
    transform: translateY(-2px);
    color: #fff;
    border-color: rgba(255, 33, 48, .7);
    background:
        radial-gradient(circle at top left, rgba(255, 33, 48, .35), transparent 50%),
        linear-gradient(135deg, rgba(62, 5, 11, .96), rgba(10, 10, 14, .98));
    box-shadow: 0 0 28px rgba(255, 33, 48, .26), inset 0 0 0 1px rgba(255, 255, 255, .05);
}

.store-tab-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(255, 33, 48, .16);
    box-shadow: inset 0 0 14px rgba(255, 33, 48, .18);
    font-size: 1rem;
}

.store-category-tab.active .store-tab-icon {
    background: rgba(255, 33, 48, .28);
    box-shadow: 0 0 18px rgba(255, 33, 48, .28), inset 0 0 14px rgba(255, 255, 255, .08);
}

.store-catalog-grid {
    align-items: stretch;
}

.store-catalog-card {
    animation: venomStoreFade .22s ease both;
}

@keyframes venomStoreFade {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.store-service-card {
    min-height: 100%;
    cursor: pointer;
}

.store-service-card .service-card-media {
    min-height: 220px;
}

.store-service-card .service-card-image {
    object-fit: cover;
}

.store-service-card .premium-badge {
    z-index: 8;
}

.store-service-card .service-card-body {
    min-height: 330px;
}

.store-service-card .service-features-list li {
    line-height: 1.65;
}

@media (max-width: 768px) {
    .store-category-tabs {
        gap: .55rem;
        margin-bottom: 1rem;
        padding-bottom: .8rem;
    }

    .store-category-tab {
        min-height: 42px;
        padding: .62rem .85rem;
        border-radius: 14px;
        font-size: .82rem;
    }

    .store-tab-icon {
        width: 25px;
        height: 25px;
        border-radius: 9px;
    }

    .store-service-card .service-card-media {
        min-height: 190px;
    }
}


/* ============================================================================
   V22 FULL REFERENCE-STYLE DESKTOP REDESIGN
   Built on top of v21 and preserves all prior data/functions.
   ============================================================================ */
:root{
  --venom-red:#e50914;
  --venom-red-bright:#ff1a24;
  --venom-red-dark:#6f0307;
  --venom-black:#030303;
  --venom-panel:#070708;
  --venom-card:#0b0b0e;
  --venom-line:rgba(255,26,36,.42);
}
html,body{background:#000;color:#fff;}
body.gamer-dark-theme{
  background:
    radial-gradient(circle at 48% 0%, rgba(255,0,10,.16), transparent 35%),
    radial-gradient(circle at 85% 22%, rgba(111,3,7,.18), transparent 28%),
    linear-gradient(180deg,#020202 0%,#000 60%,#050505 100%);
  padding-bottom:0;
}
body.gamer-dark-theme::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(rgba(255,0,0,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,0,0,.025) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(#000,transparent 92%);}
.container.venom-ref-main{max-width:1560px;padding:0 18px 40px;}
.site-main-content{padding-top:22px;}
/* Header */
.venom-ref-header{position:sticky;top:0;z-index:1000;background:rgba(3,3,4,.86)!important;border-bottom:1px solid rgba(255,26,36,.22);backdrop-filter:blur(16px);box-shadow:0 16px 60px rgba(0,0,0,.45);} 
.venom-ref-header-inner{height:78px;max-width:1560px;margin:0 auto;display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center;padding:0 22px!important;}
.venom-ref-logo-link{display:flex!important;align-items:center;gap:12px;}
.venom-ref-mark{width:54px!important;height:54px!important;border:1px solid rgba(255,26,36,.95)!important;background:#070707!important;box-shadow:0 0 22px rgba(255,26,36,.45),inset 0 0 16px rgba(255,26,36,.16)!important;}
.venom-ref-mark img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.venom-ref-title{display:flex!important;flex-direction:column;line-height:.86;letter-spacing:.08em;text-transform:uppercase;}
.venom-ref-title .venom-word{font-family:var(--font-mono);font-size:26px;font-weight:900;color:var(--venom-red-bright);text-shadow:0 0 14px rgba(255,26,36,.55);}
.venom-ref-title small{font-family:var(--font-mono);font-size:11px;color:#fff;letter-spacing:.55em;margin-top:6px;}
.venom-desktop-menu{display:flex;align-items:center;justify-content:center;gap:28px;height:100%;}
.venom-desktop-menu a{position:relative;font-size:13px;font-weight:800;color:#f4f4f4;text-transform:uppercase;letter-spacing:.04em;padding:28px 0;}
.rtl-layout .venom-desktop-menu a{text-transform:none;letter-spacing:0;font-size:14px;}
.venom-desktop-menu a::after{content:"";position:absolute;left:0;right:0;bottom:18px;height:2px;background:linear-gradient(90deg,transparent,var(--venom-red-bright),transparent);transform:scaleX(0);transition:.25s;box-shadow:0 0 13px var(--venom-red-bright);}
.venom-desktop-menu a:hover,.venom-desktop-menu a.active{color:#fff;}
.venom-desktop-menu a:hover::after,.venom-desktop-menu a.active::after{transform:scaleX(1);}
.venom-ref-actions{display:flex;align-items:center;gap:12px;}
.venom-ref-actions .header-action-btn,.venom-login-btn{height:42px;min-width:42px;border:1px solid rgba(255,26,36,.35);background:rgba(12,12,15,.78);border-radius:5px;color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;font-weight:800;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);}
.venom-ref-actions .header-action-btn:hover,.venom-login-btn:hover{border-color:var(--venom-red-bright);box-shadow:0 0 24px rgba(255,26,36,.25);color:#fff;}
.venom-login-btn{color:var(--venom-red-bright);border-color:var(--venom-red-bright);background:linear-gradient(180deg,rgba(255,26,36,.12),rgba(80,0,0,.18));}
.cart-counter{background:var(--venom-red-bright)!important;color:#fff!important;box-shadow:0 0 15px rgba(255,26,36,.7);}
/* Hero */
.venom-ref-hero{min-height:560px;border:1px solid rgba(255,26,36,.38);border-radius:2px;overflow:hidden;margin:22px 0 18px;position:relative;background:#050505;display:flex;align-items:center;padding:52px 34px;box-shadow:0 28px 90px rgba(0,0,0,.55),inset 0 0 70px rgba(255,0,0,.08);} 
.venom-ref-hero-bg{position:absolute;inset:0;z-index:0;}
.venom-ref-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center;filter:contrast(1.12) saturate(1.1) brightness(.9);}
.venom-ref-hero-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.65) 28%,rgba(0,0,0,.08) 58%,rgba(0,0,0,.88) 100%),radial-gradient(circle at 22% 48%,rgba(255,0,0,.12),transparent 45%);}
.venom-ref-hero-content{position:relative;z-index:2;max-width:680px;text-align:inherit;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;}
.rtl-layout .venom-ref-hero-content{margin-right:auto;text-align:right;}
.ltr-layout .venom-ref-hero-content{margin-right:auto;text-align:left;}
.venom-ref-hero .hero-welcome{font-size:17px;color:#fff!important;letter-spacing:.18em;margin-bottom:8px;text-shadow:0 0 12px #000;}
.venom-ref-hero .hero-title{font-size:clamp(52px,7vw,116px);line-height:.88;letter-spacing:.04em;text-transform:uppercase;text-shadow:0 0 26px rgba(255,26,36,.45);}
.rtl-layout .venom-ref-hero .hero-title{direction:ltr;text-align:inherit;}
.venom-ref-hero .hero-title .text-red{color:transparent;background:linear-gradient(180deg,#ff1d27,#8b0007 62%,#2b0002);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1px rgba(255,55,55,.18);}
.venom-ref-hero .hero-title .text-white{color:#f8f8f8;text-shadow:0 0 14px rgba(255,255,255,.15);}
.venom-ref-hero .hero-desc{font-size:clamp(19px,2vw,30px);max-width:620px;margin:18px 0 28px;color:#fff;font-weight:800;line-height:1.5;}
.venom-ref-hero .btn-hero{height:56px;min-width:150px;border-radius:5px;background:linear-gradient(180deg,#ff2730,#a4040c);box-shadow:0 0 35px rgba(255,26,36,.38);font-size:16px;}
/* Trust bar */
.why-choose-us-section{margin:18px 0 28px!important;}
.why-choose-us-section .section-title{display:none;}
.trust-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:0!important;border:1px solid rgba(255,26,36,.28);background:linear-gradient(180deg,rgba(16,16,18,.72),rgba(6,6,7,.88));box-shadow:inset 0 0 35px rgba(255,26,36,.05);}
.trust-card{border:0!important;border-inline-end:1px solid rgba(255,255,255,.08);border-radius:0!important;background:transparent!important;padding:18px 22px!important;display:flex!important;align-items:center;gap:16px;}
.trust-card:last-child{border-inline-end:0;}
.trust-icon{width:48px!important;height:48px!important;border:1px solid rgba(255,26,36,.5);border-radius:12px;background:rgba(255,26,36,.08)!important;color:var(--venom-red-bright)!important;display:flex!important;align-items:center;justify-content:center;font-size:20px;box-shadow:0 0 22px rgba(255,26,36,.16);}
.trust-title{font-size:15px!important;}
.trust-subtitle{font-size:12px!important;}
/* Section headings */
.venom-ref-section-head,.products-header,.services-header{text-align:center;margin:42px 0 26px;}
.venom-ref-section-head h2,.products-header h2,.services-header h2{font-size:clamp(28px,3vw,48px);letter-spacing:.04em;color:#fff!important;text-transform:uppercase;text-shadow:0 0 24px rgba(255,26,36,.35);}
.venom-ref-section-head h2::first-letter,.products-header h2::first-letter,.services-header h2::first-letter{color:var(--venom-red-bright);}
.venom-slashes{display:block;color:var(--venom-red-bright);letter-spacing:.45em;font-weight:900;margin-bottom:6px;}
.venom-ref-section-head p,.services-header p,.products-header p{color:#bfc5d4!important;}
/* Home service tiles */
.venom-ref-service-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.venom-ref-service-tile{position:relative;min-height:270px;border:1px solid rgba(255,26,36,.34);background:linear-gradient(135deg,rgba(20,20,24,.85),rgba(6,6,8,.94));padding:28px;border-radius:2px;overflow:hidden;cursor:pointer;transition:.28s;box-shadow:inset 0 0 40px rgba(255,26,36,.04);} 
.venom-ref-service-tile::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 20%,rgba(255,26,36,.15),transparent 28%),linear-gradient(135deg,transparent,rgba(255,26,36,.06));opacity:.8;}
.venom-ref-service-tile:hover{transform:translateY(-6px);border-color:var(--venom-red-bright);box-shadow:0 22px 60px rgba(255,26,36,.15),inset 0 0 45px rgba(255,26,36,.07);}
.venom-ref-service-tile>*{position:relative;z-index:2;}
.venom-ref-service-tile img{width:86px;height:86px;object-fit:contain;margin-bottom:16px;filter:drop-shadow(0 0 20px rgba(255,26,36,.25));}
.venom-ref-service-tile h3{font-family:var(--font-mono);font-size:26px;font-weight:900;color:#fff;text-transform:uppercase;margin-bottom:8px;}
.venom-ref-service-tile p{color:#d8dce8;font-weight:700;margin-bottom:14px;}
.venom-ref-service-tile ul{display:grid;gap:7px;margin-bottom:20px;color:#c5cad6;font-size:13px;}
.venom-ref-service-tile li::before{content:"✓";color:var(--venom-red-bright);margin-inline-end:8px;}
.venom-ref-big-cart{width:86px;height:86px;display:flex;align-items:center;justify-content:center;color:var(--venom-red-bright);font-size:56px;margin-bottom:16px;text-shadow:0 0 24px rgba(255,26,36,.35);}
/* Featured products */
.venom-ref-featured-products{margin:42px 0 30px;}
.venom-ref-featured-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;border-bottom:1px solid rgba(255,26,36,.2);padding-bottom:13px;}
.venom-ref-featured-title h2{font-family:var(--font-mono);font-size:28px;text-transform:uppercase;color:#fff;}
.venom-ref-featured-title h2::after{content:"";display:inline-block;width:80px;height:2px;background:var(--venom-red-bright);margin-inline-start:14px;vertical-align:middle;box-shadow:0 0 12px var(--venom-red-bright);}
.venom-ref-product-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.venom-ref-product-card,.product-card{border:1px solid rgba(255,255,255,.13);background:linear-gradient(180deg,#09090c,#050506)!important;border-radius:4px;overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.36);transition:.25s;}
.venom-ref-product-card:hover,.product-card:hover{transform:translateY(-5px);border-color:rgba(255,26,36,.65);box-shadow:0 20px 55px rgba(255,26,36,.13);}
.venom-ref-product-img{height:190px;background:radial-gradient(circle at 50% 20%,rgba(255,26,36,.18),transparent 45%),#09090b;border-bottom:1px solid rgba(255,255,255,.08);}
.venom-ref-product-img img{width:100%;height:100%;object-fit:cover;}
.venom-ref-product-card h3{font-size:15px;color:#fff;margin:14px 14px 4px;min-height:44px;}
.venom-ref-product-card p{font-size:12px;color:#9ca6ba;margin:0 14px 8px;}
.venom-ref-product-card strong{display:block;font-family:var(--font-mono);font-size:20px;color:var(--venom-red-bright);margin:0 14px 12px;}
.venom-ref-product-card .btn{width:calc(100% - 28px);margin:0 14px 14px;justify-content:space-between;border-radius:3px;padding:.7rem .9rem;}
/* Stats strip */
.venom-ref-stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:32px 0 36px;border:1px solid rgba(255,26,36,.34);background:linear-gradient(180deg,rgba(17,10,10,.85),rgba(5,5,6,.94));}
.venom-ref-stats-strip div{min-height:88px;display:flex;align-items:center;justify-content:center;gap:12px;border-inline-end:1px solid rgba(255,255,255,.08);}
.venom-ref-stats-strip div:last-child{border-inline-end:0;}
.venom-ref-stats-strip i{width:46px;height:46px;border:1px solid rgba(255,26,36,.5);display:flex;align-items:center;justify-content:center;border-radius:10px;color:var(--venom-red-bright);font-size:20px;}
.venom-ref-stats-strip strong{font-size:27px;color:#fff;font-family:var(--font-mono);}
.venom-ref-stats-strip span{color:#aab1c1;font-size:13px;}
/* Services tab */
.services-section{padding:34px 0;}
.service-group{position:relative;margin:24px 0 34px;border:1px solid rgba(255,26,36,.34);background:linear-gradient(135deg,rgba(12,12,15,.95),rgba(4,4,5,.96));padding:24px;border-radius:4px;overflow:hidden;}
.service-group::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 22%,rgba(255,26,36,.18),transparent 25%);pointer-events:none;}
.service-group-banner{position:relative;z-index:1;border:0!important;background:transparent!important;box-shadow:none!important;margin-bottom:18px!important;}
.service-plans-grid{position:relative;z-index:1;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;gap:24px!important;}
.service-plan-card{border-radius:2px!important;border:1px solid rgba(255,26,36,.42)!important;background:linear-gradient(180deg,rgba(11,11,14,.94),rgba(5,5,6,.98))!important;overflow:hidden;}
.service-card-media{height:210px!important;background:#060606!important;}
.service-card-image{width:100%!important;height:100%!important;object-fit:cover!important;}
.service-floating-icon{width:62px!important;height:62px!important;background:rgba(0,0,0,.72)!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 0 22px rgba(255,26,36,.24)!important;}
/* Store tab */
.store-hub-section{padding:36px 0;}
.search-filter-container{max-width:720px;margin:0 auto 20px;}
.store-category-tabs{display:flex!important;flex-wrap:wrap;gap:10px;margin:0 0 24px!important;padding:14px;border:1px solid rgba(255,26,36,.28);background:rgba(9,9,11,.7);}
.store-category-tab{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);color:#c8ceda;border-radius:3px;padding:10px 14px;font-weight:800;cursor:pointer;transition:.22s;}
.store-category-tab:hover,.store-category-tab.active{background:linear-gradient(180deg,rgba(255,26,36,.24),rgba(80,0,0,.36));border-color:var(--venom-red-bright);color:#fff;box-shadow:0 0 22px rgba(255,26,36,.14);}
.products-grid.store-catalog-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;}
.product-img-box{height:230px!important;background:radial-gradient(circle at 50% 0%,rgba(255,26,36,.17),transparent 45%),#050505!important;border:1px solid rgba(255,26,36,.32)!important;margin:12px 12px 0!important;border-radius:3px!important;overflow:hidden;}
.product-image{width:100%!important;height:100%!important;object-fit:cover!important;}
.product-card-details{padding:16px!important;}
.product-title{font-size:17px!important;line-height:1.4!important;min-height:48px;}
.product-card-desc{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:13px!important;line-height:1.65!important;min-height:62px;}
.product-card-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;}
.product-price{font-size:24px!important;color:var(--venom-red-bright)!important;}
.btn-add-cart{width:50px!important;height:46px!important;padding:0!important;border-radius:4px!important;}
/* Reviews */
.reviews-section{padding:34px 0;}
.lux-reviews-grid{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))!important;gap:16px!important;}
.review-card,.lux-review-card{background:linear-gradient(180deg,rgba(16,16,19,.92),rgba(6,6,7,.96))!important;border:1px solid rgba(255,26,36,.25)!important;border-radius:4px!important;box-shadow:0 16px 50px rgba(0,0,0,.25);}
.review-videos-zone{margin-top:28px!important;border-radius:4px!important;}
.review-video-grid{display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:14px!important;}
.review-video-card,.review-video-placeholder{min-height:210px!important;border-radius:4px!important;}
/* Footer */
.venom-ref-footer{max-width:1560px;margin:36px auto 0;padding:0 18px 18px;background:transparent;border:0;}
.venom-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr;gap:28px;border:1px solid rgba(255,26,36,.36);background:linear-gradient(135deg,rgba(9,9,11,.94),rgba(4,4,5,.98));padding:28px;position:relative;overflow:hidden;}
.venom-footer-grid::after{content:"";position:absolute;right:-10%;bottom:-35%;width:420px;height:320px;background:radial-gradient(circle,rgba(255,26,36,.18),transparent 65%);}
.venom-footer-logo-row{display:flex;align-items:center;gap:14px;margin-bottom:12px;}
.venom-footer-logo-row img{width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,26,36,.7);object-fit:cover;}
.venom-footer-logo-row b{display:block;font-family:var(--font-mono);font-size:26px;color:var(--venom-red-bright);line-height:1;}
.venom-footer-logo-row span{font-size:12px;letter-spacing:.35em;color:#fff;}
.venom-footer-brand p{color:#c8ceda;max-width:320px;}
.venom-footer-grid h4{font-family:var(--font-mono);color:#fff;margin-bottom:12px;font-size:17px;}
.venom-footer-grid a{display:block;color:#aeb6c8;margin:8px 0;font-size:14px;}
.venom-footer-grid a:hover{color:#fff;transform:translateX(-3px);}
.venom-socials{display:flex;gap:10px;margin-top:14px;}
.venom-socials a{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,26,36,.22);color:#fff;}
.venom-footer-vmark{font-family:var(--font-mono);font-size:150px;font-weight:900;color:rgba(255,26,36,.17);line-height:.8;text-align:center;align-self:center;text-shadow:0 0 40px rgba(255,26,36,.12);}
.venom-ref-copy{border:1px solid rgba(255,26,36,.26);border-top:0;background:#030303;padding:14px;text-align:center;color:#777;}
/* Bottom nav only mobile/tablet */
.bottom-nav{border-top:1px solid rgba(255,26,36,.25)!important;background:rgba(5,5,6,.92)!important;backdrop-filter:blur(15px);}
.bottom-nav-item.active{border-color:var(--venom-red-bright)!important;box-shadow:0 0 22px rgba(255,26,36,.22)!important;}
@media (min-width:1025px){.bottom-nav{display:none!important;}body{padding-bottom:0!important;}}
@media (max-width:1280px){.venom-ref-product-row,.products-grid.store-catalog-grid{grid-template-columns:repeat(3,1fr)!important}.review-video-grid{grid-template-columns:repeat(3,1fr)!important}.venom-ref-hero{min-height:500px}.venom-desktop-menu{gap:16px}.venom-ref-title .venom-word{font-size:22px}}
@media (max-width:1024px){.venom-desktop-menu,.venom-login-btn,.venom-search-btn{display:none!important}.venom-ref-header-inner{grid-template-columns:auto auto;height:70px}.venom-ref-actions{justify-self:end}.container.venom-ref-main{padding:0 12px 90px}.venom-ref-hero{min-height:520px;padding:30px 20px}.venom-ref-hero-shade{background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.86) 72%,#000 100%)}.rtl-layout .venom-ref-hero-content,.ltr-layout .venom-ref-hero-content{margin:0;text-align:center}.venom-ref-hero .hero-desc{margin-inline:auto}.trust-grid{grid-template-columns:repeat(2,1fr)!important}.venom-ref-service-tiles{grid-template-columns:1fr}.venom-ref-product-row,.products-grid.store-catalog-grid{grid-template-columns:repeat(2,1fr)!important}.venom-ref-stats-strip{grid-template-columns:repeat(2,1fr)}.venom-footer-grid{grid-template-columns:1fr 1fr}.venom-footer-vmark{display:none}}
@media (max-width:640px){.venom-ref-header-inner{padding:0 10px!important}.venom-ref-title .venom-word{font-size:18px}.venom-ref-title small{font-size:9px}.venom-ref-mark{width:48px!important;height:48px!important}.venom-ref-mini-control .currency-symbol,.venom-ref-mini-control .lang-label{display:none}.venom-ref-hero{border-left:0;border-right:0;border-radius:0;margin-left:-12px;margin-right:-12px;min-height:540px}.venom-ref-hero .hero-title{font-size:54px}.venom-ref-hero .hero-desc{font-size:18px}.trust-grid,.venom-ref-product-row,.products-grid.store-catalog-grid,.review-video-grid{grid-template-columns:1fr!important}.trust-card{padding:14px!important}.venom-ref-featured-title{align-items:flex-start;gap:12px;flex-direction:column}.venom-ref-stats-strip{grid-template-columns:1fr}.venom-footer-grid{grid-template-columns:1fr;padding:20px}.product-img-box{height:260px!important}}


/* === v23 polish: compact logo, cache-proof language button, and mobile video modal fix === */
.venom-ref-header-inner{
    height:70px!important;
    gap:22px!important;
}
.venom-ref-logo-link{
    gap:10px!important;
    min-width:max-content!important;
}
.venom-ref-mark{
    width:46px!important;
    height:46px!important;
    flex:0 0 46px!important;
}
.venom-ref-title{
    line-height:.9!important;
    letter-spacing:.055em!important;
}
.venom-ref-title .venom-word{
    font-size:21px!important;
    line-height:1!important;
    text-shadow:0 0 10px rgba(255,26,36,.48)!important;
}
.venom-ref-title small{
    font-size:8.5px!important;
    letter-spacing:.42em!important;
    margin-top:4px!important;
}
.venom-ref-actions .header-action-btn,
.venom-login-btn{
    height:38px!important;
    min-width:38px!important;
    padding:0 12px!important;
}
.venom-ref-mini-control .lang-label{
    font-size:12px!important;
}
.video-modal,
.service-detail-modal{
    z-index:999999!important;
    align-items:center!important;
    justify-content:center!important;
    padding:14px!important;
    overscroll-behavior:contain!important;
}
body.service-modal-open{
    overflow:hidden!important;
    touch-action:none!important;
}
.video-modal-content,
.service-detail-modal-content{
    max-height:calc(100dvh - 24px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
}
.service-detail-video-wrapper,
.video-container{
    background:#000!important;
    min-height:220px!important;
}
@media (max-width:1024px){
    .venom-ref-header-inner{
        height:64px!important;
        grid-template-columns:auto auto!important;
        gap:12px!important;
    }
    .venom-ref-brand{min-width:0!important;}
    .venom-ref-mark{width:42px!important;height:42px!important;flex-basis:42px!important;}
    .venom-ref-title .venom-word{font-size:18px!important;}
    .venom-ref-title small{font-size:7.5px!important;letter-spacing:.34em!important;}
    .service-detail-grid{
        grid-template-columns:1fr!important;
    }
    .service-detail-video-wrapper{
        min-height:230px!important;
        position:sticky!important;
        top:0!important;
        z-index:3!important;
    }
}
@media (max-width:640px){
    .venom-ref-title .venom-word{font-size:16px!important;}
    .venom-ref-title small{font-size:7px!important;letter-spacing:.28em!important;}
    .venom-ref-mark{width:38px!important;height:38px!important;flex-basis:38px!important;}
    .venom-ref-actions{gap:7px!important;}
    .venom-ref-actions .header-action-btn{height:34px!important;min-width:34px!important;padding:0 9px!important;}
    .service-detail-modal{padding:8px!important;align-items:flex-start!important;}
    .service-detail-modal-content{width:100%!important;max-height:calc(100dvh - 16px)!important;border-radius:10px!important;}
    .service-detail-video-wrapper{min-height:205px!important;}
}


/* v24: home service tiles jump directly to selected service group */
.service-group.venom-section-focus {
    animation: venomFocusPulse 1.25s ease both;
}
@keyframes venomFocusPulse {
    0% { box-shadow: 0 0 0 rgba(255, 26, 36, 0); transform: translateY(0); }
    28% { box-shadow: 0 0 38px rgba(255, 26, 36, .28); transform: translateY(-2px); }
    100% { box-shadow: 0 0 0 rgba(255, 26, 36, 0); transform: translateY(0); }
}

/* === v25: image loading, media framing, logo placement, and remote video support === */
.venom-media-frame{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:
        radial-gradient(circle at 50% 18%, rgba(255,26,36,.16), transparent 42%),
        linear-gradient(145deg,#09090b,#020203 72%) !important;
}
.venom-media-frame::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:linear-gradient(105deg,transparent 34%,rgba(255,255,255,.055) 48%,transparent 62%);
    transform:translateX(-120%);
    animation:venomMediaShimmer 1.15s ease-in-out infinite;
    pointer-events:none;
}
.venom-media-frame.is-loaded::before,
.venom-media-frame.is-error::before{
    opacity:0;
    animation:none;
}
.venom-media-frame .venom-async-image{
    position:relative;
    z-index:1;
    opacity:0;
    transition:opacity .22s ease, transform .38s ease, filter .38s ease;
    backface-visibility:hidden;
}
.venom-media-frame .venom-async-image.is-loaded{
    opacity:1;
}
@keyframes venomMediaShimmer{
    to{transform:translateX(120%)}
}

/* Header mark: keep the hooded VeNoM mark visually centered inside the circle. */
.venom-ref-mark{
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
}
.venom-ref-mark .mascot-mini{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 28%!important;
    transform:scale(1.18)!important;
    transform-origin:center 30%!important;
}

/* Hero artwork sits away from the copy instead of colliding in the middle. */
.venom-ref-hero-bg img.venom-hero-image{
    object-position:68% 44%!important;
}

/* Preserve the complete product artwork; do not crop prices, labels, or edges. */
.products-grid.store-catalog-grid .product-img-box{
    width:calc(100% - 24px)!important;
    height:auto!important;
    aspect-ratio:1.655 / 1!important;
    min-height:0!important;
    background:#040405!important;
}
.products-grid.store-catalog-grid .product-image{
    width:100%!important;
    height:100%!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#040405!important;
}
.products-grid.store-catalog-grid .product-card:hover .product-image{
    transform:scale(1.018)!important;
}

/* Package artwork is also shown in full, without cutting the package text. */
.service-card-media{
    height:auto!important;
    aspect-ratio:16 / 9!important;
    background:#030304!important;
}
.service-card-image{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#030304!important;
}
.service-plan-card:hover .service-card-image{
    transform:scale(1.018)!important;
    filter:contrast(1.04) saturate(1.06)!important;
}
.service-floating-icon{
    top:12px!important;
    right:12px!important;
    left:auto!important;
    width:54px!important;
    height:54px!important;
    border-radius:13px!important;
    display:grid!important;
    place-items:center!important;
    padding:4px!important;
}
.rtl-layout .service-floating-icon{
    right:auto!important;
    left:12px!important;
}
.service-floating-icon img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
}

.product-detail-image-wrapper{
    min-height:320px;
    background:#030304!important;
}
.product-detail-img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    background:#030304!important;
}

/* Google Drive preview is the single video stage. */
.venom-video-host{
    position:relative!important;
    overflow:hidden!important;
    background:#000!important;
}
.venom-embed-frame{
    width:100%!important;
    height:100%!important;
    min-height:320px!important;
    aspect-ratio:16 / 9!important;
    border:0!important;
    display:block;
    background:#000!important;
}
.venom-video-loading{
    position:absolute;
    inset:0;
    z-index:5;
    display:grid;
    place-items:center;
    background:#000;
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
}
.venom-video-host.is-loading .venom-video-loading{
    opacity:1;
}
.venom-video-loading span{
    width:46px;
    height:46px;
    border:3px solid rgba(255,255,255,.13);
    border-top-color:var(--venom-red-bright);
    border-radius:50%;
    animation:venomVideoSpin .7s linear infinite;
    box-shadow:0 0 22px rgba(255,26,36,.2);
}
@keyframes venomVideoSpin{to{transform:rotate(360deg)}}

/* Skip costly painting for cards that are still far below the viewport. */
.store-catalog-card,
.service-plan-card{
    content-visibility:auto;
    contain-intrinsic-size:420px;
}

@media (max-width:1024px){
    .venom-ref-hero-bg img.venom-hero-image{object-position:center 36%!important;}
    .venom-embed-frame{min-height:260px!important;}
}
@media (max-width:640px){
    .products-grid.store-catalog-grid .product-img-box{
        height:auto!important;
        aspect-ratio:1.655 / 1!important;
    }
    .service-card-media{aspect-ratio:16 / 9!important;}
    .service-floating-icon{width:48px!important;height:48px!important;top:9px!important;}
    .venom-embed-frame{min-height:210px!important;}
    .product-detail-image-wrapper{min-height:240px;}
}

@media (prefers-reduced-motion:reduce){
    .venom-media-frame::before,
    .venom-video-loading span{animation:none!important;}
    .venom-media-frame .venom-async-image{transition:none!important;}
}

/* ========================================================================== 
   v27 — instant local icons, structured desktop hero, and Arabic brand polish
   ========================================================================== */
@font-face{
    font-family:"Font Awesome 6 Free";
    font-style:normal;
    font-weight:900;
    font-display:swap;
    src:url("../vendor/fontawesome/webfonts/fa-solid-900.woff2") format("woff2");
}
@font-face{
    font-family:"Font Awesome 6 Free";
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url("../vendor/fontawesome/webfonts/fa-regular-400.woff2") format("woff2");
}
@font-face{
    font-family:"Font Awesome 6 Brands";
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url("../vendor/fontawesome/webfonts/fa-brands-400.woff2") format("woff2");
}

.fa-solid,.fas{
    font-family:"Font Awesome 6 Free"!important;
    font-style:normal!important;
    font-weight:900!important;
}
.fa-regular,.far{
    font-family:"Font Awesome 6 Free"!important;
    font-style:normal!important;
    font-weight:400!important;
}
.fa-brands,.fab{
    font-family:"Font Awesome 6 Brands"!important;
    font-style:normal!important;
    font-weight:400!important;
}

/* Every desktop destination gets a clear, consistent glyph. */
.venom-desktop-menu a{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    gap:8px;
}
.venom-desktop-menu a i{
    width:17px;
    color:#ff4a53;
    font-size:14px;
    text-align:center;
    filter:drop-shadow(0 0 8px rgba(255,26,36,.35));
    transition:color .2s ease,transform .2s ease,filter .2s ease;
}
.venom-desktop-menu a:hover i,
.venom-desktop-menu a.active i{
    color:#fff;
    transform:translateY(-1px);
    filter:drop-shadow(0 0 10px rgba(255,35,45,.78));
}

.rtl-layout .venom-ref-title{
    text-transform:none;
    letter-spacing:0!important;
}
.rtl-layout .venom-ref-title .venom-word{
    font-family:'Cairo','Segoe UI',sans-serif!important;
    font-size:18px!important;
    line-height:1.05!important;
    letter-spacing:0!important;
    white-space:nowrap;
}
.rtl-layout .venom-ref-title small{
    font-size:7px!important;
    letter-spacing:.24em!important;
    text-align:center;
}

.hero-title-line{display:block}
.rtl-layout .venom-ref-hero .hero-title{
    direction:rtl!important;
    letter-spacing:0!important;
}
.rtl-layout .hero-title-line-ar{
    font-family:'Cairo','Segoe UI',sans-serif!important;
    font-weight:900;
    white-space:nowrap;
}

@media (min-width:1025px){
    .venom-ref-hero{
        min-height:clamp(500px,38vw,620px)!important;
        padding:clamp(36px,4vw,64px)!important;
    }
    .venom-ref-hero-bg img.venom-hero-image{
        object-position:center 36%!important;
        filter:contrast(1.08) saturate(1.08) brightness(.98)!important;
    }
    .venom-ref-hero-shade{
        background:
            linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.82) 31%,rgba(0,0,0,.42) 49%,rgba(0,0,0,.04) 69%,rgba(0,0,0,.22) 100%),
            radial-gradient(circle at 24% 48%,rgba(255,0,12,.13),transparent 40%)!important;
    }
    .venom-ref-hero::before{
        background:linear-gradient(115deg,rgba(255,28,38,.07),transparent 38%)!important;
    }
    .rtl-layout .venom-ref-hero-content,
    .ltr-layout .venom-ref-hero-content{
        width:min(45%,620px)!important;
        max-width:620px!important;
        margin-left:clamp(8px,2vw,34px)!important;
        margin-right:auto!important;
        padding:clamp(22px,2.4vw,34px)!important;
        text-align:center!important;
        border:1px solid rgba(255,255,255,.065)!important;
        border-radius:20px!important;
        background:linear-gradient(150deg,rgba(3,3,4,.68),rgba(4,4,6,.3))!important;
        box-shadow:0 24px 70px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.035)!important;
        backdrop-filter:blur(3px);
        -webkit-backdrop-filter:blur(3px);
    }
    .venom-ref-hero .hero-welcome{
        margin-bottom:12px!important;
        font-size:clamp(14px,1.05vw,17px)!important;
    }
    .venom-ref-hero .hero-title{
        font-size:clamp(50px,5vw,78px)!important;
        line-height:.93!important;
    }
    .rtl-layout .venom-ref-hero .hero-title{
        font-size:clamp(42px,4.2vw,67px)!important;
        line-height:1.15!important;
    }
    .venom-ref-hero .hero-desc{
        max-width:540px!important;
        margin:20px auto 26px!important;
        font-size:clamp(17px,1.35vw,22px)!important;
        line-height:1.65!important;
    }
    .venom-ref-hero .hero-btn-wrapper{
        display:flex;
        justify-content:center;
    }
}

/* Mobile and tablet retain the dramatic centered composition without crowding. */
@media (max-width:1024px){
    .rtl-layout .venom-ref-title .venom-word{font-size:16px!important}
    .venom-ref-hero-bg img.venom-hero-image{
        object-position:center 31%!important;
        filter:contrast(1.08) saturate(1.05) brightness(.88)!important;
    }
    .rtl-layout .venom-ref-hero-content,
    .ltr-layout .venom-ref-hero-content{
        width:min(94%,680px)!important;
        max-width:680px!important;
        margin:auto!important;
        padding:24px 18px!important;
        text-align:center!important;
        border-radius:18px!important;
        background:linear-gradient(180deg,rgba(0,0,0,.46),rgba(0,0,0,.28))!important;
    }
    .venom-ref-hero .hero-title{font-size:clamp(46px,10vw,68px)!important}
    .rtl-layout .venom-ref-hero .hero-title{font-size:clamp(38px,9vw,58px)!important}
    .venom-ref-hero .hero-desc{margin:18px auto 24px!important}
    .venom-ref-hero .hero-btn-wrapper{display:flex;justify-content:center}
}

/* Clear, tactile mobile destinations with a unified icon container. */
.bottom-nav-item .venom-nav-glyph{
    position:relative;
    z-index:1;
    width:30px;
    height:30px;
    display:inline-grid;
    place-items:center;
    flex:0 0 30px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:10px;
    color:#e7e9ef;
    background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.018));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 6px 14px rgba(0,0,0,.25);
}
.bottom-nav-item .venom-nav-glyph i{
    width:auto!important;
    height:auto!important;
    display:inline-block!important;
    border:0!important;
    border-radius:0!important;
    color:inherit!important;
    background:transparent!important;
    box-shadow:none!important;
    text-shadow:none!important;
    font-size:14px!important;
}
.bottom-nav-item:hover .venom-nav-glyph,
.bottom-nav-item.active .venom-nav-glyph{
    color:#fff;
    border-color:rgba(255,74,83,.7);
    background:linear-gradient(145deg,#ff2a35,#8b0009 72%);
    box-shadow:0 0 18px rgba(255,30,42,.44),inset 0 1px 0 rgba(255,255,255,.17);
    transform:translateY(-1px);
}
.bottom-nav-item.active .bottom-nav-label{color:#fff!important}

@media (max-width:390px){
    .rtl-layout .venom-ref-title .venom-word{font-size:14px!important}
    .rtl-layout .venom-ref-title small{font-size:6px!important}
    .bottom-nav-item .venom-nav-glyph{width:27px;height:27px;flex-basis:27px}
    .bottom-nav-item .venom-nav-glyph i{font-size:13px!important}
}

/* v25 home catalog polish */
.venom-ref-product-img{
    height:auto!important;
    aspect-ratio:1.655 / 1!important;
    background:#040405!important;
}
.venom-ref-product-img img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#040405!important;
}
.venom-ref-product-card:hover .venom-ref-product-img img{
    transform:scale(1.018);
}


/* === v25.1 external service + review videos === */
.review-video-card.btn-demo-play{
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    padding:0!important;
    color:inherit;
    cursor:pointer;
    text-align:center;
    border:1px solid rgba(255,26,36,.35)!important;
    background:#050505!important;
    box-shadow:0 16px 42px rgba(0,0,0,.34);
    transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.review-video-card.btn-demo-play:hover,
.review-video-card.btn-demo-play:focus-visible{
    transform:translateY(-4px);
    border-color:rgba(255,26,36,.82)!important;
    box-shadow:0 20px 55px rgba(255,26,36,.16),0 18px 48px rgba(0,0,0,.42);
    outline:none;
}
.review-video-card.btn-demo-play .review-video-placeholder{
    min-height:210px!important;
    width:100%;
    background:
      radial-gradient(circle at 50% 35%,rgba(255,26,36,.25),transparent 28%),
      linear-gradient(145deg,rgba(255,26,36,.11),rgba(255,255,255,.025)),
      #050505;
}
.review-video-play{
    width:62px;
    height:62px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    background:linear-gradient(180deg,#ff2833,#9d0008);
    border:1px solid rgba(255,255,255,.25);
    box-shadow:0 0 0 10px rgba(255,26,36,.08),0 0 30px rgba(255,26,36,.42);
}
.review-video-play i{font-size:22px!important;margin-inline-start:3px;filter:none!important;}
.review-video-card.btn-demo-play strong{font-size:15px;color:#fff;}
.review-video-card.btn-demo-play .font-mono{color:#ff5a63!important;}

/* ==========================================================================
   v26 — VeNoM visual system, language polish, and interaction refinement
   ========================================================================== */
:root{
    --venom-red-bright:#ff1a24;
    --venom-red-deep:#850008;
    --venom-panel:rgba(10,10,12,.88);
    --venom-panel-strong:#09090b;
    --venom-line:rgba(255,40,50,.22);
    --venom-line-strong:rgba(255,40,50,.58);
    --venom-soft-shadow:0 22px 70px rgba(0,0,0,.48);
    --venom-red-shadow:0 16px 48px rgba(255,18,30,.14);
}

html{
    color-scheme:dark;
    scrollbar-color:#8f0710 #050506;
}

body{
    min-height:100vh;
    background:
        radial-gradient(circle at 12% 9%,rgba(255,20,32,.11),transparent 29rem),
        radial-gradient(circle at 88% 28%,rgba(119,0,8,.12),transparent 32rem),
        linear-gradient(180deg,#020203 0%,#050506 46%,#010102 100%);
    background-attachment:fixed;
}

body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    pointer-events:none;
    opacity:.28;
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size:36px 36px;
    mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 82%);
}

body.rtl-layout{
    font-family:'Cairo','Segoe UI',Tahoma,sans-serif;
    letter-spacing:0;
}

body.ltr-layout{
    font-family:'Space Grotesk','Segoe UI',sans-serif;
}

body.rtl-layout .font-mono{
    font-family:'Cairo','JetBrains Mono',monospace;
    letter-spacing:0;
}

::selection{
    color:#fff;
    background:rgba(255,26,36,.72);
}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#050506}
::-webkit-scrollbar-thumb{
    border:2px solid #050506;
    border-radius:999px;
    background:linear-gradient(180deg,#ef1822,#730009);
}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#ff3540,#98000c)}

:focus-visible{
    outline:2px solid rgba(255,45,55,.95)!important;
    outline-offset:3px;
}

.site{
    position:relative;
    isolation:isolate;
}

.container.venom-ref-main{
    max-width:1380px!important;
}

/* Premium glass header */
.venom-ref-header{
    border-bottom:1px solid rgba(255,35,45,.24)!important;
    background:linear-gradient(180deg,rgba(7,7,9,.96),rgba(4,4,5,.89))!important;
    box-shadow:0 12px 42px rgba(0,0,0,.42),0 1px 0 rgba(255,255,255,.025) inset!important;
    backdrop-filter:blur(18px) saturate(1.25)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.25)!important;
}

.venom-ref-header::after{
    content:"";
    position:absolute;
    left:8%;
    right:8%;
    bottom:-1px;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,26,36,.72),transparent);
    pointer-events:none;
}

.venom-ref-logo-link{
    border-radius:14px;
    padding:5px 8px 5px 5px;
}

.venom-ref-logo-link:hover{
    background:rgba(255,26,36,.055);
}

.venom-ref-mark{
    border:1px solid rgba(255,55,64,.62)!important;
    box-shadow:0 0 0 4px rgba(255,26,36,.055),0 0 26px rgba(255,26,36,.25)!important;
}

.venom-ref-title .venom-word{
    background:linear-gradient(180deg,#ff5961 0%,#ff1a24 48%,#9c0009 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent!important;
}

.venom-desktop-menu{
    padding:5px;
    border:1px solid rgba(255,255,255,.055);
    border-radius:14px;
    background:rgba(255,255,255,.018);
}

.venom-desktop-menu a{
    position:relative;
    border-radius:10px;
    padding:9px 13px!important;
}

.venom-desktop-menu a::after{
    content:"";
    position:absolute;
    left:18%;
    right:18%;
    bottom:4px;
    height:2px;
    border-radius:999px;
    transform:scaleX(0);
    background:linear-gradient(90deg,transparent,#ff1a24,transparent);
    transition:transform .22s ease;
}

.venom-desktop-menu a:hover,
.venom-desktop-menu a.active{
    color:#fff!important;
    background:linear-gradient(180deg,rgba(255,35,45,.12),rgba(255,35,45,.035));
    text-shadow:0 0 16px rgba(255,42,51,.36);
}

.venom-desktop-menu a:hover::after,
.venom-desktop-menu a.active::after{transform:scaleX(1)}

.venom-ref-actions .header-action-btn,
.venom-login-btn{
    border:1px solid rgba(255,255,255,.075)!important;
    border-radius:11px!important;
    color:#f7f7f8!important;
    background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
    box-shadow:0 8px 24px rgba(0,0,0,.26)!important;
}

.venom-ref-actions .header-action-btn:hover,
.venom-login-btn:hover{
    border-color:rgba(255,35,45,.56)!important;
    background:linear-gradient(180deg,rgba(255,35,45,.18),rgba(255,20,30,.055))!important;
    box-shadow:0 10px 30px rgba(255,20,30,.14)!important;
    transform:translateY(-1px);
}

.language-switcher .header-action-btn{
    text-decoration:none;
}

.country-dropdown{
    border:1px solid rgba(255,35,45,.28)!important;
    border-radius:14px!important;
    background:rgba(8,8,10,.97)!important;
    box-shadow:var(--venom-soft-shadow),0 0 40px rgba(255,18,30,.09)!important;
    backdrop-filter:blur(16px);
}

.country-dropdown li{
    border-radius:9px;
    transition:background .18s ease,color .18s ease;
}
.country-dropdown li:hover{background:rgba(255,26,36,.11)!important;color:#fff!important}

/* Hero depth and alignment */
.venom-ref-hero{
    overflow:hidden;
    border:1px solid rgba(255,35,45,.28)!important;
    border-radius:24px!important;
    box-shadow:0 34px 90px rgba(0,0,0,.58),0 0 70px rgba(255,18,30,.08)!important;
}

.venom-ref-hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    pointer-events:none;
    background:
        linear-gradient(120deg,rgba(255,30,40,.1),transparent 34%),
        radial-gradient(circle at 72% 48%,transparent 0 23%,rgba(0,0,0,.08) 55%,rgba(0,0,0,.55) 100%);
}

.venom-ref-hero-content{
    position:relative;
    z-index:4!important;
}

.venom-ref-hero .hero-title{
    filter:drop-shadow(0 8px 26px rgba(0,0,0,.7));
}

.venom-ref-hero .hero-desc{
    color:#d8dce5!important;
    text-shadow:0 2px 16px rgba(0,0,0,.8);
}

/* Unified VeNoM cards */
.trust-card,
.venom-ref-service-tile,
.venom-ref-product-card,
.product-card,
.service-plan-card,
.lux-review-card,
.telegram-channel-card,
.review-videos-zone,
.contact-form-card,
.brand-mascot-card,
.social-channel-card,
.orders-card,
.cart-summary,
.checkout-form-card{
    border-color:rgba(255,38,48,.19)!important;
    background:
        linear-gradient(145deg,rgba(255,255,255,.035),transparent 38%),
        linear-gradient(180deg,rgba(14,14,17,.96),rgba(6,6,8,.97))!important;
    box-shadow:0 20px 58px rgba(0,0,0,.34),0 1px 0 rgba(255,255,255,.03) inset!important;
}

.venom-ref-service-tile,
.venom-ref-product-card,
.product-card,
.service-plan-card,
.lux-review-card{
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
}

.venom-ref-service-tile:hover,
.venom-ref-product-card:hover,
.product-card:hover,
.service-plan-card:hover,
.lux-review-card:hover{
    transform:translateY(-6px)!important;
    border-color:rgba(255,40,50,.52)!important;
    box-shadow:0 28px 72px rgba(0,0,0,.46),0 0 34px rgba(255,20,30,.1)!important;
}

.section-title,
.venom-ref-featured-title h2,
.reviews-header h2,
.services-header h2{
    position:relative;
    text-shadow:0 0 22px rgba(255,26,36,.2);
}

.section-title::after,
.reviews-header h2::after,
.services-header h2::after{
    content:"";
    display:block;
    width:64px;
    height:3px;
    margin:12px auto 0;
    border-radius:99px;
    background:linear-gradient(90deg,transparent,#ff1a24,transparent);
    box-shadow:0 0 16px rgba(255,26,36,.42);
}

.rtl-layout .section-title::after{
    margin-inline-start:0;
    margin-inline-end:0;
}

/* Product and package media */
.product-img-box,
.service-card-media,
.venom-ref-product-img{
    border-bottom:1px solid rgba(255,35,45,.16)!important;
}

.product-img-box::after,
.service-card-media::after,
.venom-ref-product-img::after{
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:32%;
    z-index:2;
    pointer-events:none;
    background:linear-gradient(to top,rgba(3,3,4,.46),transparent);
}

.product-category,
.service-card-type-chip,
.premium-badge{
    border:1px solid rgba(255,255,255,.1)!important;
    backdrop-filter:blur(10px);
    box-shadow:0 8px 24px rgba(0,0,0,.35);
}

.product-title,
.service-plan-title,
.venom-ref-product-card h3{
    color:#fff!important;
    line-height:1.35!important;
}

.product-price,
.service-price-amount{
    text-shadow:0 0 18px currentColor;
}

/* Buttons */
.btn,
.add-to-cart-btn,
.wc-add-cart-btn{
    min-height:44px;
    border:1px solid rgba(255,255,255,.09)!important;
    border-radius:11px!important;
    letter-spacing:.015em;
    box-shadow:0 12px 32px rgba(0,0,0,.28)!important;
}

.btn-red,
.add-to-cart-btn,
.wc-add-cart-btn{
    color:#fff!important;
    background:linear-gradient(180deg,#ff202b 0%,#d50712 56%,#8d0008 100%)!important;
    box-shadow:0 12px 32px rgba(255,18,30,.22),0 1px 0 rgba(255,255,255,.18) inset!important;
}

.btn-red:hover,
.add-to-cart-btn:hover,
.wc-add-cart-btn:hover{
    filter:brightness(1.12) saturate(1.08);
    transform:translateY(-2px);
    box-shadow:0 17px 42px rgba(255,18,30,.3),0 1px 0 rgba(255,255,255,.2) inset!important;
}

/* Forms */
.form-control,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
textarea,
select{
    color:#f4f5f7!important;
    border:1px solid rgba(255,255,255,.1)!important;
    border-radius:11px!important;
    background:rgba(3,3,5,.78)!important;
    box-shadow:0 8px 24px rgba(0,0,0,.18) inset!important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus{
    border-color:rgba(255,35,45,.72)!important;
    box-shadow:0 0 0 3px rgba(255,26,36,.1),0 12px 34px rgba(0,0,0,.25)!important;
}

/* Modals and embedded videos */
.video-modal,
.service-detail-modal,
.product-detail-modal{
    background:rgba(0,0,0,.84)!important;
    backdrop-filter:blur(11px)!important;
    -webkit-backdrop-filter:blur(11px)!important;
}

.video-modal-content,
.service-detail-modal-content,
.product-detail-modal-content{
    border:1px solid rgba(255,38,48,.38)!important;
    border-radius:20px!important;
    background:linear-gradient(155deg,rgba(15,15,18,.98),rgba(4,4,5,.99))!important;
    box-shadow:0 36px 110px rgba(0,0,0,.78),0 0 65px rgba(255,18,30,.12)!important;
}

.close-video-btn,
.close-product-btn{
    border:1px solid rgba(255,255,255,.09)!important;
    background:rgba(255,25,36,.1)!important;
    box-shadow:0 8px 24px rgba(0,0,0,.3);
}
.close-video-btn:hover,
.close-product-btn:hover{background:rgba(255,25,36,.28)!important;color:#fff!important}

.venom-video-host{
    border:1px solid rgba(255,35,45,.24)!important;
    border-radius:15px!important;
    box-shadow:0 20px 60px rgba(0,0,0,.46),0 0 34px rgba(255,20,30,.08)!important;
}

/* Bottom navigation */
.bottom-nav{
    box-shadow:0 -16px 46px rgba(0,0,0,.46),0 -1px 0 rgba(255,35,45,.18)!important;
}
.bottom-nav-item{
    border-radius:12px!important;
    transition:background .18s ease,color .18s ease,transform .18s ease!important;
}
.bottom-nav-item.active{
    color:#fff!important;
    background:linear-gradient(180deg,rgba(255,32,42,.16),rgba(255,32,42,.04))!important;
}
.bottom-nav-item:active{transform:scale(.96)}

/* Footer */
.venom-ref-footer{
    position:relative;
    border-top-color:rgba(255,35,45,.24)!important;
    background:
        radial-gradient(circle at 15% 20%,rgba(255,20,30,.08),transparent 30rem),
        #030304!important;
}

.venom-ref-copy{
    border-color:rgba(255,35,45,.18)!important;
    background:#020203!important;
}

@media (max-width:1024px){
    body::before{background-size:28px 28px;opacity:.2}
    .venom-ref-hero{border-radius:18px!important}
    .venom-ref-service-tile:hover,
    .venom-ref-product-card:hover,
    .product-card:hover,
    .service-plan-card:hover,
    .lux-review-card:hover{transform:translateY(-3px)!important}
}

@media (max-width:640px){
    .venom-ref-header{backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important}
    .venom-ref-logo-link{padding:3px 4px}
    .venom-ref-hero{box-shadow:0 24px 68px rgba(0,0,0,.56)!important}
    .video-modal-content,
    .service-detail-modal-content,
    .product-detail-modal-content{border-radius:14px!important}
    .btn,.add-to-cart-btn,.wc-add-cart-btn{min-height:46px}
}

@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{
        scroll-behavior:auto!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important;
    }
}

/* ========================================================================== 
   v27.2 — zero-delay image paint and mobile autoplay video
   ========================================================================== */
/* Never conceal a downloaded image behind JavaScript or a fade animation. */
.venom-media-frame::before{
    content:none!important;
    display:none!important;
    animation:none!important;
}
.venom-media-frame .venom-async-image,
.venom-media-frame .venom-async-image.is-loaded{
    opacity:1!important;
    visibility:visible!important;
    transition:transform .28s ease,filter .28s ease!important;
}
.store-catalog-card,
.service-plan-card{
    content-visibility:visible!important;
    contain-intrinsic-size:auto!important;
}

/* The local poster remains visible while the remote MP4 buffers. */
.venom-video-host{
    background:#030304!important;
}
.venom-embed-frame{
    object-fit:contain;
    object-position:center;
    background:#030304!important;
    transition:opacity .2s ease!important;
}
.venom-video-loading{
    background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.38))!important;
    backdrop-filter:none!important;
}
.venom-video-host.is-playing .venom-video-loading{
    opacity:0!important;
}
.venom-video-autoplay-note{
    position:absolute;
    right:12px;
    bottom:48px;
    z-index:6;
    max-width:calc(100% - 24px);
    padding:6px 10px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:8px;
    color:#fff;
    background:rgba(0,0,0,.68);
    font-size:11px;
    line-height:1.4;
    pointer-events:none;
    opacity:.88;
    transition:opacity .2s ease;
}
.rtl-layout .venom-video-autoplay-note{
    right:auto;
    left:12px;
}
.venom-video-host.is-playing .venom-video-autoplay-note{
    opacity:0;
}

@media (max-width:640px){
    .venom-video-autoplay-note{
        right:8px;
        bottom:44px;
        max-width:calc(100% - 16px);
        font-size:10px;
    }
    .rtl-layout .venom-video-autoplay-note{right:auto;left:8px}
}


/* ==========================================================================
   VeNoM V27.4 - Our Tools tab and service-package tool linking
   ========================================================================== */
.venom-ref-service-tiles{
    grid-template-columns:repeat(4,minmax(0,1fr));
}
.venom-tools-preview-tile{
    border-color:rgba(255,42,52,.52)!important;
    background:
        radial-gradient(circle at 80% 0%,rgba(255,25,38,.18),transparent 42%),
        linear-gradient(180deg,rgba(14,14,18,.96),rgba(5,5,7,.99))!important;
}
.venom-tools-preview-icon{
    color:#fff;
    filter:drop-shadow(0 0 16px rgba(255,24,44,.65));
}

.our-tools-section{
    padding:clamp(1.25rem,3vw,2.5rem) 0 3rem;
}
.our-tools-hero{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:2rem;
    padding:clamp(1.4rem,4vw,3rem);
    margin-bottom:1rem;
    border:1px solid rgba(255,32,44,.34);
    border-radius:24px;
    background:
        radial-gradient(circle at 85% 20%,rgba(255,24,44,.24),transparent 28rem),
        linear-gradient(135deg,rgba(17,17,22,.98),rgba(3,3,5,.99));
    box-shadow:0 24px 70px rgba(0,0,0,.48),0 0 42px rgba(255,20,32,.09);
}
.our-tools-hero::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
    background-size:28px 28px;
    mask-image:linear-gradient(90deg,#000,transparent 82%);
}
.our-tools-hero-copy{position:relative;z-index:1;max-width:780px}
.our-tools-kicker{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    color:#ff4e58;
    font-weight:950;
    letter-spacing:.14em;
    margin-bottom:.75rem;
}
.our-tools-hero h2{
    margin:0 0 .7rem;
    font-size:clamp(1.75rem,4vw,3.2rem);
    line-height:1.15;
    text-shadow:0 0 24px rgba(255,255,255,.11);
}
.our-tools-hero p{
    margin:0;
    color:rgba(255,255,255,.76);
    font-size:clamp(.95rem,1.5vw,1.08rem);
    line-height:1.9;
}
.our-tools-hero-mark{
    position:relative;
    z-index:1;
    width:clamp(96px,14vw,170px);
    aspect-ratio:1;
    display:grid;
    place-items:center;
    border-radius:28px;
    border:1px solid rgba(255,52,62,.55);
    background:linear-gradient(145deg,rgba(255,30,42,.22),rgba(0,0,0,.5));
    box-shadow:inset 0 0 35px rgba(255,20,30,.12),0 0 38px rgba(255,20,30,.18);
}
.our-tools-hero-mark i{font-size:clamp(2.8rem,7vw,5.2rem);color:#fff;filter:drop-shadow(0 0 22px rgba(255,30,42,.75))}
.our-tools-note{
    display:flex;
    align-items:flex-start;
    gap:.75rem;
    padding:1rem 1.1rem;
    margin:1rem 0 1.35rem;
    border:1px dashed rgba(255,42,52,.42);
    border-radius:16px;
    background:rgba(255,25,36,.055);
    color:rgba(255,255,255,.8);
    line-height:1.7;
}
.our-tools-note i{color:#ff303c;margin-top:.23rem;filter:drop-shadow(0 0 8px rgba(255,35,45,.5))}
.our-tools-grid{display:grid;gap:1.4rem}
.our-tool-card{
    scroll-margin-top:100px;
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(260px,34%) minmax(0,1fr);
    min-height:420px;
    border:1px solid rgba(255,38,50,.38);
    border-radius:24px;
    background:linear-gradient(135deg,rgba(12,12,16,.98),rgba(4,4,6,.99));
    box-shadow:0 22px 65px rgba(0,0,0,.44),0 0 0 1px rgba(255,24,44,.035);
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.our-tool-card:hover{
    transform:translateY(-4px);
    border-color:rgba(255,53,64,.72);
    box-shadow:0 28px 80px rgba(0,0,0,.52),0 0 34px rgba(255,22,35,.13);
}
.our-tool-visual{
    position:relative;
    overflow:hidden;
    display:grid;
    place-items:center;
    min-height:100%;
    padding:2rem;
    border-inline-end:1px solid rgba(255,255,255,.07);
    background:
        radial-gradient(circle at 50% 42%,rgba(255,25,38,.27),transparent 38%),
        linear-gradient(160deg,#09090c,#020203);
}
.our-tool-visual::before,.our-tool-visual::after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border:1px solid rgba(255,40,52,.15);
    transform:rotate(45deg);
}
.our-tool-visual::after{width:300px;height:300px;border-color:rgba(255,255,255,.05)}
.our-tool-visual img{
    position:relative;
    z-index:2;
    width:min(72%,230px);
    height:auto;
    object-fit:contain;
    filter:drop-shadow(0 20px 28px rgba(0,0,0,.55)) drop-shadow(0 0 30px rgba(255,28,42,.28));
}
.our-tool-orbit{
    position:absolute;
    z-index:1;
    width:min(72%,250px);
    aspect-ratio:1;
    border-radius:50%;
    border:1px dashed rgba(255,55,65,.32);
    box-shadow:0 0 45px rgba(255,25,38,.12),inset 0 0 35px rgba(255,25,38,.08);
}
.our-tool-status{
    position:absolute;
    z-index:3;
    inset:auto 1rem 1rem 1rem;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:.5rem;
    padding:.72rem .9rem;
    border:1px solid rgba(255,48,58,.48);
    border-radius:14px;
    background:rgba(4,4,6,.82);
    color:#fff;
    font-size:.82rem;
    font-weight:900;
    backdrop-filter:blur(12px);
}
.our-tool-status i{color:#ff303c}
.our-tool-body{display:flex;flex-direction:column;gap:1rem;padding:clamp(1.35rem,3vw,2.35rem)}
.our-tool-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.our-tool-label{display:block;color:#ff3a46;font-size:.75rem;font-weight:950;letter-spacing:.06em;margin-bottom:.36rem}
.our-tool-heading h3{margin:0;font-size:clamp(1.45rem,2.6vw,2.25rem)}
.our-tool-code{direction:ltr;color:rgba(255,255,255,.28);font-size:.72rem;border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:.35rem .55rem}
.our-tool-tagline{margin:0;color:#fff;font-size:1.02rem;font-weight:850;line-height:1.65}
.our-tool-description{margin:0;color:rgba(255,255,255,.68);line-height:1.8}
.our-tool-platforms{display:flex;flex-wrap:wrap;gap:.55rem}
.our-tool-platforms span{
    display:inline-flex;align-items:center;gap:.42rem;padding:.44rem .7rem;border-radius:999px;
    border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:rgba(255,255,255,.86);font-size:.78rem;font-weight:800
}
.our-tool-platforms i{color:#ff3541}
.our-tool-features{display:grid;gap:.58rem;margin:.1rem 0 0;padding:0;list-style:none}
.our-tool-features li{display:flex;align-items:flex-start;gap:.65rem;padding:.7rem .78rem;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:rgba(255,255,255,.028);color:rgba(255,255,255,.86);line-height:1.55}
.our-tool-features i{color:#ff3541;margin-top:.2rem;filter:drop-shadow(0 0 7px rgba(255,35,48,.45))}
.our-tool-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:auto;padding-top:.35rem}
.our-tool-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:46px}
.our-tool-support-link{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:46px;padding:.7rem 1rem;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.035);color:#fff;font-weight:900}
.our-tool-support-link:hover{border-color:rgba(42,171,238,.65);background:rgba(42,171,238,.1);color:#fff}
.our-tool-support-link i{color:#2aabee}

.service-included-tools{
    padding:.78rem;
    border:1px solid rgba(255,47,58,.28);
    border-radius:15px;
    background:linear-gradient(135deg,rgba(255,26,38,.09),rgba(255,255,255,.02));
}
.service-included-tools-title{display:flex;align-items:center;gap:.48rem;margin-bottom:.6rem;color:#fff;font-size:.79rem;font-weight:950}
.service-included-tools-title i{color:#ff3541;filter:drop-shadow(0 0 8px rgba(255,35,48,.52))}
.service-included-tools-list{display:flex;flex-wrap:wrap;gap:.5rem}
.included-tool-link{
    appearance:none;
    display:inline-flex;
    align-items:center;
    gap:.45rem;
    padding:.52rem .68rem;
    border:1px solid rgba(255,56,67,.38);
    border-radius:11px;
    background:rgba(0,0,0,.34);
    color:#fff;
    font:inherit;
    font-size:.78rem;
    font-weight:900;
    cursor:pointer;
    transition:.2s ease;
}
.included-tool-link:hover{transform:translateY(-1px);border-color:#ff3541;background:rgba(255,35,48,.12);box-shadow:0 0 16px rgba(255,30,43,.12)}
.included-tool-link i:first-child{color:#ff3541}
.included-tool-link i:last-child{font-size:.64rem;color:rgba(255,255,255,.52)}

.bottom-nav-container.has-seven-items{max-width:1020px!important}

@media (max-width:1280px){
    .venom-ref-service-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
    .venom-desktop-menu{gap:7px!important}
    .venom-desktop-menu a{padding-inline:9px!important;font-size:12px!important}
    .rtl-layout .venom-desktop-menu a{font-size:12.5px!important}
}
@media (max-width:1024px){
    .venom-ref-service-tiles{grid-template-columns:1fr}
}
@media (max-width:767px){
    .our-tools-hero{grid-template-columns:1fr;padding:1.3rem;border-radius:19px}
    .our-tools-hero-mark{width:88px;border-radius:22px}
    .our-tool-card{grid-template-columns:1fr;border-radius:19px}
    .our-tool-visual{min-height:285px;border-inline-end:0;border-bottom:1px solid rgba(255,255,255,.07)}
    .our-tool-heading{align-items:flex-start}
    .our-tool-code{display:none}
    .our-tool-actions{display:grid;grid-template-columns:1fr}
    .our-tool-actions .btn,.our-tool-support-link{width:100%}
    .bottom-nav-container.has-seven-items{gap:.12rem!important;padding:.38rem .18rem!important}
    .bottom-nav-container.has-seven-items .bottom-nav-item{min-width:0!important;border-radius:10px!important;padding-inline:0!important}
    .bottom-nav-container.has-seven-items .venom-nav-glyph{width:24px!important;height:24px!important;flex-basis:24px!important}
    .bottom-nav-container.has-seven-items .venom-nav-glyph i{font-size:11px!important}
    .bottom-nav-container.has-seven-items .bottom-nav-label{font-size:.49rem!important;white-space:nowrap;letter-spacing:0!important}
}
@media (max-width:360px){
    .bottom-nav-container.has-seven-items .bottom-nav-label{font-size:.44rem!important}
    .bottom-nav-container.has-seven-items .venom-nav-glyph{width:22px!important;height:22px!important;flex-basis:22px!important}
}

/* ==========================================================================
   VeNoM V27.5 - Detailed tool profiles, screenshot gallery and lightbox
   ========================================================================== */
.our-tool-card.has-gallery{
    grid-template-columns:minmax(360px,44%) minmax(0,1fr);
}
.our-tool-card.has-gallery .our-tool-visual{
    align-items:stretch;
    padding:1rem;
    background:
        radial-gradient(circle at 50% 18%,rgba(255,25,38,.2),transparent 48%),
        linear-gradient(160deg,#09090c,#020203);
}
.our-tool-gallery{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    gap:.72rem;
    width:100%;
    min-width:0;
    padding-bottom:3.5rem;
}
.our-tool-gallery-main{
    appearance:none;
    position:relative;
    overflow:hidden;
    width:100%;
    min-height:300px;
    flex:1 1 auto;
    padding:0;
    border:1px solid rgba(255,49,60,.38);
    border-radius:17px;
    background:#030304;
    cursor:zoom-in;
    box-shadow:0 18px 40px rgba(0,0,0,.42);
}
.our-tool-gallery-main img,
.our-tool-gallery-thumbs img{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    object-fit:cover!important;
    filter:none!important;
}
.our-tool-gallery-main img{
    position:absolute!important;
    inset:0;
    z-index:1!important;
    transition:transform .35s ease,opacity .18s ease;
}
.our-tool-gallery-main:hover img{transform:scale(1.018)}
.our-tool-gallery-zoom{
    position:absolute;
    z-index:3;
    inset:auto .72rem .72rem auto;
    display:inline-flex;
    align-items:center;
    gap:.42rem;
    padding:.48rem .65rem;
    border:1px solid rgba(255,255,255,.14);
    border-radius:10px;
    background:rgba(0,0,0,.72);
    color:#fff;
    font-size:.7rem;
    font-weight:950;
    backdrop-filter:blur(10px);
}
.rtl-layout .our-tool-gallery-zoom{inset:auto auto .72rem .72rem}
.our-tool-gallery-thumbs{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:.5rem;
}
.our-tool-thumb{
    appearance:none;
    overflow:hidden;
    aspect-ratio:1.55/1;
    padding:0;
    border:1px solid rgba(255,255,255,.1);
    border-radius:10px;
    background:#050506;
    opacity:.68;
    cursor:pointer;
    transition:transform .2s ease,border-color .2s ease,opacity .2s ease,box-shadow .2s ease;
}
.our-tool-thumb:hover,
.our-tool-thumb.active{
    opacity:1;
    transform:translateY(-2px);
    border-color:#ff303c;
    box-shadow:0 0 16px rgba(255,35,48,.2);
}
.our-tool-status.is-private{
    border-color:rgba(255,185,45,.55);
    background:linear-gradient(135deg,rgba(65,38,0,.88),rgba(5,5,7,.9));
}
.our-tool-status.is-private i{color:#ffbd35}
.our-tool-feature-heading{
    display:flex;
    align-items:center;
    gap:.52rem;
    margin:.25rem 0 -.25rem;
    color:#fff;
    font-size:.82rem;
    font-weight:950;
    letter-spacing:.03em;
}
.our-tool-feature-heading i{color:#ff3541}
.our-tool-card.has-gallery .our-tool-features{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.our-tool-private-note{
    display:flex;
    align-items:flex-start;
    gap:.75rem;
    padding:1rem;
    border:1px solid rgba(255,190,55,.35);
    border-radius:15px;
    background:
        radial-gradient(circle at 0 0,rgba(255,190,55,.11),transparent 55%),
        rgba(255,255,255,.025);
}
.our-tool-private-note>i{
    color:#ffc247;
    font-size:1.05rem;
    margin-top:.12rem;
    filter:drop-shadow(0 0 9px rgba(255,188,45,.35));
}
.our-tool-private-note strong{
    display:block;
    margin-bottom:.32rem;
    color:#ffd779;
    font-size:.78rem;
    font-weight:950;
}
.our-tool-private-note p{
    margin:0;
    color:rgba(255,255,255,.78);
    line-height:1.75;
}
.our-tool-lightbox{
    position:fixed;
    z-index:10050;
    inset:0;
    display:grid;
    place-items:center;
    padding:clamp(.8rem,3vw,2rem);
    background:rgba(0,0,0,.91);
    backdrop-filter:blur(12px);
}
.our-tool-lightbox.hidden{display:none!important}
.our-tool-lightbox figure{
    display:flex;
    flex-direction:column;
    gap:.65rem;
    width:min(96vw,1550px);
    max-height:92vh;
    margin:0;
}
.our-tool-lightbox img{
    display:block;
    width:100%;
    max-height:84vh;
    object-fit:contain;
    border:1px solid rgba(255,48,58,.46);
    border-radius:16px;
    background:#030304;
    box-shadow:0 30px 90px rgba(0,0,0,.68),0 0 34px rgba(255,25,38,.12);
}
.our-tool-lightbox figcaption{
    color:rgba(255,255,255,.78);
    text-align:center;
    font-size:.86rem;
}
.our-tool-lightbox-close{
    appearance:none;
    position:absolute;
    z-index:2;
    top:max(12px,env(safe-area-inset-top));
    right:max(12px,env(safe-area-inset-right));
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    background:rgba(20,20,23,.86);
    color:#fff;
    font-size:1.15rem;
    cursor:pointer;
}
.rtl-layout .our-tool-lightbox-close{
    right:auto;
    left:max(12px,env(safe-area-inset-left));
}
body.our-tool-lightbox-open{overflow:hidden}

@media (max-width:1100px){
    .our-tool-card.has-gallery{grid-template-columns:minmax(320px,42%) minmax(0,1fr)}
    .our-tool-card.has-gallery .our-tool-features{grid-template-columns:1fr}
}
@media (max-width:767px){
    .our-tool-card.has-gallery{grid-template-columns:1fr}
    .our-tool-card.has-gallery .our-tool-visual{min-height:0;padding:.75rem}
    .our-tool-gallery{padding-bottom:3.6rem}
    .our-tool-gallery-main{min-height:230px;aspect-ratio:1.55/1;flex:none}
    .our-tool-gallery-thumbs{gap:.35rem}
    .our-tool-thumb{border-radius:8px}
    .our-tool-card.has-gallery .our-tool-features{grid-template-columns:1fr}
    .our-tool-lightbox{padding:.55rem}
    .our-tool-lightbox-close{width:40px;height:40px}
}
@media (max-width:420px){
    .our-tool-gallery-main{min-height:205px}
    .our-tool-gallery-zoom{font-size:.62rem;padding:.4rem .52rem}
}


/* ==========================================================================
   VeNoM V27.6 - VeNoM Graphics tool profile
   ========================================================================== */
.our-tool-card.single-gallery-image .our-tool-gallery-main{
    aspect-ratio:4/3;
    min-height:0;
    flex:0 0 auto;
}
.our-tool-card.single-gallery-image .our-tool-gallery-main img{
    object-fit:contain!important;
    background:#020203;
}
.our-tool-card.single-gallery-image .our-tool-gallery{
    justify-content:center;
}
@media (max-width:767px){
    .our-tool-card.single-gallery-image .our-tool-gallery-main{aspect-ratio:4/3;min-height:0}
}