/* ==========================
   GLOBAL
========================== */

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

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Poppins',sans-serif;

    background:#f6f8f2;

    color:#1d2b1f;

    overflow-x:hidden;
}

a{
    text-decoration:none;
}

img{
    max-width:100%;
    display:block;
}

.section{

    padding:90px 50px;
}

.section h2{

    text-align:center;

    font-size:42px;

    font-weight:800;

    margin-bottom:15px;

    color:#16341d;
}

.section-subtitle{

    text-align:center;

    max-width:800px;

    margin:0 auto 50px;

    color:#5d6960;

    font-size:18px;
}

/* ==========================
   HEADER
========================== */

.premium-header {

    background: rgba(23,64,38,.97);

    position: sticky;
    top: 0;
    z-index: 999;

    text-align: center;

    padding: 20px 20px;

    width: 100%;
}

.logo-wrapper {

    display: flex;
    justify-content: center;
    align-items: center;

    margin-bottom: 15px;
}

.site-logo {

    display: block;

    margin: 0 auto;

    height: 120px;

    width: auto;
}

.premium-nav {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 35px;

    flex-wrap: wrap;
}
/* ==========================
   HERO
========================== */

.hero{

    min-height:85vh;

    background:
        linear-gradient(
            rgba(16,40,21,.45),
            rgba(16,40,21,.55)
        ),
        url('../images/hero.jpg');

    background-size:cover;

    background-position:center;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    color:white;

    padding:40px;
}

.hero-content{

    max-width:900px;
}

.hero-content h1{

    font-size:72px;

    line-height:1.1;

    margin-bottom:20px;

    font-weight:800;
}

.hero-content p{

    font-size:24px;

    margin-bottom:30px;
}

/* ==========================
   BUTTONS
========================== */

.btn{

    display:inline-block;

    background:
        linear-gradient(
            135deg,
            #d7a94d,
            #b9851e
        );

    color:white;

    padding:14px 28px;

    border-radius:50px;

    font-weight:700;

    transition:.3s;

    box-shadow:0 10px 25px rgba(185,133,30,.25);
}

.btn:hover{

    transform:translateY(-4px);

    box-shadow:0 16px 35px rgba(185,133,30,.35);
}

/* ==========================
   GRID
========================== */

.grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;
}

@media(max-width:992px){

    .grid{

        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:768px){

    .grid{

        grid-template-columns:1fr;
    }
}

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

.card{

    background:white;

    border-radius:24px;

    padding:25px;

    box-shadow:
        0 10px 35px rgba(0,0,0,.08);

    transition:.35s;

    overflow:hidden;
}

.card:hover{

    transform:translateY(-10px);

    box-shadow:
        0 20px 50px rgba(0,0,0,.12);
}

.card img{

    width:100%;

    height:260px;

    object-fit:cover;

    border-radius:16px;

    margin-bottom:18px;
}

.card h3{

    font-size:26px;

    margin-bottom:5px;

    color:#173520;
}

.card p{

    color:#57655b;

    line-height:1.7;
}

/* ==========================
   MARATHI
========================== */

.marathi-title{

    color:#b9851e;

    font-size:18px;

    font-weight:700;

    margin-bottom:12px;
}

.large-marathi{

    font-size:24px;
}

/* ==========================
   PRODUCTS
========================== */

.product-card{

    text-align:center;
}

.product-icon{

    font-size:72px;

    color:#b9851e;

    margin-bottom:18px;

    transition:.3s;
}

.product-card:hover .product-icon{

    transform:scale(1.12);
}

.product-card .btn{

    margin-top:20px;
}

/* ==========================
   BREEDS SECTION
========================== */

.breeds-section{

    background:#edf4e8;

    border-radius:30px;
}

/* ==========================
   CONTACT FORM
========================== */

.contact-form input,
.contact-form textarea{

    width:100%;

    padding:15px;

    border-radius:12px;

    border:1px solid #d6e0d0;

    margin-bottom:15px;

    font-family:inherit;
}

.contact-form input:focus,
.contact-form textarea:focus{

    outline:none;

    border-color:#b9851e;
}

/* ==========================
   MAP
========================== */

iframe{

    width:100%;

    border:none;

    border-radius:15px;
}

/* ==========================
   CTA SECTION
========================== */

.cta-card {

    text-align: center;

    padding: 60px;

    background:
        linear-gradient(
            135deg,
            #1f4d2e,
            #2f6a3f
        );

    color: white !important;
}

.cta-card h2 {

    color: white !important;

    margin-bottom: 15px;
}

.cta-card p {

    color: rgba(255,255,255,.92) !important;

    font-size: 18px;

    max-width: 700px;

    margin: 0 auto;
}

/* ==========================
   FOOTER
========================== */

footer{

    background:
        linear-gradient(
            135deg,
            #102317,
            #1d3d27
        );

    color:white;

    text-align:center;

    padding:60px 20px;
}

footer h3{

    font-size:30px;

    margin-bottom:10px;
}

footer p{

    opacity:.9;

    margin-bottom:8px;
}

/* ==========================
   WHATSAPP
========================== */

.whatsapp-btn{

    position:fixed;

    bottom:25px;

    right:25px;

    z-index:999;

    background:#25D366;

    color:white;

    padding:16px 24px;

    border-radius:50px;

    font-weight:700;

    box-shadow:
        0 15px 35px rgba(37,211,102,.3);
}

.whatsapp-btn:hover{

    transform:scale(1.05);
}

/* ==========================
   ANIMATIONS
========================== */

.fade-up{

    animation:fadeUp .8s ease;
}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(30px);
    }

    to{

        opacity:1;

        transform:translateY(0);
    }
}

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

@media(max-width:768px){

    .site-logo{

        height:80px;
    }

    .hero-content h1{

        font-size:42px;
    }

    .hero-content p{

        font-size:18px;
    }

    .section{

        padding:60px 20px;
    }

    .premium-nav{

        gap:15px;
    }
}



/* =====================================
   FINAL NAVIGATION COLORS
===================================== */

.premium-nav a,
.premium-nav a:link,
.premium-nav a:visited {

    color: #ffffff !important;

    text-decoration: none !important;

    font-size: 16px;

    font-weight: 600;

    display: flex;

    align-items: center;

    gap: 8px;

    transition: all .3s ease;
}

.premium-nav a i {

    color: #d7a94d !important;
}

.premium-nav a:hover {

    color: #d7a94d !important;

    transform: translateY(-2px);
}

.premium-nav a:hover i {

    color: #ffffff !important;
}


/* ABOUT PAGE */

.founder-grid{

    display:grid;

    grid-template-columns:450px 1fr;

    gap:50px;

    align-items:center;
}

.founder-image{

    width:100%;

    border-radius:25px;

    box-shadow:0 15px 40px rgba(0,0,0,.12);
}

.founder-name{

    font-size:42px;

    color:#173520;

    margin-bottom:10px;
}

@media(max-width:992px){

    .founder-grid{

        grid-template-columns:1fr;
    }

    .founder-name{

        font-size:32px;
    }
}


/* ==========================
   FOUNDER SECTION
========================== */

.founder-section {

    display: flex;

    align-items: center;

    gap: 60px;

    max-width: 1400px;

    margin: 0 auto;
}

.founder-photo {

    flex: 0 0 350px;
}

.founder-photo img {

    width: 100%;

    border-radius: 25px;

    box-shadow: 0 20px 50px rgba(0,0,0,.15);
}

.founder-content {

    flex: 1;
}

.founder-content h2 {

    text-align: left !important;

    margin-bottom: 20px;
}

.founder-content h3 {

    font-size: 42px;

    color: #173520;

    margin-bottom: 10px;
}

.founder-content p {

    font-size: 18px;

    line-height: 1.9;

    margin-bottom: 18px;

    color: #57655b;
}

@media(max-width:992px){

    .founder-section {

        flex-direction: column;
    }

    .founder-photo {

        width: 100%;
    }

    .founder-content h2 {

        text-align: center !important;
    }
}


/* ==========================
   GALLERY
========================== */

.gallery-grid{

    display:grid;

    grid-template-columns:
        repeat(auto-fill,minmax(320px,1fr));

    gap:25px;
}

.gallery-item{

    overflow:hidden;

    border-radius:20px;

    background:white;

    box-shadow:
        0 10px 35px rgba(0,0,0,.08);
}

.gallery-item img{

    width:100%;

    height:300px;

    object-fit:cover;

    transition:.4s;
}

.gallery-item:hover img{

    transform:scale(1.08);
}

/* ==========================
   RESPONSIVE FOUNDER SECTION
========================== */
/* ==========================
   PREMIUM FOUNDER
========================== */

.founder-premium{

    display:grid;

    grid-template-columns:320px 1fr;

    gap:60px;

    align-items:center;

    max-width:1200px;

    margin:0 auto;
}

.founder-left{

    text-align:center;
}

.founder-premium-img{

    width:320px;

    height:420px;

    object-fit:cover;

    border-radius:160px;

    border:8px solid #ffffff;

    box-shadow:
        0 20px 50px rgba(0,0,0,.18);

    margin:auto;
}

.founder-badge{

    display:inline-block;

    background:#d7a94d;

    color:#fff;

    padding:8px 18px;

    border-radius:30px;

    font-size:14px;

    font-weight:600;

    margin-bottom:20px;
}

.founder-right h2{

    text-align:left;

    margin-bottom:10px;
}

.founder-right h3{

    font-size:38px;

    color:#173520;

    margin-bottom:10px;
}

.founder-right p{

    font-size:18px;

    line-height:1.9;

    color:#57655b;

    margin-bottom:15px;
}

@media(max-width:992px){

    .founder-premium{

        grid-template-columns:1fr;

        text-align:center;

        gap:30px;
    }

    .founder-right h2{

        text-align:center;
    }

    .founder-right h3{

        font-size:30px;
    }

    .founder-premium-img{

        width:220px;

        height:220px;
    }
}