/* ======================================================================
   دفتر وکالت عدالت‌خواه — فایل CSS مستقل و مشترک تمام صفحات
   شامل فونت وزیرمتن (Vazirmatn) به‌صورت محلی (self-hosted) —
   بدون نیاز به اتصال به گوگل‌فونت یا هر سرویس خارجی دیگر.
   ====================================================================== */

@font-face {
    font-family: 'Vazirmatn';
    src: url('../fonts/Vazirmatn-Variable.woff2') format('woff2-variations'),
         url('../fonts/Vazirmatn-Variable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
/* نسخه‌ی ایستا (غیر متغیر) به‌عنوان پشتیبان برای مرورگرهای بسیار قدیمی */
@font-face {
    font-family: 'Vazirmatn';
    src: url('../fonts/Vazirmatn-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Vazirmatn';
    src: url('../fonts/Vazirmatn-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

* { font-family: 'Vazirmatn', sans-serif; }

/* دفتر وکالت عدالت‌خواه — استایل مشترک تمام صفحات */
    /* ===================== متغیرهای رنگ تم روشن ===================== */
    :root {
        --primary: #1B5E3A;
        --primary-rgb: 27,94,58;
        --primary-light: #2D8A5E;
        --primary-dark: #0F3D24;
        --accent: #C9A84C;
        --accent-rgb: 201,168,76;
        --accent-light: #E0C56E;
        --bg: #FAF9F6;
        --bg-alt: #F0EDE5;
        --fg: #1A1A18;
        --fg-sec: #555550;
        --muted: #8A8A80;
        --card: #FFFFFF;
        --border: #E0DDD5;
        --shadow: rgba(0,0,0,0.08);
        --shadow-lg: rgba(0,0,0,0.15);
        --overlay: rgba(15,20,16,0.7);
        --header-bg: rgba(250,249,246,0.92);
        --success: #2D8A5E;
        --error: #C0392B;
        --warning: #E67E22;
    }
    /* ===================== متغیرهای رنگ تم تاریک ===================== */
    .dark {
        --primary: #3AAF76;
        --primary-rgb: 58,175,118;
        --primary-light: #4CC98E;
        --primary-dark: #2D8A5E;
        --accent: #D4B65A;
        --accent-rgb: 212,182,90;
        --accent-light: #E8D07A;
        --bg: #0C1410;
        --bg-alt: #141F1A;
        --fg: #E8E4DC;
        --fg-sec: #A8A49C;
        --muted: #6A6860;
        --card: #1A2B22;
        --border: #2A3B32;
        --shadow: rgba(0,0,0,0.3);
        --shadow-lg: rgba(0,0,0,0.5);
        --overlay: rgba(5,10,8,0.85);
        --header-bg: rgba(12,20,16,0.94);
        --success: #3AAF76;
        --error: #E74C3C;
        --warning: #F39C12;
    }

    /* ===================== ریست و پایه ===================== */
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
        font-family: 'Vazirmatn', sans-serif;
        background: var(--bg);
        color: var(--fg);
        line-height: 1.8;
        overflow-x: hidden;
        transition: background 0.4s, color 0.4s;
    }
    ::selection { background: rgba(var(--primary-rgb),0.25); }
    a { color: var(--primary); text-decoration: none; transition: color 0.3s; }
    a:hover { color: var(--accent); }
    img { max-width: 100%; display: block; }

    /* ===================== پیش‌بارگذار ===================== */
    #preloader {
        position: fixed; inset: 0; z-index: 99999;
        background: var(--primary-dark);
        display: flex; flex-direction: column;
        align-items: center; justify-content: center;
        transition: opacity 0.6s, visibility 0.6s;
    }
    #preloader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
    .preloader-logo { font-size: 2rem; font-weight: 900; color: #fff; }
    .preloader-logo span { color: var(--accent); }
    .preloader-bar {
        width: 120px; height: 3px; background: rgba(255,255,255,0.15);
        border-radius: 3px; margin-top: 20px; overflow: hidden;
    }
    .preloader-bar::after {
        content: ''; display: block; width: 40%; height: 100%;
        background: var(--accent); border-radius: 3px;
        animation: barSlide 1s ease-in-out infinite;
    }
    @keyframes barSlide {
        0% { transform: translateX(-100%); }
        100% { transform: translateX(350%); }
    }

    /* ===================== هدر ===================== */
    #site-header {
        position: fixed; top: 0; right: 0; left: 0; z-index: 1000;
        background: var(--header-bg);
        backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
        border-bottom: 1px solid var(--border);
        transition: background 0.4s, border-color 0.4s, box-shadow 0.3s;
    }
    #site-header.scrolled { box-shadow: 0 2px 20px var(--shadow); }
    .nav-link {
        position: relative; padding: 8px 0; font-size: 0.9rem;
        font-weight: 500; color: var(--fg-sec); transition: color 0.3s;
    }
    .nav-link:hover, .nav-link.active { color: var(--primary); }
    .nav-link::after {
        content: ''; position: absolute; bottom: 0; right: 0;
        width: 0; height: 2px; background: var(--accent); transition: width 0.3s;
    }
    .nav-link:hover::after, .nav-link.active::after { width: 100%; }
    .hdr-btn {
        width: 40px; height: 40px; border-radius: 10px;
        display: inline-flex; align-items: center; justify-content: center;
        background: transparent; border: 1px solid var(--border);
        color: var(--fg-sec); cursor: pointer; transition: all 0.3s; font-size: 0.95rem;
    }
    .hdr-btn:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
    .hdr-call {
        background: var(--primary); color: #fff; border-color: var(--primary);
        width: auto; padding: 0 16px; gap: 6px; font-size: 0.84rem;
        font-weight: 600; font-family: inherit;
    }
    .hdr-call:hover { background: var(--primary-dark); }

    /* ===================== منوی موبایل ===================== */
    #mobile-menu {
        position: fixed; inset: 0; z-index: 999;
        background: var(--overlay); backdrop-filter: blur(8px);
        opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s;
    }
    #mobile-menu.open { opacity: 1; visibility: visible; }
    .mob-panel {
        position: absolute; top: 0; right: 0; bottom: 0;
        width: 300px; max-width: 85vw; background: var(--card);
        transform: translateX(100%); transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
        padding: 80px 30px 30px; overflow-y: auto;
    }
    #mobile-menu.open .mob-panel { transform: translateX(0); }
    .mob-link {
        display: block; padding: 14px 0; font-size: 1.05rem; font-weight: 600;
        color: var(--fg); border-bottom: 1px solid var(--border); transition: color 0.3s, padding-right 0.3s;
    }
    .mob-link:hover { color: var(--primary); padding-right: 10px; }

    /* ===================== مودال جستجو ===================== */
    #search-modal {
        position: fixed; inset: 0; z-index: 2000;
        background: var(--overlay); backdrop-filter: blur(12px);
        opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s;
        display: flex; align-items: flex-start; justify-content: center; padding-top: 120px;
    }
    #search-modal.open { opacity: 1; visibility: visible; }
    .search-box {
        width: 90%; max-width: 640px; background: var(--card);
        border-radius: 16px; box-shadow: 0 20px 60px var(--shadow-lg); overflow: hidden;
        transform: translateY(-20px); transition: transform 0.3s;
    }
    #search-modal.open .search-box { transform: translateY(0); }
    .search-top {
        display: flex; align-items: center; padding: 16px 20px;
        border-bottom: 1px solid var(--border);
    }
    .search-top i { color: var(--muted); font-size: 1.2rem; margin-left: 12px; }
    .search-top input {
        flex: 1; border: none; outline: none; background: transparent;
        font-family: inherit; font-size: 1.1rem; color: var(--fg);
    }
    .search-top input::placeholder { color: var(--muted); }
    .search-results { max-height: 400px; overflow-y: auto; padding: 8px; }
    .sr-item { padding: 12px 16px; border-radius: 10px; cursor: pointer; transition: background 0.2s; }
    .sr-item:hover { background: var(--bg-alt); }
    .sr-item h4 { font-size: 0.95rem; font-weight: 600; color: var(--fg); }
    .sr-item p { font-size: 0.82rem; color: var(--muted); margin-top: 2px; }
    .sr-empty { padding: 30px; text-align: center; color: var(--muted); }

    /* ===================== هیرو ===================== */
    .hero {
        position: relative; min-height: 100vh; display: flex; align-items: center;
        background: linear-gradient(135deg, var(--primary-dark) 0%, #0A2E1A 50%, #071A0F 100%);
        overflow: hidden;
    }
    .hero-glow {
        position: absolute; inset: 0;
        background-image:
            radial-gradient(circle at 20% 80%, rgba(var(--accent-rgb),0.08) 0%, transparent 50%),
            radial-gradient(circle at 80% 20%, rgba(var(--primary-rgb),0.15) 0%, transparent 50%);
    }
    .hero-grid {
        position: absolute; inset: 0;
        background-image:
            linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
        background-size: 60px 60px;
        animation: gridMove 20s linear infinite;
    }
    @keyframes gridMove { 0% { transform: translate(0,0); } 100% { transform: translate(60px,60px); } }
    .hero-badge {
        display: inline-flex; align-items: center; gap: 8px;
        background: rgba(var(--accent-rgb),0.15); border: 1px solid rgba(var(--accent-rgb),0.3);
        color: var(--accent-light); padding: 6px 16px; border-radius: 50px; font-size: 0.82rem; font-weight: 500;
    }
    .hero-title {
        font-size: clamp(2.2rem, 5vw, 3.8rem); font-weight: 900;
        color: #fff; line-height: 1.3; margin-top: 20px;
    }
    .hero-title .hl {
        background: linear-gradient(135deg, var(--accent), var(--accent-light));
        -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }
    .hero-desc { font-size: 1.05rem; color: rgba(255,255,255,0.7); line-height: 1.9; margin-top: 20px; max-width: 520px; }
    .hero-stats { display: flex; gap: 40px; margin-top: 40px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,0.1); }
    .hero-stat-n { font-size: 2rem; font-weight: 900; color: var(--accent); }
    .hero-stat-l { font-size: 0.82rem; color: rgba(255,255,255,0.5); margin-top: 2px; }
    .hero-img-col { position: relative; display: flex; align-items: center; justify-content: center; }
    .hero-img-frame {
        width: 340px; height: 440px; border-radius: 200px 200px 30px 30px;
        overflow: hidden; border: 3px solid rgba(var(--accent-rgb),0.3);
        box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    }
    .hero-img-frame img { width: 100%; height: 100%; object-fit: cover; }
    .hero-float {
        position: absolute; background: var(--card); border-radius: 14px;
        padding: 14px 18px; box-shadow: 0 10px 30px rgba(0,0,0,0.2);
        display: flex; align-items: center; gap: 12px; animation: floatY 3s ease-in-out infinite;
    }
    @keyframes floatY { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
    .hero-float.f1 { bottom: 60px; right: -20px; }
    .hero-float.f2 { top: 80px; left: -30px; animation-delay: 1.5s; }
    .hf-icon {
        width: 42px; height: 42px; border-radius: 10px;
        display: flex; align-items: center; justify-content: center; font-size: 1.1rem;
    }
    .hf-icon.g { background: rgba(var(--primary-rgb),0.12); color: var(--primary); }
    .hf-icon.a { background: rgba(var(--accent-rgb),0.15); color: var(--accent); }
    .hf-sm { font-size: 0.72rem; color: var(--muted); }
    .hf-val { font-size: 0.9rem; font-weight: 700; color: var(--fg); }

    /* ===================== دکمه‌ها ===================== */
    .btn-p {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 14px 32px; background: var(--primary); color: #fff;
        border: none; border-radius: 12px; font-family: inherit;
        font-size: 0.95rem; font-weight: 600; cursor: pointer;
        transition: all 0.3s; box-shadow: 0 4px 15px rgba(var(--primary-rgb),0.3);
    }
    .btn-p:hover { background: var(--primary-dark); transform: translateY(-2px); box-shadow: 0 8px 25px rgba(var(--primary-rgb),0.4); }
    .btn-o {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 14px 32px; background: transparent; color: #fff;
        border: 1.5px solid rgba(255,255,255,0.3); border-radius: 12px;
        font-family: inherit; font-size: 0.95rem; font-weight: 600; cursor: pointer; transition: all 0.3s;
    }
    .btn-o:hover { border-color: var(--accent); color: var(--accent); background: rgba(var(--accent-rgb),0.08); }
    .btn-a {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 12px 28px; background: var(--accent); color: var(--primary-dark);
        border: none; border-radius: 12px; font-family: inherit;
        font-size: 0.9rem; font-weight: 700; cursor: pointer; transition: all 0.3s;
    }
    .btn-a:hover { background: var(--accent-light); transform: translateY(-2px); }

    /* ===================== بخش‌های مشترک ===================== */
    .sec-badge {
        display: inline-flex; align-items: center; gap: 8px;
        background: rgba(var(--primary-rgb),0.08); color: var(--primary);
        padding: 6px 16px; border-radius: 50px; font-size: 0.82rem; font-weight: 600;
    }
    .sec-title { font-size: clamp(1.6rem,3vw,2.4rem); font-weight: 900; color: var(--fg); line-height: 1.4; margin-top: 14px; }
    .sec-desc { font-size: 1rem; color: var(--fg-sec); max-width: 560px; margin-top: 12px; }

    /* ===================== کارت خدمات ===================== */
    .svc-card {
        background: var(--card); border: 1px solid var(--border);
        border-radius: 16px; padding: 32px 24px; transition: all 0.35s; position: relative; overflow: hidden; cursor: pointer;
    }
    .svc-card::before {
        content: ''; position: absolute; top: 0; right: 0; left: 0; height: 3px;
        background: var(--primary); transform: scaleX(0); transform-origin: right; transition: transform 0.35s;
    }
    .svc-card:hover { transform: translateY(-6px); box-shadow: 0 12px 40px var(--shadow); }
    .svc-card:hover::before { transform: scaleX(1); }
    .svc-icon {
        width: 56px; height: 56px; border-radius: 14px;
        display: flex; align-items: center; justify-content: center;
        background: rgba(var(--primary-rgb),0.08); color: var(--primary);
        font-size: 1.3rem; transition: all 0.3s;
    }
    .svc-card:hover .svc-icon { background: var(--primary); color: #fff; }
    .svc-card h3 { font-size: 1.1rem; font-weight: 700; margin-top: 18px; color: var(--fg); }
    .svc-card p { font-size: 0.88rem; color: var(--fg-sec); margin-top: 10px; line-height: 1.8; }
    .svc-more {
        display: inline-flex; align-items: center; gap: 6px;
        margin-top: 16px; font-size: 0.85rem; font-weight: 600;
        color: var(--primary); transition: gap 0.3s;
    }
    .svc-card:hover .svc-more { gap: 10px; }

    /* ===================== درباره ما ===================== */
    .about-img-wrap { position: relative; border-radius: 20px; overflow: hidden; }
    .about-img-wrap img { width: 100%; height: 400px; object-fit: cover; }
    .about-exp {
        position: absolute; bottom: 20px; left: 20px;
        background: var(--primary); color: #fff; padding: 16px 22px;
        border-radius: 14px; text-align: center; box-shadow: 0 8px 25px rgba(var(--primary-rgb),0.4);
    }
    .about-exp .n { font-size: 2.2rem; font-weight: 900; line-height: 1; }
    .about-exp .l { font-size: 0.78rem; margin-top: 4px; opacity: 0.9; }
    .about-feat {
        display: flex; align-items: flex-start; gap: 12px;
        padding: 14px; border-radius: 12px; background: var(--bg-alt); transition: all 0.3s;
    }
    .about-feat:hover { background: rgba(var(--primary-rgb),0.08); }
    .about-feat i {
        width: 32px; height: 32px; border-radius: 8px;
        display: flex; align-items: center; justify-content: center;
        background: var(--primary); color: #fff; font-size: 0.8rem;
        flex-shrink: 0; margin-top: 2px;
    }
    .about-feat h4 { font-size: 0.92rem; font-weight: 700; color: var(--fg); }
    .about-feat p { font-size: 0.82rem; color: var(--fg-sec); margin-top: 2px; }

    /* ===================== کارت تیم ===================== */
    .team-card {
        background: var(--card); border: 1px solid var(--border);
        border-radius: 16px; overflow: hidden; transition: all 0.35s;
    }
    .team-card:hover { transform: translateY(-6px); box-shadow: 0 12px 40px var(--shadow); }
    .team-img { height: 280px; overflow: hidden; position: relative; }
    .team-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
    .team-card:hover .team-img img { transform: scale(1.06); }
    .team-ov {
        position: absolute; inset: 0;
        background: linear-gradient(to top, rgba(0,0,0,0.6), transparent 60%);
        display: flex; align-items: flex-end; justify-content: center;
        padding-bottom: 16px; gap: 10px; opacity: 0; transition: opacity 0.3s;
    }
    .team-card:hover .team-ov { opacity: 1; }
    .team-sb {
        width: 36px; height: 36px; border-radius: 50%;
        background: rgba(255,255,255,0.2); backdrop-filter: blur(6px);
        display: flex; align-items: center; justify-content: center;
        color: #fff; font-size: 0.85rem; border: none; cursor: pointer; transition: all 0.3s;
    }
    .team-sb:hover { background: var(--accent); color: var(--primary-dark); }
    .team-body { padding: 20px; text-align: center; }
    .team-body h3 { font-size: 1.05rem; font-weight: 700; color: var(--fg); }
    .team-body .role { font-size: 0.82rem; color: var(--primary); font-weight: 600; margin-top: 4px; }
    .team-body .bio { font-size: 0.82rem; color: var(--fg-sec); margin-top: 8px; line-height: 1.7; }

    /* ===================== کارت پرونده ===================== */
    .case-card {
        background: var(--card); border: 1px solid var(--border);
        border-radius: 16px; overflow: hidden; transition: all 0.35s;
    }
    .case-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px var(--shadow); }
    .case-img { height: 200px; overflow: hidden; position: relative; }
    .case-img img { width: 100%; height: 100%; object-fit: cover; }
    .case-tag {
        position: absolute; top: 14px; right: 14px;
        background: var(--accent); color: var(--primary-dark);
        padding: 4px 12px; border-radius: 50px; font-size: 0.75rem; font-weight: 700;
    }
    .case-res {
        position: absolute; bottom: 14px; left: 14px;
        background: var(--success); color: #fff;
        padding: 4px 12px; border-radius: 50px; font-size: 0.75rem; font-weight: 600;
    }
    .case-body { padding: 20px; }
    .case-body h3 { font-size: 1rem; font-weight: 700; color: var(--fg); }
    .case-body p { font-size: 0.84rem; color: var(--fg-sec); margin-top: 8px; line-height: 1.8; }

    /* ===================== کارت نظر ===================== */
    .testi-card {
        background: var(--card); border: 1px solid var(--border);
        border-radius: 16px; padding: 28px; position: relative; transition: all 0.3s;
    }
    .testi-card:hover { box-shadow: 0 8px 30px var(--shadow); }
    .testi-card .qi { position: absolute; top: 20px; left: 20px; font-size: 2rem; color: rgba(var(--primary-rgb),0.1); }
    .testi-stars { color: var(--accent); font-size: 0.85rem; margin-bottom: 12px; }
    .testi-text { font-size: 0.92rem; color: var(--fg-sec); line-height: 1.9; }
    .testi-auth { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
    .testi-av { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 2px solid var(--border); }
    .testi-nm { font-size: 0.9rem; font-weight: 700; color: var(--fg); }
    .testi-rl { font-size: 0.78rem; color: var(--muted); }

    /* ===================== فرم تماس ===================== */
    .ci-card {
        display: flex; align-items: flex-start; gap: 14px;
        padding: 20px; border-radius: 14px; background: var(--bg-alt); transition: all 0.3s;
    }
    .ci-card:hover { background: rgba(var(--primary-rgb),0.08); }
    .ci-ico {
        width: 46px; height: 46px; border-radius: 12px;
        display: flex; align-items: center; justify-content: center;
        background: var(--primary); color: #fff; font-size: 1rem; flex-shrink: 0;
    }
    .ci-card h4 { font-size: 0.88rem; font-weight: 700; color: var(--fg); }
    .ci-card p { font-size: 0.84rem; color: var(--fg-sec); margin-top: 2px; }
    .fg { margin-bottom: 18px; }
    .fl { display: block; font-size: 0.85rem; font-weight: 600; color: var(--fg); margin-bottom: 6px; }
    .fi, .fs, .ft {
        width: 100%; padding: 12px 16px; background: var(--bg-alt);
        border: 1.5px solid var(--border); border-radius: 12px;
        font-family: inherit; font-size: 0.92rem; color: var(--fg);
        transition: all 0.3s; outline: none;
    }
    .fi:focus, .fs:focus, .ft:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(var(--primary-rgb),0.12); }
    .fi.err, .ft.err { border-color: var(--error); }
    .fi.ok, .ft.ok { border-color: var(--success); }
    .fe { font-size: 0.78rem; color: var(--error); margin-top: 4px; display: none; }
    .fe.show { display: block; }
    .ft { min-height: 120px; resize: vertical; }
    .rc-box {
        display: flex; align-items: center; gap: 10px;
        padding: 14px 18px; background: var(--bg-alt);
        border: 1.5px solid var(--border); border-radius: 12px;
        cursor: pointer; transition: all 0.3s; user-select: none;
    }
    .rc-box:hover { border-color: var(--primary); }
    .rc-box.ck { border-color: var(--success); background: rgba(var(--primary-rgb),0.05); }
    .rc-cb {
        width: 24px; height: 24px; border: 2px solid var(--border);
        border-radius: 4px; display: flex; align-items: center;
        justify-content: center; transition: all 0.3s; flex-shrink: 0;
    }
    .rc-box.ck .rc-cb { background: var(--success); border-color: var(--success); color: #fff; }
    .lw-pill {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; border: 1.5px solid var(--border); border-radius: 12px;
        background: var(--bg-alt); cursor: pointer; transition: all 0.3s; font-size: 0.88rem; color: var(--fg-sec); font-weight: 600;
    }
    .lw-pill:hover { border-color: var(--primary); }
    .lw-pill.sel { border-color: var(--primary); background: rgba(var(--primary-rgb),0.08); color: var(--primary); }
    .lw-pill i { font-size: 0.8rem; opacity: 0; transition: opacity 0.2s; }
    .lw-pill.sel i { opacity: 1; }

    /* ===================== فوتر ===================== */
    #site-footer { background: var(--primary-dark); color: rgba(255,255,255,0.8); position: relative; overflow: hidden; }
    #site-footer::before {
        content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
        background: linear-gradient(90deg, var(--accent), var(--primary-light), var(--accent));
    }
    .ft-link {
        display: block; padding: 5px 0; font-size: 0.88rem;
        color: rgba(255,255,255,0.65); transition: all 0.3s;
    }
    .ft-link:hover { color: var(--accent); padding-right: 8px; }
    .ft-soc {
        width: 40px; height: 40px; border-radius: 10px;
        display: flex; align-items: center; justify-content: center;
        background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.6);
        border: 1px solid rgba(255,255,255,0.1); transition: all 0.3s; cursor: pointer;
    }
    .ft-soc:hover { background: var(--accent); color: var(--primary-dark); border-color: var(--accent); }

    /* ===================== عناصر شناور ===================== */
    .fab-wa {
        position: fixed; bottom: 100px; left: 24px; z-index: 900;
        width: 56px; height: 56px; border-radius: 50%; background: #25D366; color: #fff;
        border: none; font-size: 1.5rem; cursor: pointer;
        box-shadow: 0 4px 20px rgba(37,211,102,0.4);
        display: flex; align-items: center; justify-content: center; transition: all 0.3s;
        animation: waPulse 2s infinite;
    }
    .fab-wa:hover { transform: scale(1.1); }
    @keyframes waPulse {
        0%,100% { box-shadow: 0 4px 20px rgba(37,211,102,0.4); }
        50% { box-shadow: 0 4px 30px rgba(37,211,102,0.6), 0 0 0 8px rgba(37,211,102,0.1); }
    }
    .fab-ct {
        position: fixed; bottom: 32px; left: 24px; z-index: 900;
        width: 56px; height: 56px; border-radius: 50%; background: var(--primary); color: #fff;
        border: none; font-size: 1.2rem; cursor: pointer;
        box-shadow: 0 4px 20px rgba(var(--primary-rgb),0.4);
        display: flex; align-items: center; justify-content: center; transition: all 0.3s;
    }
    .fab-ct:hover { transform: scale(1.1); }
    .fab-ct.open { transform: rotate(45deg); }
    .fab-mn {
        position: fixed; bottom: 100px; left: 24px; z-index: 899;
        display: flex; flex-direction: column; gap: 12px;
        opacity: 0; visibility: hidden; transform: translateY(20px); transition: all 0.3s;
    }
    .fab-mn.show { opacity: 1; visibility: visible; transform: translateY(0); }
    .fab-mi { display: flex; align-items: center; gap: 10px; flex-direction: row-reverse; }
    .fab-mb {
        width: 44px; height: 44px; border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        border: none; cursor: pointer; font-size: 1rem; color: #fff;
        transition: all 0.3s; box-shadow: 0 3px 12px rgba(0,0,0,0.2);
    }
    .fab-ml {
        background: var(--card); color: var(--fg); padding: 6px 12px;
        border-radius: 8px; font-size: 0.8rem; font-weight: 600;
        box-shadow: 0 2px 10px var(--shadow); white-space: nowrap;
    }
    .btt {
        position: fixed; bottom: 32px; right: 24px; z-index: 900;
        width: 46px; height: 46px; border-radius: 50%; background: var(--card);
        color: var(--primary); border: 1px solid var(--border); font-size: 1rem;
        cursor: pointer; display: flex; align-items: center; justify-content: center;
        opacity: 0; visibility: hidden; transform: translateY(20px); transition: all 0.3s;
        box-shadow: 0 4px 15px var(--shadow);
    }
    .btt.show { opacity: 1; visibility: visible; transform: translateY(0); }
    .btt:hover { background: var(--primary); color: #fff; }

    /* ===================== اعلان کوکی ===================== */
    #cookie-bn {
        position: fixed; bottom: 0; right: 0; left: 0; z-index: 950;
        background: var(--card); border-top: 1px solid var(--border);
        box-shadow: 0 -4px 20px var(--shadow); padding: 18px 24px;
        transform: translateY(100%); transition: transform 0.4s cubic-bezier(0.4,0,0.2,1);
    }
    #cookie-bn.show { transform: translateY(0); }
    .ck-btn {
        padding: 10px 24px; border-radius: 10px; font-family: inherit;
        font-size: 0.85rem; font-weight: 600; cursor: pointer; border: none; transition: all 0.3s;
    }
    .ck-acc { background: var(--primary); color: #fff; }
    .ck-acc:hover { background: var(--primary-dark); }
    .ck-rej { background: var(--bg-alt); color: var(--fg-sec); border: 1px solid var(--border) !important; }
    .ck-rej:hover { background: var(--border); }

    /* ===================== توست ===================== */
    .toast-c { position: fixed; top: 90px; left: 24px; z-index: 3000; display: flex; flex-direction: column; gap: 10px; }
    .toast {
        padding: 14px 20px; border-radius: 12px; background: var(--card);
        border: 1px solid var(--border); box-shadow: 0 8px 30px var(--shadow-lg);
        display: flex; align-items: center; gap: 12px; font-size: 0.88rem; color: var(--fg);
        transform: translateX(-120%); transition: transform 0.4s cubic-bezier(0.4,0,0.2,1); max-width: 360px;
    }
    .toast.show { transform: translateX(0); }
    .toast.success .ti { color: var(--success); }
    .toast.error .ti { color: var(--error); }
    .toast.warning .ti { color: var(--warning); }

    /* ===================== صفحات قانونی ===================== */
    .lp { padding-top: 100px; min-height: 100vh; }
    .lc {
        background: var(--card); border: 1px solid var(--border);
        border-radius: 16px; padding: 40px; line-height: 2; font-size: 0.92rem; color: var(--fg-sec);
    }
    .lc h2 { font-size: 1.3rem; font-weight: 800; color: var(--fg); margin: 28px 0 12px; }
    .lc h2:first-child { margin-top: 0; }
    .lc ul { padding-right: 20px; margin: 10px 0; }
    .lc li { margin: 6px 0; }

    /* ===================== نقشه سایت ===================== */
    .sm-sec { margin-bottom: 24px; }
    .sm-sec h3 {
        font-size: 1.1rem; font-weight: 700; color: var(--primary);
        padding-bottom: 10px; border-bottom: 2px solid rgba(var(--primary-rgb),0.15); margin-bottom: 12px;
    }
    .sm-link {
        display: block; padding: 8px 16px; font-size: 0.9rem; color: var(--fg-sec);
        border-radius: 8px; transition: all 0.3s;
    }
    .sm-link:hover { background: rgba(var(--primary-rgb),0.06); color: var(--primary); padding-right: 24px; }

    /* ===================== صفحه 404 ===================== */
    .p404 { min-height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 40px 20px; }
    .e404 {
        font-size: clamp(6rem,15vw,12rem); font-weight: 900; line-height: 1;
        background: linear-gradient(135deg, var(--primary), var(--accent));
        -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }

    /* ===================== انیمیشن ورود ===================== */
    .rv { opacity: 0; transform: translateY(30px); transition: opacity 0.7s, transform 0.7s; }
    .rv.vis { opacity: 1; transform: translateY(0); }
    .rv-d1 { transition-delay: 0.1s; }
    .rv-d2 { transition-delay: 0.2s; }
    .rv-d3 { transition-delay: 0.3s; }
    .rv-d4 { transition-delay: 0.4s; }
    .rv-d5 { transition-delay: 0.5s; }

    /* ===================== سیستم صفحات ===================== */
    [data-page] { display: none; }
    [data-page].active { display: block; }

/* ===================== استایل‌های اختصاصی صفحات پروفایل وکلا ===================== */
.chip { display:inline-block; padding:6px 14px; background:rgba(255,255,255,0.15); color:#fff; border-radius:20px; font-size:0.78rem; font-weight:600; border:1px solid rgba(255,255,255,0.25); }
.lw-banner { position:relative; border-radius:22px; overflow:hidden; background:linear-gradient(135deg, var(--primary-dark) 0%, #0A2E1A 55%, #071A0F 100%); padding:48px 32px 84px; }
.lw-banner::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle at 15% 20%, rgba(var(--accent-rgb),0.18) 0%, transparent 55%), radial-gradient(circle at 85% 80%, rgba(var(--primary-rgb),0.25) 0%, transparent 55%); }
.lw-banner-inner { position:relative; z-index:1; }
.lw-banner h1 { font-size:1.5rem; font-weight:900; color:#fff; }
.lw-banner .lw-role { font-size:0.92rem; color:var(--accent-light); font-weight:700; margin-top:4px; }
.lw-avatar-wrap { position:relative; margin-top:-64px; padding:0 32px; z-index:2; display:flex; align-items:flex-end; gap:22px; flex-wrap:wrap; }
.lw-avatar { width:128px; height:128px; border-radius:20px; object-fit:cover; border:5px solid var(--card); box-shadow:0 12px 30px var(--shadow-lg); flex-shrink:0; }
.lw-trust { display:flex; align-items:center; gap:10px; padding:16px; background:var(--card); border:1px solid var(--border); border-radius:14px; }
.lw-trust i { width:38px; height:38px; border-radius:10px; background:rgba(var(--primary-rgb),0.1); color:var(--primary); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.lw-trust h5 { font-size:0.85rem; font-weight:700; color:var(--fg); }
.lw-trust p { font-size:0.74rem; color:var(--muted); margin-top:1px; }
@media (max-width: 640px) {
    .lw-banner { padding:36px 20px 76px; border-radius:18px; }
    .lw-banner h1 { font-size:1.25rem; }
    .lw-avatar-wrap { padding:0 8px; justify-content:center; text-align:center; margin-top:-56px; }
    .lw-avatar { width:104px; height:104px; }
}

    /* ===================== ریسپانسیو جامع موبایل — دسکتاپ دست‌نخورده باقی می‌ماند ===================== */
    @media (max-width: 1023px) {
        /* هیرو صفحه اصلی: چون تصویر کنار متن روی موبایل/تبلت دیده نمی‌شود،
           همان تصویر به‌صورت بک‌گراند کم‌رنگ پشت متن قرار می‌گیرد */
        .hero {
            background-image:
                linear-gradient(180deg, rgba(10,26,15,0.94) 0%, rgba(10,26,15,0.96) 55%, rgba(7,26,15,0.98) 100%),
                url('https://picsum.photos/seed/lawyer-hero/900/1400.jpg');
            background-size: cover;
            background-position: center top;
        }
        .hero-img-col { display: none; }
    }

    @media (max-width: 768px) {
        .hero { min-height: auto; padding: 120px 0 56px; }
        .hero-badge { font-size: 0.74rem; padding: 5px 12px; }
        .hero-title { font-size: clamp(1.8rem, 7.5vw, 2.3rem); margin-top: 16px; }
        .hero-desc { font-size: 0.92rem; margin-top: 14px; }
        .hero-stats { gap: 22px; margin-top: 28px; padding-top: 22px; flex-wrap: wrap; }
        .hero-stat-n { font-size: 1.5rem; }
        .hero-stat-l { font-size: 0.72rem; }

        /* عنوان و توضیح بخش‌ها */
        .sec-title { font-size: clamp(1.35rem, 6.5vw, 1.75rem); margin-top: 10px; }
        .sec-desc { font-size: 0.85rem; }
        .sec-badge { font-size: 0.76rem; padding: 5px 14px; }

        /* کارت‌های خدمات */
        .svc-card { padding: 22px 18px; }
        .svc-card h3 { font-size: 1.02rem; }
        .svc-card p { font-size: 0.84rem; }

        /* درباره ما */
        .about-img-wrap img { height: 260px; }
        .about-exp { padding: 10px 16px; }
        .about-exp .n { font-size: 1.7rem; }
        .about-feat h4 { font-size: 0.88rem; }
        .about-feat p { font-size: 0.78rem; }

        /* تیم و نظرات موکلین/وکلا */
        .team-img { height: 230px; }
        .testi-card { padding: 22px 18px; }
        .testi-text { font-size: 0.85rem; }

        /* فرم تماس با ما */
        .fg { margin-bottom: 16px; }
        .fi, .fs, .ft, .lw-trigger { font-size: 0.86rem; padding: 12px 14px; }
        .lw-dropdown { max-height: 220px; overflow-y: auto; }
        .lw-table td { padding: 11px 14px; font-size: 0.85rem; }

        /* جدول اطلاعات تماس */
        .ci-table { font-size: 0.8rem; }
        .ci-table td { padding: 11px 6px; }
        .ci-table td:nth-child(2) { padding-left: 10px; }

        /* فوتر */
        #site-footer { text-align: center; }
        #site-footer .flex.items-start,
        #site-footer .flex.items-center { justify-content: center; }

        /* لیست چیپ‌های صفحه پروفایل وکیل */
        .chip { font-size: 0.72rem; padding: 5px 12px; }

        /* دکمه‌های شناور */
        .fab-wa { bottom: 90px; left: 16px; width: 48px; height: 48px; font-size: 1.3rem; }
        .fab-ct { bottom: 28px; left: 16px; width: 48px; height: 48px; }
        .fab-mn { bottom: 88px; left: 16px; }
        .btt { bottom: 28px; right: 16px; width: 40px; height: 40px; }

        .lc { padding: 24px 18px; }
    }

    @media (max-width: 420px) {
        .hero-title { font-size: 1.65rem; }
        .hero-stats { gap: 16px 26px; }
        .hero-stat-n { font-size: 1.3rem; }
        .sec-title { font-size: 1.3rem; }
    }

    /* ===================== کاهش حرکت ===================== */
    @media (prefers-reduced-motion: reduce) {
        *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
    }

    /* ===================== اسکرولبار ===================== */
    ::-webkit-scrollbar { width: 8px; }
    ::-webkit-scrollbar-track { background: var(--bg); }
    ::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
    ::-webkit-scrollbar-thumb:hover { background: var(--muted); }

/* ===================== منوی کشویی انتخاب وکیل (بالا باز می‌شود) ===================== */
.lw-trigger {
    display: flex; align-items: center; justify-content: space-between;
    cursor: pointer; width: 100%; text-align: right; background: var(--bg-alt);
}
.lw-trigger i { color: var(--muted); transition: transform 0.25s; font-size: 0.8rem; }
.lw-trigger.open i { transform: rotate(180deg); color: var(--primary); }
.lw-dropdown-wrap { position: relative; }
.lw-dropdown {
    position: absolute; bottom: calc(100% + 8px); right: 0; left: 0;
    background: var(--card); border: 1px solid var(--border); border-radius: 12px;
    box-shadow: 0 -12px 32px var(--shadow); overflow: hidden; z-index: 60;
    opacity: 0; visibility: hidden; transform: translateY(8px); transition: all 0.2s;
}
.lw-dropdown.open { opacity: 1; visibility: visible; transform: translateY(0); }
.lw-table { width: 100%; border-collapse: collapse; }
.lw-table tr { cursor: pointer; transition: background 0.2s; }
.lw-table tr:not(:last-child) td { border-bottom: 1px solid var(--border); }
.lw-table td { padding: 13px 18px; font-size: 0.9rem; font-weight: 600; color: var(--fg-sec); }
.lw-table tr:hover td, .lw-table tr.sel td { background: rgba(var(--primary-rgb), 0.08); color: var(--primary); }
.lw-table tr.sel td::after { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; float: left; }

/* ===================== جدول اطلاعات تماس ===================== */
.ci-table-wrap { overflow-x: auto; }
.ci-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; table-layout: auto; }
.ci-table tr:not(:last-child) td { border-bottom: 1px solid var(--border); }
.ci-table td { padding: 14px 8px; vertical-align: top; color: var(--fg-sec); line-height: 1.9; }
.ci-table td:first-child { width: 32px; color: var(--primary); font-size: 1rem; text-align: center; white-space: nowrap; }
.ci-table td:nth-child(2) { font-weight: 700; color: var(--fg); white-space: nowrap; padding-left: 14px; }
.ci-table td:nth-child(3) { min-width: 160px; }
.ci-table a { color: var(--fg-sec); }
.ci-table a:hover { color: var(--primary); }