.elementor-462 .elementor-element.elementor-element-d3f869f{--display:flex;--min-height:300px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:0.5;}.elementor-462 .elementor-element.elementor-element-d3f869f:not(.elementor-motion-effects-element-type-background), .elementor-462 .elementor-element.elementor-element-d3f869f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://shafollo.com/wp-content/uploads/2025/01/Untitled-design-17.png");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-462 .elementor-element.elementor-element-d3f869f::before, .elementor-462 .elementor-element.elementor-element-d3f869f > .elementor-background-video-container::before, .elementor-462 .elementor-element.elementor-element-d3f869f > .e-con-inner > .elementor-background-video-container::before, .elementor-462 .elementor-element.elementor-element-d3f869f > .elementor-background-slideshow::before, .elementor-462 .elementor-element.elementor-element-d3f869f > .e-con-inner > .elementor-background-slideshow::before, .elementor-462 .elementor-element.elementor-element-d3f869f > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );line-height:var( --e-global-typography-primary-line-height );color:var( --e-global-color-primary );}.elementor-462 .elementor-element.elementor-element-d48fb24{text-align:center;}.elementor-462 .elementor-element.elementor-element-d48fb24 .elementor-heading-title{font-family:"Cormorant", Sans-serif;font-size:46px;font-weight:700;text-transform:capitalize;line-height:1.3em;color:#FCFCFC;}.elementor-462 .elementor-element.elementor-element-eb009d7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:80px;--padding-left:15px;--padding-right:15px;}.elementor-462 .elementor-element.elementor-element-eb009d7:not(.elementor-motion-effects-element-type-background), .elementor-462 .elementor-element.elementor-element-eb009d7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFBE633;}.elementor-462 .elementor-element.elementor-element-4e48aff > .elementor-widget-container{margin:0px 0px -10px 0px;}.elementor-462 .elementor-element.elementor-element-4e48aff{text-align:left;}.elementor-462 .elementor-element.elementor-element-4e48aff .elementor-heading-title{font-family:"Cormorant", Sans-serif;font-size:26px;font-weight:700;text-transform:uppercase;line-height:1.3em;color:#474747;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-462 .elementor-element.elementor-element-e15a3e8{--divider-border-style:solid;--divider-color:var( --e-global-color-primary );--divider-border-width:2px;}.elementor-462 .elementor-element.elementor-element-e15a3e8 .elementor-divider-separator{width:100px;margin:0 auto;margin-left:0;}.elementor-462 .elementor-element.elementor-element-e15a3e8 .elementor-divider{text-align:left;padding-block-start:2px;padding-block-end:2px;}:root{--page-title-display:none;}@media(max-width:1366px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-divider .elementor-divider__text{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-divider .elementor-divider__text{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}}@media(max-width:767px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-462 .elementor-element.elementor-element-d48fb24 .elementor-heading-title{font-size:30px;}.elementor-462 .elementor-element.elementor-element-4e48aff .elementor-heading-title{font-size:22px;}.elementor-widget-divider .elementor-divider__text{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}}@media(min-width:1367px){.elementor-462 .elementor-element.elementor-element-d3f869f:not(.elementor-motion-effects-element-type-background), .elementor-462 .elementor-element.elementor-element-d3f869f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}/* Start custom CSS for shortcode, class: .elementor-element-6e5f214 */.subcategory-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Five equal columns */
    gap: 20px;
    margin-bottom: 50px; /* Added margin to prevent overlap with footer */
    grid-auto-rows: minmax(200px, auto); /* Ensures rows adjust to content height */
    position: relative;
}

.subcategory-item {
    position: relative;
    text-align: center;
    width: 100%; /* Make sure it fits inside the grid */
    height: 400px;
    padding-bottom: 100%; /* This creates the square aspect ratio */
    overflow: hidden; /* Hide anything overflowing */
    border-radius: 10PX; /* Make the container circular */
}

.subcategory-item img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
    object-fit: cover; /* Ensures the image covers the area */
    
    transition: transform 0.3s ease-in-out;
}

.subcategory-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); 
    transition: opacity 0.3s ease-in-out;
}

.subcategory-item h3 {
    position: absolute;
    bottom: 0px; /* Place title 10px from the bottom */
    left: 50%;
    transform: translateX(-50%);
    color: white;
    font-size: 15px;
    font-weight: 500;
    z-index: 1;
    padding: 5px;
    width: 100%;
    background: #596854;
    font-family: "Quicksand";
    line-height: 30px;
}

.subcategory-item:hover::before {
    opacity: 0; /* Remove overlay on hover */
}

.subcategory-item:hover img {
    transform: scale(1.05); /* Optional zoom effect */
}

/* Mobile View */
@media (max-width: 768px) {
    .subcategory-grid {
        grid-template-columns: repeat(1, 1fr); /* Two columns on mobile */
    }
}

/* Ensure the grid takes up enough space */
body, html {
    min-height: 100%; /* Ensure the page takes full height */
    padding: 0;
    margin: 0;
    overflow-x: hidden; /* Prevent horizontal scrolling */
}

/* Prevent Footer from overlapping */
footer {
    position: relative;
    z-index: 2;
    margin-top: 20px; /* Space between content and footer */
}/* End custom CSS */