/*
Theme Name: Cedra Tour
Description: Tema custom completa - Versiunea Optimizata
*/

/* =========================================
   1. VARIABILE & RESET
   ========================================= */
:root {
    /* Culori Brand */
    --cedra-blue: #0076bd; 
    --cedra-dark-blue: #005a9e;
    --cedra-red: #e31e24;  
    --color-white: #ffffff;
    --color-text: #333333;
    --color-bg-light: #f4f8fb;
    
    --font-main: 'Montserrat', sans-serif;
    --spacing-container: 1200px;
    --header-height: 100px; 
}

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

body {
    font-family: var(--font-main);
    color: var(--color-text);
    line-height: 1.6;
    background-color: var(--color-bg-light);
    padding-top: 0; 
}

img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* =========================================
   2. HEADER & NAVIGATIE
   ========================================= */
.site-header {
    background-color: var(--color-white);
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
    height: var(--header-height);
    display: flex;
    align-items: center;
    transition: transform 0.4s ease-in-out;
    animation: slideDownInitial 0.8s ease-out;
}

/* Ascundere header la scroll */
.site-header.header-hidden {
    transform: translateY(-100%);
    box-shadow: none;
}

@keyframes slideDownInitial {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.container {
    max-width: var(--spacing-container);
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
}

.header-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* --- LOGO --- */
.logo img {
    max-height: 80px;
    width: auto;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.logo:hover img {
    transform: scale(1.1);
    filter: drop-shadow(0 0 2px #FFD700);
}

/* --- MENIU DESKTOP --- */
.nav-list { display: flex; gap: 15px; }

.nav-list li a {
    display: inline-block;
    padding: 12px 25px;
    background-color: var(--cedra-blue); 
    color: var(--color-white);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;
    border-radius: 50px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 4px 6px rgba(0, 118, 189, 0.3);
}

.nav-list li a:hover {
    background-color: var(--cedra-red);
    transform: scale(1.1);
    box-shadow: 0 0 15px rgba(227, 30, 36, 0.6);
}

/* --- HAMBURGER ICON --- */
.hamburger-menu { display: none; cursor: pointer; }
.hamburger-menu span {
    display: block; width: 30px; height: 3px; 
    background: var(--cedra-blue);
    margin: 6px 0;
    transition: all 0.3s ease-in-out;
    transform-origin: left center;
}

/* Animatie X */
.hamburger-menu.open span:nth-child(1) { transform: rotate(45deg) translate(2px, -1px); }
.hamburger-menu.open span:nth-child(2) { opacity: 0; width: 0; }
.hamburger-menu.open span:nth-child(3) { transform: rotate(-45deg) translate(2px, 1px); }


/* =========================================
   3. HERO SECTION (CSS Slider + Overlay)
   ========================================= */
.hero-section-wrapper {
    position: relative;
    height: auto;
    min-height: 100vh;
    overflow: visible;
    background-color: #333;
    padding-top: 150px;
    padding-bottom: 80px;
}

/* Container Slider */
.css-slider {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    margin: 0; padding: 0;
    list-style: none;
    z-index: 0;
    overflow: hidden;
    max-width: 100vw;
}

/* Slide Individual */
.css-slider li {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    z-index: 0;
    animation: fadeCycle 18s linear infinite; 
}

/* Temporizare Slide-uri */
.css-slider li:nth-child(1) { animation-delay: 0s; }
.css-slider li:nth-child(2) { animation-delay: 6s; }
.css-slider li:nth-child(3) { animation-delay: 12s; }

@keyframes fadeCycle {
    0% { opacity: 0; transform: scale(1); }
    5% { opacity: 1; } 
    33% { opacity: 1; }
    38% { opacity: 0; transform: scale(1.05); }
    100% { opacity: 0; }
}

/* Overlay Puncte */
.hero-overlay-dots {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    z-index: 1;
    background-image: radial-gradient(var(--cedra-blue) 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: 0.3;
}
.hero-overlay-dots::after {
    content: ''; position: absolute; top:0; left:0; width:100%; height:100%;
    background: rgba(0,0,0,0.4); z-index: -1;
}

/* Content Wrapper */
.hero-content-container {
    position: relative; z-index: 5;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

/* =========================================
   4. MOTOR DE CAUTARE & FORMULAR
   ========================================= */
.search-engine-box {
    background: rgba(244, 248, 251, 0.98); /* Opacitate mare pentru performanta */
    /* backdrop-filter scos pentru a elimina lag-ul */
    padding: 25px;
    border-radius: 15px;
    width: 100%;
    max-width: 450px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    border-top: 4px solid var(--cedra-blue);
    position: relative;
    z-index: 10;
}

.search-engine-box h3 {
    color: var(--cedra-dark-blue);
    font-size: 1.2rem; font-weight: 800; margin-bottom: 20px;
    display: flex; align-items: center; gap: 10px;
}
.search-engine-box h3 i { color: var(--cedra-red); }

/* Form Elements */
.form-group { margin-bottom: 15px; }
.form-group label {
    display: block; font-size: 0.85rem; font-weight: 700;
    color: var(--cedra-dark-blue); margin-bottom: 5px;
}
.form-row.two-cols { display: flex; gap: 15px; }
.form-row.two-cols .form-group { flex: 1; }
.no-label-spacer { padding-top: 26px; }

.form-select, .budget-inputs input {
    width: 100%; padding: 10px 12px;
    border: 1px solid #dde6ef; border-radius: 8px;
    font-family: var(--font-main); color: #555;
    background: #fff;
    font-size: 0.9rem;
}
.form-select:focus { outline: 2px solid var(--cedra-blue); }

/* Slider Buget Custom */
#budget-slider { 
    height: 8px; 
    margin: 15px 5px 25px 5px; 
    border: none; background: #dde6ef;
    cursor: pointer; 
}
.noUi-connect { background: var(--cedra-blue); }
.noUi-handle {
    height: 22px; width: 22px;
    border-radius: 50%; border: 2px solid var(--cedra-blue); box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    background: white; cursor: grab;
    top: -9px; right: -11px;
}
.noUi-handle:before, .noUi-handle:after { display: none; }

.budget-inputs { display: flex; gap: 15px; }
.budget-inputs input { text-align: center; background: #f4f8fb; font-weight: bold; }

/* =========================================
   PAX WIDGET (Adulti/Copii)
   ========================================= */
.pax-widget {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid #dde6ef;
    border-radius: 8px;
    overflow: hidden;
}

.pax-btn {
    background: #f4f8fb;
    border: none;
    color: var(--cedra-blue);
    font-weight: 800;
    font-size: 1.2rem;
    width: 40px;
    height: 40px;
    cursor: pointer;
    transition: background 0.2s;
}

.pax-btn:hover {
    background: #e2e8f0;
    color: var(--cedra-red);
}

.pax-widget input {
    border: none;
    text-align: center;
    width: 100%;
    font-weight: bold;
    font-size: 1rem;
    color: #333;
    background: transparent;
    -moz-appearance: textfield;
}
.pax-widget input::-webkit-outer-spin-button,
.pax-widget input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Facilitati Checkboxes */
.facilities-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.toggle-facilities { font-size: 0.75rem; color: var(--cedra-blue); font-weight: 700; cursor: pointer; }
.facilities-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    max-height: 120px; overflow-y: auto; padding-right: 5px;
}
.checkbox-item {
    font-size: 0.8rem; color: #666; display: flex; align-items: center; gap: 6px; cursor: pointer;
}
.checkbox-item input[type="checkbox"] { accent-color: var(--cedra-blue); }

/* Buton Submit Formular */
.btn-search-submit {
    width: 100%; padding: 15px;
    background: var(--cedra-red); color: white;
    border: none; border-radius: 8px;
    font-weight: 800; font-size: 1rem;
    cursor: pointer; transition: all 0.3s ease;
    display: flex; justify-content: center; align-items: center; gap: 10px;
    margin-top: 10px;
}
.btn-search-submit:hover { background: #c0151a; transform: translateY(-2px); }

/* =========================================
   5. BUTON WHATSAPP (Desktop)
   ========================================= */
.whatsapp-float-btn {
    position: absolute;
    bottom: 10px; right: 20px;
    background: #25D366; 
    color: white !important;
    display: flex; align-items: center; justify-content: center; gap: 10px;
    padding: 12px 25px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700; font-size: 16px;
    box-shadow: 0 5px 15px rgba(37, 211, 102, 0.4);
    z-index: 20;
    transition: transform 0.3s ease;
}
.whatsapp-float-btn i { font-size: 24px; display: block; }
.whatsapp-float-btn:hover { 
    transform: scale(1.05) translateY(-5px); 
    box-shadow: 0 10px 20px rgba(37, 211, 102, 0.6);
}

/* =========================================
   6. OFERTE SECTION (Grid)
   ========================================= */
.section-padding { padding: 80px 0; }
.section-title { text-align: center; margin-bottom: 60px; }
.section-title h2 { font-size: 2.5rem; color: var(--cedra-blue); font-weight: 800; margin-bottom: 10px; }

.offers-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 40px;
}

.offer-card {
    background: var(--color-white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
}
.offer-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.15); }

.card-image { position: relative; height: 250px; }
.card-image img { width: 100%; height: 100%; object-fit: cover; }

.price-tag {
    position: absolute; bottom: 15px; right: 15px;
    background: var(--cedra-red); color: var(--color-white);
    padding: 8px 20px; border-radius: 30px; 
    font-weight: bold; font-size: 1.1rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.card-content { padding: 30px; }
.card-content h3 { color: var(--cedra-blue); margin-bottom: 15px; font-size: 1.4rem; }
.offer-desc { color: #666; margin-bottom: 25px; min-height: 60px; }

.btn-link { 
    color: var(--cedra-red); font-weight: bold; 
    text-transform: uppercase; font-size: 0.9rem; letter-spacing: 1px;
}
.btn-link:hover { text-decoration: underline; }

/* =========================================
   7. BUTON BACK TO TOP
   ========================================= */
#back-to-top {
    display: none; /* Controlat de JS */
    position: fixed; bottom: 30px; right: 30px; z-index: 9999;
    background-color: var(--cedra-red); color: white;
    border: none; cursor: pointer;
    align-items: center; justify-content: center;
    border-radius: 50%; width: 50px; height: 50px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
}
#back-to-top svg { width: 24px; height: 24px; stroke: #ffffff; }
#back-to-top:hover { background-color: var(--cedra-blue); transform: translateY(-5px); }

/* =========================================
   8. RESPONSIVE (Mobil & Tableta)
   ========================================= */
@media (max-width: 992px) {
    /* Meniu Hamburger */
    .hamburger-menu { display: block; }
    
    .main-nav {
        position: fixed;
        top: var(--header-height); 
        right: -100%; /* Ascuns initial */
        width: 100%; 
        height: auto; 
        background: rgba(0, 118, 189, 0.98); /* Albastru solid */
        border-bottom-left-radius: 25px;
        border-bottom-right-radius: 25px;
        flex-direction: column;
        justify-content: flex-start;
        transition: 0.4s ease;
        padding: 20px 0 35px 0;
        box-shadow: 0 15px 30px rgba(0,0,0,0.15); 
    }
    .main-nav.active { right: 0; }
    
    .nav-list { flex-direction: column; align-items: center; width: 100%; }
    .nav-list li a { 
        background-color: var(--color-white); 
        color: var(--cedra-blue); 
        width: 90%; text-align: center; 
    }
    
    /* Hero Section Ajustari */
    .hero-section-wrapper {
        height: auto;
        padding-top: 140px; /* Spatiu sa nu intre sub header */
        padding-bottom: 60px;
    }

    .hero-content-container {
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    /* Formular */
    .search-engine-box {
        max-width: 100%;
        margin-bottom: 20px;
    }

    /* Buton WhatsApp Mobil - Pozitionare Sub Formular */
    .whatsapp-float-btn {
        position: relative; /* Nu mai e fixed */
        bottom: auto; right: auto;
        width: 100%; max-width: 450px;
        margin-top: 10px;
        border-radius: 10px;
        justify-content: center;
    }
    .wa-text { display: inline-block; }
}

/* =========================================
   SECȚIUNE PROMPTER (Static & Clean)
   ========================================= */
.prompter-section {
    background-color: var(--cedra-blue);
    padding: 30px 0; /* Mai mult spatiu sus/jos */
    position: relative;
    z-index: 20;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.prompter-wrapper {
    width: 100%;
    /* Eliminam orice overflow sau scroll */
    overflow: visible; 
}

.prompter-track {
    display: flex;
    /* PERMITEM COBORAREA PE RANDUL URMATOR */
    flex-wrap: wrap; 
    justify-content: center; /* Centram totul */
    gap: 20px; /* Spatiu intre butoane */
    width: 100%;
    margin: 0 auto;
}

/* Stilul Butonului */
.prompter-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.1);
    padding: 10px 25px;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid rgba(255,255,255,0.2);
    
    /* Latime flexibila, nu fixa */
    min-width: 180px; 
    justify-content: center; /* Centram continutul in buton */
}

/* Cerculetul Iconitei */
.icon-circle {
    width: 35px;
    height: 35px;
    background-color: var(--color-white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    flex-shrink: 0; /* Sa nu se turteasca cercul */
}

.icon-circle i {
    color: var(--cedra-blue);
    font-size: 1rem;
}

/* Textul */
.prompter-btn .btn-text {
    color: var(--color-white);
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
}

/* --- EFECTE HOVER --- */
.prompter-btn:hover {
    background: var(--color-white);
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.prompter-btn:hover .icon-circle {
    background-color: var(--cedra-red);
}

.prompter-btn:hover .icon-circle i {
    color: var(--color-white);
}

.prompter-btn:hover .btn-text {
    color: var(--cedra-blue);
}

/* --- RESPONSIVE --- */
@media (max-width: 768px) {
    .prompter-track {
        gap: 10px; /* Spatiu mai mic pe mobil */
    }
    .prompter-btn {
        width: 100%; /* Pe mobil butoanele ocupa toata latimea */
        justify-content: flex-start; /* Aliniem la stanga pe mobil */
        padding-left: 20px;
    }
}

/* =========================================
   SECȚIUNE DESTINAȚII POPULARE (Grid Carduri)
   ========================================= */

.destinations-grid {
    display: grid;
    /* Grid responsive: minim 280px latime, maxim cat incape */
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px; /* Spatiu intre carduri */
    margin-top: 40px;
}

/* Stilul Cardului */
.dest-card {
    position: relative;
    height: 300px; /* Inaltime fixa pentru uniformitate */
    border-radius: 20px; /* Colturi rotunjite ca in poza */
    overflow: hidden; /* Ascunde imaginea cand face zoom */
    display: block;
    text-decoration: none;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    /* Fix pentru Safari ca sa taie colturile la zoom */
    transform: translateZ(0); 
}

/* Wrapper Imagine (pentru zoom) */
.dest-bg-wrapper {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 1;
}

.dest-bg-wrapper img {
    width: 100%; height: 100%;
    object-fit: cover; /* Umple cardul fara sa deformeze poza */
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* Zoom lin */
}

/* Overlay (Gradient pentru lizibilitate text) */
.dest-overlay {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.4) 100%);
    z-index: 2;
    transition: background 0.3s ease;
}

/* Continut (Titlu si Buton) */
.dest-content {
    position: relative; z-index: 3;
    height: 100%;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Titlu sus, Buton jos */
}

.dest-content h3 {
    color: var(--color-white);
    font-size: 1.8rem;
    font-weight: 800;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
    margin: 0;
}

/* Butonul Descopera */
.btn-discover {
    align-self: flex-end; /* Pozitionare Dreapta-Jos */
    background-color: var(--color-white);
    color: var(--color-text);
    padding: 10px 25px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* --- ANIMATII HOVER --- */

/* 1. Zoom Imagine */
.dest-card:hover .dest-bg-wrapper img {
    transform: scale(1.1); /* Mareste imaginea cu 10% */
}

/* 2. Butonul devine Albastru */
.dest-card:hover .btn-discover {
    background-color: var(--cedra-blue);
    color: var(--color-white);
    transform: translateY(-3px); /* Se ridica putin */
    box-shadow: 0 5px 15px rgba(0, 118, 189, 0.4);
}

/* 3. Overlay mai intunecat pentru contrast mai bun la hover */
.dest-card:hover .dest-overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.6) 100%);
}


/* =========================================
   SECȚIUNE RECOMANDĂRI (Slider)
   ========================================= */
.rec-section-header {
    background-color: var(--cedra-dark-blue);
    padding: 30px;
    border-radius: 15px;
    margin-bottom: 30px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* Suprascriem culorile titlului doar aici */
.rec-section-header .section-title {
    margin-bottom: 0;
}
.rec-section-header h2 {
    color: var(--color-white);
    margin-bottom: 5px;
}
.rec-section-header p {
    color: rgba(255, 255, 255, 0.9);
    margin: 0;
    font-size: 1.1rem;
}

/* 2. Container Slider Orizontal */
.rec-slider-container {
    width: 100%;
    overflow: hidden; /* Ascundem scrollbar-ul urat */
    padding: 10px 5px; /* Spatiu mic pt umbre */
}

.rec-track {
    display: flex;
    gap: 30px;
    overflow-x: auto;
    scroll-behavior: smooth;
    /* Ascundem scrollbar nativ */
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 10px;
}
.rec-track::-webkit-scrollbar { display: none; }

/* 3. Cardul (Static, Fara Hover Effect) */
.rec-card {
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    /* Latime fixa ca sa stea in slider */
    min-width: 300px; 
    max-width: 300px;
    
    display: flex;
    flex-direction: column;
    border: 1px solid #e0e0e0;
    /* Eliminam hover transform/shadow puternic */
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

/* Imaginea */
.rec-image {
    height: 180px;
    width: 100%;
    overflow: hidden;
}
.rec-image img {
    width: 100%; height: 100%; object-fit: cover;
}

/* Continut */
.rec-content {
    padding: 20px;
    flex-grow: 1;
}
.rec-content h3 {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--color-text);
    margin-bottom: 10px;
    line-height: 1.3;
    min-height: 45px; 
}
.rec-desc {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 15px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Mese */
.rec-meal-info {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.85rem; color: #555; font-weight: 600;
}
.rec-meal-info i { color: #999; }

/* Separator */
.rec-divider { height: 1px; background: #eee; margin: 0 20px; }

/* Footer Card */
.rec-footer {
    padding: 15px 20px;
    display: flex; justify-content: space-between; align-items: center;
}

.rec-transport {
    color: var(--cedra-red);
    font-size: 1.2rem;
    border: 1px solid #eee;
    width: 35px; height: 35px;
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
}

.rec-price-box { text-align: right; line-height: 1.1; }
.price-label { display: block; font-size: 0.7rem; color: #888; }
.price-val { display: block; font-size: 1.3rem; font-weight: 800; color: var(--color-text); }
.price-per { font-size: 0.7rem; color: #999; }

/* 4. Controale (Buton + Sageti) */
.rec-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 30px;
}

.slider-arrows {
    display: flex;
    gap: 15px;
}

.arrow-btn {
    width: 45px; height: 45px;
    border-radius: 50%;
    border: 1px solid #ddd;
    background: #fff;
    color: #555;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex; align-items: center; justify-content: center;
}
.arrow-btn:hover {
    background: var(--cedra-blue);
    color: #fff;
    border-color: var(--cedra-blue);
}

/* Buton Vezi Toate */
.btn-secondary-outline {
    display: inline-block;
    padding: 10px 25px;
    border: 1px solid #ddd;
    border-radius: 50px;
    color: #555;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
}
.btn-secondary-outline:hover {
    border-color: var(--cedra-blue);
    color: var(--cedra-blue);
}

/* =========================================
   BUTON HOVER "VEZI DETALII" (Recomandări)
   ========================================= */
.rec-hover-action {
    background-color: var(--cedra-red);
    overflow: hidden;
    max-height: 0; 
    transition: max-height 0.4s cubic-bezier(0.25, 1, 0.5, 1); /* Animatie lina */
}

/* Stilul Butonului Propriu-zis */
.btn-full-red {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 15px 0;
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 0.9rem;
    cursor: pointer;
    letter-spacing: 1px;
}


.rec-card:hover .rec-hover-action {
    max-height: 60px; /* Se deschide la marimea butonului */
}


.rec-card:hover .btn-full-red:hover {
    background-color: #c0151a; /* Un rosu putin mai inchis */
}


/* =========================================
   SOLUȚIE PENTRU MOBIL & TABLETĂ
   ========================================= */
@media (max-width: 992px) {
    /* Pe ecrane tactile, butonul este mereu deschis */
    .rec-hover-action {
        max-height: 60px !important;
    }
    
    /* Ajustam putin cardul sa arate bine cu butonul inclus */
    .rec-card {
        min-height: auto; /* Lasam inaltimea sa fie flexibila */
    }
}

/* =========================================
   SECȚIUNE RECENZII PROPRII (Marquee)
   ========================================= */

.custom-reviews-section {
    background-color: #f9f9f9;
    overflow: hidden; /* Ascundem ce iese din ecran */
    position: relative;
}

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

/* --- MARQUEE ANIMATION --- */
.marquee-wrapper {
    width: 100%;
    overflow: hidden;
    padding: 20px 0;
    /* Mască gradient stânga-dreapta pentru efect de fade */
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.marquee-track {
    display: flex;
    gap: 30px; /* Distanța dintre carduri */
    width: max-content; /* Lățimea este suma tuturor cardurilor */
    
    /* ANIMATIA */
    animation: scrollLeft 40s linear infinite;
}

/* Oprim animatia cand punem mouse-ul peste recenzii ca sa le putem citi */
.marquee-track:hover {
    animation-play-state: paused;
}

@keyframes scrollLeft {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* Se mută exact jumătate (un set complet) */
}

/* --- DESIGN CARD --- */
.custom-review-card {
    background: #fff;
    border-radius: 12px;
    padding: 25px;
    width: 350px; /* Lățime fixă pentru consistență */
    flex-shrink: 0; /* Nu lăsăm cardul să se micșoreze */
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Header: Nume + Stele */
.rev-header {
    margin-bottom: 15px;
}

.rev-name {
    display: block;
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--cedra-dark-blue);
    margin-bottom: 5px;
}

/* --- CULORI STELE (Cerinta Specifica) --- */
.rev-stars i { font-size: 1rem; margin-right: 2px; }

/* 1 Stea - Rosu Aprins */
.star-red i { color: #ff0000; }

/* 2 Stele - Portocaliu */
.star-orange i { color: #ffa500; }

/* 3 Stele - Galben */
.star-yellow i { color: #ffeb3b; }

/* 4 Stele - Verde Pal */
.star-pale-green i { color: #90ee90; }

/* 5 Stele - Verde Intens */
.star-intense-green i { color: #008000; }

/* 0 Stele - Gri */
.star-grey i { color: #ccc; }


/* Continut Mesaj */
.rev-content p {
    font-style: italic;
    color: #555;
    line-height: 1.6;
    font-size: 0.95rem;
    margin: 0;
}

/* --- BUTONUL DE JOS --- */
.reviews-cta {
    text-align: center;
    margin-top: 50px;
}

.btn-review-submit {
    display: inline-block;
    background-color: var(--cedra-blue);
    color: white;
    padding: 12px 40px;
    border-radius: 50px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 118, 189, 0.3);
}

.btn-review-submit:hover {
    background-color: var(--cedra-dark-blue);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 118, 189, 0.5);
    color: white;
}

/* Responsive */
@media (max-width: 768px) {
    .custom-review-card {
        width: 280px; /* Mai inguste pe mobil */
    }
    .marquee-track {
        animation: scrollLeft 30s linear infinite; /* Putin mai rapid pe mobil */
    }
}

/* =========================================
   FOOTER MODERN (3 Coloane)
   ========================================= */
.site-footer {
    background-color: var(--cedra-dark-blue); /* Sau #002B49 daca nu ai variabila */
    color: #fff;
    padding: 70px 0 30px 0;
    font-size: 0.95rem;
    position: relative;
    z-index: 10;
}

.footer-grid {
    display: grid;
    /* 3 Coloane egale pe desktop, 1 pe mobil */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 50px;
    align-items: start;
}

.footer-col h3 {
    color: #fff;
    font-size: 1.3rem;
    margin-bottom: 25px;
    position: relative;
    padding-bottom: 10px;
}

/* Linie decorativa sub titluri */
.footer-col h3::after {
    content: '';
    position: absolute; bottom: 0; left: 0;
    width: 50px; height: 3px;
    background-color: var(--cedra-red);
}

/* --- STÂNGA: Legal & Newsletter --- */
.footer-legal-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 30px;
}

.footer-legal-links a {
    color: #ccc;
    text-decoration: none;
    transition: 0.3s;
    font-size: 0.9rem;
}
.footer-legal-links a:hover { color: var(--cedra-red); padding-left: 5px; }

.footer-newsletter h4 { margin-bottom: 5px; color: #eee; }
.footer-newsletter p { font-size: 0.8rem; color: #aaa; margin-bottom: 10px; }

.newsletter-form { display: flex; }
.newsletter-form input {
    flex: 1; padding: 10px; border: none; border-radius: 4px 0 0 4px; outline: none;
}
.newsletter-form button {
    background: var(--cedra-red); color: white; border: none; padding: 0 20px;
    border-radius: 0 4px 4px 0; cursor: pointer; transition: 0.3s;
}
.newsletter-form button:hover { background: #b01015; }

/* --- CENTRU: Agentie --- */
.agency-details p { margin-bottom: 12px; color: #ddd; }
.agency-details i { color: var(--cedra-red); width: 20px; }
.validity { font-size: 0.85rem; color: #aaa !important; margin-left: 25px; }
.agency-name { font-size: 1.2rem; margin-bottom: 15px; }

.copyright {
    margin-top: 40px; border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 20px; font-size: 0.8rem; color: #777;
}

/* --- DREAPTA: Social & ANPC --- */
.social-magnetic-wrapper {
    display: flex; gap: 15px; margin-bottom: 30px;
}

/* Buton Magnetic */
.magnetic-btn {
    width: 50px; height: 50px;
    background: rgba(255,255,255,0.1);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: white; font-size: 1.2rem;
    text-decoration: none;
    transition: background 0.3s, color 0.3s; /* JS face miscarea */
}

.magnetic-btn:hover { background: #fff; }
.magnetic-btn.instagram:hover { color: #E1306C; }
.magnetic-btn.facebook:hover { color: #1877F2; }
.magnetic-btn.whatsapp:hover { color: #25D366; }

/* ANPC */
.anpc-wrapper { display: flex; gap: 10px; flex-wrap: wrap; }
.anpc-wrapper a {
    background: #fff; padding: 5px 10px; border-radius: 4px;
    width: 140px; display: flex; align-items: center; justify-content: center;
}
.anpc-wrapper img { width: 100%; height: auto; object-fit: contain; }

/* Responsive */
@media (max-width: 768px) {
    .footer-grid { text-align: center; }
    .footer-col h3::after { left: 50%; transform: translateX(-50%); }
    .footer-legal-links a:hover { padding-left: 0; }
    .newsletter-form, .social-magnetic-wrapper, .anpc-wrapper { justify-content: center; }
}


/* =========================================
   PAGINA DE CONTACT
   ========================================= */

/* 1. HERO SECTION */
.contact-hero {
    position: relative;
    /* Imagine fundal (poti schimba link-ul cu o imagine de birou/receptie) */
    background-image: url('https://cdn.pixabay.com/photo/2017/12/16/17/24/connection-3023068_1280.jpg');
    background-size: cover;
    background-position: center;
    height: 350px; /* Înălțime fixă */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
    margin-bottom: 0; /* Important pentru suprapunere */
}

.contact-hero-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 43, 73, 0.85); /* Cedra Dark Blue cu transparenta */
    z-index: 1;
}

.contact-hero-text {
    position: relative; z-index: 2;
}

.contact-hero-text h1 {
    font-size: 3rem; margin-bottom: 10px; font-weight: 800;
}

/* 2. CARDUL PLUTITOR (Wrapper) */
.contact-content-section {
    background-color: #f4f7f6; /* Fundal gri foarte deschis pentru pagina */
    padding-bottom: 80px;
    position: relative;
    z-index: 10;
}

.contact-card-wrapper {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.1); /* Umbra mare pentru efect 3D */
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    
    /* EFECTUL DE PLUTIRE: Tragem cardul peste Hero */
    margin-top: -80px; 
}

/* Coloana Stanga: Informatii */
.contact-info-col {
    flex: 1;
    min-width: 300px;
    background-color: var(--cedra-dark-blue); /* Sau alb, dar in poza pare inchis sau alb. Mergem pe alb cu accente */
    background: #fff;
    padding: 50px;
    border-right: 1px solid #eee;
}

.contact-info-col h3 {
    color: var(--cedra-dark-blue);
    font-size: 1.8rem; margin-bottom: 15px;
}
.contact-intro { color: #666; margin-bottom: 40px; }

/* Itemele de contact */
.info-item {
    display: flex; gap: 20px; margin-bottom: 30px;
}

.icon-box {
    width: 50px; height: 50px;
    background: rgba(0, 118, 189, 0.1); /* Albastru deschis transparent */
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--cedra-blue);
    font-size: 1.2rem;
    flex-shrink: 0;
}

.info-text h4 { font-size: 1.1rem; margin-bottom: 5px; color: #333; }
.info-text p { font-size: 0.95rem; color: #666; margin: 0; line-height: 1.6; }
.info-text a { color: #666; text-decoration: none; transition: 0.3s; }
.info-text a:hover { color: var(--cedra-blue); }

/* Social Icons */
.contact-social h4 { font-size: 1rem; margin-bottom: 15px; color: #333; }
.social-icons { display: flex; gap: 15px; }
.social-icons a {
    width: 40px; height: 40px; background: #eee; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #555; transition: 0.3s;
}
.social-icons a:hover { background: var(--cedra-blue); color: white; }


/* Coloana Dreapta: Formular */
.contact-form-col {
    flex: 1.5; /* Formularul e putin mai lat */
    min-width: 350px;
    padding: 50px;
    background: #fff;
}

.contact-form-col h3 { font-size: 1.8rem; margin-bottom: 30px; color: var(--cedra-dark-blue); }

.cedra-contact-form .form-row {
    display: flex; gap: 20px;
}
.cedra-contact-form .form-group {
    margin-bottom: 20px; width: 100%;
}

.cedra-contact-form label {
    display: block; font-weight: 600; color: #444; margin-bottom: 8px; font-size: 0.9rem;
}

.cedra-contact-form input,
.cedra-contact-form textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 0.95rem;
    background: #f9f9f9;
    transition: 0.3s;
}

.cedra-contact-form input:focus,
.cedra-contact-form textarea:focus {
    border-color: var(--cedra-blue);
    background: #fff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 118, 189, 0.1);
}

/* Butonul Formular */
.btn-submit-contact {
    background-color: var(--cedra-red);
    color: white;
    padding: 15px 30px;
    border: none;
    border-radius: 50px;
    font-weight: 700;
    cursor: pointer;
    width: 100%;
    transition: 0.3s;
    font-size: 1rem;
    margin-top: 10px;
}

.btn-submit-contact:hover {
    background-color: #c0151a;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(227, 30, 36, 0.3);
}

/* 3. MAP SECTION */
.contact-map-section iframe {
    display: block;
    filter: grayscale(20%); /* Optional: face harta putin mai sobra */
}

/* Responsive */
@media (max-width: 900px) {
    .cedra-contact-form .form-row { flex-direction: column; gap: 0; }
    .contact-card-wrapper { flex-direction: column; margin-top: -40px; }
    .contact-info-col { border-right: none; border-bottom: 1px solid #eee; }
    .contact-hero { height: 250px; }
    .contact-hero-text h1 { font-size: 2rem; }
}


/* =========================================
   ALERTE FORMULAR & GDPR
   ========================================= */

/* Mesaje de succes/eroare */
.form-alert {
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 25px;
    font-size: 0.95rem;
    font-weight: 600;
}

.alert-success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.alert-error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

/* Bifa GDPR */
.gdpr-group {
    margin-top: 10px;
    margin-bottom: 25px !important;
}

.gdpr-label {
    display: flex !important;
    align-items: flex-start;
    gap: 12px;
    font-weight: normal !important;
    font-size: 0.85rem !important;
    color: #555 !important;
    line-height: 1.5;
    cursor: pointer;
}

.gdpr-label input[type="checkbox"] {
    width: 18px; /* Dimensiune fixa pt checkbox */
    height: 18px;
    margin-top: 2px;
    cursor: pointer;
}

.gdpr-label a {
    color: var(--cedra-blue);
    text-decoration: underline;
    font-weight: 600;
}

.gdpr-label a:hover {
    color: var(--cedra-red);
}


/* =========================================
   PAGINA ASIGURĂRI
   ========================================= */

/* Hero Banner */
.insurance-hero {
    position: relative;
    /* Imagine sugestiva pt siguranta/calatorie */
    background-image: url('https://cdn.pixabay.com/photo/2016/11/29/05/45/astronomy-1867616_1280.jpg');
    background-size: cover;
    background-position: center;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.insurance-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 43, 73, 0.7); /* Albastru Cedra cu 70% opacitate */
    z-index: 1;
}

.insurance-hero-text { position: relative; z-index: 2; max-width: 800px; padding: 0 20px; }
.insurance-hero-text h1 { font-size: 3rem; margin-bottom: 15px; font-weight: 800; }
.insurance-hero-text p { font-size: 1.2rem; }

/* Caseta principala continut */
.insurance-content {
    background-color: #f9f9f9;
}

.insurance-box {
    background: #fff;
    border-radius: 20px;
    padding: 50px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    margin-top: -60px; /* Ridicam usor peste hero */
    position: relative;
    z-index: 10;
}

/* Beneficii Asigurare (3 coloane) */
.insurance-benefits {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin: 40px 0 50px 0;
    flex-wrap: wrap;
    border-bottom: 1px solid #eee;
    padding-bottom: 50px;
}

.benefit-item {
    text-align: center;
    max-width: 200px;
}

.ben-icon {
    width: 70px; height: 70px;
    background: rgba(0, 118, 189, 0.1);
    color: var(--cedra-blue);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem;
    margin: 0 auto 15px auto;
    transition: transform 0.3s;
}

.benefit-item:hover .ben-icon {
    transform: scale(1.1);
    background: var(--cedra-blue);
    color: white;
}

.benefit-item h4 { font-size: 1.1rem; color: var(--cedra-dark-blue); }

/* CTA Area (Butoane) */
.insurance-cta-area {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}

.insurance-cta-area h3 {
    font-size: 1.8rem;
    color: var(--cedra-red);
    margin-bottom: 15px;
}

.insurance-cta-area p {
    color: #555;
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.cta-buttons-wrapper {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

/* Buton WhatsApp */
.btn-wa-large {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: #25D366; /* Verde Oficial WhatsApp */
    color: white;
    padding: 15px 35px;
    border-radius: 50px;
    font-size: 1.1rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(37, 211, 102, 0.3);
}

.btn-wa-large:hover {
    background-color: #1ebe57;
    transform: translateY(-3px);
    color: white;
}

/* Buton Telefon */
.btn-phone-large {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: var(--cedra-blue);
    color: white;
    padding: 15px 35px;
    border-radius: 50px;
    font-size: 1.1rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0, 118, 189, 0.3);
}

.btn-phone-large:hover {
    background-color: var(--cedra-dark-blue);
    transform: translateY(-3px);
    color: white;
}

/* GDPR Disclaimer sub butoane */
.gdpr-disclaimer {
    background: #fdfdfd;
    border: 1px solid #eee;
    padding: 15px 20px;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #777;
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    text-align: left;
}

.gdpr-disclaimer i {
    color: var(--cedra-blue);
    font-size: 1.2rem;
    margin-top: 2px;
}

.gdpr-disclaimer a {
    color: var(--cedra-blue);
    text-decoration: underline;
    font-weight: 600;
}

.gdpr-disclaimer a:hover {
    color: var(--cedra-red);
}

/* Responsive */
@media (max-width: 768px) {
    .insurance-box { padding: 30px 20px; }
    .cta-buttons-wrapper { flex-direction: column; width: 100%; }
    .btn-wa-large, .btn-phone-large { justify-content: center; width: 100%; }
    .insurance-hero-text h1 { font-size: 2.2rem; }
}

/* =========================================
   PAGINA BILETE DE AVION
   ========================================= */

.flight-hero {
    position: relative;
    background-image: url('https://cdn.pixabay.com/photo/2018/07/20/14/01/airplane-3550756_1280.jpg');
    background-size: cover;
    background-position: center;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.flight-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 43, 73, 0.65); /* Albastru Cedra cu transparenta pt lizibilitate */
    z-index: 1;
}

.flight-hero-text { position: relative; z-index: 2; max-width: 800px; padding: 0 20px; }
.flight-hero-text h1 { font-size: 3rem; margin-bottom: 15px; font-weight: 800; }
.flight-hero-text p { font-size: 1.2rem; }

@media (max-width: 768px) {
    .flight-hero-text h1 { font-size: 2.2rem; }
}

/* =========================================
   PAGINA TRANSPORT AUTOCAR
   ========================================= */

/* Hero Banner Transport */
.transport-hero {
    position: relative;
    background-image: url('https://cdn.pixabay.com/photo/2016/04/07/19/27/bus-1314542_1280.jpg');
    background-size: cover;
    background-position: center;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.transport-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 43, 73, 0.7); /* Overlay intunecat pentru lizibilitate */
    z-index: 1;
}

.transport-hero-text { position: relative; z-index: 2; max-width: 800px; padding: 0 20px; }
.transport-hero-text h1 { font-size: 3rem; margin-bottom: 15px; font-weight: 800; }
.transport-hero-text p { font-size: 1.2rem; }

/* Grila de Dotari Autocar */
.bus-features-wrapper {
    margin-bottom: 50px;
    padding-bottom: 40px;
    border-bottom: 1px solid #eee;
}

.bus-features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.bus-feature {
    background: #fdfdfd;
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.bus-feature:hover {
    transform: translateY(-3px);
    border-color: var(--cedra-blue);
}

.bus-feature i {
    color: var(--cedra-red);
    font-size: 1.5rem;
    width: 30px;
    text-align: center;
}

.bus-feature span {
    font-weight: 600;
    color: #444;
    font-size: 0.95rem;
}

/* Text tarife negociabile */
.negotiable-text {
    background-color: rgba(0, 118, 189, 0.05);
    border-left: 4px solid var(--cedra-blue);
    padding: 15px 20px;
    border-radius: 4px;
    color: var(--cedra-dark-blue);
    font-weight: 600;
    font-size: 1.05rem;
    text-align: left;
    margin-bottom: 30px;
}

.negotiable-text i {
    margin-right: 8px;
    color: var(--cedra-blue);
}

/* Responsive */
@media (max-width: 768px) {
    .transport-hero-text h1 { font-size: 2.2rem; }
    .bus-features-grid { grid-template-columns: 1fr; }
}


/* =========================================
   PAGINA CIRCUITE
   ========================================= */

/* Hero Banner Circuite */
.circuite-hero {
    position: relative;
    /* Imagine sugestiva pentru circuite turistice (ex: Cappadocia) */
    background-image: url('https://cdn.pixabay.com/photo/2016/11/18/15/00/hot-air-balloons-1834988_1280.jpg');
    background-size: cover;
    background-position: center;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.circuite-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 43, 73, 0.65);
    z-index: 1;
}

.circuite-hero-text { position: relative; z-index: 2; max-width: 800px; padding: 0 20px; }
.circuite-hero-text h1 { font-size: 3rem; margin-bottom: 15px; font-weight: 800; }
.circuite-hero-text p { font-size: 1.2rem; }

/* Grila de Beneficii Circuite (Similar cu Transport, dar redenumit semantic) */
.tour-features-wrapper {
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #eee;
}

.tour-features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.tour-feature {
    background: #fdfdfd;
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.tour-feature:hover {
    transform: translateY(-3px);
    border-color: var(--cedra-blue);
}

.tour-feature i {
    color: var(--cedra-red);
    font-size: 1.5rem;
    width: 30px;
    text-align: center;
}

.tour-feature span {
    font-weight: 600;
    color: #444;
    font-size: 0.95rem;
}

/* Responsive */
@media (max-width: 768px) {
    .circuite-hero-text h1 { font-size: 2.2rem; }
    .tour-features-grid { grid-template-columns: 1fr; }
}


/* =========================================
   PAGINA EXCURSII ȘCOLARE
   ========================================= */

/* Hero Banner Excursii Scolare */
.excursii-hero {
    position: relative;
    background-image: url('https://images.pexels.com/photos/8612935/pexels-photo-8612935.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1'); /* Placeholder mai clar */
    background-size: cover;
    background-position: center;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.excursii-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 43, 73, 0.65);
    z-index: 1;
}

.excursii-hero-text { position: relative; z-index: 2; max-width: 800px; padding: 0 20px; }
.excursii-hero-text h1 { font-size: 3rem; margin-bottom: 15px; font-weight: 800; }
.excursii-hero-text p { font-size: 1.2rem; margin: 0; }

@media (max-width: 768px) {
    .excursii-hero-text h1 { font-size: 2.2rem; }
}

/* =========================================
   PAGINA DESPRE NOI
   ========================================= */

/* 1. Hero & Glass Card */
.about-hero {
    position: relative;
    min-height: 80vh; /* Ocupa mare parte din ecran pt a pune in valoare textul */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background-color: var(--cedra-dark-blue);
}

.about-hero-bg {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    /* Poti schimba acest link cu poza reala a biroului agentiei */
    background-image: url('https://images.pexels.com/photos/3184325/pexels-photo-3184325.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1');
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Efect subtil de parallax la scroll */
    filter: brightness(0.6); /* Intunecam poza pt a face cardul sa iasa in evidenta */
    z-index: 0;
}

.glass-card {
    position: relative;
    z-index: 2;
    background: rgba(255, 255, 255, 0.85); /* Alb translucid */
    backdrop-filter: blur(12px); /* Efectul modern de sticla sablata */
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    padding: 50px;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.quote-icon {
    font-size: 3rem;
    color: var(--cedra-red);
    opacity: 0.2;
    margin-bottom: 20px;
}

.manager-quote {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #333;
    font-style: italic;
    margin-bottom: 30px;
    text-align: justify;
}

.manager-signature {
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.manager-name {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--cedra-dark-blue);
}

.manager-title {
    font-size: 0.95rem;
    color: var(--cedra-red);
    font-weight: 600;
}

/* 2. Galerie Foto Moderna (Bento Grid) */
.about-gallery {
    background-color: #f9f9f9;
}

.modern-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-auto-rows: 250px; /* Inaltimea de baza a unei poze */
    gap: 20px;
    margin-top: 40px;
}

/* Magia CSS Grid - dimensiuni dinamice */
.gallery-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    cursor: pointer;
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

/* Suprapunerea la Hover pe poza */
.gallery-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 118, 189, 0.6); /* Albastru Cedra transparent */
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.gallery-overlay i {
    color: white;
    font-size: 2.5rem;
    transform: translateY(20px);
    transition: transform 0.3s ease;
}

.gallery-item:hover img { transform: scale(1.1); }
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-item:hover .gallery-overlay i { transform: translateY(0); }

/* Clase speciale pt dinamism vizual pe Desktop */
@media (min-width: 768px) {
    .item-large {
        grid-column: span 2;
        grid-row: span 2;
    }
    .item-wide {
        grid-column: span 2;
    }
    .item-tall {
        grid-row: span 2;
    }
}

/* Responsive pt telefoane (Totul devine o coloana simpla) */
@media (max-width: 767px) {
    .glass-card { padding: 30px 20px; }
    .manager-quote { text-align: left; font-size: 1rem; }
    .modern-gallery-grid { grid-auto-rows: 200px; }
}

/* =========================================
   SECȚIUNE STATISTICI (Despre Noi)
   ========================================= */

.about-stats-section {
    background-color: var(--cedra-blue); /* Fundal albastru brand */
    padding: 60px 0;
    color: white;
    border-top: 5px solid var(--cedra-red); /* O linie rosie subtila sus pentru contrast */
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    text-align: center;
}

.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    transition: transform 0.3s ease;
}

.stat-item:hover {
    transform: translateY(-10px); /* Efect usor de ridicare la hover */
}

.stat-item i {
    font-size: 2.5rem;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 15px;
}

.stat-number {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 10px;
    color: white;
    text-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.stat-label {
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.9);
}

/* Responsive pentru Statistici */
@media (max-width: 900px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 coloane pe tableta */
    }
}

@media (max-width: 500px) {
    .stats-grid {
        grid-template-columns: 1fr; /* 1 coloana pe telefon */
        gap: 20px;
    }
    .stat-number { font-size: 2.5rem; }
}

/* =========================================
   PAGINI EXCURSII (Categorii Specifice)
   ========================================= */

/* Bara de navigare sus */
.trip-nav-bar {
    background-color: var(--cedra-dark-blue);
    padding: 15px 0;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    margin-top: 100px;
}

.trip-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.trip-nav-btn {
    display: inline-block;
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
    padding: 10px 20px;
    border-radius: 50px;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 600;
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.trip-nav-btn i {
    margin-left: 5px;
    font-size: 0.8rem;
    transition: transform 0.3s;
}

.trip-nav-btn:hover {
    background-color: var(--cedra-red);
    border-color: var(--cedra-red);
    color: white;
}

.trip-nav-btn:hover i {
    transform: translateX(3px);
}

/* Grila Oferte (Stil Recommendations) */
.recommendations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.recom-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}

.recom-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}

.recom-img-wrapper {
    position: relative;
    height: 220px;
}

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

.recom-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: var(--cedra-red);
    color: white;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.recom-content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.recom-title {
    font-size: 1.25rem;
    color: var(--cedra-dark-blue);
    margin-bottom: 10px;
    font-weight: 700;
}

.recom-details {
    color: #666;
    font-size: 0.9rem;
    margin-bottom: 20px;
}

.recom-details i {
    color: var(--cedra-blue);
    margin-right: 5px;
}

.recom-footer {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #eee;
    padding-top: 15px;
}

.recom-price {
    display: flex;
    flex-direction: column;
}

.price-label {
    font-size: 0.8rem;
    color: #888;
}

.price-amount {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--cedra-blue);
}

.btn-book {
    background-color: var(--cedra-blue);
    color: white;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    font-size: 0.9rem;
    transition: background 0.3s ease;
}

.btn-book:hover {
    background-color: var(--cedra-dark-blue);
    color: white;
}

/* Stilizare Itinerariu Excursii */
.recom-itinerary {
    background-color: #f4f7f6;
    padding: 12px 15px;
    border-radius: 6px;
    border-left: 3px solid var(--cedra-blue);
    margin-bottom: 20px;
}

.recom-itinerary strong {
    display: block;
    font-size: 0.85rem;
    color: var(--cedra-dark-blue);
    margin-bottom: 5px;
}

.recom-itinerary strong i {
    color: var(--cedra-red);
    margin-right: 5px;
}

.recom-itinerary p {
    font-size: 0.85rem;
    color: #555;
    margin: 0;
    line-height: 1.5;
}

/* =========================================
   PAGINA TURISM INTERN (Categorii)
   ========================================= */

.internal-cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: -20px;
}

.int-cat-card {
    position: relative;
    height: 400px; /* Cartoane inalte, elegante */
    border-radius: 15px;
    overflow: hidden;
    display: block;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.int-cat-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.int-cat-overlay {
    position: absolute;
    bottom: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0, 43, 73, 0.9) 0%, rgba(0, 43, 73, 0.2) 50%, transparent 100%);
    transition: background 0.3s ease;
}

.int-cat-content {
    position: absolute;
    bottom: 30px;
    left: 30px;
    right: 30px;
    color: white;
}

.int-cat-content h3 {
    font-size: 2.2rem;
    font-weight: 800;
    margin-bottom: 10px;
    text-shadow: 0 2px 5px rgba(0,0,0,0.3);
    transition: transform 0.3s ease;
}

.cat-explore {
    display: inline-block;
    font-size: 1rem;
    font-weight: 600;
    color: var(--cedra-red);
    opacity: 0; /* Ascuns by default */
    transform: translateY(15px);
    transition: all 0.3s ease;
}

.cat-explore i {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

/* Interactiunea la Hover */
.int-cat-card:hover img {
    transform: scale(1.08); /* Poza se mareste incet */
}

.int-cat-card:hover .int-cat-overlay {
    background: linear-gradient(to top, rgba(0, 43, 73, 0.95) 0%, rgba(0, 43, 73, 0.4) 60%, transparent 100%);
}

.int-cat-card:hover .int-cat-content h3 {
    transform: translateY(-5px); /* Titlul se ridica putin */
}

.int-cat-card:hover .cat-explore {
    opacity: 1; /* Apare textul "Vezi ofertele" */
    transform: translateY(0);
}

.int-cat-card:hover .cat-explore i {
    transform: translateX(5px);
}

/* Responsive */
@media (max-width: 900px) {
    .internal-cat-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .internal-cat-grid { grid-template-columns: 1fr; }
    .int-cat-card { height: 300px; }
}

/* =========================================
   PAGINA TURISM EXTERN (Categorii Tari)
   ========================================= */

.external-cat-grid {
    display: grid;
    /* Se ajusteaza automat: face minim 220px latime, maxim cat incape */
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
    margin-top: -20px;
}

.ext-cat-card {
    position: relative;
    height: 250px; /* Mai scunde decat cele interne pt a arata bine ca galerie de 10 */
    border-radius: 12px;
    overflow: hidden;
    display: block;
    text-decoration: none;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
}

.ext-cat-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.ext-cat-overlay {
    position: absolute;
    bottom: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0, 43, 73, 0.95) 0%, rgba(0, 43, 73, 0.1) 60%, transparent 100%);
    transition: background 0.3s ease;
}

.ext-cat-content {
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
    color: white;
}

.ext-cat-content h3 {
    font-size: 1.6rem;
    font-weight: 800;
    margin-bottom: 5px;
    text-shadow: 0 2px 5px rgba(0,0,0,0.3);
    transition: transform 0.3s ease;
}

/* Re-folosim stilurile de animatie de la int-cat-card */
.ext-cat-card:hover img {
    transform: scale(1.1);
}

.ext-cat-card:hover .ext-cat-overlay {
    background: linear-gradient(to top, rgba(0, 43, 73, 0.95) 0%, rgba(0, 43, 73, 0.4) 70%, transparent 100%);
}

.ext-cat-card:hover .ext-cat-content h3 {
    transform: translateY(-5px);
}

.ext-cat-card:hover .cat-explore {
    opacity: 1;
    transform: translateY(0);
}

.ext-cat-card:hover .cat-explore i {
    transform: translateX(5px);
}

/* =========================================
   GRILĂ PENTRU PAGINILE DE OFERTE INTERNE/EXTERNE
   ========================================= */

.offers-page-grid {
    display: grid;
    /* Creeaza automat coloane in functie de ecran */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

/* Suprascriem latimea maxima doar cand cardul este in aceasta grila */
.offers-page-grid .rec-card {
    min-width: 100%;
    max-width: 100%;
}

/* =========================================
   HERO MODERN - PAGINI CATEGORII INTERNE
   ========================================= */
.modern-internal-hero {
    position: relative;
    width: 100%;
    min-height: 450px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 120px; 
    text-align: center;
    padding: 40px 20px;
}

.modern-internal-hero .hero-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(0, 43, 73, 0.8), rgba(0, 43, 73, 0.4));
    z-index: 1;
}

.modern-internal-hero .hero-content {
    position: relative;
    z-index: 2;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.modern-internal-hero .hero-title {
    font-size: 3.5rem;
    font-weight: 800;
    margin-bottom: 15px;
    text-shadow: 0 4px 10px rgba(0,0,0,0.3);
    color: #fff !important;
}

.modern-internal-hero .hero-subtitle {
    font-size: 1.25rem;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto 30px auto;
    color: rgba(255, 255, 255, 0.9) !important;
    line-height: 1.6;
}

/* Navigatia eleganta (Glassmorphism) */
.hero-nav-glass {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
    background: rgba(255, 255, 255, 0.15);
    padding: 12px 25px;
    border-radius: 50px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.nav-explorati {
    font-weight: 600;
    font-size: 0.95rem;
    color: #fff;
    margin-right: 5px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.pill-btn {
    background: var(--cedra-red);
    color: #fff;
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pill-btn i {
    font-size: 0.8rem;
    transition: transform 0.3s ease;
}

.pill-btn:hover {
    background: #fff;
    color: var(--cedra-red);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.pill-btn:hover i {
    transform: translateX(3px);
}

@media (max-width: 768px) {
    .modern-internal-hero .hero-title { font-size: 2.5rem; }
    .hero-nav-glass { flex-direction: column; border-radius: 20px; padding: 20px;}
}