/*=========================================================
    AS Tech Vision
    Utilities CSS
    Version : 2.0
=========================================================*/


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

:root{

    /* Brand */

    --ast-primary:#1565C0;
    --ast-primary-dark:#0D47A1;

    --ast-secondary:#F97316;
    --ast-secondary-dark:#EA580C;

    --ast-success:#16A34A;
    --ast-danger:#DC2626;
    --ast-warning:#FACC15;
    --ast-info:#0284C7;

    /* Neutral */

    --ast-dark:#0F172A;
    --ast-dark-light:#1E293B;

    --ast-body:#475569;
    --ast-muted:#64748B;

    --ast-light:#F8FAFC;
    --ast-white:#FFFFFF;

    --ast-border:#E2E8F0;

    /* Radius */

    --radius-xs:6px;
    --radius-sm:10px;
    --radius:16px;
    --radius-lg:24px;
    --radius-xl:32px;
    --radius-pill:999px;

    /* Shadow */

    --shadow-xs:0 2px 8px rgba(15,23,42,.04);

    --shadow-sm:0 6px 20px rgba(15,23,42,.06);

    --shadow-md:0 12px 35px rgba(15,23,42,.08);

    --shadow-lg:0 25px 60px rgba(15,23,42,.12);

    /* Transition */

    --transition:.30s ease;

}


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

*,
*::before,
*::after{

    margin:0;
    padding:0;

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    overflow-x:hidden;

    background:var(--ast-white);

    color:var(--ast-body);

    font-family:
        Inter,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;

    font-size:16px;

    line-height:1.7;

    font-weight:400;

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

}


/*=========================================================
    Selection
=========================================================*/

::selection{

    background:var(--ast-primary);

    color:#fff;

}

::-moz-selection{

    background:var(--ast-primary);

    color:#fff;

}


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

img{

    display:block;

    max-width:100%;

    height:auto;

}


/*=========================================================
    Lists
=========================================================*/

ul,
ol{

    margin:0;

    padding:0;

    list-style:none;

}


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

a{

    color:var(--ast-primary);

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    color:var(--ast-secondary);

}


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

button{

    outline:none;

    border:none;

    background:none;

    cursor:pointer;

}


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

input,
textarea,
select{

    outline:none;

    box-shadow:none;

    font-family:inherit;

}


/*=========================================================
    Bootstrap Fix
=========================================================*/

.container{

    width:100%;

}

.row{

    margin-left:-12px;

    margin-right:-12px;

}

.row>*{

    padding-left:12px;

    padding-right:12px;

}


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

.section{

    position:relative;

    padding:100px 0;

}

.section-sm{

    padding:70px 0;

}

.section-lg{

    padding:130px 0;

}


/*=========================================================
    Overflow
=========================================================*/

.overflow-hidden{

    overflow:hidden;

}

.position-relative{

    position:relative;

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

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

    margin:0 0 18px;

    color:var(--ast-dark);

    font-weight:700;

    line-height:1.25;

}

h1{

    font-size:60px;

}

h2{

    font-size:46px;

}

h3{

    font-size:34px;

}

h4{

    font-size:28px;

}

h5{

    font-size:22px;

}

h6{

    font-size:18px;

}

p{

    margin:0 0 18px;

    color:var(--ast-body);

    line-height:1.8;

}

small{

    font-size:14px;

    color:var(--ast-muted);

}

strong{

    font-weight:700;

}

b{

    font-weight:700;

}

/*=========================================================
    Display Headings
=========================================================*/

.display-1{

    font-size:76px;

    font-weight:800;

    line-height:1.1;

}

.display-2{

    font-size:64px;

    font-weight:800;

    line-height:1.1;

}

.display-3{

    font-size:54px;

    font-weight:800;

    line-height:1.15;

}

.display-4{

    font-size:44px;

    font-weight:800;

    line-height:1.2;

}

/*=========================================================
    Font Weight
=========================================================*/

.fw-300{

    font-weight:300!important;

}

.fw-400{

    font-weight:400!important;

}

.fw-500{

    font-weight:500!important;

}

.fw-600{

    font-weight:600!important;

}

.fw-700{

    font-weight:700!important;

}

.fw-800{

    font-weight:800!important;

}

/*=========================================================
    Text Colors
=========================================================*/

.text-primary{

    color:var(--ast-primary)!important;

}

.text-secondary{

    color:var(--ast-secondary)!important;

}

.text-success{

    color:var(--ast-success)!important;

}

.text-danger{

    color:var(--ast-danger)!important;

}

.text-info{

    color:var(--ast-info)!important;

}

.text-dark{

    color:var(--ast-dark)!important;

}

.text-body{

    color:var(--ast-body)!important;

}

.text-muted{

    color:var(--ast-muted)!important;

}

.text-white{

    color:#FFFFFF!important;

}

/*=========================================================
    Background Colors
=========================================================*/

.bg-primary{

    background:var(--ast-primary)!important;

}

.bg-secondary{

    background:var(--ast-secondary)!important;

}

.bg-success{

    background:var(--ast-success)!important;

}

.bg-danger{

    background:var(--ast-danger)!important;

}

.bg-info{

    background:var(--ast-info)!important;

}

.bg-light{

    background:var(--ast-light)!important;

}

.bg-dark{

    background:var(--ast-dark)!important;

}

.bg-white{

    background:#FFFFFF!important;

}

/*=========================================================
    Border
=========================================================*/

.border{

    border:1px solid var(--ast-border)!important;

}

.border-0{

    border:none!important;

}

.border-top{

    border-top:1px solid var(--ast-border)!important;

}

.border-bottom{

    border-bottom:1px solid var(--ast-border)!important;

}

.border-start{

    border-left:1px solid var(--ast-border)!important;

}

.border-end{

    border-right:1px solid var(--ast-border)!important;

}

/*=========================================================
    Border Radius
=========================================================*/

.rounded-xs{

    border-radius:var(--radius-xs)!important;

}

.rounded-sm{

    border-radius:var(--radius-sm)!important;

}

.rounded{

    border-radius:var(--radius)!important;

}

.rounded-lg{

    border-radius:var(--radius-lg)!important;

}

.rounded-xl{

    border-radius:var(--radius-xl)!important;

}

.rounded-pill{

    border-radius:999px!important;

}

/*=========================================================
    Shadows
=========================================================*/

.shadow-xs{

    box-shadow:var(--shadow-xs)!important;

}

.shadow-sm{

    box-shadow:var(--shadow-sm)!important;

}

.shadow{

    box-shadow:var(--shadow-md)!important;

}

.shadow-lg{

    box-shadow:var(--shadow-lg)!important;

}

.shadow-none{

    box-shadow:none!important;

}
/*=========================================================
    Display Utilities
=========================================================*/

.d-block{

    display:block!important;

}

.d-inline{

    display:inline!important;

}

.d-inline-block{

    display:inline-block!important;

}

.d-flex{

    display:flex!important;

}

.d-inline-flex{

    display:inline-flex!important;

}

.d-grid{

    display:grid!important;

}

.d-none{

    display:none!important;

}

/*=========================================================
    Flex Direction
=========================================================*/

.flex-row{

    flex-direction:row!important;

}

.flex-column{

    flex-direction:column!important;

}

.flex-row-reverse{

    flex-direction:row-reverse!important;

}

.flex-column-reverse{

    flex-direction:column-reverse!important;

}

/*=========================================================
    Flex Wrap
=========================================================*/

.flex-wrap{

    flex-wrap:wrap!important;

}

.flex-nowrap{

    flex-wrap:nowrap!important;

}

/*=========================================================
    Justify Content
=========================================================*/

.justify-start{

    justify-content:flex-start!important;

}

.justify-center{

    justify-content:center!important;

}

.justify-end{

    justify-content:flex-end!important;

}

.justify-between{

    justify-content:space-between!important;

}

.justify-around{

    justify-content:space-around!important;

}

.justify-evenly{

    justify-content:space-evenly!important;

}

/*=========================================================
    Align Items
=========================================================*/

.align-start{

    align-items:flex-start!important;

}

.align-center{

    align-items:center!important;

}

.align-end{

    align-items:flex-end!important;

}

.align-stretch{

    align-items:stretch!important;

}

/*=========================================================
    Gap Utilities
=========================================================*/

.gap-1{

    gap:6px!important;

}

.gap-2{

    gap:12px!important;

}

.gap-3{

    gap:18px!important;

}

.gap-4{

    gap:24px!important;

}

.gap-5{

    gap:32px!important;

}

/*=========================================================
    Width
=========================================================*/

.w-25{

    width:25%!important;

}

.w-50{

    width:50%!important;

}

.w-75{

    width:75%!important;

}

.w-100{

    width:100%!important;

}

.w-auto{

    width:auto!important;

}

.w-fit{

    width:fit-content!important;

}

/*=========================================================
    Height
=========================================================*/

.h-25{

    height:25%!important;

}

.h-50{

    height:50%!important;

}

.h-75{

    height:75%!important;

}

.h-100{

    height:100%!important;

}

.h-auto{

    height:auto!important;

}

/*=========================================================
    Position
=========================================================*/

.position-static{

    position:static!important;

}

.position-relative{

    position:relative!important;

}

.position-absolute{

    position:absolute!important;

}

.position-fixed{

    position:fixed!important;

}

.position-sticky{

    position:sticky!important;

}

/*=========================================================
    Overflow
=========================================================*/

.overflow-hidden{

    overflow:hidden!important;

}

.overflow-auto{

    overflow:auto!important;

}

.overflow-visible{

    overflow:visible!important;

}

/*=========================================================
    Cursor
=========================================================*/

.cursor-pointer{

    cursor:pointer!important;

}

.cursor-default{

    cursor:default!important;

}

/*=========================================================
    Object Fit
=========================================================*/

.object-cover{

    object-fit:cover!important;

}

.object-contain{

    object-fit:contain!important;

}

/*=========================================================
    Opacity
=========================================================*/

.opacity-0{

    opacity:0!important;

}

.opacity-25{

    opacity:.25!important;

}

.opacity-50{

    opacity:.5!important;

}

.opacity-75{

    opacity:.75!important;

}

.opacity-100{

    opacity:1!important;

}

/*=========================================================
    Z Index
=========================================================*/

.z-0{

    z-index:0!important;

}

.z-1{

    z-index:1!important;

}

.z-10{

    z-index:10!important;

}

.z-100{

    z-index:100!important;

}

.z-1000{

    z-index:1000!important;

}

.z-9999{

    z-index:9999!important;

}

/*=========================================================
    User Select
=========================================================*/

.user-select-none{

    user-select:none!important;

}

.user-select-all{

    user-select:all!important;

}

.user-select-auto{

    user-select:auto!important;

}

/*=========================================================
    Pointer Events
=========================================================*/

.pointer-events-none{

    pointer-events:none!important;

}

.pointer-events-auto{

    pointer-events:auto!important;

}
/*=========================================================
    AS Tech Vision
    Utilities CSS
    Part 4 (Final)
=========================================================*/


/*=========================================================
    Margin Utilities
=========================================================*/

.m-0{margin:0!important;}
.mt-0{margin-top:0!important;}
.mb-0{margin-bottom:0!important;}
.ms-0{margin-left:0!important;}
.me-0{margin-right:0!important;}

.mt-1{margin-top:.25rem!important;}
.mt-2{margin-top:.5rem!important;}
.mt-3{margin-top:1rem!important;}
.mt-4{margin-top:1.5rem!important;}
.mt-5{margin-top:3rem!important;}

.mb-1{margin-bottom:.25rem!important;}
.mb-2{margin-bottom:.5rem!important;}
.mb-3{margin-bottom:1rem!important;}
.mb-4{margin-bottom:1.5rem!important;}
.mb-5{margin-bottom:3rem!important;}

.ms-auto{margin-left:auto!important;}
.me-auto{margin-right:auto!important;}
.mx-auto{
    margin-left:auto!important;
    margin-right:auto!important;
}


/*=========================================================
    Padding Utilities
=========================================================*/

.p-0{padding:0!important;}

.pt-1{padding-top:.25rem!important;}
.pt-2{padding-top:.5rem!important;}
.pt-3{padding-top:1rem!important;}
.pt-4{padding-top:1.5rem!important;}
.pt-5{padding-top:3rem!important;}

.pb-1{padding-bottom:.25rem!important;}
.pb-2{padding-bottom:.5rem!important;}
.pb-3{padding-bottom:1rem!important;}
.pb-4{padding-bottom:1.5rem!important;}
.pb-5{padding-bottom:3rem!important;}

.ps-3{padding-left:1rem!important;}
.pe-3{padding-right:1rem!important;}


/*=========================================================
    Text Alignment
=========================================================*/

.text-start{
    text-align:left!important;
}

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

.text-end{
    text-align:right!important;
}


/*=========================================================
    Visibility
=========================================================*/

.visible{
    visibility:visible!important;
}

.invisible{
    visibility:hidden!important;
}


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

.img-fluid{

    max-width:100%;

    height:auto;

}

.img-cover{

    width:100%;

    height:100%;

    object-fit:cover;

}

.img-contain{

    width:100%;

    height:100%;

    object-fit:contain;

}


/*=========================================================
    Transition Helpers
=========================================================*/

.transition{

    transition:all .30s ease;

}

.transition-fast{

    transition:all .20s ease;

}

.transition-slow{

    transition:all .50s ease;

}


/*=========================================================
    Bootstrap Fix
=========================================================*/

.container-fluid{

    padding-left:15px;

    padding-right:15px;

}

.row>*{

    position:relative;

}


/*=========================================================
    Form Utilities
=========================================================*/

.form-control:disabled{

    background:#F8FAFC;

    opacity:1;

}

.form-select:disabled{

    background:#F8FAFC;

}


/*=========================================================
    Button Helpers
=========================================================*/

.btn{

    user-select:none;

    white-space:nowrap;

}

.btn:focus{

    box-shadow:none;

}


/*=========================================================
    Loading
=========================================================*/

.loading{

    pointer-events:none;

    opacity:.65;

}


/*=========================================================
    Divider
=========================================================*/

.divider{

    width:100%;

    height:1px;

    background:var(--ast-border);

}


/*=========================================================
    HR
=========================================================*/

hr{

    border:0;

    border-top:1px solid var(--ast-border);

    opacity:1;

}


/*=========================================================
    Badge Fix
=========================================================*/

.badge{

    font-weight:600;

    border-radius:999px;

}


/*=========================================================
    Focus Visible
=========================================================*/

:focus-visible{

    outline:2px solid var(--ast-primary);

    outline-offset:2px;

}


/*=========================================================
    Print
=========================================================*/

@media print{

    .d-print-none{

        display:none!important;

    }

}


/*=========================================================
    End Utilities
=========================================================*/