/* ==========================================================
   INFOWORLD V2
   RESET.CSS
   Modern CSS Reset
========================================================== */

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

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

/* ==========================
   HTML
========================== */

html{
    font-size:16px;
    scroll-behavior:smooth;
    -webkit-text-size-adjust:100%;
}

/* ==========================
   BODY
========================== */

body{
    min-height:100vh;
    background:var(--bg);
    color:var(--text);
    font-family:var(--font);
    line-height:1.7;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
}

/* ==========================
   MEDIA
========================== */

img,
picture,
video,
canvas,
svg{
    display:block;
    max-width:100%;
    height:auto;
}

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

input,
button,
textarea,
select{
    font:inherit;
}

button{
    cursor:pointer;
    background:none;
    border:none;
}

textarea{
    resize:vertical;
}

/* ==========================
   LINK
========================== */

a{
    text-decoration:none;
    color:inherit;
    transition:var(--transition);
}

a:hover{
    color:var(--primary);
}

/* ==========================
   LIST
========================== */

ul,
ol{
    list-style:none;
}

/* ==========================
   TABLE
========================== */

table{
    width:100%;
    border-collapse:collapse;
}

/* ==========================
   HEADING
========================== */

h1,
h2,
h3,
h4,
h5,
h6{
    line-height:1.25;
    font-weight:700;
}

/* ==========================
   PARAGRAPH
========================== */

p{
    color:var(--text-light);
}

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

.container{
    width:min(100% - 40px,var(--container));
    margin-inline:auto;
}

.container-lg{
    width:min(100% - 40px,var(--container-large));
    margin-inline:auto;
}

.container-sm{
    width:min(100% - 40px,var(--container-small));
    margin-inline:auto;
}

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

section{
    margin-bottom:60px;
}

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

.grid{
    display:grid;
    gap:30px;
}

/* ==========================
   FLEX
========================== */

.flex{
    display:flex;
}

.flex-center{
    display:flex;
    justify-content:center;
    align-items:center;
}

.flex-between{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

/* ==========================
   DISPLAY
========================== */

.block{
    display:block;
}

.inline{
    display:inline;
}

.hidden{
    display:none;
}

/* ==========================
   WIDTH
========================== */

.w-100{
    width:100%;
}

.h-100{
    height:100%;
}

/* ==========================
   TEXT
========================== */

.text-center{
    text-align:center;
}

.text-right{
    text-align:right;
}

.text-left{
    text-align:left;
}

.text-primary{
    color:var(--primary);
}

.text-muted{
    color:var(--text-muted);
}

/* ==========================
   SPACING
========================== */

.mt-1{margin-top:10px;}
.mt-2{margin-top:20px;}
.mt-3{margin-top:30px;}
.mt-4{margin-top:40px;}

.mb-1{margin-bottom:10px;}
.mb-2{margin-bottom:20px;}
.mb-3{margin-bottom:30px;}
.mb-4{margin-bottom:40px;}

.pt-1{padding-top:10px;}
.pt-2{padding-top:20px;}
.pt-3{padding-top:30px;}

.pb-1{padding-bottom:10px;}
.pb-2{padding-bottom:20px;}
.pb-3{padding-bottom:30px;}

/* ==========================
   BORDER
========================== */

.rounded{
    border-radius:var(--radius);
}

.rounded-lg{
    border-radius:var(--radius-lg);
}

.border{
    border:1px solid var(--border);
}

/* ==========================
   SHADOW
========================== */

.shadow-sm{
    box-shadow:var(--shadow-sm);
}

.shadow{
    box-shadow:var(--shadow);
}

.shadow-lg{
    box-shadow:var(--shadow-lg);
}

/* ==========================
   BACKGROUND
========================== */

.bg-white{
    background:var(--white);
}

.bg-primary{
    background:var(--primary);
    color:#fff;
}

/* ==========================
   ACCESSIBILITY
========================== */

.sr-only{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}

/* ==========================
   FOCUS
========================== */

:focus-visible{
    outline:3px solid var(--primary);
    outline-offset:2px;
}

/* ==========================
   SELECTION
========================== */

::selection{
    background:var(--primary);
    color:#fff;
}

/* ==========================
   SCROLLBAR
========================== */

::-webkit-scrollbar{
    width:10px;
}

::-webkit-scrollbar-track{
    background:#f1f5f9;
}

::-webkit-scrollbar-thumb{
    background:#cbd5e1;
    border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{
    background:#94a3b8;
}