/*==========================================================
Project     : Maxatom Systems Website
File        : theme.css
Description : Global Theme Configuration
==========================================================*/

/*==========================================================
Google Font
==========================================================*/

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

/*==========================================================
Root Variables
==========================================================*/

:root{

    /* Primary */

    --mx-primary:#1D4ED8;
    --mx-primary-hover:#2563EB;

    /* Background */

    --mx-bg:#07111F;
    --mx-bg-light:#0F172A;
    --mx-bg-card:#172554;

    /* Text */

    --mx-white:#FFFFFF;
    --mx-text:#CBD5E1;
    --mx-heading:#F8FAFC;

    /* Accent */

    --mx-accent:#00D4FF;
    --mx-success:#10B981;
    --mx-warning:#F59E0B;
    --mx-danger:#EF4444;

    /* Border */

    --mx-border:#24324A;

    /* Shadow */

    --mx-shadow:

        0px 15px 40px rgba(0,0,0,.35);

    /* Radius */

    --mx-radius:12px;

    /* Container */
    --mx-container:1400px;

    /* Transition */

    --mx-transition:.30s ease;

}

/*==========================================================
Reset
==========================================================*/

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

/*==========================================================
Body
==========================================================*/

body{

    font-family:'Poppins',sans-serif;
    background:var(--mx-bg);
    color:var(--mx-text);
    overflow-x:hidden;

}

/*==========================================================
Typography
==========================================================*/

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

    color:var(--mx-heading);
    font-weight:700;

}

p{

    line-height:1.8;

}

/*==========================================================
Links
==========================================================*/

a{

    text-decoration:none;
    color:inherit;

}

/*==========================================================
List
==========================================================*/

ul{

    list-style:none;

}

/*==========================================================
Images
==========================================================*/

img{

    max-width:100%;
    display:block;

}

/*==========================================================
Container
==========================================================*/

.mx-container{

    width:90%;
    max-width:var(--mx-container);
    margin:auto;

}

/*==========================================================
Section Padding
==========================================================*/

section{

    padding:100px 0;

}