.contact-map-container { width: 100%; height: 500px; margin-bottom: 30px; border-radius: 5px; overflow: hidden; box-shadow: 0 4px 24px rgba(44, 62, 80, 0.10); position: relative; background: var(--C2); }
    .leaflet-container { width: 100% !important; height: 100% !important; border-radius: 5px; font-family: var(--font-family) !important; }
    .leaflet-popup-content { direction: rtl; text-align: right; font-family: var(--font-family) !important; }
    .leaflet-popup-content b { font-weight: 700; font-size: 0.95rem; color: var(--C6); }
    .leaflet-popup-content p { margin: 4px 0; font-size: 0.85rem; color: var(--C6); }
    .leaflet-popup-content a { color: var(--C1); text-decoration: none; font-weight: 500; transition: color 0.2s; }
    .leaflet-popup-content a:hover { color: var(--C7); }
    .leaflet-popup-close-button { right: auto !important; left: 0 !important; }
    .leaflet-control-zoom { border: none !important; box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important; }
    .leaflet-control-zoom a { background: var(--C2) !important; color: var(--C6) !important; border: none !important; }
    .leaflet-control-zoom a:hover { background: var(--C4) !important; }
    .leaflet-control-zoom-in, .leaflet-control-zoom-out { font-family: var(--font-family) !important; }
    .leaflet-marker-icon, .leaflet-marker-shadow { width: 40px !important; height: auto !important; }
    .contact-info { position: sticky; top: 118px; background: var(--C2); border-radius: 5px; box-shadow: 0 2px 12px rgba(44, 62, 80, 0.07); padding: 32px 24px; margin-bottom: 24px; transition: box-shadow 0.3s; }
    .contact-info-item { display: flex; align-items: flex-start; margin-bottom: 20px; }
    .contact-info-item i { font-size: 2rem; color: var(--C3); margin-left: 18px; margin-top: -2px; flex-shrink: 0; }
    :root[data-bs-theme="dark"] .contact-info-item i { filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.35)); }
    :root[data-bs-theme="dark"] .contact-form .btn-outline-secondary { color: var(--C6); border-color: var(--C5); }
    :root[data-bs-theme="dark"] .contact-form .btn-outline-secondary:hover,
    :root[data-bs-theme="dark"] .contact-form .btn-outline-secondary:focus { color: var(--C8); background-color: var(--C3); border-color: var(--C3); }
    :root[data-bs-theme="dark"] .contact-form .btn-outline-secondary .ti { color: inherit; }
    .contact-info-item h3 { font-size: 1.1rem; color: var(--C6); margin-bottom: 2px; font-weight: 700; }
    .contact-info-item p { color: var(--C6); margin-bottom: 0; font-size: 1rem; }
    .contact-info-item a { color: #fff; background: var(--C1); border-radius: 5px; padding: 5px 12px 3px; text-decoration: none; font-weight: 500; margin-top: 4px; display: inline-block; transition: background 0.2s; }
    .contact-info-item span { color: #fff; background: var(--C1); border-radius: 5px; padding: 5px 12px 3px; text-decoration: none; font-weight: 500; margin-top: 4px; display: inline-block; transition: background 0.2s; }
    .contact-info-item a:hover { background: var(--C7); }
    .contact-form { background: var(--C2); border-radius: 5px; box-shadow: 0 2px 12px rgba(44, 62, 80, 0.07); padding: 32px 24px; margin-bottom: 24px; transition: box-shadow 0.3s; }
    .contact-form h2 { font-weight: 700; color: var(--C6); }
    .contact-form .form-label { font-weight: 500; color: var(--C3); }
    .contact-form .form-control { border-radius: 5px; border: 1px solid var(--C5); background: var(--C4); padding: 10px 14px; font-size: 1rem; margin-bottom: 10px; color: var(--C6); transition: border 0.2s, box-shadow 0.2s; }
    .contact-form .form-control:focus { border-color: var(--C1); box-shadow: 0 0 0 2px #cfd8dc; }

    @media (max-width: 767px) {
        .contact-info, .contact-form { padding: 18px 8px; }
        .contact-map-container { height: 250px; }
    }