html {
    scroll-behavior: smooth;
}
.main-menu .navigation li a.active {
    color: #f4b400;
}

.main-menu .navigation li a.active:after {
    width: 100%;
}


/* Hero H1 Size */
.hero-section-two .hero-content h1 {
    font-size: 88px;
    line-height: 1.1;
    margin-bottom: 20px;
}

/* --- CARE 22 SERVICE CARD FIXES --- */

/* 1. The Vertical Gold Bar Container */
.service-two-item .heading {
    -webkit-box-pack: start !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important; 
    padding-top: 15px !important;    /* Gap above the icon */
    padding-bottom: 20px !important; /* Gap at the very bottom of the bar */
}

/* 2. The Icon (Logo) */
.service-two-item .heading i {
    margin-top: 0 !important;
    margin-bottom: 0 !important;    /* Reset this to prevent double spacing */
}

/* 3. The Service Name (Vertical) */
.service-two-item .heading h3 {
    /* THIS IS THE GAP BETWEEN LOGO AND TEXT */
    padding-top: 15px !important;   
    
    margin-top: 0 !important;
    line-height: 1.1 !important;
    font-size: 21px !important;      
}

/* 4. Hover Content Fixes */
.service-two-item .hover-content {
    padding: 30px 15px !important;   
}

/* 8 choices */
.service-menu-list {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    max-width: 600px; /* Keeps the list centered and readable */
    text-align: center;
}
.service-menu-list li {
    font-size: 24px; /* Makes it nice and big */
    font-weight: 700; /* Bold for impact */
    color: #000000; /* Keeps it sharp and black */
    padding: 10px 0;
    transition: all 0.3s ease;
}

/* Optional: Subtle hover effect if you want it to feel interactive */
.service-menu-list li:hover {
    color: #cc9900; /* Or whatever your theme-yellow color is */
    transform: scale(1.05);
}
.menu-list-wrap {
    position: relative;
    z-index: 99; /* This pushes the menu to the front layer */
}

.service-menu-list li {
    position: relative; 
    z-index: 100;
    cursor: pointer; /* This will help you see exactly when the hover "activates" */
}

/* Price Settings */
.price-item-two {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Plan Names (The 4, The 6, The 8) */
.price-item-two h3 {
    color: #d6a354 !important; /* Your specific Gold */
    font-size: 40px; /* Bigger size */
    font-weight: 800;
    margin-top: 20px;
    text-transform: uppercase;
}

/* Price Tag */
.price-item-two .price {
    color: #d6a354 !important; /* Your specific Gold */
    font-size: 32px; /* Even bigger for the price */
    font-weight: 700;
    display: block;
    margin-bottom: 15px;
}

/* All other text in the box (Paragraphs/Descriptions) */
.price-item-two p {
    color: #000000;
    font-size: 18px;
    line-height: 1.6;
}

/* Icons Adjustment */
.price-item-two .image {
    margin-bottom: 10px;
}

.price-item-two .image i {
    color: #000000 !important; /* Ensuring icons stay black */
}

/* Button override to keep it consistent */
.price-item-two .theme-btn {
    margin-top: 25px;
}

/* Footer */
.main-footer .footer-widget {
    max-width: none;
}