/* ==========================================================
   SeniorTech Networks Website V3
   File: base.css
   Purpose: Global Foundation
========================================================== */

/* ==========================================================
   RESET
========================================================== */

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

html{
    scroll-behavior:smooth;
}

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

/* ==========================================================
   DESIGN SYSTEM
========================================================== */

:root{

    /* Brand */

    --color-primary:#0D2B63;
    --color-secondary:#0077CC;
    --color-accent:#FF7A00;

    /* Neutrals */

    --color-white:#FFFFFF;
    --color-light:#F8FAFC;
    --color-border:#E5E7EB;

    --color-heading:#102A43;
    --color-text:#52606D;

    /* Layout */

    --container-width:1320px;

    /* Radius */

    --radius-sm:8px;
    --radius-md:14px;
    --radius-lg:24px;
    --radius-xl:32px;

    /* Shadows */

    --shadow-sm:0 6px 18px rgba(0,0,0,.06);

    --shadow-md:0 18px 40px rgba(0,0,0,.10);

    --shadow-lg:0 35px 80px rgba(0,0,0,.15);

    /* Animation */

    --transition:.35s ease;

}

/* ==========================================================
   TYPOGRAPHY
========================================================== */

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

    color:var(--color-heading);

    font-weight:700;

    line-height:1.2;

}

p{

    color:var(--color-text);

    line-height:1.8;

}

/* ==========================================================
   LINKS
========================================================== */

a{

    color:inherit;

    text-decoration:none;

}

/* ==========================================================
   IMAGES
========================================================== */

img{

    display:block;

    max-width:100%;

    height:auto;

}

/* ==========================================================
   LISTS
========================================================== */

ul{

    list-style:none;

}

/* ==========================================================
   CONTAINER
========================================================== */

.container{

    width:min(var(--container-width),92%);

    margin:auto;

}

/* ==========================================================
   UTILITIES
========================================================== */

.text-center{

    text-align:center;

}

.section{

    padding:120px 0;

}