﻿/* ============================================================
   Pazh Theme - پالت "بتن پلیمر" (betonpolymer.com)
   رنگ اصلی: قرمز کرمی (Crimson Red)
   رنگ تیره: سرمه‌/خاکستری ذغالی (Charcoal)
   ------------------------------------------------------------
   این فایل بعد از style2.css (Tailwind) بارگذاری می‌شود و رنگ‌های
   amber/slate پروژه‌های قبلی را با این پالت جایگزین می‌کند.
   ============================================================ */

/* ---------- Amber  ->  Crimson / Red  ---------- */
.bg-amber-50    { background-color: #fdecee !important; }
.bg-amber-100   { background-color: #fbdadd !important; }
.bg-amber-400   { background-color: #ef6a78 !important; }
.bg-amber-500   { background-color: #c4122a !important; }
.bg-amber-500\/20 { background-color: rgb(196 18 42 / .2) !important; }
.bg-amber-500\/5  { background-color: rgb(196 18 42 / .05) !important; }
.hover\:bg-amber-50:hover  { background-color: #fdecee !important; }
.hover\:bg-amber-600:hover { background-color: #a50e22 !important; }
.group-hover\:bg-amber-500 { background-color: #c4122a !important; }

.border-amber-100     { border-color: #fbdadd !important; }
.border-amber-500     { border-color: #c4122a !important; }
.border-amber-500\/30 { border-color: rgb(196 18 42 / .3) !important; }
.hover\:border-amber-200:hover { border-color: #f7b9bf !important; }

.text-amber-400     { color: #ef6a78 !important; }
.text-amber-500     { color: #dc3545 !important; }
.text-amber-600     { color: #c4122a !important; }
.text-amber-700\/80 { color: rgb(165 14 34 / .8) !important; }
.text-amber-800     { color: #8b0c1d !important; }
.hover\:text-amber-400:hover { color: #ef6a78 !important; }
.hover\:text-amber-600:hover { color: #c4122a !important; }
.hover\:text-amber-700:hover { color: #a50e22 !important; }
.group-hover\:text-amber-600 { color: #c4122a !important; }

.focus\:ring-amber-500 { --tw-ring-color: rgb(196 18 42 / .5) !important; }

.from-amber-400 { --tw-gradient-from: #ef6a78 var(--tw-gradient-from-position) !important;
                  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.to-amber-200   { --tw-gradient-to: #f7b9bf var(--tw-gradient-to-position) !important; }

/* ---------- Slate  ->  Charcoal ---------- */
.bg-slate-50  { background-color: #f7f7f7 !important; }
.bg-slate-100 { background-color: #eeeeee !important; }
.bg-slate-900 { background-color: #1b1b1b !important; }
.hover\:bg-slate-800:hover { background-color: #262626 !important; }

.border-slate-100 { border-color: #eeeeee !important; }
.border-slate-200 { border-color: #e2e2e2 !important; }
.border-slate-800 { border-color: #2c2c2c !important; }

.text-slate-300 { color: #d6d6d6 !important; }
.text-slate-400 { color: #b7b7b7 !important; }
.text-slate-500 { color: #6b6b6b !important; }
.text-slate-600 { color: #4a4a4a !important; }
.text-slate-700 { color: #333333 !important; }
.text-slate-800 { color: #262626 !important; }
.text-slate-900 { color: #1a1a1a !important; }
.hover\:text-slate-900:hover { color: #1a1a1a !important; }

.from-slate-900 { --tw-gradient-from: #1b1b1b var(--tw-gradient-from-position) !important;
                  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.via-slate-900\/80 { --tw-gradient-stops: var(--tw-gradient-from), #1b1b1bcc var(--tw-gradient-via-position), var(--tw-gradient-to) !important; }

/* ---------- Gray ---------- */
.bg-gray-50  { background-color: #f8fafc !important; }
.bg-gray-100 { background-color: #f1f5f9 !important; }
.border-gray-100 { border-color: #eef1f8 !important; }
.border-gray-200 { border-color: #dfe3f0 !important; }
.text-gray-400   { color: #8e97b5 !important; }
.hover\:bg-gray-200:hover { background-color: #dde1ef !important; }

.hover\:shadow-amber-500\/25:hover { --tw-shadow-color: rgb(196 18 42 / .25) !important; }
/* ============================================================
   کامپوننت‌های اختصاصی پاز (بر اساس سبک بتن پلیمر)
   ============================================================ */

/* دکمه اصلی قرمز */
.pazh-btn-primary {
    background-color: #c4122a !important;
    color: #fff !important;
    transition: all .3s ease;
    box-shadow: 0 8px 20px -6px rgb(196 18 42 / .45);
}
.pazh-btn-primary:hover {
    background-color: #a50e22 !important;
    box-shadow: 0 12px 24px -6px rgb(196 18 42 / .55);
    transform: translateY(-2px);
}

/* دکمه شیشه‌ای روی پس‌زمینه تیره */
.pazh-btn-glass {
    background: rgb(255 255 255 / .1);
    border: 1px solid rgb(255 255 255 / .3);
    color: #fff;
    backdrop-filter: blur(8px);
    transition: all .3s ease;
}
.pazh-btn-glass:hover {
    background: #c4122a;
    border-color: #c4122a;
}

/* متن گرادیانی قرمز */
.pazh-grad-text {
    background-image: linear-gradient(120deg, #ef6a78 0%, #c4122a 50%, #a50e22 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* کارت هاوردار */
.pazh-card {
    background: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 1rem;
    transition: all .35s ease;
}
.pazh-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -14px rgb(0 0 0 / .15);
    border-color: #f7b9bf;
}

/* لینک منو (روی نوار تیره) */
.pazh-nav-link {
    position: relative;
    color: #d6d6d6;
    padding: 1rem .25rem;
    transition: color .2s ease;
    white-space: nowrap;
}
.pazh-nav-link::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: .35rem;
    width: 100%;
    height: 3px;
    border-radius: 2px;
    background-color: #c4122a;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .3s ease;
}
.pazh-nav-link:hover,
.pazh-nav-link.active { color: #fff; }
.pazh-nav-link:hover::after,
.pazh-nav-link.active::after { transform: scaleX(1); }

/* هدر (سفید با سایه) */
.pazh-header {
    background: #fff;
    box-shadow: 0 8px 24px -14px rgb(0 0 0 / .18);
}

/* هاله‌های تزئینی هیرو */
.pazh-orb {
    position: absolute;
    border-radius: 9999px;
    filter: blur(90px);
    opacity: .35;
    pointer-events: none;
}

/* نوار آمار */
.pazh-stat {
    border-left: 1px solid rgb(255 255 255 / .14);
}
.pazh-stat:last-child { border-left: none; }

/* فیلد ورودی */
.pazh-input {
    background: #f7f7f7;
    border: 1px solid #e2e2e2;
    border-radius: .6rem;
    transition: all .25s ease;
}
.pazh-input:focus {
    outline: none;
    background: #fff;
    border-color: #c4122a;
    box-shadow: 0 0 0 4px rgb(196 18 42 / .12);
}

/* هیرو / هدر صفحات داخلی */
.pazh-page-hero {
    background: linear-gradient(135deg, #101010 0%, #1b1b1b 55%, #2b2024 100%);
    position: relative;
    overflow: hidden;
}

/* نوار تبلیغ قرمز */
.pazh-cta {
    background-image: linear-gradient(120deg, #c4122a 0%, #a50e22 60%, #8b0c1d 100%);
    border-radius: 1rem;
    position: relative;
    overflow: hidden;
}

/* ---------- ابزارهای تکمیلی ---------- */
.bg-gradient-to-l {
    background-image: linear-gradient(to left, var(--tw-gradient-stops, transparent)) !important;
}
.from-violet-500 { --tw-gradient-from: #dc3545 var(--tw-gradient-from-position) !important;
                   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.from-violet-600 { --tw-gradient-from: #c4122a var(--tw-gradient-from-position) !important;
                   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.via-indigo-500  { --tw-gradient-via: #a50e22 var(--tw-gradient-via-position) !important;
                   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to) !important; }
.via-indigo-600  { --tw-gradient-via: #8b0c1d var(--tw-gradient-via-position) !important;
                   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to) !important; }
.to-indigo-500   { --tw-gradient-to: #a50e22 var(--tw-gradient-to-position) !important; }
.to-indigo-600   { --tw-gradient-to: #8b0c1d var(--tw-gradient-to-position) !important; }
.to-indigo-700   { --tw-gradient-to: #710a18 var(--tw-gradient-to-position) !important; }
.to-cyan-400     { --tw-gradient-to: #ef6a78 var(--tw-gradient-to-position) !important; }

.text-indigo-200 { color: #f7b9bf !important; }
.text-indigo-300 { color: #ef9aa4 !important; }
.text-violet-400 { color: #ef6a78 !important; }
.hover\:text-indigo-300:hover { color: #ef9aa4 !important; }
.hover\:text-white\/80:hover { color: rgb(255 255 255 / .8) !important; }
.text-white\/80 { color: rgb(255 255 255 / .8) !important; }

.bg-white\/5  { background-color: rgb(255 255 255 / .05) !important; }
.bg-white\/10 { background-color: rgb(255 255 255 / .1) !important; }
.bg-white\/15 { background-color: rgb(255 255 255 / .15) !important; }
.bg-white\/30 { background-color: rgb(255 255 255 / .3) !important; }
.hover\:bg-white\/30:hover { background-color: rgb(255 255 255 / .3) !important; }
.bg-violet-600\/20 { background-color: rgb(196 18 42 / .2) !important; }
.bg-indigo-600\/20 { background-color: rgb(139 12 29 / .2) !important; }
.hover\:bg-violet-600:hover { background-color: #c4122a !important; }

.bg-violet-400 { background-color: #ef6a78 !important; }
.bg-violet-600 { background-color: #c4122a !important; }
.bg-indigo-500 { background-color: #a50e22 !important; }
.bg-cyan-400   { background-color: #ef6a78 !important; }
.text-violet-500 { color: #dc3545 !important; }
/* ---------- ابعاد ---------- */
.w-3\.5 { width: .875rem !important; }
.h-3\.5 { height: .875rem !important; }
.w-7 { width: 1.75rem !important; }
.h-7 { height: 1.75rem !important; }
.w-9 { width: 2.25rem !important; }
.h-9 { height: 2.25rem !important; }
.w-72 { width: 18rem !important; }
.h-72 { height: 18rem !important; }
.w-16 { width: 4rem !important; }
.h-16 { height: 4rem !important; }
.w-8 { width: 2rem !important; }
.h-8 { height: 2rem !important; }
.h-14 { height: 3.5rem !important; }
.h-24 { height: 6rem !important; }
.h-1 { height: .25rem !important; }
.h-1\.5 { height: .375rem !important; }
.w-auto { width: auto !important; }
.w-80 { width: 20rem !important; }
.h-80 { height: 20rem !important; }
.w-96 { width: 24rem !important; }
.h-96 { height: 24rem !important; }
.w-64 { width: 16rem !important; }
.h-64 { height: 16rem !important; }
.w-\[150px\] { width: 150px !important; }
.h-\[100px\] { height: 100px !important; }
.rounded-\[15px\] { border-radius: 15px !important; }

/* ---------- فاصله‌ها ---------- */
.mt-0\.5 { margin-top: .125rem !important; }
.mt-1 { margin-top: .25rem !important; }
.mt-3 { margin-top: .75rem !important; }
.mb-4 { margin-bottom: 1rem !important; }
.py-1\.5 { padding-top: .375rem !important; padding-bottom: .375rem !important; }
.py-2\.5 { padding-top: .625rem !important; padding-bottom: .625rem !important; }
.py-3 { padding-top: .75rem !important; padding-bottom: .75rem !important; }
.py-14 { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
.py-24 { padding-top: 6rem !important; padding-bottom: 6rem !important; }
.py-32 { padding-top: 8rem !important; padding-bottom: 8rem !important; }
.px-6 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.gap-x-6 { column-gap: 1.5rem !important; }
.gap-y-1 { row-gap: .25rem !important; }
.-top-24 { top: -6rem !important; }
.-left-24 { left: -6rem !important; }
.-bottom-24 { bottom: -6rem !important; }
.-right-24 { right: -6rem !important; }
.-bottom-2 { bottom: -.5rem !important; }
.inset-x-0 { left: 0 !important; right: 0 !important; }
.blur-\[90px\] { filter: blur(90px) !important; }

/* ---------- نمایش وابسته به عرض ---------- */
@media (min-width: 768px) {
    .md\:inline { display: inline !important; }
    .md\:inline-flex { display: inline-flex !important; }
    .md\:py-32 { padding-top: 8rem !important; padding-bottom: 8rem !important; }
    .md\:px-16 { padding-left: 4rem !important; padding-right: 4rem !important; }
    .md\:flex { display: flex !important; }
}
@media (min-width: 1024px) {
    .lg\:flex { display: flex !important; }
    .lg\:block { display: block !important; }
    .lg\:hidden { display: none !important; }
    .lg\:mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
}
/* ---------- کلاس‌های تکمیلی هدر/منو ---------- */
.gap-7 { gap: 1.75rem !important; }
.overflow-x-auto { overflow-x: auto !important; }
.border-b-2 { border-bottom-width: 2px !important; }
.border-b { border-bottom-width: 1px !important; }
.text-white\/70 { color: rgb(255 255 255 / .7) !important; }