/*
Theme Name: Twenty Twenty-Four Child
Template: twentytwentyfour
Version: 1.0
*/

@import url("../twentytwentyfour/style.css");

/* =====================================================
   Home Page Styles - Front Page
===================================================== */
/* =========================
   SECTION HEADER
========================= */

.ssi-section-header{
    margin-bottom:20px;
}

.ssi-section-title{
    font-size:22px;
    font-weight:700;
    margin-bottom:5px;
    color:#111;
}

.ssi-section-subtitle{
    font-size:14px;
    color:#666;
    margin:0;
}

/* =========================
   SPACING BETWEEN SECTIONS
========================= */

.ssi-featured-brands-section,
.ssi-featured-coupons-section,
.ssi-latest-blog-section,
.ssi-home-info-section{
    margin-bottom:40px;
}

/* =========================
   MOBILE
========================= */

@media (max-width:768px){

    .ssi-section-title{
        font-size:18px;
    }

    .ssi-section-subtitle{
        font-size:13px;
    }

}

/* Hero Section */
.ssi-hero {
    background: linear-gradient(135deg, #0073aa 0%, #005177 100%);
    text-align: center;
    padding: 50px 20px;
    color: #fff;
    border-radius: 0.5rem;
}
.ssi-hero h1 {
    font-size: 2.8rem;
    margin-bottom: 20px;
}
.ssi-hero p {
    font-size: 1.2rem;
}

/* Featured Brands */
.ssi-featured-brands-section {
    padding: 20px 20px;
    background-color: #f9f9f9;
    border-radius: 0.5rem;
}
.ssi-featured-brands-section img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 0.3rem;
    transition: transform 0.3s ease;
}
.ssi-featured-brands-section img:hover {
    transform: scale(1.05);
}

/* Featured Coupons */
.ssi-featured-coupons-section {
    padding: 20px 20px;
    background-color: #f9f9f9;
    border-radius: 0.5rem;
}

/* Latest Blog Posts */
.ssi-latest-blog-section {
    padding: 20px 20px;
}

/* Home Info / Internal Links Section */
.ssi-home-info-section {
    padding: 20px 20px;
    background-color: #f4f4f4;
    border-radius: 0.5rem;
}
.ssi-home-info-section p {
    font-size: 1rem;
    line-height: 1.6;
}
.ssi-home-info-section a {
    color: #0073aa;
    text-decoration: underline;
}
.ssi-home-info-section a:hover {
    color: #005177;
}

/* =====================================================
   Responsive
===================================================== */
@media (max-width:768px) {
    .ssi-hero {
        padding: 50px 15px;
    }
    .ssi-hero h1 {
        font-size: 2rem;
    }
    .ssi-hero p {
        font-size: 1rem;
    }
    .ssi-featured-brands-section {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 15px;
        padding: 20px 15px;
    }
    .ssi-featured-coupons-section,
    .ssi-latest-blog-section-section,
    .ssi-home-info-section-section-section {
        padding: 20px 15px;
    }
}

/* Optional: small tweaks for very small devices */
@media (max-width:480px) {
    .ssi-hero {
        padding: 50px 10px;
    }
    .ssi-hero h1 {
        font-size: 1.8rem;
    }
    .ssi-hero p {
        font-size: 0.95rem;
    }
}