* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

*:not(i) {
    font-family: "Konnect", sans-serif !important;
}

html {
    overflow-x: hidden !important;
}

body {
    padding: 0;
    margin: 0;
    overflow-x: unset;
    background-color: #f8fafc;
}

.page {
    padding-top: 0;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    position: relative;
}
.page > main {
    position: relative;
    z-index: 1;
    flex: 1 0 auto;
}

body button {
    background-color: unset;
    border: unset;
    transition: all .4s ease-in-out;
}

body a {
    text-decoration: unset;
    color: inherit;
    transition: all .4s ease-in-out;
}

body svg {
    transition: all .4s ease-in-out;
}

body a:hover,
body button:hover {
    transition: all .4s ease-in-out;
}

body li {
    list-style: none;
}

body ul {
    padding-left: 0;
    margin-bottom: 0;
}

body img {
    width: 100%;
    display: block;
    position: relative;
}

body p {
    font-size: 16px;
    margin: 0;
}

input:focus,
textarea:focus,
select:focus {
    outline: 0 !important;
}

input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 0 !important;
}

body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .title {
    font-family: "Matteo", sans-serif !important;
}



/** START HEADER **/

.metro-header {
    border-bottom: 1px solid #D0D0D0;
}

.metro-header .metro-head-main::before {
    content: "";
    background: #fff;
    background: -moz-linear-gradient(180deg, #ffffff 0%, #ffffff00 100%);
    background: -webkit-linear-gradient(180deg, #ffffff 0%, #ffffff00 100%);
    background: linear-gradient(180deg, #ffffff 0%, #ffffff00 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.metro-header .metro-head-main {
    position: relative;
    padding: 25px 0;
}

.metro-header .metro-head-main .metro-head-main-group {
    display: flex;
    align-items: center;
    position: relative;
}

.metro-header .metro-head-main .metro-head-main-group .head-col {
    flex: 1;
}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-nav {
    flex: 3;
}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-menus {}

.metro-header .metro-head-main .metro-head-main-group .head-col .menu-group {}

.metro-header .metro-head-main .metro-head-main-group .head-col .menu-group ul {
    display: flex;
    gap: 26px;
    align-items: center;
}

.metro-header .metro-head-main .metro-head-main-group .head-col .menu-group ul li {}

.metro-header .metro-head-main .metro-head-main-group .head-col .menu-group ul li a:not(.problem-action) {
    color: #092857;
    font-size: 16px;
    font-weight: 400;
}

.metro-header .metro-head-main .metro-head-main-group .head-col .menu-group ul li a.problem-action {}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-logos {}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-logos .logo {
    display: flex;
    justify-content: center;
}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-logos .logo a {
    display: inline-block;
}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-logos .logo img {
    width: 375px;
}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-logos+.head-menus ul {
    justify-content: flex-end;
}

.metro-header .metro-head-main .metro-head-main-group .head-col.head-mobil {
    display: flex;
    justify-content: flex-end;
}

.metro-linear {
    position: absolute;
    top: 0;
    z-index: -1;
    left: 0;
    width: 100%;
}

.metro-linear img {}

.metro-linear::before {
    content: "";
    background: #fff;
    background: -moz-linear-gradient(180deg, #ffffff59 0%, #FFFFFF 100%);
    background: -webkit-linear-gradient(180deg, #ffffff59 0%, #FFFFFF 100%);
    background: linear-gradient(180deg, #ffffff59 0%, #FFFFFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

/** END HEADER **/

@media (min-width: 992px) and (max-width: 1200px) {
    .metro-header .metro-head-main .metro-head-main-group .head-col.head-nav .menu-group ul {
        gap: 16px;
    }

    .metro-header .metro-head-main .metro-head-main-group .head-col.head-logos .logo img {
        width: 280px;
        max-width: 30vw;
    }
}

/** START HERO **/

.metro-hero {
    /* background: linear-gradient(180deg, #fcfdff 0%, #f6f9fc 50%, #f5f8fb 100%); */
}

.metro-hero .metro-hero-container {
    position: relative;
}

.metro-hero .metro-hero-container::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 70px;
    width: 30%;
    height: 87%;
    border: 1px solid #D0D0D0;
    border-right: 0;
    border-top: 0;
    border-radius: 0 0 0 50px;
    z-index: -1;
}

.metro-hero .metro-hero-container::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 70px;
    width: 30%;
    height: 68%;
    border: 1px solid #D0D0D0;
    border-left: 0;
    border-top: 0;
    border-radius: 0 0 50px 0;
    z-index: -1;
}

.metro-hero .metro-hero-container .metro-hero-wrapper {
    display: flex;
    justify-content: center;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card {
    text-align: center;
    width: 60%;
    padding: 75px 0 0;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-head {
    margin: 0 0 50px;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-head .metro-head {
    display: block;
}

.metro-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.metro-head .subtitle {
    color: #DA262E;
    font-family: "Konnect", sans-serif !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
}

.metro-head h2 {
    font-size: 35px;
    color: #092857;
    font-weight: 600;
    line-height: 1;
}

.metro-head h2 span {
    font-weight: 300;
    border-bottom: 3px solid #092857;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .metro-head .subtitle {}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .metro-head h2 {
    font-size: 40px;
    line-height: 40px;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .metro-head h2 span {
    display: block;
    color: #092857bf;
    font-size: 30px;
    font-weight: 400;
    border: unset;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body {}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .metro-hero-search {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .metro-hero-search.search-active {
    z-index: 999;
    position: relative;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .metro-hero-search.search-active .search-card {
    background-color: #fff;
    border: unset;
    border-radius: 25px 25px 0 0;
    border-bottom: 1px solid #0928571a;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .metro-hero-search.search-active .search-result {}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .metro-hero-search .search-card {
    width: 90%;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .metro-hero-search .search-result {
    width: 90%;
    display: none;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .search-most {
    margin: 15px 0 0;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .search-most .search-most-group {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .search-most .search-most-group .label {
    color: #092857;
    font-size: 13px;
    font-weight: 300;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .search-most .search-most-group .group-list {
    display: flex;
    align-items: center;
    gap: 10px;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-body .search-most .search-most-group .group-list a {
    font-size: 12px;
    color: #092857;
    border: 1px solid #1457BD;
    line-height: 1;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    border-radius: 30px;
    background-color: #ffffff66;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot {}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes {
    margin: 50px 0 0;
    position: relative;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 70px;
    background-color: #D0D0D0;
    width: 100%;
    height: 1px;
    z-index: -1;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes .row {}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes .boxes-card {
    background-color: #fff;
    border: 1px solid #D0D0D0;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px 10px 10px;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes .boxes-card .icon {
    background-color: #1458bd0d;
    width: 45px;
    height: 45px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 10px;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes .boxes-card .icon i {
    color: #DA262E;
    font-size: 24px;
    line-height: 1;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes .boxes-card h3 {
    font-size: 16px;
    color: #092857;
    font-weight: 500;
    font-family: "Konnect", sans-serif !important;
}

.metro-hero .metro-hero-container .metro-hero-wrapper .metro-hero-card .card-foot .metro-search-boxes .boxes-card p {
    color: #09295880;
    font-size: 12px;
    font-weight: 300;
    height: 40px;
}

.metro-hero .metro-hero-container .metro-hero-shapes {}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item {
    position: absolute;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item.left {
    top: 150px;
    left: 100px;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item.left::before {
    content: "";
    height: 150px;
    width: 100px;
    position: absolute;
    border: 1px solid #D0D0D0;
    border-left: 0;
    border-bottom: 0;
    border-radius: 0 50px 0 0;
    bottom: 100%;
    right: 48px;
    transform: translate(0, -1px);
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item.right {
    top: 250px;
    right: 80px;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item.right::before {
    content: "";
    height: 150px;
    width: 10000%;
    position: absolute;
    border: 1px solid #D0D0D0;
    border-right: 0;
    border-bottom: 0;
    border-radius: 50px 0 0 0;
    bottom: 100%;
    left: 48px;
    transform: translate(0, -1px);
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item .shapes-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item .shapes-box .icon {
    position: relative;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item .shapes-box .icon::before {
    content: "";
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: rotate(45deg);
    border-radius: 15px;
    border: 1px solid #D0D0D0;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item .shapes-box .icon i {
    position: relative;
    z-index: 1;
    color: #DA262E;
    font-size: 32px;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item .shapes-box .title {
    font-family: "Konnect", sans-serif !important;
    font-weight: 500;
    font-size: 15px;
    color: #092857;
}

.metro-hero .metro-hero-container .metro-hero-shapes .shapes-item .shapes-box .title span {
    font-weight: 300;
}

/** END HERO **/



/** START COURSES **/

.metro-courses {
    margin: 100px 0 0;
    position: relative;
}

.metro-courses::before {
    content: "";
    position: absolute;
    bottom: 70px;
    left: 0;
    width: 100%;
    height: 100px;
    border: 1px solid #D0D0D0;
    z-index: -1;
    border-top: unset;
    border-radius: 0 0 50px 50px;
}

.metro-courses .metro-head {
    margin: 0 0 50px;
}

.metro-courses .metro-head a {
    background-color: #fff;
    color: #092857;
    box-shadow: -1px 1px 14px 0px rgb(9 40 87 / 6%);
    -webkit-box-shadow: -1px 1px 14px 0px rgb(9 40 87 / 6%);
    -moz-box-shadow: -1px 1px 14px 0px rgb(9 40 87 / 6%);
}

.metro-courses .metro-head a i {
    color: #092857;
}

.metro-courses .metro-head a::before {
    background: #092857;
    background: -moz-linear-gradient(90deg, #1457bd00 0%, #1457bd1f 100%);
    background: -webkit-linear-gradient(90deg, #1457bd00 0%, #1457bd1f 100%);
    background: linear-gradient(90deg, #1457bd00 0%, #1457bd1f 100%);
}

.metro-courses .metro-courses-wrapper {}

.metro-courses .metro-courses-slider {}

.swiper.swiper-courses .swiper-wrapper,
.swiper.swiper-courses-docs .swiper-wrapper {
    align-items: stretch;
}

.swiper.swiper-courses .swiper-slide,
.swiper.swiper-courses-docs .swiper-slide {
    display: flex;
    height: auto;
    box-sizing: border-box;
}

.courses-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.courses-card .card-content {
    line-height: 1;
    padding: 0 0 15px;
    flex: 0 0 auto;
}

.courses-card .card-content .card-category {
    color: #9A9A9A;
    font-size: 13px;
    font-weight: 400;
    margin-bottom: 4px;
}

.courses-card .card-content h3 {
    font-family: "Konnect", sans-serif !important;
    font-size: 18px;
    color: #092857;
    font-weight: 400;
    margin: 0 0 10px;
}

/* Anasayfa slider: kartlar aynı hizada; başlık alanı sabit yükseklik */
.metro-courses .courses-card .card-content h3,
.metro-courses-documents .courses-card .card-content h3 {
    line-height: 1.35;
    min-height: 2.7em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.courses-card .card-content .card-sub {
    display: flex;
    justify-content: space-between;
}

.courses-card .card-content .card-sub .sub-item {
    color: #9A9A9A;
    font-size: 14px;
    font-weight: 300;
    display: flex;
    align-items: center;
    gap: 5px;
}

.courses-card .card-content .card-sub .sub-item.lesson {}

.courses-card .card-content .card-sub .sub-item i {
    color: #DA262E;
    font-size: 16px;
    line-height: 1;
}

.courses-card .card-content .card-sub .sub-item span {}

.courses-card .card-content .card-sub .sub-item.price {
    color: #DA262E;
    font-weight: 500;
}

.courses-card .card-content .card-sub .sub-item.price i {}

.courses-card .card-image {
    border: 1px solid #D0D0D0;
    border-radius: 25px;
    overflow: hidden;
    padding: 15px;
    background-color: #fff;
    margin-top: auto;
    flex: 0 0 auto;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.courses-card .card-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/** END COURSES **/



/** START INFORMATION **/

.metro-information {
    background-color: #1457bd0d;
    margin: 100px 0 0;
}

.metro-information .metro-information-wrapper {}

.metro-information .metro-information-wrapper .information-slider {
    position: relative;
    padding: 15px 0 0;
}

.metro-information .metro-information-wrapper .information-slider .info-bg {
    content: "";
    width: 34%;
    height: 100%;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0);
    background-color: #fff;
    z-index: 0;
    border-radius: 30px 30px 0 0;
}

.metro-information .metro-information-wrapper .information-slider .info-bg::before {
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
    bottom: -1px;
    right: 100%;
    box-shadow: 15px 0 0 0 #fff;
    border-bottom-right-radius: 30px;
}

.metro-information .metro-information-wrapper .information-slider .info-bg::after {
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
    bottom: -1px;
    left: 100%;
    box-shadow: -15px 0 0 0 #fff;
    border-bottom-left-radius: 30px;
}

.information-head {
    align-items: center;
    margin: 0 0 75px;
    justify-content: space-around;
}

.information-head .head-navigation {
    height: fit-content;
    position: relative;
    top: 40px;
}

/* Oklar başlık/orta içeriğin altında kalıp tıklanmasın diye */
.information-head .head-navigation-bilgi {
    z-index: 4;
}
.information-head .head-center {
    position: relative;
    z-index: 1;
}
.information-head .navigation-button {
    z-index: 1;
    cursor: pointer;
}

.information-head .navigation-button.prev::before,
.information-head .navigation-button.next::before {
    background-color: #DA262E;
}

.information-head .navigation-button i {}

.information-head .head-center {}

.information-head .head-center .head-logos {
    display: flex;
    background-color: #fff;
    padding: 15px 25px;
    border-radius: 0 0 30px 30px;
    position: relative;
    margin: 0 0 30px;
}

.information-head .head-center .head-logos:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 20px;
    top: -1px;
    right: 100%;
    box-shadow: 15px 0 0 0 #fff;
    border-top-right-radius: 20px;
}

.information-head .head-center .head-logos:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 20px;
    top: -1px;
    left: 100%;
    box-shadow: -15px 0 0 0 #fff;
    border-top-left-radius: 20px;
}

.information-head .head-center .head-logos img {
    height: 35px;
    width: auto;
}

.information-head .head-center .head-logos img:not(:last-child) {
    border-right: 1px solid #E6E6E6;
    margin-right: 15px;
    padding-right: 15px;
}

.information-head .head-center h2 {
    text-align: center;
}

.information-head .head-center h2 span {}

.metro-kvkk-events .swiper-slide {
    height: auto;
    display: flex;
}
.metro-kvkk-events .information-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
.metro-kvkk-events .information-card .card-image {
    height: 220px;
    overflow: hidden;
    border-radius: 25px;
    margin: 0 0 20px;
    flex-shrink: 0;
}
.metro-kvkk-events .information-card .card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 25px;
    display: block;
}
.metro-kvkk-events .information-card .card-content {
    height: auto;
    min-height: 140px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.metro-kvkk-events .information-card .card-content h3 {
    line-height: 1.4;
    margin-bottom: 16px;
}
.metro-kvkk-events .information-card .card-content .date {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: linear-gradient(135deg, #f8f9fa 0%, #f0f2f5 100%);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: #5a6c7d;
}
.metro-kvkk-events .information-card .card-content .date i {
    margin-right: 6px;
    color: #c41e3a;
    font-size: 14px;
}

.metro-kvkk-events .kvkk-all-link {
    display: inline-block;
    margin-top: 10px;
    font-size: 14px;
    color: #c41e3a;
    font-weight: 600;
}
.metro-kvkk-events .kvkk-all-link:hover {
    color: #a01830;
}
.metro-kvkk-events .kvkk-all-link i {
    font-size: 12px;
    margin-left: 4px;
}

.swiper.swiper-information {
    position: relative;
    z-index: 9;
}

/* Swiper 12: slide height:100% üst konteyner yüksekliği olmayınca içerik görünmez; autoHeight ile uyum */
.metro-information-bilgi .swiper-information.swiper-autoheight .swiper-slide {
    height: auto;
}
.metro-information-bilgi .swiper-information.swiper-autoheight .swiper-wrapper {
    align-items: stretch;
}

.swiper.swiper-information .swiper-slide {}

.swiper.swiper-information .swiper-slide.swiper-slide-next {}

.swiper.swiper-information .swiper-slide.swiper-slide-next .information-card {}

.information-card {}

.information-card .card-image {
    display: block;
    margin: 0 0 20px;
}

.information-card .card-image img {
    border-radius: 25px;
}

/* Bilgi Güvenliği slider: BGYS dokümanı (gradient + ikon, /bilgi-guvenligi ile aynı son 3 kayıt) */
.metro-information-bilgi .information-card .card-image .information-slider-thumb.bg-card-icon {
    border-radius: 25px;
    height: 160px;
}
.metro-information-bilgi .information-card .card-image .information-slider-thumb.bg-card-icon i {
    font-size: 3rem;
}
.information-card .card-content {
    height: 140px;
}

.metro-information-bilgi .information-card .card-content.information-card-bgys-body {
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.metro-information-bilgi .information-card .card-content.information-card-bgys-body h3 {
    margin: 0 0 4px;
}
.metro-information-bilgi .information-card .information-card-bgys-cta {
    margin-top: 0;
}
.metro-information-bilgi .information-card:hover .bg-card-link {
    gap: 10px;
}

.information-card .card-content .date {
    color: #9A9A9A;
    font-size: 13px;
    font-weight: 300;
    margin-bottom: 8px;
}
.information-card .card-content .date i {
    color: #DA262E;
    margin-right: 4px;
}
.information-card .card-content h3 {
    color: #092857;
    font-family: "Konnect", sans-serif !important;
    font-size: 20px;
    margin: 0 0 20px;
}

.information-card .card-content .metro-button {
    width: fit-content;
    background-color: #DA262E;
    height: 45px;
}

.information-card .card-content .metro-button::before {
    background: #fff;
    background: -moz-linear-gradient(90deg, #ffffff00 0%, #ffffff47 100%);
    background: -webkit-linear-gradient(90deg, #ffffff00 0%, #ffffff47 100%);
    background: linear-gradient(90deg, #ffffff00 0%, #ffffff47 100%);
    width: 45px;
    height: 45px;
}

.information-card .card-content .metro-button i {}

/** END INFORMATION **/

/** START BİLGİ GÜVENLİĞİ **/
.sec-bilgi-guvenligi {
    padding: 72px 0 80px;
    background: #fafbfc;
}
.sec-bg-header {
    margin-bottom: 36px;
}
.sec-bg-title {
    font-size: 1.75rem;
    font-weight: 700;
    color: #092857;
    margin: 0 0 6px;
    letter-spacing: -0.02em;
}
.sec-bg-title span {
    color: #1457BD;
    position: relative;
}
.sec-bg-title span::after {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #1457BD 0%, rgba(20,87,189,.3) 100%);
    border-radius: 2px;
}
.sec-bg-sub {
    font-size: 14px;
    color: #64748b;
    margin: 0;
    font-weight: 400;
}
.sec-bg-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}
.sec-bg-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    text-decoration: none;
    color: #334155;
    font-size: 14px;
    font-weight: 500;
    transition: background .2s ease, color .2s ease;
    border-bottom: 1px solid #f1f5f9;
}
.sec-bg-item:last-child { border-bottom: none; }
.sec-bg-item:hover {
    background: #f8fafc;
    color: #092857;
    text-decoration: none;
}
.sec-bg-item.disabled {
    opacity: .5;
    cursor: default;
}
.sec-bg-item.disabled:hover { background: transparent; }
.sec-bg-num {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
    border-radius: 8px;
}
.sec-bg-item:hover .sec-bg-num {
    background: #e0e7ff;
    color: #1457BD;
}
.sec-bg-text {
    flex: 1;
    min-width: 0;
    line-height: 1.4;
}
.sec-bg-cta {
    color: #94a3b8;
    font-size: 20px;
    transition: transform .2s ease, color .2s ease;
}
.sec-bg-item:hover .sec-bg-cta {
    color: #1457BD;
    transform: translateX(4px);
}
.sec-bg-soon {
    font-size: 11px;
    font-weight: 600;
    color: #94a3b8;
    background: #f1f5f9;
    padding: 4px 10px;
    border-radius: 6px;
}
@media (max-width: 767px) {
    .sec-bilgi-guvenligi { padding: 48px 0 56px; }
    .sec-bg-header { margin-bottom: 24px; }
    .sec-bg-title { font-size: 1.45rem; }
    .sec-bg-item { padding: 14px 16px; font-size: 13px; }
}

.sec-bg-list-footer {
    margin-top: 28px;
    display: flex;
    justify-content: center;
}
.sec-bg-btn-all.metro-button {
    min-height: 46px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Bilgi Güvenliği liste sayfası — Uygulamalar ile aynı üst başlık (metro-head page-head) */
.metro-app-page.metro-info-security-page .metro-info-security-page-body {
    max-width: 920px;
    margin: 0 auto;
}

.sec-bg-empty {
    background: #fff;
    border-radius: 16px;
    border: 1px dashed #e2e8f0;
    padding: 3rem 2rem;
    text-align: center;
    color: #64748b;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.sec-bg-empty i {
    font-size: 2.75rem;
    opacity: .4;
    display: block;
    margin-bottom: 1rem;
    color: #1457BD;
}
.sec-bg-empty p {
    margin: 0;
    font-size: 15px;
    font-weight: 400;
}
.page-info-security .metro-posts {
    margin-top: 72px;
    margin-bottom: 60px;
}
/** BİLGİ GÜVENLİĞİ ANASAYFA KARTLARI **/
.sec-bilgi-guvenligi {
    padding: 60px 0 72px;
    background: #fafbfc;
}

.bg-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 36px;
}

/* Kart */
.bg-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 6px rgba(9,40,87,.05), 0 4px 18px rgba(9,40,87,.04);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s;
    position: relative;
}
.bg-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 36px rgba(9,40,87,.13);
    border-color: transparent;
    text-decoration: none;
    color: inherit;
}

/* Renkli üst bant (sabit 140 px yükseklik) */
.bg-card-icon {
    width: 100%;
    height: 140px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}
.bg-card-icon::before {
    content: "";
    position: absolute;
    width: 200px; height: 200px;
    border-radius: 50%;
    background: rgba(255,255,255,.08);
    top: -60px; right: -50px;
}
.bg-card-icon::after {
    content: "";
    position: absolute;
    width: 130px; height: 130px;
    border-radius: 50%;
    background: rgba(255,255,255,.06);
    bottom: -40px; left: -30px;
}
.bg-card-icon i {
    font-size: 3.6rem;
    color: rgba(255,255,255,.9);
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 4px 14px rgba(0,0,0,.25));
}

/* PDF rozet — üst sağ */
.bg-card-pdf-badge {
    position: absolute;
    top: 12px; right: 12px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(0,0,0,.28);
    backdrop-filter: blur(6px);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 4px 11px;
    border-radius: 20px;
    z-index: 3;
}
.bg-card-pdf-badge i { font-size: 13px; }

/* Gövde */
.bg-card-body {
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
}
.bg-card-title {
    font-family: "Konnect", sans-serif !important;
    font-size: 15px;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}
.bg-card:hover .bg-card-title { color: #1457BD; }

.bg-card-meta {
    display: flex;
    align-items: center;
}
.bg-card-type {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #f1f5f9;
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
}
.bg-card-type i { font-size: 13px; color: #1457BD; }

.bg-card-link {
    font-size: 13px;
    font-weight: 600;
    color: #1457BD;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap .18s ease;
    border-top: 1px solid #f1f5f9;
    padding-top: 12px;
}
.bg-card:hover .bg-card-link { gap: 10px; }
.bg-card-soon {
    font-size: 12px;
    color: #94a3b8;
    border-top: 1px solid #f1f5f9;
    padding-top: 12px;
}

/* Posts swiper — ikon placeholder */
.posts-card-icon-thumb {
    width: 100%;
    height: 175px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(135deg, #e0eaff 0%, #f0f4fb 100%);
    border-radius: 25px 25px 0 0;
}
.posts-card-icon-thumb i {
    font-size: 3rem;
    color: #1457BD;
    opacity: .5;
}
.posts-card-icon-thumb.has-pdf {
    background: linear-gradient(135deg, #fee2e2 0%, #fff1f2 100%);
}
.posts-card-icon-thumb.has-pdf i { color: #DA262E; opacity: .6; }
.posts-card-icon-thumb span {
    font-size: 11px;
    font-weight: 700;
    color: #DA262E;
    background: rgba(218,38,46,.1);
    border: 1px solid rgba(218,38,46,.2);
    padding: 3px 10px;
    border-radius: 10px;
    letter-spacing: .06em;
}

.metro-info-security-list-page {
    margin: 50px 0 80px;
}

/* Tam sayfa listesi için daha küçük ikon yüksekliği */
.bg-cards-grid-full .bg-card-icon {
    height: 120px;
}

@media (max-width: 767px) {
    .bg-cards-grid { grid-template-columns: 1fr; gap: 16px; }
    .bg-card-icon { height: 110px; }
    .bg-card-icon i { font-size: 2.8rem; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .bg-cards-grid { grid-template-columns: repeat(2, 1fr); }
}

/** END BİLGİ GÜVENLİĞİ **/



/** START POSTS **/

.metro-posts {
    margin: 80px 0 50px;
}
/* FAQ sayfasında "Son Paylaşılan Gönderiler" Hakkımızda sayfasındaki gibi daha aşağıda olsun */
.page-faq .metro-posts {
    margin-top: 100px;
    margin-bottom: 60px;
}

/* FAQ iç sayfalar (/faq/mobil vb.): menü üstte, Son Paylaşılan Gönderiler footere yakın */
.page-faq-inner .metro-faq-page {
    padding-top: 24px;
    padding-bottom: 50px;
    min-height: 0;
}
.page-faq-inner .metro-faq-page .faq-page-head {
    padding: 24px 28px;
    margin-bottom: 20px;
}
.page-faq-inner .metro-faq-wrapper .row {
    align-items: flex-start;
}
.page-faq-inner .faq-sidebar {
    position: relative;
    top: 0;
}
.page-faq-inner .metro-posts {
    margin-top: 50px;
    margin-bottom: 30px;
}
.page-faq-inner .page > main {
    flex: 0 0 auto;
}

.metro-posts .metro-posts-wrapper {}

.metro-posts .metro-posts-wrapper .metro-head {
    margin: 0 0 50px;
}

.metro-posts .metro-posts-wrapper .metro-head h2 {}

.metro-posts .metro-posts-wrapper .metro-head .metro-button {
    background-color: #1457BD;
}

.metro-posts .metro-posts-wrapper .metro-head .metro-button::before {
    background: #fff;
    background: -moz-linear-gradient(90deg, #ffffff00 0%, rgb(255 255 255 / 28%) 100%);
    background: -webkit-linear-gradient(90deg, #ffffff00 0%, rgb(255 255 255 / 28%) 100%);
    background: linear-gradient(90deg, #ffffff00 0%, rgb(255 255 255 / 28%) 100%);
}

.metro-posts .metro-posts-slider {}

.swiper.swiper-posts {}

.swiper.swiper-posts .swiper-slide {}

.posts-card {
    background-color: #fff;
    border: 1px solid #D0D0D0;
    display: block;
    border-radius: 26px;
}

.posts-card .card-image {}

.posts-card .card-image img {
    border-radius: 25px 25px 0 0;
}

.posts-card .card-content {
    padding: 25px;
    height: 200px;
}

.posts-card .card-content .date {
    color: #9A9A9A;
    font-size: 14px;
    font-weight: 300;
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0 0 6px;
}

.posts-card .card-content .date i {
    color: #DA262E;
    font-size: 16px;
    line-height: 1;
    position: relative;
    top: -1px;
}

.posts-card .card-content h3 {
    color: #092857;
    font-family: "Konnect", sans-serif !important;
    font-size: 18px;
    margin: 0 0 30px;
}

.posts-card .card-content .metro-button {
    width: fit-content;
    font-size: 14px;
    height: 45px;
    background-color: #1457BD;
}

.posts-card .card-content .metro-button::before {
    height: 45px;
    width: 45px;
    background: #fff;
    background: -moz-linear-gradient(90deg, #ffffff00 0%, rgb(255 255 255 / 28%) 100%);
    background: -webkit-linear-gradient(90deg, #ffffff00 0%, rgb(255 255 255 / 28%) 100%);
    background: linear-gradient(90deg, #ffffff00 0%, rgb(255 255 255 / 28%) 100%);
}

.posts-card .card-content .metro-button i {}

/** END POSTS **/

/** START POSTS INDEX PAGE **/

/* Sayfa kapsayıcı */
.metro-posts-page {
    margin: 40px 0 80px;
}

/* Tüm sayfalardaki BT Portal Bilgi Kütüphanesi grid bölümü */
.latest-posts-section {
    padding: 60px 0 80px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    margin-bottom: 0;
}
.latest-posts-head {
    margin-bottom: 36px;
}
.latest-posts-grid {
    grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 991px) { .latest-posts-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .latest-posts-grid { grid-template-columns: 1fr; } }

/* Anasayfada BT Portal Bilgi Kütüphanesi bölümü */
.home-posts-section {
    margin: 60px 0 0;
    padding: 60px 0 80px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}
.home-posts-head {
    text-align: center;
    margin-bottom: 36px !important;
}

/* Bilgi Güvenliği slider'ı ile footer arasına boşluk */
.metro-information.metro-information-bilgi {
    margin-bottom: 0;
    padding-bottom: 72px;
}

/* Filtre satırı */
.posts-filter {
    margin: 0 0 36px;
}
.posts-filter-inner {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.posts-filter-search {
    display: flex;
    align-items: center;
    gap: 0;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 14px;
    padding: 0 18px;
    height: 52px;
    box-shadow: 0 1px 6px rgba(9,40,87,.05);
    transition: border-color .2s;
}
.posts-filter-search:focus-within {
    border-color: #1457BD;
    box-shadow: 0 0 0 3px rgba(20,87,189,.08);
}
.posts-filter-search i {
    color: #94a3b8;
    font-size: 1.2rem;
    margin-right: 10px;
    flex-shrink: 0;
}
.posts-filter-search input {
    border: none;
    background: transparent;
    outline: none;
    font-size: 14px;
    color: #334155;
    width: 100%;
    height: 100%;
}
.posts-filter-search input::placeholder { color: #94a3b8; }

/* Canlı arama spinner */
.posts-search-spinner {
    flex-shrink: 0;
    color: #1457BD;
    font-size: 1.1rem;
    animation: spinIcon .7s linear infinite;
}
@keyframes spinIcon { to { transform: rotate(360deg); } }

/* Kategori pill'ları <button> olarak da çalışsın */
.cat-pill[type="button"] {
    border: 1.5px solid #e2e8f0;
    background: #fff;
    cursor: pointer;
    font-family: inherit;
}

/* Kategori hap etiketleri */
.posts-filter-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.cat-pill {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
    text-decoration: none;
    transition: all .2s;
}
.cat-pill:hover { background: #e2e8f0; color: #0f172a; }
.cat-pill.active {
    background: #092857;
    color: #fff;
    border-color: #092857;
}

/* 3'lü grid */
.posts-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

/* Tek kart */
.posts-grid-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 10px rgba(9,40,87,.05);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform .22s ease, box-shadow .22s ease;
}
.posts-grid-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 28px rgba(9,40,87,.12);
    text-decoration: none;
    color: inherit;
}

/* Kare thumbnail */
.pgc-thumb {
    position: relative;
    width: 100%;
    padding-top: 68%; /* 68% → kare'den biraz daha alçak, yeterince küçük */
    background: #f0f4f8;
    overflow: hidden;
}
.pgc-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pgc-pdf-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: none;
}

/* Placeholder (PDF veya ikon) */
.pgc-thumb-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #e0eaff 0%, #f0f4fb 100%);
}
.pgc-thumb-placeholder i {
    font-size: 3rem;
    color: #1457BD;
    opacity: .55;
}

/* PDF / rozet */
.pgc-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .03em;
    line-height: 1;
}
.pgc-badge.pdf {
    background: rgba(218,38,46,.9);
    color: #fff;
    backdrop-filter: blur(4px);
}
.pgc-badge.pdf i { font-size: 13px; }

/* Kart gövdesi */
.pgc-body {
    padding: 16px 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

/* Kategori etiketleri */
.pgc-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.pgc-cat {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    background: #e0eaff;
    color: #1457BD;
    padding: 3px 8px;
    border-radius: 6px;
}

/* Başlık */
.pgc-title {
    font-family: "Konnect", sans-serif !important;
    font-size: 14px;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}
.posts-grid-card:hover .pgc-title {
    color: #1457BD;
}

/* Tarih */
.pgc-date {
    font-size: 12px;
    color: #94a3b8;
    display: flex;
    align-items: center;
    gap: 4px;
}
.pgc-date i { color: #DA262E; font-size: 13px; }

/* Boş durum */
.posts-empty {
    text-align: center;
    padding: 4rem 2rem;
    color: #94a3b8;
}
.posts-empty i { font-size: 3.5rem; display: block; margin-bottom: 1rem; opacity: .4; }
.posts-empty p { margin: 0 0 1.5rem; font-size: 15px; }

/* Sayfalama */
.posts-pagination {
    margin-top: 48px;
    display: flex;
    justify-content: center;
}
.posts-pagination-nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}
.posts-pagination-nav ul {
    display: flex;
    align-items: center;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.posts-pagination-nav ul li a,
.posts-pagination-nav ul li span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    color: #475569;
    background: #fff;
    border: 1px solid #e2e8f0;
    text-decoration: none;
    transition: all .2s;
}
.posts-pagination-nav ul li a:hover {
    background: #e0eaff;
    color: #1457BD;
    border-color: #1457BD;
}
.posts-pagination-nav ul li.active span {
    background: #092857;
    color: #fff;
    border-color: #092857;
}
.posts-pagination-nav ul li.disabled span {
    opacity: .4;
    cursor: default;
}
.posts-pagination-info {
    font-size: 12px;
    color: #94a3b8;
}

/* Responsive */
@media (max-width: 991px) {
    .posts-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 575px) {
    .posts-grid { grid-template-columns: 1fr; gap: 16px; }
    .pgc-thumb { padding-top: 60%; }
    .metro-posts-page { margin: 24px 0 56px; }
}

/** END POSTS INDEX PAGE **/



/** START FOOTER **/

.metro-footer {
    background: #092857;
    background: -moz-linear-gradient(180deg, #092857 0%, #1457BD 100%);
    background: -webkit-linear-gradient(180deg, #092857 0%, #1457BD 100%);
    background: linear-gradient(180deg, #092857 0%, #1457BD 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    margin: 0;
}

.metro-footer .metro-footer-wrapper {
    padding: 70px 0 75px;
}

.metro-footer .metro-footer-wrapper .metro-footer-group {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
    align-items: start;
    gap: 24px;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col {}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col.logo {}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col a {
    display: inline-block;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col a img {
    width: 400px;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .metro-social {
    display: flex;
    gap: 20px;
    margin: 30px 0 0;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .metro-social a {
    color: #fff;
    font-size: 30px;
    line-height: 1;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .metro-social a i {}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col.menus {}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .menu-group {}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .menu-group ul {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .menu-group ul li {
    line-height: 1;
}

.metro-footer .metro-footer-wrapper .metro-footer-group .metro-footer-col .menu-group ul li a {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    line-height: 1;
}

.metro-footer .metro-copyright {
    background-color: #092857;
    height: 70px;
    display: flex;
    align-items: center;
}

.metro-footer .metro-copyright .metro-copyright-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.metro-footer .metro-copyright .metro-copyright-group .metro-copyright-col {}

.metro-footer .metro-copyright .metro-copyright-group .metro-copyright-col.link {}

.metro-footer .metro-copyright .metro-copyright-group .metro-copyright-col p {
    font-size: 14px;
    color: #fff;
    font-weight: 300;
}

.metro-footer .metro-copyright .metro-copyright-group .metro-copyright-col p strong {
    font-weight: 600;
}

.metro-footer .metro-copyright .metro-copyright-group .metro-copyright-col a {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
}

.metro-footer .metro-copyright .footer-credit {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,0.9);
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    padding: 6px 12px;
    border-radius: 6px;
    transition: all 0.25s ease;
}
.metro-footer .metro-copyright .footer-credit:hover {
    color: #fff;
    background: rgba(255,255,255,0.1);
}
.metro-footer .metro-copyright .footer-credit .footer-credit-year {
    color: rgba(255,255,255,0.7);
    font-weight: 500;
}
.metro-footer .metro-copyright .footer-credit strong {
    font-weight: 600;
    color: #fff;
}
.metro-footer .metro-copyright .footer-credit i {
    font-size: 12px;
    opacity: 0.8;
    transition: transform 0.2s;
}
.metro-footer .metro-copyright .footer-credit:hover i {
    transform: translate(2px, -2px);
}
@media (max-width: 767px) {
    .metro-footer .metro-copyright .footer-credit {
        font-size: 13px;
        padding: 8px 10px;
    }
}


/** END FOOTER **/



/** START ABOUT HERO **/

.metro-about-hero {
    position: relative;
    height: 450px;
    display: flex;
    align-items: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.metro-about-hero::before {
    content: "";
    background: #092857;
    background: -moz-linear-gradient(90deg, #092857 0%, #1457BD 100%);
    background: -webkit-linear-gradient(90deg, #092857 0%, #1457BD 100%);
    background: linear-gradient(90deg, #092857e6 0%, #09285766 50%, #092857e6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.metro-about-hero .metro-about-wrapper {
    position: relative;
}

.metro-about-hero .metro-about-wrapper .metro-about-head {}

.metro-about-hero .metro-about-wrapper .metro-about-head .subtitle {
    font-family: "Konnect", sans-serif !important;
    color: #fff;
    font-size: 14px;
    background-color: #ffffff26;
    width: fit-content;
    height: 40px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    border-radius: 40px;
    text-transform: uppercase;
    gap: 5px;
    backdrop-filter: blur(5px);
    margin: 0 0 20px;
}

.metro-about-hero .metro-about-wrapper .metro-about-head .subtitle i {
    font-size: 16px;
    line-height: 1;
    position: relative;
    top: -1px;
}

.metro-about-hero .metro-about-wrapper .metro-about-head h2 {
    color: #fff;
    font-size: 50px;
    font-weight: 700;
    line-height: 55px;
    margin: 0 0 20px;
}

.metro-about-hero .metro-about-wrapper .metro-about-head h2 span {
    display: block;
    font-size: 40px;
    font-weight: 300;
}

.metro-about-hero .metro-about-wrapper .metro-about-head h2 span strong {
    font-weight: 700;
}

.metro-about-hero .metro-about-wrapper .metro-about-head p {
    color: #fff;
    font-size: 18px;
    font-weight: 200;
    max-width: 60%;
    line-height: 28px;
}

/** END ABOUT HERO **/



/** START ABOUT FEATURES **/

.metro-about-features {
    position: relative;
    z-index: 9;
    margin: -30px 0 0;
}

.metro-about-features .metro-about-features-wrapper {}

.metro-about-features .metro-about-features-wrapper .features-group {
    display: flex;
}

.metro-about-features .metro-about-features-wrapper .features-group .features-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #fff;
    border-radius: 25px;
    padding: 20px 30px;
    height: 175px;
}

.metro-about-features .metro-about-features-wrapper .features-group .features-card:nth-child(even) {
    background-color: #ffffff26;
    border: 1px solid #ffffff26;
    backdrop-filter: blur(8px);
}

.metro-about-features .metro-about-features-wrapper .features-group .features-card .icon {
    background-color: #1458bd0d;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
}

.metro-about-features .metro-about-features-wrapper .features-group .features-card .icon i {
    color: #1457BD;
    font-size: 22px;
}

.metro-about-features .metro-about-features-wrapper .features-group .features-card .title {
    color: #DA262E;
    font-size: 18px;
    font-family: "Konnect", sans-serif !important;
    font-weight: 500;
    line-height: 26px;
    margin: 10px 0 5px;
}

.metro-about-features .metro-about-features-wrapper .features-group .features-card p {
    font-size: 13px;
    font-weight: 300;
    text-align: center;
}

/** END ABOUT FEATURES **/



/** START ABOUT WHAT DO **/

.metro-about-what-do {
    margin: 100px 0 0;
}

.metro-about-what-do .metro-head {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin: 0 0 75px;
}

.metro-about-what-do .metro-head .subtitle {
    color: #1457BD;
}

.metro-about-what-do .metro-head h2 {}

.metro-about-what-do .metro-head h2 span {}

.metro-about-what-do .what-do-wrapper {}

.metro-about-what-do .what-do-wrapper .row {}

.metro-about-what-do .what-do-wrapper .what-do-media {
    position: relative;
}

.metro-about-what-do .what-do-wrapper .what-do-media .navigation-button {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
    width: 40px;
    height: 40px;
    border: 2px solid #FFF;
    border-radius: 100%;
    background-color: #ffffff0d;
    backdrop-filter: blur(8px);
}

.metro-about-what-do .what-do-wrapper .what-do-media .navigation-button i {
    font-size: 22px;
}

.metro-about-what-do .what-do-wrapper .what-do-media .navigation-button::before {
    display: none;
}

.metro-about-what-do .what-do-wrapper .what-do-media .navigation-button.prev {
    left: 30%;
}

.metro-about-what-do .what-do-wrapper .what-do-media .navigation-button.next {
    right: 24%;
}

.swiper.swiper-what-do-media {}

.swiper.swiper-what-do-media .swiper-wrapper {
    align-items: flex-end;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide {
    position: relative;
    opacity: 0;
    transition: all .4s ease;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide::before {
    content: "";
    background: #1457bd;
    background: -moz-linear-gradient(180deg, #1457bd00 0%, #1457bd4d 50%, #1457bde6 100%);
    background: -webkit-linear-gradient(180deg, #1457bd00 0%, #1457bd4d 50%, #1457bde6 100%);
    background: linear-gradient(180deg, #1457bd00 0%, #1457bd4d 50%, #1457bde6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9;
    border-radius: 25px;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide.swiper-slide-active {
    position: relative;
    z-index: 9;
    opacity: 1;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide.swiper-slide-active::before {
    opacity: 0;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide.swiper-slide-prev {
    transform: rotate(-5deg) scale(.9);
    opacity: 1;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide.swiper-slide-next {
    transform: rotate(5deg) scale(.9);
    opacity: 1;
}

.swiper.swiper-what-do-media .swiper-wrapper .swiper-slide img {
    border-radius: 25px;
    height: 500px;
    object-fit: cover;
}



.metro-about-what-do .what-do-list-wrapper {
    padding: 0 0 0 50px;
    display: flex;
}

.metro-about-what-do .what-do-list-wrapper .what-do-bar {
    background-color: #D0D0D0;
    height: -webkit-fill-available;
    width: 1px;
    position: relative;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list {
    margin: 0 0 0 -25px;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item {
    display: flex;
    align-items: center;
    gap: 15px;
    height: 100px;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item .icon {
    width: 50px;
    min-width: 50px;
    height: 50px;
    border: 2px solid #DA262E;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    transition: all .4s ease;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item .icon::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -2px;
    background-color: #DA262E;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    transform: translate(0, -100%);
    transition: all .4s ease;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item .icon i {
    color: #DA262E;
    font-size: 25px;
    position: relative;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item .content {}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item .content h3 {
    color: #092857;
    font-family: "Konnect", sans-serif !important;
    font-size: 18px;
    font-weight: 500;
    margin: 0 0 5px;
    line-height: 24px;
    opacity: .4;
}

.metro-about-what-do .what-do-list-wrapper .what-do-list .what-do-item .content p {
    font-size: 13px;
    font-weight: 300;
    line-height: 20px;
    opacity: .4;
}

.swiper.swiper-what-do-list {
    height: 500px;
}

.swiper.swiper-what-do-list .swiper-slide {
    transition: all .4s ease;
}

.swiper.swiper-what-do-list .swiper-slide.swiper-slide-thumb-active {}

.swiper.swiper-what-do-list .swiper-slide.swiper-slide-thumb-active .what-do-item .icon::before {
    transform: translate(0, 0);
    transition: all .4s ease;
}

.swiper.swiper-what-do-list .swiper-slide.swiper-slide-thumb-active .what-do-item .icon i {
    color: #fff;
}

.swiper.swiper-what-do-list .swiper-slide.swiper-slide-thumb-active .what-do-item .content {}

.swiper.swiper-what-do-list .swiper-slide.swiper-slide-thumb-active .what-do-item .content h3 {
    opacity: 1;
}

.swiper.swiper-what-do-list .swiper-slide.swiper-slide-thumb-active .what-do-item .content p {
    opacity: 1;
}


/** END ABOUT WHAT DO **/



/** START ABOUT CONTENT **/

.metro-about-content {
    margin: 120px 0 0;
    position: relative;
}

.metro-about-content::before {
    content: "";
    background: #092857;
    background: -moz-linear-gradient(180deg, #092857 0%, #1457BD 100%);
    background: -webkit-linear-gradient(180deg, #092857 0%, #1457BD 100%);
    background: linear-gradient(180deg, #092857 0%, #1457BD 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    border-radius: 50px;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 85%;
    z-index: -1;
}

.metro-about-content .metro-about-content-boxes {
    margin: 0 0;
}

.metro-about-content .metro-about-content-boxes .about-boxes-group {
    display: flex;
    gap: 40px;
    width: 75%;
    margin: 0 auto;
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes {
    border-radius: 25px;
    padding: 40px 25px;
    text-align: center;
    border: .5px solid rgb(255 255 255 / 15%);
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes.vision {
    background-color: #fff;
    box-shadow: -1px 1px 14px 0px rgb(0 0 0 / 10%);
    -webkit-box-shadow: -1px 1px 14px 0px rgb(0 0 0 / 10%);
    -moz-box-shadow: -1px 1px 14px 0px rgb(0 0 0 / 10%);
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes.vision .title {
    color: #092857;
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes.vision p {
    color: #092857;
    font-weight: 300;
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes.mission {
    background-color: #092857;
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes .title {
    color: #fff;
    font-size: 22px;
    font-weight: 500;
    margin: 0 0 10px;
}

.metro-about-content .metro-about-content-boxes .about-boxes-group .about-boxes p {
    color: #fff;
    font-size: 13px;
    font-weight: 200;
    line-height: 20px;
}

.metro-about-content .metro-about-content-main {
    padding: 50px 0;
}

.metro-about-content .metro-about-content-main .about-content-wrapper {}

.metro-about-content .metro-about-content-main .about-content-wrapper .about-content {
    height: 380px;
    overflow: hidden;
}

.metro-about-content .metro-about-content-main .about-content-wrapper .about-content.active {
    height: auto;
}

.metro-about-content .metro-about-content-main .about-content-wrapper .about-content p {
    color: #fff;
    font-size: 14px;
    font-weight: 200;
    line-height: 26px;
    margin: 0 0 15px;
}

.metro-about-content .metro-about-content-main .about-content-wrapper .about-content h2 {
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    margin: 25px 0 10px;
}

.metro-about-content .metro-about-content-main button {
    background-color: #fff;
    color: #1457BD;
    font-size: 15px;
    height: 45px;
    margin: 30px 0 0;
}

.metro-about-content .metro-about-content-main button.active {
    position: sticky;
    bottom: 20px;
}

.metro-about-content .metro-about-content-main button::before {
    display: none;
}

.metro-about-content .metro-about-content-main button i {}

/** END ABOUT CONTENT **/



/** START APPLICATION **/

.metro-app-page {
    margin: 50px 0 150px;
}

.metro-app-page .metro-head {}

.metro-app-page .metro-head .subtitle {}

.metro-app-page .metro-head h2 {}

.metro-app-page .metro-app-page-wrapper {}

.metro-app-page .metro-app-page-wrapper .row {}

.metro-app-page .metro-app-page-wrapper .app-card {
    background-color: #fff;
    display: flex;
    align-items: center;
    margin: 0 0 20px;
    border-radius: 30px;
    padding: 25px;
    gap: 15px;
    box-shadow: -1px 1px 14px 0px rgb(0 0 0 / 5%);
    -webkit-box-shadow: -1px 1px 14px 0px rgb(0 0 0 / 5%);
    -moz-box-shadow: -1px 1px 14px 0px rgb(0 0 0 / 5%);
}

.metro-app-page .metro-app-page-wrapper .app-card .card-image {
    flex: 1;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-content {
    flex: 3;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-content h3 {
    font-family: "Konnect", sans-serif !important;
    font-size: 18px;
    color: #092857;
    line-height: 26px;
    margin: 0 0 5px;
    font-weight: 600;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-content p {
    font-weight: 300;
    font-size: 13px;
    line-height: 20px;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-button {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-button .metro-button {
    font-size: 14px;
    height: 40px;
    padding: 0 20px;
    gap: 5px;
    text-align: center;
    line-height: 14px;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-button .metro-button.download {
    background-color: #DA262E !important;
    color: #fff !important;
    width: 100%;
    padding: 0 24px;
    justify-content: center;
    gap: 8px;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-button .metro-button.document {
    background-color: #092857;
    color: #fff;
    font-size: 12px;
    width: 100%;
    padding: 0 24px;
    justify-content: center;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-button .metro-button::before {
    display: none;
}

.metro-app-page .metro-app-page-wrapper .app-card .card-button .metro-button i {
    font-size: 15px;
}

/** END APPLICATION **/



/** START PROBLEM PAGE **/

.metro-problem-page {
    margin: 50px 0 100px;
}

/* Bilgilendirme bandı */
.problem-info-banner {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    border: 1.5px solid #f59e0b;
    border-left: 5px solid #f59e0b;
    border-radius: 14px;
    padding: 18px 22px;
    margin-bottom: 32px;
}
.pib-icon {
    font-size: 26px;
    color: #d97706;
    flex-shrink: 0;
    margin-top: 2px;
}
.pib-body { flex: 1; }
.pib-title {
    font-weight: 700;
    font-size: 15px;
    color: #92400e;
    margin: 0 0 6px;
}
.pib-desc {
    font-size: 13.5px;
    color: #78350f;
    margin: 0;
    line-height: 1.65;
}
.pib-desc strong { color: #92400e; }
.pib-badge {
    flex-shrink: 0;
    background: #f59e0b;
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 20px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 5px;
    align-self: flex-start;
}
@media (max-width: 575px) {
    .problem-info-banner { flex-wrap: wrap; }
    .pib-badge { order: -1; }
}

.metro-problem-page {}

.metro-problem-page .metro-head {}

.metro-problem-page .metro-head .subtitle {}

.metro-problem-page .metro-problem-page-wrapper {}

.metro-problem-page .metro-problem-page-wrapper .problem-container {
    display: flex;
    justify-content: center;
}

.metro-problem-page .metro-problem-page-wrapper .problem-container .problem-card {
    width: 60%;
    background-color: #fff;
    border-radius: 30px 30px 0 0;
    padding: 50px;
    background: #fff;
    background: -moz-linear-gradient(180deg, #ffffff 0%, #ffffff00 100%);
    background: -webkit-linear-gradient(180deg, #ffffff 0%, #ffffff00 100%);
    background: linear-gradient(180deg, #ffffff 0%, #ffffff00 100%);
}

.metro-problem-page .metro-problem-page-wrapper .problem-container .problem-card form {}

.metro-problem-page .metro-problem-page-wrapper .problem-container .problem-card form .row {
    row-gap: 25px;
}

.robot-verify {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}
.robot-verify-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    color: #334155;
    margin: 0;
    cursor: default;
}
.robot-verify-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #1457BD;
    color: #fff;
    border-radius: 10px;
    font-size: 20px;
}
.robot-verify-label strong { color: #092857; }

.metro-form-card {
    position: relative;
    background-color: #fff;
    border-radius: 20px;
}

.metro-form-card input,
.metro-form-card textarea,
.metro-form-card select {
    border: 1px solid #0928571a;
    width: 100%;
    height: 60px;
    font-size: 14px;
    border-radius: 20px;
    padding: 0 20px;
    color: #092857;
    font-weight: 400;
}

.metro-form-card.file {
    border: 1px solid #0928571a;
    width: 100%;
    height: 60px;
    font-size: 14px;
    border-radius: 20px;
}

.metro-form-card.file::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(20,87,189,1)'%3E%3Cpath d='M20 2C21.6569 2 23 3.34315 23 5V7H21V19C21 20.6569 19.6569 22 18 22H4C2.34315 22 1 20.6569 1 19V17H17V19C17 19.5128 17.386 19.9355 17.8834 19.9933L18 20C18.5128 20 18.9355 19.614 18.9933 19.1166L19 19V4H6C5.48716 4 5.06449 4.38604 5.00673 4.88338L5 5V15H3V5C3 3.34315 4.34315 2 6 2H20Z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 26px;
    width: 60px;
    height: 60px;
    position: absolute;
    left: 0;
    top: 0;
    border-right: 1px solid #0928571a;
}

.metro-form-card.file .file-label {
    position: absolute;
    top: 50%;
    left: 70px;
    transform: translate(0, -50%);
    color: #09285766;
    font-size: 14px;
    font-weight: 400;
    pointer-events: none;
}
.metro-form-card.file .file-name {
    display: none;
    position: absolute;
    top: 50%;
    left: 70px;
    transform: translate(0, -50%);
    right: 20px;
    color: #092857;
    font-size: 14px;
    font-weight: 500;
    pointer-events: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.metro-form-card.file.has-file .file-label { display: none; }
.metro-form-card.file.has-file .file-name { display: inline !important; }


.metro-form-card input {}

.metro-form-card input[type=file] {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 99;
    appearance: unset;
    opacity: 0;
    padding: 0;
    cursor: pointer;
}

.metro-form-card textarea {
    height: 150px;
    padding: 20px;
}

.metro-form-card select {
    cursor: pointer;
}

.metro-form-card input::placeholder,
.metro-form-card textarea::placeholder {
    color: #09285766;
}

.metro-form-card.select {}

.metro-form-card.select::after {
    content: "";
    width: 58px;
    height: 58px;
    position: absolute;
    right: 1px;
    top: 1px;
    background-color: #fff;
    border-radius: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(20,87,189,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 16px;
}

form button {
    padding: 0 40px !important;
    background-color: #DA262E !important;
    height: 50px !important;
}

form button::before {
    display: none;
}

/** END PROBLEM PAGE **/



/** START ACTIVITY PAGE **/

.metro-activity-page {
    margin: 20px 0 100px;
}

.metro-activity-page .metro-head {}

.metro-activity-page .metro-head .subtitle {}

.metro-activity-page .metro-head h2 {}

.metro-activity-page .metro-activity-page-wrapper {}

.metro-activity-page .metro-activity-page-wrapper .activity-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.metro-activity-page .metro-activity-page-wrapper .activity-container .activity-filter {}

.metro-activity-page .metro-activity-page-wrapper .activity-container .activity-filter .activity-filter-group {
    display: flex;
    gap: 20px;
    justify-content: center;
}

.metro-activity-page .metro-activity-page-wrapper .activity-container .activity-filter .activity-filter-group .metro-form-card {
    width: 300px;
    border-radius: 50px;
}

.metro-activity-page .metro-activity-page-wrapper .activity-container .activity-filter .activity-filter-group .metro-form-card::after {
    width: 48px;
    height: 48px;
}

.metro-activity-page .metro-activity-page-wrapper .activity-container .activity-filter .activity-filter-group .metro-form-card select {
    border: unset;
    height: 50px;
    border-radius: 50px;
}

.activity-card {
    width: 60%;
    background-color: #fff;
    margin: 50px 0 0;
    position: relative;
    border-radius: 30px;
}

.activity-card::before {
    transform: translate(-50%, -50%);
    content:
        "";
    background: #092857;
    background:
        -moz-linear-gradient(90deg, #092857 0%, #1457BD 100%);
    background:
        -webkit-linear-gradient(90deg, #092857 0%, #1457BD 100%);
    background: linear-gradient(180deg, #09285700 0%, rgb(9 40 87 / 10%) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    position: absolute;
    width: 100.4%;
    height: 100.4%;
    left: 50%;
    top: 50%;
    z-index: -1;
    border-radius: 30px;
}

.activity-card .activity-card-list {}

.activity-card .activity-card-list .activity-card-item {
    display: flex;
    align-items: center;
    padding: 30px 20px;
    line-height: 1;
}

.activity-card .activity-card-list .activity-card-item:not(:last-child) {
    border-bottom: 1px solid #0928571a;
}

.activity-card .activity-card-list .activity-card-item .card-icon {
    flex: 1.5;
    display: flex;
    justify-content: center;
}

.activity-card .activity-card-list .activity-card-item .card-icon img {
    width: 60px;
    height: 60px;
}

.activity-card .activity-card-list .activity-card-item .card-content {
    flex: 4;
}

.activity-card .activity-card-list .activity-card-item .card-content h3 {
    font-family: "Konnect", sans-serif !important;
    font-size: 16px;
    color: #092857;
}

.activity-card .activity-card-list .activity-card-item .card-content .date {
    color: #C4C4C4;
    font-size: 12px;
    font-weight: 300;
}

.activity-card .activity-card-list .activity-card-item .card-button {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 3;
}

.activity-card .activity-card-list .activity-card-item .card-button .metro-button {
    padding: 0 30px;
    font-size: 13px;
    height: 45px;
}

.activity-card .activity-card-list .activity-card-item .card-button .metro-button.view {
    background-color: #DA262E;
}

.activity-card .activity-card-list .activity-card-item .card-button .metro-button.pdf {}

.activity-card .activity-card-list .activity-card-item .card-button .metro-button::before {
    display: none;
}

/** END ACTIVITY PAGE **/



/** START ACTIVITY DETAIL PAGE **/

.metro-activity-detail-page {
    margin: 50px 0 100px;
}

.metro-activity-detail-page .activity-detail-page-wrapper {}

.metro-activity-detail-page .activity-detail-page-wrapper .row {}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-image {}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-image img {
    border-radius: 30px;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 0 0 30px;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head {
    align-items: flex-start;
    text-align: left;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head .subtitle {}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head h2 {
    font-family: "Konnect", sans-serif !important;
    margin: 0 0 15px;
    line-height: 42px;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head h2 span {
    border: unset;
    display: block;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head .button-group {
    display: flex;
    align-items: center;
    gap: 15px;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head .button-group a {
    padding: 0 30px;
    font-size: 13px;
    height: 45px;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head .button-group a::before {
    display: none;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head .button-group a.pdf {}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .metro-head .button-group a.view {
    background-color: #DA262E;
}

.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .content-body {
    color: #334155;
    line-height: 1.7;
}
.metro-activity-detail-page .activity-detail-page-wrapper .detail-content .content-body img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
}
.metro-activity-detail-page .activity-report-date {
    font-size: 1rem;
    color: #64748b;
    margin-bottom: 1.25rem;
}
.metro-activity-detail-page .btn-back-reports {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #092857;
    font-weight: 500;
    text-decoration: none;
    padding: 10px 18px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    transition: all 0.2s;
}
.metro-activity-detail-page .btn-back-reports:hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #092857;
}
.metro-activity-detail-page .btn-back-reports i {
    font-size: 1.2rem;
}

.detail-page-slider {
    margin: 100px 0 0;
}

.detail-page-slider h2 {
    color: #1457BD;
    font-size: 30px;
    font-weight: 600;
    text-align: center;
}

.detail-page-slider h2 span {
    font-weight: 300;
}

.detail-page-slider .slider-area {
    position: relative;
}

.detail-page-slider .slider-area .navigation-button {
    background-color: #fff;
    border: 2px solid #092857;
    width: 45px;
    height: 45px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    z-index: 9;
}

.detail-page-slider .slider-area .navigation-button i {
    color: #092857;
    font-size: 20px;
}

.detail-page-slider .slider-area .navigation-button.prev {
    left: -22px;
}

.detail-page-slider .slider-area .navigation-button.next {
    right: -22px;
}

.detail-page-slider .slider-area .navigation-button::before {
    display: none;
}

.swiper.swiper-activity {
    margin: 50px 0 0;
}

.swiper.swiper-activity .swiper-slide {}

.swiper.swiper-activity .swiper-slide img {
    border-radius: 30px;
}

/** END ACTIVITY DETAIL PAGE **/

/** POST DETAIL - Gönderi detay sayfası **/
.metro-post-detail {
    margin: 40px 0 80px;
}
.post-detail-header {
    text-align: center;
    margin-bottom: 48px;
    padding: 40px 32px 36px;
    background: linear-gradient(165deg, #f8fafc 0%, #f1f5f9 50%, #e2e8f0 100%);
    border-radius: 20px;
    border: 1px solid rgba(9,40,87,.06);
    box-shadow: 0 2px 20px rgba(9,40,87,.04);
    position: relative;
}
.post-detail-header::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #1457BD 0%, #DA262E 100%);
    border-radius: 2px;
}
.post-detail-subtitle {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .15em;
    color: #64748b;
    margin-bottom: 12px;
    text-transform: uppercase;
}
.post-detail-title {
    font-family: "Konnect", sans-serif !important;
    font-size: 2rem;
    font-weight: 700;
    color: #092857;
    margin: 0 0 20px;
    line-height: 1.35;
    letter-spacing: -0.02em;
}
.post-detail-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
}
.post-detail-meta span {
    font-size: 14px;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}
.post-detail-meta span i {
    color: #1457BD;
    font-size: 1.1rem;
}
.post-detail-actions {
    display: flex;
    gap: 12px;
}
.post-detail-actions .metro-button {
    padding: 0 24px;
    font-size: 14px;
    height: 42px;
}
.post-detail-actions .metro-button::before {
    display: none;
}
.post-detail-actions .metro-button.view {
    background-color: #DA262E;
}
/* ---- tam genişlik içerik düzeni ---- */
.post-detail-body-full {
    max-width: 860px;
    margin: 0 auto;
}
.post-detail-image-solo img,
.post-detail-body .post-detail-image img {
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(9,40,87,.1);
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto 32px;
}
.post-detail-content-full {
    background: #fff;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    padding: 2rem 2.25rem;
    box-shadow: 0 2px 16px rgba(9,40,87,.05);
}
/* WordPress Gutenberg içerik stili */
.wp-content {
    color: #334155;
    line-height: 1.85;
    font-size: 15px;
}
.wp-content p { margin: 0 0 1rem; }
.wp-content h2 { font-size: 1.35rem; font-weight: 700; color: #092857; margin: 1.75rem 0 .75rem; }
.wp-content h3 { font-size: 1.15rem; font-weight: 600; color: #0d3566; margin: 1.5rem 0 .6rem; }
.wp-content h4 { font-size: 1rem; font-weight: 600; color: #334155; margin: 1.25rem 0 .5rem; }
.wp-content ul, .wp-content ol { padding-left: 1.5rem; margin: 0 0 1rem; }
.wp-content ul li { list-style: disc; margin-bottom: .4rem; }
.wp-content ol li { list-style: decimal; margin-bottom: .4rem; }
.wp-content blockquote {
    border-left: 4px solid #1457BD;
    padding: 12px 20px;
    margin: 1.25rem 0;
    background: #f0f7ff;
    border-radius: 0 10px 10px 0;
    color: #334155;
}
.wp-content blockquote p { margin: 0; }
.wp-content strong { color: #092857; font-weight: 600; }
.wp-content a { color: #1457BD; text-decoration: underline; }
.wp-content a:hover { color: #0d3566; }
.wp-content figure, .wp-content .wp-block-image {
    margin: 1.5rem 0;
    text-align: center;
}
.wp-content img, .wp-content figure img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 4px 18px rgba(9,40,87,.1);
    display: block;
    margin: 0 auto;
}
.wp-content figcaption, .wp-content .wp-element-caption {
    font-size: 12px;
    color: #94a3b8;
    margin-top: 6px;
    text-align: center;
}
.wp-content video {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(9,40,87,.12);
    margin: 1.25rem 0;
    background: #000;
}
.wp-content p + video,
.wp-content p + p > video {
    margin-top: .5rem;
}
.wp-content table { width: 100%; border-collapse: collapse; margin: 1.25rem 0; }
.wp-content table th { background: #f0f7ff; color: #092857; font-weight: 600; padding: 10px 14px; border: 1px solid #e2e8f0; }
.wp-content table td { padding: 8px 14px; border: 1px solid #e2e8f0; }

/* "İçerik yok" durumu */
.post-no-content {
    text-align: center;
    color: #94a3b8;
    padding: 3rem 1rem;
}
.post-no-content i { font-size: 3rem; display: block; margin-bottom: 1rem; opacity: .45; }
.post-no-content p { margin: 0; font-size: 15px; }

/* eski iki sütun stili (geriye dönük uyumluluk) */
.post-detail-body .post-detail-content {
    padding: 0 0 0 32px;
}
.post-detail-body .post-detail-content .content-body {
    color: #334155;
    line-height: 1.75;
}
.post-detail-body .post-detail-content .content-body img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
}
.post-detail-gallery {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid #e2e8f0;
}
.post-gallery-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: #092857;
    text-align: center;
    margin: 0 0 28px;
}
.post-gallery-title span {
    color: #1457BD;
}
.post-detail-gallery .slider-area {
    position: relative;
}
.post-detail-gallery .slider-area .navigation-button {
    background: #fff;
    border: 2px solid #e2e8f0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
    transition: all .2s;
}
.post-detail-gallery .slider-area .navigation-button:hover {
    border-color: #1457BD;
    color: #1457BD;
}
.post-detail-gallery .slider-area .navigation-button i {
    font-size: 20px;
}
.post-detail-gallery .slider-area .navigation-button.prev {
    left: -16px;
}
.post-detail-gallery .slider-area .navigation-button.next {
    right: -16px;
}
.post-detail-gallery .slider-area .navigation-button::before {
    display: none;
}
.post-detail-gallery .swiper.swiper-activity {
    margin: 0;
}
.post-detail-gallery .swiper.swiper-activity .swiper-slide img {
    border-radius: 12px;
}
@media (max-width: 991px) {
    .metro-post-detail { margin: 24px 0 60px; }
    .post-detail-header { margin-bottom: 28px; padding-bottom: 24px; }
    .post-detail-title { font-size: 1.5rem; }
    .post-detail-body .post-detail-content { padding: 0; margin-top: 24px; }
}

/** EK DATA POST - Modern UI **/
.post-ek-data .post-detail-body .row {
    align-items: flex-start;
}
.post-ek-data .post-detail-image img {
    box-shadow: 0 12px 40px rgba(9,40,87,.12);
}
.post-ek-data .post-ek-data-content {
    font-size: 15px;
    line-height: 1.7;
}
.post-ek-data .post-ek-data-content p {
    margin-bottom: 1rem;
    color: #475569;
}
.post-ek-data .post-ek-data-content p:first-of-type {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    padding: 16px 20px;
    border-radius: 12px;
    border-left: 4px solid #1457BD;
    margin-bottom: 24px;
}
.post-ek-data .post-ek-data-content p strong {
    color: #092857;
    font-weight: 600;
}
.post-ek-data .post-ek-data-content ul,
.post-ek-data .post-ek-data-content ol {
    list-style: none;
    padding: 0;
    margin: 24px 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}
.post-ek-data .post-ek-data-content li {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 18px;
    font-weight: 500;
    color: #334155;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
    transition: all .2s ease;
}
.post-ek-data .post-ek-data-content li:hover {
    border-color: #1457BD;
    box-shadow: 0 4px 12px rgba(20,87,189,.12);
}
.post-ek-data .post-ek-data-content li::before {
    content: none;
}
.post-ek-data .post-ek-data-content table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px;
    margin: 24px 0;
}
.post-ek-data .post-ek-data-content table td,
.post-ek-data .post-ek-data-content table th {
    padding: 14px 18px;
    background: #fff;
    border: 1px solid #e2e8f0;
}
.post-ek-data .post-ek-data-content table tr td:first-child,
.post-ek-data .post-ek-data-content table tr th:first-child {
    border-radius: 12px 0 0 12px;
}
.post-ek-data .post-ek-data-content table tr td:last-child,
.post-ek-data .post-ek-data-content table tr th:last-child {
    border-radius: 0 12px 12px 0;
}
.post-ek-data .post-ek-data-content table th {
    background: #f8fafc;
    font-weight: 600;
    color: #092857;
}
.post-ek-data .post-ek-data-content a[href^="mailto:"] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #DA262E 0%, #b81d2a 100%);
    color: #fff !important;
    padding: 14px 24px;
    border-radius: 12px;
    font-weight: 600;
    text-decoration: none !important;
    margin-top: 20px;
    box-shadow: 0 4px 14px rgba(218,38,46,.35);
    transition: transform .2s, box-shadow .2s;
}
.post-ek-data .post-ek-data-content a[href^="mailto:"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(218,38,46,.4);
}
.post-ek-data .post-ek-data-content a[href^="mailto:"]::before {
    content: "\eb8e";
    font-family: "remixicon";
    font-size: 1.2rem;
}
.post-ek-data .post-ek-data-content p:last-of-type {
    background: #f8fafc;
    padding: 20px 24px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    margin-top: 28px;
}
.post-ek-data .ek-data-cta {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #e2e8f0;
}
.post-ek-data .ek-data-mailto {
    background: linear-gradient(135deg, #DA262E 0%, #b81d2a 100%) !important;
    width: fit-content;
    text-decoration: none !important;
    box-shadow: 0 4px 14px rgba(218,38,46,.35);
    transition: transform .2s, box-shadow .2s;
}
.post-ek-data .ek-data-mailto:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(218,38,46,.4);
}
.post-ek-data .ek-data-mailto::before {
    display: none !important;
}
.post-ek-data .ek-data-cta-note {
    font-size: 13px;
    color: #64748b;
    margin: 12px 0 0 !important;
}
@media (max-width: 991px) {
    .post-ek-data .detail-content { padding: 0; margin-top: 24px; }
    .post-ek-data .post-ek-data-content ul,
    .post-ek-data .post-ek-data-content ol {
        grid-template-columns: 1fr;
    }
}
/** END EK DATA POST **/

.metro-button {
    background-color: #092857;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 20px 0 30px;
    border-radius: 50px;
    gap: 10px;
    position: relative;
}

.metro-button::before {
    content: "";
    background: #092857;
    background: -moz-linear-gradient(90deg, #092857 0%, #1457BD 100%);
    background: -webkit-linear-gradient(90deg, #092857 0%, #1457BD 100%);
    background: linear-gradient(90deg, #092857 0%, #1457BD 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#000000", GradientType=1);
    height: 50px;
    width: 50px;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 100%;
}

.metro-button i {
    font-size: 20px;
    line-height: 1;
    position: relative;
    top: -1px;
}

.metro-button img {}


.navigation-button {
    height: 70px;
    width: 70px;
    position: relative;
}

.navigation-button.swiper-button-disabled {
    opacity: .4;
}

.navigation-button::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transform: rotate(45deg);
    background-color: #DA262E;
    border-radius: 15px;
    pointer-events: none;
}

.navigation-button i {
    position: relative;
    font-size: 30px;
    color: #fff;
}

.metro-head.page-head {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    margin: 0 0 50px;
}

.metro-head.page-head .subtitle {
    color: #1457BD;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.metro-head.page-head h2 {}


/** SEARCH CARD **/

.search-card {
    background-color: #ffffff66;
    display: flex;
    height: 60px;
    border-radius: 60px;
    border: 1px solid #1457BD;
    position: relative;
}

.search-card input {
    border: unset;
    background-color: unset;
    width: 100%;
    height: 100%;
    font-size: 15px;
    font-weight: 400;
    padding: 0 0 0 60px;
    color: #092857;
}

.search-card input::placeholder {
    color: #1457bd66;
}

.search-card .icon {
    position: absolute;
    line-height: 1;
    top: 50%;
    transform: translate(0, -50%);
    left: 15px;
}

.search-card .icon i {
    color: #DA262E;
    font-size: 30px;
    line-height: 1;
}

.search-result {
    background-color: #FFFFFF;
    border-radius: 0 0 30px 30px;
}

.search-result .search-result-list {}

.search-result .search-result-list .result-item {
    display: flex;
    align-items: center;
    gap: 15px;
    line-height: 1;
    padding: 20px;
}

.search-result .search-result-list .result-item:not(:last-child) {
    border-bottom: 1px solid #0928571a;
}

.search-result .search-result-list .result-item .result-icon {
    background-color: #1457bd0d;
    color: #1457BD;
    width: 45px;
    height: 45px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.search-result .search-result-list .result-item .result-icon i {
    font-size: 20px;
}

.search-result .search-result-list .result-item .result-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.search-result .search-result-list .result-item .result-content .title {
    color: #092857;
    font-family: "Konnect", sans-serif !important;
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 5px;
}

.search-result .search-result-list .result-item .result-content span {
    color: #A4A4A4;
    font-size: 14px;
    font-weight: 200;
}

.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #09285780;
    top: 0;
    left: 0;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease;
}

.overlay.active {
    opacity: 1;
    visibility: visible;
    transition: all .4s ease;
}


/** METRO CHAT **/

/* ===================== METRO ASISTAN CHATBOT ===================== */
.metro-chat {
    position: fixed;
    right: 40px;
    bottom: 40px;
    z-index: 9998;
}

/* ---------- Chatbot Penceresi ---------- */
.chatbot-window {
    position: absolute;
    bottom: calc(100% + 16px);
    right: 0;
    width: 380px;
    max-height: 600px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(9,40,87,.22), 0 4px 16px rgba(9,40,87,.12);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(16px) scale(.97);
    transition: opacity .22s ease, transform .22s ease;
    z-index: 9999;
}
.chatbot-window.open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}
@media (max-width: 480px) {
    .chatbot-window { width: calc(100vw - 24px); right: -16px; }
    .metro-chat { right: 16px; bottom: 20px; }
}

/* ---------- Header ---------- */
.chatbot-header {
    background: linear-gradient(135deg, #092857 0%, #1457BD 100%);
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}
.chatbot-header-info { display: flex; align-items: center; gap: 12px; }
.chatbot-avatar {
    width: 40px; height: 40px;
    background: rgba(255,255,255,.15);
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.chatbot-avatar img { width: 22px; }
.chatbot-title { color: #fff; font-weight: 700; font-size: 15px; line-height: 1.2; }
.chatbot-status { color: rgba(255,255,255,.75); font-size: 12px; display: flex; align-items: center; gap: 5px; margin-top: 2px; }
.status-dot { width: 7px; height: 7px; background: #4ade80; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.chatbot-close {
    background: rgba(255,255,255,.15); border: none; color: #fff;
    width: 32px; height: 32px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; font-size: 18px; transition: background .2s;
}
.chatbot-close:hover { background: rgba(255,255,255,.28); }

/* ---------- Mesajlar ---------- */
.chatbot-messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    scroll-behavior: smooth;
    max-height: 390px;
}
.chat-msg { display: flex; flex-direction: column; max-width: 92%; }
.chat-msg.user { align-self: flex-end; align-items: flex-end; }
.chat-msg.bot  { align-self: flex-start; align-items: flex-start; }

.chat-bubble {
    padding: 11px 14px;
    border-radius: 16px;
    font-size: 13.5px;
    line-height: 1.6;
    word-break: break-word;
}
.chat-msg.user .chat-bubble {
    background: linear-gradient(135deg, #1457BD 0%, #092857 100%);
    color: #fff;
    border-bottom-right-radius: 4px;
}
.chat-msg.bot .chat-bubble {
    background: #f1f5f9;
    color: #1e293b;
    border-bottom-left-radius: 4px;
}

/* ---------- Hızlı Butonlar ---------- */
.chat-quick-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}
.qbtn {
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 20px;
    padding: 5px 13px;
    font-size: 12px;
    font-weight: 500;
    color: #334155;
    cursor: pointer;
    transition: all .18s ease;
    white-space: nowrap;
}
.qbtn:hover { background: #092857; color: #fff; border-color: #092857; }

/* ---------- Bağlantılar ---------- */
.chat-links {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.chat-link-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 12.5px;
    font-weight: 500;
    color: #1457BD;
    text-decoration: none;
    transition: all .18s ease;
    cursor: pointer;
}
.chat-link-item:hover { background: #1457BD; color: #fff; border-color: #1457BD; }
.chat-link-item i { font-size: 15px; flex-shrink: 0; }

/* ---------- Yazıyor indikatörü ---------- */
.chatbot-typing {
    padding: 6px 16px 2px;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}
.chatbot-typing span {
    width: 7px; height: 7px;
    background: #94a3b8;
    border-radius: 50%;
    animation: chatDot .9s infinite ease-in-out;
}
.chatbot-typing span:nth-child(2) { animation-delay: .15s; }
.chatbot-typing span:nth-child(3) { animation-delay: .30s; }
@keyframes chatDot {
    0%, 80%, 100% { transform: scale(.6); opacity: .5; }
    40% { transform: scale(1); opacity: 1; }
}

/* ---------- Input Alanı ---------- */
.chatbot-input-area {
    padding: 12px 14px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
    background: #fff;
}
.chatbot-input-area input {
    flex: 1;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    padding: 9px 14px;
    font-size: 13.5px;
    outline: none;
    color: #1e293b;
    background: #f8fafc;
    transition: border-color .2s;
}
.chatbot-input-area input:focus { border-color: #1457BD; background: #fff; }
.chatbot-input-area input::placeholder { color: #94a3b8; }
#chatSendBtn {
    width: 40px; height: 40px;
    background: linear-gradient(135deg, #1457BD 0%, #092857 100%);
    border: none; border-radius: 12px;
    color: #fff; font-size: 18px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; flex-shrink: 0;
    transition: filter .2s;
}
#chatSendBtn:hover { filter: brightness(1.12); }

.metro-chat .metro-chat-wrapper {}

.metro-chat .metro-chat-wrapper .metro-chat-box {
    background-color: #092857;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
    width: 120px;
    border-radius: 70px;
    gap: 10px;
    line-height: 1;
}

.metro-chat .metro-chat-wrapper .metro-chat-box .chat-icon {}

.metro-chat .metro-chat-wrapper .metro-chat-box .chat-icon img {
    width: 25px;
}

.metro-chat .metro-chat-wrapper .metro-chat-box .chat-content {
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
}

.metro-chat .metro-chat-wrapper .metro-chat-box .chat-content span {
    display: block;
    font-weight: 300;
}

.metro-chat .metro-chat-wrapper .metro-chat-box .shadow {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 140px;
    height: 90px;
    box-shadow: unset !important;
    background-color: rgb(9 40 87 / 20%);
    z-index: -1;
    border-radius: 90px;
}

.metro-chat .metro-chat-wrapper .metro-chat-box .shadow::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 160px;
    height: 110px;
    box-shadow: unset !important;
    background-color: rgb(9 40 87 / 5%);
    z-index: -2;
    border-radius: 90px;
}

.mobil-action-button {}

.mobil-action-button svg {}

.mobil-action-button svg path {
    stroke: #1457BD;
}

/** COURSES PAGE **/
.metro-courses-page { margin: 50px 0 100px; }
.metro-courses-page .page-head { margin-bottom: 40px; }
.courses-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 30px; }
.courses-card-page { display: flex; flex-direction: column; border: 1px solid #D0D0D0; border-radius: 25px; overflow: hidden; background: #fff; padding: 20px; }
.courses-card-page .card-content { order: 1; }
.courses-card-page .card-image { order: 2; }
.metro-courses-documents { margin-top: 60px; }

/** FAQ PAGE - Kurumsal, modern, mobil uyumlu **/
.metro-faq-page {
    margin: 0;
    padding: 40px 0 100px;
    background: linear-gradient(165deg, #f0f7ff 0%, #e8f2fc 35%, #f5fafd 100%);
    min-height: 50vh;
    position: relative;
}
.metro-faq-page .metro-faq-wrapper { background: transparent; }
.metro-faq-page .metro-faq-wrapper .row { --bs-gutter-x: 1.5rem; align-items: stretch; }
.metro-faq-page .faq-page-head {
    padding: 36px 32px;
    background: #fff;
    border-radius: 20px;
    margin-bottom: 28px;
    box-shadow: 0 2px 16px rgba(9,40,87,0.06), 0 1px 0 rgba(9,40,87,0.02);
    text-align: center;
    border: 1px solid rgba(9,40,87,0.04);
}
.metro-faq-page .faq-page-head .subtitle {
    display: block;
    font-size: 0.9rem;
    color: #64748b;
    margin-bottom: 10px;
    font-weight: 500;
    letter-spacing: 0.02em;
}
.metro-faq-page .faq-page-head h2 {
    font-size: clamp(1.5rem, 3.5vw, 1.85rem);
    color: #092857;
    margin: 0;
    font-weight: 600;
    line-height: 1.3;
}
.metro-faq-page .faq-page-head h2 span { text-decoration: underline; text-underline-offset: 6px; text-decoration-color: rgba(9,40,87,0.25); }
.faq-sidebar {
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: sticky;
    top: 24px;
}
.faq-category-link {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    color: #475569;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    font-weight: 500;
    font-size: 0.95rem;
    box-shadow: 0 1px 3px rgba(9,40,87,0.04);
}
.faq-category-link:hover {
    background: #f8fafc;
    color: #092857;
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(9,40,87,0.08);
}
.faq-category-link.active {
    background: linear-gradient(135deg, #092857 0%, #0d3566 100%);
    color: #fff;
    border-color: #092857;
    box-shadow: 0 4px 14px rgba(9,40,87,0.3);
}
.faq-category-link i { font-size: 1.25rem; flex-shrink: 0; opacity: 0.9; }
.faq-category-link.active i { opacity: 1; }
.faq-content {
    background: #fff;
    border-radius: 20px;
    padding: 28px 32px 36px;
    box-shadow: 0 2px 16px rgba(9,40,87,0.06), 0 1px 0 rgba(9,40,87,0.02);
    border: 1px solid rgba(9,40,87,0.04);
}
.faq-content .faq-category-block { margin-bottom: 0; }
.faq-content .faq-category-title { font-size: 1.3rem; color: #092857; margin-bottom: 12px; font-weight: 600; }
.faq-content .faq-category-desc { font-size: 1rem; color: #64748b; line-height: 1.65; }
.faq-content .d-flex.justify-content-end.mb-3 { margin-bottom: 16px !important; }
.faq-content #faq-expandall {
    font-size: 0.9rem;
    color: #1457BD;
    font-weight: 500;
}
.faq-content #faq-expandall:hover { color: #092857; text-decoration: underline !important; }
.faq-content .accordion-item {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    margin-bottom: 12px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.faq-content .accordion-item:hover { border-color: #cbd5e1; }
.faq-content .accordion-button {
    font-weight: 600;
    color: #334155;
    background: #f8fafc;
    padding: 18px 22px;
    font-size: 1rem;
    border: none;
    transition: background 0.2s ease, color 0.2s ease;
    box-shadow: none !important;
}
.faq-content .accordion-button:hover { background: #f1f5f9; color: #092857; }
.faq-content .accordion-button:not(.collapsed) {
    background: linear-gradient(135deg, #1457BD 0%, #0d3d8a 100%);
    color: #fff;
}
.faq-content .accordion-button::after { filter: brightness(0); transition: transform 0.25s ease; }
.faq-content .accordion-button:not(.collapsed)::after { filter: brightness(0) invert(1); }
.faq-content .accordion-collapse { transition: height 0.3s ease; }
.faq-content .accordion-body {
    padding: 22px 24px;
    background: #fff;
    color: #475569;
    line-height: 1.75;
    font-size: 0.98rem;
    border-top: 1px solid #f1f5f9;
}
.faq-content .accordion-body p { margin-bottom: 0.75em; }
.faq-content .accordion-body p:last-child { margin-bottom: 0; }
.faq-content .accordion-body embed,
.faq-content .accordion-body iframe[src*=".pdf"],
.faq-content .accordion-body object { width: 100%; min-height: 500px; border: 1px solid #e2e8f0; border-radius: 10px; margin-top: 8px; }
.faq-content .accordion-body img { max-width: 100%; height: auto; border-radius: 8px; display: block; position: static !important; z-index: 1; margin-top: 8px; }
.faq-content .accordion-body embed[type="application/pdf"] { min-height: 560px; background: #fff; }
@media (max-width: 991px) {
    .metro-faq-page { padding: 28px 0 60px; }
    .metro-faq-page .faq-page-head { padding: 28px 20px; margin-bottom: 24px; }
    .faq-sidebar { position: static; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 24px; }
    .faq-category-link { padding: 12px 16px; font-size: 0.9rem; }
    .faq-content { padding: 22px 20px 28px; }
    .faq-content .accordion-button { padding: 16px 18px; font-size: 0.95rem; }
    .faq-content .accordion-body { padding: 18px 20px; }
}
@media (max-width: 575px) {
    .faq-sidebar { flex-direction: column; }
    .faq-category-link { width: 100%; }
}

/* FAQ detail page hard-fix: keep left menu top-aligned */
.metro-faq-inner-page .faq-inner-row {
    align-items: flex-start !important;
}
.metro-faq-inner-page .faq-sidebar {
    position: static !important;
    top: auto !important;
}

/** COURSE DETAIL **/
.metro-course-detail { margin: 50px 0 100px; }
.course-detail-header { display: flex; gap: 40px; margin-bottom: 50px; flex-wrap: wrap; }
.course-detail-banner { flex: 1; min-width: 280px; background: linear-gradient(135deg, #092857 0%, #1457BD 100%); color: #fff; padding: 40px; border-radius: 25px; }
.course-detail-banner .banner-top { display: flex; gap: 30px; margin-bottom: 20px; flex-wrap: wrap; }
.course-detail-banner .banner-meta { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.course-detail-banner .banner-meta i { font-size: 18px; }
.course-detail-banner .course-title { font-size: 28px; margin: 0 0 15px; font-weight: 600; }
.course-detail-banner .course-meta-row { display: flex; gap: 25px; flex-wrap: wrap; font-size: 14px; opacity: 0.95; }
.course-detail-banner .course-meta-row i { margin-right: 5px; }
.course-detail-sidebar { width: 320px; flex-shrink: 0; }
.course-detail-sidebar .sidebar-card { background: #fff; border-radius: 25px; overflow: hidden; box-shadow: 0 4px 20px rgba(9,40,87,0.1); padding: 20px; }
.course-detail-sidebar .sidebar-image { position: relative; border-radius: 15px; overflow: hidden; margin-bottom: 15px; }
.course-detail-sidebar .sidebar-image img { width: 100%; height: 180px; object-fit: cover; }
.course-detail-sidebar .sidebar-price { color: #DA262E; font-weight: 600; margin-bottom: 15px; }
.course-detail-sidebar .sidebar-cta { display: block; text-align: center; padding: 15px; background: #DA262E; color: #fff; border-radius: 12px; font-weight: 600; }
.course-detail-sidebar .sidebar-cta:hover { background: #c41f27; color: #fff; }
.course-detail-tabs { background: #fff; border-radius: 25px; padding: 30px; box-shadow: 0 4px 20px rgba(9,40,87,0.08); }
.course-tabs { border-bottom: 2px solid #D0D0D0; margin-bottom: 25px; gap: 0; }
.course-tabs .nav-link { border: none; color: #092857; padding: 12px 24px; font-weight: 500; }
.course-tabs .nav-link.active { color: #1457BD; border-bottom: 2px solid #1457BD; margin-bottom: -2px; }
.curriculum-section { margin-bottom: 25px; }
.curriculum-section-title { font-weight: 600; color: #092857; margin-bottom: 12px; padding: 8px 0; }
.curriculum-items { border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; }
.curriculum-item { display: flex; align-items: center; gap: 15px; padding: 15px 20px; border-bottom: 1px solid #e2e8f0; }
.curriculum-item:last-child { border-bottom: none; }
.curriculum-item i { color: #1457BD; font-size: 20px; }
.curriculum-item-actions { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.instructor-info { display: flex; align-items: center; gap: 20px; padding: 30px; }
.instructor-avatar { width: 60px; height: 60px; background: #092857; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 24px; }
.documents-list { display: flex; flex-direction: column; gap: 15px; }
.document-item { display: flex; align-items: center; gap: 15px; padding: 15px; border: 1px solid #e2e8f0; border-radius: 12px; }
.document-item i { color: #DA262E; font-size: 24px; }
.document-item a { flex: 1; }

/** COURSE LESSON - Modern & Responsive **/
.metro-course-lesson { margin: 0; padding: 0; min-height: 100vh; background: #f1f5f9; position: relative; }
.lesson-wrapper { display: flex; max-width: 1400px; margin: 0 auto; min-height: 100vh; padding: 0 20px; }
.lesson-sidebar-toggle { position: fixed; top: 90px; left: 20px; z-index: 1001; width: 48px; height: 48px; border-radius: 12px; background: #092857; color: #fff; border: none; display: flex; align-items: center; justify-content: center; font-size: 22px; box-shadow: 0 4px 15px rgba(9,40,87,0.3); }
.lesson-sidebar-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 999; opacity: 0; transition: opacity 0.3s; }
.lesson-sidebar-overlay.active { display: block; opacity: 1; }
.course-lesson-sidebar { width: 380px; min-width: 380px; background: #fff; padding: 28px 24px; border-right: 1px solid #e2e8f0; box-shadow: 2px 0 20px rgba(9,40,87,0.06); flex-shrink: 0; overflow-y: auto; max-height: 100vh; }
.sidebar-search { position: relative; margin-bottom: 24px; }
.sidebar-search i { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #94a3b8; font-size: 18px; }
.sidebar-search input { border-radius: 10px; padding: 12px 18px 12px 44px; border: 1px solid #e2e8f0; width: 100%; font-size: 16px; background: #f8fafc; transition: border-color 0.2s; }
.sidebar-search input:focus { border-color: #092857; background: #fff; outline: none; }
.sidebar-search input::placeholder { color: #94a3b8; }
.sidebar-course-section { font-weight: 600; color: #092857; margin-bottom: 20px; font-size: 17px; line-height: 1.5; }
.sidebar-lessons { list-style: none; padding: 0; margin: 0; max-height: calc(100vh - 220px); overflow-y: auto; }
.sidebar-lessons li { margin-bottom: 6px; }
.sidebar-lessons li a { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 10px; color: #334155; font-size: 15px; transition: all 0.2s; }
.sidebar-lessons li a:hover { background: #f1f5f9; color: #092857; }
.sidebar-lessons li.active a { background: linear-gradient(90deg, #1457bd12 0%, #0928570a 100%); border-left: 3px solid #092857; color: #092857; font-weight: 500; }
.sidebar-lessons li a .lesson-num { font-weight: 600; color: #64748b; min-width: 26px; font-size: 14px; }
.sidebar-lessons li a .lesson-title-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-lessons li a .lesson-preview { font-size: 13px; color: #64748b; flex-shrink: 0; }
.sidebar-lessons li a .lesson-flag { color: #DA262E; font-size: 14px; margin-left: 4px; flex-shrink: 0; }
.sidebar-lessons li.lesson-hidden { display: none !important; }
.btn-show-more { width: 100%; padding: 12px; margin-top: 14px; background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 10px; color: #64748b; font-size: 15px; cursor: pointer; transition: all 0.2s; }
.btn-show-more:hover { background: #f1f5f9; color: #092857; border-color: #94a3b8; }
.course-lesson-main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #fff; }
.lesson-header { display: flex; justify-content: space-between; align-items: center; background: linear-gradient(135deg, #092857 0%, #1457BD 100%); color: #fff; padding: 16px 28px; }
.lesson-header h2 { margin: 0; font-size: 20px; font-weight: 600; }
.btn-close-lesson { color: #fff; font-size: 24px; padding: 6px; line-height: 1; border-radius: 8px; transition: background 0.2s; }
.btn-close-lesson:hover { background: rgba(255,255,255,0.15); color: #fff; }
.lesson-title { font-size: 20px; color: #092857; margin: 22px 28px 18px; font-weight: 600; }
.lesson-content { padding: 0 28px 28px; flex: 1; }
.lesson-video-wrap { max-width: 920px; margin: 0 auto 24px; width: 100%; }
.lesson-video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 16px; background: #0f172a; box-shadow: 0 10px 40px rgba(9,40,87,0.15); }
.lesson-video video, .lesson-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.lesson-document .metro-button { margin-bottom: 16px; }
.lesson-document .doc-preview { width: 100%; max-height: 60vh; border: 1px solid #e2e8f0; border-radius: 12px; }
.lesson-html-content { line-height: 1.7; color: #334155; }
.lesson-html-content h4 { color: #092857; font-size: 1.35rem; margin-bottom: 16px; }
.lesson-html-content h5 { color: #092857; font-size: 1.1rem; margin: 24px 0 12px; }
.lesson-html-content .lead { font-size: 1.05rem; color: #475569; margin-bottom: 20px; }
.lesson-html-content ul { margin-bottom: 20px; padding-left: 1.5rem; }
.lesson-html-content li { margin-bottom: 8px; }
.lesson-html-content .table { width: 100%; border-collapse: collapse; margin: 16px 0; border-radius: 10px; overflow: hidden; }
.lesson-html-content .table th, .lesson-html-content .table td { padding: 12px 16px; border: 1px solid #e2e8f0; }
.lesson-html-content .table th { background: #f8fafc; color: #092857; font-weight: 600; }
.lesson-nav { display: flex; justify-content: space-between; margin: 24px 28px 32px; padding-top: 20px; border-top: 1px solid #e2e8f0; }
.lesson-nav .metro-button { padding: 12px 24px; border-radius: 10px; font-size: 14px; font-weight: 600; transition: transform 0.2s; }
.lesson-nav .metro-button:hover { transform: translateY(-1px); }
.lesson-nav .metro-button.prev { background: #092857; color: #fff; }
.lesson-nav .metro-button.prev:hover { background: #071d3d; color: #fff; }
.lesson-nav .metro-button.next { background: #1457BD; color: #fff; }
.lesson-nav .metro-button.next:hover { background: #0d3d8a; color: #fff; }
@media (max-width: 991px) {
    .course-lesson-sidebar { position: fixed; top: 0; left: 0; width: 320px; min-width: 320px; height: 100vh; z-index: 1000; transform: translateX(-100%); transition: transform 0.3s ease; }
    .course-lesson-sidebar.sidebar-open { transform: translateX(0); }
    .lesson-wrapper { flex-direction: column; padding: 0 12px; }
    .course-lesson-main { width: 100%; }
    .lesson-sidebar-toggle { display: flex !important; }
}
@media (min-width: 992px) {
    .lesson-sidebar-toggle, .lesson-sidebar-overlay { display: none !important; }
}
@media (max-width: 575px) {
    .lesson-header { padding: 14px 16px; }
    .lesson-header h2 { font-size: 17px; }
    .lesson-title { font-size: 17px; margin: 18px 16px 14px; }
    .lesson-content { padding: 0 16px 20px; }
    .lesson-video { border-radius: 12px; }
    .lesson-nav { margin: 20px 16px 24px; flex-wrap: wrap; gap: 12px; }
    .lesson-nav .metro-button { flex: 1; min-width: 120px; text-align: center; font-size: 15px; }
}

/** LEGAL PAGES (Gizlilik, Kullanım Şartları) **/
.page-legal .metro-linear { opacity: 0.45; }
.metro-legal-page { margin: 0; padding: 0 0 80px; min-height: 60vh; background: linear-gradient(180deg, #f0f7ff 0%, #f8fafc 45%, #f1f5f9 100%); position: relative; overflow: hidden; }
.metro-legal-hero { position: relative; padding: 28px 0 48px; color: #fff; }
.metro-legal-hero-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #092857 0%, #0d3566 42%, #1457BD 100%);
    clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%);
}
.metro-legal-hero-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    opacity: 0.9;
}
.metro-legal-hero .container { position: relative; z-index: 1; }
.metro-legal-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 0.875rem; margin-bottom: 24px; opacity: 0.92; }
.metro-legal-breadcrumb a { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; transition: opacity 0.2s; }
.metro-legal-breadcrumb a:hover { opacity: 0.85; text-decoration: underline; }
.metro-legal-breadcrumb .sep { opacity: 0.7; }
.metro-legal-breadcrumb .current { color: rgba(255,255,255,0.85); font-weight: 500; }
.metro-legal-hero-inner { max-width: 720px; }
.metro-legal-hero-icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin-bottom: 18px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}
.metro-legal-eyebrow {
    font-family: "Konnect", "Sora", sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.85);
    margin-bottom: 8px;
}
.metro-legal-title {
    font-family: "Konnect", sans-serif;
    font-size: clamp(1.65rem, 4vw, 2.25rem);
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 14px;
    letter-spacing: -0.02em;
}
.metro-legal-company {
    font-size: 1rem;
    margin: 0 0 10px;
    opacity: 0.95;
    display: flex;
    align-items: center;
    gap: 8px;
}
.metro-legal-updated {
    font-size: 0.875rem;
    margin: 0;
    opacity: 0.85;
    display: flex;
    align-items: center;
    gap: 8px;
}
.metro-legal-main-wrap { margin-top: -36px; position: relative; z-index: 2; padding-bottom: 0; }
.metro-legal-card {
    background: #fff;
    border-radius: 24px;
    border: 1px solid rgba(9, 40, 87, 0.08);
    box-shadow: 0 4px 40px rgba(9, 40, 87, 0.08), 0 1px 0 rgba(9, 40, 87, 0.04);
    padding: 0;
    overflow: hidden;
}
.metro-legal-sibling {
    padding: 16px 24px;
    background: linear-gradient(90deg, rgba(20,87,189,0.1) 0%, rgba(9,40,87,0.05) 100%);
    border-bottom: 1px solid rgba(9, 40, 87, 0.06);
}
.metro-legal-sibling-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #092857;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    transition: color 0.2s, gap 0.2s;
}
.metro-legal-sibling-link:hover { color: #1457BD; gap: 12px; }
.metro-legal-sibling-link .ri-arrow-right-up-line { font-size: 1.1rem; opacity: 0.85; }
.metro-legal-content {
    padding: 36px 32px 28px;
    font-size: 1.02rem;
    line-height: 1.75;
    color: #334155;
}
@media (min-width: 768px) {
    .metro-legal-content { padding: 44px 48px 36px; }
}
.metro-legal-content .legal-section-text.legal-block:first-child p {
    font-size: 1.12rem;
    color: #475569;
    font-weight: 500;
    line-height: 1.65;
}
.metro-legal-content .legal-section-heading {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin: 0 0 16px;
    padding-top: 28px;
    font-family: "Konnect", sans-serif;
    font-size: 1.2rem;
    font-weight: 600;
    color: #092857;
    line-height: 1.35;
    border-top: 1px solid #e2e8f0;
}
.metro-legal-content .legal-section-heading:first-child {
    border-top: none;
    padding-top: 0;
}
.metro-legal-content .legal-section-badge {
    flex-shrink: 0;
    min-width: 36px;
    height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, #1457BD 0%, #092857 100%);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(20, 87, 189, 0.35);
}
.metro-legal-content .legal-section-heading-text { flex: 1; min-width: 0; padding-top: 4px; }
.metro-legal-content .legal-section-text {
    margin-bottom: 8px;
}
.metro-legal-content .legal-section-text p {
    margin-bottom: 1rem;
}
.metro-legal-content .legal-section-text + .legal-section-heading {
    margin-top: 8px;
}
.metro-legal-empty {
    text-align: center;
    padding: 48px 24px;
    color: #64748b;
}
.metro-legal-empty i { font-size: 3rem; opacity: 0.35; display: block; margin-bottom: 16px; }
.metro-legal-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 0 32px 32px;
    border-top: 1px solid #f1f5f9;
    background: #fafbfc;
}
@media (min-width: 768px) {
    .metro-legal-actions { padding: 0 48px 36px; }
}
.metro-legal-back.metro-button {
    background: #092857;
    color: #fff;
    border: none;
    padding: 12px 22px;
    border-radius: 14px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}
.metro-legal-back.metro-button:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(9,40,87,0.25); }
.metro-legal-print {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #475569;
    padding: 10px 18px;
    border-radius: 12px;
    font-weight: 500;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}
.metro-legal-print:hover { border-color: #092857; color: #092857; }
@media (max-width: 575px) {
    .metro-legal-hero { padding: 20px 0 40px; }
    .metro-legal-main-wrap { margin-top: -28px; }
    .metro-legal-content { padding: 28px 20px 20px; font-size: 1rem; }
    .metro-legal-actions { flex-direction: column; align-items: stretch; padding: 0 20px 24px; }
    .metro-legal-back.metro-button, .metro-legal-print { justify-content: center; width: 100%; }
}
@media print {
    .metro-header, .metro-footer, .metro-linear, .mobile-menu, .ham, .chatbot, .metro-legal-breadcrumb, .metro-legal-sibling, .metro-legal-actions, .metro-legal-hero-icon, .metro-legal-print { display: none !important; }
    .metro-legal-hero { padding: 20px 0 !important; color: #000 !important; page-break-after: avoid; }
    .metro-legal-hero-bg { background: none !important; clip-path: none !important; }
    .metro-legal-hero-bg::after { display: none !important; }
    .metro-legal-title { color: #092857 !important; }
    .metro-legal-company, .metro-legal-updated, .metro-legal-eyebrow { color: #333 !important; }
    .metro-legal-page { background: #fff !important; padding-bottom: 0 !important; }
    .metro-legal-card { box-shadow: none !important; border: 1px solid #ddd !important; }
    .metro-legal-main-wrap { margin-top: 0 !important; }
}