:root {
    --light-blue: #add7ce;
    --medium-blue: #57b8aa;
    --dark-blue:#293169;
    --white: #ffffff;
}

.container {
    max-width: 877px;
    width: 100%;
    margin: 0 auto;  /* This centers the container horizontally */
    padding: 0 15px; /* Add some padding to prevent content from touching the edges */
    box-sizing: border-box; /* Makes sure padding is included in width calculation */
}

/* Reset default margins */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Akkurat-Regular';
    font-size: 16px;
    line-height: 22px;
}

b {
    font-family: 'Akkurat-Bold';
}

a[href]{
    color: var(--medium-blue);
}

ul{
    list-style-type: ">> ";
    padding-left: 20px;
}

li::marker{
    color: var(--medium-blue);
    font-weight: bold;
}

section {
    display: block;
    margin: 0;
    /*padding: 40px 0;*/  
}

h1{
    font-size: 22pt;
    line-height: 24pt;
}

.d-flex{
    display: flex;
}

.flex-column{
    flex-direction: column;
}

.justify-content-center{
    justify-content: center;
}

.align-items-center{
    align-items: center;
}

.text-center{
    text-align: center;
}

.gradient-background {
    background: linear-gradient(to bottom, #3c4f79 0%, #31466f 50%, #182637 100%);
}

.inline-block{
    display: inline-block;
}

.white-background-header{
    background-color: var(--white);
    padding: 10px 10px 3px 10px;
}

/* Section 1 Styles */
#section1{
    padding-top: 190px;
    background-color: var(--dark-blue);
    color: var(--white);
}

#section1 p{
    margin-top: 20px;
    width: 460px;
    font-size: 25.75px;
    line-height: 33.1px;
    color: var(--white);
}

.date-box {
    padding-bottom: 0px;
}

.date-text {
    color: var(--medium-blue);
    font-size: 20px;
    padding-bottom: 0px;
    line-height: 20px;
    vertical-align: bottom;
}

.title-box {
    background-color: var(--white);
    padding: 0px 10px 0px 10px;
}

.title-bold {
    color: var(--dark-blue);
    font-size: 43pt;
    line-height: 45pt;
    font-family: 'Akkurat-Bold';
}

.title-light {
    color: var(--dark-blue);
    font-size: 43pt;
    line-height: 45pt;
    font-family: 'Akkurat-Light';
}

.subtitle-text {
    color: var(--medium-blue);
    font-size: 20px;
    padding: 0px 10px 3px 10px;
}

.section1-flex-container {
    margin-top: 60px;
    padding-bottom: 20px;
}

.section1-button-img {
    padding-right: 20px;
}

.section1-list li {
    margin-top: 10px;
}

.list-arrow {
    color: var(--medium-blue) !important;
}

.section1-right-column {
    flex-direction: column;
    justify-content: space-between;
    max-width: 300px;
    padding-top: 25px;
}

.section1-top-img {
    width: 100%;
}

.logo-container {
    justify-content: center;
    background-color: var(--white);
    padding: 6px 10px 3px 10px;
    margin-top: 100px;
}

.meduni-logo {
    max-width: 185px;
}

/* Section 2 Styles */
#section2{
    background-color: var(--light-blue);
    padding-top: 120px;
    padding-bottom: 100px;
    color: var(--dark-blue);
}

#section2 p{
    margin-top: 25px;
}

.section2-header-box {
    background-color: var(--white);
    padding: 10px 10px 3px 10px;
}

.section2-header-text {
    color: var(--medium-blue);
    font-size: 20pt;
    line-height: 22pt;
}

.section2-bold-text {
    margin-top: 20px;
    font-size: 20px;
}

.section2-flex-container {
    margin-top: 25px;
    align-items: center;
}

.section2-left-column {
    width: 60%;
}

.section2-list {
    margin-bottom: 40px;
    font-size: 18px;
}

.section2-list li {
    margin-top: 10px;
}

.section2-right-column {
    width: 40%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.section2-pdf-image {
    width: 60%;
    transform: rotate(10deg);
}

.section2-subheader {
    margin-top: 20px;
}

/* Section 3 Styles */
#section3{
    background-color: var(--dark-blue);
    color: var(--white);
}

.section3-team-info {
    padding: 30px 0px 30px 0px;
}

.section3-rotated-header {
    transform: rotate(-10deg);
}

.section3-header1-text {
    color: var(--dark-blue);
}

.section3-header2-text {
    color: var(--medium-blue);
    margin-left: 25px;
    transform: translateY(-1px);
}

.section3-main-text {
    margin-top: 120px;
}

.section3-paragraph {
    margin-top: 30px;
}


.section3-advantages-box {
    margin-top: 50px;
}

.section3-advantages-text {
    color: var(--dark-blue);
}

.section3-advantages-subtitle {
    color: var(--medium-blue);
    font-size: 20px;
    padding: 0px 10px 3px 10px;
}

.section-3-advantages-text{
    margin-top: 20px;
}

.section3-list li:not(:first-child) {
    margin-top: 10px;
}

.section3-left-column {
    width: 67%;
}

.section3-right-column {
    width: 33%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.section3-folder-image {
    margin-top: 50px;
    width: 60%;
    transform: rotate(10deg);
    border: 2px solid white;
}

.section3-folder-text {
    margin-top: 20px;
}

/* Accordion Styles */
.accordion {
    margin-top: 50px;
    color: var(--dark-blue);
    padding-bottom: 50px;
}

.accordion-item {
    margin-bottom: 10px;
    overflow: hidden;
}

.accordion-item:last-child {
    margin-bottom: 0px;
}

.accordion-header {
    background-color: #f8f9fa;
    padding: 15px 20px 10px 20px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s ease;
    border-radius: 5px;
    font-family: 'Akkurat-Bold';
}

.accordion-header:hover {
    background-color: #e9ecef;
}

.accordion-header span a {
    color: var(--medium-blue);
}

.accordion-icon {
    font-size: 20px;
    font-weight: bold;
    transition: transform 0.3s ease;
}

.accordion-content {
    max-height: 0;
    margin: 10px 0px 0px 0px;
    overflow: hidden;
    transition: max-height 0.3s ease;
    background-color: #fff;
    border-radius: 5px;
}

.accordion-content p {
    /*padding: 20px;*/
    margin: 0px;
}

.accordion-item.active .accordion-content {
    padding: 20px;
    max-height: 550px;
    overflow: auto;
}

.accordion-item.active .accordion-icon {
    transform: rotate(180deg);
}

/* Section 4 Styles */
.section4-main {
    background-color: var(--light-blue);
    padding: 50px 0px;
    color: var(--dark-blue);
}

.section4-header1-text {
    color: var(--dark-blue);
    font-size: 25px;
}

.section4-header2-box {
    margin-top: 50px;
}

.section4-header2-text {
    color: var(--medium-blue);
    font-size: 25px;
}

.section4-action-weeks-box {
    background-color: var(--white);
    padding: 10px 10px 3px 10px;
}

.section4-action-weeks-text {
    color: var(--dark-blue);
    font-size: 25px;
}

.section4-date-box {
    background-color: var(--white);
    padding: 10px 10px 3px 10px;
}

.section4-date-text {
    color: var(--medium-blue);
    font-size: 20px;
}

.section4-paragraph {
    margin-top: 50px;
}

/* Section 5 Styles */
.section5-main {
    background-color: var(--dark-blue);
    padding-top: 50px;
    color: var(--white);
}

.section5-main p{
    font-size: 15px;
    line-height: 18px;
}

.section5-paragraph {
    margin-top: 20px;
}

.section5-header-box {
    background-color: var(--white);
    padding: 10px 10px 3px 10px;
}

.section5-header-text {
    color: var(--dark-blue);
    font-size: 25px;
}

.section5-footer-flex {
    align-items: end;
}

.section5-footer-column {
    width: 33%;
    padding: 30px;
}

.section5-footer-image {
    width: 100%;
}

/* General utility classes */
.text-white {
    color: var(--white);
}

.text-light-blue {
    color: var(--medium-blue);
}

.text-medium-blue {
    color: var(--medium-blue);
}

.text-dark-blue {
    color: var(--dark-blue);
}

.bg-white {
    background-color: var(--white);
}

.bg-light-blue {
    background-color: var(--light-blue);
}

.bg-dark-blue {
    background-color: var(--dark-blue);
}

.font-bold {
    font-weight: bold;
}

.font-akkurat-bold {
    font-family: 'Akkurat-Bold';
}

.font-akkurat-light {
    font-family: 'Akkurat-Light';
}

.margin-top-20 {
    margin-top: 20px;
}

.margin-top-30 {
    margin-top: 30px;
}

.margin-top-50 {
    margin-top: 50px;
}

.margin-top-80 {
    margin-top: 80px;
}

.margin-top-100 {
    margin-top: 100px;
}

.padding-10 {
    padding: 10px;
}

.flex-column {
    flex-direction: column;
}

.justify-center {
    justify-content: center;
}

.justify-space-between {
    justify-content: space-between;
}

.align-baseline {
    align-items: baseline;
}

.transform-rotate-10 {
    transform: rotate(10deg);
}

.transform-rotate-neg-10 {
    transform: rotate(-10deg);
}

.w-33 {
    width: 33%;
}

.w-40 {
    width: 40%;
}

.w-60 {
    width: 60%;
}

.w-67 {
    width: 67%;
}

.w-100 {
    width: 100%;
}

.max-w-100px {
    max-width: 100px;
}

.max-w-40 {
    max-width: 40%;
}

.max-w-60 {
    max-width: 60%;
}

.border-white-2 {
    border: 2px solid white;
}

.text-center {
    text-align: center;
}

.ml-auto-mr-auto {
    margin-left: auto;
    margin-right: auto;
}

/* Mobile Responsive Styles */
@media (max-width: 730px) {
    #section1 .container > .d-flex {
        flex-direction: column;
    }
    
    .section1-right-column {
        margin-top: 30px;
    }
    
    .logo-container {
        margin-top: 30px;
    }
    
    #section1 p {
        width: 100%;
        font-size: 20px;
        line-height: 26px;
    }

    .section5-footer-flex{
        flex-direction: column;
    }

    .section5-footer-column{
        width: auto;
    }
}