/* =====================================================
FILE: specialitati.css (CLEAN - COMPONENT BASED)
===================================================== */


/* =====================================================
HERO
===================================================== */

.specialitati-page .page-hero{
    background:linear-gradient(135deg,var(--primary-dark),var(--primary));
    color:#fff;

    padding:60px 0;
    text-align:center;
}

.specialitati-page .page-hero h1{
    font-size:36px;
    margin-bottom:10px;
}

.specialitati-page .section-subtitle{
    font-size:16px;
    opacity:.9;
}


/* =====================================================
FILTER
===================================================== */

.specialitati-page .specialitati-filter{
    display:flex;
    justify-content:center;
    gap:10px;
    margin:30px 0;
    flex-wrap:wrap;
}

.specialitati-page .filter-btn{
    padding:8px 16px;
    border-radius:999px;
    border:none;
    background:#f1f5f9;
    cursor:pointer;
    transition:.2s;
}

.specialitati-page .filter-btn:hover{
    background:var(--primary);
    color:#fff;
}

.specialitati-page .filter-btn.active{
    background:var(--primary);
    color:#fff;
    font-weight:600;
}


/* =====================================================
GRID FIX (IMPORTANT)
===================================================== */

.specialitati-page .grid-cards{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
    gap:30px;
}


/* =====================================================
CARD OVERRIDE (MINIM)
===================================================== */

.specialitati-page .card img{
    width:100%;
    height:160px;
    object-fit:cover;
    border-radius:12px;
    margin-bottom:12px;
}


/* =====================================================
SPACING
===================================================== */

.specialitati-page main{
    padding-bottom:80px;
}


/* =====================================================
RESPONSIVE
===================================================== */

@media (max-width:768px){

    .specialitati-page .page-hero h1{
        font-size:28px;
    }

}

/* =========================================================
FIX LAYOUT SPECIALITATI
Limitează lățimea paginii (nu mai e full width)
========================================================= */

.specialitati-page .container{
    max-width:1200px; /* 🔧 poți ajusta: 1300 / 1400 */
    margin:0 auto;
    padding:0 20px;
}


/* =========================================================
GRID CONTROL (siguranță + aspect uniform)
========================================================= */

.specialitati-page .specialitati-grid{
    max-width:100%;
}


/* =========================================================
HERO FIX (centrare corectă)
========================================================= */

.specialitati-page .hero{
    text-align:center;
}

.specialitati-page .hero .container{
    max-width:1200px;
}

/* =========================================================
FIX CONTRAST HERO SPECIALITATI (CORECT)
========================================================= */

.specialitati-page .page-hero h1{
    color:#ffffff;
    text-shadow:0 2px 6px rgba(0,0,0,0.25);
}

.specialitati-page .page-hero p,
.specialitati-page .page-hero .section-subtitle{
    color:rgba(255,255,255,0.92);
    text-shadow:0 2px 6px rgba(0,0,0,0.2);
}

/* =========================================================
BREADCRUMB MODERN
========================================================= */

.breadcrumb-custom{
    background:#f1f5f9;
    padding:6px 14px;
    border-radius:999px;
    width:fit-content;
    margin:0 auto 15px;
}

/* link */
.breadcrumb-custom a{
    color:#64748b;
    text-decoration:none;
    font-weight:500;
    transition:0.2s;
}

.breadcrumb-custom a:hover{
    color:var(--primary);
}

/* separator */
.breadcrumb-custom span{
    color:#cbd5e1;
}

/* active */
.breadcrumb-custom .active{
    color:#1e293b;
    font-weight:600;
}

/* =========================================================
FILTRU SPECIALITATI (FIX UI 🔥)
========================================================= */

.specialitati-filter{
    display:flex;
    justify-content:center;
    gap:12px;

    margin:25px 0 35px;
}

/* BUTON */
.filter-btn{
    border:none;
    background:#eef2f7;

    color:#334155;
    font-weight:500;

    padding:8px 16px;
    border-radius:999px;

    cursor:pointer;
    transition:all 0.2s ease;
}

/* HOVER */
.filter-btn:hover{
    background:#dbeafe;
    color:var(--primary);
}

/* ACTIV 🔥 */
.filter-btn.active{
    background:var(--primary);
    color:#fff;

    box-shadow:0 4px 12px rgba(59,130,246,0.25);
}

/* ANIMATIE FILTRU 🔥 */
.card{
    transition: all 0.2s ease;
}