/*==================================================
MASALA ZONE PRO
GLOBAL DESIGN SYSTEM
==================================================*/

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800&family=Poppins:wght@300;400;500;600;700&display=swap');

/* Reset */

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

/* Variables */

:root{

    --primary:#D4AF37;
    --primary-dark:#B8891D;

    --secondary:#E67E22;

    --black:#0B0B0B;
    --black-light:#161616;

    --white:#ffffff;

    --text:#cfcfcf;

    --container:1400px;

    --radius:18px;

    --transition:.35s ease;

}

/* Body */

html{
    scroll-behavior:smooth;
}

body{

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

    background:#0B0B0B;

    color:#fff;

    line-height:1.7;

    overflow-x:hidden;

}

/* Typography */

h1,h2,h3,h4,h5,h6{

    font-family:'Playfair Display',serif;

    font-weight:700;

    color:#fff;

    line-height:1.2;

}

a{

    text-decoration:none;

    color:inherit;

    transition:var(--transition);

}

img{

    display:block;

    max-width:100%;

}

/* Container */

.mz-container{

    width:100%;

    max-width:1400px;

    margin:auto;

    padding:0 40px;

}

/* Sections */

section{

    position:relative;

}

/* Astra Override */

.ast-container,
.site-content .ast-container,
.entry-content,
.site-main{

    max-width:100% !important;

    width:100% !important;

    margin:0 !important;

    padding:0 !important;

}

/* Buttons */

.mz-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:16px 34px;

    border-radius:50px;

    font-weight:600;

    transition:.35s;

}

.mz-btn-primary{

    background:#D4AF37;

    color:#111;

}

.mz-btn-primary:hover{

    background:#B8891D;

}

.mz-btn-outline{

    border:1px solid rgba(255,255,255,.25);

    color:#fff;

}

.mz-btn-outline:hover{

    border-color:#D4AF37;

    color:#D4AF37;

}
/*=========================================
GLOBAL MOBILE OVERFLOW FIX
=========================================*/

@media (max-width: 768px){

    html,
    body{
        width:100%;
        max-width:100%;
        overflow-x:hidden !important;
    }

    .mz-container{
        width:100%;
        max-width:100%;
        padding-left:20px;
        padding-right:20px;
        box-sizing:border-box;
    }

    section{
        width:100%;
        max-width:100%;
        overflow:hidden;
    }

    img{
        max-width:100%;
        height:auto;
    }

    *{
        max-width:100%;
    }

}
/* =====================================================
   MASALA ZONE - ASTRA FULL WIDTH FIX
===================================================== */

body:has(.mz-page) #content{
    padding-top:0 !important;
    padding-bottom:0 !important;
}

body:has(.mz-page) #content > .ast-container{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
}

body:has(.mz-page) .mz-page{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
}

/* Mobile */
@media (max-width:767px){

    body:has(.mz-page) #content > .ast-container{
        width:100% !important;
        max-width:none !important;
        padding:0 !important;
        margin:0 !important;
    }

    body:has(.mz-page) .mz-page{
        width:100% !important;
        margin:0 !important;
        padding:0 !important;
    }

}
/* =====================================================
   MASALA ZONE - OUTER BACKGROUND
===================================================== */

html,
body{
    background:#292929 !important;
}

/* Astra page background */
body:has(.mz-page) #page,
body:has(.mz-page) #content,
body:has(.mz-page) .site-content{
    background:#292929 !important;
}

/* Keep actual website sections unchanged */
.mz-page{
    background:#292929 !important;
}

/* Mobile */
@media(max-width:767px){

    html,
    body{
        background:#292929 !important;
    }

    body:has(.mz-page) #page,
    body:has(.mz-page) #content,
    body:has(.mz-page) .site-content{
        background:#292929 !important;
    }

}