*{
            margin:0;
            padding:0;
            box-sizing:border-box;
        }

        body{
            font-family:'Poppins',sans-serif;
            background:#f7fbf4;
            overflow-x:hidden;
            color:#1f2937;
        }

        a{
            text-decoration:none;
        }

        section{
            padding:90px 0;
        }

        /* ==================================================
           COLORS FROM LOGO
        =================================================== */

        :root{
            --primary:#6dbb2d;
            --secondary:#1d7f46;
            --lightgreen:#dff3c8;
            --dark:#163020;
            --white:#ffffff;
        }

        /* ==================================================
           HERO SECTION
        =================================================== */

        .blog-hero{
            position:relative;
            min-height:750px;
            display:flex;
            align-items:center;
            overflow:hidden;
            background:
                    linear-gradient(rgba(9,22,15,0.72),rgba(9,22,15,0.72)),
                    url('https://ssdfr.in/assets/images/20260311_1032_image.png');
            background-size:cover;
            background-position:center;
        }

        .hero-content{
            position:relative;
            z-index:2;
        }

        .hero-tag{
            display:inline-block;
            padding:10px 22px;
            background:rgba(255,255,255,0.15);
            border:1px solid rgba(255,255,255,0.15);
            border-radius:50px;
            color:#fff;
            margin-bottom:25px;
            backdrop-filter:blur(10px);
            font-size:14px;
            letter-spacing:1px;
        }

        .hero-title{
            font-size:68px;
            font-weight:700;
            color:#fff;
            line-height:1.1;
            margin-bottom:25px;
        }

        .hero-title span{
            color:#8ff03e;
        }

        .hero-desc{
            color:#d1d5db;
            font-size:18px;
            line-height:1.9;
            max-width:700px;
        }

        .hero-search{
            margin-top:40px;
            max-width:650px;
            position:relative;
        }

        .hero-search input{
            width:100%;
            height:70px;
            border:none;
            outline:none;
            padding:0 190px 0 30px;
            border-radius:60px;
            font-size:16px;
        }

        .hero-search button{
            position:absolute;
            top:8px;
            right:8px;
            height:54px;
            border:none;
            padding:0 30px;
            border-radius:50px;
            background:linear-gradient(135deg,var(--primary),var(--secondary));
            color:#fff;
            font-weight:600;
        }

        /* ==================================================
           SECTION TITLE
        =================================================== */

        .section-title{
            text-align:center;
            margin-bottom:60px;
        }

        .section-title h2{
            font-size:46px;
            font-weight:700;
            color:var(--dark);
            margin-bottom:15px;
        }

        .section-title p{
            color:#64748b;
            max-width:900px;
            margin:auto;
            line-height:1.8;
        }

        /* ==================================================
           FEATURED BLOG
        =================================================== */

        .featured-blog{
            margin-top:-120px;
            position:relative;
            z-index:3;
        }

        .featured-card{
            background:#fff;
            border-radius:30px;
            overflow:hidden;
            box-shadow:0 15px 50px rgba(0,0,0,0.08);
        }

        .featured-image{
            position:relative;
            overflow:hidden;
            height:100%;
        }

        .featured-image img{
            width:100%;
            height:100%;
            object-fit:cover;
            transition:0.5s;
        }

        .featured-card:hover img{
            transform:scale(1.08);
        }

        .featured-content{
            padding:50px;
        }

        .blog-badge{
            display:inline-block;
            padding:8px 18px;
            border-radius:50px;
            background:var(--lightgreen);
            color:var(--secondary);
            font-size:14px;
            font-weight:600;
            margin-bottom:20px;
        }

        .featured-content h3{
            font-size:38px;
            font-weight:700;
            color:var(--dark);
            line-height:1.4;
            margin-bottom:20px;
        }

        .featured-content p{
            color:#64748b;
            line-height:1.9;
            margin-bottom:30px;
        }

        .blog-meta{
            display:flex;
            gap:25px;
            flex-wrap:wrap;
            margin-bottom:25px;
        }

        .blog-meta span{
            color:#64748b;
            font-size:14px;
        }

        .blog-meta i{
            color:var(--primary);
            margin-right:8px;
        }

        .read-btn{
            display:inline-flex;
            align-items:center;
            gap:10px;
            padding:15px 30px;
            border-radius:50px;
            background:linear-gradient(135deg,var(--primary),var(--secondary));
            color:#fff;
            font-weight:600;
            transition:0.4s;
        }

        .read-btn:hover{
            transform:translateY(-5px);
            color:#fff;
        }

        /* ==================================================
           BLOG CARDS
        =================================================== */

        .blog-section{
            background:#f7fbf4;
        }

        .blog-card{
            background:#fff;
            border-radius:28px;
            overflow:hidden;
            transition:0.5s;
            height:100%;
            box-shadow:0 10px 35px rgba(0,0,0,0.06);
            border:1px solid rgba(0,0,0,0.03);
        }

        .blog-card:hover{
            transform:translateY(-12px);
        }

        .blog-img{
            overflow:hidden;
            position:relative;
        }

        .blog-img img{
            width:100%;
            height:260px;
            object-fit:cover;
            transition:0.5s;
        }

        .blog-card:hover .blog-img img{
            transform:scale(1.08);
        }

        .blog-content{
            padding:30px;
        }

        .blog-content h4{
            font-size:24px;
            font-weight:600;
            line-height:1.5;
            margin-bottom:18px;
            color:var(--dark);
        }

        .blog-content p{
            color:#64748b;
            line-height:1.8;
            margin-bottom:25px;
        }

        /* ==================================================
           CATEGORY SECTION
        =================================================== */

        .category-section{
            background:#eef9e4;
        }

        .category-card{
            background:#fff;
            border-radius:24px;
            padding:40px 30px;
            text-align:center;
            transition:0.4s;
            height:100%;
        }

        .category-card:hover{
            transform:translateY(-10px);
            background:linear-gradient(135deg,var(--primary),var(--secondary));
        }

        .category-card:hover h4,
        .category-card:hover p,
        .category-card:hover i{
            color:#fff;
        }

        .category-card i{
            font-size:55px;
            color:var(--primary);
            margin-bottom:25px;
            transition:0.4s;
        }

        .category-card h4{
            font-size:24px;
            font-weight:600;
            margin-bottom:15px;
            transition:0.4s;
        }

        .category-card p{
            color:#64748b;
            transition:0.4s;
        }

        /* ==================================================
           NEWSLETTER
        =================================================== */

        .newsletter{
            background:
                    linear-gradient(rgba(9,22,15,0.85),rgba(9,22,15,0.85)),
                    url('https://images.unsplash.com/photo-1455390582262-044cdead277a?q=80&w=1920&auto=format&fit=crop');
            background-size:cover;
            background-position:center;
            text-align:center;
            color:#fff;
        }

        .newsletter h2{
            font-size:52px;
            font-weight:700;
            margin-bottom:20px;
        }

        .newsletter p{
            color:#d1d5db;
            max-width:700px;
            margin:auto;
            line-height:1.8;
            margin-bottom:40px;
        }

        .newsletter-form{
            max-width:700px;
            margin:auto;
            position:relative;
        }

        .newsletter-form input{
            width:100%;
            height:72px;
            border:none;
            border-radius:60px;
            padding:0 200px 0 30px;
            outline:none;
        }

        .newsletter-form button{
            position:absolute;
            top:8px;
            right:8px;
            height:56px;
            border:none;
            padding:0 35px;
            border-radius:50px;
            background:linear-gradient(135deg,var(--primary),var(--secondary));
            color:#fff;
            font-weight:600;
        }

        /* ==================================================
           RESPONSIVE
        =================================================== */

        @media(max-width:991px){

            .hero-title{
                font-size:50px;
            }

            .featured-content{
                padding:35px;
            }

            .featured-content h3{
                font-size:30px;
            }
        }

        @media(max-width:767px){

            .hero-title{
                font-size:38px;
            }

            .section-title h2{
                font-size:34px;
            }

            .newsletter h2{
                font-size:36px;
            }

            .featured-content{
                padding:25px;
            }

            .hero-search input,
            .newsletter-form input{
                padding-right:20px;
            }

            .hero-search button,
            .newsletter-form button{
                position:relative;
                width:100%;
                margin-top:15px;
                top:auto;
                right:auto;
            }
        }