/* =========================================
   1. VARIABILI GLOBALI
   ========================================= */
:root {
    --primary-color: #800000;     /* Bordeaux base */
    --primary-hover: #5C0120;     /* Bordeaux scuro per hover */
    --font-main: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* =========================================
   2. IMPOSTAZIONI BASE
   ========================================= */
body {
    font-family: var(--font-main);
}

/* =========================================
   3. COLORI BRAND E BOTTONI
   ========================================= */
/* Testi e sfondi */
.text-primary { color: var(--primary-color) !important; }
.bg-primary { background-color: var(--primary-color) !important; }

/* Bottoni pieni */
.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
}

/* Bottoni outline */
.btn-outline-primary {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
    background-color: var(--primary-color) !important;
    color: white !important;
}

/* =========================================
   4. COMPONENTI GLOBALI (Navbar, ecc.)
   ========================================= */
/* Sfondo bianco per il logo nella navbar */
.logo-sfondo-bianco {
    background-color: #ffffff;
    padding: 0px 4px; 
    border-radius: 50px; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.3); 
}

/* =========================================
   5. SEZIONI SPECIFICHE DELLA PAGINA
   ========================================= */

/* --- Hero Section --- */
#home {
    background: linear-gradient(rgba(10, 25, 47, 0.7), rgba(10, 25, 47, 0.8)), 
                url('https://images.unsplash.com/photo-1541888086425-d81bb19240f5?q=80&w=2000&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: white;
}
#home h1 {
    color: #ffffff !important;
    letter-spacing: -1px; 
}
#home .lead {
    color: #d1d5db !important; 
}

/* --- Servizi --- */
.service-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.service-card:hover {
    transform: translateY(-10px); 
    box-shadow: 0 15px 30px rgba(0,0,0,0.1) !important; 
}

/* --- Progetti (Animazioni e Carosello) --- */
.project-img { 
    transition: transform 0.3s ease; 
    cursor: pointer; 
}
.project-img:hover { 
    transform: scale(1.03); 
}

.carousel-item img {
    height: 500px;        
    object-fit: cover;    
    object-position: center; 
}

/* Frecce Carosello */
.carousel-control-prev,
.carousel-control-next {
    width: 48px;
    height: 48px;
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    opacity: 1;
}
.carousel-control-prev { left: 12px; }
.carousel-control-next { right: 12px; }

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 20px;
    height: 20px;
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
    background-color: rgba(0, 0, 0, 0.85);
    transition: background-color 0.2s ease;
}

/* =========================================
   6. RESPONSIVE (Media Queries)
   ========================================= */
@media (max-width: 768px) {
    .carousel-item img {
        height: 280px;
    }
}