@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
    --primary-blue: #212529;
    /* Premium Anthracite (Dark Grey) */
    --primary-accent: #343a40;
    /* Lighter Anthracite */
    --accent-yellow: #DEE2E6;
    /* Platinum Grey */
    --accent-yellow-hover: #CED4DA;
    /* Darker Platinum for hover */
    /* Hover Orange */
    /* Hover Orange */
    --text-dark: #1e293b;
    --text-gray: #64748b;
    --border-light: #CED4DA;
    --bg-light: #f8fafc;
    --white: #DEE2E6;
    --font-inter: 'Inter', sans-serif;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --radius-md: 8px;
    --radius-lg: 12px;
}

/* 🇹🇷 Turkish Flag Gradient Text */
.turkiye-flag {
    background: linear-gradient(135deg, #D90429 0%, #ff2944 30%, #ffffff 50%, #ff2944 70%, #D90429 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: flagShine 4s ease-in-out infinite;
    filter: drop-shadow(0 2px 4px rgba(217, 4, 41, 0.2));
}

@keyframes flagShine {
    0% {
        background-position: 0% center;
    }

    50% {
        background-position: 100% center;
    }

    100% {
        background-position: 0% center;
    }
}

/* Overlay for utility pages */
.language-overlay {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 9999;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-inter);
    color: var(--text-dark);
    background-color: var(--bg-light);
    line-height: 1.5;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* MASTER DESIGN (27" Monitor Reference) */
@media (min-width: 1440px) {
    .container {
        max-width: 1400px;
    }

    :root {
        font-size: 18px;
        /* Scale everything up slightly */
    }
}

/* LAPTOP SCALING (1200-1439px) */
@media (min-width: 1200px) and (max-width: 1439px) {
    .container {
        max-width: 1200px;
    }

    :root {
        font-size: 16px;
        /* Standard base size */
    }
}

.site-header .container {
    padding: 0;
}

a {
    text-decoration: none;
    color: inherit;
    transition: all 0.2s;
}

ul {
    list-style: none;
}

.corporate-header {
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    position: sticky;
    top: 0;
    z-index: 1000;
    transition: all 0.3s ease;
}

.corporate-header.scrolled {
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* Header Container & Wrapper */
.header-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}

.header-wrapper {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    height: 90px;
    gap: 60px;
    /* Gruplar aras� zorunlu mesafe */
}

/* Logo Section */
.logo-section {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.logo-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: transform 0.3s ease;
}

.logo-link:hover {
    transform: translateY(-2px);
}

.header-logo-img {
    max-height: 50px;
    width: auto;
    object-fit: contain;
    display: block;
}

/* Main Navigation (Always Centered) */
.main-navigation {
    display: flex;
    justify-content: center;
    padding: 0 40px;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 55px;
}

.nav-link {
    color: #475569;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    padding: 10px 0;
    transition: all 0.3s ease;
    position: relative;
    white-space: nowrap;
}

.nav-link:hover {
    color: #1e293b;
}

.nav-link.active {
    color: #1e293b;
    font-weight: 700;
}

.nav-link.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60%;
    height: 2px;
    background: #cbd5e1;
}

/* Header Right Group & CTA Layout */
.header-right-group {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 25px !important;
}

.cta-section {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    flex-shrink: 0;
}

/* Action Links & Buttons */
.login-link-header {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #475569;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    transition: color 0.2s;
}

.login-link-header:hover {
    color: #1e293b;
}

.cta-button.outline {
    background: white !important;
    border: 1px solid #e2e8f0 !important;
    color: #1e293b !important;
    padding: 10px 20px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.2s !important;
}

.cta-button.outline:hover {
    background: #f8fafc !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.08) !important;
}

.cta-button {
    background: #e2e8f0;
    color: #1e293b;
    padding: 10px 20px;
    border-radius: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.cta-button:hover {
    background: #cbd5e1;
    transform: translateY(-1px);
}

/* Membership Dropdown */
.auth-dropdown {
    position: relative;
    display: inline-block;
}

.auth-dropdown-btn {
    background: white;
    border: 1px solid #e2e8f0;
    color: #1e293b;
    padding: 10px 20px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.auth-dropdown-btn:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
}

.auth-dropdown-btn i.fa-chevron-down {
    font-size: 10px;
    transition: transform 0.3s ease;
}

.auth-dropdown.active .auth-dropdown-btn i.fa-chevron-down {
    transform: rotate(180deg);
}

.auth-dropdown-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: white;
    min-width: 180px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    border: 1px solid #e2e8f0;
    padding: 8px;
    display: none;
    flex-direction: column;
    z-index: 1001;
    animation: slideUp 0.3s ease;
}

.auth-dropdown.active .auth-dropdown-menu {
    display: flex;
}

.auth-dropdown-item {
    padding: 10px 15px;
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all 0.2s;
}

.auth-dropdown-item i {
    width: 16px;
    text-align: center;
}

.auth-dropdown-item:hover {
    background: #f1f5f9;
    color: #1e293b;
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Language Switcher Styles (Dropdown) V2 */
.lang-dropdown-v2 {
    position: relative;
    margin-right: 15px;
    z-index: 1001;
}

.lang-toggle-v2 {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50%;
    border: 1px solid #e2e8f0;
    /* Thin Border */
    cursor: pointer;
    overflow: hidden;
    background: transparent;
    /* Transparent background */
    color: #334155;
    /* Slate Text */
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    box-shadow: none;
    /* Removed shadow for flat look */
}

.lang-toggle-v2:hover {
    transform: scale(1.05);
    border-color: #cbd5e1;
}

.lang-toggle-v2 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    margin: 0;
}

.lang-menu-v2 {
    position: absolute;
    top: 130%;
    right: 0;
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.15);
    padding: 6px;
    min-width: 130px;
    display: none;
    flex-direction: column;
    gap: 4px;
    z-index: 1002;
    border: 1px solid #f1f5f9;
}

.lang-menu-v2.show {
    display: flex;
    animation: fadeInDown 0.2s ease;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.lang-option-v2 {
    display: block;
    padding: 8px 12px;
    text-decoration: none;
    color: #334155;
    font-size: 13px;
    font-weight: 600;
    border-radius: 8px;
    transition: background 0.2s;
    text-align: left;
}

.lang-option-v2:hover {
    background: #f1f5f9;
    color: #2563eb;
}


/* Mobile Adjustments for new header */
@media (max-width: 1024px) {
    .header-wrapper {
        gap: 24px;
    }

    .nav-menu {
        gap: 32px;
    }
}



@media (max-width: 991px) {

    /* Mobile Header Layout */
    .header-wrapper {
        display: flex !important;
        padding: 8px 0;
        gap: 8px;
        /* Reduced gap */
        justify-content: space-between;
        flex-wrap: nowrap;
        /* Prevent wrapping */
    }

    .main-navigation {
        display: none;
    }

    .cta-section {
        display: none;
    }

    /* Logo Section Adjustments */
    .logo-section {
        flex-shrink: 1;
        /* Allow shrinking if needed */
        min-width: 0;
        overflow: hidden;
    }

    .header-logo-img {
        max-height: 35px;
    }



    /* Mobile CTA (Reklam Ver) */
    .mobile-header-cta {
        margin-left: 0 !important;
        font-size: 11px !important;
        /* Smaller font */
        padding: 6px 10px !important;
        /* Smaller padding */
        white-space: nowrap;
        flex-shrink: 0;
    }

    /* Language Flag Fix for Mobile */
    .lang-toggle-v2 img {
        width: 28px !important;
        height: 20px !important;
        object-fit: cover !important;
    }
}

@media (max-width: 480px) {
    .mobile-navigation {
        width: 100%;
        right: -100%;
    }

    .logo-title {
        font-size: 18px;
    }

    .logo-subtitle {
        display: none;
    }
}

.hero-section {
    position: relative;
    height: 600px;
    background-image: url('https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?q=70&w=1200&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    color: var(--white);
    z-index: 20;
}

.hero-bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, rgba(30, 41, 59, 0.95) 0%, rgba(30, 41, 59, 0.7) 100%);
}

.hero-content {
    position: relative;
    z-index: 2;
    width: 100%;
}

.hero-content h1 {
    font-size: 52px;
    font-weight: 700;
    margin-bottom: 10px;
    line-height: 1.2;
}

.hero-subtitle {
    font-size: 16px;
    color: #cbd5e1;
    margin-bottom: 40px;
    max-width: 500px;
}

.hero-search-box {
    margin-top: 40px;
}

.premium-search-container {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    padding: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    max-width: 1200px;
    margin: 0 auto;
    transition: all 0.3s ease;
    position: relative;
    z-index: 100;
}

.premium-search-container:hover {
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.search-input-group {
    flex: 2.5;
    /* Increased to give more space to keyword */
    position: relative;
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    padding: 4px;
    transition: all 0.3s ease;
}

.search-input-group:hover {
    border-color: rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.95);
}

.search-input-group:focus-within {
    border-color: #DEE2E6;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.2);
}

.search-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #64748b;
    transition: all 0.3s ease;
}

.search-input {
    flex: 1;
    border: none;
    background: transparent;
    padding: 0 10px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    /* Slightly smaller */
    color: #212529;
    outline: none;
    font-weight: 500;
}

.search-input::placeholder {
    color: #94a3b8;
    font-weight: 400;
}

.search-select-group {
    flex: 0.8;
    /* Reduced to make city/category boxes smaller */
    position: relative;
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    padding: 4px;
    transition: all 0.3s ease;
}

.search-select-group:hover {
    border-color: rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.95);
}

.select-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #64748b;
    transition: all 0.3s ease;
}

.search-select {
    flex: 1;
    border: none;
    background: transparent;
    padding: 0 10px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    /* Slightly smaller */
    color: #212529;
    outline: none;
    font-weight: 500;
    appearance: none;
    cursor: pointer;
}

.search-select option {
    background: white;
    color: #212529;
}

.search-actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

.search-btn-primary {
    background: #D90429;
    color: #fff;
    border: none;
    padding: 12px 20px;
    /* Reduced padding */
    border-radius: 12px;
    font-weight: 600;
    font-size: 13px;
    /* Smaller font */
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}

.search-btn-primary::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(217, 4, 41, 0.5), transparent);
    transition: all 0.6s ease;
    z-index: 1;
}

.search-btn-primary:hover {
    transform: translateY(-2px) scale(1.02);
    border: 1px solid #D90429;
    box-shadow: 0 0 20px rgba(217, 4, 41, 0.4), 0 4px 15px rgba(217, 4, 41, 0.3);
    background: #b90322;
    color: #fff;
}

.search-btn-primary:hover::before {
    left: 100%;
}

.search-btn-secondary:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #212529;
    transform: translateY(-2px);
}

/* --- Search Suggestions Dropdown --- */
.suggestions-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #DEE2E6;
    border-radius: 16px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
    z-index: 2000;
    display: none;
    overflow: hidden;
    border: 1px solid #CED4DA;
    animation: slideDown 0.3s ease;
}

.suggestions-dropdown.active {
    display: block;
}

.suggestion-item {
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: 0.2s;
    border-bottom: 1px solid #f1f5f9;
}

.suggestion-item:last-child {
    border-bottom: none;
}

.suggestion-item:hover {
    background: #f8fafc;
}

.sugg-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sugg-name {
    font-size: 16px;
    color: #212529;
    font-weight: 700;
}

.sugg-meta {
    font-size: 13px;
    color: #64748b;
}

.suggestion-item i {
    color: #DEE2E6;
    font-size: 14px;
}

.suggestion-item.no-results {
    color: #64748b;
    font-style: italic;
    cursor: default;
    padding: 20px;
    text-align: center;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.suggestion-item strong {
    color: #212529;
}

.btn-search:hover {
    background-color: var(--accent-yellow-hover);
}

/* Categories Section */
.categories-section {
    padding: 40px 0 20px;
    background: var(--white);
    border-bottom: 1px solid var(--border-light);
}

/* Categories Wrapper for Buttons */
.categories-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    /* Moved from list */
}

.categories-list {
    display: flex;
    gap: 20px;
    flex-wrap: nowrap;
    /* Prevent wrapping initially */
    overflow-x: auto;
    /* Enable horizontal scrolling */
    -webkit-overflow-scrolling: touch;
    /* Smooth scrolling on iOS */
    scroll-behavior: smooth;
    width: 100%;
}

.showcase-grid-section {
    padding: 30px 0 50px;
    background: #f8fafc;
}

.showcase-title {
    font-size: 24px;
    color: #334155;
    margin-bottom: 20px;
    font-weight: 700;
}

.showcase-grid-wrapper {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 30px;
    height: 400px;
}

/* Promotional Banner */
.promo-banner-column {
    display: flex;
    flex-direction: column;
    height: 400px;
}

.promo-banner {
    flex: 1;
    background: url('images/advertise-bg.png') center/cover no-repeat;
    border-radius: 20px;
    padding: 32px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    min-height: 400px;
    z-index: 1;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.promo-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.95) 0%, rgba(30, 27, 75, 0.85) 50%, rgba(88, 28, 135, 0.75) 100%);
    z-index: 1;
    transition: all 0.5s ease;
}

.promo-banner:hover::before {
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.9) 0%, rgba(30, 27, 75, 0.8) 50%, rgba(88, 28, 135, 0.7) 100%);
}

.promo-banner:hover {
    transform: translateY(-8px) scale(1.01);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6);
}

.promo-content {
    position: relative;
    z-index: 2;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.promo-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    color: #fbbf24;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 24px;
    border: 1px solid rgba(251, 191, 36, 0.3);
    box-shadow: 0 0 15px rgba(251, 191, 36, 0.1);
}

.promo-title {
    font-size: 32px;
    font-weight: 800;
    color: white;
    line-height: 1.1;
    margin-bottom: 16px;
    letter-spacing: -1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.promo-description {
    font-size: 16px;
    color: #e2e8f0;
    line-height: 1.4;
    margin-bottom: 32px;
    font-weight: 300;
    max-width: 260px;
}



.promo-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #D90429;
    color: #fff;
    padding: 16px 32px;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 700;
    font-size: 15px;
    box-shadow: 0 10px 20px rgba(217, 4, 41, 0.3);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.promo-cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: all 0.6s ease;
}

.promo-cta:hover {
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 15px 30px rgba(217, 4, 41, 0.5);
    background: #ef233c;
}

.promo-cta:hover::before {
    left: 100%;
}


/* Responsive Design for Promo Banner */
@media (max-width: 1024px) {
    .showcase-grid-wrapper {
        grid-template-columns: 1fr;
        height: auto;
        gap: 20px;
    }

    .promo-banner-column {
        height: auto;
        order: 2;
    }

    .main-showcase-slider {
        height: 400px;
        order: 1;
    }

    .promo-banner {
        padding: 24px;
    }

    .promo-title {
        font-size: 20px;
    }

    .promo-icon-large {
        width: 60px;
        height: 60px;
        font-size: 24px;
    }
}

@media (max-width: 991px) {
    .promo-banner {
        padding: 20px;
        text-align: center;
    }

    .promo-title {
        font-size: 18px;
    }

    .promo-description {
        font-size: 13px;
    }

    .promo-cta {
        width: 100%;
    }

    .showcase-grid-wrapper {
        gap: 16px;
    }

    .main-showcase-slider {
        height: 350px;
    }
}

@media (max-width: 480px) {
    .promo-banner {
        padding: 16px;
    }

    .promo-title {
        font-size: 16px;
    }

    .promo-description {
        font-size: 12px;
    }

    .promo-features {
        gap: 8px;
    }

    .promo-feature {
        font-size: 12px;
    }

    .main-showcase-slider {
        height: 300px;
    }
}

/* Main Slider */
.main-showcase-slider {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    background: white;
    height: 100%;
}

.main-slides-container {
    width: 100%;
    height: 100%;
    position: relative;
}

.main-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease;
}

.main-slide.active {
    opacity: 1;
    visibility: visible;
}

/* Split Layout: Image Left, Info Right */
.slide-visual {
    width: 50%;
    height: 100%;
}

.slide-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slide-info {
    width: 50%;
    height: 100%;
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    color: white;
}

/* Themes */
.blue-theme {
    background: #0056b3;
    /* Similar to TatilBudur blue */
}

.purple-theme {
    background: #6b21a8;
}

.info-tag {
    background: white;
    color: #333;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.slide-info h3 {
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 12px;
    line-height: 1.2;
}

.slide-desc {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 24px;
    line-height: 1.5;
}

.btn-showcase {
    background: white;
    color: #333;
    padding: 12px 30px;
    border-radius: 30px;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.btn-showcase:hover {
    transform: scale(1.05);
}

/* Arrows */
.showcase-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: white;
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 10;
    color: #333;
    transition: all 0.2s;
}

.prev-arrow {
    left: 15px;
}

.next-arrow {
    right: 15px;
}

.showcase-arrow:hover {
    background: #f1f5f9;
}

/* Dots */
.showcase-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 10;
}

.showcase-dots .dot {
    width: 8px;
    height: 8px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    cursor: pointer;
}

.showcase-dots .dot.active {
    background: white;
    width: 20px;
    border-radius: 10px;
}

/* Side Banners */
.side-banners-col {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
}

.side-banner-card {
    flex: 1;
    background: white;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    border: 1px solid #CED4DA;
}

.sb-content {
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.sb-content h4 {
    font-size: 16px;
    color: #334155;
    margin-bottom: 15px;
    line-height: 1.4;
}

.btn-sb {
    background: #334155;
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

.sb-image {
    width: 40%;
    height: 100%;
}

.sb-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Responsive Grid */
@media (max-width: 992px) {
    .showcase-grid-wrapper {
        grid-template-columns: 1fr;
        height: auto;
    }

    .main-showcase-slider {
        height: 400px;
    }

    .side-banners-col {
        flex-direction: row;
        height: 150px;
    }
}

@media (max-width: 991px) {
    .main-slide {
        flex-direction: column;
    }

    .slide-visual,
    .slide-info {
        width: 100%;
        height: 50%;
    }

    .slide-info {
        padding: 20px;
    }

    .slide-info h3 {
        font-size: 20px;
    }

    .side-banners-col {
        flex-direction: column;
        height: auto;
    }

    .side-banner-card {
        height: 140px;
    }
}




/* Expanded State for "See All" */
.categories-list.expanded {
    flex-wrap: wrap;
    /* Allow wrapping */
    overflow-x: visible;
    /* Disable scroll */
}

/* Hide scroll buttons when expanded */
.categories-wrapper.expanded .scroll-btn {
    display: none;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.categories-list::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.categories-list {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.scroll-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: var(--white);
    border: 1px solid var(--border-light);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: var(--shadow-md);
    color: var(--primary-blue);
    transition: all 0.2s;
}

.scroll-btn:hover {
    background: var(--accent-yellow);
    border-color: var(--accent-yellow);
}

.scroll-btn.scroll-left {
    left: -60px;
}

.scroll-btn.scroll-right {
    right: -60px;
}

.category-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f8fafc;
    padding: 12px 24px;
    width: auto;
    min-width: fit-content;
    font-size: 14px;
    font-weight: 500;
    border-radius: 25px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    border: 1px solid #CED4DA;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

/* --- Language Switcher --- */
/* Consolidated styles for .lang-switcher (HTML) and .language-switch (Legacy CSS) */
.lang-switcher,
.language-switch {
    display: inline-flex;
    align-items: center;
    margin-left: 15px;
    background: #f1f5f9;
    padding: 2px;
    border-radius: 4px;
    border: 1px solid #CED4DA;
    gap: 2px;
}

.lang-btn {
    padding: 4px 6px;
    font-size: 16px;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    border-radius: 4px;
    border: none;
    background: transparent;
    transition: all 0.2s;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    min-height: 28px;
}

.flag-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    border-radius: 50%;
}

.lang-btn[data-lang="tr"] {
    position: relative;
    z-index: 1;
}

.lang-btn[data-lang="tr"].active {
    background: linear-gradient(45deg, #e30a17, #ff6b6b);
    color: white;
}

.lang-btn[data-lang="en"] {
    position: relative;
    z-index: 1;
}

.lang-btn[data-lang="en"].active {
    background: linear-gradient(45deg, #008000, #4ade80);
    color: white;
}

/* Base state for inactive buttons */
.lang-btn:not(.active) {
    opacity: 0.6;
}

.lang-btn:hover {
    opacity: 1;
    transform: scale(1.1);
}

/* Mobile Menu Adjustments for Lang Switch */
.mobile-menu .language-switch {
    margin: 20px;
    justify-content: center;
    width: calc(100% - 40px);
}

.mobile-menu .lang-btn {
    flex: 1;
    text-align: center;
    padding: 10px;
}



.category-pill i {
    font-size: 20px;
    color: #475569;
}

.category-pill:hover {
    background: linear-gradient(135deg, #DEE2E6, #CED4DA);
    border-color: #DEE2E6;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(251, 191, 36, 0.3);
    color: #212529;
}

.category-pill.active {
    background: linear-gradient(135deg, #212529, #343a40);
    border-color: #212529;
    color: white;
}

.category-pill:hover i,
.category-pill.active i {
    color: inherit;
}

.cat-info {
    display: flex;
    flex-direction: column;
}

.cat-name {
    font-weight: 600;
    font-size: 14px;
    color: var(--text-dark);
}

.cat-count {
    font-size: 11px;
    color: var(--text-gray);
}

.all-categories-link {
    display: block;
    margin-top: 15px;
    color: var(--primary-blue);
    font-size: 14px;
    font-weight: 500;
}

/* Businesses Section */
.businesses-section {
    padding: 60px 0;
}

.section-title h2 {
    font-weight: 400;
    color: var(--text-dark);
    margin-bottom: 30px;
}

.section-title strong {
    font-weight: 800;
}

.business-content-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 30px;
}

.business-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-height: 520px;
    /* Approx height for 3 cards */
    overflow-y: auto;
    padding-right: 10px;
    /* Space for scrollbar */
}

/* Custom Scrollbar for business list */
.business-list::-webkit-scrollbar {
    width: 6px;
}

.business-list::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.business-list::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.business-list::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

.business-card {
    background: var(--white);
    border-radius: 12px;
    padding: 15px;
    display: flex;
    gap: 20px;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-light);
    cursor: pointer;
    /* Added pointer */
    transition: all 0.2s;
    border-left: 4px solid transparent;
}

.business-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.business-card.active-card {
    border-left-color: var(--accent-yellow);
    box-shadow: var(--shadow-md);
    background-color: #fffbeb;
}

.business-image {
    width: 140px;
    height: 120px;
    flex-shrink: 0;
}

.business-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.business-info {
    flex: 1;
}

.business-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
}

.business-header h3 {
    font-size: 16px;
    font-weight: 700;
}

.rating {
    font-size: 12px;
    color: #CED4DA;
}

.rating span {
    color: var(--text-gray);
    margin-left: 5px;
    font-weight: 600;
}

.business-location,
.business-phone {
    font-size: 13px;
    color: var(--text-gray);
    margin-bottom: 5px;
}

.business-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 15px;
}

.btn-action {
    flex: 1;
    text-align: center;
    padding: 8px 0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.btn-action.phone {
    background-color: #f1f5f9;
    color: var(--text-dark);
}

.btn-action.whatsapp {
    background-color: #dcfce7;
    color: #166534;
}

.map-container {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    height: 100%;
    min-height: 400px;
    position: sticky;
    top: 100px;
}

.map-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pin {
    position: absolute;
    color: #ef4444;
    font-size: 24px;
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.3));
}

.pin-1 {
    top: 30%;
    left: 40%;
}

.pin-2 {
    top: 50%;
    left: 60%;
}

.pin-3 {
    top: 70%;
    left: 30%;
}

.pin-4 {
    top: 20%;
    left: 70%;
}

/* --- Stars Section (Professional Light Theme) --- */
/* --- Hero Wave Divider --- */
.hero-section {
    position: relative;
    height: 600px;
    /* Increased height to give space for wave */
    overflow: visible;
    /* Content can breathe */
    z-index: 20;
}

.hero-wave {
    position: absolute;
    bottom: -1px;
    /* Prevent sub-pixel gaps */
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    z-index: 25;
}

.hero-wave svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 100px;
}

.hero-wave .shape-fill {
    fill: #DEE2E6;
    /* Smooth transition to next section */
}

/* --- Stars Section (Independent) --- */
.stars-section {
    padding: 40px 0 60px;
    background: linear-gradient(180deg, #DEE2E6 0%, #f8fafc 100%);
    color: #212529;
    position: relative;
    overflow: hidden;
    z-index: 10;
    border-bottom: 1px solid #CED4DA;
}

.stars-section .container {
    position: relative;
    z-index: 5;
}

.stars-section::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(#cbd5e1 1.2px, transparent 1.2px);
    background-size: 32px 32px;
    opacity: 0.25;
    pointer-events: none;
    z-index: 1;
}

.stars-animation-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.shooting-star {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 100px;
    height: 1px;
    background: linear-gradient(90deg, rgba(251, 191, 36, 0.4), transparent);
    transform: rotate(-45deg);
    opacity: 0;
}

.shooting-star:nth-child(1) {
    animation: star-anim 15s linear infinite;
    animation-delay: 0s;
}

.shooting-star:nth-child(2) {
    animation: star-anim 20s linear infinite;
    animation-delay: 4s;
    top: 10%;
    left: 30%;
}

.shooting-star:nth-child(3) {
    animation: star-anim 18s linear infinite;
    animation-delay: 8s;
    top: 40%;
    left: 0%;
}

.shooting-star:nth-child(4) {
    animation: star-anim 25s linear infinite;
    animation-delay: 2s;
    top: 0%;
    left: 60%;
}

.shooting-star:nth-child(5) {
    animation: star-anim 22s linear infinite;
    animation-delay: 10s;
    top: 60%;
    left: 40%;
}

@keyframes star-anim {
    0% {
        transform: translateX(-200px) translateY(-200px) rotate(-45deg);
        opacity: 0;
    }

    10% {
        opacity: 0.3;
    }

    30% {
        transform: translateX(120vw) translateY(120vh) rotate(-45deg);
        opacity: 0;
    }

    100% {
        transform: translateX(120vw) translateY(120vh) rotate(-45deg);
        opacity: 0;
    }
}

.stars-subtitle {
    font-size: 18px;
    color: #64748b;
    margin-top: -10px;
}

.stars-header {
    text-align: center;
    margin-bottom: 30px;
    position: relative;
    z-index: 2;
}

.stars-header h2 {
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 10px;
    color: #212529;
}

.stars-content-wrap {
    position: relative;
    min-height: 400px;
}

.stars-pane {
    display: none;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    animation: fadeIn 0.6s ease;
}

.stars-pane.active {
    display: grid;
    /* Force grid display for active pane */
}

.star-card {
    background: #DEE2E6;
    border: 1px solid #CED4DA;
    border-radius: 30px;
    padding: 0;
    /* Changed to handle full image layout */
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: visible;
    /* For badges */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
}

.card-badge {
    position: absolute;
    padding: 8px 20px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    color: white;
    z-index: 10;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.card-badge.top-left {
    top: -15px;
    left: 20px;
}

.card-badge.top-center {
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
}

.card-badge.top-right {
    top: -15px;
    right: 20px;
}

.card-badge.blue {
    background: #3b82f6;
}

.card-badge.gold {
    background: #fcd34d;
    color: #92400e;
}

.card-badge.brown {
    background: #d97706;
}

.star-img-wrapper {
    height: 160px;
    position: relative;
    border-radius: 30px 30px 0 0;
    overflow: hidden;
}

.star-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.img-badge {
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    height: 50px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    z-index: 5;
    color: #3b82f6;
    font-size: 20px;
    border: 2px solid #f1f5f9;
}

.card-content {
    padding: 35px 20px 25px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.star-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: #212529;
    margin-bottom: 5px;
}

.star-card .cat {
    font-size: 14px;
    color: #64748b;
    margin-bottom: 12px;
}

.review-count {
    color: #94a3b8;
    font-size: 12px;
    margin-left: 5px;
    font-weight: 500;
}

.view-stats {
    margin-top: 15px;
    padding: 6px 15px;
    background: #f1f5f9;
    border-radius: 20px;
    font-size: 12px;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Featured Gold Card Style */
.star-card.gold-featured {
    border: 3px solid #fcd34d;
    background: white;
}

.featured-card-inner {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.star-img-featured {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 20px;
    border: 4px solid #fef3c7;
}

.star-img-featured img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.featured-btn {
    margin-top: auto;
    background: #fcd34d;
    color: #92400e;
    padding: 8px 30px;
    border-radius: 20px;
    font-weight: 700;
    text-decoration: none;
    font-size: 14px;
    transition: 0.3s;
    margin-bottom: 10px;
}

.featured-btn:hover {
    background: #DEE2E6;
    transform: scale(1.05);
}

.location-badge {
    font-size: 12px;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 5px;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 992px) {
    .stars-pane {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }

    .star-card {
        height: auto;
        min-height: 250px;
    }

    .showcase-slider .owl-nav button {
        /* Move arrows inside or below */
        top: 50%;
        width: 30px;
        height: 30px;
        line-height: 30px;
        font-size: 14px;
        background: rgba(255, 255, 255, 0.9);
        color: #212529;
    }

    .showcase-slider .owl-nav button.owl-prev {
        left: 10px;
    }

    .showcase-slider .owl-nav button.owl-next {
        right: 10px;
    }
}

@media (max-width: 991px) {
    .stars-header h2 {
        font-size: 36px;
    }

    .stars-pane.active {
        display: flex;
        overflow-x: auto;
        gap: 20px;
        padding: 20px 10px 40px;
        /* Bottom padding for shadow and space */
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .stars-pane::-webkit-scrollbar {
        display: none;
    }

    .star-card {
        min-width: 280px;
        flex: 0 0 280px;
        scroll-snap-align: center;
    }

    .stars-tab {
        padding: 10px 20px;
        font-size: 13px;
    }
}


/* Featured Section */
.featured-section {
    padding: 30px 0;
    background: #f8fafc;
    border-bottom: 1px solid #CED4DA;
}

.section-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.section-header-row h3 {
    font-size: 22px;
    color: var(--primary-blue);
    display: flex;
    align-items: center;
    gap: 10px;
}

.badge-premium {
    background: linear-gradient(135deg, #DEE2E6, #CED4DA);
    color: #212529;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 4px rgba(245, 158, 11, 0.3);
}

.view-all-link {
    color: var(--primary-blue);
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.featured-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.featured-list {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    padding: 10px 5px 20px 5px;
    /* Bottom padding for shadow */
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    scrollbar-width: none;
    /* Firefox */
}

.featured-list::-webkit-scrollbar {
    display: none;
    /* Chrome */
}

.featured-card {
    min-width: 260px;
    width: 260px;
    background: white;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    border: 1px solid #CED4DA;
    transition: transform 0.3s, box-shadow 0.3s;
    flex-shrink: 0;
}

.featured-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}

.premium-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(30, 41, 59, 0.9);
    color: #DEE2E6;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 700;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #DEE2E6;
}

.feat-img-holder {
    width: 100%;
    height: 160px;
    overflow: hidden;
}

.feat-img-holder img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.featured-card:hover .feat-img-holder img {
    transform: scale(1.1);
}

.feat-content {
    padding: 15px;
}

.feat-content h4 {
    font-size: 16px;
    margin-bottom: 5px;
    color: var(--primary-blue);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.feat-cat {
    font-size: 13px;
    color: #64748b;
    margin-bottom: 10px;
}

.feat-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    border-top: 1px solid #f1f5f9;
    padding-top: 10px;
}

.feat-rating {
    color: #CED4DA;
    font-weight: 700;
}

.feat-loc {
    color: #94a3b8;
}

.faq-section {
    padding: 100px 0;
    background: #f8fafc;
}

.faq-section .container {
    max-width: 1400px !important;
    padding: 0 40px;
}

.faq-header {
    text-align: center;
    margin-bottom: 60px;
}

.faq-header .section-tag {
    display: inline-block;
    padding: 8px 16px;
    background: #fef3c7;
    color: #d97706;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 16px;
    letter-spacing: 1px;
}

.faq-header h2 {
    font-size: 42px;
    font-weight: 800;
    color: #212529;
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 40px;
    align-items: start;
    /* Align items at the start to respect different heights if min-height wasn't enough, but we use flex */
}

.faq-container-inner {
    width: 100%;
    margin: 0 auto;
}

.faq-hidden-items {
    max-height: 0;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
}

.faq-hidden-items.show {
    max-height: 1000px;
    /* Large enough to show all */
    opacity: 1;
    margin-bottom: 40px;
}

.faq-item {
    background: var(--white);
    border: 1px solid #CED4DA;
    border-radius: 16px;
    margin-bottom: 0;
    /* Grid handles spacing */
    transition: all 0.3s ease;
    overflow: hidden;
    height: 100%;
    /* Fill grid cell height */
    display: flex;
    flex-direction: column;
    min-height: 160px;
    /* Force visual consistency */
}

.faq-item:hover {
    border-color: #DEE2E6;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.faq-item.active {
    border-color: #DEE2E6;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
}

.faq-question {
    padding: 24px 20px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    /* Align text top */
    cursor: pointer;
    font-weight: 700;
    font-size: 16px;
    color: #212529;
    transition: all 0.3s ease;
    width: 100%;
    flex: 1;
    /* Push content down if needed */
    gap: 10px;
}

.faq-question i.fa-chevron-right {
    font-size: 14px;
    color: #94a3b8;
    transition: transform 0.3s ease;
}

.faq-item.active .faq-question i.fa-chevron-right {
    transform: rotate(90deg);
    color: #DEE2E6;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 0 30px;
    opacity: 0;
}

.faq-item.active .faq-answer {
    max-height: 500px;
    /* Arbitrary large height */
    padding: 0 30px 24px;
    opacity: 1;
}

.faq-answer p {
    font-size: 16px;
    line-height: 1.6;
    color: #64748b;
}

.faq-actions {
    text-align: center;
    margin-top: 20px;
}

.btn-view-all {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #DEE2E6, #CED4DA);
    color: #212529;
    border: 1px solid rgba(255, 255, 255, 0.5);
    padding: 14px 32px;
    border-radius: 30px;
    font-weight: 700;
    font-size: 15px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.btn-view-all::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(217, 4, 41, 0.5), transparent);
    transition: all 0.6s ease;
    z-index: 1;
}

.btn-view-all:hover {
    transform: translateY(-2px) scale(1.02);
    border-color: #D90429;
    box-shadow: 0 0 20px rgba(217, 4, 41, 0.4), 0 4px 15px rgba(217, 4, 41, 0.3);
    background: #fff;
}

.btn-view-all:hover::before {
    left: 100%;
}

/* Footer */
.site-footer {
    background-color: var(--primary-blue);
    color: #94a3b8;
    padding-top: 60px;
    overflow-x: hidden;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #334155;
    max-width: 1200px;
    margin: 0 auto;
}

.footer-brand p {
    word-break: break-word;
    overflow-wrap: break-word;
}

.category-pill i {
    font-size: 24px;
    margin-bottom: 8px;
    transition: transform 0.3s;
}

/* Colorful Icons */
.category-pill:nth-child(4n+1) i {
    color: #CED4DA;
}

/* Amber/Orange */
.category-pill:nth-child(4n+2) i {
    color: #3b82f6;
}

/* Blue */
.category-pill:nth-child(4n+3) i {
    color: #ec4899;
}

/* Pink */
.category-pill:nth-child(4n+4) i {
    color: #10b981;
}

/* Green */

.category-pill:hover i {
    transform: scale(1.1);
}

.footer-brand h4 {
    font-size: 24px;
    color: var(--white);
    margin-bottom: 20px;
    font-weight: 800;
}

.footer-col h4 {
    color: var(--white);
    font-size: 16px;
    margin-bottom: 20px;
}

.footer-col ul li {
    margin-bottom: 10px;
    font-size: 14px;
}

.footer-col ul li:hover {
    color: var(--white);
}

.footer-col ul li i {
    width: 20px;
}

.social-links {
    display: flex;
    gap: 15px;
}

.social-links a {
    width: 36px;
    height: 36px;
    border: 1px solid #475569;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
}

.social-links a:hover {
    background: var(--accent-yellow);
    border-color: var(--accent-yellow);
    color: var(--primary-blue);
}

.footer-contact ul li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.footer-contact ul li a {
    word-break: break-all;
    overflow-wrap: anywhere;
}

.footer-contact ul li i {
    flex-shrink: 0;
    margin-top: 2px;
}

.footer-bottom {
    padding: 20px 0;
    font-size: 13px;
}

.footer-bottom .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.footer-links-bottom {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

/* Mobile Menu */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -300px;
    width: 280px;
    height: 100%;
    background: var(--white);
    z-index: 2000;
    transition: 0.3s;
    padding: 20px;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
}

.mobile-menu.active {
    right: 0;
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.mobile-menu-header .logo {
    font-size: 20px;
    font-weight: 800;
    color: var(--primary-blue);
}

.close-menu {
    font-size: 24px;
    cursor: pointer;
}

.mobile-menu ul li a {
    display: block;
    padding: 15px 0;
    border-bottom: 1px solid var(--border-light);
    color: var(--text-dark);
    font-weight: 500;
}

.mobile-menu-actions {
    margin-top: 30px;
}

.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1500;
    display: none;
}

.mobile-menu-overlay.active {
    display: block;
}

.btn-block {
    display: block;
    text-align: center;
}

/* Responsive */
@media (max-width: 992px) {
    .promo-content {
        flex-direction: column;
        text-align: center;
    }

    .promo-image {
        margin-top: 50px;
        transform: scale(0.8);
    }

    .phone-mockup {
        transform: rotate(0);
    }

    .business-content-grid {
        grid-template-columns: 1fr;
    }

    .faq-grid {
        grid-template-columns: 1fr 1fr;
    }

    .section-title h2 {
        font-size: 28px;
    }

    /* Footer tablet layout */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    .footer-brand {
        grid-column: 1 / -1;
    }
}

@media (max-width: 991px) {

    .main-nav,
    .header-actions,
    .cta-section,
    .main-navigation {
        display: none;
    }

    .corporate-header {
        padding: 12px 0;
    }

    .logo-icon {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }

    .logo-title {
        font-size: 20px;
    }

    .logo-subtitle {
        font-size: 10px;
    }

    .mobile-menu-toggle {
        display: block;
    }

    .search-form {
        flex-direction: column;
        gap: 10px;
    }

    .divider-vertical {
        display: none;
    }

    .btn-search {
        width: 100%;
        margin: 0;
    }

    .faq-header h2 {
        font-size: 32px;
    }

    .faq-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .faq-container-inner {
        padding: 0 15px;
    }

    .faq-question {
        padding: 20px;
        font-size: 16px;
    }

    /* Footer Mobile Optimization */
    .footer-grid {
        grid-template-columns: 1fr;
        /* Stack columns */
        gap: 40px;
        text-align: center;
    }

    .footer-brand {
        grid-column: span 1;
        /* Reset from span 2 */
        text-align: center;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        padding-bottom: 20px;
        margin-bottom: 20px;
    }

    .footer-quick-links {
        display: none !important;
    }

    .footer-col {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .footer-col h4 {
        margin-bottom: 20px;
        display: inline-block;
    }

    .footer-col h4::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .footer-col ul li {
        justify-content: center;
        text-align: center;
    }

    .social-links {
        justify-content: center;
    }

    .footer-contact {
        grid-column: span 1;
        /* Reset from span 2 */
        text-align: center;
        border-top: 1px solid rgba(255, 255, 255, 0.05);
        padding-top: 30px;
        margin-top: 20px;
    }

    /* Hero Section Mobile */
    .hero-section {
        height: auto;
        padding: 10px 10px 80px;
        background-position: center top;
        overflow-x: hidden;
    }

    .hero-content {
        margin-top: -65px;
        text-align: center;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .hero-content h1 {
        font-size: 26px;
        margin-bottom: 8px;
    }

    .hero-content p {
        font-size: 14px;
        margin: 0 auto 10px auto;
        line-height: 1.5;
        max-width: 90%;
    }

    .hero-search-box {
        margin-top: -5px;
    }

    /* Premium Search Container Mobile */
    .premium-search-container {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 6px;
        gap: 4px;
        margin: 0 auto;
        width: 90%;
        max-width: 380px;
        border-radius: 12px;
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
        background: #ffffff;
        box-sizing: border-box;
        overflow: visible;
    }

    .search-input-group {
        grid-column: span 2;
        background: #f8fafc;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
        width: 100%;
        box-sizing: border-box;
        overflow: visible;
    }

    .search-select-group {
        background: #f8fafc;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
        width: 100%;
        box-sizing: border-box;
        overflow: visible;
    }

    .search-input,
    .search-select {
        height: 28px;
        font-size: 11px;
        width: 100%;
        min-width: 0;
        padding-left: 4px;
        text-align: left;
    }

    .select-icon-wrapper,
    .search-icon-wrapper {
        width: 24px;
        height: 30px;
        font-size: 11px;
        color: #D90429;
    }

    .search-actions {
        grid-column: span 2;
        margin-top: 2px;
    }

    .search-btn-primary {
        width: 100%;
        height: 32px;
        justify-content: center;
        border-radius: 8px;
        font-size: 13px;
        background: #D90429 !important;
        color: #fff !important;
    }

    .hero-wave svg {
        height: 60px;
    }

    /* Showcase Grid Mobile */
    .showcase-grid-wrapper {
        grid-template-columns: 1fr;
        height: auto;
        gap: 16px;
        padding: 0 15px;
    }

    .promo-banner-column {
        order: 2;
        height: auto;
    }

    .promo-banner {
        min-height: 320px;
        padding: 24px;
    }

    .main-showcase-slider {
        order: 1;
        height: 300px;
        border-radius: 16px;
    }

    .slide-info {
        width: 100%;
        padding: 20px;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
        justify-content: flex-end;
    }

    .slide-info h3 {
        font-size: 20px;
        margin-bottom: 8px;
    }

    .slide-desc {
        font-size: 13px;
        margin-bottom: 16px;
    }

    /* Category Pills Mobile */
    .categories-wrapper {
        padding: 0 10px;
    }

    .scroll-btn {
        display: none;
    }

    /* Category Pills Mobile Scroll Indicator */
    .categories-section {
        position: relative;
    }

    .categories-section::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 50px;
        height: 100%;
        background: linear-gradient(to right, transparent, rgba(248, 250, 252, 0.9));
        pointer-events: none;
        z-index: 2;
    }

    .categories-list {
        gap: 12px;
        padding: 10px 15px;
        /* Added side padding for better start/end scroll */
        -ms-overflow-style: none;
        /* Hide scrollbar IE/Edge */
        scrollbar-width: none;
        /* Hide scrollbar Firefox */
    }

    .categories-list::-webkit-scrollbar {
        display: none;
        /* Hide scrollbar Chrome/Safari */
    }

    .category-pill {
        font-size: 13px;
        padding: 10px 18px;
        white-space: nowrap;
        background: white;
    }

    /* Business Cards Mobile */
    .business-section {
        padding: 40px 0;
    }

    .business-content-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 0 15px;
    }

    .business-card {
        flex-direction: column;
        padding: 0;
        overflow: hidden;
        border-radius: 16px;
    }

    .business-image {
        width: 100%;
        height: 180px;
    }

    .business-info {
        padding: 20px;
    }

    .business-header h3 {
        font-size: 18px;
    }

    .business-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .btn-action {
        padding: 12px 0;
        border-radius: 8px;
    }

    .map-container {
        height: 300px;
        min-height: 300px;
        /* Ensure height on mobile */
        margin-top: 20px;
        border-radius: 16px;
        position: relative !important;
        /* Force relative positioning */
        top: 0 !important;
        /* Reset any sticky positioning */
        z-index: 1;
    }
}

/* --- Bottom-Left Discount Popup Styles --- */
.promo-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    transition: all 0.4s ease;
}

.promo-popup-overlay.show {
    display: flex;
    opacity: 1;
    visibility: visible;
}

.popup-overlay.show {
    opacity: 1;
    /* Added for transition */
    visibility: visible;
}

.popup-content {
    pointer-events: auto;
    /* Re-enable clicks on the popup itself */
    background: #DEE2E6;
    padding: 0;
    border-radius: 4px;
    /* Sharp rectangular look */
    max-width: 500px;
    /* Compact width */
    width: 100%;
    position: relative;
    transform: translateX(-100%);
    /* Start off-screen left */
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    display: flex;
    overflow: hidden;
    border: 1px solid #CED4DA;
}

.popup-overlay.show .popup-content {
    transform: translateX(0);
    /* Slide in */
}

.popup-image-col {
    width: 140px;
    min-width: 140px;
    background: #ef4444;
    /* Discount Red */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    position: relative;
}

.popup-image-col i {
    font-size: 48px;
    margin-bottom: 5px;
}

.discount-text {
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
}

.popup-text-col {
    padding: 25px;
    flex: 1;
}

.close-popup {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 18px;
    color: #94a3b8;
    cursor: pointer;
    background: transparent;
    width: auto;
    height: auto;
    display: block;
    /* Ensure it's visible */
    border-radius: 0;
    /* Remove border-radius */
}

.close-popup:hover {
    color: #0f172a;
    background: transparent;
    transform: none;
}

.popup-badge {
    color: #ef4444;
    font-size: 11px;
}

/* --- Promotional Popup Styles --- */
.promo-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 23, 42, 0.85);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000 !important;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.promo-popup-overlay.active {
    opacity: 1;
    visibility: visible;
}

.promo-popup-container {
    background: white;
    width: 90%;
    max-width: 480px;
    height: auto;
    overflow: visible;
    border-radius: 32px;
    position: relative;
    padding: 0;
    transform: scale(0.95) translateY(20px);
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.promo-popup-overlay.active .promo-popup-container {
    transform: scale(1) translateY(0);
}

.promo-popup-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(241, 245, 249, 0.8);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 24px;
    color: #475569;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: all 0.2s;
}

.contact-info i {
    width: 60px;
    height: 60px;
    background: white;
    color: #D90429;
    border: 1px solid #DEE2E6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.contact-info i:hover {
    transform: translateY(-5px);
    background: #D90429;
    color: white;
    border-color: #D90429;
    box-shadow: 0 10px 20px rgba(217, 4, 41, 0.3);
}

.promo-popup-close:hover {
    background: #212529;
    color: white;
    transform: rotate(90deg) scale(1.1);
}

.promo-popup-content {
    padding: 50px 40px;
    text-align: center;
}

.promo-badge-new {
    background: #212529;
    color: white;
    padding: 8px 18px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    display: inline-block;
    margin-bottom: 25px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.promo-popup-visual {
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
}

.promo-circle-price {
    width: 140px;
    height: 140px;
    background: radial-gradient(circle at center, #f8fafc, #e2e8f0);
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}

.gift-animation-container {
    position: relative;
    width: 80px;
    height: 90px;
    margin-top: 10px;
    perspective: 1000px;
}

.gift-box-body {
    width: 80px;
    height: 60px;
    background: linear-gradient(135deg, #D90429, #9d0208);
    border-radius: 4px;
    position: absolute;
    bottom: 0;
    z-index: 10;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
}

/* Gold Ribbon Vertical */
.body-bow-vertical {
    width: 18px;
    height: 100%;
    background: linear-gradient(90deg, #ffd700, #b8860b, #ffd700);
    margin: 0 auto;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}

/* 3D Realistic Lid */
.gift-box-lid {
    width: 88px;
    height: 25px;
    background: linear-gradient(135deg, #ef233c, #D90429);
    border-radius: 4px;
    position: absolute;
    top: 5px;
    left: -4px;
    z-index: 11;
    transform-origin: bottom left;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    animation: lid-open 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    animation-delay: 1s;
    border-bottom: 2px solid #9d0208;
}

/* Gold Ribbon on Lid */
.gift-box-lid::after {
    content: '';
    position: absolute;
    top: 0;
    left: 35px;
    width: 18px;
    height: 100%;
    background: linear-gradient(90deg, #ffd700, #b8860b, #ffd700);
}

/* Horizontal Bow on Lid */
.gift-box-lid::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 18px;
    transform: translateY(-50%);
    background: linear-gradient(180deg, #ffd700, #b8860b, #ffd700);
    opacity: 0.8;
}

.lid-bow-left,
.lid-bow-right {
    display: none;
    /* Simplified for realism */
}

/* Text Reveal remains same */
.gift-text-reveal {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 15px;
    font-weight: 800;
    color: #D90429;
    background: #fff;
    padding: 4px 10px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    z-index: 5;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    border: 1px solid #DEE2E6;
    animation: text-reveal 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    animation-delay: 1s;
}

/* Improved Animation timing */
@keyframes lid-open {

    0%,
    15% {
        transform: rotate(0) translateY(0);
    }

    30%,
    85% {
        transform: rotateX(20deg) rotateY(10deg) rotateZ(-110deg) translateY(-20px) translateX(-5px);
    }

    95%,
    100% {
        transform: rotate(0) translateY(0);
    }
}

@keyframes text-reveal {

    0%,
    10% {
        opacity: 0;
        transform: translateX(-50%) translateY(0);
    }

    20%,
    80% {
        opacity: 1;
        transform: translateX(-50%) translateY(-50px) scale(1.1);
    }

    90%,
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(0);
    }
}

.promo-popup-body h2 {
    font-size: 28px;
    color: #0f172a;
    margin-bottom: 12px;
    line-height: 1.3;
}

.promo-popup-body h2 strong {
    color: #212529;
    font-weight: 800;
}

.promo-main-text {
    font-size: 20px;
    font-weight: 700;
    color: #212529;
    margin-bottom: 15px;
}

.promo-main-text strong {
    color: #ef4444;
}

.promo-sub-text {
    font-size: 15px;
    color: #64748b;
    line-height: 1.6;
    margin-bottom: 35px;
}

.btn-popup-primary {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(135deg, #212529 0%, #334155 100%);
    color: white;
    padding: 18px 40px;
    border-radius: 50px;
    font-weight: 800;
    font-size: 16px;
    text-decoration: none;
    transition: all 0.3s;
    box-shadow: 0 10px 20px rgba(30, 41, 59, 0.2);
}

.btn-popup-primary:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(30, 41, 59, 0.3);
    background: #0f172a;
}

.promo-timer {
    font-size: 12px;
    color: #94a3b8;
    margin-top: 20px;
}

@media (max-width: 480px) {
    .promo-popup-content {
        padding: 40px 25px;
    }

    .promo-popup-body h2 {
        font-size: 22px;
    }

    .promo-main-text {
        font-size: 18px;
    }
}

/* =========================================
   Mobile Bottom Navigation Styles
   ========================================= */
.mobile-bottom-nav {
    display: none;
    /* Masa�st�nde gizle */
}

@media (max-width: 991px) {

    /* Eski hamburger men�y� kesin olarak gizle */
    .mobile-menu-toggle {
        display: none !important;
    }

    /* Alt men� i�in i�erik bo�lu�u */
    body {
        padding-bottom: 80px;
    }

    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background: rgba(255, 255, 255, 0.98);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        border-top: 1px solid rgba(0, 0, 0, 0.05);
        box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.05);
        z-index: 9999;
        justify-content: space-around;
        padding: 12px 0;
        padding-bottom: max(12px, env(safe-area-inset-bottom));
    }

    .mobile-bottom-nav .nav-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-decoration: none;
        color: #64748b;
        font-size: 10px;
        font-weight: 600;
        transition: all 0.3s ease;
        width: 25%;
        gap: 5px;
        position: relative;
    }

    .mobile-bottom-nav .nav-item i {
        font-size: 20px;
        margin-bottom: 2px;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        color: #94a3b8;
    }

    /* Aktif Durum */
    .mobile-bottom-nav .nav-item.active {
        color: #ef4444;
        /* Kırmızı */
    }

    .mobile-bottom-nav .nav-item.active i {
        transform: translateY(-3px);
        color: #ef4444;
        /* Kırmızı */
        filter: drop-shadow(0 4px 6px rgba(239, 68, 68, 0.3));
        /* Kırmızı Gölge */
    }

    /* T�klama Efekti */
    .mobile-bottom-nav .nav-item:active {
        transform: scale(0.92);
    }

    /* Mobile Header CTA Styling */
    .mobile-header-cta {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: linear-gradient(135deg, #DEE2E6, #CED4DA);
        color: #212529;
        padding: 8px 16px;
        border-radius: 8px;
        text-decoration: none;
        font-weight: 700;
        font-size: 13px;
        margin-left: auto;
        /* Push to right */
        box-shadow: 0 4px 10px rgba(251, 191, 36, 0.2);
        transition: all 0.2s;
    }

    .mobile-header-cta i {
        font-size: 12px;
    }

    .mobile-header-cta:active {
        transform: scale(0.95);
    }
}

/* Ensure Mobile CTA is hidden on Desktop */
@media (min-width: 769px) {
    .mobile-header-cta {
        display: none !important;
    }
}

/* --- Highlight Animation for Search Results --- */
@keyframes pulse-gold {
    0% {
        box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7);
        transform: scale(1);
    }

    50% {
        box-shadow: 0 0 0 10px rgba(251, 191, 36, 0);
        transform: scale(1.02);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(251, 191, 36, 0);
        transform: scale(1);
    }
}

.business-card.highlight-pulse,
.star-card.highlight-pulse {
    animation: pulse-gold 2s infinite;
    border: 2px solid #fbbf24;
    z-index: 50;
    position: relative;
}

/* --- No Results Message --- */
.no-results-msg {
    grid-column: 1 / -1;
    text-align: center;
    padding: 30px;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px dashed #cbd5e1;
    color: #64748b;
    font-size: 15px;
}

/* FIX: Language Switcher Interaction */
.lang-switcher {
    position: relative;
    z-index: 2002 !important;
    /* Above everything */
    pointer-events: auto !important;
}

.lang-btn {
    cursor: pointer !important;
    pointer-events: auto !important;
}

/* --- FAQ Section Styles Fixes --- */
.faq-section {
    padding: 60px 0;
    background: #fff;
}

.faq-header {
    text-align: center;
    margin-bottom: 40px;
}

.faq-container-inner {
    max-width: 800px;
    margin: 0 auto;
}

.faq-item {
    margin-bottom: 15px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.faq-item.active {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    border-color: #cbd5e1;
}

.faq-question {
    padding: 20px;
    background: #fff;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    color: #1e293b;
    transition: background 0.2s;
}

.faq-question:hover {
    background: #f8fafc;
}

.faq-question i {
    transition: transform 0.3s ease;
    color: #94a3b8;
}

.faq-item.active .faq-question i {
    transform: rotate(180deg);
    color: #1e293b;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0, 1, 0, 1);
    background: #f8fafc;
}

.faq-item.active .faq-answer {
    max-height: 1000px;
    /* Allow enough height */
    transition: max-height 0.5s ease-in-out;
}

.faq-answer p {
    margin: 20px;
    padding: 15px 20px;
    background: #fff;
    border-radius: 0 16px 16px 16px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
    border: 1px solid #e2e8f0;
    color: #475569;
    font-size: 15px;
    line-height: 1.6;
    display: inline-block;
    /* Fix: Bubble wraps text only */
    max-width: calc(100% - 40px);
}

/* Initially hide extra questions */
#faq-more {
    display: none;
}

#faq-more.visible {
    display: block;
}

.faq-actions {
    text-align: center;
    margin-top: 30px;
}

.btn-view-all {
    background: white;
    border: 1px solid #e2e8f0;
    padding: 12px 30px;
    border-radius: 50px;
    color: #475569;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.btn-view-all:hover {
    background: #f8fafc;
    color: #1e293b;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.08);
}

/* --- FAQ FIX (Appended via PowerShell) --- */
#faq-more {
    display: block !important;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}

#faq-more.show {
    max-height: 2000px;
    opacity: 1;
}

/* --- FAQ VISUAL IMPROVEMENTS (Appended via PowerShell) --- */
.faq-grid {
    align-items: flex-start !important;
}

.faq-answer p {
    margin: 15px 0 20px 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    color: #475569;
    font-size: 15px;
    line-height: 1.6;
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* --- FAQ TEXT SINGLE LINE FIX (Appended via PowerShell) --- */
.faq-question {
    font-size: 15px !important;
    padding: 15px 20px !important;
    align-items: center !important;
}

/* Language Switcher Overlay for Utility Pages */
.language-overlay {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 1000;
}

@media (max-width: 991px) {
    .language-overlay {
        top: 15px;
        right: 15px;
    }
}

/* --- MOBILE HEADER FIXES (Appended) --- */
@media (max-width: 991px) {

    /* Hide Desktop Reklam Ver Button (Fix Duplication) */
    .header-right-group .cta-button {
        display: none !important;
    }

    /* Fix Header Layout (Prevent Horizontal Scroll) */
    .header-wrapper {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        padding: 0 15px;
        height: 70px;
        grid-template-columns: none;
        /* Override Grid */
    }

    .header-container {
        padding: 0;
        width: 100%;
    }

    /* Adjust Right Group gap */
    .header-right-group {
        gap: 8px !important;
        padding-right: 0;
    }

    /* Ensure Mobile CTA is positioned correctly if needed */
    .mobile-header-cta {
        margin-left: 0;
        padding: 6px 12px;
        font-size: 12px;
    }
}



/* --- MOBILE LAYOUT & DUPLICATE BUTTON FIXED (Final) --- */
@media (max-width: 991px) {

    /* 1. Hide the Desktop 'Reklam Ver' button inside cta-section */
    .cta-section .cta-button {
        display: none !important;
    }

    /* 2. Fix Header Wrapper to prevent overflow/scroll */
    .header-wrapper {
        display: flex !important;
        grid-template-columns: unset !important;
        /* Remove Grid */
        justify-content: space-between !important;
        align-items: center !important;
        height: 70px !important;
        padding: 0 15px !important;
        gap: 5px !important;
        width: 100% !important;
    }

    .header-container {
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* 3. Adjust Right Group to fit tightly */
    .header-right-group {
        gap: 8px !important;
        justify-content: flex-end !important;
    }

    /* 4. Ensure Mobile CTA is visible and styled properly */
    .mobile-header-cta {
        display: inline-flex !important;
        margin-left: 5px !important;
        padding: 6px 10px !important;
        font-size: 11px !important;
        white-space: nowrap !important;
    }

    /* 5. Fix Language Switcher position if needed */
    .lang-dropdown-v2 {
        display: block !important;
        /* Ensure visible if hidden */
    }
}



/* --- MOBILE INTERACTIVITY & LOGO FIX (CRITICAL) --- */
@media (max-width: 991px) {

    /* 1. Fix Logo Shrinking - Ensure full logo is visible */
    .logo-section {
        flex-shrink: 0 !important;
        min-width: 120px;
        /* Ensure minimum width */
    }

    .header-logo-img {
        max-height: 40px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    /* 2. Fix Dropdowns & Popups (Allow Overflow) */
    .header-container,
    .header-wrapper {
        overflow: visible !important;
        /* Critical for dropdowns */
        overflow-x: visible !important;
    }

    /* 3. Prevent horizontal scroll on BODY instead */
    body {
        overflow-x: hidden;
    }

    /* 4. Improve spacing for interactive elements */
    .auth-dropdown-btn,
    .lang-toggle-v2 {
        pointer-events: auto !important;
        position: relative;
        z-index: 1002;
    }

    .auth-dropdown-menu,
    .lang-menu-v2 {
        z-index: 1003 !important;
        position: absolute !important;
    }
}



/* --- MOBILE DROPDOWN Z-INDEX FIX (FINAL) --- */
@media (max-width: 991px) {

    /* Ensure Header is ABOVE everything else */
    .corporate-header {
        z-index: 9999 !important;
        position: relative !important;
    }

    /* Dropdown Menus must be on top */
    .auth-dropdown-menu,
    .lang-menu-v2 {
        z-index: 10000 !important;
        position: absolute !important;
        top: 100% !important;
        margin-top: 5px !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
    }

    /* Ensure buttons are clickable */
    .auth-dropdown-btn,
    .lang-toggle-v2 {
        z-index: 10001 !important;
        position: relative !important;
    }
}



/* --- MOBILE LAYOUT: ICON-ONLY DESIGN (FINAL) --- */
@media (max-width: 991px) {

    /* 1. MEMBERSHIP BUTTON: Hide Text, Show Icon */
    .auth-dropdown-btn span {
        display: none !important;
    }

    /* Remove arrow and styling for cleaner icon look */
    .auth-dropdown-btn i.fa-chevron-down {
        display: none !important;
    }

    .auth-dropdown-btn {
        background: transparent !important;
        border: none !important;
        padding: 5px 8px !important;
        box-shadow: none !important;
    }

    .auth-dropdown-btn i.fa-user-circle {
        font-size: 24px !important;
        /* Larger profile icon */
        color: #333 !important;
        margin-right: 0 !important;
    }

    /* 2. ADVERTISE BUTTON (MOBILE CTA): Icon Only & Circular */
    .mobile-header-cta {
        font-size: 0 !important;
        /* Hide Text */
        width: 42px !important;
        height: 42px !important;
        border-radius: 50% !important;
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding: 0 !important;
        margin-left: 5px !important;
        background: #0d6efd !important;
        /* Primary Brand Color */
        box-shadow: 0 4px 10px rgba(13, 110, 253, 0.3) !important;
    }

    .mobile-header-cta i {
        font-size: 18px !important;
        color: white !important;
        margin: 0 !important;
    }

    /* 3. LANGUAGE SWITCHER: Compact */
    .lang-toggle-v2 {
        padding: 0 5px !important;
    }

    /* 4. LAYOUT ADJUSTMENTS */
    .header-right-group {
        gap: 2px !important;
        /* Tighten gap between icons */
        align-items: center !important;
    }
}



/* --- MOBILE HAMBURGER MENU (OFF-CANVAS) --- */
@media (max-width: 991px) {

    /* 1. HIDE OLD ELEMENTS */
    .auth-dropdown,
    .mobile-header-cta {
        display: none !important;
    }

    /* 2. HAMBURGER BUTTON */
    .mobile-menu-btn {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        color: #1e293b;
        width: 40px;
        height: 40px;
        border-radius: 8px;
        font-size: 18px;
        cursor: pointer;
        margin-left: 8px;
    }

    /* 3. MENU OVERLAY */
    .mobile-menu-overlay {
        position: fixed;
        top: 0;
        right: -100%;
        /* Hidden by default */
        width: 280px;
        height: 100vh;
        background: white;
        z-index: 10000;
        box-shadow: -5px 0 20px rgba(0, 0, 0, 0.1);
        transition: right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        display: flex;
        flex-direction: column;
    }

    .mobile-menu-overlay.active {
        right: 0;
    }

    /* Backdrop */
    .mobile-backdrop {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9999;
        display: none;
    }

    .mobile-backdrop.active {
        display: block;
    }

    /* Menu Content */
    .mobile-menu-header {
        padding: 20px;
        border-bottom: 1px solid #f1f5f9;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .mobile-menu-body {
        padding: 20px;
        overflow-y: auto;
    }

    /* Auth Buttons */
    .mobile-auth-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin-bottom: 20px;
    }

    .btn-mobile-auth {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 500;
        background: #f1f5f9;
        color: #334155;
    }

    .btn-mobile-register {
        background: #e0f2fe;
        color: #0284c7;
    }

    /* Highlighted Advertise Button */
    .btn-mobile-advertise {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        width: 100%;
        padding: 14px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
        color: white;
        font-weight: 600;
        margin-bottom: 30px;
        box-shadow: 0 4px 12px rgba(13, 110, 253, 0.2);
    }

    /* Nav Links */
    .mobile-nav-links {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    .mobile-nav-links a {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px;
        border-radius: 8px;
        color: #475569;
        font-weight: 500;
    }

    .mobile-nav-links a:hover {
        background: #f8fafc;
        color: #0f172a;
    }

    .mobile-nav-links i {

        /* --- CLEAN FIXES v7.3 --- */
        /* FAQ Style */
        .faq-hidden-items {
            display: none;
        }

        .faq-hidden-items.show {
            display: block !important;
        }

        .faq-item .faq-answer {
            display: none;
            padding: 15px;
            background: #f9f9f9;
            border-top: 1px solid #eee;
        }

        .faq-item.active .faq-answer {
            display: block !important;
        }

        .faq-item.active .faq-question i {
            transform: rotate(90deg);
        }

        /* Language Switcher & Flag Fix */
        .lang-menu-v2 {
            display: none;
            position: absolute;
            background: white;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            z-index: 1000;
        }

        .lang-menu-v2.show {
            display: block !important;
        }

        .lang-toggle-v2 img {
            width: 30px !important;
            height: auto;
            border-radius: 2px;
        }

        /* Mobile Menu Fix */
        .main-navigation.active {
            left: 0 !important;
            visibility: visible !important;
        }

        #mobile-menu-toggle {
            display: block;
        }

        @media (min-width: 992px) {
            #mobile-menu-toggle {
                display: none !important;
            }
        }


        /* --- FINAL HEADER FIX v7.4 --- */
        #mobile-menu-toggle {
            display: none !important;
            /* Hide everywhere by default */
        }

        @media (max-width: 991px) {
            #mobile-menu-toggle {
                display: block !important;
                /* ONLY show on mobile */
            }
        }


        /* --- Language Switcher V2 -- */
        .lang-dropdown-v2 {
            position: relative;
            margin-left: 15px;
        }

        .lang-toggle-v2 {
            background: none;
            border: none;
            cursor: pointer;
            padding: 0;
            display: flex;
            align-items: center;
        }

        .lang-toggle-v2 img {
            width: 32px;
            height: auto;
            border-radius: 4px;
            border: 1px solid rgba(0, 0, 0, 0.1);
        }

        .lang-menu-v2 {
            position: absolute;
            top: 120%;
            right: 0;
            background: #fff;
            border: 1px solid #e2e8f0;
            border-radius: 8px;
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
            min-width: 140px;
            display: none;
            z-index: 1000;
            overflow: hidden;
        }

        .lang-menu-v2.active {
            display: block;
            animation: slideDown 0.2s ease-out;
        }

        .lang-option-v2 {
            display: block;
            padding: 12px 16px;
            color: #475569;
            text-decoration: none;
            font-size: 14px;
            transition: all 0.2s;
            font-weight: 500;
        }

        .lang-option-v2:hover {
            background: #f1f5f9;
            color: #0f172a;
        }

        @keyframes slideDown {
            from {
                opacity: 0;
                transform: translateY(-10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* --- Mobile Menu Overlay --- */
        @media screen and (max-width: 991px) {
            .mobile-menu-btn {
                background: none;
                border: none;
                font-size: 24px;
                color: #333;
                cursor: pointer;
                margin-left: 15px;
                position: relative;
                z-index: 100;
            }

            .mobile-menu-overlay {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(255, 255, 255, 0.98);
                z-index: 9999;
                display: flex;
                flex-direction: column;
                transform: translateX(100%);
                transition: transform 0.3s ease-in-out;
            }

            .mobile-menu-overlay.active {
                transform: translateX(0);
            }

            .mobile-menu-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 20px;
                border-bottom: 1px solid #eee;
            }

            .mobile-menu-logo {
                height: 40px;
            }

            .mobile-menu-close {
                background: none;
                border: none;
                font-size: 36px;
                color: #333;
                cursor: pointer;
            }

            .mobile-menu-content {
                display: flex;
                flex-direction: column;
                padding: 30px 20px;
                gap: 20px;
                align-items: center;
            }

            .mobile-menu-item {
                font-size: 18px;
                color: #333;
                text-decoration: none;
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 10px;
                width: 100%;
                justify-content: center;
                padding: 15px;
                border-radius: 8px;
                transition: background 0.2s;
            }

            .mobile-menu-item:hover {
                background: #f8fafc;
            }

            .mobile-menu-item.highlight {
                background: #0ea5e9;
                color: white;
                font-weight: 600;
                box-shadow: 0 4px 6px -1px rgba(14, 165, 233, 0.2);
            }
        }

        @media screen and (min-width: 992px) {

            .mobile-menu-btn,
            .mobile-menu-overlay {
                display: none !important;
            }
        }

        /* --- EMERGENCY FIX: Mobile Logo & Desktop Button --- */
        .mobile-menu-btn {
            display: none !important;
        }

        @media screen and (max-width: 991px) {
            .mobile-menu-btn {
                display: block !important;
                background: none;
                border: none;
                font-size: 24px;
                color: #333;
                cursor: pointer;
                margin-left: 15px;
                position: relative;
                z-index: 100;
            }

            .header-logo-img {
                max-height: 40px !important;
                width: auto !important;
            }

            .mobile-menu-overlay {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(255, 255, 255, 0.98);
                z-index: 9999;
                display: flex;
                flex-direction: column;
                transform: translateX(100%);
                transition: transform 0.3s ease-in-out;
            }

            .mobile-menu-overlay.active {
                transform: translateX(0);
            }

            .mobile-menu-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 20px;
                border-bottom: 1px solid #eee;
            }

            .mobile-menu-logo {
                height: 40px;
            }

            .mobile-menu-close {
                background: none;
                border: none;
                font-size: 36px;
                color: #333;
                cursor: pointer;
            }

            .mobile-menu-content {
                display: flex;
                flex-direction: column;
                padding: 30px 20px;
                gap: 20px;
                align-items: center;
            }

            .mobile-menu-item {
                font-size: 18px;
                color: #333;
                text-decoration: none;
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 10px;
                width: 100%;
                justify-content: center;
                padding: 15px;
                border-radius: 8px;
                transition: background 0.2s;
            }

            .mobile-menu-item.highlight {
                background: #0ea5e9;
                color: white;
                box-shadow: 0 4px 6px -1px rgba(14, 165, 233, 0.2);
            }
        }

        /* --- Auth Dropdown -- */
        .auth-dropdown {
            position: relative;
            margin-left: 10px;
        }

        .auth-dropdown-btn {
            background: #3b82f6;
            color: white;
            border: none;
            padding: 10px 20px;
            border-radius: 50px;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 8px;
            font-weight: 600;
            font-size: 14px;
            transition: all 0.3s;
            box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.2);
        }

        .auth-dropdown-btn:hover {
            background: #2563eb;
            transform: translateY(-1px);
            box-shadow: 0 6px 8px -1px rgba(59, 130, 246, 0.3);
        }

        .auth-dropdown-menu {
            position: absolute;
            top: 120%;
            right: 0;
            background: white;
            border: 1px solid #e2e8f0;
            border-radius: 12px;
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
            width: 200px;
            display: none;
            z-index: 1000;
            overflow: hidden;
        }

        .auth-dropdown.active .auth-dropdown-menu {
            display: block;
            animation: slideDown 0.2s ease-out;
        }

        .auth-dropdown-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 12px 16px;
            color: #475569;
            text-decoration: none;
            font-size: 14px;
            transition: all 0.2s;
            font-weight: 500;
        }

        .auth-dropdown-item:hover {
            background: #f1f5f9;
            color: #3b82f6;
        }

        .auth-dropdown-item i {
            width: 18px;
            text-align: center;
        }

        /* Mobile specific adjustment for auth dropdown */
        @media (max-width: 991px) {
            .auth-dropdown-menu {
                right: auto;
                left: 50%;
                transform: translateX(-50%);
            }

            .auth-dropdown.active .auth-dropdown-menu {
                animation: slideDownMobile 0.2s ease-out;
            }
        }

        /* --- Highlight Animation for Search Results --- */
        @keyframes pulse-gold {
            0% {
                box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7);
                transform: scale(1);
            }

            50% {
                box-shadow: 0 0 0 10px rgba(251, 191, 36, 0);
                transform: scale(1.02);
            }

            100% {
                box-shadow: 0 0 0 0 rgba(251, 191, 36, 0);
                transform: scale(1);
            }
        }

        .business-card.highlight-pulse {
            animation: pulse-gold 2s infinite;
            border: 2px solid #fbbf24;
            z-index: 50;
            position: relative;
        }

        /* --- No Results Message --- */
        .no-results-msg {
            grid-column: 1 / -1;
            text-align: center;
            padding: 30px;
            background: #f8fafc;
            border-radius: 12px;
            border: 1px dashed #cbd5e1;
            color: #64748b;
            font-size: 15px;
        }

        /* ========================================= */
        /* STORIES SECTION (Integrated V7)           */
        /* ========================================= */
        .stories-section-wrapper {
            background: #ffffff;
            padding: 30px 0;
            border-bottom: 1px solid #f0f0f0;
        }

        .stories-app-card {
            background: #ffffff;
            border-radius: 16px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
            border: 1px solid #f1f1f1;
            padding: 20px 30px;
            position: relative;
        }

        .stories-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20px;
            border-bottom: 1px solid #f9f9f9;
            padding-bottom: 15px;
        }

        .stories-header-title {
            font-size: 20px;
            font-weight: 700;
            color: #222;
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .stories-icon-box {
            color: #FF0057;
            font-size: 22px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* SCROLL WRAPPER & ARROWS */
        .stories-scroll-wrapper {
            position: relative;
            display: flex;
            align-items: center;
        }

        .stories-track {
            display: flex;
            gap: 20px;
            overflow-x: auto;
            scroll-behavior: smooth;
            padding: 10px 5px;
            scrollbar-width: none;
            width: 100%;
        }

        .stories-track::-webkit-scrollbar {
            display: none;
        }

        /* Nav Buttons */
        .story-nav-btn {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: #fff;
            border: 1px solid #eee;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            color: #333;
            font-size: 14px;
            flex-shrink: 0;
            z-index: 10;
            transition: all 0.2s;
        }

        .story-nav-btn:hover {
            background: #FF0057;
            color: #fff;
            border-color: #FF0057;
        }

        .story-nav-btn.hidden {
            opacity: 0;
            pointer-events: none;
        }

        .prev-btn {
            margin-right: 10px;
        }

        .next-btn {
            margin-left: 10px;
        }

        /* STORY NODES */
        .story-node {
            display: flex;
            flex-direction: column;
            align-items: center;
            cursor: pointer;
            width: 80px;
            flex-shrink: 0;
            transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
            position: relative;
        }

        .story-node:hover {
            transform: translateY(-3px);
        }

        @keyframes storyPulse {
            0% {
                box-shadow: 0 0 0 0 rgba(255, 0, 87, 0.4);
            }

            70% {
                box-shadow: 0 0 0 6px rgba(255, 0, 87, 0);
            }

            100% {
                box-shadow: 0 0 0 0 rgba(255, 0, 87, 0);
            }
        }

        .story-avatar-wrap {
            width: 78px;
            height: 78px;
            border-radius: 50%;
            padding: 2px;
            background: linear-gradient(45deg, #f09433, #bc1888);
            position: relative;
            animation: storyPulse 2s infinite;
            transition: all 0.3s;
            overflow: hidden;
            /* CRITICAL FIX: Ensure image doesn't leak out */
        }

        /* SEEN STATE */
        .story-avatar-wrap.seen {
            background: #d1d5db;
            animation: none;
        }

        .story-avatar-wrap.seen .story-play-icon {
            display: none;
        }

        .story-avatar-wrap::after {
            content: '';
            position: absolute;
            top: 2px;
            left: 2px;
            right: 2px;
            bottom: 2px;
            background: #fff;
            border-radius: 50%;
            z-index: 1;
        }

        .story-avatar-img {
            width: 100%;
            height: 100%;
            border-radius: 50%;
            object-fit: cover;
            z-index: 2;
            border: 2px solid #fff;
            background: #fff;
        }

        .story-play-icon {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 24px;
            height: 24px;
            background: #fff;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 5;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
            font-size: 10px;
            color: #FF0057;
            border: 2px solid #fff;
        }

        .story-label {
            margin-top: 8px;
            font-size: 12px;
            font-weight: 600;
            color: #444;
            text-align: center;
            width: 100%;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .story-node.seen-node .story-label {
            color: #888;
            font-weight: 400;
        }

        /* VIEWER CSS */
        .story-viewer-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.95);
            z-index: 10000;
            display: none;
            justify-content: center;
            align-items: center;
            cursor: pointer;
        }

        .story-viewer-card {
            width: 100%;
            max-width: 400px;
            height: 85vh;
            background: #000;
            border-radius: 12px;
            position: relative;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            cursor: default;
        }

        .story-progress-container {
            position: absolute;
            top: 12px;
            left: 12px;
            right: 12px;
            display: flex;
            gap: 4px;
            z-index: 20;
        }

        .progress-bar-segment {
            height: 2px;
            background: rgba(255, 255, 255, 0.3);
            flex: 1;
            border-radius: 2px;
        }

        .progress-fill {
            width: 0%;
            height: 100%;
            background: #fff;
        }

        .viewer-header {
            position: absolute;
            top: 25px;
            left: 15px;
            display: flex;
            align-items: center;
            gap: 10px;
            z-index: 20;
        }

        .viewer-avatar {
            width: 32px;
            height: 32px;
            border-radius: 50%;
            border: 1px solid #fff;
        }

        .viewer-name {
            color: #fff;
            font-weight: 600;
            font-size: 14px;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
        }

        .viewer-close {
            position: absolute;
            top: 20px;
            right: 15px;
            color: white;
            font-size: 24px;
            cursor: pointer;
            z-index: 30;
        }

        .story-content-display {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            background-size: cover;
            background-position: center;
            position: relative;
        }

        .story-text-overlay {
            background: rgba(0, 0, 0, 0.4);
            backdrop-filter: blur(5px);
            padding: 20px;
            border-radius: 12px;
            text-align: center;
            width: 80%;
            border: 1px solid rgba(255, 255, 255, 0.2);
        }

        .content-title {
            color: #fff;
            font-size: 24px;
            font-weight: 700;
            margin-bottom: 10px;
        }

        .content-desc {
            color: #eee;
            font-size: 16px;
        }

        .cta-btn-story {
            margin-top: 20px;
            background: #fff;
            color: #000;
            padding: 10px 25px;
            border-radius: 20px;
            text-decoration: none;
            font-weight: 600;
            display: inline-block;
        }

    }
}

/* Lazy loading removed - was causing all images to be hidden */
/* =====================================================
   MOBİL RESPONSIVE DÜZELTMELER - 11 OCAK 2025
   Test Cihaz: iPhone (375px)
   Düzeltilen Sorunlar: Alt Nav, Şehrin Yıldızları, 
   Arama Çubuğu, Hero, Footer
   ===================================================== */

@media (max-width: 991px) {

    /* 1. ALT NAVİGASYON TAŞMA DÜZELTMESİ */
    .mobile-bottom-nav {
        display: flex !important;
        width: 100% !important;
        justify-content: space-around;
        padding: 8px 0;
        position: fixed;
        bottom: 0;
        left: 0;
        background: #fff;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
        z-index: 999;
    }

    .mobile-bottom-nav .nav-item {
        flex: 1;
        max-width: 25%;
        min-width: 0;
        text-align: center;
        font-size: 10px;
        padding: 5px 2px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .mobile-bottom-nav .nav-item i {
        font-size: 18px;
        display: block;
        margin-bottom: 4px;
    }

    .mobile-bottom-nav .nav-item span {
        font-size: 9px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        max-width: 100%;
    }

    /* 2. HERO BAŞLIK KÜÇÜLTME */
    .hero-content h1 {
        font-size: 26px !important;
        line-height: 1.3;
        padding: 0 15px;
        margin-bottom: 15px;
    }

    .hero-content p {
        font-size: 14px !important;
        padding: 0 20px;
        line-height: 1.5;
    }

    .hero-section {
        min-height: 450px;
        padding: 80px 0 40px;
    }

    /* 3. ARAMA ÇUBUĞU TAM GENİŞLİK */
    .premium-search-container {
        flex-direction: column !important;
        padding: 15px 10px !important;
        gap: 10px;
    }

    .search-input-group,
    .search-select-group,
    .search-actions {
        width: 100% !important;
        margin: 0 !important;
    }

    .search-btn-primary {
        width: 100% !important;
        padding: 14px;
        font-size: 16px;
    }

    .search-input,
    .search-select {
        font-size: 14px;
    }

    /* 4. ŞEHRİN YILDIZLARI - YATAY KAYDIRMA */
    .stars-content-wrap {
        display: flex !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        padding: 10px 5px;
        gap: 15px;
        scroll-snap-type: x mandatory;
    }

    .stars-content-wrap::-webkit-scrollbar {
        display: none;
    }

    .star-card {
        flex: 0 0 85% !important;
        max-width: 300px !important;
        min-width: 280px;
        scroll-snap-align: start;
    }

    /* Gold featured kartı mobilde normal boyut */
    .star-card.gold-featured {
        transform: none !important;
        flex: 0 0 85% !important;
        box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3) !important;
    }

    /* 5. FOOTER DÜZENLEME */
    .footer-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 25px;
        padding: 40px 20px 80px !important;
        /* Alt menü için boşluk */
    }

    .footer-col {
        text-align: center;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        padding-top: 20px;
    }

    .footer-brand {
        border-top: none !important;
        padding-top: 0 !important;
    }

    /* Hızlı Erişim mobilde gizle (gereksiz) */
    .footer-col:nth-child(3) {
        display: none !important;
    }

    .social-links {
        justify-content: center;
    }

    .footer-bottom {
        padding-bottom: 20px;
    }

    /* 6. SHOWCASE SLIDER */
    .main-slides-container {
        height: auto;
        min-height: 300px;
    }

    .main-slide {
        flex-direction: column;
        padding: 20px;
    }

    .slide-visual {
        width: 100%;
        max-height: 250px;
    }

    .slide-info {
        width: 100%;
        padding: 20px;
    }

    /* 7. FAQ BÖLGESİ */
    .faq-item {
        margin-bottom: 12px;
    }

    .faq-question {
        font-size: 14px;
        padding: 12px 15px;
    }

    .faq-answer {
        font-size: 13px;
        padding: 12px 15px;
    }

    /* 8. İŞLETME KARTLARI */
    .business-list {
        grid-template-columns: 1fr !important;
        gap: 15px;
    }

    .business-card {
        flex-direction: column !important;
    }

    .card-img-wrapper {
        width: 100% !important;
        height: 180px;
    }

    .card-info {
        width: 100%;
        padding: 15px;
    }

    .card-actions {
        flex-direction: column;
        gap: 10px;
    }

    .card-actions a {
        width: 100%;
        text-align: center;
    }

    /* 9. STORY BÖLGESİ İYİLEŞTİRME */
    .stories-section-wrapper {
        padding: 20px 0 15px !important;
    }

    .stories-track {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        padding: 10px 10px !important;
        gap: 10px;
        -webkit-overflow-scrolling: touch;
    }

    .story-node {
        width: 70px !important;
        flex: 0 0 70px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .story-avatar-wrap {
        width: 70px !important;
        height: 70px !important;
    }

    .story-avatar-img {
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
        left: 0 !important;
        border: 2px solid #fff;
    }

    .story-label {
        font-size: 11px;
    }

    /* 10. HEADER MOBİL */
    .corporate-header {
        padding: 10px 0;
    }

    .header-logo-img {
        height: 35px !important;
    }

    .mobile-header-cta {
        font-size: 11px !important;
        padding: 6px 12px !important;
    }

    /* 11. KATEGORİ PİLLERİ */
    .categories-list {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .categories-list::-webkit-scrollbar {
        display: none;
    }

    .category-pill {
        flex-shrink: 0;
        font-size: 12px;
        padding: 8px 15px;
    }

    /* 12. CONTAINER PADDING */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}

/* Extra Küçük Ekranlar (iPhone SE, Galaxy Fold - 360px) */
@media (max-width: 360px) {
    .mobile-bottom-nav .nav-item span {
        font-size: 8px;
    }

    .mobile-bottom-nav .nav-item i {
        font-size: 16px;
    }

    .hero-content h1 {
        font-size: 22px !important;
    }

    .hero-content p {
        font-size: 13px !important;
    }

    .star-card {
        flex: 0 0 90% !important;
    }
}


/* ========== MOBILE FEATURED SECTION REDESIGN (INSTAGRAM-STYLE) ========== */
@media (max-width: 991px) {

    /* Stars Section Mobile Optimization */
    .stars-section {
        padding: 30px 0 40px;
    }

    .stars-header h2 {
        font-size: 24px;
        margin-bottom: 8px;
    }

    .stars-subtitle {
        font-size: 14px;
        color: #64748b;
    }


    /* ===================================================================
   PREMIUM MOBILE FEATURED SECTION - VITRINDEYIZ SPECIAL DESIGN
   =================================================================== */

    @media (max-width: 991px) {

        /* Section Styling */
        .stars-section {
            padding: 40px 0;
            background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
        }

        .stars-header h2 {
            font-size: 26px;
            font-weight: 700;
            color: #212529;
            margin-bottom: 10px;
            text-align: center;
        }

        .stars-subtitle {
            font-size: 14px;
            color: #6c757d;
            text-align: center;
            margin-bottom: 25px;
        }

        /* Premium Card Container */
        .stars-content-wrap {
            padding: 0 15px;
        }

        .stars-pane {
            display: flex;
            flex-direction: column !important;
            gap: 20px;
            align-items: center;
        }

        /* PREMIUM GRADIENT CARDS */
        .star-card {
            width: 100% !important;
            max-width: 340px !important;
            min-height: auto !important;
            border-radius: 24px !important;
            overflow: hidden;
            box-shadow: 0 8px 24px rgba(33, 37, 41, 0.12) !important;
            transform: none !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
        }

        .star-card:active {
            transform: scale(0.98) !important;
        }

        /* Different gradient for each card */
        .star-card.silver {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }

        .star-card.gold-featured {
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
        }

        .star-card.bronze {
            background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
        }

        /* Card Inner Container */
        .featured-card-inner,
        .star-card>div:not(.card-badge):not(.star-img-wrapper) {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            border-radius: 20px;
            margin: 8px;
            padding: 15px;
        }

        /* Uniform Circular Images */
        .star-img-wrapper,
        .star-img-featured {
            width: 200px !important;
            height: 200px !important;
            border-radius: 50% !important;
            overflow: hidden;
            margin: 0 auto 15px !important;
            border: 4px solid rgba(255, 255, 255, 0.9) !important;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        }

        .star-img-wrapper img,
        .star-img-featured img {


            /* ===================================================================
   PREMIUM MOBILE FEATURED SECTION - SPOTLIGHT LAYOUT
   =================================================================== */

            @media (max-width: 991px) {
                .stars-section {
                    padding: 40px 0;
                    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
                }

                .stars-header h2 {
                    font-size: 26px;
                    font-weight: 700;
                    color: #212529;
                    margin-bottom: 10px;
                    text-align: center;
                }

                .stars-subtitle {
                    font-size: 14px;
                    color: #6c757d;
                    text-align: center;
                    margin-bottom: 25px;
                }

                /* SPOTLIGHT LAYOUT: Featured on top, 2 cards below */
                .stars-pane {
                    display: flex !important;
                    flex-wrap: wrap !important;
                    gap: 20px;
                    justify-content: center;
                    padding: 0 15px;
                }

                /* FEATURED CARD (#1) - Full Width on Top */
                .star-card.gold-featured {
                    order: -1 !important;
                    width: 100% !important;
                    max-width: 380px !important;
                    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
                    border-radius: 24px !important;
                    box-shadow: 0 10px 30px rgba(240, 147, 251, 0.3) !important;
                    overflow: hidden;
                    margin-bottom: 10px;
                }

                /* OTHER CARDS (#2, #3) - Side by Side */
                .star-card.silver,
                .star-card.bronze {
                    width: calc(50% - 10px) !important;
                    max-width: 180px !important;
                    flex: 0 0 calc(50% - 10px);
                }

                .star-card.silver {
                    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
                }

                .star-card.bronze {
                    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
                }

                /* Uniform Styling for All Cards */
                .star-card {
                    border-radius: 20px !important;
                    box-shadow: 0 8px 20px rgba(33, 37, 41, 0.15) !important;
                    overflow: hidden;
                    transform: none !important;
                    min-height: auto !important;
                    transition: transform 0.2s;
                }

                .star-card:active {
                    transform: scale(0.97) !important;
                }

                /* Glassmorphism Card Inner */
                .featured-card-inner,
                .star-card>div:not(.card-badge):not(.star-img-wrapper) {
                    background: rgba(255, 255, 255, 0.95) !important;
                    backdrop-filter: blur(10px) !important;
                    border-radius: 16px !important;
                    margin: 8px !important;
                    padding: 15px 12px !important;
                }

                /* Featured Card - Larger Images */
                .star-card.gold-featured .star-img-featured {
                    width: 160px !important;
                    height: 160px !important;
                    border-radius: 50% !important;
                    margin: 15px auto !important;
                    border: 4px solid #fff !important;
                    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
                    overflow: hidden;
                }

                /* Secondary Cards - Smaller Images */
                .star-card.silver .star-img-wrapper,
                .star-card.bronze .star-img-wrapper {
                    width: 100px !important;
                    height: 100px !important;
                    border-radius: 50% !important;
                    margin: 10px auto !important;
                    border: 3px solid #fff !important;
                    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
                    overflow: hidden;
                }

                .star-img-wrapper img,
                .star-img-featured img {
                    width: 100% !important;
                    height: 100% !important;
                    object-fit: cover !important;
                }

                /* Card Content - Featured */
                .star-card.gold-featured .card-content {
                    text-align: center;
                    padding: 10px !important;
                }

                .star-card.gold-featured h3 {
                    font-size: 22px !important;
                    font-weight: 700 !important;
                    color: #212529 !important;
                    margin-bottom: 6px !important;
                }

                /* Card Content - Secondary */
                .star-card.silver .card-content,
                .star-card.bronze .card-content {
                    text-align: center;
                    padding: 8px 5px !important;
                }

                .star-card.silver h3,
                .star-card.bronze h3 {
                    font-size: 15px !important;
                    font-weight: 700 !important;
                    margin-bottom: 4px !important;
                }

                /* Category Badges */
                .star-card .cat {
                    display: inline-block;
                    background: linear-gradient(135deg, #212529, #495057);
                    color: white !important;
                    padding: 5px 12px !important;
                    border-radius: 15px;
                    font-size: 11px !important;
                    font-weight: 600;
                    margin: 6px 0 !important;
                }

                .star-card.silver .cat,
                .star-card.bronze .cat {
                    font-size: 10px !important;
                    padding: 4px 8px !important;
                }

                /* Star Ratings */
                .star-score {
                    font-size: 13px !important;
                    color: #fbbf24;
                    margin: 8px 0 !important;
                }

                .star-card.silver .star-score,
                .star-card.bronze .star-score {
                    font-size: 11px !important;
                    margin: 6px 0 !important;
                }

                /* View Stats */
                .view-stats {
                    font-size: 12px !important;
                    color: #6c757d;
                    margin-top: 6px;
                }

                .star-card.silver .view-stats,
                .star-card.bronze .view-stats {
                    font-size: 10px !important;
                }

                /* Featured Button (�ncele) */
                .featured-btn {
                    display: inline-block !important;
                    background: linear-gradient(135deg, #212529, #495057) !important;
                    color: white !important;
                    padding: 10px 24px !important;
                    border-radius: 20px;
                    text-decoration: none;
                    font-weight: 700;
                    font-size: 14px;
                    margin: 12px 0 8px !important;
                    transition: transform 0.2s;
                    box-shadow: 0 4px 10px rgba(33, 37, 41, 0.2);
                }

                .featured-btn:active {
                    transform: scale(0.95);
                }

                /* Location Badge */
                .location-badge {
                    display: inline-flex !important;
                    align-items: center;
                    gap: 6px;
                    background: rgba(33, 37, 41, 0.1);
                    padding: 6px 12px;
                    border-radius: 12px;
                    font-size: 12px;
                    color: #495057 !important;
                    margin-top: 8px;
                }

                /* Top Badges */
                .card-badge {
                    position: absolute !important;
                    z-index: 10;
                    padding: 6px 12px !important;
                    border-radius: 12px !important;
                    font-weight: 700 !important;
                    font-size: 11px !important;
                    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
                }

                .card-badge.gold {
                    background: linear-gradient(135deg, #f59e0b, #d97706) !important;
                    color: #fff !important;
                    top: 8px !important;
                    left: 50% !important;
                    transform: translateX(-50%) !important;
                }

                .card-badge.blue {
                    background: #3b82f6 !important;
                    color: #fff !important;
                    top: 8px !important;
                    left: 8px !important;
                }

                .card-badge.brown {
                    background: #8b4513 !important;
                    color: #fff !important;
                    top: 8px !important;
                    right: 8px !important;
                }

                /* Hide img-badge icons on mobile */
                .img-badge {
                    display: none !important;
                }
            }

            /* --- MOBILE HEADER FIX (ANTI-GRAVITY) --- */
            @media (max-width: 991px) {
                .header-container {
                    padding: 0 20px !important;
                    width: 100% !important;
                    max-width: 100% !important;
                }

                .header-wrapper {
                    height: 70px !important;
                    gap: 0 !important;
                    display: flex !important;
                    justify-content: space-between !important;
                    align-items: center !important;
                    padding: 0 !important;
                }

                /* Logo'yu sola yasla */
                .logo-section {
                    flex: 0 0 auto;
                }

                /* Dil ve Mobil Menü ikonunu sağa yasla */
                .header-right-group {
                    flex: 0 0 auto;
                    gap: 15px !important;
                }

                /* CTA butonlarının mobilde gizle veya küçült */
                .cta-section {
                    display: none !important;
                }

                /* Mobil menü ikonunu görünür yap (eğer gizliyse) */
                .mobile-menu-toggle {
                    display: block !important;
                    margin-left: 15px;
                }
            }

            @media (max-width: 480px) {
                .header-container {
                    padding: 0 15px !important;
                }

                .header-logo-img {
                    max-height: 35px !important;
                }
            }


            /* --- Highlight Animation for Search Results --- */
            @keyframes pulse-gold {
                0% {
                    box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7);
                    transform: scale(1);
                }

                50% {
                    box-shadow: 0 0 0 10px rgba(251, 191, 36, 0);
                    transform: scale(1.02);
                }

                100% {
                    box-shadow: 0 0 0 0 rgba(251, 191, 36, 0);
                    transform: scale(1);
                }
            }

            .business-card.highlight-pulse {
                animation: pulse-gold 2s infinite;
                border: 2px solid #fbbf24;
                z-index: 50;
                position: relative;
            }

            /* --- No Results Message --- */
            .no-results-msg {
                grid-column: 1 / -1;
                text-align: center;
                padding: 30px;
                background: #f8fafc;
                border-radius: 12px;
                border: 1px dashed #cbd5e1;
                color: #64748b;
                font-size: 15px;
            }

            /* --- EXTRACTED MOBILE HEADER STYLES --- */
            @media (max-width: 991px) {
                .mobile-actions {
                    display: flex;
                    align-items: center;
                    gap: 15px;
                    margin-left: auto;
                }

                /* Hide Desktop Elements */
                .lang-dropdown-v2,
                .d-none.d-lg-block {
                    display: none !important;
                }

                /* Mobile Lang Button */
                .mobile-lang-btn {
                    background: none;
                    border: none;
                    padding: 0;
                    cursor: pointer;
                    display: flex;
                    align-items: center;
                }

                .mobile-lang-btn img {
                    width: 28px;
                    height: auto;
                    border-radius: 4px;
                    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
                }
            }

            /* Mobile Menu Button */
            .mobile-menu-btn {
                background: none;
                border: none;
                font-size: 24px;
                color: #1e293b;
                cursor: pointer;
                padding: 8px;
                display: block;
            }

            /* Mobile Menu Dropdown */
            .mobile-menu-dropdown {
                position: absolute;
                top: 70px;
                right: 20px;
                background: white;
                border-radius: 12px;
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
                width: 200px;
                display: none;
                flex-direction: column;
                overflow: hidden;
                z-index: 99999;
                opacity: 0;
                transform: translateY(-10px);
                transition: all 0.3s ease;
            }

            .mobile-menu-dropdown.active {
                display: flex;
                opacity: 1;
                transform: translateY(0);
            }

            .mobile-menu-item {
                padding: 15px 20px;
                text-decoration: none;
                color: #334155;
                font-weight: 500;
                border-bottom: 1px solid #f1f5f9;
                display: flex;
                align-items: center;
                gap: 10px;
                transition: background 0.2s;
            }

            .mobile-menu-item:last-child {
                border-bottom: none;
            }

            .mobile-menu-item:hover {
                background: #f8fafc;
            }

            .mobile-menu-item.highlight {
                color: #D90429;
                font-weight: 600;
                background: #fff1f2;
            }

            /* --- EMERGENCY FIX: START --- */
            /* Hide mobile actions by default to prevent desktop bleed */
            .mobile-actions {
                display: none !important;
            }

            /* Ensure images have a default size constraint globally */
            .mobile-lang-btn img {
                width: 25px !important;
                height: auto;
            }

            /* Show on mobile only */
            @media (max-width: 991px) {
                .mobile-actions {
                    display: flex !important;
                    align-items: center;
                    gap: 15px;
                    margin-left: auto;
                }
            }

            /* --- EMERGENCY FIX: END --- */


            /* ====================================================
   MOBILE SPOTLIGHT & BUSINESS CARDS (Previously Inline) 
   ==================================================== */

            /* --- MOBİL ALT MENÜ (KIRMIZI AKTİF RENK - ZORLA) --- */
            .mobile-bottom-nav .nav-item.active,
            .mobile-bottom-nav .nav-item.active i {
                color: #ef4444 !important;
                filter: drop-shadow(0 4px 6px rgba(239, 68, 68, 0.3)) !important;
            }

            /* ========================================
   BUTON STÄ°LLERÄ° - TÃœM EKRANLAR
   ======================================== */

            .card-all-actions {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 6px;
                margin-top: auto;
            }

            .card-btn {
                padding: 8px 10px;
                border-radius: 6px;
                font-size: 11px;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.2s ease;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 5px;
                border: none;
                text-decoration: none;
                position: relative;
                z-index: 20;
                pointer-events: auto;
                flex: 1;
                width: 100%;
                min-width: 0;
                box-sizing: border-box;
            }

            .card-btn:hover {
                transform: translateY(-2px);
            }

            /* Profil Butonu - Kırmızı */
            .btn-profile {
                background: linear-gradient(135deg, #D90429 0%, #a30320 100%);
                color: #ffffff;
            }

            .btn-profile:hover {
                box-shadow: 0 4px 12px rgba(217, 4, 41, 0.4);
            }

            /* Konum Butonu - Mor */
            .btn-location {
                background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
                color: #ffffff;
            }

            .btn-location:hover {
                box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);
            }

            /* Ara Butonu - Mavi */
            .btn-phone {
                background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
                color: #ffffff;
            }

            .btn-phone:hover {
                box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
            }

            /* WhatsApp Butonu - YeÅŸil */
            .btn-wp {
                background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
                color: #ffffff;
            }

            .btn-wp:hover {
                box-shadow: 0 4px 12px rgba(34, 197, 94, 0.4);
            }

            /* İşletmeyi Keşfet Butonu - Altın/Turuncu */
            .btn-explore {
                background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
                color: #ffffff;
                grid-column: span 2;
            }

            .btn-explore:hover {
                box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4);
            }

            /* ========================================
   DESKTOP BUSINESS CARDS - MODERN GRID
   ======================================== */
            @media (min-width: 769px) {
                .businesses-section {
                    padding: 60px 0;
                    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
                }

                .businesses-section .section-title h2 {
                    font-size: 32px;
                    text-align: center;
                    margin-bottom: 40px;
                }

                .business-content-grid {
                    display: grid;
                    grid-template-columns: 1fr 1fr;
                    gap: 40px;
                    align-items: start;
                }

                .business-list {
                    display: grid;
                    grid-template-columns: repeat(2, 1fr);
                    gap: 20px;
                    max-height: 640px;
                    overflow-y: auto;
                    padding-right: 10px;
                    scroll-behavior: smooth;
                }

                .business-list::-webkit-scrollbar {
                    width: 8px;
                }

                .business-list::-webkit-scrollbar-track {
                    background: #f1f5f9;
                    border-radius: 10px;
                }

                .business-list::-webkit-scrollbar-thumb {
                    background: linear-gradient(180deg, #D90429 0%, #a30320 100%);
                    border-radius: 10px;
                }

                .business-list::-webkit-scrollbar-thumb:hover {
                    background: linear-gradient(180deg, #a30320 0%, #7a0218 100%);
                }

                .business-card {
                    background: #ffffff;
                    border-radius: 16px;
                    padding: 0;
                    display: flex;
                    flex-direction: column;
                    gap: 0;
                    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
                    border: 1px solid #e2e8f0;
                    cursor: pointer;
                    transition: all 0.3s ease;
                    overflow: hidden;
                    height: 100%;
                }

                .business-card:hover {
                    transform: translateY(-8px);
                    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
                }

                .card-img-wrapper,
                .business-image {
                    width: 100%;
                    height: 120px;
                    overflow: hidden;
                    flex-shrink: 0;
                }

                .card-img-wrapper img,
                .business-image img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    transition: transform 0.3s ease;
                }

                .business-card:hover .card-img-wrapper img,
                .business-card:hover .business-image img {
                    transform: scale(1.08);
                }

                .card-info,
                .business-info {
                    padding: 12px 15px;
                    display: flex;
                    flex-direction: column;
                    gap: 5px;
                    flex: 1;
                    position: relative;
                    z-index: 10;
                }

                .card-info h3,
                .business-info h3 {
                    font-size: 15px;
                    font-weight: 700;
                    color: #1e293b;
                    margin: 0;
                    line-height: 1.2;
                }

                .card-meta,
                .business-location {
                    font-size: 11px;
                    color: #64748b;
                    display: flex;
                    align-items: center;
                    gap: 4px;
                }

                .card-meta::before {
                    content: "📍";
                    font-size: 10px;
                }

                .card-desc {
                    display: none;
                }

                .map-container {
                    border-radius: 16px;
                    overflow: hidden;
                    height: 100%;
                    min-height: 500px;
                    position: sticky;
                    top: 100px;
                    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
                }

                .no-results-msg,
                #no-results {
                    grid-column: 1 / -1;
                    text-align: center;
                    padding: 40px;
                    color: #64748b;
                }
            }

            @media (max-width: 991px) {
                .stars-pane {
                    display: flex !important;
                    flex-wrap: wrap !important;
                    gap: 10px !important;
                    padding: 0 8px !important;
                    justify-content: center !important;
                }

                .star-card.gold-featured {
                    width: 100% !important;
                    flex: 0 0 100% !important;
                    max-width: 100% !important;
                    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%) !important;
                    border-radius: 18px !important;
                    overflow: hidden !important;
                    margin-bottom: 5px !important;
                }

                .star-card.silver,
                .star-card.bronze {
                    width: 45% !important;
                    flex: 0 0 45% !important;
                    max-width: 45% !important;
                    min-width: 0 !important;
                }

                .star-card.silver {
                    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
                }

                .star-card.bronze {
                    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
                }

                .star-card {
                    border-radius: 16px !important;
                    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
                    overflow: hidden !important;
                    transform: none !important;
                    position: relative !important;
                }

                .featured-card-inner,
                .star-card>div:not(.card-badge):not(.star-img-wrapper) {
                    background: rgba(255, 255, 255, 0.95) !important;
                    backdrop-filter: blur(10px) !important;
                    border-radius: 12px !important;
                    margin: 5px !important;
                    padding: 10px 8px !important;
                }

                .star-card.gold-featured .star-img-featured {
                    width: 120px !important;
                    height: 120px !important;
                    border-radius: 50% !important;
                    margin: 10px auto !important;
                    border: 3px solid #fff !important;
                    overflow: hidden !important;
                }

                .star-card.silver .star-img-wrapper,
                .star-card.bronze .star-img-wrapper {
                    width: 70px !important;
                    height: 70px !important;
                    border-radius: 50% !important;
                    margin: 8px auto !important;
                    border: 2px solid #fff !important;
                    overflow: hidden !important;
                }

                .star-img-wrapper img,
                .star-img-featured img {
                    width: 100% !important;
                    height: 100% !important;
                    object-fit: cover !important;
                }

                .star-card h3 {
                    font-weight: 700 !important;
                    color: #212529 !important;
                    margin-bottom: 3px !important;
                }

                .star-card.gold-featured h3 {
                    font-size: 17px !important;
                }

                .star-card.silver h3,
                .star-card.bronze h3 {
                    font-size: 12px !important;
                }

                .star-card .cat {
                    font-size: 9px !important;
                    padding: 3px 6px !important;
                    margin: 4px 0 !important;
                }

                .star-score {
                    font-size: 10px !important;
                    margin: 4px 0 !important;
                }

                .view-stats {
                    font-size: 9px !important;
                }

                .card-badge {
                    display: none !important;
                }

                /* PREMIUM #1 SPOTLIGHT (Royal Night Theme) */
                .star-card.gold-featured {
                    background: linear-gradient(135deg, #0f172a 0%, #000000 100%) !important;
                    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4) !important;
                    border: 1px solid rgba(212, 175, 55, 0.3) !important;
                    padding-top: 15px !important;
                }

                .star-card.gold-featured .featured-card-inner {
                    background: rgba(255, 255, 255, 0.03) !important;
                    backdrop-filter: blur(15px) !important;
                    border: 1px solid rgba(255, 255, 255, 0.1) !important;
                }

                .star-card.gold-featured h3 {
                    color: #f8fafc !important;
                    font-size: 22px !important;
                    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
                }

                .featured-tags {
                    display: flex;
                    flex-wrap: wrap;
                    gap: 6px;
                    justify-content: center;
                    margin: 10px 0;
                }

                .f-tag {
                    background: rgba(212, 175, 55, 0.15);
                    color: #d4af37;
                    font-size: 10px;
                    padding: 4px 10px;
                    border-radius: 50px;
                    border: 1px solid rgba(212, 175, 55, 0.3);
                    font-weight: 600;
                }

                /* MOBILE HEADER: PREMIUM SLIM DESIGN */
                .corporate-header {
                    background: linear-gradient(180deg, #ffffff 0%, #e2e8f0 100%) !important;
                    position: relative !important;
                    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
                }

                .corporate-header::before {
                    content: "";
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    opacity: 0.05;
                    pointer-events: none;
                    z-index: 1;
                    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
                }

                .header-wrapper {
                    height: 55px !important;
                    padding: 0 15px !important;
                    display: flex !important;
                    align-items: center !important;
                    position: relative;
                    z-index: 2;
                }

                .header-logo-img {
                    height: 35px !important;
                    width: auto !important;
                }

                /* BUSINESSES SECTION: MODERN MOBILE CAROUSEL */
                .businesses-section {
                    padding: 40px 0 !important;
                    overflow: hidden !important;
                }

                .business-content-grid {
                    display: block !important;
                }

                .business-list {
                    display: flex !important;
                    flex-direction: row !important;
                    overflow-x: auto !important;
                    scroll-snap-type: x mandatory !important;
                    gap: 15px !important;
                    padding: 40px 15px 5px 5px !important;
                    margin: 0 -15px !important;
                    -webkit-overflow-scrolling: touch;
                    scrollbar-width: none;
                }

                .business-list::-webkit-scrollbar {
                    display: none;
                }

                .business-card {
                    flex: 0 0 240px !important;
                    height: 320px !important;
                    position: relative !important;
                    border-radius: 20px !important;
                    overflow: hidden !important;
                    background: #000 !important;
                    margin-bottom: 0 !important;
                    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2) !important;
                    border: none !important;
                }

                .card-img-wrapper,
                .business-image {
                    position: absolute !important;
                    top: 0 !important;
                    left: 0 !important;
                    width: 100% !important;
                    height: 100% !important;
                    z-index: 1 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

                .card-img-wrapper img,
                .business-image img {
                    width: 100% !important;
                    height: 100% !important;
                    object-fit: cover !important;
                    filter: brightness(0.65) !important;
                }

                .card-info,
                .business-info {
                    position: absolute !important;
                    bottom: 0 !important;
                    left: 0 !important;
                    width: 100% !important;
                    z-index: 2 !important;
                    padding: 15px !important;
                    background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.4) 50%, transparent 100%) !important;
                    display: flex !important;
                    flex-direction: column !important;
                    justify-content: flex-end !important;
                    box-sizing: border-box !important;
                }

                .card-info h3,
                .business-info h3 {
                    color: #ffffff !important;
                    font-size: 18px !important;
                    margin: 0 0 5px 0 !important;
                    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) !important;
                }

                .card-meta,
                .business-location {
                    color: #e2e8f0 !important;
                    font-size: 11px !important;
                    margin-bottom: 10px !important;
                }

                .card-desc {
                    display: none !important;
                }

                .btn-view-profile {
                    width: 100% !important;
                    background: rgba(255, 255, 255, 0.15) !important;
                    backdrop-filter: blur(10px) !important;
                    -webkit-backdrop-filter: blur(10px) !important;
                    border: 1px solid rgba(255, 255, 255, 0.25) !important;
                    color: #fff !important;
                    padding: 9px !important;
                    border-radius: 12px !important;
                    font-size: 12px !important;
                    font-weight: 700 !important;
                    margin-bottom: 10px !important;
                }

                .business-actions,
                .card-actions {
                    display: grid !important;
                    grid-template-columns: 1fr 1fr !important;
                    gap: 8px !important;
                }

                .btn-call,
                .btn-whatsapp,
                .phone,
                .whatsapp {
                    padding: 8px !important;
                    font-size: 11px !important;
                    border-radius: 10px !important;
                    justify-content: center !important;
                }

                .btn-call,
                .phone {
                    background: #3b82f6 !important;
                    color: #fff !important;
                }

                .btn-whatsapp,
                .whatsapp {
                    background: #22c55e !important;
                    color: #fff !important;
                }

                .map-container {
                    display: none !important;
                }

                .business-list::after {
                    content: "";
                    flex: 0 0 15px;
                }
            }

            /* STORIES SECTION V7 */
            .stories-section-wrapper {
                background: #ffffff;
                padding: 30px 0;
                border-bottom: 1px solid #f0f0f0;
            }

            .stories-app-card {
                background: #ffffff;
                border-radius: 16px;
                box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
                border: 1px solid #f1f1f1;
                padding: 20px 30px;
                position: relative;
            }

            .stories-header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 20px;
                border-bottom: 1px solid #f9f9f9;
                padding-bottom: 15px;
            }

            .stories-header-title {
                font-size: 20px;
                font-weight: 700;
                color: #222;
                display: flex;
                align-items: center;
                gap: 10px;
            }

            .stories-icon-box {
                color: #FF0057;
                font-size: 22px;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .stories-scroll-wrapper {
                position: relative;
                display: flex;
                align-items: center;
            }

            .stories-track {
                display: flex !important;
                flex-direction: row !important;
                flex-wrap: nowrap !important;
                gap: 20px !important;
                overflow-x: auto !important;
                scroll-behavior: smooth;
                padding: 10px 5px;
                scrollbar-width: none;
                width: 100%;
            }

            .stories-track::-webkit-scrollbar {
                display: none;
            }

            .story-nav-btn {
                width: 36px;
                height: 36px;
                border-radius: 50%;
                background: #fff;
                border: 1px solid #eee;
                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                color: #333;
                font-size: 14px;
                flex-shrink: 0;
                z-index: 10;
                transition: all 0.2s;
            }

            .story-nav-btn:hover {
                background: #FF0057;
                color: #fff;
                border-color: #FF0057;
            }

            .story-nav-btn.hidden {
                opacity: 0;
                pointer-events: none;
            }

            .prev-btn {
                margin-right: 10px;
            }

            .next-btn {
                margin-left: 10px;
            }

            .story-node {
                display: flex;
                flex-direction: column;
                align-items: center;
                cursor: pointer;
                width: 80px;
                flex-shrink: 0;
                transition: transform 0.2s;
            }

            .story-node:hover {
                transform: translateY(-3px);
            }

            /* Mobile Star Auto-Slider CSS */
            @media (max-width: 991px) {
                .stars-pane-creative {
                    display: grid !important;
                    grid-template-columns: 1fr;
                    grid-template-rows: auto;
                    min-height: 520px;
                    padding-bottom: 40px;
                    gap: 0 !important;
                }

                .star-card-creative {
                    grid-column: 1 / -1;
                    grid-row: 1 / -1;
                    width: 100% !important;
                    margin: 0 !important;
                    opacity: 0;
                    pointer-events: none;
                    transform: scale(0.95) translateY(10px);
                    transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
                    z-index: 1;
                }

                .star-card-creative.active-mobile {
                    opacity: 1;
                    pointer-events: auto;
                    transform: scale(1) translateY(0);
                    z-index: 10;
                }

                .mobile-star-progress {
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    width: 100%;
                    height: 6px;
                    background: rgba(0, 0, 0, 0.1);
                    border-bottom-left-radius: 30px;
                    border-bottom-right-radius: 30px;
                    overflow: hidden;
                    display: block;
                    z-index: 20;
                }

                .mobile-star-bar {
                    height: 100%;
                    width: 0%;
                    background: linear-gradient(90deg, #d4af37, #f59e0b);
                    border-radius: 0;
                    transition: none;
                    box-shadow: 0 0 10px rgba(212, 175, 55, 0.5);
                }
            }

            @media (min-width: 769px) {
                .mobile-star-progress {
                    display: none !important;
                }
            }

            /* FAQ Grid Update - 4 Columns */
            .faq-grid {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 20px;
            }

            @media (max-width: 1200px) {
                .faq-grid {
                    grid-template-columns: repeat(2, 1fr);
                }
            }

            @media (max-width: 991px) {
                .faq-grid {
                    grid-template-columns: 1fr;
                }

                .faq-container-inner:not(.expanded) .faq-grid .faq-item:nth-child(4) {
                    display: none;
                }
            }

            /* Biz Demo Modal Contact Buttons */
            .contact-row {
                display: flex;
                align-items: center;
                gap: 15px;
                margin-bottom: 15px;
                color: #475569;
                font-size: 14px;
            }

            .contact-row i {
                color: #94a3b8;
                font-size: 18px;
                width: 20px;
                text-align: center;
            }

            .action-buttons {
                display: flex;
                flex-direction: column;
                gap: 10px;
                margin-top: 20px;
            }

            .action-btn {
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 12px;
                border-radius: 8px;
                font-weight: 600;
                text-decoration: none !important;
                transition: transform 0.2s;
                gap: 8px;
            }

            .action-btn:hover {
                transform: translateY(-2px);
            }

            .action-btn.call {
                background: #0f172a;
                color: white;
            }

            .action-btn.whatsapp {
                background: #22c55e;
                color: white;
            }

            /* Biz Modal Mobile Adjustments */
            @media (max-width: 991px) {
                .biz-body {
                    grid-template-columns: 1fr;
                }

                .biz-hero {
                    height: 200px;
                }

                .biz-logo-large {
                    width: 80px;
                    height: 80px;
                }

                .biz-header-info h1 {
                    font-size: 22px;
                }
            }

            @keyframes fadeIn {
                from {
                    opacity: 0;
                }

                to {
                    opacity: 1;
                }
            }

            @keyframes slideUp {
                from {
                    transform: translateY(50px);
                    opacity: 0;
                }

                to {
                    transform: translateY(0);
                    opacity: 1;
                }

            }

            /* --- MOBILE BOTTOM NAVIGATION (Global Removed To Prevent Conflict) --- */
            .mobile-bottom-nav-old-removed {
                display: none !important;
            }

            .mobile-bottom-nav .nav-item {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 4px;
                color: #94a3b8;
                text-decoration: none;
                font-size: 10px;
                font-weight: 500;
                transition: all 0.3s ease;
                flex: 1;
            }

            .mobile-bottom-nav .nav-item i {
                font-size: 20px;
                transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
            }

            .mobile-bottom-nav .nav-item.active {
                color: #D90429;
            }

            .mobile-bottom-nav .nav-item.active i {
                transform: translateY(-5px);
                color: #D90429;
                filter: drop-shadow(0 4px 6px rgba(217, 4, 41, 0.2));
            }

            @media (max-width: 991px) {
                .mobile-bottom-nav {
                    display: flex;
                    justify-content: space-around;
                    align-items: center;
                }
            }

            /* --- RESTORED MOBILE HAMBURGER MENU STYLES --- */
            .mobile-actions {
                display: none;
                align-items: center;
                gap: 15px;
                margin-left: auto;
            }

            @media (max-width: 991px) {
                .mobile-actions {
                    display: flex;
                }

                .lang-dropdown-v2,
                .d-none.d-lg-block {
                    display: none !important;
                }

                .mobile-lang-btn {
                    background: none;
                    border: none;
                    padding: 0;
                    cursor: pointer;
                    display: flex;
                    align-items: center;
                }

                .mobile-lang-btn img {
                    width: 28px;
                    height: auto;
                    border-radius: 4px;
                    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
                }
            }

            .mobile-menu-btn {
                background: none;
                border: none;
                font-size: 24px;
                color: #1e293b;
                cursor: pointer;
                padding: 8px;
                display: block;
            }

            .mobile-menu-dropdown {
                position: absolute;
                top: 70px;
                right: 20px;
                background: white;
                border-radius: 12px;
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
                width: 200px;
                display: none;
                flex-direction: column;
                overflow: hidden;
                z-index: 99999;
                opacity: 0;
                transform: translateY(-10px);
                transition: all 0.3s ease;
            }

            .mobile-menu-dropdown.active {
                display: flex;
                opacity: 1;
                transform: translateY(0);
            }

            .mobile-menu-item {
                padding: 15px 20px;
                text-decoration: none;
                color: #334155;
                font-weight: 500;
                border-bottom: 1px solid #f1f5f9;
                display: flex;
                align-items: center;
                gap: 10px;
                transition: background 0.2s;
            }

            .mobile-menu-item:last-child {
                border-bottom: none;
            }

            .mobile-menu-item:hover {
                background: #f8fafc;
            }

            .mobile-menu-item.highlight {
                color: #D90429;
                font-weight: 600;
                background: #fff1f2;
            }

            /* --- GLOBAL HEADER OVERRIDES (Enforces Consistency) --- */
            .corporate-header .nav-link {
                height: 40px !important;
                display: flex !important;
                align-items: center !important;
                padding: 0 !important;
                margin: 0 10px !important;
                font-weight: 500 !important;
                font-family: 'Inter', sans-serif !important;
                line-height: normal !important;
            }

            .corporate-header ul {
                margin-bottom: 0 !important;
                padding-left: 0 !important;
                display: flex !important;
                align-items: center !important;
            }

            .auth-dropdown-btn,
            .cta-button {
                height: 40px !important;
                display: flex !important;
                align-items: center !important;
                box-sizing: border-box !important;
                line-height: normal !important;
                font-family: 'Inter', sans-serif !important;
                font-size: 14px !important;
            }

            .auth-dropdown-btn span {
                font-family: 'Inter', sans-serif !important;
            }

            .cta-button span {
                font-family: 'Inter', sans-serif !important;
            }

            /* Ensure mobile menu works globally */
            .mobile-menu-dropdown.active {
                display: flex !important;
            }

            /* --- MISSING HEADER STYLES FROM DEMO --- */
            /* --- LANGUAGE SWITCHER OVERRIDE (Circular Dark) --- */
            .lang-toggle-v2 {
                border: 2px solid #64748b !important;
                background: transparent !important;
                color: #000000 !important;
                font-weight: 700 !important;
                border-radius: 50% !important;
                width: 32px !important;
                height: 32px !important;
                display: flex !important;
                align-items: center;
                justify-content: center !important;
                padding: 0 !important;
                transition: all 0.3s ease !important;
                cursor: pointer;
                position: relative;
                z-index: 1;
            }

            .lang-toggle-v2:hover {
                background: rgba(100, 116, 139, 0.1) !important;
                color: #000000 !important;
                border-color: #000000 !important;
                transform: translateY(-2px);
            }

            .lang-toggle-v2 span {
                color: inherit !important;
                position: relative;
                top: 1px;
                font-size: 13px !important;
                font-family: 'Outfit', sans-serif;
            }

            .lang-toggle-v2::before {
                display: none !important;
            }

            /* --- RED CTA BUTTON OVERRIDE --- */
            .cta-button {
                border: 1px solid #D90429 !important;
                background: #ffffff !important;
                color: #D90429 !important;
                font-weight: 700 !important;
                border-radius: 12px !important;
                transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
                text-decoration: none !important;
                box-shadow: 0 4px 6px rgba(217, 4, 41, 0.05) !important;
                display: flex !important;
                align-items: center !important;
                gap: 8px !important;
                padding: 10px 20px !important;
                position: relative !important;
                overflow: hidden !important;
                z-index: 1;
            }

            /* Shine Effect: White Reflective */
            .cta-button::before {
                content: '';
                position: absolute;
                top: 0;
                left: -100%;
                width: 100%;
                height: 100%;
                background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent) !important;
                transition: all 0.6s ease;
                z-index: 2;
            }

            .cta-button:hover {
                background: #D90429 !important;
                color: #ffffff !important;
                transform: translateY(-2px);
                box-shadow: 0 10px 20px rgba(217, 4, 41, 0.3) !important;
            }

            .cta-button:hover::before {
                left: 100%;
            }

            /* --- MOBILE HEADER CAPSULE --- */
            .mobile-header-capsule {
                display: flex;
                align-items: center;
                background: rgba(255, 255, 255, 0.95);
                backdrop-filter: blur(8px);
                border: 1px solid rgba(226, 232, 240, 0.8);
                border-radius: 40px;
                padding: 3px 3px 3px 12px;
                box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
                margin-left: auto;
                height: 42px;
                margin-right: -5px;
                transition: transform 0.2s ease;
            }

            .mobile-lang-pill {
                background: transparent;
                border: none;
                color: #334155;
                font-weight: 700;
                font-size: 14px;
                padding: 0 8px 0 0;
                cursor: pointer;
                font-family: 'Outfit', sans-serif;
                letter-spacing: 0.5px;
                transition: color 0.3s ease;
            }

            .mobile-lang-pill:active {
                transform: scale(0.95);
                color: #D90429;
            }

            .capsule-divider {
                width: 1px;
                height: 18px;
                background: linear-gradient(to bottom, #cbd5e1 0%, rgba(203, 213, 225, 0.3) 100%);
            }

            .mobile-menu-pill {
                width: 34px;
                height: 34px;
                background: linear-gradient(135deg, #D90429 0%, #a30320 100%);
                border: none;
                border-radius: 50%;
                color: white;
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
                box-shadow: 0 4px 10px rgba(217, 4, 41, 0.3);
                font-size: 14px;
                margin-left: 8px;
            }

            .mobile-menu-pill:active {
                transform: scale(0.90);
            }

            .mobile-header-cta {
                display: none !important;
            }

            /* --- MOBILE MENU DROPDOWN --- */
            .mobile-menu-dropdown {
                position: absolute;
                top: 75px;
                right: 15px;
                background: rgba(255, 255, 255, 0.98);
                backdrop-filter: blur(12px);
                border: 1px solid rgba(226, 232, 240, 0.8);
                border-radius: 20px;
                box-shadow: 0 15px 40px -10px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.02);
                width: 190px;
                display: none;
                flex-direction: column;
                padding: 5px;
                z-index: 99999;
                transform-origin: top right;
                animation: menuSlideIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
            }

            @keyframes menuSlideIn {
                from {
                    opacity: 0;
                    transform: scale(0.92) translateY(-8px);
                }

                to {
                    opacity: 1;
                    transform: scale(1) translateY(0);
                }
            }

            .mobile-menu-dropdown.active {
                display: flex !important;
            }

            .mobile-menu-item {
                padding: 10px 12px;
                text-decoration: none;
                color: #334155;
                font-weight: 600;
                font-family: 'Outfit', sans-serif;
                font-size: 13.5px;
                border-radius: 14px;
                display: flex;
                align-items: center;
                gap: 10px;
                margin-bottom: 2px;
                transition: all 0.2s ease;
                position: relative;
                overflow: hidden;
            }

            .mobile-menu-item i {
                font-size: 15px;
                color: #94a3b8;
                transition: color 0.2s;
                width: 20px;
                text-align: center;
            }

            .mobile-menu-item:hover {
                background: #f8fafc;
                color: #0f172a;
                transform: translateX(2px);
            }

            .mobile-menu-item:hover i {
                color: #475569;
            }

            .mobile-menu-item.highlight {
                background: #fff1f2;
                color: #D90429;
                margin-top: 4px;
            }

            .mobile-menu-item.highlight i {
                color: #D90429;
            }

            .mobile-menu-item.highlight:hover {
                background: linear-gradient(135deg, #D90429 0%, #a30320 100%);
                color: white;
                box-shadow: 0 4px 12px rgba(217, 4, 41, 0.25);
                transform: translateY(-1px);
            }

            .mobile-menu-item.highlight:hover i {
                color: white;
            }
        }

        /* --- GLOBAL HEADER RENOVATION (Step: Synchronization) --- */

        /* 1. Header Base */
        .corporate-header {
            background: linear-gradient(180deg, #ffffff 0%, #e2e8f0 100%) !important;
            position: relative !important;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
        }

        .corporate-header::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0.05;
            pointer-events: none;
            z-index: 1;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
        }

        /* 2. Navigation Reset & Alignment */
        ul.nav-menu {
            padding: 0 !important;
            margin: 0 !important;
        }

        .main-navigation .nav-link {
            padding: 10px 0 !important;
            display: inline-block !important;
            /* Override Bootstrap block */
            position: relative;
            font-family: 'Outfit', sans-serif !important;
            /* Ensure consistent font */
            font-weight: 500 !important;
        }

        /* 3. Nav Hover Effect (Red Underline) */
        .main-navigation .nav-link::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 0%;
            height: 2px;
            background: #D90429;
            /* Brand Red */
            transition: width 0.3s ease;
        }

        .main-navigation .nav-link:hover::after {
            width: 100%;
        }

        .main-navigation .nav-link:hover {
            color: #D90429 !important;
        }

        /* 4. CTA Button (Red Outline Pill) */
        header .cta-button {
            background: #ffffff !important;
            color: #D90429 !important;
            border: 1px solid #D90429 !important;
            box-shadow: none !important;
            border-radius: 50px !important;
            /* Pill shape */
            padding: 8px 20px !important;
            transition: all 0.3s ease !important;
        }

        header .cta-button i {
            color: #D90429 !important;
            transition: color 0.3s ease !important;
        }

        header .cta-button:hover {
            background: linear-gradient(135deg, #D90429 0%, #a30320 100%) !important;
            color: #ffffff !important;
            border-color: transparent !important;
            box-shadow: 0 4px 12px rgba(217, 4, 41, 0.3) !important;
            transform: translateY(-2px) !important;
        }

        header .cta-button:hover i {
            color: #ffffff !important;
        }

        /* 5. Header Layout & Alignment (DESKTOP) */
        /* Only apply complex grid alignment on large screens to prevent mobile breakage */
        @media (min-width: 992px) {
            header .header-container {
                max-width: 1400px !important;
                /* Premium wide container */
                padding: 0 25px !important;
                /* Optimized padding */
                margin: 0 auto !important;
            }

            header .header-wrapper {
                display: grid !important;
                grid-template-columns: 1fr auto 1fr !important;
                /* Perfect Center Alignment */
                gap: 40px !important;
                height: 90px !important;
                align-items: center !important;
            }

            /* Column Alignment Helpers */
            header .logo-section {
                display: flex !important;
                justify-content: flex-start !important;
                padding-left: 0 !important;
            }

            header .main-navigation {
                display: flex !important;
                justify-content: center !important;
                width: 100% !important;
            }

            header .header-right-group {
                display: flex !important;
                justify-content: flex-end !important;
                padding-right: 0 !important;
            }

            /* Logo Size Increase */
            .header-logo-img {
                height: 50px !important;
                max-height: none !important;
                width: auto !important;
            }
        }

        /* Hide mobile elements on desktop */
        @media (min-width: 992px) {

            .mobile-menu-dropdown,
            .mobile-header-capsule,
            .mobile-header-cta {
                display: none !important;
            }
        }

        /* 6. Header Layout (MOBILE/TABLET) */
        @media (max-width: 991px) {
            header .header-wrapper {
                display: flex !important;
                justify-content: space-between !important;
                align-items: center !important;
                height: 70px !important;
                gap: 10px !important;
                padding: 0 15px !important;
            }

            /* Hide nav on mobile (Bootstrap usually handles this, but forcing just in case) */
            .main-navigation {
                display: none !important;
            }

            .header-logo-img {
                height: 35px !important;
                /* Smaller logo */
            }
        }

        /* --- FLAWLESS HEADER STYLES (IMPORTED FROM INDEX.HTML) --- */
        .corporate-header {
            background: linear-gradient(180deg, #ffffff 0%, #e2e8f0 100%) !important;
            position: relative !important;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
        }

        /* FIX BOOTSTRAP INTERFERENCE */
        ul.nav-menu {
            padding: 0 !important;
            margin: 0 !important;
        }

        .main-navigation .nav-link {
            padding: 10px 0 !important;
            display: inline-block !important;
            position: relative;
        }

        /* NAV HOVER EFFECT (Underline Animation) */
        .main-navigation .nav-link::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 0%;
            height: 2px;
            background: #D90429;
            transition: width 0.3s ease;
        }

        .main-navigation .nav-link:hover::after {
            width: 100%;
        }

        .main-navigation .nav-link:hover {
            color: #D90429 !important;
        }

        /* CTA BUTTON (Outline Red) */
        header .cta-button {
            background: #ffffff !important;
            color: #D90429 !important;
            border: 1px solid #D90429 !important;
            box-shadow: none !important;
            border-radius: 50px !important;
            padding: 8px 20px !important;
            transition: all 0.3s ease !important;
        }

        header .cta-button i {
            color: #D90429 !important;
            transition: color 0.3s ease !important;
        }

        header .cta-button:hover {
            background: linear-gradient(135deg, #D90429 0%, #a30320 100%) !important;
            color: #ffffff !important;
            border-color: transparent !important;
            box-shadow: 0 4px 12px rgba(217, 4, 41, 0.3) !important;
            transform: translateY(-2px) !important;
        }

        header .cta-button:hover i {
            color: #ffffff !important;
        }

        /* HEAD LINE ALIGNMENT (DESKTOP) */
        @media (min-width: 992px) {
            header .header-container {
                max-width: 1400px !important;
                padding: 0 25px !important;
                margin: 0 auto !important;
            }

            .header-logo-img {
                height: 50px !important;
                max-height: none !important;
                width: auto !important;
            }

            header .header-wrapper {
                display: grid !important;
                grid-template-columns: auto 1fr auto !important;
                /* Adjusted for better spacing */
                gap: 20px !important;
                /* Reduced gap from 40px */
                height: 90px !important;
                align-items: center !important;
            }

            /* Reduced spacing for intermediate screens */
            @media (max-width: 1400px) {
                header .header-wrapper {
                    gap: 15px !important;
                }

                .main-navigation .nav-link {
                    font-size: 14px !important;
                    padding: 8px 10px !important;
                }

                .nav-menu {
                    gap: 15px !important;
                    display: flex !important;
                }
            }

            header .logo-section {
                display: flex !important;
                justify-content: flex-start !important;
                padding-left: 0 !important;
                min-width: 180px;
                /* Ensure logo doesn't squash */
            }

            header .main-navigation {
                display: flex !important;
                justify-content: center !important;
                width: 100% !important;
                overflow: hidden;
                /* Safety */
            }

            header .header-right-group {
                display: flex !important;
                justify-content: flex-end !important;
                padding-right: 0 !important;
                min-width: 250px;
                /* Ensure buttons have space */
                gap: 10px !important;
            }

            .mobile-actions,
            .mobile-menu-dropdown,
            .mobile-lang-dropdown {
                display: none !important;
            }
        }

        /* LANGUAGE SWITCHER OVERRIDE */
        .lang-toggle-v2 {
            border: 1px solid #e2e8f0 !important;
            background: transparent !important;
            color: #334155 !important;
            font-weight: 700 !important;
            border-radius: 50% !important;
            width: 32px !important;
            height: 32px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 !important;
            transition: all 0.3s ease !important;
            cursor: pointer;
            position: relative;
            z-index: 1;
        }

        .lang-toggle-v2:hover {
            background: rgba(241, 245, 249, 0.5) !important;
            border-color: #cbd5e1 !important;
            color: #0f172a !important;
        }

        .lang-toggle-v2 span {
            color: inherit !important;
            position: relative;
            top: 1px;
            font-size: 13px !important;
        }

        /* MOBILE HEADER RESET */
        @media (max-width: 991px) {
            header .header-wrapper {
                display: flex !important;
                justify-content: space-between !important;
                align-items: center !important;
                height: 50px !important;
                gap: 10px !important;
            }

            .header-logo-img {
                height: 25px !important;
            }

            .lang-dropdown-v2 {
                display: none !important;
            }

            .mobile-header-capsule {
                display: flex;
                align-items: center;
                background: rgba(255, 255, 255, 0.95);
                backdrop-filter: blur(8px);
                border: 1px solid rgba(226, 232, 240, 0.8);
                border-radius: 40px;
                padding: 3px;
                box-shadow: 0 5px 15px rgba(0, 0, 0, 0.06);
                margin-left: auto;
                height: 32px;
                margin-right: -5px;
                transition: transform 0.2s ease;
            }

            .mobile-lang-pill {
                background: transparent;
                border: none;
                font-family: 'Outfit', sans-serif;
                font-weight: 700;
                font-size: 11px;
                color: #334155;
                padding: 0 6px 0 0;
                cursor: pointer;
                letter-spacing: 0.5px;
                transition: color 0.3s ease;
            }

            .mobile-lang-pill:active {
                transform: scale(0.95);
                color: #D90429;
            }

            .capsule-divider {
                width: 1px;
                height: 12px;
                background: linear-gradient(to bottom, #cbd5e1 0%, rgba(203, 213, 225, 0.3) 100%);
            }

            .mobile-menu-pill {
                background: linear-gradient(135deg, #D90429 0%, #a30320 100%);
                color: #ffffff;
                border: none;
                width: 24px;
                height: 24px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 11px;
                margin-left: 6px;
                cursor: pointer;
                box-shadow: 0 3px 8px rgba(217, 4, 41, 0.3);
                transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
            }

            .mobile-menu-pill:active {
                transform: scale(0.90);
            }

            .mobile-header-cta {
                display: none !important;
            }
        }



        /* MOBILE MENU DROPDOWN (COMPACT PREMIUM) */
        .mobile-menu-dropdown {
            position: absolute;
            top: 70px;
            right: 15px;
            background: rgba(255, 255, 255, 0.98);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(226, 232, 240, 0.8);
            border-radius: 20px;
            box-shadow: 0 15px 40px -10px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.02);
            width: 190px;
            display: none;
            flex-direction: column;
            padding: 5px;
            z-index: 99999;
            transform-origin: top right;
            animation: menuSlideIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        }

        @keyframes menuSlideIn {
            from {
                opacity: 0;
                transform: scale(0.92) translateY(-8px);
            }

            to {
                opacity: 1;
                transform: scale(1) translateY(0);
            }
        }

        .mobile-menu-dropdown.active {
            display: flex;
        }

        .mobile-menu-item {
            padding: 10px 12px;
            text-decoration: none;
            color: #334155;
            font-weight: 600;
            font-family: 'Outfit', sans-serif;
            font-size: 13.5px;
            border-radius: 14px;
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 2px;
            transition: all 0.2s ease;
            position: relative;
            overflow: hidden;
        }

        .mobile-menu-item i {
            font-size: 15px;
            color: #94a3b8;
            transition: color 0.2s;
            width: 20px;
            text-align: center;
        }

        .mobile-menu-item:hover {
            background: #f8fafc;
            color: #0f172a;
            transform: translateX(2px);
        }

        .mobile-menu-item:hover i {
            color: #475569;
        }

        .mobile-menu-item.highlight {
            background: #fff1f2;
            color: #D90429;
            margin-top: 4px;
        }

        .mobile-menu-item.highlight i {
            color: #D90429;
        }

        .mobile-menu-item.highlight:hover {
            background: linear-gradient(135deg, #D90429 0%, #a30320 100%);
            color: white;
            box-shadow: 0 4px 12px rgba(217, 4, 41, 0.25);
            transform: translateY(-1px);
        }

        .mobile-menu-item.highlight:hover i {
            color: white;
        }


        /* --- MOBILE BOTTOM NAVIGATION (FLUSH AT BOTTOM) --- */
        @media (max-width: 991px) {
            .mobile-bottom-nav {
                position: fixed !important;
                bottom: 0 !important;
                left: 0 !important;
                width: 100% !important;
                height: 55px !important;
                background: #ffffff !important;
                display: flex !important;
                justify-content: space-around !important;
                align-items: center !important;
                padding: 0 !important;
                margin: 0 !important;
                z-index: 999999 !important;
                border-top: 1px solid #eee !important;
                transform: none !important;
            }
        }

        .mobile-bottom-nav .nav-item {
            display: flex !important;
            flex-direction: column !important;
            align-items: center !important;
            justify-content: center !important;
            text-decoration: none !important;
            color: #64748b !important;
            font-family: 'Outfit', sans-serif !important;
            font-size: 10px !important;
            gap: 5px !important;
            flex: 1 !important;
            transition: all 0.2s ease !important;
            background: transparent !important;
            border: none !important;
        }

        .mobile-bottom-nav .nav-item i {
            font-size: 20px !important;
            color: #94a3b8 !important;
            transition: all 0.2s ease !important;
        }

        .mobile-bottom-nav .nav-item.active {
            color: #D90429 !important;
        }

        .mobile-bottom-nav .nav-item.active i {
            color: #D90429 !important;
            transform: translateY(-2px);
            filter: drop-shadow(0 4px 8px rgba(217, 4, 41, 0.3));
        }
    }

    @media (min-width: 992px) {
        .mobile-bottom-nav {
            display: none !important;
        }
    }

    /* --- FORCE HIDE MOBILE ELEMENTS ON DESKTOP (LAST RESORT) --- */
    @media (min-width: 992px) {

        .mobile-menu-dropdown,
        .mobile-header-capsule,
        .mobile-header-cta,
        .mobile-bottom-nav {
            display: none !important;
        }
    }


    /* --- HERO V2 (TRAVEL THEME - USER REQUESTED) --- */
    .hero-section {
        display: none !important;
        /* Hide old hero */
    }

    .hero-travel-theme {
        position: relative;
        min-height: 850px;
        background: url('https://images.unsplash.com/photo-1540541338287-41700207dee6?q=80&w=2000&auto=format&fit=crop') no-repeat center center/cover;
        background-attachment: fixed;
        /* Parallax effect */
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-top: 150px;
        text-align: center;
        overflow: hidden;
        color: #fff;
    }

    .hero-travel-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        /* Gradient mimicking the sky and fading to white at bottom */
        background: linear-gradient(180deg,
                rgba(15, 23, 42, 0.3) 0%,
                rgba(59, 130, 246, 0.1) 40%,
                rgba(255, 255, 255, 0.9) 85%,
                rgba(255, 255, 255, 1) 100%);
        z-index: 1;
    }

    .hero-travel-content {
        position: relative;
        z-index: 10;
        width: 100%;
        max-width: 1200px;
        padding: 0 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .hero-travel-title {
        font-size: 56px;
        font-weight: 800;
        color: #fff;
        text-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
        margin-bottom: 10px;
        line-height: 1.1;
        letter-spacing: -1px;
        font-family: 'Outfit', sans-serif;
    }

    .hero-travel-subtitle {
        font-size: 24px;
        font-weight: 600;
        color: #f8fafc;
        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
        margin-bottom: 50px;
        letter-spacing: 0.5px;
        opacity: 0.95;
    }

    /* Premium Search Bar V2 */
    .hero-travel-search-box {
        width: 100%;
        max-width: 850px;
        margin-bottom: 50px;
        position: relative;
        z-index: 20;
    }

    .hero-travel-search-box .premium-search-container {
        background: rgba(255, 255, 255, 0.98);
        padding: 8px 8px 8px 15px;
        border-radius: 100px;
        /* Fully rounded */
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.5);
        display: flex;
        align-items: center;
        gap: 15px;
    }

    .hero-travel-search-box .search-input-group,
    .hero-travel-search-box .search-select-group {
        background: transparent;
        border: none;
        border-right: 1px solid #e2e8f0;
        border-radius: 0;
        padding: 5px;
        box-shadow: none !important;
    }

    .hero-travel-search-box .search-input-group:last-of-type {
        border-right: none;
    }

    .hero-travel-search-box .search-input-group:hover,
    .hero-travel-search-box .search-select-group:hover {
        background: transparent;
        border-color: #e2e8f0;
    }

    .hero-travel-search-box .search-input,
    .hero-travel-search-box .search-select {
        font-size: 16px;
        color: #334155;
        font-weight: 500;
    }

    .hero-travel-search-box .search-btn-primary {
        background: linear-gradient(135deg, #D90429 0%, #a30320 100%);
        padding: 14px 45px;
        font-size: 18px;
        border-radius: 50px;
        /* Pill shape */
        box-shadow: 0 8px 20px rgba(217, 4, 41, 0.3);
    }

    .hero-travel-search-box .search-btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 25px rgba(217, 4, 41, 0.4);
    }

    /* Polaroid City Cards */
    .travel-cards-container {
        display: flex;
        justify-content: center;
        align-items: flex-end;
        gap: 25px;
        margin-top: 10px;
        margin-bottom: -60px;
        /* Push bottom to overlap next section */
        position: relative;
        z-index: 15;
        padding-bottom: 80px;
    }

    .polaroid-card {
        background: #fff;
        padding: 12px 12px 50px 12px;
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
        border-radius: 4px;
        width: 260px;
        transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
        cursor: pointer;
        position: relative;
        will-change: transform;
    }

    .polaroid-card:nth-child(1) {
        transform: rotate(-6deg) translateY(30px);
        z-index: 2;
    }

    .polaroid-card:nth-child(2) {
        transform: rotate(0deg) scale(1.1);
        z-index: 3;
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
    }

    .polaroid-card:nth-child(3) {
        transform: rotate(6deg) translateY(30px);
        z-index: 2;
    }

    .polaroid-card:hover {
        transform: rotate(0) scale(1.15) translateY(-20px);
        z-index: 20;
        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.35);
    }

    .polaroid-img {
        width: 100%;
        height: 300px;
        object-fit: cover;
        border-radius: 2px;
        filter: brightness(0.95);
        transition: filter 0.3s;
    }

    .polaroid-card:hover .polaroid-img {
        filter: brightness(1.05);
    }

    .polaroid-caption {
        position: absolute;
        bottom: 10px;
        left: 0;
        width: 100%;
        text-align: center;
        font-family: 'Outfit', sans-serif;
        /* Simulating handwritten/clean font */
        font-size: 28px;
        color: #1e293b;
        font-weight: 700;
        letter-spacing: -0.5px;
    }

    /* Bottom Feature Pills */
    .travel-features-bar {
        display: flex;
        justify-content: center;
        gap: 40px;
        margin-top: 0;
        position: relative;
        z-index: 20;
        width: 100%;
        padding: 0 20px 60px;
    }

    .feature-card-pill {
        background: #fff;
        border-radius: 24px;
        padding: 20px 30px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        min-width: 220px;
        text-align: center;
        transition: transform 0.3s ease;
        border: 1px solid rgba(0, 0, 0, 0.03);
    }

    .feature-card-pill:hover {
        transform: translateY(-5px);
    }

    .f-icon-circle {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        color: #fff;
        box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);
        margin-bottom: 5px;
    }

    .icon-store {
        background: linear-gradient(135deg, #ef4444 0%, #b91c1c 100%);
    }

    .icon-offer {
        background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    }

    .icon-discover {
        background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
    }

    .f-title {
        font-weight: 800;
        color: #1e293b;
        font-size: 18px;
    }

    /* Mobile Responsiveness */
    @media (max-width: 900px) {
        .heroes-section {
            display: none;
        }

        .hero-travel-theme {
            min-height: auto;
            padding-top: 100px;
            padding-bottom: 40px;
            background-attachment: scroll;
        }

        .hero-travel-title {
            font-size: 32px;
        }

        .hero-travel-subtitle {
            font-size: 16px;
            margin-bottom: 30px;
        }

        .hero-travel-search-box .premium-search-container {
            flex-direction: column;
            border-radius: 20px;
            padding: 15px;
            gap: 10px;
        }

        .hero-travel-search-box .search-input-group,
        .hero-travel-search-box .search-select-group {
            width: 100%;
            border-right: none;
            border-bottom: 1px solid #e2e8f0;
            margin-bottom: 5px;
        }

        .hero-travel-search-box .search-btn-primary {
            width: 100%;
            margin-top: 10px;
        }

        .travel-cards-container {
            flex-direction: column;
            align-items: center;
            gap: 15px;
            margin-bottom: 20px;
            padding-bottom: 20px;
        }

        .polaroid-card {
            width: 90%;
            transform: none !important;
            /* Reset rotation */
            padding-bottom: 12px;
            max-width: 320px;
        }

        .polaroid-img {
            height: 200px;
        }

        .polaroid-caption {
            position: relative;
            bottom: 0;
            margin-top: 10px;
            font-size: 22px;
        }

        .travel-features-bar {
            flex-direction: column;
            gap: 15px;
        }

        .feature-card-pill {
            flex-direction: row;
            width: 100%;
            padding: 15px;
            text-align: left;
        }

        .f-icon-circle {
            width: 48px;
            height: 48px;
            font-size: 20px;
        }
    }

    /* --- Utility Classes (Bootstrap Compatible) --- */
    .d-none {
        display: none !important;
    }

    .d-block {
        display: block !important;
    }

    .d-flex {
        display: flex !important;
    }

    @media (min-width: 992px) {
        .d-lg-none {
            display: none !important;
        }

        .d-lg-block {
            display: block !important;
        }

        .d-lg-flex {
            display: flex !important;
        }
    }

    @media (max-width: 991px) {
        .d-none-sm {
            display: none !important;
        }
    }
}

/* --- FULL BLEED STORIES ON MOBILE (Fixed) --- */
@media (max-width: 768px) {

    /* Break out of container constraints */
    #storiesSection .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Remove Card borders & paddings that constrain width */
    #storiesSection .stories-app-card {
        border: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        padding: 0 0 20px 0 !important;
        margin: 0 !important;
        background: transparent !important;
    }

    /* Keep Header padded so it looks aligned */
    #storiesSection .stories-header {
        padding: 0 20px 15px 20px !important;
        margin-bottom: 10px !important;
    }

    /* The Scrolling Track */
    #storiesSection .stories-track {
        display: flex !important;
        gap: 12px !important;
        padding: 0 20px !important;
        overflow-x: auto !important;
        scroll-padding-left: 20px;
        width: 100% !important;
    }

    /* Individual Stories - Make them fit ~4.5 on screen */
    #storiesSection .story-node {
        width: 82px !important;
        flex: 0 0 82px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    #storiesSection .story-label {
        display: block !important;
        text-align: center !important;
        width: 100% !important;
        font-size: 11.5px !important;
        margin-top: 6px !important;
        color: #334155 !important;
    }

    #storiesSection .story-avatar-wrap {
        width: 72px !important;
        height: 72px !important;
        margin-bottom: 6px !important;
        border-width: 2px !important;
    }

    /* Hide Navigation Arrows on Mobile */
    #storiesSection .story-nav-btn {
        display: none !important;
    }
}


/* --- FORCE MOBILE HERO CARD HEIGHT & POSITION (FIXED) --- */
@media (max-width: 768px) {

    /* Prevent Global Horizontal Scroll */
    html,
    body {
        overflow-x: hidden !important;
        position: relative;
    }

    /* 1. Move the whole slider container DOWN so cards grow downwards visually */
    body .hero-footer-slider {
        bottom: 130px !important;
        /* Raised up to 130px (User requested higher) */
        padding-bottom: 0 !important;
    }

    /* 2. Adjust Card Dimensions (Not too long, rectangular) */
    body .venue-card-hero {
        height: 240px !important;
        width: 160px !important;
        min-height: 240px !important;
        flex-shrink: 0 !important;

        /* 3. Fix "Shaking" - Disable complex transforms on mobile */
        transform: none !important;
        transition: none !important;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
        margin-bottom: 0 !important;
    }

    /* Disable hover effects on mobile to prevent sticky states/jitters */
    body .venue-card-hero:hover,
    body .venue-card-hero:active {
        transform: none !important;
    }

    body .venue-card-hero .vch-bg {
        height: 100% !important;
        object-fit: cover !important;
        transition: none !important;
    }

    body .vch-content {
        bottom: 0 !important;
        padding: 12px !important;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent) !important;
    }
}

/* --- FORCE HIDE UTILITY FOR MOBILE --- */
@media (max-width: 768px) {
    .important-mobile-hide {
        display: none !important;
    }
}

/* =====================================================
   ULTIMATE MOBILE STORY FIX (FORCE HORIZONTAL)
   ===================================================== */
@media screen and (max-width: 991px) {

    #storiesSection .stories-track,
    #storiesTrack.stories-track,
    .stories-track {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 16px !important;
        padding: 10px 15px !important;
        width: 100% !important;
        justify-content: flex-start !important;
        scrollbar-width: none !important;
    }

    #storiesSection .story-node,
    #storiesTrack .story-node,
    .story-node {
        flex: 0 0 76px !important;
        width: 76px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    .story-label {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        color: #334155 !important;
        font-size: 11.5px !important;
        text-align: center !important;
        margin-top: 8px !important;
        width: 100% !important;
    }
}

/* ========== ORIJINAL MÜKEMMEL FOOTER TASARIMI (RESTORED) ========== */
.vdz-footer {
    background: #0f172a !important;
    color: #94a3b8 !important;
    font-family: 'Inter', sans-serif !important;
    padding: 60px 0 30px 0 !important;
    position: relative !important;
    z-index: 10 !important;
}

.vdz-footer-main {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: grid !important;
    grid-template-columns: 1.2fr 0.8fr 0.8fr 1.2fr !important;
    gap: 40px;
}

.vdz-footer-brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.vdz-footer-logo {
    font-family: 'Outfit', sans-serif !important;
    font-size: 36px !important;
    font-weight: 800 !important;
    color: #fff !important;
    margin: 0 !important;
    letter-spacing: -1.2px !important;
    line-height: 1 !important;
    position: relative !important;
    display: inline-block !important;
}

.vdz-footer-logo::after {
    content: '';
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    height: 8px;
    background-image: url("data:image/svg+xml,%3Csvg width='150' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 10 C 40 2, 110 2, 145 10' stroke='%23D90429' stroke-width='4' fill='transparent' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.vdz-footer-brand p {
    font-size: 14px;
    color: #94a3b8;
    margin: 22px 0 28px 0;
    font-weight: 500;
    opacity: 0.9;
}

.vdz-footer-socials {
    display: flex !important;
    gap: 14px;
}

.vdz-footer-socials a {
    position: relative;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    font-size: 18px !important;
    text-decoration: none !important;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.vdz-footer-socials a:hover {
    transform: translateY(-6px);
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.3);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
}

/* SOCIAL ICON BRAND COLORS */
.instagram i {
    color: #E4405F !important;
    text-shadow: 0 0 10px rgba(228, 64, 95, 0.3);
}

.facebook i {
    color: #1877F2 !important;
    text-shadow: 0 0 10px rgba(24, 119, 242, 0.3);
}

.twitter i {
    color: #fff !important;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}

.linkedin i {
    color: #0077B5 !important;
    text-shadow: 0 0 10px rgba(0, 119, 181, 0.3);
}

.vdz-footer-col h4 {
    color: #fff !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    margin-bottom: 28px !important;
}

.vdz-footer-col ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.vdz-footer-col ul li {
    margin-bottom: 18px !important;
}

.vdz-footer-col ul li a {
    color: #fff !important;
    text-decoration: none !important;
    font-size: 15px !important;
    transition: all 0.3s;
    position: relative;
    padding-bottom: 8px;
    display: inline-block;
}

.vdz-footer-col ul li a::after {
    content: '';
    position: absolute;
    bottom: 1px;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 1.5px;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.7) 50%, transparent 100%);
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.5);
    transition: all 0.3s ease;
}

.vdz-footer-col ul li a:hover::after {
    width: 100%;
    height: 2px;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.8);
}

.vdz-footer-contact-item {
    display: flex !important;
    align-items: center !important;
    gap: 15px;
    margin-bottom: 20px;
    font-size: 15px;
}

.vdz-footer-btn-add {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px;
    background: #D90429 !important;
    color: #fff !important;
    padding: 12px 25px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 5px 20px rgba(217, 4, 41, 0.4);
    transition: all 0.3s ease;
}

.vdz-footer-btn-add:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(217, 4, 41, 0.6);
}

.vdz-footer-bottom {
    max-width: 1200px;
    margin: 40px auto 0 auto;
    padding: 30px 20px 0 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.vdz-footer-legal a {
    color: #94a3b8 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    margin-left: 20px;
}

@media (max-width: 991px) {
    .vdz-footer {
        padding: 40px 0 120px 0 !important;
    }

    .vdz-footer-main {
        display: flex !important;
        flex-direction: column !important;
        gap: 15px !important;
    }

    .vdz-footer-brand {
        align-items: center !important;
        text-align: center !important;
        margin-bottom: 30px !important;
    }

    .vdz-footer-col {
        background: rgba(255, 255, 255, 0.03) !important;
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        border-radius: 15px !important;
        overflow: hidden !important;
    }

    .vdz-footer-col h4 {
        margin-bottom: 0 !important;
        padding: 18px 20px !important;
        font-size: 16px !important;
        display: flex !important;
        justify-content: space-between !important;
        cursor: pointer !important;
    }

    .vdz-footer-col h4::after {
        content: '\f078';
        font-family: 'Font Awesome 6 Free';
        font-weight: 900;
        font-size: 12px;
        transition: transform 0.3s;
    }

    .vdz-footer-col.active h4::after {
        transform: rotate(180deg);
    }

    .vdz-footer-col ul,
    .vdz-footer-col .vdz-footer-contact-wrapper {
        max-height: 0 !important;
        overflow: hidden !important;
        transition: max-height 0.4s ease !important;
        padding: 0 20px !important;
        opacity: 0 !important;
    }

    .vdz-footer-col.active ul,
    .vdz-footer-col.active .vdz-footer-contact-wrapper {
        max-height: 1000px !important;
        padding: 10px 20px 20px 20px !important;
        opacity: 1 !important;
    }

    .vdz-footer-bottom {
        flex-direction: column !important;
        gap: 15px !important;
        text-align: center !important;
    }
}