/*=========================================================
        GLOBAL.CSS
        Manasadwip Ramakrishna Mission Praktani Samsad
=========================================================*/


/*=========================================================
                    GOOGLE FONT
=========================================================*/

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Poppins:wght@300;400;500;600;700&display=swap');


/*=========================================================
                    ROOT VARIABLES
=========================================================*/

:root{

    --primary:#0B2D5B;
    --secondary:#D4A017;

    --white:#ffffff;
    --black:#000000;

    --text:#333333;
    --gray:#6c757d;

    --light:#f8f9fa;
    --border:#e9ecef;

    --success:#198754;
    --danger:#dc3545;

    --radius:12px;

    --shadow:
        0 10px 30px rgba(0,0,0,.08);

    --transition:.3s ease;

}


/*=========================================================
                    RESET
=========================================================*/

*,
*::before,
*::after{

    margin:0;
    padding:0;
    box-sizing:border-box;

}


/*=========================================================
                    HTML
=========================================================*/

html{

    scroll-behavior:smooth;

}


/*=========================================================
                    BODY
=========================================================*/

body{

    font-family:'Poppins',sans-serif;

    font-size:16px;

    font-weight:400;

    color:var(--text);

    background:var(--white);

    overflow-x:hidden;

    line-height:1.7;

}


/*=========================================================
                    LINKS
=========================================================*/

a{

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    text-decoration:none;

}


/*=========================================================
                    LIST
=========================================================*/

ul,
ol{

    list-style:none;

    padding:0;

    margin:0;

}


/*=========================================================
                    PARAGRAPH
=========================================================*/

p{

    margin-bottom:1rem;

    color:var(--gray);

}


/*=========================================================
                    HEADINGS
=========================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    margin-bottom:15px;

    color:var(--primary);

    font-family:'Cinzel',serif;

    font-weight:700;

}


/*=========================================================
                    CONTAINER
=========================================================*/

.container{

    width:100%;

    max-width:1320px;

    margin:auto;

    padding-left:15px;

    padding-right:15px;

}


/*=========================================================
                    BUTTON
=========================================================*/

.btn{

    border-radius:8px;

    padding:12px 28px;

    font-weight:600;

    transition:var(--transition);

}

.btn:focus{

    box-shadow:none;

}


/*=========================================================
                PRIMARY BUTTON
=========================================================*/

.btn-primary-custom{

    background:var(--primary);

    color:#fff;

    border:none;

}

.btn-primary-custom:hover{

    background:#082349;

    color:#fff;

}


/*=========================================================
                SECONDARY BUTTON
=========================================================*/

.btn-secondary-custom{

    background:var(--secondary);

    color:#fff;

    border:none;

}

.btn-secondary-custom:hover{

    background:#b88711;

    color:#fff;

}


/*=========================================================
                    FORM
=========================================================*/

.form-control{

    border-radius:8px;

    min-height:48px;

    box-shadow:none;

}

.form-control:focus{

    border-color:var(--primary);

    box-shadow:0 0 0 .15rem rgba(11,45,91,.15);

}


/*=========================================================
                    SELECTION
=========================================================*/

::selection{

    background:var(--secondary);

    color:#fff;

}


/*=========================================================
                    SCROLLBAR
=========================================================*/

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-track{

    background:#efefef;

}

::-webkit-scrollbar-thumb{

    background:var(--primary);

    border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

    background:#082349;

}


/*=========================================================
                COMMON SPACING
=========================================================*/

.py-section{

    padding:80px 0;

}

.mt-section{

    margin-top:80px;

}

.mb-section{

    margin-bottom:80px;

}


/*=========================================================
                    UTILITIES
=========================================================*/

.shadow-custom{

    box-shadow:var(--shadow);

}

.radius{

    border-radius:var(--radius);

}

.text-primary{

    color:var(--primary)!important;

}

.text-secondary{

    color:var(--secondary)!important;

}

.bg-primary-custom{

    background:var(--primary);

}

.bg-secondary-custom{

    background:var(--secondary);

}


/*=========================================================
                IMAGE UTILITIES
=========================================================*/

/*
Avoid styling all <img> tags globally.
Use these helper classes instead.
*/

.img-fluid-custom{

    max-width:100%;

    height:auto;

    display:block;

}

.object-cover{

    object-fit:cover;

}


/*=========================================================
                    LOADER
=========================================================*/

.loader{

    position:fixed;

    inset:0;

    background:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    z-index:99999;

}

.loader.hide{

    opacity:0;

    visibility:hidden;

}


/*=========================================================
                RESPONSIVE BASICS
=========================================================*/

@media (max-width:991px){

    .py-section{

        padding:60px 0;

    }

}

@media (max-width:576px){

    body{

        font-size:15px;

    }

    .py-section{

        padding:50px 0;

    }

}