/*
Theme Name:     Hello Elementor Child
Theme URI:      https://example.com/hello-elementor-child
Description:    Child theme for Hello Elementor
Author:         Your Name
Author URI:     https://example.com
Template:       hello-elementor
Version:        1.0.0
Text Domain:    hello-elementor-child
*/

/* Add your custom CSS below */


.above-slider {  position: absolute; z-index: 9;}
.slider-section img { height: 100vh; object-fit: cover; width: 100%;}
.highlight-box .elementor-image-box-img { width: auto !important; }
.highlight-box h2.elementor-image-box-title {    margin-top: 0 !important;}


.post-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.post-card {
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 10px;
    background: #fff;
    transition: 0.3s;
}

.post-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.post-thumb img {
    width: 100%;
    border-radius: 8px;
}

.post-title {
    margin: 15px 0 10px;
    font-size: 20px;
}

.post-excerpt {
    font-size: 15px;
    color: #666;
}

.read-more-btn {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 15px;
    background: #000;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
}

.read-more-btn:hover {
    background: #333;
}


.post-pagination {
    text-align: center;
    margin: 40px 0;
}

.post-pagination .page-numbers {
    display: inline-block;
    padding: 8px 15px;
    margin: 0 5px;
    border: 1px solid #ddd;
    border-radius: 6px;
    text-decoration: none;
    font-size: 16px;
    color: #333;
    transition: 0.3s;
}

.post-pagination .page-numbers:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

.post-pagination .current {
    background: #000;
    color: #fff;
    border-color: #000;
    font-weight: bold;
}
.single-layout {
    display: flex;
    gap: 40px;
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
    
}
/* Large tablets / small laptops (2 columns) */
@media (max-width: 1024px) { 

}


/* Tablets & large phones in landscape */
@media (max-width: 768px) {


 } 


/* Small phones (your 0–580px range) */
@media (min-width: 0px) and (max-width: 580px) {

.single-layout {
    display: flex;
    gap: 40px;
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
    flex-direction: column;
}
 }