:root {
    --primary: #0070C0;
    --secondary: #1c4482;
    --background: #eef1f7;
    /* Theme color */
    --theme: var(--primary);


    --brand-color-orange: #e64600;
    --brand-color-orange-2: #ff7300;
    --brand-color-purple: #4a2767;
    --brand-color-purple-2: #6e5285;
    --brand-color-blue: #0f77b7;
    --brand-color-blue-light: rgb(220, 242, 255);
    --brand-color-dark-blue: rgb(33 69 128);
    --brand-color-new-blue: #54CCED;
    --brand-color-new-blue2: #2ad1ff;
    --brand-color-turquoise: #44B4A6;
    --brand-color-dark-turquoise: #248075;
    --brand-color-gold: #A58B3F;
    --input-background: #e8f0fe;

}

body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    height: 100vh;
    font-family: Arial, Helvetica, sans-serif;
    display: flex;
    overflow-x: hidden;
    flex-direction: column;
}

html,
body,
main {
    scroll-behavior: smooth;
}

/* width */
::-webkit-scrollbar {
    width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}


a {
    text-decoration: none !important;
}

p,
li {
    text-align: justify;
}

.text_container h1 {
    text-align: start;
}

/*===========================homesection styling start=============================*/
.home_container {
    height: 100vh;
    display: flex;
    align-items: center;
    padding: 0rem 7%;
    background-color: var(--background);
    background: url("../assets/blue_pattern.webp") no-repeat center center/cover;
}

.hero_text h1 {
    font-size: clamp(2rem, 4vw, 4.25rem);
    color: var(--primary);
    margin-block-end: 0.5rem;
}

.hero_text h2 {
    font-size: clamp(1.3rem, 4vw, 3rem);
    line-height: clamp(2.5rem, 4vw, 4.25rem);
    margin-block-start: 0.5rem;
}

/*===========================homesection styling end===============================*/

/*===========================introductionsection styling end===============================*/
.introduction_container {
    padding: 2rem 7%;
}

@media screen and (max-width: 768px) {
    .introduction_container {
        padding: 1rem 4%;
    }
}


.introduction_container h1 {
    font-size: clamp(1.5rem, 4vw, 1.75rem);
    line-height: clamp(2.5rem, 4vw, 2.25rem);
    margin-block-start: 1rem;
    border-bottom: 1px solid #d1d1d1;
}



.text_container {
    padding-top: 3rem;
    line-height: 2;
}

.text_container:first-child {
    padding-top: 0rem;
}

.tab__content li {
    padding-bottom: 5px;
}

.tab__content ul {
    padding-inline-start: 20px;
}

.text_container ul li ul li {
    list-style: square;
}

/*list styles*/
li.hyphen {
    list-style-type: "-   ";
}

li.circle {
    list-style: circle;
}

ol.decimal {
    counter-reset: item;
}

.decimal li:before {
    content: counters(item, ".") " ";
    counter-increment: item;
}

/*===========================introductionsection styling end===============================*/

/*==========================accordition styling start===============================*/
.accordion_container {
    overflow: hidden;
    position: relative;
    display: flex;
    padding: 2rem 7% 4rem;
    flex: 1;
}

.introduction_container span,
.accordion_container span {
    color: var(--primary);
}

.tab input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.tab__content {
    max-height: 0;
    overflow: hidden;
    transition: all 0.35s;
}

.tab input:checked~.tab__content {
    max-height: max-content;
    padding: 1rem;
}

/* Visual styles */
.accordion {
    color: #121212;
    border: 1px solid var(--theme);
    border-radius: 0.5rem;
    overflow: hidden;
}

.tab__label,
.tab__close {
    display: flex;
    color: white;
    background: var(--theme);
    cursor: pointer;
}

.tab__label {
    justify-content: space-between;
    padding: 1rem;
}

.tab__label::after {
    content: "\276F";
    width: 1em;
    height: 1em;
    text-align: center;
    transform: rotate(90deg);
    transition: all 0.35s;
}

.tab input:checked+.tab__label::after {
    transform: rotate(270deg);
}

.tab__close {
    justify-content: flex-end;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
}

.accordion--radio {
    --theme: var(--secondary);
}

/* Arrow animation */
.tab input:not(:checked)+.tab__label:hover::after {
    animation: bounce 0.5s infinite;
}

@keyframes bounce {
    25% {
        transform: rotate(90deg) translate(0.25rem);
    }

    75% {
        transform: rotate(90deg) translate(-0.25rem);
    }
}

.tab-header,
.sub-tab-header {
    font-weight: bold;
}


.sub_content_wrapper .tab__content .tab .tab__label {
    padding-left: 3rem;
}

.sub_content_wrapper .tab__content .tab p,
.sub_content_wrapper .tab__content .tab ul {
    padding: 0 2rem 0 3rem;
}

.sub_content_wrapper .tab__content .tab span {
    color: #fff;
}

.sub_content_wrapper .tab__content .tab ul {
    list-style-position: inside;
}

.sub_content_wrapper .tab__content .fa-angle-right {
    margin-right: 1rem;
}

/*==========================accordition styling end==============================*/
@media screen and (max-width: 836px) {
    .home_container {
        margin-top: 8rem;
        height: 30vh;
        background: url("../assets/blue_pattern_mobile.webp") no-repeat center center/cover;
    }

    .home_container,
    .introduction_container,
    .accordion_container {
        padding: 2rem 5%;
    }

    p,
    li {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .accordion_container {
        flex: 1;
    }

    .tab input:checked~.tab__content {
        max-height: max-content;
        padding: 0.5rem;
    }
}