@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Nunito:wght@400;700&display=swap');

/* ===== VARIABILE GLOBALE ===== */
:root {
    --font1: 'Montserrat'; /* Font principal */
    --font2: 'Nunito';
    --font3: 'DM Sans';
    --font4: 'Playfair Display';
    --font5: 'Poppins';
}

/* Prevenirea scroll-ului lateral */
body {
    overflow-x: hidden; /* Dezactivează scroll-ul orizontal */
}

html {
    overflow-x: hidden; /* Dezactivează scroll-ul orizontal */
}


/* ===== BODY GENERAL ===== */
body.disablescroll {
    overflow-y: hidden; /* Ascunde scroll-ul vertical */
}

html {
    scroll-behavior: smooth; /* Face scroll-ul să fie fluid */
}

.container {
    width: 1200px; /* Lățimea maximă a containerului */
    margin: 0 auto; /* Centrează containerul pe mijloc */
}

/* ===== BUTONUL DE SCROLL ÎN SUS ===== */
a.topbutton {
    position: fixed; /* Fixat în partea de jos */
    right: 20px;
    bottom: 20px;
    width: 52px;
    height: 52px;
    text-align: center;
    color: var(--black); /* Culoarea textului */
    font-size: 36px;
    z-index: 19; /* Deasupra altor elemente */
    display: none; /* Inițial este ascuns */
}

a.topbutton.show {
    display: block; /* Devine vizibil */
}

/* ===== HEADER ===== */
header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px; /* Înălțimea header-ului */
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 40px; /* Margini laterale mai mici pentru mobil */
    font-family: var(--font1);
    background: linear-gradient(to right, #f1310b, #ea573d);
    border-bottom: 1px solid rgba(224, 90, 76, 0.7);
    z-index: 100; /* Asigură că stă deasupra altor elemente */
}

/* ===== LOGO ===== */
a.logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%; /* Aliniază vertical în header */
}

a.logo img {
    height: 60px; /* Dimensiunea logo-ului */
    width: auto; /* Menține proporțiile corecte */
}

a.showmenu,
a.hidemenu {
    display: none; /* Ascuns pe desktop */
}

a.showmenu {
    font-size: 24px;
    color: #fff; /* Alb pentru icon-ul meniului */
    cursor: pointer;
}

nav {
    display: flex; /* Elemente pe linie */
    align-items: center;
}

nav ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

nav ul li {
    margin-right: 30px; /* Spațiere între linkuri */
}

nav ul li:last-child {
    margin-right: 0; /* Elimină spațiul ultimului link */
}

nav ul li a {
    color: #fff; /* Culoare albă pentru textul meniului */
    font-size: 17px;
    text-decoration: none;
    transition: 0.3s ease-in-out; /* Efect de tranziție la hover */
    border-bottom: 1px solid transparent;
    line-height: normal;
}

nav ul li.active a,
nav ul li:hover a {
    border-bottom: 2px solid #fff; /* Linie albă sub text la hover sau activ */
}


/*Fundal portocaliu pagina acasa*/
.home {
    width: 100%;
    height: 100vh; /* Face ca secțiunea să ocupe tot ecranul */
    background: linear-gradient(to right, #f1310b, #ea573d); /* Gradient corect de la stânga la dreapta */
}

/* Bara verticală crem */
.vertical-bar {
    position: absolute;
    top: 0;
    left: 4cm; /* Bara este plasată la stânga */
    width: 40px; /* Lățimea barei */
    height: 100vh; /* Ocupă întreaga înălțime a paginii */
    background-color: #ffdab9; /* Culoarea crem/bej */
}

/* Norul de la baza paginii */
.bottom-cloud {
    position: absolute; /* Poziționează norul în partea de jos a containerului */
    bottom: 0; /* Aliniază norul la baza paginii */
    left: 0; /* Aliniază norul la stânga */
    width: 100%; /* Acoperă lățimea întregii pagini */
    z-index: 10; /* Asigură stratul vizual deasupra */
}

.bottom-cloud img {
    display: block; /* Elimină marginile implicite */
    width: 100%; /* Asigură că imaginea se întinde pe lățimea paginii */
    height: auto; /* Păstrează proporțiile imaginii */
    margin-top: 8px; /* Mută imaginea cu 10px mai jos */
}

/* Copil imagine pagina 1*/
.child-image {
    position: absolute; /* Poziționează imaginea în raport cu secțiunea */
    bottom: 0; /* Aliniază la baza secțiunii */
    right: 0; /* Aliniază la dreapta */
    width: 700px; /* Ajustează dimensiunea imaginii copilului */
    z-index: 9; /* Asigură că apare peste nor */
}

.child-image img {
    width: 100%; /* Ajustează imaginea la container */
    height: auto; /* Păstrează proporțiile imaginii */
    object-fit: contain; /* Evită deformările */
}



/*text pagina 1*/
.hero-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding-left: 210px; /* Mută textul mai la dreapta */
    padding-bottom: 100px; /* Ajustează spațiul de sus dacă este necesar */
    height: 100%;
    position: relative;
    z-index: 2;
    font-family: 'Montserrat', sans-serif; /* Setează fontul Montserrat */
}

.hero-content h1 {
    font-size: 38px; /* Ajustează dimensiunea titlului */
    font-weight: 700; /* Stilul Bold */
    color: #fff;
    margin-bottom: 10px; /* Spațiu între titlu și subtitlu */
    line-height: 1.2; /* Ajustează spațiul între rânduri */
    max-width: 600px; /* Limitează lățimea pentru a împărți textul pe 3 rânduri */
    word-wrap: break-word; /* Asigură împărțirea corectă pe rânduri */
}

.hero-content p {
    font-size: 16px; /* Ajustează dimensiunea subtitlului */
    font-weight: 400; /* Font mai subțire */
    color: #fff;
    margin-bottom: 20px;
    line-height: 1.5;
}


.hero-button {
    margin-top: 20px;
    padding: 24px 50px;
    background: #eb715a;
    color: #fff;
    border-radius: 20px;
    font-size: 16px; /* Dimensiunea textului din buton */
    text-decoration: none;
    transition: background 0.3s;
}

.hero-button:hover {
    background: #e94f1d; /* Culoare mai intensă la hover */
}


/* ===== DESPRE NOI ===== */
/* Sectiune About */
.about {
    padding: 60px 0;
    text-align: center;
}

.section-title {
    font-family: 'Nunito', sans-serif;
    font-weight: bold;
    font-size: 50px;
    color: #e14022;
    margin-bottom: 50px;
}

/* Carduri wrapper */
.cards-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 15px; /* Spatiu între carduri */
    flex-wrap: nowrap; /* Forțăm cardurile să fie pe un singur rând */
}

/* Cardurile - Centrare verticală și orizontală */
.card {
    width: 32%;
    min-height: 450px;
    padding: 20px;
    border-radius: 30px;
    color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    font-family: 'Montserrat', sans-serif;

    /* Adăugăm centrările */
    display: flex;
    flex-direction: column; /* Stivuieste conținutul pe verticală */
    justify-content: center; /* Centrează vertical */
    align-items: center; /* Centrează orizontal */
    text-align: center; /* Centrează textul */
}

/* Stil titluri card */
.card-title {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 15px;
    line-height: 30px;
}

/* Stil text card */
.card-text {
    font-size: 18px;
    line-height: 22px;
    margin: 0; /* Eliminăm marja implicită */
}

.card-text .extra-text {
    display: block;
    margin-top: 10px;
    font-size: 16px;
    line-height: 20px;
}


/* Wrapper pentru întreaga secțiune */
.about-text-image {
    display: flex;
    justify-content: space-between; /* Aliniază elementele în coloană */
    align-items: flex-start; /* Aliniere la început pentru text și imagine */
    margin-top: 50px;
    gap: 20px;
}

/* Coloana din stânga (Text principal) */
.about-text {
    width: 50%; /* Jumătate din lățimea secțiunii */
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    line-height: 30px;
    color: #613f30; /* Gri închis */
}

.about-text p {
    margin-bottom: 20px;
}

/* Coloana din dreapta */
.about-image-text {
    width: 45%; /* Aproape jumătate din lățime */
    display: flex;
    flex-direction: column; /* Aranjare pe verticală */
    align-items: center; /* Centrează textul portocaliu */
    text-align: center;
}

/* Text portocaliu */
.orange-text {
    color: #ea573d; /* Portocaliu */
    font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 20px; /* Spațiu între text și imagine */
}

/* Imagine */
.about-image {
    width: 100%; /* Imaginea ocupă întreaga lățime a div-ului */
    max-width: 700px; /* Maxim 700px */
}

.about-image img {
    width: 100%;
    height: auto; /* Păstrează proporțiile */
}

/* Chenar portocaliu mărit */
/* Chenar portocaliu */
.orange-banner {
    background-color: #ea573b;
    color: #fff;
    border-radius: 30px;
    padding: 30px;
    margin-top: 40px;
    text-align: center;
    max-width: 100%;
    font-family: 'Montserrat', sans-serif;
    font-size: 1em; /* Font mai mic */
    line-height: 1.6; /* Spațiere mai fină */
}

.orange-banner h3 {
    font-family: 'Nunito', sans-serif;
    font-size: 32px; /* Font mai mic decât înainte */
    font-weight: 600; /* Greutate mai redusă */
    margin-bottom: 12px;
}

.orange-banner p {
    font-size: 18px; /* Font mai mic */
    line-height: 28px; /* Spațiere mai aerisită */
    font-weight: 400; /* Greutate redusă pentru un look finuț */
    margin: 0 auto;
    max-width: 900px; /* Limitează lățimea textului */
}


/*====ACTIVITY====*/
/* Stil pentru secțiunea explore */
.explore {
    background-color: #fbfbfb; /* Fundal alb dar nu chiar alb */
    padding: 60px 0;
}

.section-title {
    text-align: center;
    color: #ea573b; /* Portocaliu */
    font-family: 'Nunito', sans-serif;
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 60px;
}

/* Wrapper pentru activități grupate două câte două */
.activities-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Stil pentru fiecare activitate */
.activity-item {
    flex: 0 1 calc(50% - 20px);
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Aliniere la început */
    align-items: center;
    text-align: center; /* Centrează textul */
    min-height: 550px; /* Înălțime uniformă pentru toate activitățile */
    box-sizing: border-box; /* Include padding-ul în dimensiuni */
    max-width: 500px; /* Lățimea maximă a fiecărei activități */
}

/* Wrapper pentru conținutul text + număr + titlu */
.activity-content {
    display: flex; /* Elemente pe linie */
    align-items: center; /* Centrează vertical cifra și titlul */
    justify-content: flex-start; /* Aliniere la stânga */
    gap: 10px; /* Spațiu între cifră și titlu */
    margin-bottom: 20px;
    width: 100%;
}

/* Numărul activității */
.activity-number {
    font-size: 60px; /* Dimensiune ajustată */
    font-weight: 700;
	font-family: 'Montserrat', sans-serif;
    color: #f5d8d8;
    line-height: 1;
    flex-shrink: 0;
}

/* Titlul activității */
.activity-title {
    font-family: 'Nunito', sans-serif;
    font-size: 24px; /* Dimensiune mai mică dacă este necesar */
    font-weight: 700;
    color: #613e30;
    margin: 0;
    text-align: left; /* Asigură alinierea la stânga */
    max-width: calc(100% - 60px); /* Asigură spațiu pentru număr */
}

/* Paragraful activității */
.activity-description {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    color: #613f30;
    margin-top: 0; /* Elimină spațiul de sus */
}

/* Stil pentru containerul imaginii */
.activity-image {
    position: relative; /* Permite suprapunerea norului */
    width: 100%;
    max-width: 500px; /* Asigură uniformitatea dimensiunilor imaginilor */
    height: 350px; /* Înălțime fixă pentru imagini */
    border-radius: 20px;
    overflow: hidden; /* Ascunde părțile norului care ies în afara imaginii */
	margin-bottom: 20px;
	margin-top: 20px; /* Adaugă spațiu deasupra imaginii */
}

/* Imagine principală */
.activity-image img {
    display: block;
    width: 100%;
    height: 100%; /* Ajustează imaginea să umple spațiul alocat */
    object-fit: cover; /* Evită deformările */
    border-radius: 20px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

/* Nor decorativ */
.cloud-overlay {
    position: absolute;
    bottom: 0; /* Aliniere exactă la baza imaginii */
    left: 50%;
    transform: translateX(-50%);
    width: 150%; /* Lățimea norului mărită cu 50% */
    height: auto;
    z-index: 2; /* Asigură că norul este deasupra imaginii */
}

.cloud-overlay img {
    display: block;
    width: 100%;
    height: auto;
    opacity: 1; /* Nor complet vizibil */
}


/* Nor decorativ */
.cloud-overlay {
    position: absolute;
    bottom: 0; /* Aliniere exactă la baza imaginii */
    left: 50%;
    transform: translateX(-50%);
    width: 150%; /* Lățimea norului mărită cu 50% */
    height: auto;
    z-index: 2; /* Asigură că norul este deasupra imaginii */
}

.cloud-overlay img {
    display: block;
    width: 100%;
    height: auto;
    opacity: 1; /* Nor complet vizibil */
}


/* ===== SECȚIUNEA "NEWS" ===== */
/* Secțiunea Noutăți Hubble */
.news {
    background: url('images/noutati-bg.png') no-repeat center center/cover; /* Imagine fundal */
    padding: 80px 0;
    position: relative;
}


.news-container {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
    color: #ffffff;
}

.news .section-title {
    font-family: 'Nunito', sans-serif;
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 50px;
	color: #ffffff;
}

.news-wrapper {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.news-item {
    background: rgba(255, 255, 255, 0.1);
    padding: 40px;
    border-radius: 20px;
    text-align: left;
    flex: 1 1 calc(33.33% - 20px);
    backdrop-filter: blur(10px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
	position: relative; /* Evită conflicte cu alte elemente */
    z-index: 1; /* Cardul are un z-index mai mic decât linkul */
}

.news-title {
    font-family: 'Nunito', sans-serif;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 15px;
}

.news-description {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.news-link {
    font-family: 'Montserrat', sans-serif;
    color: #ffffff;
    text-decoration: underline;
    font-size: 16px;
    font-weight: bold;
}

/* Umbrele Decorative */
.news::before {
    content: url('images/noutati-bg2.png');
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%) scale(1.5);
    z-index: 0;
    opacity: 0.3;
}

.news::after {
    content: url('images/noutati-bg2.png');
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%) scale(1.5);
    z-index: 0;
    opacity: 0.3;
}


/* ===== FOOTER ===== */
footer {
    font-family: var(--font1); /* Font principal */
    padding: 60px 0; /* Spațiu sus și jos */
    background: #f9f9f9; /* Fundal gri deschis */
    border-top: 1px solid #ddd; /* Linie de separare */
    margin-top: 90px; /* Spațiu deasupra footer-ului */
}

/* COPYRIGHT INFO */
footer .copyright {
    float: left; /* Text pe stânga */
    text-align: left;
    color: #000; /* Text negru */
    font-size: 16px; /* Dimensiunea textului */
    font-weight: normal;
}

footer .copyright a {
    color: deepskyblue; /* Link albastru deschis */
    border-bottom: 1px solid deepskyblue; /* Linie sub link */
    text-decoration: none; /* Elimină sublinierea */
}

/* SOCIAL MEDIA LINKS */
footer .social {
    float: right; /* Elemente pe dreapta */
    text-align: left;
    color: #000; /* Text negru */
    font-size: 16px; /* Dimensiunea textului */
    font-weight: normal;
}

footer .social a {
    float: left; /* Linkurile sunt pe linie */
    color: deepskyblue; /* Link albastru deschis */
    margin-right: 10px; /* Spațiu între linkuri */
    transition: 0.6s; /* Efect de tranziție */
}

footer .social a:hover {
    color: #000; /* Culoare neagră la hover */
}

footer .social a:last-of-type {
    margin-right: 0; /* Elimină spațiul ultimului link */
}


/* ===== SECȚIUNEA CONTACT ===== */
/* Secțiune Contact */
/* Secțiunea Contact */
.contact {
    padding: 60px 0;
    background-color: #ffffff;
}

/* Titlu Centrat */
.contact-title {
    text-align: center;
    font-family: 'Nunito', sans-serif;
    font-size: 48px;
    font-weight: bold;
    color: #e74c3c;
    margin-bottom: 20px;
}

/* Wrapper Contact */
.contact-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;
    gap: 40px;
}

/* Detalii Contact */
.contact-details {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #333;
    line-height: 1.6;
    margin-bottom: 20px;
}

.contact-details p {
    margin-bottom: 10px;
}

/* Social Media Links */
.contact-socials a {
    display: inline-block;
    margin: 10px;
}

.contact-socials img {
    width: 40px;
    height: 40px;
    transition: transform 0.3s ease;
}

.contact-socials img:hover {
    transform: scale(1.1);
}

/* Hartă Google Mai Mare */
.contact-map {
    width: 100%;
    max-width: 1000px;
    height: 450px;
    margin-top: 20px;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.contact-map iframe {
    width: 100%;
    height: 100%;
    display: block;
}


/* ===== SECȚIUNEA FAQ ===== */
/* Secțiunea Întrebări Frecvente */
.faq {
    background-color: #fbfbfb;
    padding: 60px 0;
}

.faq-title {
    text-align: center;
    font-family: 'Nunito', sans-serif;
    font-size: 48px;
    font-weight: bold;
    color: #e74c3c;
    margin-bottom: 40px;
}

.faq-item {
    border-top: 1px solid #ddd;
    padding: 20px 0;
    cursor: pointer;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: bold;
    color: #333;
}

.faq-toggle {
    font-size: 24px;
    color: #e74c3c;
}

.faq-answer {
    display: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    margin-top: 10px;
}

/* Stilizare pentru Footer */
.footer {
    background: linear-gradient(to left, #f1310b, #ea573d);
    color: #ffffff;
    text-align: center;
    padding: 20px 0;
}

.footer-container p {
    margin: 5px 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
}




/* ===== MEDIA QUERIES ===== */
/* 2. Ecran maxim 992px (pentru tablete) */
@media (max-width: 992px) {
    /* Header */
    header {
        position: fixed; /* Fixare în partea de sus */
        top: 0; /* Poziție de top */
        left: 0; /* Poziție de start */
        width: 100%; /* Lățime completă */
        height: 20px !important; /* Înălțime ajustată pentru header */
        padding: 0 10px; /* Spațiu lateral */
        background: linear-gradient(to right, #f1310b, #ea573d); /* Fundal gradient */
        display: flex;
        align-items: center; /* Elemente centrate vertical */
        justify-content: space-between; /* Logo și meniu separate */
        z-index: 1001; /* Deasupra altor elemente */
    }

    a.logo {
        position: relative; /* Poziționare standard */
        height: 100%; /* Înălțimea completă a headerului */
        display: flex;
        align-items: center; /* Centrare verticală */
    }

    a.logo img {
        max-height: 70px; /* Dimensiune logo ajustată */
        width: auto; /* Păstrează proporțiile */
    }

    a.showmenu {
		font-size: 24px; /* Dimensiune mai mare a iconiței */
		color: #ffffff; /* Culoare albă */
		display: block; /* Asigură afișarea */
		position: relative; /* Poziționare relativă */
		top: -10px; /* Mută liniile mai sus */
	}

	.section-title {
        font-size: 36px; /* Dimensiune mai mică pentru titluri */
        line-height: 1.3; /* Ajustează spațierea între linii */
        text-align: center; /* Centrează textul */
        margin-bottom: 40px; /* Spațiu mai mic față de secțiune */
    }

	.news .section-title {
        font-size: 36px; /* Dimensiune mai mică pentru titluri */
        line-height: 1.3; /* Ajustează spațierea între linii */
        text-align: center; /* Centrează textul */
	}

	/* Titlu Centrat */
	.contact-title {
		font-size: 36px; /* Dimensiune mai mică pentru titluri */
		line-height: 1.3; /* Ajustează spațierea între linii */
		text-align: center; /* Centrează textul */
	}

	.faq-title{
		font-size: 36px; /* Dimensiune mai mică pentru titluri */
		line-height: 1.3; /* Ajustează spațierea între linii */
		text-align: center; /* Centrează textul */
	}
	

    nav ul {
        flex-direction: column; /* Meniul pe o singură coloană */
        gap: 10px; /* Spațiere între linkuri */
    }

    .hero-content {
        padding: 20px; /* Reduci padding-ul general */
        text-align: center; /* Centrezi textul */
        align-items: center; /* Centrezi elementele */
    }

    .child-image {
        width: 60%; /* Reduci dimensiunea imaginii */
    }

	.cards-wrapper {
        flex-wrap: wrap;
    }
    .card {
        width: 100%;
        margin-bottom: 20px;
    }

	.about-text-image {
        flex-direction: column; /* Elemente pe verticală */
        align-items: center; /* Centrează toate elementele */
    }

    .about-text {
        width: 90%; /* Ajustează lățimea textului */
        font-size: 16px; /* Dimensiune text mai mică */
        line-height: 1.5; /* Ajustează spațiul între linii */
    }

    .about-image {
        width: 80%; /* Imaginea ocupă o proporție mai mare */
        margin-top: 20px; /* Spațiu între text și imagine */
    }

    .about-image img {
        width: 100%; /* Lățime completă a imaginii */
        max-width: 600px; /* Lățime maximă a imaginii */
        height: auto; /* Menține proporțiile imaginii */
    }

    .orange-text {
        font-size: 16px; /* Ajustează dimensiunea textului portocaliu */
        line-height: 1.5; /* Spațiere între rânduri */
        text-align: center; /* Centrează textul */
        margin-bottom: 10px; /* Distanță față de imagine */
    }

	.orange-banner h3 {
		font-family: 'Nunito', sans-serif;
		font-size: 24px; /* Font mai mic decât înainte */
		font-weight: 600; /* Greutate mai redusă */
		margin-bottom: 12px;
	}


    /* Activități */
    .activities-wrapper {
        flex-direction: column; /* Cardurile activităților pe o singură coloană */
    }

    .activity-item {
        width: 100%; /* Lățime completă */
    }

    /* Secțiunea Noutăți */
    .news-wrapper {
        flex-direction: column; /* Cardurile pe o coloană */
    }

    .news-item {
        width: 100%; /* Ocupă întreaga lățime */
    }
}


/* 4. Ecran maxim 576px (pentru telefoane mici) */
@media (max-width: 576px) {
    /* Header */
    header {
        position: fixed; /* Fixare în partea de sus */
        top: 0; /* Poziție de top */
        left: 0; /* Poziție de start */
        width: 100%; /* Lățime completă */
        height: 20px !important; /* Înălțime ajustată pentru header */
        padding: 0 10px; /* Spațiu lateral */
        background: linear-gradient(to right, #f1310b, #ea573d); /* Fundal gradient */
        display: flex;
        align-items: center; /* Elemente centrate vertical */
        justify-content: space-between; /* Logo și meniu separate */
        z-index: 1000; /* Deasupra altor elemente */
    }

    a.logo {
        position: relative; /* Poziționare standard */
        height: 100%; /* Înălțimea completă a headerului */
        display: flex;
        align-items: center; /* Centrare verticală */
		top: -30px;
    }

    a.logo img {
        max-height: 70px; /* Dimensiune logo ajustată */
        width: auto; /* Păstrează proporțiile */
    }

    a.showmenu {
		font-size: 24px; /* Dimensiune mai mare a iconiței */
		color: #fff !important; /* Culoare albă */
		display: block; /* Asigură afișarea */
		position: relative; /* Poziționare relativă */
		top: -20px !important; /* Mută liniile mai sus */
	}
	

    nav ul li a {
        font-size: 14px; /* Text mai mic */
    }

    /* Hero Section */
    .hero-content {
        padding: 10px; /* Mai puțin padding */
    }

    .hero-content h1 {
        font-size: 24px;
    }

    .hero-content p {
        font-size: 16px;
    }

    .child-image {
        width: 80%; /* Imagine și mai mică */
    }

    /* Carduri */
    .card {
        width: 100%; /* Cardurile pe o singură coloană */
        min-height: auto; /* Elimină înălțimea minimă */
    }

	.about-text-image {
        flex-direction: column; /* Elemente pe verticală */
        align-items: center; /* Centrează toate elementele */
        gap: 20px; /* Spațiu între secțiuni */
    }

    .about-text {
        width: 90%; /* Ajustează lățimea textului */
        font-size: 16px; /* Dimensiune text mai mică */
        line-height: 1.5; /* Ajustează spațiul între linii */
        text-align: center; /* Text centrat pe mobil */
    }

    .about-image-text {
        width: 90%; /* Lățimea generală a textului portocaliu */
        text-align: center; /* Centrează conținutul */
        margin-bottom: 20px; /* Spațiu între text și imagine */
    }

    .orange-text {
        font-size: 16px !important;  /* Dimensiune text consistentă */
        line-height: 1.5 !important; /* Spațiere între rânduri */
        color: #ea573d; /* Păstrează portocaliul */
        margin-bottom: 10px; /* Spațiu între text și imagine */
        text-align: center; /* Aliniere la stânga */
    }

    .about-image {
        width: 80%; /* Ajustează lățimea imaginii */
        max-width: 400px; /* Maxim 400px pe telefon */
        margin-top: 20px; /* Spațiu între text și imagine */
    }

    .about-image img {
        width: 100%; /* Imaginea ocupă toată lățimea div-ului */
        height: auto; /* Păstrează proporțiile imaginii */
    }

    /* Footer */
    .footer {
        padding: 10px;
    }
}
