/* RESET STYLING */
*, *::before, *::after {margin: 0; padding: 0; box-sizing: border-box;}
html {scroll-behavior: smooth;}
body {font-family: "inter"; -webkit-font-smoothing: antialiased;overflow-x: hidden;}
h1,h2,h3,h4,h5,h6 {margin: 0; font-family: "Outfit";color: #191F29;}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {font-family: "Outfit";}
ul, ol {margin: 0; padding: 0;}
li {list-style: none; font-size: 16px;}
p {margin: 0;}
a {color: #000; text-decoration: none; font-size: 16px; width: fit-content;display: block;}
p a {display: inline;}
button {font-size: 16px; background-color: transparent; color: #fff; border: none; cursor: pointer;}
img, picture {max-width: 100%; height: auto; vertical-align: middle; font-style: italic;}
picture {display: block;}
svg {vertical-align: middle;}
input, textarea, select {width: 100%; font-family: "inter"; color: #000;}
select {appearance: none;}
input[type="number"]::-webkit-inner-spin-button,
input[type="search"]::-webkit-search-cancel-button {appearance: none;}
textarea {resize: none;}
section {overflow-x: hidden;}
/* MODIFIER CSS CLASSES */
.container {max-width: 1320px; margin-inline: auto;}
.btn__primary {display: flex; align-items: center; justify-content: center; font-size: 16px; text-transform: capitalize; text-wrap: nowrap; border: 1px solid transparent; border-radius: 0;}
.btn__primary:hover {color: #fff;}
/* SCROLLBAR */
:where(.scroll, .scroll__p > p) {overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--c-primary) var(--_c-scrollbar-bg);}

/* FONT FAMILIES */
@font-face {
    font-family: "inter";
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/Inter-VariableFont.ttf");
}
@font-face {
    font-family: "Outfit";
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/Outfit-VariableFont.ttf");
}
@font-face {
    font-family: "Roboto-Med";
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/Roboto-Medium.ttf");
}
/* VARIABLES */
.scroll{
    --_c-scrollbar-bg : #e2e2e2;
}
/* faqs */
.accordion-button:focus {box-shadow: none !important;}

/* hero banner */
.hero_banner_sec {background-image: url("../images/tempPic/home_banner.webp");background-repeat: no-repeat;background-size: cover;padding-block: 185px;}
.hb_head p {font-family: "Outfit";font-weight: 600;text-transform: uppercase;color: #EC281C;display: inline-flex;}
.hb_head h2 {font-weight: 600;font-size: 48px;text-transform: capitalize;font-size: 72px;line-height: 70px;}
.hb_para p {color: #74787C;font-size: 18px;}
.hb_btn_main a, .hb_btn_main a span {color: #fff;font-weight: 700;font-family: "Outfit"; text-transform: uppercase;}
.hb_btnOne a {background-color: #FF3B30;border-radius: 7px;padding: 15px 25px;}
/*.hb_btnOne a:hover {background-color: #d5190e}*/
.hb_btnTwo a {background-color: #191F29;border-radius: 7px;padding: 15px 25px;}
.hb_btn_main {gap: 10px;}

.resuable_head h2 {font-size: 48px;font-weight: 600;margin-bottom: .5rem;text-transform: capitalize;}
.resuable_head p {font-family: "Outfit";font-weight: 600;text-transform: uppercase;color: #EC281C;display: inline-flex;}
.resuable_head p:first-of-type img {width:22px;height: 24px;}

@media only screen and (max-width:991px){
    .hero_banner_sec {padding-inline: 30px;}
    .resuable_head h2 {font-size: 42px;}
    .hb_head h2 {font-size: 58px;line-height: 56px}
}
@media only screen and (max-width:767px){
    .hero_banner_sec {padding-block: 120px;}
    .hb_head h2 {font-size: 46px;line-height: 50px}
}
@media only screen and (max-width:575px){
    .hero_banner_sec {padding-inline: 0px;padding-block: 80px;}
    .resuable_head h2 {font-size: 38px;}
    .hb_head h2 {font-size: 42px;}
}
.hb_head h1{font-weight: bold;font-size: 34px;}
.ds_heading span{font-size: 20px;}
.ds_heading span img{height: 15px;}