/*!
Theme Name: Yoakum EDC
Author: Eisenberg Inc.
Version: 1.0.0
*/


.incentives-filter {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--light-blue); /* Background behind the buttons */
    
    gap: 20px; /* Space between buttons */
    margin-bottom: 50px;
    border-radius: 5px;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

.filter-button {
    background-color: transparent;
    color: black;
    border: 1px solid var(--light-blue);
    padding: 10px 15px;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
    border-radius: 5px;
}

.filter-button.is-checked,
.filter-button:hover {
    background-color: black;
    color: white;
    border-color: black;
}


.incentives-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10%;
}

.incentive-item {
    background-color: #fff;
    padding: 20px;
    box-sizing: border-box;
    width: calc(50% - 20px); /* Two items per row with gap */
    margin-bottom: 3%;
}

.incentive-item:nth-child(odd) {
    
    padding-right: 5%; /* Add space to the right of odd items */
}

.incentive-item:nth-child(even) {
    
    padding-left: 5%; /* Add space to the right of odd items */
}

.incentive-item h3,
.incentive-item h2 {
    margin: 0 0 10px;
    color: var(--accent-lb);
}

.incentive-item.state h3,
.incentive-item.state h2 {
    color: var(--orange);
}



.incentive-item h3 {
	text-transform: uppercase;
	font-size: 1.063rem;
	line-height: 1;
}

.incentive-item h2 {
	font-size: 2rem;
	line-height: 1.1;
}

.incentive-item .learn-more-button {
    display: inline-block;
    margin-top: 20px;
    padding: 12.5px 35.5px;
    background-color: var(--accent-lb);
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    transition: all 0.3s;
}

.incentive-item.state .learn-more-button {
	background-color: var(--orange);
}

.incentive-item .learn-more-button:visited {
	color: #fff;
}

.incentive-item .learn-more-button:hover {
    background-color: var(--orange);
}

.incentive-item.state .learn-more-button:hover {
	background-color: var(--accent-lb);
}


@media (max-width: 992px) {
    .incentives-grid {
        flex-direction: column; /* Stack items vertically */
    }

    .incentive-item {
        width: 100%; /* Full width for single column layout */
        margin-right: 0; /* Remove right margin */
    }


    .incentive-item:nth-child(odd) {
    
	    padding-right: 0; /* Add space to the right of odd items */
	}

	.incentive-item:nth-child(even) {
	    
	    padding-left: 0; /* Add space to the right of odd items */
	}

}