/*
Theme Name: Roja Child
Theme URI: https://rozhavip.com
Description: قالب فرزند رُژا بر پایه Botiga - طراحی اختصاصی فروشگاهی
Author: Roja
Template: botiga
Version: 3.9.24
Text Domain: roja-child
*/

/* ===== استایل‌های رُژا از اینجا شروع می‌شه ===== */

/* رنگ پس‌زمینه هلویی برای کل سایت */
html,
body,
.site,
#page,
.site-content,
#content {
    background-color: #f5cdba !important;
    background-image: none !important;
}

/* کادرها و باکس‌های محتوا سفید */
article:not(.roja-cf-card),
.entry-content,
.widget,
.botiga-container article,
.site-main article {
    background-color: #ffffff !important;
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 16px;
}

/* هدر سفید بمونه */
.site-header,
#masthead,
header.bhfb {
    background-color: #ffffff !important;
}

/* ===== حذف فوتر ===== */
.bhfb-footer,
footer.bhfb,
.site-footer,
#colophon {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}

/* ===== حذف عنوان «خانه» و دکمه ویرایش در صفحه اصلی ===== */
.page .entry-header,
.entry-title,
.page-title,
.post-edit-link {
    display: none !important;
}

/* ===== کادر سفید خالی صفحه اصلی شفاف بشه ===== */
.page .site-main article,
.page article.page,
.page .entry-content,
article.page {
    background-color: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
}

/* ===== مرتب‌سازی هدر Botiga (bhfb) ===== */

/* لوگو وسط‌چین و بزرگ‌تر */
.bhfb-component-logo {
    text-align: center !important;
    margin: 0 auto !important;
    width: 100% !important;
}
.bhfb-component-logo .custom-logo-link,
.bhfb-component-logo .site-branding {
    display: inline-block !important;
    float: none !important;
    text-align: center !important;
}
.bhfb-component-logo .custom-logo {
    width: 110px !important;
    height: auto !important;
    margin: 0 auto !important;
}

/* اسم سایت (رُژا VIP) زیر لوگو وسط */
.bhfb-component-logo .site-title,
.bhfb-component-logo .site-description {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
}

/* ===== حذف همه آیکن‌ها و منوی هدر ===== */
.bhfb-component-woo_icons,
.bhfb-component-search,
.bhfb-component-menu,
.bhfb-component-mobile_hamburger,
#site-header-cart,
.header-item.wc-account-link,
.menu-toggle,
.header-search,
.header-search-form,
.header-search-form-row {
    display: none !important;
}

/* ===== نوار جستجوی رُژا (زیر هدر) ===== */
.roja-search-wrap {
    background-color: transparent;
    padding: 14px;
    margin: 0 0 14px 0;
}

.roja-search-form {
    display: flex;
    align-items: center;
    background-color: transparent;
    border-radius: 14px;
    padding: 12px 16px;
    max-width: 100%;
    box-shadow: none;
}

.roja-search-icon {
    font-size: 17px;
    margin-left: 8px;
    opacity: 0.5;
}

.roja-search-input {
    flex: 1;
    border: none !important;
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    font-size: 15px;
    color: #3a2b2b;
    text-align: right;
    padding: 0 8px;
}

.roja-search-input::placeholder {
    color: #9b8a8a;
    opacity: 1;
}

/* ===== شفاف کردن کادر پشت لوگو و اسم (حذف هدر سفید) ===== */
.site-header,
#masthead,
header.bhfb,
.bhfb-row,
.bhfb-row-wrapper,
.bhfb-column,
.bhfb-component-logo {
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* ===== فونت سفارشی رُژا (تنین) ===== */
@font-face {
    font-family: 'Shabnam';
    src: url('fonts/Shabnam.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* اعمال فونت روی کل سایت */
body,
button,
input,
select,
textarea,
h1, h2, h3, h4, h5, h6,
.site-title,
.menu-item,
.roja-search-input,
p, a, span, div, li {
    font-family: 'Shabnam', Tahoma, sans-serif !important;
}

/* ===== رنگ سفید برای نوشته زیر لوگو (ROZHA VIP) ===== */
.site-title,
.site-title a,
.site-description,
.bhfb-component-logo .site-title,
.bhfb-component-logo .site-title a,
.bhfb-component-logo .site-description {
    color: #ffffff !important;
}

/* ===== لوگوی کوچک داخل کادر جستجو ===== */
.roja-search-logo {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    margin-right: 8px;
    flex-shrink: 0;
    image-rendering: -webkit-optimize-contrast;
}

/* ===== حذف لوگوی وسط و نوشته ROZHA VIP زیرش ===== */
.bhfb-component-logo,
.site-branding,
.site-title,
.site-description,
.custom-logo-link {
    display: none !important;
}

/* ===== اسلایدر بنرهای رُژا (کشویی کلاسیک) ===== */
.roja-cf {
    position: relative;
    width: 100%;
    margin: 0 !important;
    padding: 6px 0 0 0 !important;
    box-sizing: border-box;
    overflow: hidden;
}
.roja-cf-track {
    display: flex;
    flex-direction: row;
    align-items: center;
    transition: transform 0.6s cubic-bezier(.35,.9,.3,1);
    will-change: transform;
}
.roja-cf-item {
    flex: 0 0 80%;
    max-width: 80%;
    margin: 0 6px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: none;
    border: 2px solid #ffffff;
    display: block;
    cursor: pointer;
    background: transparent;
    box-sizing: border-box;
}
.roja-cf-item img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    background: transparent;
    aspect-ratio: 1677 / 938;
}
.roja-cf-item.is-active {
    cursor: default;
}

/* نقطه‌ها — روی بنر */
.roja-dots {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    gap: 6px;
    margin: 0 !important;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(30,12,6,.28);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 5;
}

/* ===== دیوایدر موشن‌دار بین اسلایدر و دسته‌بندی‌ها ===== */
.roja-motion-div {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 16px !important;
    margin: 0 !important;
}
.roja-motion-diamond {
    width: 8px;
    height: 8px;
    background: #a8472b;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-motion-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
}
.roja-motion-line.l::after,
.roja-motion-line.r::after {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 50%;
    background: linear-gradient(90deg, transparent, #a8472b);
}
.roja-motion-line.l::after {
    right: -50%;
    animation: rojaMotionL 2.4s ease-in-out infinite;
}
.roja-motion-line.r::after {
    left: -50%;
    background: linear-gradient(270deg, transparent, #a8472b);
    animation: rojaMotionR 2.4s ease-in-out infinite;
}
@keyframes rojaMotionL { 0%, 100% { right: -50%; } 50% { right: 0%; } }
@keyframes rojaMotionR { 0%, 100% { left: -50%; } 50% { left: 0%; } }

.roja-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #ffffff;
    opacity: 0.6;
    cursor: pointer;
    transition: all 0.3s ease;
}

.roja-dot.active {
    opacity: 1;
    width: 20px;
    border-radius: 4px;
    background-color: #E6005C;
}
/* ===== ردیف دسته‌بندی‌های رُژا (کشویی افقی) ===== */
.roja-cats {
    width: 100%;
    margin: 14px 0 24px 0;
    box-sizing: border-box;
}

.roja-cats-scroll {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    padding: 4px 14px 10px 14px;
    scroll-snap-type: x mandatory;   /* چسبیدن تمیزتر هنگام اسکرول */
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;         /* حرکت نرم کشویی */
    scroll-padding-right: 14px;
}
.roja-cats-scroll::-webkit-scrollbar { display: none; }
.roja-cats-scroll { scrollbar-width: none; }

.roja-cat {
    flex: 0 0 auto;
    /* ۳ تای کامل + لبه‌ی دسته‌ی بعدی پیدا باشه (تشویق به کشیدن) */
    width: calc((100% - 60px) / 3.4);
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    scroll-snap-align: start;
    text-decoration: none;
}

.roja-cat-icon {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.roja-cat-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* ===== کادر متن شیشه‌ای با ته‌رنگ هلویی (glassmorphism) ===== */
.roja-cat-title {
    position: relative;
    width: 100%;
    color: #b5562f;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    padding: 9px 6px;
    border-radius: 13px;
    line-height: 1.4;

    /* همه کادرها هم‌ارتفاع و یک خط */
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;

    /* شیشه‌ی هلویی نیمه‌شفاف */
    background: linear-gradient(135deg,
        rgba(255,255,255,0.55) 0%,
        rgba(255,225,210,0.42) 45%,
        rgba(247,180,154,0.32) 100%);

    /* افکت بلور پشت شیشه */
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);

    /* حاشیه‌ی روشن شیشه‌ای */
    border: 1px solid rgba(255,255,255,0.6);

    /* سایه نرم پشت + هایلایت شیشه‌ای داخل */
    box-shadow:
        0 4px 10px rgba(199,110,75,0.28),       /* سایه نرم پشت */
        inset 0 1px 1px rgba(255,255,255,0.85),  /* برق بالای شیشه */
        inset 0 -3px 6px rgba(247,180,154,0.25); /* عمق پایین */

    text-shadow: 0 1px 1px rgba(255,255,255,0.6);

    white-space: nowrap;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* برق عبوری روی شیشه (مثل عکس) */
.roja-cat-title::before {
    content: "";
    position: absolute;
    top: 0;
    left: -30%;
    width: 45%;
    height: 100%;
    background: linear-gradient(120deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.45) 50%,
        rgba(255,255,255,0) 100%);
    transform: skewX(-18deg);
    pointer-events: none;
}



/* ============================================= */
/* =====   هدر جدید رُژا (نسخه ۱.۷.۰)     ===== */
/* ============================================= */

/* ظرف کلی هدر */
/* ===== هدر رُژا — نسخه ۲.۱ (شناور) ===== */
.roja-header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 9990;
    width: 100%;
    padding: 12px 14px;
    box-sizing: border-box;
    overflow: visible;
    background: linear-gradient(180deg, #f7d3c1 0%, #f3c4ae 100%);
    transition: box-shadow .25s ease, background .25s ease;
}
.roja-header.roja-stuck {
    box-shadow: 0 6px 18px rgba(161,91,67,.16);
    background: linear-gradient(180deg, #f8d8c7 0%, #f4c8b2 100%);
}
.roja-header img { max-width: 100% !important; height: auto !important; }
.roja-header .roja-bar {
    position: relative; z-index: 2;
    display: flex; align-items: center; gap: 11px;
    direction: rtl;
}
.roja-header .roja-menu-btn {
    order: 1; flex-shrink: 0;
    width: 54px; height: 50px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 16px;
    background: rgba(255,250,247,0.9);
    box-shadow: 0 4px 14px rgba(161,91,67,.10), inset 0 1px 0 rgba(255,255,255,.7);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    text-decoration: none; border: none;
}
.roja-header .roja-menu-btn svg { width: 25px; height: 25px; }
.roja-header .roja-search-bar-wrap {
    order: 2; position: relative; z-index: 2; flex: 1;
    display: flex; align-items: center; direction: rtl;
    height: 50px;
    background: rgba(255,250,247,0.9);
    border: none; border-radius: 16px;
    box-shadow: 0 4px 14px rgba(161,91,67,.10), inset 0 1px 0 rgba(255,255,255,.7);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.roja-header .roja-search-form {
    position: relative; flex: 1;
    display: flex; align-items: center; direction: rtl;
    height: 100%; padding: 0 14px;
}
.roja-header .roja-search-form input[type="search"] {
    flex: 1; border: none !important; background: transparent !important;
    outline: none !important; box-shadow: none !important;
    font-size: 14px; color: #8a5a3e; text-align: right;
    padding: 0; direction: rtl; height: 100%;
}
.roja-header .roja-search-form input[type="search"]::placeholder { color: transparent; }
.roja-header .roja-logo-wrap {
    order: 3; position: relative; z-index: 2; flex-shrink: 0;
    display: flex; align-items: center; margin: 0;
}
.roja-header .roja-logo-shine-box { position: relative; display: inline-block; }
.roja-header .roja-logo-shine-box .roja-logo-img {
    height: 40px !important; width: auto !important;
    max-width: none !important; display: block !important;
}
.roja-header .roja-logo-shine {
    position: absolute; inset: 0; pointer-events: none;
    -webkit-mask-size: contain; mask-size: contain;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center; mask-position: center;
    background: linear-gradient(100deg, transparent 42%, rgba(255,255,255,.95) 50%, transparent 58%);
    background-size: 300% 100%;
    animation: rojaShine 63s linear infinite;
}
@keyframes rojaShine {
    0% { background-position: 160% 0; }
    4.8% { background-position: -60% 0; }
    100% { background-position: -60% 0; }
}

/* نوار جستجوی قدیمی مخفی */
.roja-search-wrap {
    display: none !important;
}

/* ===== ردیف مزایا (کادر یکپارچه با خط جداکننده) ===== */
.roja-features {
    width: 100%;
    padding: 4px 14px 8px 14px;
    box-sizing: border-box;
    margin: 10px 0 20px 0;
}
.roja-features-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: #fdeee7;
    border-radius: 18px;
    padding: 16px 6px;
}
.roja-feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 4px 6px;
    position: relative;
}
/* خط جداکننده عمودی بین آیتم‌ها (نه روی اولی) */
.roja-feature:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 0;
    top: 14%;
    height: 72%;
    width: 1px;
    background: rgba(160,110,90,0.18);
}
.roja-feature-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.roja-feature-icon svg {
    width: 30px !important;
    height: 30px !important;
}
.roja-feature-title {
    color: #8a4a2a;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
}
.roja-feature-sub {
    color: #b08a78;
    font-size: 9px;
    font-weight: 500;
    line-height: 1.3;
}

/* ===== ردیف محصولات پرفروش (شیشه‌ای هلویی) ===== */
.roja-products {
    width: 100%;
    box-sizing: border-box;
    margin: 8px 0 18px 0;
}
.roja-products-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 22px 16px 22px 16px;
}
.roja-products-title {
    color: #8a4a2a;
    font-size: 16px;
    font-weight: 800;
    white-space: nowrap;
    flex-shrink: 0;
}
.roja-title-diamond {
    width: 8px;
    height: 8px;
    background: #a85a32;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-title-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(to left, #a85a32, #e3a98e, transparent);
}
.roja-products-scroll {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding: 4px 14px 12px 14px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scroll-padding-right: 14px;
}
.roja-products-scroll::-webkit-scrollbar { display: none; }
.roja-products-scroll { scrollbar-width: none; }

.roja-product {
    flex: 0 0 auto;
    width: calc((100% - 44px) / 2.4);
    display: flex;
    flex-direction: column;
    gap: 9px;
    scroll-snap-align: start;
    background: rgba(255,238,230,0.55);
    border: 1px solid rgba(255,255,255,0.6);
    border-radius: 18px;
    padding: 9px;
    box-shadow: 0 8px 22px rgba(161,91,67,.07), inset 0 1px 0 rgba(255,255,255,.6);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.roja-product-link {
    display: flex;
    flex-direction: column;
    gap: 9px;
    text-decoration: none;
}
.roja-product-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.roja-product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.roja-product-name {
    color: #3a2a22;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 34px;
}
.roja-product-price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    color: #b5562f;
}
.roja-price-num {
    font-size: 14px;
    font-weight: 800;
}
.roja-toman {
    font-size: 10px;
    font-weight: 600;
    opacity: 0.8;
}
.roja-add-cart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: linear-gradient(135deg, #c96a3f, #b5562f);
    color: #fff !important;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    border-radius: 12px;
    padding: 9px 6px;
    box-shadow: 0 6px 14px rgba(181,86,47,.25);
}
.roja-add-cart span { color: #fff !important; }
.roja-add-cart svg {
    width: 16px !important;
    height: 16px !important;
}
.roja-add-cart:active {
    opacity: 0.85;
}

/* متن جستجو + سه‌نقطه انیمیت */
.roja-header .roja-search-form { position: relative; }
.roja-header .roja-ph {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    direction: rtl;
    pointer-events: none;
}
.roja-header .roja-ph .roja-icon-search {
    width: 17px; height: 17px; flex-shrink: 0; opacity: .8;
}
.roja-header .roja-ph .roja-ph-txt {
    display: inline-flex; align-items: center; direction: rtl;
    color: #b98a72; font-size: 13px; font-weight: 600; line-height: 1;
}
.roja-header .roja-ph-dots { display: inline-flex; margin-right: 2px; }
.roja-header .roja-ph-dots i {
    font-style: normal; opacity: 0; width: 4px; font-size: 12px;
    text-align: center; animation: rojaPhDots 2.4s ease-in-out infinite;
}
.roja-header .roja-ph-dots i:nth-child(1){ animation-delay: 0s; }
.roja-header .roja-ph-dots i:nth-child(2){ animation-delay: .4s; }
.roja-header .roja-ph-dots i:nth-child(3){ animation-delay: .8s; }
@keyframes rojaPhDots { 0%{opacity:0} 20%{opacity:1} 80%{opacity:1} 100%{opacity:0} }
.roja-header .roja-search-form input[type="search"]:not(:placeholder-shown) + .roja-ph { display: none; }

/* ===== فونت تنین ===== */
@font-face {
    font-family: 'Tanin';
    src: url('fonts/W_tanin.ttf') format('truetype');
    font-display: swap;
}

/* ===== خط تزئینی بالای برگه افتتاح ===== */
.roja-branch-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px 22px 16px;
}
.roja-branch-diamond {
    width: 8px;
    height: 8px;
    background: #a85a32;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-branch-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(to left, #a85a32, #e3a98e, transparent);
}

/* ===== بنر افتتاح شعبه ===== */
.roja-branch-wrap {
    display: flex;
    justify-content: center;
    padding: 14px 18px 8px 18px;
}
.roja-branch-banner {
    position: relative;
    width: 80%;
    max-width: 300px;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: none;
    animation: rojaBnIn 1s ease-out forwards, rojaBnFloat 4s ease-in-out infinite 1s;
}
.roja-branch-banner img {
    width: 100%;
    display: block;
}
.roja-branch-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.6) 50%, transparent 70%);
    transform: translateX(-120%);
    animation: rojaBnShine 1.1s ease-out .3s;
    pointer-events: none;
}
@keyframes rojaBnIn { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: scale(1); } }
@keyframes rojaBnShine { to { transform: translateX(120%); } }
@keyframes rojaBnFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* ===== ریزه‌کاری حرفه‌ای ===== */
.roja-product { transition: transform .2s ease, box-shadow .2s ease; }
.roja-product:active { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(161,91,67,.16); }
.roja-add-cart { transition: transform .15s ease, opacity .15s ease; }
.roja-add-cart:active { transform: scale(.96); }
.roja-cat { transition: transform .2s ease; }
.roja-cat:active { transform: scale(.96); }

/* ===== بهینه‌سازی روانی اسکرول ===== */
html { scroll-behavior: smooth; -webkit-overflow-scrolling: touch; }
.roja-search-bar-wrap::before,
.roja-branch-banner,
.roja-ph-dots i,
.roja-cf-card { will-change: transform; }
* { -webkit-tap-highlight-color: transparent; }

/* ===== گرید برندها ===== */
.roja-brands-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 22px 16px 20px 16px;
}
.roja-brands-title {
    color: #8a4a2a;
    font-size: 16px;
    font-weight: 800;
    white-space: nowrap;
    flex-shrink: 0;
}
.roja-brands-diamond {
    width: 8px;
    height: 8px;
    background: #a85a32;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-brands-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(to left, #a85a32, #e3a98e, transparent);
}
.roja-brands-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 16px 30px 16px;
}
.roja-brand-item {
    background: rgba(255,255,255,.7);
    border-radius: 14px;
    border-bottom: 3px solid #c17a52;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    box-shadow: 0 6px 14px rgba(161,91,67,.08);
}
.roja-brand-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.roja-brand-item:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

/* ===== بنرهای استریپ (نوار متحرک) ===== */
@font-face {
    font-family: 'DigiLalezar';
    src: url('fonts/Digi_Lalezar_Plus.ttf') format('truetype');
    font-display: swap;
}
.roja-strip-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 16px 18px 16px;
}
.roja-strip-diamond {
    width: 8px;
    height: 8px;
    background: #a85a32;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-strip-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(to left, #a85a32, #e3a98e, transparent);
}
.roja-marquee-stage {
    padding: 0 16px 18px 16px;
}
.roja-marquee-bar {
    position: relative;
    overflow: hidden;
    height: 80px;
    border-radius: 26px;
    border: 1.5px solid rgba(255,255,255,.55);
    background: linear-gradient(90deg, #ff8d66, #ffac90 44%, #ffd7c7);
    box-shadow: inset 0 2px 8px rgba(255,255,255,.5), 0 14px 28px rgba(168,71,43,.30);
}
.roja-marquee-track {
    direction: ltr;
    position: relative;
    display: flex;
    width: max-content;
    height: 100%;
    align-items: center;
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    animation: rojaMarqueeMove 16s linear infinite;
}
.roja-marquee-set {
    display: flex;
    align-items: center;
    height: 100%;
    flex: 0 0 auto;
}
@keyframes rojaMarqueeMove {
    from { transform: translateX(0); }
    to { transform: translateX(50%); }
}
.roja-marquee-item {
    direction: rtl;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
    color: #fff;
    text-shadow: 0 2px 9px rgba(103,39,20,.28);
    padding: 8px 12px 8px 18px;
    margin-left: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.25);
}
.roja-marquee-text {
    font-family: 'DigiLalezar', 'Shabnam', Tahoma, sans-serif !important;
    font-size: 24px;
    line-height: 1;
}
.roja-marquee-thumb {
    flex: 0 0 auto;
    width: 50px;
    height: 50px;
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255,255,255,.34);
    border: 1px solid rgba(255,255,255,.45);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.64), 0 7px 16px rgba(116,46,24,.13);
    }
.roja-marquee-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.roja-marquee-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 0 12px rgba(255,255,255,.95);
    margin-left: 18px;
    flex: 0 0 auto;
}
@media (max-width: 760px) {
    .roja-marquee-bar { height: 68px; border-radius: 19px; }
    .roja-marquee-text { font-size: 19px; }
    .roja-marquee-thumb { width: 42px; height: 42px; border-radius: 13px; }
}

/* ===== تایمر جشنواره ===== */
.roja-timer-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 16px 18px 16px;
}
.roja-timer-diamond {
    width: 8px;
    height: 8px;
    background: #a85a32;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-timer-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(to left, #a85a32, #e3a98e, transparent);
}
.roja-timer {
    margin: 0 16px;
    background: rgba(255,255,255,.6);
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 20px;
    padding: 18px;
    text-align: center;
    box-shadow: 0 10px 24px rgba(161,91,67,.14);
}
.roja-timer-ti {
    font-family: 'DigiLalezar', 'Shabnam', Tahoma, sans-serif !important;
    color: #a8472b;
    font-size: 15px;
    margin-bottom: 12px;
}
.roja-timer-bx {
    display: flex;
    justify-content: center;
    gap: 10px;
    direction: ltr;
}
.roja-timer-u {
    background: linear-gradient(135deg, #c17a52, #a8472b);
    border-radius: 14px;
    min-width: 64px;
    padding: 12px 8px;
    color: #fff;
}
.roja-timer-n {
    font-family: 'DigiLalezar', 'Shabnam', Tahoma, sans-serif !important;
    font-size: 30px;
    line-height: 1;
    color: #fff;
}
.roja-timer-c {
    font-family: 'DigiLalezar', 'Shabnam', Tahoma, sans-serif !important;
    font-size: 11px;
    opacity: .85;
    margin-top: 4px;
    color: #fff;
}

/* ===== محصولات تخفیف‌دار ===== */
.roja-sale-prods {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 24px 16px 14px 16px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.roja-sale-prods::-webkit-scrollbar { display: none; }
.roja-sale-card {
    flex: 0 0 150px;
    background: rgba(255,255,255,.6);
    border-radius: 16px;
    padding: 12px;
    box-shadow: 0 6px 16px rgba(161,91,67,.1);
    position: relative;
    display: flex;
    flex-direction: column;
}
.roja-sale-link {
    text-decoration: none;
    display: block;
}
.roja-sale-imgw {
    position: relative;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.roja-sale-imgw img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.roja-sale-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    background: #d6422a;
    color: #fff;
    font-family: 'DigiLalezar', 'Shabnam', Tahoma, sans-serif !important;
    font-size: 11px;
    padding: 5px 9px;
    border-radius: 8px;
    transform: rotate(8deg);
    box-shadow: 0 3px 8px rgba(214,66,42,.4);
    z-index: 2;
}
.roja-sale-nm {
    color: #5a3324;
    font-size: 13px;
    margin-top: 10px;
    line-height: 1.5;
    height: 40px;
    overflow: hidden;
}
.roja-sale-pr {
    margin-top: 8px;
    color: #a8472b;
    font-size: 14px;
    min-height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
}
.roja-sale-pr del {
    opacity: 1;
    font-size: 12px;
    color: #bbb;
    text-decoration: line-through;
    text-decoration-color: #d6422a;
}
.roja-sale-pr ins {
    text-decoration: none;
    color: #c0392b;
    font-weight: bold;
    font-size: 18px;
    margin-top: 2px;
    background: none !important;
    box-shadow: none !important;
    border: none !important;
}
.roja-sale-pr ins .woocommerce-Price-amount,
.roja-sale-pr ins bdi,
.roja-sale-pr del .woocommerce-Price-amount,
.roja-sale-pr del bdi {
    background: none !important;
    box-shadow: none !important;
    border: none !important;
}
.roja-sale-cart {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #a8472b;
    color: #fff !important;
    border-radius: 12px;
    padding: 9px 8px;
    font-size: 13px;
    text-decoration: none;
    font-family: 'DigiLalezar', 'Shabnam', Tahoma, sans-serif !important;
    transition: background .2s, transform .1s;
}
.roja-sale-cart:hover { background: #8a3a22; }
.roja-sale-cart:active { transform: scale(.96); }
.roja-sale-cart svg { flex: 0 0 auto; }

/* ===== دیوایدر لوزی زیر محصولات ===== */
.roja-sale2-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px 12px 16px !important;
    margin: 0 !important;
}
#rojaCF2 {
    margin-top: 0 !important;
    margin-bottom: 28px !important;
    padding: 10px 0 0 0 !important;
}
.roja-sale2-diamond {
    width: 8px;
    height: 8px;
    background: #a85a32;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.roja-sale2-line {
    flex: 1;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(to left, #a85a32, #e3a98e, transparent);
}


/* ===== حذف قطعی هاله‌های رنگی بکگراند (غلبه بر هر منبع دیگر) ===== */
html {
    background: #f2bda4 !important;
}
html body {
    background-color: #e8ac8f !important;
    background-image: linear-gradient(135deg, #f5cdba 0%, #e8ac8f 100%) !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
}
html body #page,
html body .site,
html body .site-content,
html body #content {
    background: transparent !important;
}
html body .roja-header {
    background: linear-gradient(180deg, #f7d3c1 0%, #f3c4ae 100%) !important;
}
html body .roja-header.roja-stuck {
    background: linear-gradient(180deg, #f8d8c7 0%, #f4c8b2 100%) !important;
}

.back-to-top,
.back-to-top a {
    background: linear-gradient(135deg, #c17a52, #a8622f) !important;
    color: #fff !important;
    border: none !important;
}
.back-to-top svg,
.back-to-top i,
.back-to-top path {
    fill: #fff !important;
    stroke: #fff !important;
    color: #fff !important;
}

/* ===== دکمه برو-بالا قهوه‌ای ===== */
#scroll-to-top,
.scroll-to-top,
a#scroll-to-top,
.botiga-scroll-top,
#botiga-scroll-top {
    background: linear-gradient(135deg, #c17a52, #a8622f) !important;
    color: #fff !important;
    border: none !important;
}
#scroll-to-top svg,
.scroll-to-top svg,
.botiga-scroll-top svg,
#botiga-scroll-top svg,
#scroll-to-top path,
.scroll-to-top path {
    fill: #fff !important;
    stroke: #fff !important;
    color: #fff !important;
}

/* ═══════════════════════════════════════════════
   نسبت ثابت بنرها
   ═══════════════════════════════════════════════ */
.roja-cf:not(#rojaCF2) .roja-cf-item img {
    aspect-ratio: 1677 / 938 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: auto !important;
}
#rojaCF2 .roja-cf-item img {
    aspect-ratio: 2 / 1 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: auto !important;
}

/* حذف بخش‌های کنارگذاشته‌شده */
.roja-motion-div,
.roja-strip,
.roja-strip-head,
.roja-strip-wrap,
.roja-timer,
.roja-timer-head,
.roja-timer-wrap,
.roja-sale2,
.roja-sale2-head,
.roja-branch-head,
.roja-marquee,
.roja-features {
    display: none !important;
}

.roja-cf {
    margin-top: 0 !important;
    padding-top: 6px !important;
}

/* ═══════════════════════════════════════════════
   تیتر یکپارچه بخش‌ها
   ═══════════════════════════════════════════════ */
.roja-sec-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    direction: rtl;
    gap: 10px;
    padding: 22px 16px 16px 16px;
    flex-wrap: wrap;
}
.roja-sec-title {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding-right: 12px;
    font-size: 16px;
    font-weight: 800;
    color: #6E3B24 !important;
    white-space: nowrap;
    flex-shrink: 0;
}
.roja-sec-title::before {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 20px;
    border-radius: 3px;
    background: #6E3B24;
}
.roja-sec-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 11px;
    border-radius: 999px;
    background: linear-gradient(135deg, #e8447a, #c9295c);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
    box-shadow: 0 3px 10px rgba(201,41,92,.32);
    animation: rojaBadgePulse 2.6s ease-in-out infinite;
}
.roja-sec-badge::before {
    content: "٪";
    font-size: 12px;
    font-weight: 900;
    opacity: .9;
}
@keyframes rojaBadgePulse {
    0%, 100% { transform: scale(1); box-shadow: 0 3px 10px rgba(201,41,92,.32); }
    50%      { transform: scale(1.05); box-shadow: 0 4px 14px rgba(201,41,92,.48); }
}
.roja-sec-more {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    color: #a8623a !important;
    text-decoration: none !important;
    white-space: nowrap;
    flex-shrink: 0;
}
.roja-sec-more:hover { opacity: .75; }
.roja-sec-arw { font-size: 13px; line-height: 1; }

.roja-cats {
    margin-top: 14px !important;
    padding-top: 0 !important;
}
.roja-cat-row { margin-top: 8px !important; }
.roja-branch-wrap { margin-top: 22px !important; }
.roja-brands { margin-top: 8px !important; }
#rojaCF2 { margin-top: 18px !important; }

/* ═══════════════════════════════════════════════
   ═══  فوتر رُژا — شب نئونی  ═══
   ═══════════════════════════════════════════════ */
.roja-footer {
    position: relative;
    background: linear-gradient(165deg, #5a2e1b 0%, #3a1d10 100%);
    border-radius: 30px 30px 0 0;
    padding: 28px 20px 22px;
    margin-top: 14px;
    overflow: hidden;
}
/* هاله‌های نئون متحرک */
.roja-footer::before,
.roja-footer::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(42px);
    pointer-events: none;
}
.roja-footer::before {
    width: 220px; height: 220px;
    top: -70px; right: -50px;
    background: radial-gradient(circle, rgba(232,68,122,.55), transparent 70%);
    animation: rfGlow1 7s ease-in-out infinite;
}
.roja-footer::after {
    width: 200px; height: 200px;
    bottom: -60px; left: -40px;
    background: radial-gradient(circle, rgba(217,155,118,.5), transparent 70%);
    animation: rfGlow2 8.5s ease-in-out infinite;
}
@keyframes rfGlow1 {
    0%,100% { transform: translate(0,0) scale(1); opacity:.75; }
    50%     { transform: translate(-26px,22px) scale(1.18); opacity:1; }
}
@keyframes rfGlow2 {
    0%,100% { transform: translate(0,0) scale(1); opacity:.7; }
    50%     { transform: translate(24px,-20px) scale(1.15); opacity:.95; }
}
.roja-footer > * { position: relative; z-index: 1; }

/* --- ردیف بالا --- */
.roja-footer .rf-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(245,205,186,.16);
}
.roja-footer .rf-logo img {
    height: 44px !important;
    width: auto !important;
    max-width: none !important;
    display: block !important;
}
.roja-footer .rf-social { display: flex; gap: 8px; }
.roja-footer .rf-social a {
    width: 38px; height: 38px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 11px;
    background: rgba(245,205,186,.1);
    border: 1px solid rgba(245,205,186,.24);
    animation: rfPulse 3s ease-in-out infinite;
    text-decoration: none;
}
.roja-footer .rf-social a:nth-child(2) { animation-delay: .6s; }
.roja-footer .rf-social a:nth-child(3) { animation-delay: 1.2s; }
@keyframes rfPulse {
    0%,100% { box-shadow: 0 0 0 rgba(232,68,122,0); }
    50%     { box-shadow: 0 0 16px rgba(232,68,122,.55); border-color: rgba(232,68,122,.5); }
}
.roja-footer .rf-social a svg { width: 18px; height: 18px; stroke: #f5cdba; fill: none; }

/* --- لینک‌ها --- */
.roja-footer .rf-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 18px;
}
.roja-footer .rf-col h4 {
    color: #f5cdba;
    font-size: 12.5px;
    font-weight: 800;
    margin: 0 0 10px 0;
    padding-right: 9px;
    position: relative;
}
.roja-footer .rf-col h4::before {
    content: "";
    position: absolute;
    right: 0; top: 50%;
    transform: translateY(-50%);
    width: 3px; height: 13px;
    border-radius: 2px;
    background: #e8447a;
    box-shadow: 0 0 8px rgba(232,68,122,.9);
    animation: rfBar 2.4s ease-in-out infinite;
}
.roja-footer .rf-col:nth-child(2) h4::before { animation-delay: 1.2s; }
@keyframes rfBar {
    0%,100% { box-shadow: 0 0 6px rgba(232,68,122,.6); }
    50%     { box-shadow: 0 0 14px rgba(232,68,122,1); }
}
.roja-footer .rf-col a {
    display: block;
    color: rgba(245,205,186,.7) !important;
    text-decoration: none !important;
    font-size: 11.5px;
    font-weight: 600;
    padding: 5px 0;
}

/* --- تماس --- */
.roja-footer .rf-contact {
    background: rgba(245,205,186,.07);
    border: 1px solid rgba(245,205,186,.13);
    border-radius: 14px;
    padding: 13px;
    margin-bottom: 18px;
}
.roja-footer .rf-row {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 5px 0;
    color: rgba(245,205,186,.85);
    font-size: 11.5px;
    font-weight: 600;
}
.roja-footer .rf-row svg { width: 14px; height: 14px; stroke: #e8a87c; flex-shrink: 0; }
.roja-footer .rf-row a {
    color: rgba(245,205,186,.85) !important;
    text-decoration: none !important;
    direction: ltr;
}

/* --- کادر مزایا (آخر) --- */
.roja-footer .rf-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: rgba(245,205,186,.07);
    border: 1px solid rgba(245,205,186,.15);
    border-radius: 16px;
    padding: 16px 4px;
    margin-bottom: 4px;
}
.roja-footer .rf-feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    padding: 0 6px;
    position: relative;
}
.roja-footer .rf-feature:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 0; top: 50%;
    transform: translateY(-50%);
    width: 1px; height: 62%;
    background: rgba(245,205,186,.18);
}
.roja-footer .rf-feature svg {
    width: 26px; height: 26px;
    stroke: #e8a87c;
    fill: none;
    animation: rfIcon 3.4s ease-in-out infinite;
}
.roja-footer .rf-feature:nth-child(2) svg { animation-delay: 1.1s; }
.roja-footer .rf-feature:nth-child(3) svg { animation-delay: 2.2s; }
@keyframes rfIcon {
    0%,100% { filter: drop-shadow(0 0 4px rgba(232,68,122,.3)); transform: scale(1); }
    50%     { filter: drop-shadow(0 0 10px rgba(232,68,122,.75)); transform: scale(1.08); }
}
.roja-footer .rf-feature-title {
    color: #f5cdba;
    font-size: 11.5px;
    font-weight: 800;
    white-space: nowrap;
}
.roja-footer .rf-feature-sub {
    color: rgba(245,205,186,.55);
    font-size: 9.5px;
    font-weight: 600;
    line-height: 1.5;
}

/* --- کپی‌رایت --- */
.roja-footer .rf-copy {
    text-align: center;
    color: rgba(245,205,186,.42);
    font-size: 10px;
    font-weight: 600;
    padding-top: 16px;
    margin-top: 14px;
    border-top: 1px solid rgba(245,205,186,.12);
}


/* ═══════════════════════════════════════════════
   فوتر بچسبد زیر برندها (بدون فاصله)
   ═══════════════════════════════════════════════ */
body.home .site-footer,
body.home footer.site-footer,
body.home #colophon,
body.home .footer-widgets,
body.home .footer-bar,
body.home .site-info,
body.home .botiga-footer {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}
body.home .roja-brands {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
body.home .roja-brands-grid {
    padding-bottom: 12px !important;
    margin-bottom: 0 !important;
}
.roja-footer { margin-bottom: 0 !important; }


/* ═══════════════════════════════════════════════
   ═══  «چرا رُژا؟» — نوار گرادیانی (کشیده)  ═══
   ═══════════════════════════════════════════════ */
.roja-why {
    padding: 10px 12px 0 12px;
    direction: rtl;
}
.roja-why-card {
    position: relative;
    background: linear-gradient(160deg, #fffaf6, #fdeee4);
    border: 1.5px solid #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 6px 26px rgba(161,91,67,.13);
}

/* نوار گرادیانی بالای کارت */
.roja-why-ribbon {
    position: relative;
    background: linear-gradient(120deg, #e8447a, #c9295c);
    padding: 20px 22px;
    display: flex;
    align-items: center;
    gap: 12px;
    overflow: hidden;
}
.roja-why-ribbon::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 40%, rgba(255,255,255,.28) 50%, transparent 60%);
    background-size: 220% 100%;
    animation: rojaWhySweep 4s ease-in-out infinite;
}
@keyframes rojaWhySweep {
    0%   { background-position: 130% 0; }
    45%  { background-position: -60% 0; }
    100% { background-position: -60% 0; }
}
.roja-why-ribbon svg {
    width: 28px;
    height: 28px;
    fill: #fff;
    stroke: none;
    z-index: 1;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.15));
    animation: rojaWhyBeat 2.6s ease-in-out infinite;
}
@keyframes rojaWhyBeat {
    0%,100% { transform: scale(1); }
    15%     { transform: scale(1.18); }
    30%     { transform: scale(1); }
    45%     { transform: scale(1.12); }
}
.roja-why-ribbon h3 {
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 19px;
    font-weight: 800;
    z-index: 1;
}

/* بدنه — کشیده‌تر */
.roja-why-body {
    padding: 22px 22px 26px;
}
.roja-why-lead {
    margin: 0 0 12px 0 !important;
    color: #c9295c !important;
    font-size: 14px;
    font-weight: 800;
    text-align: center;
}
.roja-why-body p:not(.roja-why-lead) {
    margin: 0 !important;
    color: #8a5a3e !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 2.5;
    text-align: justify;
}

/* حباب‌های تزئینی */
.roja-why-bubbles {
    position: absolute;
    top: 0;
    left: 0;
    width: 140px;
    height: 100%;
    pointer-events: none;
    opacity: .5;
    z-index: 0;
}
.roja-why-bubbles span {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(232,68,122,.28), transparent 70%);
    animation: rojaWhyFloat 7s ease-in-out infinite;
}
.roja-why-bubbles span:nth-child(1) { width: 64px; height: 64px; top: 90px; left: 12px; }
.roja-why-bubbles span:nth-child(2) { width: 38px; height: 38px; top: 150px; left: 78px; animation-delay: 2s; }
.roja-why-bubbles span:nth-child(3) { width: 48px; height: 48px; top: 220px; left: 20px; animation-delay: 4s; }
@keyframes rojaWhyFloat {
    0%,100% { transform: translateY(0); opacity: .5; }
    50%     { transform: translateY(-16px); opacity: .9; }
}
.roja-why-body { position: relative; z-index: 1; }
/* فاصله کوچک بین «چرا رُژا» و فوتر */
.roja-why { margin-bottom: 0 !important; }
body.home .roja-footer { margin-top: 24px !important; }