/* Page-specific styles: wholesale/index.php */
/*
|--------------------------------------------------------------------------
| Wholesale page only
|--------------------------------------------------------------------------
| این استایل‌ها فقط به .wholesale-page محدود هستند و storefront.css را تغییر نمی‌دهند.
|--------------------------------------------------------------------------
*/

.wholesale-page{
    width:min(1180px,calc(100% - 30px));
    margin:22px auto 58px;
    color:#342a20;
}

.wholesale-page a{
    text-decoration:none;
}

.wholesale-breadcrumb{
    display:flex;
    align-items:center;
    gap:7px;
    margin:0 0 15px;
    color:#8c8175;
    font-size:10.5px;
    line-height:1.8;
}

.wholesale-breadcrumb a{
    color:#765b2b;
}

.wholesale-hero{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(280px,.75fr);
    gap:18px;
    align-items:stretch;
    overflow:hidden;
    padding:42px;
    border:1px solid rgba(143,112,62,.18);
    border-radius:24px;
    background:
        radial-gradient(circle at 12% 10%,rgba(214,184,119,.20),transparent 30%),
        linear-gradient(135deg,rgba(255,253,248,.98),rgba(244,235,216,.96));
    box-shadow:0 16px 45px rgba(50,37,22,.08);
}

.wholesale-hero::after{
    content:"";
    position:absolute;
    width:240px;
    height:240px;
    left:-90px;
    bottom:-125px;
    border:1px solid rgba(126,93,38,.11);
    border-radius:50%;
}

.wholesale-hero-content{
    position:relative;
    z-index:1;
    align-self:center;
}

.wholesale-eyebrow,
.wholesale-section-heading > span{
    display:block;
    margin-bottom:7px;
    color:#9a772f;
    font-size:10.5px;
    font-weight:900;
    letter-spacing:.02em;
}

.wholesale-hero h1{
    max-width:720px;
    margin:0 0 13px;
    color:#2f251b;
    font-size:clamp(25px,3vw,39px);
    font-weight:900;
    line-height:1.55;
}

.wholesale-hero-content > p{
    max-width:720px;
    margin:0;
    color:#6f655b;
    font-size:13px;
    line-height:2.15;
}

.wholesale-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:23px;
}

.wholesale-primary-btn,
.wholesale-secondary-btn{
    min-height:45px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:9px 16px;
    border-radius:11px;
    font-size:11.5px;
    font-weight:900;
    transition:
        transform .16s ease,
        box-shadow .16s ease,
        background .16s ease;
}

.wholesale-primary-btn{
    border:1px solid #735820;
    background:linear-gradient(135deg,#75591f,#a78238);
    color:#fff !important;
    box-shadow:0 8px 18px rgba(105,78,27,.16);
}

.wholesale-primary-btn svg{
    width:17px;
    height:17px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.wholesale-primary-btn:hover{
    transform:translateY(-1px);
    box-shadow:0 11px 23px rgba(105,78,27,.22);
}

.wholesale-secondary-btn{
    border:1px solid rgba(119,91,43,.19);
    background:rgba(255,255,255,.70);
    color:#624a1e !important;
}

.wholesale-secondary-btn:hover{
    transform:translateY(-1px);
    background:#fff;
}

.wholesale-contact-line{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:7px;
    margin-top:18px;
    color:#8c8176;
    font-size:10.5px;
}

.wholesale-contact-line a{
    direction:ltr;
    color:#5b4726;
    font-weight:850;
}

.wholesale-contact-separator{
    color:#c0ab80;
}

.wholesale-hero-card{
    position:relative;
    z-index:1;
    align-self:stretch;
    padding:24px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:18px;
    background:
        linear-gradient(145deg,#2f291f,#433821);
    color:#fff;
    box-shadow:0 13px 32px rgba(49,37,22,.13);
}

.wholesale-hero-card-label{
    display:block;
    margin-bottom:12px;
    color:#d9bd72;
    font-size:10px;
    font-weight:850;
}

.wholesale-hero-card strong{
    display:block;
    margin-bottom:15px;
    color:#fff8e9;
    font-size:17px;
    line-height:1.8;
}

.wholesale-hero-card ul{
    margin:0;
    padding:0 18px 0 0;
    color:#d7cdbd;
    font-size:11.5px;
    line-height:2.15;
}

.wholesale-section,
.wholesale-process,
.wholesale-faq{
    margin-top:50px;
}

.wholesale-section-heading{
    max-width:760px;
    margin-bottom:20px;
}

.wholesale-section-heading h2,
.wholesale-info h2,
.wholesale-final-cta h2{
    margin:0 0 7px;
    color:#30271e;
    font-size:21px;
    line-height:1.75;
}

.wholesale-section-heading p,
.wholesale-info p,
.wholesale-final-cta p{
    margin:0;
    color:#766d64;
    font-size:12px;
    line-height:2;
}

.wholesale-category-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}

.wholesale-category-card{
    position:relative;
    min-width:0;
    min-height:190px;
    display:flex;
    flex-direction:column;
    padding:18px;
    overflow:hidden;
    border:1px solid #e5ddd0;
    border-radius:16px;
    background:rgba(255,253,249,.94);
    color:#332a21 !important;
    box-shadow:0 7px 20px rgba(50,37,22,.045);
    transition:
        transform .16s ease,
        border-color .16s ease,
        box-shadow .16s ease;
}

.wholesale-category-card:hover{
    transform:translateY(-2px);
    border-color:rgba(154,119,47,.34);
    box-shadow:0 12px 26px rgba(50,37,22,.075);
}


.wholesale-category-card h3{
    margin:0 0 6px;
    font-size:15px;
    line-height:1.7;
}

.wholesale-category-card p{
    margin:0 0 16px;
    color:#7a7066;
    font-size:11px;
    line-height:1.95;
}

.wholesale-card-link{
    margin-top:auto;
    color:#7b5d22;
    font-size:10.5px;
    font-weight:900;
}

.wholesale-process{
    padding:27px;
    border:1px solid rgba(139,109,61,.15);
    border-radius:20px;
    background:rgba(255,253,249,.82);
}

.wholesale-process-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.wholesale-process-grid article{
    padding:16px;
    border:1px solid #ebe4d9;
    border-radius:14px;
    background:#fff;
}

.wholesale-process-grid article > span{
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    margin-bottom:12px;
    border-radius:9px;
    background:#f0e5ca;
    color:#7b5c21;
    font-size:10.5px;
    font-weight:900;
}

.wholesale-process-grid h3{
    margin:0 0 5px;
    color:#3a3026;
    font-size:12.5px;
    line-height:1.8;
}

.wholesale-process-grid p{
    margin:0;
    color:#7b7268;
    font-size:10.5px;
    line-height:1.95;
}

.wholesale-info{
    display:grid;
    grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);
    gap:15px;
    align-items:stretch;
    margin-top:50px;
}

.wholesale-info > div:first-child{
    padding:28px;
    border:1px solid #e6ddd0;
    border-radius:18px;
    background:rgba(255,253,249,.92);
}

.wholesale-info-note{
    padding:25px;
    border-radius:18px;
    background:#3b3226;
    color:#fff;
}

.wholesale-info-note strong{
    display:block;
    margin-bottom:8px;
    color:#ead295;
    font-size:14px;
}

.wholesale-info-note p{
    color:#ded5c8;
    font-size:11px;
    line-height:2.05;
}

.wholesale-faq-list{
    display:grid;
    gap:8px;
}

.wholesale-faq details{
    padding:0;
    border:1px solid #e5ddd1;
    border-radius:13px;
    background:rgba(255,253,249,.94);
    overflow:hidden;
}

.wholesale-faq summary{
    padding:14px 15px;
    cursor:pointer;
    color:#3d3228;
    font-size:12px;
    font-weight:850;
    line-height:1.8;
}

.wholesale-faq details p{
    margin:0;
    padding:0 15px 15px;
    color:#766c62;
    font-size:11px;
    line-height:2;
}

.wholesale-final-cta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    margin-top:50px;
    padding:28px;
    border-radius:20px;
    background:
        radial-gradient(circle at 5% 20%,rgba(216,185,113,.16),transparent 25%),
        linear-gradient(135deg,#f8f1e3,#eee0bd);
    border:1px solid rgba(151,115,45,.17);
}

.wholesale-final-cta > div > span{
    display:block;
    margin-bottom:5px;
    color:#8a6928;
    font-size:10px;
    font-weight:900;
}


/* Tablet */
@media(max-width:900px){

    .wholesale-hero{
        grid-template-columns:1fr;
        padding:30px;
    }

    .wholesale-hero-card{
        max-width:none;
    }

    .wholesale-category-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wholesale-process-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wholesale-info{
        grid-template-columns:1fr;
    }
}


/* Mobile */
@media(max-width:560px){

    .wholesale-page{
        width:calc(100% - 18px);
        margin-top:15px;
    }

    .wholesale-hero{
        padding:20px 16px;
        border-radius:18px;
    }

    .wholesale-hero h1{
        font-size:24px;
    }

    .wholesale-hero-content > p{
        font-size:11.5px;
    }

    .wholesale-hero-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .wholesale-primary-btn,
    .wholesale-secondary-btn{
        width:100%;
    }

    .wholesale-contact-line{
        gap:5px;
    }

    .wholesale-hero-card{
        padding:18px;
        border-radius:14px;
    }

    .wholesale-section,
    .wholesale-process,
    .wholesale-faq,
    .wholesale-info,
    .wholesale-final-cta{
        margin-top:34px;
    }

    .wholesale-section-heading h2,
    .wholesale-info h2,
    .wholesale-final-cta h2{
        font-size:18px;
    }

    .wholesale-category-grid{
        grid-template-columns:1fr;
        gap:8px;
    }

    .wholesale-category-card{
        min-height:155px;
    }

    .wholesale-process{
        padding:17px 12px;
        border-radius:16px;
    }

    .wholesale-process-grid{
        grid-template-columns:1fr;
    }

    .wholesale-info > div:first-child,
    .wholesale-info-note{
        padding:19px 16px;
        border-radius:15px;
    }

    .wholesale-final-cta{
        align-items:stretch;
        flex-direction:column;
        padding:20px 16px;
        border-radius:16px;
    }
}