body{
  margin: 0;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

/* BİRİNCİ BÖLÜM */

.birinci-bolum strong {
    font-size: 40px;
    font-weight: 600;
}
.birinci-bolum {
    display: flex;
    flex-direction: column;
    gap: 15px;
    max-width: 1214px;
    margin: 0 auto;
    align-items: center;
}

.ikinci-bolum span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
}
.ikinci-bolum {
    display: flex;
    flex-direction: column;
    gap: 30px;
    max-width: 1214px;
    margin: 0 auto;
    padding: 40px 0px;
}

.ucuncu-bolum .sol strong {
    font-size: 26px;
    font-weight: 600;
}
.ucuncu-bolum .sol span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
    text-align: justify;
}
.ucuncu-bolum .sol {
    max-width: 587px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.ucuncu-bolum img {
    max-width: 587px;
}
.ucuncu-bolum {
    display: flex;
    flex-direction: row;
    gap: 40px;
    padding: 40px 0px;
    max-width: 1214px;
    margin: 0 auto;
}

.dorduncu-bolum strong {
    font-size: 26px;
}
.dorduncu-bolum .bir-st {
    font-weight: 600;
}
.dorduncu-bolum .iki-st {
    font-weight: 400;
}
.dorduncu-bolum .baslik {
    display: flex;
    flex-direction: row;
    gap: 5px;
}
.dorduncu-bolum span {
    font-size: 20px;
}
.dorduncu-bolum .bir-sp {
    font-weight: 600;
}
.dorduncu-bolum .iki-sp {
    font-weight: 400;
    max-width: 100%;
    text-align: justify;
}
.dorduncu-bolum .yazilar {
    display: flex;
    flex-direction: column;
    gap: 15px;
    max-width: 100%;
}
.dorduncu-bolum {
    display: flex;
    flex-direction: column;
    gap: 25px;
    padding: 40px 0px;
    max-width: 1214px;
    margin: 0 auto;
}

.besinci-bolum img {
    max-width: 378px;
}
.besinci-bolum {
    display: flex;
    flex-direction: row;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
    padding-top: 40px;
}

.altinci-bolum img {
    max-width: 378px;
}
.altinci-bolum strong {
    font-size: 26px;
}
.altinci-bolum strong:nth-child(1) {
    font-weight: 600;
}
.altinci-bolum strong:nth-child(2) {
    font-weight: 400;
}
.altinci-bolum .baslik {
    display: flex;
    flex-direction: row;
}
.altinci-bolum .sag span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    text-align: justify;
}
.altinci-bolum .sag {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.altinci-bolum {
    display: flex;
    flex-direction: row;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
    padding: 60px 0px;
}

.yedinci-bolum img {
    width: 100%;
}
.yedinci-bolum strong {
    font-size: 26px;
}
.yedinci-bolum strong:nth-child(1) {
    font-weight: 600;
}
.yedinci-bolum strong:nth-child(2) {
    font-weight: 400;
}
.yedinci-bolum .baslik-sp {
    font-size: 26px !important;
}
.yedinci-bolum .kart span {
    font-size: 20px;
    font-weight: 400;
    text-align: justify;
}
.yedinci-bolum .kart .yazilar {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.yedinci-bolum .kart a {
    font-weight: 600;
    color: #0056BF;
}
.yedinci-bolum .kart{
    max-width: 378px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.yedinci-bolum {
    display: flex;
    flex-direction: row;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
    padding-bottom: 60px;
}

.sekizinci-bolum img {
    max-width: 1214px;
    margin: 0 auto;
}

.dokuzuncu-bolum .sol .yazilar strong:nth-child(1) {
    font-size: 26px;
    font-weight: 600;
}
.dokuzuncu-bolum .sol .yazilar strong:nth-child(2) {
    font-size: 26px;
    font-weight: 400;
    font-style: italic;
}
.dokuzuncu-bolum .sol .yazilar strong:nth-child(3) {
    font-size: 22px;
    font-weight: 400;
}
.dokuzuncu-bolum .sol .yazilar span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
}
.dokuzuncu-bolum .sol .yazilar {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}
.dokuzuncu-bolum .sol .opsionel {
    font-size: 20px;
    font-weight: 400;
    font-style: italic;
}
.dokuzuncu-bolum .sol {
    display: flex;
    flex-direction: column;
    gap: 50px;
    max-width: 587px;
}
.dokuzuncu-bolum {
    display: flex;
    flex-direction: row;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
    padding: 40px 0px;
}

.onuncu-bolum .kart img,
.onbir .kart img {
    width: 100%;
}
.onuncu-bolum .kart .yazilar strong,
.onbir .kart .yazilar strong {
    font-size: 25px;
    font-weight: 600;
    width: 100%;
    display: block;
    text-align: center;
}
.onuncu-bolum .kart .yazilar span,
.onbir .kart .yazilar span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
    text-align: justify;
}
.onuncu-bolum .kart .yazilar,
.onbir .kart .yazilar {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.onuncu-bolum .kart,
.onbir .kart {
    max-width: 378px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.onuncu-bolum {
    max-width: 1214px;
    display: flex;
    flex-direction: row;
    gap: 40px;
    padding: 40px 0px;
    margin: 0 auto;
}
.onbir {
    max-width: 1214px;
    display: flex;
    flex-direction: row;
    gap: 40px;
    margin: 0 auto;
}

.oniki .kart img {
    width: 100%;
}
.oniki .kart span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
    text-align: center;
}
.oniki .kart {
    max-width: 587px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.oniki {
    display: flex;
    flex-direction: row;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
    padding: 40px 0px;
}

.onuc .kart img {
    width: 100%;
}
.onuc .kart span {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
    text-align: center;
}
.onuc .kart {
    max-width: 378px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.onuc {
    display: flex;
    flex-direction: row;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
}

.ondort img {
    width: 100%;
}
.ondort div img {
    max-width: 587px;
}
.ondort div {
    display: flex;
    flex-direction: row;
    gap: 40px;
    width: 100%;
}
.ondort {
    display: flex;
    flex-direction: column;
    gap: 40px;
    max-width: 1214px;
    margin: 0 auto;
    padding: 40px 0px;
}

.onbes strong {
    font-size: 26px;
    font-weight: 600;
}
.onbes div a {
    font-size: 20px;
    font-weight: 400;
    width: 100%;
    display: block;
    padding: 14px 20px;
    background-color: #F2EDE0;
    border: 1px solid #00000050;
}
.onbes div {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.onbes {
    display: flex;
    flex-direction: column;
    gap: 30px;
    max-width: 1214px;
    margin: 0 auto;
    padding: 40px 0px;
}

/* MOBİL UYUM */

@media (max-width: 1253px) {
    body {
        overflow-x: hidden;
    }

    /* BİRİNCİ BÖLÜM */
    .birinci-bolum {
        padding: 0 20px;
        box-sizing: border-box;
    }
    .birinci-bolum strong {
        font-size: 30px;
    }
    .birinci-bolum iframe {
        width: 100%;
        height: auto;
        aspect-ratio: 1214 / 683;
    }

    /* İKİNCİ BÖLÜM */
    .ikinci-bolum {
        padding: 40px 20px;
        box-sizing: border-box;
    }

    /* ÜÇÜNCÜ BÖLÜM */
    .ucuncu-bolum {
        flex-direction: column;
        gap: 20px;
        padding: 0 20px;
        box-sizing: border-box;
    }
    .ucuncu-bolum .sol {
        max-width: 100%;
    }
    .ucuncu-bolum img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }

    /* DÖRDÜNCÜ BÖLÜM */
    .dorduncu-bolum {
        padding: 40px 20px;
        box-sizing: border-box;
    }
    .dorduncu-bolum .baslik {
        flex-wrap: wrap;
    }

    /* BEŞİNCİ BÖLÜM */
    .besinci-bolum {
        flex-direction: column;
        gap: 20px;
        padding: 40px 20px;
        box-sizing: border-box;
    }
    .besinci-bolum img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }

    /* ALTINCI BÖLÜM */
    .altinci-bolum {
        flex-direction: column;
        gap: 20px;
        padding: 40px 20px;
        box-sizing: border-box;
    }
    .altinci-bolum img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
    .altinci-bolum .baslik {
        flex-wrap: wrap;
    }

    /* YEDİNCİ BÖLÜM */
    .yedinci-bolum {
        flex-direction: column;
        gap: 30px;
        padding: 0 20px 40px;
        box-sizing: border-box;
    }
    .yedinci-bolum .kart {
        max-width: 100%;
    }

    /* SEKİZİNCİ BÖLÜM */
    .sekizinci-bolum {
        padding: 0 20px;
        box-sizing: border-box;
    }
    .sekizinci-bolum img {
        max-width: 100%;
        width: 100%;
        height: auto;
        margin: 0;
    }

    /* DOKUZUNCU BÖLÜM */
    .dokuzuncu-bolum {
        flex-direction: column;
        gap: 20px;
        padding: 40px 20px;
        box-sizing: border-box;
    }
    .dokuzuncu-bolum .sol {
        max-width: 100%;
    }
    .dokuzuncu-bolum iframe {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    /* ONUNCU BÖLÜM & ONBİR */
    .onuncu-bolum,
    .onbir {
        flex-direction: column;
        gap: 30px;
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }
    .onuncu-bolum .kart,
    .onbir .kart {
        max-width: 100%;
    }

    /* ONİKİ */
    .oniki {
        flex-direction: column;
        gap: 20px;
        padding: 40px 20px;
        box-sizing: border-box;
    }
    .oniki .kart {
        max-width: 100%;
    }

    /* ONÜÇ */
    .onuc {
        flex-direction: column;
        gap: 20px;
        padding: 0 20px;
        box-sizing: border-box;
    }
    .onuc .kart {
        max-width: 100%;
    }

    /* ONDÖRT */
    .ondort {
        padding: 40px 20px;
        box-sizing: border-box;
    }
    .ondort div {
        flex-direction: row;
        gap: 20px;
    }
    .ondort div img {
        max-width:calc(50% - 10px);
    }

    /* ONBEŞ */
    .onbes {
        padding: 40px 20px;
        box-sizing: border-box;
    }
}

@media (max-width: 600px) {
    .birinci-bolum strong {
        font-size: 24px;
    }
    .ikinci-bolum span {
        font-size: 16px;
    }
    .ucuncu-bolum .sol strong {
        font-size: 22px;
    }
    .ucuncu-bolum .sol span {
        font-size: 16px;
    }
    .dorduncu-bolum strong {
        font-size: 22px;
    }
    .dorduncu-bolum span {
        font-size: 16px;
    }
    .altinci-bolum strong {
        font-size: 22px;
    }
    .altinci-bolum .sag span {
        font-size: 16px;
    }
    .yedinci-bolum strong {
        font-size: 22px;
    }
    .yedinci-bolum .baslik-sp {
        font-size: 22px !important;
    }
    .yedinci-bolum .kart span {
        font-size: 16px;
    }
    .dokuzuncu-bolum .sol .yazilar strong:nth-child(1),
    .dokuzuncu-bolum .sol .yazilar strong:nth-child(2) {
        font-size: 22px;
    }
    .dokuzuncu-bolum .sol .yazilar strong:nth-child(3) {
        font-size: 18px;
    }
    .dokuzuncu-bolum .sol .yazilar span {
        font-size: 16px;
    }
    .dokuzuncu-bolum .sol .opsionel {
        font-size: 16px;
    }
    .onuncu-bolum .kart .yazilar strong,
    .onbir .kart .yazilar strong {
        font-size: 22px;
    }
    .onuncu-bolum .kart .yazilar span,
    .onbir .kart .yazilar span {
        font-size: 16px;
    }
    .oniki .kart span {
        font-size: 16px;
    }
    .onuc .kart span {
        font-size: 16px;
    }
    .onbes strong {
        font-size: 22px;
    }
    .onbes div a {
        font-size: 16px;
    }
    .ondort div{
        flex-direction: column;
        gap: 40px;
    }
    .ondort div img{
        max-width: 100%;
    }
}