﻿.heading-title-container h2.grid-category-title{
    margin: 0;
    padding: 0;
    color: #1d1e1e;
}

/* Background Image Grid */

.zoom-container {
	overflow: hidden;
}
.zoom {
	float: inherit;
	background: none;
	transition: transform .5s;
}
.zoom:hover {
	z-index: 100;
	-ms-transform: scale(1.10);
	-webkit-transform: scale(1.10);
	transform: scale(1.10);
}
.grid-blocks{
    margin-bottom: 20px;
}
.grid-blocks a.whole-card-link {
    transition: 0.6s all;
    transition: background 0.6s ease-in-out; /* Consistent background transition */
    -webkit-transition: opacity .6s ease-in-out;
    -o-transition: opacity .6s ease-in-out;
    transition: opacity .6s ease-in-out;
}
.grid-blocks a.whole-card-link .grid-card {
    position: relative;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    transition: 0.6s all;
	margin-bottom: 6px;
    transition: background 0.6s ease-in-out; /* Consistent background transition */   
    height: 325px; /* Adjust height as needed */
    color: white; /* Ensure text is visible */
    overflow: hidden; 
}
.grid-blocks a.whole-card-link .grid-card:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,1+100 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    transition: 0.6s all;
    transition: background 0.6s ease-in-out; /* Slower transition for background */    
    z-index: 1;
    -webkit-transition: opacity .6s ease-in-out;
    -o-transition: opacity .6s ease-in-out;
    transition: opacity .6s ease-in-out;
    opacity: 1; /* Initially visible */
}
.grid-blocks a.whole-card-link .grid-card:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(255, 54, 0, 0) 0%, rgba(226, 68, 7, 1) 100%);
    transition: 0.6s all;
    transition: background 0.6s ease-in-out; /* Slower transition for background */     
    z-index: 1;
    -webkit-transition: opacity .6s ease-in-out;
    -o-transition: opacity .6s ease-in-out;
    transition: opacity .6s ease-in-out;
    opacity: 0; /* Initially hidden */
}
.grid-blocks a.whole-card-link:hover .grid-card:before {
    opacity: 0;
}
.grid-blocks a.whole-card-link:hover .grid-card:after {
    opacity: 1;
}
.grid-blocks a.whole-card-link .grid-overlay {
    width: 100%;
    position: relative;
	display: inline-block;
    bottom: 3%;
    right: 0;
    left: 0;
    margin: 0 auto;
	background:transparent;
    color: #fff;
    padding: 12px 5px;
    z-index: 2;
	text-align: center;
}
.grid-blocks a.whole-card-link .grid-card-title {
    font-family: "Inter", sans-serif;
    margin: 0;
    font-size: 1.5rem;
    font-weight: bold;
    white-space: pre-line; /* Enables precise control of word breaks */    
}
.grid-blocks a.whole-card-link .grid-card-description {
    margin: 5px 0;
    font-size: 0.938rem;
    color:#585858;
}
.grid-blocks a.whole-card-link .grid-card-description p{
    font-size: 0.938rem;
    color:#585858;
}
.grid-blocks a.whole-card-link span.grid-button {
	display:inline-block;
	padding:12px 25px;
	background:#ff3600;
	text-align:center;
	font-size:15px;
	color:#fff;
    margin-bottom: 6px;
    transition: 0.6s all;
}
.grid-blocks a.whole-card-link:hover span.grid-button {
	background:#bc2d07;
}

/* Basic Block Grid */

.basic-grid-card{
    background-color: #fff;
    padding: 10px;
    border: solid 1px #c9c9c9;
}
.basic-grid-card .basic-grid-photo{
    overflow: hidden;
    margin-bottom: 5px;
}
.basic-grid-card .grid-card-title {
    font-family: "Inter", sans-serif;
    margin: 0;
    padding: 8px 0 8px 0;
    font-size: 20px;
    font-weight: bold;
    white-space: pre-line; /* Enables precise control of word breaks */    
}
.basic-grid-card .grid-card-description {
    margin: 5px 0 12px 0;
    font-size: 0.938rem;
    color:#585858;
}
.basic-grid-card .grid-card-description p{
    font-size: 0.938rem;
    color:#585858;
    margin:0;
    padding: 0;
}
.basic-grid-card  .grid-button {
	display:inline-block;
	padding:12px 25px;
	background:#ff3600;
	text-align:center;
	font-size:15px;
	color:#fff;
    margin-bottom: 6px;
    transition: 0.6s all;
}
.basic-grid-card  .grid-button:hover {
    background:#bc2d07;
}
