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

:root {
    --color-primary: #0F172A;
    --color-accent: #F97316;
    --color-bg: #F8FAFC;
    --transition-speed: 0.3s;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--color-bg);
    color: var(--color-primary);
    overflow-x: hidden;
}

/* 1. HEADER FIX (Alb & Fixed) */
#main-header {
    background-color: #ffffff !important; /* Forțăm albul */
    transition: all 0.3s ease;
}

#main-header.scrolled {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

/* Logo resize la scroll */
#main-header .logo-img { height: 48px; transition: height 0.3s ease; }
#main-header.scrolled .logo-img { height: 36px; }


/* 2. MENIU MOBIL REPARAT */
#mobile-menu {
    transition: transform 0.3s ease-in-out;
    transform: translateX(100%) !important; /* Îl aruncăm în dreapta ecranului */
    display: flex !important; /* Ne asigurăm că are display flex */
    will-change: transform; /* Optimizare viteză */
}

/* Când are clasa 'open', îl aducem înapoi */
#mobile-menu.open {
    transform: translateX(0) !important;
}

/* 3. ALTE ELEMENTE UI */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #e2e8f0; }
::-webkit-scrollbar-thumb { background: var(--color-primary); border-radius: 4px; }

body.overflow-hidden { overflow: hidden; }

/* ... restul codului existent ... */

/* 4. HERO SLIDER ANIMATION */
/* ------------------------------------------------------------------------- */
.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.5s ease-in-out; /* Tranziție foarte fină */
    z-index: 0;
}

.hero-slide.active {
    opacity: 1;
    z-index: 1;
}

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

/* Overlay gradient pentru a face textul lizibil peste poze */
.hero-overlay {
    background: linear-gradient(to right, rgba(15, 23, 42, 0.9) 0%, rgba(15, 23, 42, 0.7) 40%, rgba(15, 23, 42, 0.2) 100%);
    position: absolute;
    inset: 0;
    z-index: 2;
}