/* PERF: efecte decorative grele făcute STATICE platform-wide.
           Stelele rămân vizibile (e doar oprit twinkle-ul) iar nebuloasele păstrează
           blur-ul STATIC (rasterizat o singură dată = ieftin). Elimină ~200 de animații
           CSS simultane per pagină care forțau recompositing continuu (lag la scroll). */
        .star, .star--sm, .star--md, .star--lg,
        .st, .st-s, .st-m, .st-l,
        .nebula, .neb {
            animation: none !important;}

        /* CSS Variables */
        :root {
            --bg: var(--mv-bg);
            --glass: rgba(255,255,255,0.08);
            --border: var(--mv-border);
            --text: var(--mv-text-soft);
            --muted: var(--mv-text-2);
            --primary: var(--mv-accent);
            --accent: var(--mv-accent-soft);}
        
        /* ==========================================
           NAVBAR MOBILE FIX - FULL SCREEN
           ========================================== */
        .nav {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            height: 60px;
            background: rgba(11, 18, 32, 0.95);
            border-bottom: 1px solid var(--border);
            z-index: 9999;}
        
        .nav-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 100%;
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 16px;}
        
        .brand {
            display: flex;
            align-items: center;
            gap: 8px;
            text-decoration: none;
            color: var(--mv-text);
            font-weight: 700;
            font-size: 1.1rem;
            z-index: 10001;}
        
        .brand .logo, .brand img {
            width: 32px;
            height: 32px;}
        
        /* Hamburger Button */
        .menu-toggle {
            display: none;
            width: 44px;
            height: 44px;
            background: var(--mv-elev-2);
            border: 1px solid var(--mv-border);
            border-radius: 12px;
            cursor: pointer;
            z-index: 10001;
            padding: 0;
            position: relative;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 5px;}

        .menu-toggle:active {
            background: var(--mv-elev-4);}

        .menu-toggle span {
            display: block;
            width: 22px;
            height: 2.5px;
            background: var(--mv-text);
            border-radius: 2px;
            transition: transform 0.25s ease, opacity 0.2s ease;
            transform-origin: center;}

        /* X centrat - liniile se intorc spre centru si se rotesc */
        .menu-toggle.active span:nth-child(1) {}
        .menu-toggle.active span:nth-child(2) {
            opacity: 0; transform: scaleX(0);}
        .menu-toggle.active span:nth-child(3) {}
        
        /* Desktop Menu */
        .menu {
            display: flex;
            align-items: center;
            gap: 8px;}
        
        .menu a {
            padding: 8px 14px;
            color: var(--text);
            text-decoration: none;
            font-size: 0.9rem;
            font-weight: 500;
            border-radius: 8px;
            transition: background 0.2s, color 0.2s;
            white-space: nowrap;}
        .nav-plus-link { display: flex; align-items: center; gap: 4px;}
        .plus-badge {
            color: var(--primary); font-weight: 700;}
        
        .menu a:hover {
            background: var(--mv-elev-3);
            color: var(--primary);}
        
        .menu .btn {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 8px 16px;
            background: var(--mv-elev-3);
            border: 1px solid var(--border);
            border-radius: 10px;}
        
        .menu .btn.primary { background: var(--mv-accent);
            color: var(--mv-text-inverse);
            border: none;
            font-weight: 600;}
        
        /* Dropdown */
        .nav-dropdown {
            position: relative;}
        
        .dropdown-toggle {
            display: flex;
            align-items: center;
            gap: 6px;}
        
        .dropdown-toggle i {
            font-size: 0.7rem;
            transition: transform 0.2s;}
        
        .dropdown-menu {
            position: absolute;
            top: calc(100% + 4px);
            left: 0;
            min-width: 200px;
            background: rgba(11, 18, 32, 0.98);
            border: 1px solid var(--border);
            border-radius: 12px;
            padding: 8px;
            opacity: 0;
            visibility: hidden;
            transform: translateY(-6px);
            transition: opacity 0.2s, visibility 0.2s, transform 0.2s;
            z-index: 100;
            pointer-events: none;}
        .dropdown-menu::before {
            content: '';
            position: absolute;
            top: -12px;
            left: 0;
            right: 0;
            height: 12px;}

        .nav-dropdown:hover .dropdown-menu,
        .nav-dropdown.open .dropdown-menu {
            opacity: 1;
            visibility: visible; transform: translateY(0);
            pointer-events: auto;}
        
        .nav-dropdown:hover .dropdown-toggle i,
        .nav-dropdown.open .dropdown-toggle i {}
        
        .dropdown-menu a {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 14px;}

        /* In dropdown, la hover se coloreaza DOAR textul, fara cutia de fundal
           (altfel prinde background-ul din .menu a:hover). */
        .dropdown-menu a:hover {
            background: none;
            color: var(--primary);}

        .dropdown-menu a i {
            width: 18px;
            color: var(--primary);}
        
        /* ==========================================
           MOBILE NAVBAR - FULL SCREEN OVERLAY
           COMPLET ASCUNS CÂND E ÎNCHIS
           ========================================== */
        @media (max-width: 1200px) {
            .menu-toggle {
                display: flex;}
            
            /* MENIU ÎNCHIS - complet invizibil */
            .menu {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                width: 100vw;
                height: 100vh;
                height: 100dvh;
                background: var(--mv-bg);
                flex-direction: column;
                justify-content: flex-start;
                align-items: stretch;
                padding: 76px max(16px, env(safe-area-inset-left, 16px)) max(20px, env(safe-area-inset-bottom, 20px));
                gap: 6px;
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
                z-index: 10000;
                /* ASCUNS COMPLET */
                visibility: hidden;
                opacity: 0; transform: translateX(100%);
                pointer-events: none;
                transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s;}

            /* MENIU DESCHIS - vizibil */
            .menu.active {
                visibility: visible;
                opacity: 1; transform: translateX(0);
                pointer-events: auto;
                transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0s;}

            .menu a {
                padding: 13px 18px;
                font-size: 1rem;
                border: 1px solid var(--border);
                background: var(--mv-elev-1);
                text-align: center;
                border-radius: 12px;
                font-weight: 500;}

            .menu a:hover,
            .menu a.active {
                background: rgba(110, 193, 255, 0.15);
                border-color: var(--primary);}

            .menu .btn {
                justify-content: center;
                padding: 13px 18px;
                width: 100%;
                font-weight: 600;}

            /* Separator subtil inainte de butonul Programeaza-te */
            .menu .btn.primary {
                margin-top: 12px;
                position: relative;}
            .menu .btn.primary::before {
                content: '';
                position: absolute;
                top: -7px;
                left: 25%;
                right: 25%;
                height: 1px; background: var(--mv-elev-4);}
            
            .menu .btn.primary { background: var(--mv-accent);
                color: var(--mv-text-inverse);}
            
            /* DROPDOWN PE MOBIL - Click toggle - FORȚAT VIZIBIL */
            .menu .nav-dropdown {
                position: relative !important;
                width: 100% !important;
                display: flex !important;
                flex-direction: column !important;
                visibility: visible !important;
                opacity: 1 !important;}
            
            .menu .nav-dropdown .dropdown-toggle {
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                gap: 8px !important;
                width: 100% !important;
                padding: 13px 18px !important;
                font-size: 1rem !important;
                border: 1px solid var(--border) !important;
                background: var(--mv-elev-1) !important;
                border-radius: 12px !important;
                color: var(--text) !important;
                text-decoration: none !important;
                visibility: visible !important;
                opacity: 1 !important;
                height: auto !important;
                overflow: visible !important;
                font-weight: 500 !important;}
            
            .menu .nav-dropdown .dropdown-toggle i {
                font-size: 0.75rem !important;
                transition: transform 0.3s !important;
                display: inline-block !important;}
            
            .menu .nav-dropdown.open .dropdown-toggle i { transform: !important;}
            
            /* Dropdown menu pe mobil - sub toggle, nu absolute */
            .menu .nav-dropdown .dropdown-menu {
                position: relative !important;
                top: 0 !important;
                left: 0 !important;
                width: 100% !important;
                min-width: 100% !important;
                margin-top: 8px !important;
                opacity: 0 !important;
                visibility: hidden !important;
                max-height: 0 !important;
                overflow: hidden !important; transform: none !important;
                transition: all 0.3s ease !important;
                background: rgba(11, 18, 32, 0.95) !important;
                border: 1px solid var(--border) !important;
                border-radius: 12px !important;
                padding: 0 !important;}
            
            .menu .nav-dropdown.open .dropdown-menu {
                opacity: 1 !important;
                visibility: visible !important;
                max-height: 500px !important;
                padding: 8px !important;}
            
            .menu .nav-dropdown .dropdown-menu a {
                display: flex !important;
                align-items: center !important;
                padding: 14px 16px !important;
                font-size: 0.95rem !important;
                background: transparent !important;
                border: none !important;
                justify-content: flex-start !important;
                text-align: left !important;
                gap: 10px !important;}
            
            .menu .nav-dropdown .dropdown-menu a i {
                width: 20px !important;
                color: var(--primary) !important;}
            
            .menu .nav-dropdown .dropdown-menu a:hover {
                background: rgba(110, 193, 255, 0.1);}
            
            /* Disable hover on mobile - only click */
            .nav-dropdown:hover .dropdown-menu {
                opacity: 0;
                visibility: hidden;
                max-height: 0;
                padding: 0;}
            
            .nav-dropdown.open .dropdown-menu {
                opacity: 1 !important;
                visibility: visible !important;
                max-height: 500px !important;
                padding: 8px !important;}
        }
        
        /* Prevent body scroll when menu is open */
        body.menu-open {
            overflow: hidden;
            position: fixed;
            width: 100%;
            height: 100%;}
        
        /* ==========================================
           GRID CARDURI - 4-3-2-1 RESPONSIVE
           ========================================== */
        .psychologists-grid-spectacular,
        .grid-psy,
        .card-grid {
            display: grid;
            gap: 20px;
            grid-template-columns: repeat(4, 1fr);}
        
        @media (max-width: 1200px) {
            .psychologists-grid-spectacular,
            .grid-psy,
            .card-grid {
                grid-template-columns: repeat(3, 1fr);
                gap: 16px;}
        }
        
        @media (max-width: 900px) {
            .psychologists-grid-spectacular,
            .grid-psy,
            .card-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 14px;}
        }
        
        @media (max-width: 550px) {
            .psychologists-grid-spectacular,
            .grid-psy,
            .card-grid {
                grid-template-columns: 1fr;
                gap: 14px;}
        }
        
        /* ==========================================
           OPTIMIZĂRI TELEFOANE VECHI
           ========================================== */
        @media (max-width: 768px) {
            /* Dezactivează blur pe telefoane vechi */
            .nav,
            .menu,
            .glass {}
            
            .nav {
                background: var(--mv-bg) !important;}
            
            .menu {
                background: var(--mv-bg) !important;}
            
            /* Form inputs - prevent zoom on iOS */
            input, textarea, select {
                font-size: 16px !important;}
        }
        
        /* Reduce motion pentru accesibilitate și performanță */
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;}
        }
        
        /* Main content spacing */
        main, .page {
            padding-top: 70px;
            min-height: calc(100vh - 70px);}
        
        .container {
            width: 100%;
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 16px;}