/*
  ==============================================
  styles.css - Final & Optimized Version
  ==============================================
*/

@font-face{font-family:'Shabnam';src:url(../fonts/Shabnam-FD.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Shabnam';src:url(../fonts/Shabnam-Bold-FD.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
    --color-primary:#e74c3c;
    --color-primary-dark:#c0392b;
    --color-secondary:#27ae60;
    --color-text:#34495e;
    --color-text-light:#7f8c8d;
    --color-body:#f9f9f9;
    --color-container:#ffffff;
    --color-border:#ecf0f1;
    --color-gray:#bdc3c7;
    
    --font-family-base:'Shabnam', sans-serif;

    --font-size-h1:clamp(2.5rem, 6vw, 3.5rem);
    --font-size-h2:clamp(1.5rem, 4vw, 1.75rem);
    --font-size-h3:clamp(1.1rem, 3vw, 1.25rem);
    --font-size-base:clamp(1rem, 2.5vw, 1.05rem);
    --font-size-small:0.875rem;

    --font-weight-normal:400;
    --font-weight-bold:700;

    --spacing-unit:1rem;
    --header-height:4.5rem;
    --border-radius:0.5rem;
    --box-shadow:0 4px 12px hsla(0, 0%, 20%, 0.1);
    --transition-speed:0.3s ease;

    --z-modal:1000;
    --z-header:100
}

/* Base and Reset Styles */
*,*::before,*::after{box-sizing:border-box;padding:0;margin:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);background-color:var(--color-body);color:var(--color-text);line-height:1.7}
h1,h2,h3{font-weight:var(--font-weight-bold);line-height:1.3}
a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-speed)}
a:hover{color:var(--color-primary-dark)}
img{max-width:100%;height:auto;display:block}
button{font-family:var(--font-family-base);cursor:pointer}
::selection{background-color:var(--color-primary);color:var(--color-container)}
::-webkit-scrollbar{width:8px;background-color:var(--color-border)}
::-webkit-scrollbar-thumb{background-color:var(--color-gray);border-radius:4px}

/* Accessibility Improvement */
:focus-visible{outline:none;box-shadow:0 0 0 3px hsl(207 22% 63% / .6);border-radius:2px}

/* Utility Classes */
.section{padding-block:clamp(3rem, 8vw, 6rem)}
.section__title{font-size:var(--font-size-h2);margin-bottom:calc(var(--spacing-unit) * 2)}
.text-center{text-align:center}
.container{max-width:1120px;padding-inline:calc(var(--spacing-unit) * 1.5);margin-inline:auto}
.grid{display:grid;gap:calc(var(--spacing-unit) * 1.5)}
.button{display:inline-block;background-color:var(--color-primary);color:var(--color-container);padding:.9rem 1.8rem;border-radius:var(--border-radius);font-weight:var(--font-weight-bold);border:none;transition:background-color var(--transition-speed),transform var(--transition-speed)}
.button:hover{background-color:var(--color-primary-dark);transform:translateY(-2px);color:var(--color-container)}

/* Header & Navigation */
.header{position:fixed;top:0;left:0;width:100%;background-color:hsl(0 0% 100% / .8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:var(--z-header);transition:box-shadow var(--transition-speed)}
.header--scrolled{box-shadow:var(--box-shadow)}
.nav{height:var(--header-height);display:flex;justify-content:space-between;align-items:center}
.nav__logo{color:var(--color-text);font-weight:var(--font-weight-bold);font-size:1.25rem}
.nav__actions{display:flex;align-items:center;gap:.5rem}
.nav__action-btn{background:none;border:none;position:relative;padding:.5rem}
.nav__action-btn svg,.nav__toggle svg,.nav__close svg{width:26px;height:26px;fill:var(--color-text);transition:fill var(--transition-speed)}
.nav__action-btn:hover svg,.nav__toggle:hover svg,.nav__close:hover svg{fill:var(--color-primary)}
.cart-counter{position:absolute;top:-5px;right:-5px;background-color:var(--color-primary);color:#fff;font-size:.75rem;width:18px;height:18px;border-radius:50%;display:none;justify-content:center;align-items:center;font-weight:var(--font-weight-bold);transition:transform 0.2s}
.cart-counter.pop{transform:scale(1.3)}
.nav__link{color:var(--color-text-light);font-weight:var(--font-weight-bold);position:relative;padding-block:.5rem}
.nav__link.active-link,.nav__link:hover{color:var(--color-primary)}
.nav__link.active-link::after{content:'';position:absolute;bottom:0;right:0;width:100%;height:2px;background-color:var(--color-primary)}
.nav__toggle{display:none;background:none;border:none}

@media (max-width:767px){
    .nav__menu{position:fixed;top:0;right:0;width:75%;height:100vh;background-color:var(--color-container);box-shadow:-4px 0 15px rgb(0 0 0 / .1);padding:4rem 2rem;transform:translateX(100%);transition:transform 0.4s cubic-bezier(.25,1,.5,1)}
    .show-menu{transform:translateX(0)}
    .nav__list{display:flex;flex-direction:column;gap:2rem}
    .nav__close{position:absolute;top:1rem;right:1.25rem;background:none;border:none}
    .nav__toggle{display:block}
    .nav__link.active-link::after{display:none}
}

/* Hero Section */
.hero {
    position: relative;
    height: 90vh;
    display: flex;
    align-items: center;
    /* حذف شد: 
      background: url(/assets/images/my-hero-image.webp) no-repeat center center/cover 
    */
    overflow: hidden; /* برای جلوگیری از بیرون زدن تصویر */
}

/* کلاس جدید برای تگ img */
.hero__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* معادل background-size: cover */
    object-position: center; /* معادل background-position: center */
    z-index: -1; /* تصویر را پشت همه چیز قرار می‌دهد */
}

.hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / .5);
    /* z-index این المان به صورت پیش‌فرض 0 است که روی hero__image (با z-index: -1) قرار می‌گیرد */
}

.hero__container {
    position: relative;
    z-index: 1; /* اطمینان از اینکه محتوا روی overlay است */
    text-align: center;
}
.hero__data{max-width:600px;margin-inline:auto}
.hero__title{font-size:var(--font-size-h1);color:#fff;text-shadow:2px 2px 4px rgb(0 0 0 / .5);margin-bottom:1rem}
.hero__description{font-size:clamp(1.1rem, 3vw, 1.25rem);color:#eee;margin-bottom:2rem}
.hero .button{background-color:var(--color-primary);transform:scale(1.1)}
.hero .button:hover{background-color:var(--color-primary-dark)}

/* Intro Section */
.intro-section{background-color:var(--color-container)}
.intro__container{display:grid;align-items:center;gap:2rem}
.intro__image-wrapper{position:relative}
.intro__image-wrapper::before{content:'';position:absolute;bottom:-10px;right:-10px;width:100%;height:100%;border:3px solid var(--color-primary);border-radius:var(--border-radius);z-index:-1;transition:transform 0.4s}
.intro__image{border-radius:var(--border-radius);box-shadow:var(--box-shadow)}
.intro__description{margin-bottom:1.5rem}
.intro__benefits{list-style:none;display:flex;flex-direction:column;gap:.75rem}
.intro__benefits li{display:flex;align-items:center;gap:.5rem;font-weight:var(--font-weight-bold);color:var(--color-text)}
.intro__benefits svg{fill:var(--color-secondary);width:24px;height:24px}

/* Categories Section */
.categories-section{background-color:#f8f8f8}
.categories__container{display:grid;gap:1.5rem;grid-template-columns:repeat(6,1fr)}
.category__card{padding:2rem 1rem;border-radius:var(--border-radius);text-align:center;transition:transform var(--transition-speed),box-shadow var(--transition-speed);display:flex;justify-content:center;align-items:center;min-height:120px}
.category__card:hover{transform:translateY(-5px) scale(1.03);box-shadow:var(--box-shadow)}
.category__card h3{color:#fff;font-size:1.2rem;text-shadow:1px 1px 3px rgb(0 0 0 / .2)}
.category__card:nth-child(-n+3){grid-column:span 2}
.category__card:nth-child(n+4){grid-column:span 3}
.cat-bg-1{background:linear-gradient(135deg,#e55d87,#5f2c82)}
.cat-bg-2{background:linear-gradient(135deg,#ff6e7f,#bfe9ff)}
.cat-bg-3{background:linear-gradient(135deg,#f7971e,#ffd200)}
.cat-bg-4{background:linear-gradient(135deg,#00c9ff,#92fe9d)}
.cat-bg-5{background:linear-gradient(135deg,#ee9ca7,#ffdde1)}

/* Products Section */
.products__container{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.product__card{background-color:var(--color-container);border-radius:var(--border-radius);overflow:hidden;position:relative;box-shadow:0 4px 10px rgb(0 0 0 / .05);transition:transform 0.3s,box-shadow 0.3s;display: flex;flex-direction: column;}
.product__card:hover{transform:translateY(-5px);box-shadow:var(--box-shadow)}
.product__image-container{position:relative;overflow:hidden}
.product__card img{aspect-ratio:1 / 1;object-fit:cover;transition:transform 0.4s ease}
.product__card:hover img{transform:scale(1.05)}
.product__card-content{padding:1.5rem;text-align:center;flex-grow:1;display:flex;flex-direction:column;justify-content:center;}
.product__card-content h3{font-size:1.1rem;margin-bottom:.5rem;color:var(--color-text)}
.product__rating{color:#f39c12;margin-bottom:1rem;font-size: var(--font-size-small);}
.product__price-container{margin-bottom:1.5rem;}
.product__price{color: var(--color-text);font-weight:var(--font-weight-bold);display:block;font-size:1.15rem}
.add-to-cart-btn{display:block;margin:0 auto 1.5rem auto;width:85%;}
.product-badge{position:absolute;top:12px;left:12px;background-color:var(--color-primary);color:#fff;padding:0.25rem 0.75rem;border-radius:2rem;font-size:var(--font-size-small);font-weight:var(--font-weight-bold);z-index:2;}
.product-badge.bestseller{background-color:var(--color-secondary);}

/* Testimonials Section */
.testimonials-section{background-color:var(--color-container)}
.testimonials__container{padding-bottom:3rem}
.testimonial__slide{text-align:center;padding:2rem}
.testimonial__quote{font-size:1.1rem;color:var(--color-text-light);margin-bottom:1.5rem;position:relative}
.testimonial__quote::before{content:'“';font-size:4rem;color:var(--color-border);position:absolute;top:-1rem;right:-1rem;z-index:-1}
.testimonial__author{font-weight:var(--font-weight-bold);color:var(--color-text)}
.testimonial__rating{color:#f39c12}

/* Call-to-Action (CTA) Section */
.cta-section{background-color:#34495e;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg fill='%232c3e50' fill-opacity='0.4'%3E%3Crect x='0' y='0' width='50' height='50'/%3E%3Crect x='50' y='50' width='50' height='50'/%3E%3C/g%3E%3C/svg%3E");padding-block:4rem}
.cta__container{text-align:center;color:#fff}
.cta__content{background-color:rgb(44 62 80 / .5);padding:2rem;border-radius:var(--border-radius);backdrop-filter:blur(5px)}
.cta__title{color:#fff}
.cta__description{max-width:600px;margin-inline:auto;margin-bottom:2rem;opacity:.9}
.cta__form{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap}
.cta__form input{padding:.9rem;border:none;border-radius:var(--border-radius);font-family:var(--font-family-base);width:250px;text-align:left;direction:ltr}
.cta__form .button{background-color:var(--color-primary);color:#fff}
.cta__form .button:hover{background-color:var(--color-primary-dark)}

/* Footer */
.footer{background-color:var(--color-text);color:var(--color-body);padding-top:4rem}
.footer__container{display:flex;flex-direction:column}
.footer__content{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;padding-bottom:3rem}
.footer__title{font-size:1.25rem;margin-bottom:1rem;color:var(--color-container)}
.footer__description{color:var(--color-gray)}
.footer__links{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.footer__links a{color:var(--color-gray);transition:color var(--transition-speed),padding-right var(--transition-speed)}
.footer__links a:hover{color:var(--color-primary);padding-right:.5rem}
.footer__socials{display:flex;gap:1rem}
.footer__socials svg{fill:var(--color-gray);transition:fill var(--transition-speed)}
.footer__socials a:hover svg{fill:var(--color-primary)}
.footer__bottom{text-align:center;padding:1.5rem 0;border-top:1px solid var(--color-text-light)}
.footer__bottom p{font-size:var(--font-size-small);color:var(--color-gray)}

/* Overlays & Modals */
.search__overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:hsl(0 0% 98% / .95);z-index:var(--z-modal);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity var(--transition-speed),visibility 0s var(--transition-speed)}
.search__overlay.is-active{opacity:1;visibility:visible;transition-delay:0s}
.search__content{width:90%;max-width:600px}
.search__close{position:absolute;top:2rem;right:2rem;color:var(--color-text);background:none;border:none;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center}
.search__overlay-input{width:100%;padding:1rem;border:none;border-bottom:2px solid var(--color-text);background:#fff0;font-family:var(--font-family-base);font-size:1.5rem;text-align:center}
.search__overlay-input:focus{outline:none;border-bottom-color:var(--color-primary)}
.search__overlay-results{margin-top:2rem;max-height:50vh;overflow-y:auto}
.search__result-item{display:block;padding:1rem;color:var(--color-text);border-radius:var(--border-radius)}
.search__result-item:hover{background-color:var(--color-border)}

/* Toast Notification (Relocated to Top) */
.toast{position:fixed;top:-100%;left:50%;transform:translateX(-50%);background-color:var(--color-secondary);color:var(--color-container);padding:1rem 1.5rem;border-radius:var(--border-radius);box-shadow:var(--box-shadow);z-index:var(--z-modal);transition:top 0.5s cubic-bezier(.175,.885,.32,1.275);}
.toast.show{top:2rem}

/* Generic Modal (Cart) */
.modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--z-modal);display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity var(--transition-speed),visibility 0s var(--transition-speed)}
.modal.is-open{opacity:1;visibility:visible;transition-delay:0s}
.modal__overlay{position:absolute;width:100%;height:100%;background-color:hsl(0 0% 0% / .6)}
.modal__content{position:relative;background-color:var(--color-container);padding:2rem;border-radius:var(--border-radius);max-width:500px;width:90%;max-height:90vh;display:flex;flex-direction:column}
.modal__close{position:absolute;top:1rem;left:1rem;background:none;border:none;cursor:pointer;color:var(--color-gray);width:24px;height:24px;display:flex;align-items:center;justify-content:center;padding:0;}
.modal__title{text-align:center;margin-bottom:1.5rem}
.modal__body{flex-grow:1;overflow-y:auto}

/* Cart Specific Styles inside Modal */
.cart-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:1rem;padding-block:1rem;border-bottom:1px solid var(--border-color)}
.cart-item__details{flex-grow:1}
.cart-item__name{font-weight:var(--font-weight-bold)}
.cart-item__price{color:var(--color-text-light);font-size:var(--font-size-small)}
.cart-item__quantity{display:flex;align-items:center;gap:.5rem}
.quantity-btn{background:none;border:1px solid var(--color-border);width:24px;height:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.cart-item__remove{background:none;border:none;color:var(--color-text-light)}
.cart-item__remove:hover{color:var(--color-primary)}
.cart-item__remove svg{width:20px;height:20px;fill:currentColor}
.modal__summary{border-top:2px solid var(--color-border);padding-top:1.5rem;margin-top:1rem}
.summary__total{display:flex;justify-content:space-between;font-weight:var(--font-weight-bold);font-size:1.2rem;margin-bottom:1.5rem}
.modal__cta-info{text-align:center;font-size:var(--font-size-small);color:var(--color-text-light);margin-bottom:1rem}
.modal__buttons{display:flex;flex-direction:column;gap:.5rem}
.button--whatsapp{background-color:#25D366}
.button--whatsapp:hover{background-color:#128C7E}
.button--telegram{background-color:#08c}
.button--telegram:hover{background-color:#0077b5}
.modal__buttons a{display:flex;align-items:center;justify-content:center;gap:.5rem}
.modal__buttons svg{width:20px;height:20px;fill:currentColor}
.cart-empty-message{text-align:center;padding:2rem;color:var(--color-text-light)}
.summary__line {display: flex;justify-content: space-between;color: var(--color-text-light);margin-bottom: 0.75rem;}
.summary__incentive {text-align: center;font-size: var(--font-size-small);color: var(--color-secondary);background-color: hsl(145, 63%, 95%);padding: 0.5rem;border-radius: var(--border-radius);margin-top: 1rem;margin-bottom: 1.5rem;}

/* =============================================== */
/* === Floating Action Button (FAB) - IMPROVED === */
/* =============================================== */
.fab-container {
    position: fixed;
    bottom: 1.5rem; /* موقعیت پایین‌تر */
    right: 1.5rem;  /* نزدیک‌تر به لبه */
    z-index: var(--z-header);
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: .75rem; /* فاصله کمتر بین آیکون‌ها */
}
.fab-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(2px);
    z-index: -1;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}
.fab-main {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: var(--color-primary);
    color: #fff;
    border: none;
    box-shadow: 0 5px 15px hsla(0, 0%, 0%, 0.2), 0 2px 5px hsla(0, 0%, 0%, 0.1); /* سایه بهبود یافته */
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.3s cubic-bezier(.175, .885, .32, 1.275), background-color 0.3s ease;
}
.fab-main:hover {
    transform: scale(1.1);
    background-color: var(--color-primary-dark);
}
.fab-main svg {
    width: 28px;
    height: 28px;
    fill: #fff;
}
.fab-icon-open, .fab-icon-close {
    transition: transform 0.3s, opacity 0.3s;
}
.fab-icon-close {
    position: absolute;
    transform: rotate(-45deg) scale(0);
    opacity: 0;
}
.fab-option {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    color: #fff;
    border: none;
    box-shadow: 0 3px 10px hsla(0, 0%, 0%, 0.15);
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    /* انیمیشن جدید و جذاب‌تر */
    transform: translateY(15px) scale(0.8);
    opacity: 0;
    transition: all 0.25s cubic-bezier(.175, .885, .32, 1.275);
    position: relative;
}
.fab-option:hover {
    transform: scale(1.1);
}
.fab-option svg {
    width: 24px;
    height: 24px;
    fill: #fff;
}
.fab-whatsapp { background-color: #25D366; }
.fab-whatsapp:hover { background-color: #128C7E; }
.fab-telegram { background-color: #0088cc; }
.fab-telegram:hover { background-color: #0077b5; }

.fab-option::after {
    content: attr(data-tooltip);
    position: absolute;
    right: 120%; /* فاصله بیشتر از دکمه */
    background-color: var(--color-text);
    color: #fff;
    padding: .3rem .7rem;
    border-radius: var(--border-radius);
    font-size: var(--font-size-small);
    white-space: nowrap;
    opacity: 0;
    transform: translateX(10px);
    transition: all 0.3s;
    pointer-events: none;
}
.fab-option:hover::after {
    opacity: 1;
    transform: translateX(0);
}

.fab-container.is-active .fab-overlay { opacity: 1; pointer-events: auto; }
.fab-container.is-active .fab-main { transform: rotate(45deg); }
.fab-container.is-active .fab-icon-open { transform: rotate(45deg) scale(0); opacity: 0; }
.fab-container.is-active .fab-icon-close { transform: rotate(0) scale(1); opacity: 1; }
.fab-container.is-active .fab-option {
    transform: translateY(0) scale(1);
    opacity: 1;
}
/* ایجاد تاخیر برای انیمیشن آبشاری */
.fab-container.is-active .fab-option:nth-of-type(1) { transition-delay: 0.1s; }
.fab-container.is-active .fab-option:nth-of-type(2) { transition-delay: 0.05s; }


/* === NEW: Mobile Specific Sizes === */
@media (max-width: 767px) {
    .fab-container {
        bottom: 1rem;
        right: 1rem;
        gap: .5rem;
    }
    .fab-main {
        width: 55px; /* کوچکتر شدن دکمه اصلی */
        height: 55px;
    }
    .fab-main svg {
        width: 26px;
        height: 26px;
    }
    .fab-option {
        width: 45px; /* کوچکتر شدن گزینه‌ها */
        height: 45px;
    }
    .fab-option svg {
        width: 22px;
        height: 22px;
    }
}
/* ===== Products Page Specific Styles ===== */
.products-page{padding-top:calc(var(--header-height) + 2rem);}
.products-page__intro{max-width:650px;margin-inline:auto;margin-bottom:3rem;color:var(--color-text-light);line-height:1.8;}
.filter__title{text-align:center;font-size:1.1rem;color:var(--color-text-light);margin-bottom:1.5rem;margin-top:3rem;}
.filter__container{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.75rem;margin-bottom:3rem;}
.filter-btn{background-color:var(--color-container);color:var(--color-text-light);border:1px solid var(--color-border);padding:.5rem 1.2rem;border-radius:2rem;cursor:pointer;font-weight:var(--font-weight-bold);transition:all var(--transition-speed);}
.filter-btn:hover{background-color:var(--color-border);color:var(--color-text);transform:translateY(-2px);}
.filter-btn.active{background-color:var(--color-primary);color:#fff;border-color:var(--color-primary);box-shadow:0 2px 8px hsl(12 80% 50% / .25);}
.products-page .products__container{grid-template-columns:repeat(auto-fit,minmax(270px,1fr));transition:opacity 0.4s ease;}
.products-page .products__container.filtering{opacity:.5;}
.loader{width:50px;height:50px;border:5px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin:3rem auto;grid-column:1 / -1;}
@keyframes spin{to{transform:rotate(360deg);}}
.not-found-cta{text-align:center;padding:3rem 1rem;background-color:var(--color-container);border:2px dashed var(--color-border);border-radius:var(--border-radius);margin-top:2rem;}
.not-found-cta h3{margin-bottom:1rem;}
.not-found-cta p{color:var(--color-text-light);max-width:400px;margin-inline:auto;}
.trust-signals-section{padding-block:3rem;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);background-color:var(--color-container);}
.trust-signals-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;text-align:center;}
.trust-signal svg{width:48px;height:48px;fill:var(--color-secondary);margin-bottom:1rem;}
.trust-signal h4{font-size:1.1rem;margin-bottom:0.5rem;color:var(--color-text);}
.trust-signal p{color:var(--color-text-light);font-size:0.95rem;}

/* ===== Responsive Media Queries ===== */
@media (max-width:767px){
    .category__card:nth-child(-n+5){grid-column:span 6}
}
@media (min-width:768px){
    .nav__toggle,.nav__close{display:none}
    .nav__list{display:flex;flex-direction:row;align-items:center;gap:2.5rem}
    .nav__menu{position:static;width:auto;height:auto;box-shadow:none;padding:0}
    .intro__container{grid-template-columns:1fr 1.2fr;gap:4rem}
    .intro__data{order:-1}
    .intro__image-wrapper:hover::before{transform:translate(10px,10px)}
    .hero__container{text-align:right}
}
/* =============================================== */
/* === Custom Testimonials Slider Styles === */
/* =============================================== */

.testimonials__container {
    position: relative; /* برای موقعیت‌دهی دکمه‌های صفحه‌بندی */
    padding-bottom: 3rem; /* فضایی برای دکمه‌ها در پایین */
}

.testimonials__wrapper {
    display: flex;
    overflow-x: auto; /* اسکرول افقی */

    /* جادوی اسلایدر با CSS Scroll Snap */
    scroll-snap-type: x mandatory; /* اسکرول حتما روی یک آیتم می‌ایستد */
    scroll-behavior: smooth; /* اسکرول نرم */
    -webkit-overflow-scrolling: touch; /* اسکرول روان در iOS */

    /* مخفی کردن نوار اسکرول */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

.testimonials__wrapper::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

.testimonial__slide {
    flex: 0 0 100%; /* هر اسلاید ۱۰۰٪ عرض والد را می‌گیرد */
    width: 100%;
    scroll-snap-align: start; /* هر اسلاید به ابتدای کانتینر می‌چسبد */

    /* حفظ استایل‌های قبلی */
    text-align: center;
    padding: 2rem;
    box-sizing: border-box; /* برای جلوگیری از شکستن لایه */
}

/* استایل‌های خود اسلاید (بدون تغییر) */
.testimonial__quote {
    font-size: 1.1rem;
    color: var(--color-text-light);
    margin-bottom: 1.5rem;
    position: relative;
}

.testimonial__quote::before {
    content: '“';
    font-size: 4rem;
    color: var(--color-border);
    position: absolute;
    top: -1rem;
    right: -1rem;
    z-index: -1;
}

.testimonial__author {
    font-weight: var(--font-weight-bold);
    color: var(--color-text);
}

.testimonial__rating {
    color: #f39c12;
}

/* دکمه‌های صفحه‌بندی سفارشی (Pagination) */
.testimonials__pagination {
    position: absolute;
    bottom: 0.5rem; /* موقعیت در پایین اسلایدر */
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.5rem;
}

.testimonials__pagination-bullet {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--color-border);
    border: none;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s;
}

.testimonials__pagination-bullet:hover {
    background-color: var(--color-gray);
    transform: scale(1.2);
}

.testimonials__pagination-bullet.active {
    background-color: var(--color-primary); /* همان استایل قبلی */
    transform: scale(1.2);
}
/* ==============================================
   MOBILE RESPONSIVE FIXES (Emergency Patch)
   ============================================== */

/* 1. جلوگیری از اسکرول افقی مزاحم */
html, body {
    overflow-x: hidden;
    width: 100%;
}

/* 2. اصلاح بخش Hero در موبایل */
@media (max-width: 768px) {
    .hero {
        /* ارتفاع ثابت را برمی‌داریم تا اگر متن زیاد بود، فضا بزرگ شود */
        height: auto;
        min-height: 85vh; 
        padding-top: calc(var(--header-height) + 2rem); /* فاصله از بالا برای دیده شدن زیر هدر */
        padding-bottom: 3rem;
    }

    .hero__title {
        font-size: 2rem; /* کمی کوچکتر برای موبایل */
    }
    
    .hero__description {
        font-size: 1rem;
    }
    
    /* اطمینان از اینکه تصویر پشت متن می‌ماند */
    .hero__image {
        z-index: -1;
    }
    
    .hero__container {
        z-index: 2; /* متن حتماً روی تصویر و اورلی باشد */
    }
}

/* 3. اصلاح شبکه‌بندی دسته‌بندی‌ها (Categories) */
@media (max-width: 768px) {
    .categories__container {
        /* تغییر از 6 ستون به 2 ستون در موبایل */
        grid-template-columns: repeat(2, 1fr) !important; 
        gap: 1rem;
    }

    /* بازنشانی تنظیمات span قبلی */
    .category__card:nth-child(n) {
        grid-column: auto !important; 
    }
    
    /* فقط آیتم آخر اگر تعداد فرد بود وسط بیفتد (اختیاری) */
    .category__card:last-child:nth-child(odd) {
        grid-column: span 2 !important;
    }
}

/* 4. اصلاح کارت محصولات و گریدها در موبایل */
@media (max-width: 576px) {
    .container {
        padding-inline: 1rem; /* فاصله کمتر از کناره‌ها در موبایل */
    }

    .products__container {
        grid-template-columns: 1fr; /* یک محصول در هر ردیف برای تمرکز بیشتر */
    }
    
    .intro__container {
        grid-template-columns: 1fr; /* عکس و متن زیر هم */
        text-align: center;
    }
    
    .intro__image-wrapper {
        order: -1; /* عکس اول نمایش داده شود */
        margin-bottom: 1.5rem;
    }
    
    .intro__benefits {
        align-items: center; /* وسط چین کردن لیست مزایا */
    }
}

/* 5. اصلاح منوی موبایل (اگر زیر Hero رفته است) */
.nav__menu {
    z-index: var(--z-modal); /* بالاترین اولویت */
}

/* 6. اصلاح سایز دکمه‌های شناور (FAB) */
@media (max-width: 768px) {
    .fab-container {
        bottom: 1rem;
        right: 1rem;
    }
}