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



:root {

    --cvr-primary: #38817a;

    --cvr-primary-dark: #2d6a64;

    --cvr-primary-darker: #1e4a46;

    --cvr-primary-light: #4a9e96;

    --cvr-primary-lightest: #e8f4f2;

    --cvr-accent: #e8b931;

    --cvr-accent-dark: #d4a520;

    --cvr-bg: #f8faf9;

    --cvr-text: #1a2e2b;

    --cvr-text-light: #4a6360;

    --cvr-footer: #1a2e2b;

}



html { scroll-behavior: smooth; }



body {

    font-family: 'Inter', sans-serif;

    color: var(--cvr-text);

    background-color: var(--cvr-bg);

}



h1, h2, h3, h4, h5, h6 {

    font-family: 'Montserrat', sans-serif;

}



.hero-gradient {

    background: linear-gradient(135deg, rgba(56,129,122,0.92) 0%, rgba(30,74,70,0.95) 100%);

}



.hero-home {

    background: linear-gradient(135deg, rgba(56,129,122,0.88) 0%, rgba(26,46,43,0.92) 60%),

                url('https://www.croceverderivoli.it/images/01automezziavigliana.jpeg') center/cover no-repeat;

    min-height: 85vh;

}



.counter-value {

    font-family: 'Montserrat', sans-serif;

    font-weight: 800;

}



.card-hover {

    transition: transform 0.3s ease, box-shadow 0.3s ease;

}

.card-hover:hover {

    transform: translateY(-6px);

    box-shadow: 0 20px 40px rgba(56,129,122,0.15);

}



.nav-link-custom {

    position: relative;

    transition: color 0.2s ease;

}

.nav-link-custom::after {

    content: '';

    position: absolute;

    bottom: -2px;

    left: 50%;

    width: 0;

    height: 2px;

    background: var(--cvr-accent);

    transition: width 0.3s ease, left 0.3s ease;

}

.nav-link-custom:hover::after,

.nav-link-custom.active::after {

    width: 100%;

    left: 0;

}



.btn-primary-cvr {

    background-color: var(--cvr-primary);

    color: #fff;

    transition: all 0.3s ease;

}

.btn-primary-cvr:hover {

    background-color: var(--cvr-primary-dark);

    transform: translateY(-1px);

    box-shadow: 0 4px 12px rgba(56,129,122,0.3);

}



.btn-accent-cvr {

    background-color: var(--cvr-accent);

    color: var(--cvr-text);

    transition: all 0.3s ease;

}

.btn-accent-cvr:hover {

    background-color: var(--cvr-accent-dark);

    transform: translateY(-1px);

    box-shadow: 0 4px 12px rgba(232,185,49,0.3);

}



.section-title::after {

    content: '';

    display: block;

    width: 60px;

    height: 3px;

    background: var(--cvr-accent);

    margin-top: 12px;

}

.section-title-center::after {

    margin-left: auto;

    margin-right: auto;

}



.fade-in {

    opacity: 0;

    transform: translateY(30px);

    transition: opacity 0.6s ease, transform 0.6s ease;

}

.fade-in.visible {

    opacity: 1;

    transform: translateY(0);

}



.slide-left {

    opacity: 0;

    transform: translateX(-40px);

    transition: opacity 0.6s ease, transform 0.6s ease;

}

.slide-left.visible {

    opacity: 1;

    transform: translateX(0);

}



.slide-right {

    opacity: 0;

    transform: translateX(40px);

    transition: opacity 0.6s ease, transform 0.6s ease;

}

.slide-right.visible {

    opacity: 1;

    transform: translateX(0);

}



@keyframes pulse-gentle {

    0%, 100% { transform: scale(1); }

    50% { transform: scale(1.05); }

}



.pulse-on-hover:hover {

    animation: pulse-gentle 0.6s ease-in-out;

}



.top-bar {

    background: var(--cvr-footer);

}



.sticky-nav {

    transition: box-shadow 0.3s ease, background-color 0.3s ease;

}

.sticky-nav.scrolled {

    box-shadow: 0 2px 20px rgba(0,0,0,0.1);

}



@keyframes slideDown {

    from { opacity: 0; transform: translateY(-10px); }

    to { opacity: 1; transform: translateY(0); }

}



.dropdown-animate {

    animation: slideDown 0.2s ease-out;

}



.gallery-img {

    transition: transform 0.4s ease;

    overflow: hidden;

}

.gallery-img:hover img {

    transform: scale(1.08);

}



.breadcrumb-sep::before {

    content: '/';

    margin: 0 0.5rem;

    color: rgba(255,255,255,0.5);

}



input:focus, textarea:focus, select:focus {

    outline: none;

    border-color: var(--cvr-primary) !important;

    box-shadow: 0 0 0 3px rgba(56,129,122,0.15) !important;

}