@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700&display=swap');
#arayalim b, #bizimkiler span, .vitrin-5 .col-md-3 div, .vitrin-baslik {
    text-align: center;
}
#whatsapp form button, .buton1:hover, .buton2:hover, .buton3:hover, .buton4:hover, .buton5:hover, .ozellik li:hover img, .vitrin-1 .col-md-4 ul li:hover>.img img, .vitrin-4 .col-md-4 span:hover img, footer .sol ul li a img:hover {
    animation: 1s infinite zoom-in-zoom-out;
}
.ozellik li div b, .ozellik-dis h3, .vitrin-1 ul li h3, .vitrin-4 .col-md-4 span div h3, .vitrin-baslik h3 {
    -webkit-text-fill-color: transparent!important;
}
#slider ul, ul {
    list-style: none;
}
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    background: red;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #b30000;
}
@-moz-keyframes spin {
    100% {
    -moz-transform: rotate(360deg);
}
}@-webkit-keyframes spin {
    100% {
    -webkit-transform: rotate(360deg);
}
}@keyframes spin {
    100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}
}@keyframes zoom-in-zoom-out {
    0%, 100% {
    transform: scale(1, 1);
}
50% {
    transform: scale(1.08, 1.08);
}
}@keyframes gradient {
    0%, 100% {
    background-position: 0 50%}
50% {
    background-position: 100% 50%}
}*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body {
    color: #000001;
    font-family: Nunito, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 0;
}
body, h1, h2, h3, h4, h5, h6, p, ul {
    padding: 0;
    margin: 0;
}
img {
    max-width: 100%}
a {
    text-decoration: none;
    color: #000002;
}
.container, .container-fluid {
    display: flow-root;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
#anasayfa-slider .row .metin-slider span, #yukari, .hidden {
    display: none;
}
.col-md-12, .container-fluid, .reklam img {
    width: 100%}
.container, header {
    width: 90%}
.row {
    margin-right: -15px;
    margin-left: -15px;
}
.row:after, .row:before {
    display: table;
    content: ""}
.row:after {
    clear: both;
}
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9 {
    float: left;
}
.col-md-1 {
    width: 8.33333333%}
.col-md-2 {
    width: 16.66666667%}
.col-md-3 {
    width: 25%}
.col-md-4 {
    width: 33.33333333%}
.col-md-5 {
    width: 41.66666667%}
.col-md-6 {
    width: 50%}
.col-md-7 {
    width: 58.33333333%}
.col-md-8 {
    width: 66.66666667%}
.col-md-9 {
    width: 75%}
.col-md-10 {
    width: 83.33333333%}
.col-md-11 {
    width: 91.66666667%}
.mt-5 {
    margin-top: 5px;
}
.mt-10 {
    margin-top: 10px;
}
.mt-15 {
    margin-top: 15px;
}
.mt-20 {
    margin-top: 20px;
}
.mt-25 {
    margin-top: 25px;
}
.mb-0 {
    margin-bottom: 0;
}
.mb-5 {
    margin-bottom: 5px;
}
.mb-10 {
    margin-bottom: 10px;
}
.mb-15 {
    margin-bottom: 15px;
}
.mb-20, .vitrin-1 .vitrin-baslik, .vitrin-2 .vitrin-baslik, .vitrin-3 .vitrin-baslik, .vitrin-4 .vitrin-baslik, .vitrin-5 .vitrin-baslik, .vitrin-6 .vitrin-baslik, .yorum .vitrin-baslik {
    margin-bottom: 20px;
}
.mb-25 {
    margin-bottom: 25px;
}
.mr-5 {
    margin-right: 5px;
}
.mr-10 {
    margin-right: 10px;
}
.mr-15 {
    margin-right: 15px;
}
.mr-20 {
    margin-right: 20px;
}
.mr-25 {
    margin-right: 25px;
}
.ml-0 {
    margin-left: 0;
}
.ml-5 {
    margin-left: 5px;
}
.ml-10 {
    margin-left: 10px;
}
.ml-15 {
    margin-left: 15px;
}
.ml-20 {
    margin-left: 20px;
}
.ml-25 {
    margin-left: 25px;
}
.pt-5 {
    padding-top: 5px;
}
.pt-10 {
    padding-top: 10px;
}
.pt-15 {
    padding-top: 15px;
}
.pt-20 {
    padding-top: 20px;
}
.pt-25 {
    padding-top: 25px;
}
.pb-0 {
    padding-bottom: 0;
}
.pb-5 {
    padding-bottom: 5px;
}
#whatsapp form, .pb-10 {
    padding-bottom: 10px;
}
.pb-15 {
    padding-bottom: 15px;
}
.pb-20 {
    padding-bottom: 20px;
}
.pb-25 {
    padding-bottom: 25px;
}
.pr-5 {
    padding-right: 5px;
}
.pr-10, .vitrin-1 ul {
    padding-right: 10px;
}
.pr-15 {
    padding-right: 15px;
}
.pr-20 {
    padding-right: 20px;
}
.pr-25 {
    padding-right: 25px;
}
.pl-0 {
    padding-left: 0;
}
.pl-5 {
    padding-left: 5px;
}
.pl-10 {
    padding-left: 10px;
}
.pl-15 {
    padding-left: 15px;
}
.pl-20 {
    padding-left: 20px;
}
.pl-25 {
    padding-left: 25px;
}
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}
.reklam {
    position: relative;
    display: flex;
    width: 100%}
.reklam:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0 0 10px #000;
}
#yukari {
    width: 30px;
    height: 30px;
    border: 2px solid #45a041;
    box-shadow: 0 0 4px #2cc9ff;
    background: url(../images/yukari.gif) center/88% no-repeat #fff;
    position: fixed;
    right: 20px;
    bottom: 65px;
    z-index: 9;
    transform: rotate(-90deg);
    border-radius: 25%;
    cursor: pointer;
}
#bizimkiler, header {
    border-radius: 0 0 20px 20px;
    position: fixed;
}
#menu-bg, #menu-bg:before {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    border-radius: 0 0 10px 10px;
    z-index: 9999;
}
#menu-bg {
    background: linear-gradient(90deg, #000 0, #034d53 50%, #000 100%);
    box-shadow: inset 0 0 120px #000;
}
#menu-bg:before {
    content: '';
    box-shadow: 0 0 20px #000;
}
.menu-icon {
    float: left;
    width: 20px;
    height: 20px;
    background-size: 100%!important;
    background-repeat: no-repeat!important;
    margin-right: 0px;
}


#bizimkiler #atlas, #bizimkiler #jamiryo {
    content: '';
    position: absolute;
    bottom: 0;
    background-size: auto 100%!important;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}
#bizimkiler #jamiryo {
    width: 60px;
    height: 25px;
    background: url(../images/jamiryo.gif) center no-repeat;
    left: -50px;
}
#bizimkiler #atlas {
    width: 90px;
    height: 40px;
    background: url(../images/atlas.gif) center no-repeat;
    left: -200px;
}
#bizimkiler span {
    position: relative;
    float: left;
    left: 0;
    top: 0;
    width: 0;
    height: 100%}
#bizimkiler span p {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 50px;
    color: #fff;
    font-weight: 900;
    text-shadow: 0 0 10px #000;
}
#bizimkiler span b {
    color: #00ff8c;
}
#anasayfa-slider {
    position: relative;
    height: 65vh;
    overflow: hidden;
}
#anasayfa-slider .row {
    margin-top: 220px;
    display: block;
    text-align: center;
}
#anasayfa-slider .row .slogan1 {
    font-size: 33px;
    color: #fff;
    font-weight: 900;
    text-shadow: 0 0 5px #4475fc;
    line-height: 33px;
}
#anasayfa-slider .row .slogan2 {
    font-size: 25px;
    color: #fff;
    font-weight: 900;
    text-shadow: 0 0 5px #ff0000;
    line-height: 44px;
}
#anasayfa-slider .row .slogan3 {
    font-size: 25px;
    color: #fff;
    font-weight: 900;
    text-shadow: 0 0 5px #ff0070;
    line-height: 44px;
    text-decoration: underline;
}
#arayalim b, footer {
    text-shadow: 0 0 10px #000;
}
#anasayfa-slider .row .metin-slider {
    display: flex;
    font-size: 38px;
    color: #ffffff;
    font-weight: 900;
    text-shadow: 0 0 30px #333333;
    justify-content: center;
    flex-direction: column;
    padding: 20px 0;
}
#anasayfa-slider .row .metin-slider span.aktif {
    display: block!important;
}
#anasayfa-slider .row .video1, #anasayfa-slider .row .video2 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%}
#anasayfa-slider .row .video1 {
    z-index: -1;
}
#anasayfa-slider .row .video2 {
    z-index: -1;
    opacity: .5;
}
#anasayfa-slider .row .resim {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    display: flex;
    align-items: center;
    justify-content: center;
}
#anasayfa-slider .row .resim img{
    width: 100%;
    height: auto;
}
#anasayfa-slider .iletisim, .vitrin-3 .tab-menu, footer .sol ul {
    display: flex;
    justify-content: center;
}
#anasayfa-slider .iletisim a {
    margin: 0 8px;
    background: #3ab77e;
    background: -moz-linear-gradient(left, #3ab77e 0, #2196f3 100%);
    background: -webkit-linear-gradient(left, #3ab77e 0, #2196f3 100%);
    background: linear-gradient(to right, #3ab77e 0, #2196f3 100%);
    -webkit-box-shadow: 0 10px 15px 0 rgb(56 0 189 / 20%);
    box-shadow: 0 10px 15px 0 rgb(0 0 0 / 20%);
    line-height: 17px;
    color: #fff;
    border-radius: 100px;
    padding: 7px 20px 7px 45px;
    overflow: hidden;
    position: relative;
    text-shadow: 0 0 4px #000;
    cursor: pointer;
}
#anasayfa-slider .iletisim a:before {
    position: absolute;
    content: '';
    background-size: 100%!important;
    width: 30px;
    height: 30px;
    left: 12px;
    top: 8px;
}
#anasayfa-slider .iletisim a:first-child:before {
    background: url(../images/soru.png) no-repeat;
}
#anasayfa-slider .iletisim a:last-child:before {
    background: url(../images/teklif.png) no-repeat;
}
#anasayfa-slider .iletisim a:after {
    content: ''}
#arayalim {
    position: absolute;
    width: 40%;
    left: 30%;
    bottom: 50px;
    box-shadow: inset 0 0 10px #041c30;
    background: -webkit-gradient(linear, left top, right top, from(#134046), color-stop(#267781), to(#134046));
    background: -webkit-linear-gradient(left, #134046, #267781, #134046);
    background: -o-linear-gradient(left, #134046, #267781, #134046);
    background: linear-gradient(to right, #134046, #267781, #134046);
    border-radius: 35px 35px 0 0;
}
#arayalim b {
    float: left;
    width: 100%;
    margin: 10px 0 5px;
    color: #fff;
}
#arayalim div {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    background: #00000029;
    padding: 10px;
}
#arayalim div input {
    width: 40%;
    height: 35px;
    padding-left: 15px;
    border-radius: 6px;
    border: none;
    outline: 0;
    box-shadow: 0 0 4px #000;
    background: #00000045;
    color: #fff;
}
#arayalim input::placeholder {
    color: #ffffffa1;
    opacity: 1;
}
#arayalim input:-ms-input-placeholder {
    color: #ffffffa1;
}
#arayalim input::-ms-input-placeholder {
    color: #ffffffa1;
}
#arayalim div span {
    background: #236c75;
    color: #fff;
    padding: 0 10px;
    height: 32px;
    line-height: 32px;
    box-shadow: 0 0 6px #383838;
    border-radius: 5px;
    cursor: pointer;
}


/* Genel resim boyutu */
.vitrin-1 .img img {
  width: 100px !important;
  height: 100px !important;
  object-fit: cover; /* Resmin kırpılmadan düzgün görünmesi için */
}

/* Sol taraftaki resimler (sadece sağ köşeler yuvarlak) */
.vitrin-1 .sol-ul .img img {
  border-top-right-radius: 25%;
  border-bottom-right-radius: 25%;
}

/* Sağ taraftaki resimler (sadece sol köşeler yuvarlak) */
.vitrin-1 .sag-ul .img img {
  border-top-left-radius: 25%;
  border-bottom-left-radius: 25%;
}

/* Mobilde tersine çevir */
@media (max-width: 767px) {
.vitrin-1 .img img {
  width: 80px !important;
  height: 80px !important;
  object-fit: cover; /* resimler düzgün kalsın */
}
  .vitrin-1 .sol-ul .img img {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 25%;
    border-bottom-left-radius: 25%;
  }
  .vitrin-1 .sag-ul .img img {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 25%;
    border-bottom-right-radius: 25%;
  }
}


.vitrin-baslik h3 {
    -webkit-background-clip: text!important;
    font-size: 29px;
}
.vitrin-1, .vitrin-5 {
    background: #f7f7f7;
}
.vitrin-1 .vitrin-baslik h3 {
    background: -webkit-gradient(linear, left top, right top, from(#000), color-stop(#ff7b3a), to(#000));
    background: -webkit-linear-gradient(left, #000, #ff7b3a, #000);
    background: -o-linear-gradient(left, #000, #ff7b3a, #000);
    background: linear-gradient(to right, #ff7b3a, #ff7b3a, #ff7b3a);
}
.vitrin-1 .vitrin-baslik p, .vitrin-3 .vitrin-baslik p, .vitrin-4 .vitrin-baslik p, .vitrin-5 .vitrin-baslik p, .yorum .vitrin-baslik p {
    font-size: 16px;
    color: #155d88;
    font-weight: 700;
}
.vitrin-1 ul {
    text-align: right;
    border-right: 1px solid #e9e9e9;
}
.vitrin-1 ul li {
    position: relative;
    padding: 20px 0;
}
.vitrin-1 ul li h3 {
    font-weight: 900;
    background: -webkit-gradient(linear, left top, right top, from(#12c2e9), color-stop(#333333), to(#12c2e9));
    background: -webkit-linear-gradient(left, #12c2e9, #333333, #12c2e9);
    background: -o-linear-gradient(left, #12c2e9, #333333, #12c2e9);
    background: linear-gradient(to right, #12c2e9, #333333, #12c2e9);
    -webkit-background-clip: text!important;
}
.vitrin-1 ul li p {
    font-size: 14px;
    color: #7e7e7e;
}
.vitrin-1 ul li .img {
    position: absolute;
    z-index: 1;
    /*padding: 15px;*/
    top: calc(50% - 45px);
    /*border: 1px solid #ddd;*/
    /*box-shadow: 0 10px 30px -10px #5d5d5dad;*/
    /*background: #fff;*/
}
.vitrin-1 .col-md-4:first-child ul li .img {
    right: -112px;
    border-left: 0;
    border-radius: 0 30px 30px 0;
}
.vitrin-1 .col-md-4:nth-child(2) a {
    width: 75%;
    display: block;
    margin: 0 auto;
}
.vitrin-1 .col-md-4:last-child ul li .img {
    left: -112px;
    border-right: 0;
    border-radius: 30px 0 0 30px;
}
.vitrin-1 .col-md-4:last-child ul {
    text-align: left;
    border-left: 1px solid #e9e9e9;
    padding-left: 10px;
    border-right: 0px;
}
.vitrin-2 {
    position: relative;
    z-index: 1;
    box-shadow: 0 0 20px #000;
    overflow: hidden;
}
.vitrin-2 .vitrin-baslik h3 {
    background: -webkit-gradient(linear, left top, right top, from(#90ff00), color-stop(#11ffc7), to(#ff7b3a));
    background: -webkit-linear-gradient(left, #90ff00, #11ffc7, #ff7b3a);
    background: -o-linear-gradient(left, #90ff00, #11ffc7, #ff7b3a);
    background: linear-gradient(to right, #fff, #fff, #cbff00);
}
.vitrin-2 .vitrin-baslik p {
    font-size: 16px;
    color: #fff;
}
.vitrin-2 .background {
    background-size: auto 100%!important;
    background-position: center center!important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}
.vitrin-2 .video {
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%}
.adres-cubugu .video video, .ic-sayfa .video video, .vitrin-2 .video video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -2;
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
    transition: opacity 1s;
}
.vitrin-5 .col-md-3 div, .vitrin-6, footer {
    z-index: 1;
    position: relative;
}
.vitrin-2 .saydam {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .9;
    z-index: -1;
    box-shadow: inset 0 0 130px #000000;
}
.vitrin-3, .vitrin-4 {
    background: #fff;
}
.vitrin-3 .vitrin-baslik h3, .vitrin-4 .vitrin-baslik h3, .vitrin-5 .vitrin-baslik h3 {
    background: -webkit-gradient(linear, left top, right top, from(#000), color-stop(#ff0070), to(#000));
    background: -webkit-linear-gradient(left, #000, #ff0070, #000);
    background: -o-linear-gradient(left, #000, #ff0070, #000);
    background: linear-gradient(to right, #000, #ff0070, #000);
}
.vitrin-3 .tab-menu li {
    display: flex;
    align-items: center;
    margin-right: 10px;
    background: linear-gradient(to left, #25c4ad, #002c26);
    box-shadow: 0 0 5px #00000096;
    border-radius: 10px 10px 0;
    overflow: hidden;
    cursor: pointer;
}
.vitrin-3 .tab-menu li.aktif {
    background: linear-gradient(to left, #2579c4, #244863);
}
.vitrin-3 .tab-menu li img {
    height: 30px;
    background: #fff;
    padding: 3px;
    border-radius: 50%;
    margin: 3px;
}
.vitrin-3 .tab-menu li h3 {
    font-size: 15px;
    color: #fff;
    text-shadow: 0 0 5px #000;
    line-height: 15px;
    padding-right: 10px;
}
#whatsapp form, .adres-cubugu .fiyatlar-dis, .post-thumb a, .post-thumb a img, .vitrin-3 .tab-icerik {
    float: left;
    width: 100%}
.vitrin-3 .tab-icerik li {
    background: #fff;
    overflow: hidden;
    display: none;
}
.vitrin-3 .tab-icerik li.aktif {
    display: block;
}
.vitrin-3 .tab-icerik li .col-md-3 div {
    position: relative;
    display: flow-root;
    width: 88%;
    margin: 0 auto 40px;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 0 15px #e3dcdc;
    border-radius: 10px;
    padding: 15px;
    text-align: center;
}
.vitrin-3 .tab-icerik li .col-md-3 div:after {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    z-index: -1;
    background: -webkit-gradient(linear, left top, right top, from(#12c2e9), color-stop(#c471ed), to(#f64f59));
    background: -webkit-linear-gradient(left, #12c2e9, #c471ed, #f64f59);
    background: -o-linear-gradient(left, #12c2e9, #c471ed, #f64f59);
    background: linear-gradient(to right, #12c2e9, #c471ed, #f64f59);
    border-radius: 15px;
    -webkit-transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    transform: rotate(-3deg);
    transition: .5s;
}
.vitrin-3 .tab-icerik li .col-md-3 div:hover:after {
    transform: rotate(3deg);
}
.vitrin-3 .tab-icerik li .col-md-3 div img {
    float: left;
    width: 100%;
    height: auto;
    border: 1px solid #f5f2f2;
    border-radius: 4px;
    margin-bottom: 15px;
}
.vitrin-3 .tab-icerik li .col-md-3 div b {
    float: left;
    width: 100%;
    text-align: center;
    color: #253d4e;
    overflow: hidden;
    display: -webkit-box;
    height: 35px;
    line-height: 18px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 8px 0;
    font-size: 14px;
}
.vitrin-3 .tab-icerik li .col-md-3 p {
    position: relative;
    float: left;
    width: 100%}
.vitrin-3 .tab-icerik li .col-md-3 div .piyasa_fiyat {
    font-size: 18px;
    color: #f36069;
    float: left;
    width: 100%;
    line-height: 15px;
    text-decoration: line-through;
}
.vitrin-3 .tab-icerik li .col-md-3 div .indirim {
    position: absolute;
    right: 0;
    top: 0;
    background: #d73842;
    color: #fff;
    font-size: 11px;
    padding: 6px 3px;
    border-radius: 9px;
    border: 1px solid #7b1414;
    box-shadow: inset 0 0 10px #6d0909;
}
.vitrin-3 .tab-icerik li .col-md-3 div .fiyat {
    font-size: 18px;
    font-weight: 700;
    color: #3bb77e;
    float: left;
    width: 100%;
    line-height: 15px;
    margin-top: 5px;
    text-shadow: 0 1px 2px #00ff8c;
}
.vitrin-3 .tab-icerik li .col-md-3 div .link1, .vitrin-3 .tab-icerik li .col-md-3 div .link2, .vitrin-3 .tab-icerik li .col-md-3 div .link3 {
    box-shadow: 0 0 3px #f35f69;
    margin: 10px auto 0;
    display: table;
    background: #f35f69;
    padding: 0 10px;
    color: #fff;
    border-radius: 5px;
    font-size: 13px;
}
.vitrin-3 .tab-icerik li .col-md-3 div .link2 {
    background: #c1a0e7;
    box-shadow: 0 0 3px #c1a0e7;
}
.vitrin-3 .tab-icerik li .col-md-3 div .link3 {
    background: #06b291;
    box-shadow: 0 0 3px #066c58;
}
.vitrin-3 .tab-icerik li .col-md-3 div .link1:hover, .vitrin-3 .tab-icerik li .col-md-3 div .link2:hover, .vitrin-3 .tab-icerik li .col-md-3 div .link3:hover {
    background: #59bae8;
    box-shadow: 0 0 3px #59bae8;
}
.vitrin-3 .tab-icerik .tab-icerik-aciklama {
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-top: 25px;
    background: linear-gradient(to left, #fff, #1d2124);
}
.vitrin-3 .tab-icerik .img-dis {
    display: flex;
    width: 100%;
    margin: 0;
    align-items: center;
    height: 275px;
    overflow: hidden;
}
.vitrin-3 .tab-icerik .tab-icerik-aciklama img {
    width: 100px;
    margin: 0 25px;
    border-radius: 50%;
    border: 1px solid #dddd;
}
.vitrin-3 .tab-icerik .tab-icerik-aciklama div {
    background: linear-gradient(to left, #fff, #fff);
    padding: 10px 30px;
    border-radius: 50px 0 0 50px;
    margin: 10px 0;
}
.vitrin-3 .tab-icerik .tab-icerik-urun {
    float: left;
    width: 100%;
    padding: 50px 20px 20px;
    border-bottom: 0;
    position: relative;
    z-index: 0;
    display: flex;
    flex-wrap: wrap;
}
.vitrin-4 .col-md-4 span {
    cursor: pointer;
    position: relative;
    float: left;
    padding: 15px;
    margin: 10px 10px 25px;
    height: 155px;
    border-top: 1px solid #ededed;
    border-left: 1px solid #ededed;
    border-right: 1px solid #ededed;
    border-radius: 10px;
    -webkit-box-shadow: 0 3.4px 2.7px -30px rgb(0 0 0 / 6%), 0 8.2px 8.9px -30px rgb(0 0 0 / 7%), 0 25px 40px -30px rgb(0 0 0 / 20%);
    box-shadow: 0 3.4px 2.7px -30px rgb(0 0 0 / 6%), 0 8.2px 8.9px -30px rgb(0 0 0 / 7%), 0 25px 40px -30px rgb(0 0 0 / 20%);
}
.vitrin-4 .col-md-4 span img {
    width: 60px;
    position: absolute;
    top: -20px;
}
.vitrin-4 .col-md-4 span div {
    display: flow-root;
    text-align: left;
}
.vitrin-4 .col-md-4 span div h3 {
    background: -webkit-gradient(linear, left top, right top, from(#000), color-stop(#ff0070), to(#000));
    background: -webkit-linear-gradient(left, #000, #ff0070, #000);
    background: -o-linear-gradient(left, #000, #ff0070, #000);
    background: linear-gradient(to right, #000, #ff0070, #000);
    -webkit-background-clip: text!important;
    padding-left: 70px;
    font-size: 21px;
}
.vitrin-4 .col-md-4 span div p {
    line-height: 21px;
    font-size: 14px;
}
.vitrin-5 .col-md-3 div:before {
    content: '';
    position: absolute;
    background: url(../images/sag-ok.png) center/100% no-repeat;
    right: 0;
    top: 10px;
    width: 60px;
    height: 60px;
}
.vitrin-5 .col-md-3 div span {
    width: 80px;
    display: table;
    margin: 0 auto 15px;
    padding: 10px 15px;
    border-radius: 10px 40px;
    position: relative;
    box-shadow: 0 0 10px #000;
}
.vitrin-5 .col-md-3 div span b {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    border-radius: 10px 20px;
    animation: 6s linear infinite spin;
}
.vitrin-5 .col-md-3 div p {
    font-size: 14px;
    color: #434343;
    padding: 0 25px;
    margin-bottom: 10px;
}
.vitrin-6 {
    background: linear-gradient(-45deg, #2a828c, #000, #20435f, #19535b);
    background-size: 400% 400%;
    animation: 15s infinite gradient;
    color: #fff;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: inset 0 0 10px #000;
}
.vitrin-6 .vitrin-baslik h3 {
    background: -webkit-gradient(linear, left top, right top, from(#000), color-stop(#ff7b3a), to(#000));
    background: -webkit-linear-gradient(left, #000, ff7b3a, #ff7b3a);
    background: -o-linear-gradient(left, #000, #ff7b3a, #000);
    background: linear-gradient(to right, #ff7b3a, #ff7b3a, #ff7b3a);
}
.vitrin-6 .bg-1, .vitrin-6 .bg-2 {
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/bg-1.png) 0 0/auto 100% no-repeat;
    opacity: .2;
}
.vitrin-6 .bg-2 {
    background-repeat-x: no-repeat;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}
.vitrin-6 .scroll p {
    font-size: 14.5px;
    text-align: center;
    width: 84%;
    margin: 0 auto;
    text-shadow: 0 0 2px #535050;
}
.vitrin-6 .etiket {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 15px;
}
.vitrin-6 .etiket a {
    background: #00000091;
    color: #fff;
    font-size: 13px;
    padding: 3px 14px;
    display: inline-flex;
    margin: 5px;
    box-shadow: inset 0 0 4px #000;
    border-radius: 6px;
}
.vitrin-6 .etiket a:before {
    content: '#';
    margin-right: 4px;
    color: #ff7b3a;
}
.vitrin-6 .etiket a:hover {
    background: #f16c2c;
}
footer {
    background: #333549;
    border-top: 5px dashed #ff7b3a;
    color: #fff;
    box-shadow: inset 0 0 30px #000;
}
footer:before {
    content: '';
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/footer-bg.png) top center/auto 50% no-repeat #0000003b;
    opacity: .7;
}
#sayfa-iletisim-form, #slider, #slider ul, #slider ul li, .adres-cubugu, .ic-sayfa, .ic-sayfa .container, .loop-grid article, .post-thumb, footer .icerik h4 {
    position: relative;
}
footer .row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
footer .sol .logo {
    width: 50%;
    margin: 0 auto;
}
#sayfa-iletisim-form label, footer .sol p {
    font-size: 13px;
}
footer .sol span {
    display: flex;
    justify-content: center;
    padding: 10px 0;
    font-size: 17px;
    color: #ffffff;
    text-shadow: 0 0 5px #000;
}
footer .sol ul li a {
    float: left;
    padding: 0;
    margin: 0;
    display: grid;
}
footer .sol ul li a img {
    width: 25px;
    border-radius: 4px;
    box-shadow: 0 0 5px #1a1b2f;
    margin: 0 5px;
}
footer .sol .duyuru {
    position: absolute;
    left: 0;
    bottom: 0;
}
footer .buton1:before, footer .buton2:before {
    content: '';
    background-size: auto 64%!important;
    background-position: 12px 7px!important;
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 100%}
footer .buton1:before {
    background: url(../images/telefon.png) no-repeat;
}
footer .buton2:before {
    background: url(../images/mail.png) no-repeat;
}
footer .sag, footer .sol {
    background: #3d3f53;
    box-shadow: inset 0 0 50px #000;
    text-align: center;
    padding: 40px 20px;
    float: left;
    position: relative;
    z-index: 1;
}
footer .icerik {
    display: flex;
    flex-direction: column;
    padding: 20px;
}
footer .icerik h4 {
    float: left;
    font-size: 20px;
    width: fit-content;
    margin-bottom: 10px;
}
.ic-sayfa-icerik p, footer .icerik a {
    padding-bottom: 5px;
    margin-bottom: 5px;
}
footer .icerik h4:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #ff7b3a;
}
footer .icerik a {
    color: #fff;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ffffff12;
    text-shadow: 0 0 10px #000;
}
.ic-sayfa h1, footer .icerik a:hover {
    color: #ff7b3a;
}
footer .icerik a:last-child {
    border-bottom: 0;
}
footer .sag {
    display: flex;
    flex-direction: column;
    align-items: center;
}
footer .sag h5 {
    font-size: 25px;
    color: #ff7b3a;
}
footer .copyright {
    text-align: center;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #131212;
}
footer .copyright a {
    float: inherit;
    color: #ff7b3a;
    text-shadow: 0 0 4px #000;
    background: #3d4054;
    padding: 3px 15px;
    margin: 0 10px;
    border-right: 1px solid #131212;
    border-left: 1px solid #131212;
}
#whatsapp {
    position: fixed;
    bottom: 0;
    left: 6%;
    z-index: 3;
    width: 310px;
    background: url(../images/yorum-bg.webp) 0 0/200% 200% #f2f4f9;
    -webkit-box-shadow: 0 10px 15px 0 rgb(56 0 189 / 20%);
    box-shadow: 0 0 15px #000;
    font-size: 12px;
    border: 1px solid #001114;
    border-radius: 10px 10px 0 0;
    overflow: hidden;
}
.adres-cubugu:after, .ic-sayfa:after {
    content: '';
    box-shadow: inset 0 0 120px #000;
    opacity: .8;
    left: 0;
    top: 0;
    z-index: -1;
    height: 100%}
#whatsapp span {
    display: flex;
    background: #01404a;
    text-align: center;
    color: #fff;
    justify-content: center;
    padding: 5px 0;
    align-items: center;
}
#whatsapp .menu-icon {
    background: url(../images/whatsapp.png);
}
#whatsapp form p {
    color: #000;
    text-align: center;
    padding: 10px 0;
    font-size: 13px;
}
#whatsapp form input {
    margin: 0 10px;
    width: calc(100% - 20px);
}
#whatsapp form button {
    position: absolute;
    bottom: 11px;
    right: 16px;
    width: 25px;
    height: 27px;
    background: url(../images/mesaj-button.png) 0 0/100% no-repeat;
    border: none;
    cursor: pointer;
}
.ic-sayfa {
    color: #fff;
    padding-top: 80px;
    padding-bottom: 30px;
    box-shadow: 0 0 15px #000;
}
.ic-sayfa:after {
    position: absolute;
    width: 100%;
    
}
.ic-sayfa h1 {
    background: url(../images/footer-ok.png) left center/auto 56% no-repeat;
    padding-left: 30px;
    text-shadow: 0 0 5px #000;
}
.ic-sayfa .kisa_aciklama {
    width: 50%;
    font-size: 14px;
}
.ic-sayfa ul {
    position: absolute;
    bottom: -41px;
    left: 0;
    z-index: 0;
    background: #349f9c;
    border: 1px solid #000;
    box-shadow: 0 0 5px #000;
    border-radius: 10px 15px 15px 10px;
    padding-right: 10px;
    overflow: hidden;
    color: #fff;
}
.ic-sayfa ul li {
    float: left;
    text-shadow: 0 0 3px #000;
}
.ic-sayfa ul li a {
    float: left;
    color: #fff;
    font-size: 15px;
}
.ic-sayfa li:first-child a:before {
    content: '';
    float: left;
    width: 38px;
    height: 26px;
    background: url(../images/anasayfa.png) center/auto 75% no-repeat #69dbc9;
    margin-right: 10px;
}
.ic-sayfa li a:after {
    content: '';
    float: right;
    width: 30px;
    height: 26px;
    margin-right: 10px;
    margin-left: 10px;
    background: url(../images/footer-ok.png) center/auto 75% no-repeat #005957;
    border-right: 1px solid #4886bb;
    border-left: 1px solid #4886bb;
}
.ic-sayfa li.aktif a:after {
    background: 0 0;
    width: 0;
    border: none;
}
.ic-sayfa-icerik h1, .ic-sayfa-icerik h2, .ic-sayfa-icerik h1 a, .ic-sayfa-icerik h2 a {
    color: #349f9c;
    font-weight: 700;
}
.ic-sayfa-icerik ul {
    float: left;
    margin-left: 30px;
    list-style: auto;
    width: 100%}
.adres-cubugu {
    float: left;
    width: 100%;
    color: #fff;
    padding-top: 50px;
    height: 400px;
    overflow: hidden;
    display: flex;
    align-content: space-between;
}
.adres-cubugu:after {
    position: absolute;
    width: 100%;
    background: linear-gradient(87deg, #ff7b3a 0, #000 50%, #000 100%);
}
.adres-cubugu .container .row {
    display: flex;
    align-content: stretch;
    align-items: center;
}
.adres-cubugu .background, .ic-sayfa .background {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: 100%!important;
    background-position: center center!important;
    z-index: -1;
}
.adres-cubugu .video, .ic-sayfa .video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
}
.adres-cubugu h1 {
    border: 3px solid #ffffffe3;
    border-bottom: none;
    border-top: none;
    background: #00000087;
    text-align: center;
    padding: 0 20px;
    box-shadow: inset 0 0 10px #000;
    text-shadow: 0 0 4px #000;
    color: #ff7b3a;
    margin-top: 20px;
}
.adres-cubugu .kisa_aciklama p {
    font-size: 15px;
    padding: 5px 20px;
    text-align: center;
    border: 3px solid #ffffff7a;
    border-top: none;
    border-bottom: none;
    background: #00000057;
    line-height: 20px;
    text-shadow: 0 0 4px #000;
}
.adres-cubugu .linkler {
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #78767633;
}
.adres-cubugu .linkler a {
    font-size: 16px;
    margin: 0 8px;
    padding: 0 30px 0 0;
    text-shadow: 0 0 10px #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    box-shadow: inset 0 0 10px 0 #575355;
    border-radius: 10px;
    color: #000;
}
.adres-cubugu .linkler a img {
    width: 40px;
    margin-right: 20px;
    padding: 7px 9px;
    border-right: 1px solid silver;
}
.adres-cubugu .linkler .button1 {
    background: #fff;
    border: .5px solid #000;
}
.adres-cubugu .linkler .button1:hover {
    animation: 1.5s infinite zoom-in-zoom-out;
}
.adres-cubugu .fiyatlar {
    font-weight: 700;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 0 10px #000;
    margin: 10px auto 0;
    display: table;
}
.yorum .arrow, .yorum .dots {
    display: block;
    position: absolute;
}
.adres-cubugu .fiyatlar .piyasa {
    display: flex;
    text-decoration: line-through;
    margin-right: 25px;
    font-size: 16px;
    line-height: 35px;
    color: red;
}
.adres-cubugu .fiyatlar .indirim {
    display: flex;
    margin-right: 25px;
    line-height: 6px;
    color: red;
}
.adres-cubugu .fiyatlar .normal {
    float: left;
    padding: 7px 10px;
    margin-right: 20px;
    color: #fff;
    font-size: 24px;
    background: #3670d6;
    box-shadow: inset 0 0 10px #000;
}
.ozellik-dis {
    float: left;
    width: 100%;
    margin-top: 20px;
    border-radius: 10px;
    overflow: hidden;
}
.ozellik-dis h3 {
    padding: 5px 0;
    background: -webkit-gradient(linear, left top, right top, from(#ff0070), color-stop(#001d93), to(#ff0070));
    background: -webkit-linear-gradient(left, #ff0070, #001d93, #ff0070);
    background: -o-linear-gradient(left, #ff0070, #001d93, #ff0070);
    background: linear-gradient(to right, #ff0070, #001d93, #ff0070);
    -webkit-background-clip: text!important;
    font-weight: 700;
    font-size: 23px;
}
.ozellik-dis p {
    text-align: left;
}
.ozellik {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.ozellik li {
    transition: .5s;
    padding: 20px 10px;
    flex: calc(45% - 20px);
    margin: 15px 15px 15px 0;
    display: flex;
    align-items: stretch;
    background: #fff;
    border-radius: 3px;
    border: 1px dashed #d0cfcf;
    box-shadow: 2px 3px 6px #e1e1e1;
    cursor: pointer;
}
.ozellik li:hover {
    background: #f4fff7;
}
.ozellik li img {
    height: fit-content;
    width: 65px;
}
.ozellik li div:first-child {
    width: 20%;
    margin-right: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #ded3d3;
}
.ozellik li div:last-child {
    width: 80%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.ozellik li div b {
    background: -webkit-gradient(linear, left top, right top, from(#0056a0), color-stop(#3cb706), to(#000));
    background: -webkit-linear-gradient(left, #0056a0, #3cb706, #000);
    background: -o-linear-gradient(left, #0056a0, #3cb706, #000);
    background: linear-gradient(to right, #0056a0, #3cb706, #000);
    -webkit-background-clip: text!important;
    font-weight: 700;
}
.ozellik li div p {
    color: #000;
    font-size: 14px;
    text-align: left;
}
.buton1, .buton2, .buton3, .buton4, .buton5 {
    position: relative;
    overflow: hidden;
    color: #fff;
    border-radius: 100px;
    padding: 8px 12px 8px 45px;
    margin: 10px 0;
    -webkit-box-shadow: 0 0 15px 0 rgb(0 0 0 / 88%);
}
.buton1 {
    background: #423c8a;
    background: -moz-linear-gradient(left, #423c8a 0, #ff6a6a 100%);
    background: -webkit-linear-gradient(left, #423c8a 0, #ff6a6a 100%);
    background: linear-gradient(to right, #423c8a 0, #ff6a6a 100%);
}
.buton2, .buton3, .buton4, .buton5 {
    background: #423c8a;
    background: -moz-linear-gradient(left, #423c8a 0, #ff6a6a 100%);
    background: -webkit-linear-gradient(left, #423c8a 0, #ff6a6a 100%);
    background: linear-gradient(to right, #423c8a 0, #ff6a6a 100%);
}
#slider {
    overflow: hidden;
    margin: 0 auto;
    width: calc(75%);
    padding: 0;
    height: 330px;
    box-shadow: 0 0 50px #000;
    border-right: 1px solid #000000d1;
    border-left: 1px solid #000000d1;
    border-radius: 0 0 30px 30px;
    background: linear-gradient(306deg, #ff7b3a 0, #151645 50%, #ff7b3a 100%);
    background-size: 400% 400%;
    animation: 5s infinite gradient;
}
#slider ul {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
}
#slider ul li {
    float: left;
    display: flex;
    width: 100%;
    height: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
}
#slider ul li img {
    height: 85%;
    border-radius: 10px;
    border: 1px solid #000;
    padding: 3px;
    background: #fff;
    box-shadow: 0 0 50px #000;
}
#sayfa-iletisim-bilgi {
    float: left;
    border: 1px solid #ddd;
    border-radius: 10px;
    margin-top: 20px;
    overflow: hidden;
    width: 410px;
}
#sayfa-iletisim-bilgi b {
    text-align: center;
    background: #edfaff;
    float: left;
    width: 100%;
    margin-bottom: 10px;
    padding: 5px 0;
    border-bottom: 1px solid #ddd;
}
#sayfa-iletisim-bilgi a, .loop-grid article {
    background: #fff;
    overflow: hidden;
    display: flex;
}
#sayfa-iletisim-bilgi a {
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 10px;
    margin: 10px;
    justify-content: flex-start;
    font-size: 14px;
}
#sayfa-iletisim-bilgi a img {
    width: 40px;
    margin-right: 5px;
    border-right: 1px solid #ddd;
    background: #ecfaff;
    padding: 5px;
}
#sayfa-iletisim-form {
    padding: 10px;
    border: 1px solid #ddd;
    background: linear-gradient(to right, #daf1fb 0, #effff4 100%);
    box-shadow: 0 0 10px silver;
    border-radius: 10px;
    width: 40%;
    margin: 20px auto 0;
}
#sayfa-iletisim-form h3 {
    text-align: left;
    border-bottom: 1px solid #dddd;
    margin-bottom: 10px;
}
#sayfa-iletisim-form button {
    padding: 10px 15px;
    border: none;
    box-shadow: unset;
}
.banka-hesaplari {
    border: 1px solid #ddd;
    margin: 10px;
    padding: 10px;
    border-radius: 10px;
    overflow: hidden;
}
.banka-hesaplari img {
    height: 150px;
}

.loop-grid article {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-evenly;
}
.post-thumb {
    overflow: hidden;
    width: 250px;
}
.loop-grid .entry-content-2 {
    padding: 20px 30px;
    text-align: left;
    width: calc(100% - 250px);
}
.yorum, .yorum .wrap {
    width: 100%;
    position: relative;
}
.border-radius-15 {
    border-radius: 15px;
}

#dil {
    position: absolute;
    right: 18px;
    top: 60px;
    border: 1px solid #000d;
    border-radius: 3px;
    background: #00000078;
    min-width: 95px;
}
#dil a {
    display: flex;
    align-items: center;
    padding: 2px 6px;
    color: #fff;
    justify-content: flex-start;
    border-bottom: 1px solid #0000004f;
    font-size: 12px;
}
#dil a img {
    width: 25px;
    float: left;
    border: 1px solid #fff;
    padding: 1px;
    background: #000;
    border-radius: 2px;
    margin-right: 5px;
}
#dil a span {
    float: left;
    background: 0 0;
    border: none;
}
#dil div {
    padding: 3px 6px;
    display: none;
}
#dil div a {
    padding: 0;
    border: none;
}
.yorum .vitrin-baslik h3 {
    background: -webkit-gradient(linear, left top, right top, from(#000), color-stop(#ff7b3a), to(#000));
    background: -webkit-linear-gradient(left, #000, ff7b3a, #ff7b3a);
    background: -o-linear-gradient(left, #000, #ff7b3a, #000);
    background: linear-gradient(to right, #000, #155d88, #000);
}
.yorum .vitrin-baslik p {
    font-weight: 700;
    font-size: 16px;
    color: #155d88;
}
.yorum {
    background: url(https://antalyabilgisayartamiri.com/assets/images/yorum-bg.webp) #f2f4f9;
    padding-top: 30px;
    padding-bottom: 30px;
    border-top: 1px solid #ddd;
}
.yorum .wrap {
    max-width: 70%;
    margin: auto;
    background: #ffffffe3;
    border-radius: 10px;
    box-shadow: 0 0 7px #afafaf;
}
.yorum .arrow {
    cursor: pointer;
    top: 45%;
    z-index: 2;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: url(https://antalyabilgisayartamiri.com/assets/images/footer-ok.png) center center/auto 50% no-repeat #fff;
    box-shadow: 0 0 3px #7684a4;
}
.yorum .arrow:before {
    cursor: pointer;
}
.yorum .arrow.left {
    left: -20px;
    transform: rotate(-180deg);
}
.yorum .arrow.right {
    right: -20px;
}
.yorum .dots {
    text-align: center;
    width: 100%;
    bottom: 15px;
    left: 0;
    z-index: 3333;
    height: 12px;
}
.yorum .dots .dot {
    list-style-type: none;
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1px solid #eee;
    margin: 0 10px;
    cursor: pointer;
    -webkit-transition: .5s ease-in-out;
    -ms-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    position: relative;
}
.yorum .dots .dot.active, .yorum .dots .dot:hover {
    background: #ea830e;
    border-color: #ea830e;
}
.yorum .dots .dot.active {
    -webkit-animation: .5s ease-in-out forwards yorum-scale;
    -moz-animation: .5s ease-in-out forwards yorum-scale;
    -ms-animation: yorum-scale .5s ease-in-out forwards;
    -o-animation: .5s ease-in-out forwards yorum-scale;
    animation: .5s ease-in-out forwards yorum-scale;
}
.yorum .cont>div {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
}
.yorum .cont>div.inactive {
    opacity: 1;
}
.yorum .cont>div.active {
    position: relative;
    opacity: 1;
}
.yorum .cont div .img img {
    display: block;
    width: 100%;
    height: 100%;
    margin: auto;
    border-radius: 50%;
    border: 1px solid #fff;
}
.yorum .cont div .img {
    width: 100px;
    height: 100px;
    margin-left: 30px;
}
.yorum .cont div span {
    float: left;
    width: calc(100% - 140px);
    margin: 30px 15px;
}
.yorum .cont div h2 {
    font-size: 1em;
}
.yorum .cont div p {
    color: #413e3e;
    width: 100%;
    float: left;
    position: relative;
}
.yorum .cont div.active .img {
    display: inline-table;
    margin-top: 10px;
    background: linear-gradient(-45deg, #56dbc0, #20fff8, #32fe79, #96fffd);
    background-size: 400% 400%;
    animation: .6s ease-in-out forwards yorum-show;
    border-radius: 50%;
    padding: 5px;
    box-shadow: 0 0 6px #646060;
    -webkit-animation: .6s ease-in-out forwards yorum-show;
    -moz-animation: .6s ease-in-out forwards yorum-show;
    -ms-animation: yorum-show .6s ease-in-out forwards;
    -o-animation: .6s ease-in-out forwards yorum-show;
}
.yorum .cont div.active .img img {
    -webkit-animation: .5s ease-in-out forwards yorum-show;
    -moz-animation: .5s ease-in-out forwards yorum-show;
    -ms-animation: yorum-show .5s ease-in-out forwards;
    -o-animation: .5s ease-in-out forwards yorum-show;
    animation: .5s ease-in-out forwards yorum-show;
}
.yorum .cont div.active h2 {
    -webkit-animation: .4s ease-in-out forwards yorum-content-in;
    -moz-animation: .4s ease-in-out forwards yorum-content-in;
    -ms-animation: yorum-content-in .4s ease-in-out forwards;
    -o-animation: .4s ease-in-out forwards yorum-content-in;
    animation: .4s ease-in-out forwards yorum-content-in;
}
.yorum .cont div.active p {
    -webkit-animation: .5s ease-in-out forwards yorum-content-in;
    -moz-animation: .5s ease-in-out forwards yorum-content-in;
    -ms-animation: yorum-content-in .5s ease-in-out forwards;
    -o-animation: .5s ease-in-out forwards yorum-content-in;
    animation: .5s ease-in-out forwards yorum-content-in;
}
.yorum .cont div.inactive .img img {
    -webkit-animation: .5s ease-in-out forwards yorum-hide;
    -moz-animation: .5s ease-in-out forwards yorum-hide;
    -ms-animation: yorum-hide .5s ease-in-out forwards;
    -o-animation: .5s ease-in-out forwards yorum-hide;
    animation: .5s ease-in-out forwards yorum-hide;
}
.yorum .cont div.inactive h2 {
    -webkit-animation: .4s ease-in-out forwards yorum-content-out;
    -moz-animation: .4s ease-in-out forwards yorum-content-out;
    -ms-animation: yorum-content-out .4s ease-in-out forwards;
    -o-animation: .4s ease-in-out forwards yorum-content-out;
    animation: .4s ease-in-out forwards yorum-content-out;
}
.yorum .cont div.inactive p {
    -webkit-animation: .5s ease-in-out forwards yorum-content-out;
    -moz-animation: .5s ease-in-out forwards yorum-content-out;
    -ms-animation: yorum-content-out .5s ease-in-out forwards;
    -o-animation: .5s ease-in-out forwards yorum-content-out;
    animation: .5s ease-in-out forwards yorum-content-out;
}
@-webkit-keyframes yorum-scale {
    0% {
    -webkit-box-shadow: 0 0 0 0 #eee;
    box-shadow: 0 0 0 0 #eee;
}
35% {
    -webkit-box-shadow: 0 0 10px 5px #eee;
    box-shadow: 0 0 10px 5px #eee;
}
70% {
    -webkit-box-shadow: 0 0 10px 5px #ea830e;
    box-shadow: 0 0 10px 5px #ea830e;
}
100% {
    -webkit-box-shadow: 0 0 0 0 #ea830e;
    box-shadow: 0 0 0 0 #ea830e;
}
}@-moz-keyframes yorum-scale {
    0% {
    -moz-box-shadow: 0 0 0 0 #eee;
    box-shadow: 0 0 0 0 #eee;
}
35% {
    -moz-box-shadow: 0 0 10px 5px #eee;
    box-shadow: 0 0 10px 5px #eee;
}
70% {
    -moz-box-shadow: 0 0 10px 5px #ea830e;
    box-shadow: 0 0 10px 5px #ea830e;
}
100% {
    -moz-box-shadow: 0 0 0 0 #ea830e;
    box-shadow: 0 0 0 0 #ea830e;
}
}@-ms-keyframes yorum-scale {
    0% {
    -ms-box-shadow: 0 0 0 0 #eee;
    box-shadow: 0 0 0 0 #eee;
}
35% {
    -ms-box-shadow: 0 0 10px 5px #eee;
    box-shadow: 0 0 10px 5px #eee;
}
70% {
    -ms-box-shadow: 0 0 10px 5px #ea830e;
    box-shadow: 0 0 10px 5px #ea830e;
}
100% {
    -ms-box-shadow: 0 0 0 0 #ea830e;
    box-shadow: 0 0 0 0 #ea830e;
}
}@-o-keyframes yorum-scale {
    0% {
    -o-box-shadow: 0 0 0 0 #eee;
    box-shadow: 0 0 0 0 #eee;
}
35% {
    -o-box-shadow: 0 0 10px 5px #eee;
    box-shadow: 0 0 10px 5px #eee;
}
70% {
    -o-box-shadow: 0 0 10px 5px #ea830e;
    box-shadow: 0 0 10px 5px #ea830e;
}
100% {
    -o-box-shadow: 0 0 0 0 #ea830e;
    box-shadow: 0 0 0 0 #ea830e;
}
}@keyframes yorum-scale {
    0% {
    box-shadow: 0 0 0 0 #eee;
}
35% {
    box-shadow: 0 0 10px 5px #eee;
}
70% {
    box-shadow: 0 0 10px 5px #ea830e;
}
100% {
    box-shadow: 0 0 0 0 #ea830e;
}
}@-webkit-keyframes yorum-content-in {
    from {
    opacity: 0;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
}
to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
}@-moz-keyframes yorum-content-in {
    from {
    opacity: 0;
    -moz-transform: translateY(100%);
    transform: translateY(100%);
}
to {
    opacity: 1;
    -moz-transform: translateY(0);
    transform: translateY(0);
}
}@-ms-keyframes yorum-content-in {
    from {
    opacity: 0;
    -ms-transform: translateY(100%);
    transform: translateY(100%);
}
to {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
}
}@-o-keyframes yorum-content-in {
    from {
    opacity: 0;
    -o-transform: translateY(100%);
    transform: translateY(100%);
}
to {
    opacity: 1;
    -o-transform: translateY(0);
    transform: translateY(0);
}
}@keyframes yorum-content-in {
    from {
    opacity: 0;
    transform: translateY(100%);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}@-webkit-keyframes yorum-content-out {
    from {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
to {
    opacity: 0;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
}
}@-moz-keyframes yorum-content-out {
    from {
    opacity: 1;
    -moz-transform: translateY(0);
    transform: translateY(0);
}
to {
    opacity: 0;
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
}
}@-ms-keyframes yorum-content-out {
    from {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
}
to {
    opacity: 0;
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
}
}@-o-keyframes yorum-content-out {
    from {
    opacity: 1;
    -o-transform: translateY(0);
    transform: translateY(0);
}
to {
    opacity: 0;
    transform: translateY(-100%);
}
}@keyframes yorum-content-out {
    from {
    opacity: 1;
    transform: translateY(0);
}
to {
    opacity: 0;
    transform: translateY(-100%);
}
}@-webkit-keyframes yorum-show {
    from {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
}@-moz-keyframes yorum-show {
    from {
    opacity: 0;
    -moz-transform: scale(0);
    transform: scale(0);
}
to {
    opacity: 1;
    -moz-transform: scale(1);
    transform: scale(1);
}
}@-ms-keyframes yorum-show {
    from {
    opacity: 0;
    -ms-transform: scale(0);
    transform: scale(0);
}
to {
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1);
}
}@-o-keyframes yorum-show {
    from {
    opacity: 0;
    -o-transform: scale(0);
    transform: scale(0);
}
to {
    opacity: 1;
    -o-transform: scale(1);
    transform: scale(1);
}
}@keyframes yorum-show {
    from {
    opacity: 0;
    transform: scale(0);
}
to {
    opacity: 1;
    transform: scale(1);
}
}@-webkit-keyframes yorum-hide {
    from {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
to {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
}@-moz-keyframes yorum-hide {
    from {
    opacity: 1;
    -moz-transform: scale(1);
    transform: scale(1);
}
to {
    opacity: 0;
    -moz-transform: scale(0);
    transform: scale(0);
}
}@-ms-keyframes yorum-hide {
    from {
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1);
}
to {
    opacity: 0;
    -ms-transform: scale(0);
    transform: scale(0);
}
}@-o-keyframes yorum-hide {
    from {
    opacity: 1;
    -o-transform: scale(1);
    transform: scale(1);
}
to {
    opacity: 0;
    -o-transform: scale(0);
    transform: scale(0);
}
}@keyframes yorum-hide {
    from {
    opacity: 1;
    transform: scale(1);
}
to {
    opacity: 0;
    transform: scale(0);
}
}
@media only screen and (max-width:700px) {
    #mobil-menu, header {
        display: block;
    }
    footer .icerik, footer .sag, footer .sol {
        border-bottom: 1px solid #272727;
    }
    #anasayfa-slider .iletisim a, #slider {
        margin-bottom: 15px;
    }
    .ic-sayfa-icerik h1, .ic-sayfa-icerik h2, .ic-sayfa-icerik p {
        padding-left: 10px!important;
    }
    .ic-sayfa-icerik ul {
        width: auto;
    }
    .hidden-xs {
        display: none!important;
    }
    header {
        height: 50px;
        background: #000;
    }
    header #logo {
        position: fixed;
        top: 10px;
    }
    header ul {
        display: none;
        width: 100%}
    header ul:first-child {
        margin-top: 50px;
    }
    header ul li.drop {
        border-bottom: .5px dashed #ffffff17;
        margin-bottom: 5px;
        padding-bottom: 5px;
    }
    header ul li .menu-icerik div ul {
        margin-top: 5px;
        padding-top: 5px;
    }
    header ul li .menu-icerik {
        width: 100%;
        padding: 0;
        left: 0;
        position: unset;
        overflow-y: scroll;
        height: 350px;
        display: none;
        margin-top: 10px;
    }
    header ul li .menu-icerik div {
        width: 100%;
        max-width: 100%;
        border: none;
        margin-bottom: 10px;
        background: #00000063;
        padding: 10px;
        border-radius: 4px;
        box-shadow: inset 0 0 10px #000;
    }
    header ul li b {
        border: none;
    }
    #bizimkiler span p {
        font-size: 12px;
    }
    #menu-bg {
        background: linear-gradient(180deg, #ff8b56 0, #ff7b3a 50%, #000000 100%);
        box-shadow: inset 0 0 120px #000;
    }
    #menu-bg[data-ak="1"] {
        height: 100vh!important;
    }
    header ul li .menu-icerik div p {
        font-size: 13px;
    }
    #anasayfa-slider .row video {
        position: fixed;
        top: 50%;
        left: 50%;
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: auto;
        z-index: -2;
        transform: translateX(-50%) translateY(-50%);
        background-size: cover;
        transition: opacity 1s;
    }
    #anasayfa-slider .iletisim {
        flex-direction: column;
        align-items: center;
    }
    #anasayfa-slider .row {
        margin-top: 85px;
    }
    #arayalim {
        left: 0;
        width: 100%}
    #arayalim div input {
        margin-right: 10px;
    }
    .col-xs-12, .vitrin-6 .scroll p {
        width: 100%}
    .col-xs-6 {
        width: 50%}
    .vitrin-1 .col-md-4:first-child ul.sol-ul {
        padding-right: 85px;
        padding-left: 15px;
        text-align: left;
        border: none;
    }
    .vitrin-1 .col-md-4:first-child ul.sol-ul li .img {
        right: -87px;
        border-radius: 30px 0 0 30px;
    }
    .vitrin-1 .col-md-4 ul.sag-ul {
        padding-left: 85px;
        padding-right: 15px!important;
        text-align: left;
        border: none;
    }
    .vitrin-1 .col-md-4 ul.sag-ul li .img {
        left: -90px;
        border-radius: 0 30px 30px 0;
    }
    .vitrin-4 .col-md-4 span {
        height: unset;
    }
    .vitrin-5 .col-md-3 div:before {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
    .vitrin-3 .tab-menu, footer .row {
        flex-direction: column;
    }
    .vitrin-3 .tab-menu li {
        margin: 0 20px 10px 10px;
    }
    .vitrin-3 .tab-menu li:last-child {
        margin-bottom: 0;
    }
    .vitrin-3 .tab-icerik .tab-icerik-aciklama {
        flex-direction: column;
        padding-top: 10px;
    }
    .yorum .cont>div {
        flex-direction: column!important;
    }
    .yorum .wrap {
        max-width: 100%!important;
    }
    .yorum .cont div span {
        margin: 10px 0 30px!important;
        width: 83%!important;
    }
    .ozellik-dis h3, .ozellik-dis p, .yorum .cont div h2 {
        text-align: center;
    }
    footer .icerik {
        background: #3d3f53;
    }
    .container {
        width: 100%!important;
    }
	
    footer .sag {
        background: #2b2d3e;
    }
    footer {
        padding: 0!important;
    }
    footer .copyright {
        display: flex;
        flex-direction: column;
        padding: 20px 0;
    }
    .vitrin-3 .tab-icerik .img-dis {
        margin-bottom: 10px;
        align-items: flex-start;
        height: auto;
    }
    .vitrin-1, .vitrin-2, .vitrin-3, .vitrin-4, .vitrin-5, .vitrin-6, .yorum {
        width: 100%;
        overflow: hidden;
    }
    .vitrin-6 .etiket a {
        margin: 2px 1px;
        font-size: 14px;
        padding: 3px 8px;
    }
    .vitrin-6 .etiket {
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        justify-content: center;
    }
    .adres-cubugu .container .row, .ozellik li {
        flex-direction: column;
        display: flex;
    }
    .ozellik li {
        align-items: center;
        text-align: center;
        flex: 100%;
        margin-left: 15px;
    }
    .ozellik li div:first-child {
        border: none;
        margin: 0;
        align-items: center;
    }
    .ozellik li div:first-child img{
    height: unset;
}
    .ozellik li div p, .ozellik li div:last-child {
        width: 100%;
        text-align: center;
    }
    .adres-cubugu {
        height: auto;
    }
    .adres-cubugu .linkler {
        display: flex;
        flex-direction: column;
        padding-bottom: 0;
    }
    .adres-cubugu .iletisim {
        flex-direction: row;
    }
    .adres-cubugu .iletisim a {
        font-size: 13px;
        margin-right: 0;
        margin-left: 3px;
    }
    .adres-cubugu .iletisim a img {
        margin-right: 2px;
        width: 35px;
    }
    .adres-cubugu .linkler a {
        display: flex;
        justify-content: flex-start;
        margin-bottom: 10px;
    }
    #slider {
        width: 95%;
        border-radius: 10px;
        margin-top: 15px;
    }
    #sayfa-iletisim-bilgi, .ic-sayfa .kisa_aciklama {
        width: 100%;
        max-width: 95%!important;
        margin: 0 auto;
        float: unset;
    }
    .ic-sayfa {
        padding-left: 10px;
        padding-right: 10px;
    }
    .loop-grid article {
        display: flex;
        flex-direction: column;
        text-align: center;
        border-bottom: 1px solid #ddd;
        width: 100%;
        margin-bottom: 10px;
    }
    .loop-grid .entry-content-2 {
        width: 95%;
        text-align: center;
        padding: 0;
    }
    .loop-grid article:last-child {
        border: unset;
    }
    #sayfa-iletisim-form {
        width: 95%!important;
    }
    .iletisim-sol h2, .iletisim-sol p {
        padding-left: 15px;
    }
}


/*Çözüm Ortaklarımız*/
.partners-marquee{
    --gap: 2rem;     /* logolar arası boşluk */
    --logo-h: 44px;  /* maksimum logo yüksekliği */
    background:#fff; padding:12px 0;
  }
  .marquee{ overflow:hidden; width:100%; position:relative; }
  /* İlk kurulum bitene kadar FOUC olmasın */
  .marquee:not(.is-ready) { visibility:hidden; }

  .marquee__group{
    display:flex; align-items:center; gap:var(--gap);
    width:max-content; will-change:transform; backface-visibility:hidden;
  }
  .marquee__group li{ list-style:none; }
  .marquee__group img{
    display:block; max-height:var(--logo-h); height:auto; width:auto; object-fit:contain;
  }

  /* Animasyon: temel set genişliği kadar sola kaydır */
  .marquee.is-running .marquee__group{
    animation: scroll-left var(--duration, 20s) linear infinite;
  }
  @keyframes scroll-left{
    to { transform: translateX(calc(-1 * var(--cycle, 0px))); }
  }

  /* Hover'da durdur */
  .marquee:hover .marquee__group{ animation-play-state: paused; }

  @media (max-width:640px){
    .partners-marquee{ --gap:1.25rem; --logo-h:30px; }
  }
  @media (prefers-reduced-motion: reduce){
    .marquee__group{ animation:none !important; }
    .marquee{ visibility:visible !important; }
  }
  
  
  
  
  
















/* ——— Temel ——— */
*{ box-sizing:border-box }
body{
  margin:0;
  font-family:'Poppins',sans-serif;
  /* sabit header üst boşluğu istemiyorsun, 0 bıraktım */
  padding-top:0;
}

/* =========================
   NAVBAR FIX PACK (drop-down + mobile)
   ========================= */

/* Header görünümü */
#site-header{
  z-index: 999999;
  left: 5%;
  top: 0;
  padding: 15px 15px;
  background: #00000091;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Scroll ile koyulaşan arka plan */
#site-header.koyu-renk{
  background: rgba(4,4,12,.85);
}

/* Logo */
#logo{ display:flex; align-items:center; justify-content:center; }
#logo img{ height:50px; display:block; }

/* Sol/Sağ bloklar */
#site-header .nav-wrap{ display:flex; align-items:center; }

/* Kök menü listesi */
#site-header ul.menu{
  list-style:none; margin:0; padding:0; display:flex; align-items:center;
}

/* Alt menülerin taşabilmesi için */
#site-header ul li{ overflow: visible !important; }

/* Üst seviye maddeler */
#site-header ul.menu > li{ position:relative; }
#site-header ul.menu > li > a{
  position: relative;
  display:flex; align-items:center; gap:3px;
  color:#fff; text-decoration:none; font-weight:0; font-size:14.5px;
  padding:10px 30px 10px 10px; border-radius:4px; white-space:nowrap;
}
#site-header ul.menu > li + li > a{ border-left:1px solid #12c2e9; }
#site-header ul.menu > li > a:hover{ background:rgba(255,127,0,.3); }

/* ================= MENÜ HOVER FX (full, tek başına) ================= */
#site-header ul.menu > li{ position:relative; }
#site-header ul.menu > li > a{
  position: relative !important;
  display:flex; align-items:center; gap:3px;
  color:#fff; text-decoration:none; font-size:14.5px;
  padding:10px 30px 10px 10px; border-radius:4px; white-space:nowrap;
  overflow: hidden;                 /* efekt taşmasın */
  z-index: 0;
  /* hız ve faz değişkenleri */
  --blob-speed: 3.6s;
  --spark-speed: 6.8s;
  --blob-phase: -0.4s;
  --spark-phase: -0.3s;
}

/* Metin/ikonlar üstte kalsın */
#site-header ul.menu > li > a > *{ position: relative; z-index: 2; }

/* (Senin mevcut çizgi ve hover renklerin kalsın) */
#site-header ul.menu > li + li > a{ border-left:1px solid #12c2e9; }
#site-header ul.menu > li > a:hover{ background:rgba(255,127,0,.30); }

/* --- Arkada dans eden blob'lar --- */
#site-header ul.menu > li > a::before{
  content:"";
  position:absolute; z-index:1;
  inset:-44% -26%;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(66% 66% at 18% 30%, rgba(255,127,0,.34), transparent 60%),
    radial-gradient(58% 58% at 84% 62%, rgba(255,200,0,.28), transparent 60%),
    radial-gradient(50% 50% at 52% 48%, rgba(255,170,0,.24), transparent 60%),
    radial-gradient(46% 46% at 10% 72%, rgba(255,127,0,.20), transparent 62%),
    radial-gradient(44% 44% at 92% 26%, rgba(255,200,0,.18), transparent 62%),
    radial-gradient(42% 42% at 64% 16%, rgba(255,170,0,.18), transparent 64%);
  filter: blur(18px) saturate(118%);
  transform: translate(-14%, -6%) scale(1.06) rotate(.2deg);
  opacity: 0;
  transition: opacity .18s ease;
  animation: menuBlobDance var(--blob-speed) ease-in-out infinite;
  animation-delay: var(--blob-phase);
  animation-play-state: paused;
  will-change: transform, opacity;
}

/* --- Uçuşan kıvılcımlar (daha büyük + rastgele faz) --- */
#site-header ul.menu > li > a::after{
  content:"";
  position:absolute; z-index:1;
  inset:-12px; pointer-events:none;
  /* daha büyük taneler + doku */
  background:
    radial-gradient(5px 5px at 14px 12px,     rgba(255,255,255,.98), transparent 58%),
    radial-gradient(4.2px 4.2px at 66px 24px, rgba(255,200,0,.96),   transparent 58%),
    radial-gradient(3.6px 3.6px at 114px 40px,rgba(255,127,0,.92),   transparent 58%),
    radial-gradient(4.2px 4.2px at 158px 14px,rgba(255,170,0,.94),   transparent 58%),
    radial-gradient(2.2px 2.2px at 28px 22px, rgba(255,255,255,.80), transparent 55%),
    radial-gradient(2.2px 2.2px at 98px 10px,  rgba(255,200,0,.75),  transparent 55%),
    radial-gradient(2.2px 2.2px at 134px 32px, rgba(255,170,0,.72),  transparent 55%);
  background-size: 110px 52px; /* küçük karo = daha yoğun tekrar */
  background-repeat: repeat;
  filter: drop-shadow(0 0 12px rgba(255,127,0,.34));
  opacity: 0;
  transition: opacity .18s ease;
  animation: menuSparkDrift var(--spark-speed) linear infinite;
  animation-delay: var(--spark-phase);
  animation-play-state: paused;
  will-change: background-position, opacity;
}

/* Hover/Focus: görünür ve çalışır hale getir */
#site-header ul.menu > li > a:hover::before,
#site-header ul.menu > li > a:focus-visible::before,
#site-header ul.menu > li > a:hover::after,
#site-header ul.menu > li > a:focus-visible::after{
  opacity: 1 !important;
  animation-play-state: running !important;
}

/* ---- Animasyonlar ---- */
@keyframes menuBlobDance{
  0%   { transform: translate(-18%, -8%) scale(1.02) rotate(-.6deg); }
  38%  { transform: translate( 16%,  8%) scale(1.11) rotate(.9deg);  }
  68%  { transform: translate(-10%,  4%) scale(1.05) rotate(-.4deg); }
  100% { transform: translate( 10%, -4%) scale(1.08) rotate(.5deg);  }
}
@keyframes menuSparkDrift{
  from { background-position:   0     0; }
  to   { background-position: 260% -240%; }
}

/* ---- Her menü öğesinde farklı "seed" (gerçek rastgele gibi) ---- */
#site-header ul.menu > li:nth-child(7n+1) > a{ --spark-phase:-0.2s; --blob-phase:-0.6s; --spark-speed:7.0s; }
#site-header ul.menu > li:nth-child(7n+2) > a{ --spark-phase:-1.4s; --blob-phase:-1.2s; --spark-speed:6.4s; }
#site-header ul.menu > li:nth-child(7n+3) > a{ --spark-phase:-0.9s; --blob-phase:-0.7s; --spark-speed:7.4s; }
#site-header ul.menu > li:nth-child(7n+4) > a{ --spark-phase:-2.3s; --blob-phase:-1.9s; --spark-speed:6.2s; }
#site-header ul.menu > li:nth-child(7n+5) > a{ --spark-phase:-1.8s; --blob-phase:-0.3s; --spark-speed:7.8s; }
#site-header ul.menu > li:nth-child(7n+6) > a{ --spark-phase:-0.5s; --blob-phase:-2.1s; --spark-speed:6.0s; }
#site-header ul.menu > li:nth-child(7n)     > a{ --spark-phase:-2.7s; --blob-phase:-1.5s; --spark-speed:7.1s; }

/* Hareket azaltmayı destekle */
@media (prefers-reduced-motion: reduce){
  #site-header ul.menu > li > a::before,
  #site-header ul.menu > li > a::after{
    animation: none !important; opacity: 0 !important;
  }
}



/* Veritabanından gelen küçük icon */
.menu-icon{ width:30px; height:30px; background:center/contain no-repeat; display:inline-block; }

/* Ok (chevron) — a içinde sağda sabit */
#site-header ul.menu > li > a .arrow,
#site-header ul.menu > li > .arrow{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  width:26px; height:26px; display:flex; align-items:center; justify-content:center; color:#fff;
  pointer-events:auto;
}

/* ALT MENÜLER (2. seviye aşağı, 3+ yana) */
#site-header .sub-menu{
  position:absolute;
  top:100%;               /* gap yok */
  left:0;
  min-width:240px;
  background: rgba(4, 4, 12, 0.85);
  backdrop-filter: saturate(180%) blur(6px);
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.45);
  padding:8px 6px;
  display:none;
  z-index:10000;
}

#site-header .sub-menu li{ position:relative; }
#site-header .sub-menu li > a{
  display:flex; align-items:center; gap:8px;
  color:#fff; text-decoration:none; font-weight:500; font-size:14px;
  padding:10px 34px 10px 10px; border-radius:8px; white-space:nowrap;
}
#site-header .sub-menu li > a:hover{ background:rgba(255,127,0,.3); }

/* 3+ seviye yana açılır */
#site-header .sub-menu .more-sub-menu{
  position:absolute;
  top:-4px;
  left:100%;              /* gap yok */
  min-width:220px;
  background: rgba(4, 4, 12, 0.85);
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.45);
  padding:8px 6px; display:none; z-index:10000;
}

/* Masaüstü: hover ile aç + ok döndür */
@media (min-width:901px){
  #site-header ul.menu li:hover > .sub-menu{ display:block; }
  #site-header .sub-menu li:hover > .more-sub-menu{ display:block; }
  #site-header ul.menu li:hover > a .arrow{ transform:translateY(-50%) rotate(180deg); }
}

/* ——— Mobil (off-canvas) ——— */
#site-header .hamburger,
#site-header .drawer-close{
  display:none; background:transparent; border:0; color:#fff; font-size:26px; cursor:pointer;
}

@media (max-width:900px){
  /* Header — mobil görünüm (oval üst bar) */
  #site-header{
    position: fixed;
    left: 0%;
    top: 0;
    width: 100%;
    padding: 30px 30px;
    border-radius: 0 0 0px 0px;
    overflow: hidden;
    background: #0056a0;
    box-shadow: 0 0 40px #0056a0;
    display: flex; align-items: center; justify-content: center;
    z-index: 999999;
  }
  
  /* — Minik turuncu kalpçikler: seyrek ve rasgele hissi — */
#site-header{ isolation:isolate; }
#site-header > *{ position:relative; z-index:2; }

/* Kalp svg'si (turuncu) iki ayrı katmanla; farklı zamanlarda görünecek */
#site-header::before,
#site-header::after{
  content:"";
  position:absolute;
  width:16px; height:16px;
  pointer-events:none;
  background-repeat:no-repeat;
  background-size:contain;
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path fill='%23ff7b3a' d='M12 21s-6.716-4.632-9.193-7.109C.641 11.725.641 8.59 2.807 6.424c2.165-2.166 5.299-2.166 7.465 0L12 8.152l1.728-1.728c2.166-2.166 5.3-2.166 7.465 0 2.166 2.166 2.166 5.3 0 7.466C18.716 16.368 12 21 12 21z'/>\
</svg>");
  opacity:0;
  filter: drop-shadow(0 0 6px rgba(255,123,58,.45));
  transform: translate3d(0,0,0) scale(.6);
}

/* 1. kalp (birkaç saniye belirip kaybolur, sonra başka yerde tekrar) */
#site-header::before{
  animation: heartPopA 24s ease-in-out infinite;
}

/* 2. kalp (daha küçük, farklı zamanlama) */
#site-header::after{
  width:12px; height:12px;
  filter: drop-shadow(0 0 4px rgba(255,123,58,.35));
  animation: heartPopB 28s ease-in-out infinite 6s; /* 6s gecikme */
}

/* Rasgele hissi için farklı konumlarda belirme/sönme */
@keyframes heartPopA{
  /* pozisyon-1 */
  0%,14%   { left:12%; top:62%; opacity:0; transform: scale(.6) rotate(-8deg); }
  6%,10%   { opacity:.95; transform: scale(1) rotate(0deg); }
  14%,33%  { opacity:0; }

  /* pozisyon-2 */
  34%,48%  { left:72%; top:38%; opacity:.95; transform: scale(1) rotate(6deg); }
  49%,66%  { opacity:0; }

  /* pozisyon-3 */
  67%,80%  { left:40%; top:26%; opacity:.95; transform: scale(1) rotate(-4deg); }
  81%,100% { opacity:0; }
}

@keyframes heartPopB{
  /* pozisyon-1 */
  0%,12%   { left:82%; top:58%; opacity:0; transform: scale(.6) rotate(8deg); }
  4%,8%    { opacity:.9; transform: scale(1) rotate(0deg); }
  12%,36%  { opacity:0; }

  /* pozisyon-2 */
  37%,50%  { left:18%; top:42%; opacity:.9; transform: scale(1) rotate(-6deg); }
  51%,74%  { opacity:0; }

  /* pozisyon-3 */
  75%,88%  { left:56%; top:22%; opacity:.9; transform: scale(1) rotate(5deg); }
  89%,100% { opacity:0; }
}

/* Animasyon rahatsız edenler için kapat */
@media (prefers-reduced-motion: reduce){
  #site-header::before, #site-header::after{ animation:none; }
}

  
  #site-header.koyu-renk{
    background: rgba(4,4,12,.8);
  }

  /* Hamburger göster */
  #site-header .hamburger{ display:block; position:absolute; left:14px; top:50%; transform:translateY(-50%); z-index:1000002; }

  /* Off-canvas: her nav-wrap sol çekmece gibi */
  #site-header .nav-wrap{
    position: fixed;
    top: 0;
    left: -100%;
    width: 86vw;

    /* ÖNEMLİ: gerçek kaydırma alanı */
    height: 100dvh;                 /* modern tarayıcılar için doğru yükseklik */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;

    background: rgba(4, 4, 12, 0.85);
    padding: 18px;
    display: block;
    transition: left .28s ease;
    z-index: 10000;
    box-shadow: 0 0 40px #000000d9;
    border-radius: 16px;
  }
  /* Eski tarayıcılar için yedek */
  @supports not (height: 100dvh){
    #site-header .nav-wrap{ height:100vh; }
  }

  #site-header .nav-wrap.show{ left:0; }

  /* panel içinde kapatma butonu */
  #site-header .nav-wrap .drawer-close{
    display:block; position:sticky; top:0; margin-left:auto;
  }

  /* Dikey menü */
  #site-header ul.menu{ display:block; }
  #site-header ul.menu > li + li > a{ border-left:0; } /* mobilde çizgi yok */
  #site-header ul.menu > li > a{ padding:12px 36px 12px 6px; }

  /* Alt menüler akışta; .open ile görünür */
  #site-header .sub-menu{
    position: static !important;
    display: none;
    background: transparent;
    box-shadow: none;
    padding-left: 10px; margin: 6px 0 8px;
  }
  #site-header ul.menu li.open > .sub-menu{ display:block; }

  /* 3+ seviye de akışa */
  #site-header .sub-menu .more-sub-menu{
    position: static !important;
    display: none;
    padding-left: 10px;
  }
  #site-header .sub-menu li.open > .more-sub-menu{ display:block; }

  /* Mobil panel scroll bar (opsiyonel) */
  #site-header .nav-wrap::-webkit-scrollbar{ width:8px; }
  #site-header .nav-wrap::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.25); border-radius:6px; }

  /* Logo tam merkezde */
  #site-header #logo{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    z-index: 1000000;
  }
  #site-header #logo img{ height:40px; display:block; }
}


.harita-embed {
    position: relative;
    width: 100%;
    max-width: 390px;   /* istersen sınır koy */
    margin: 0 auto 10px auto; /* altta 20px boşluk */
    border-radius: 12px; 
    overflow: hidden;   /* taşma olmasın */
}

.harita-embed iframe {
    display: block;
    width: 100%;
    height: 300px;       /* yüksekliği ihtiyacına göre ayarla */
    border: 0;
}


/* --- Mobil Haritalar(≤576px) --- */
@media (max-width: 900px) {
  .harita-embed { 
   
    width: 100%;
    max-width: 100%;   /* istersen sınır koy */
    margin: 0 auto 10px auto; /* altta 20px boşluk */
    border-radius: 12px; 
    overflow: hidden;   /* taşma olmasın */
  }
  .harita-embed iframe {
    
    width: 100%;
    height: 300px;       /* yüksekliği ihtiyacına göre ayarla */
    border: 0;
  }
}

























/* ====== BLOG KARTLARI (3 sütun, eşit yükseklik, uyumlu tema) ====== */
:root{
  /* Tema değişkenleri — sadece burayı uyarlaman yeter */
  --color-bg: #0f1115;            /* sayfa/section koyu gri veya sitendeki arka plan */
  --color-card: #141820;          /* kart zemini */
  --color-border: #1f2430;        /* ince sınır */
  --color-text: #dbe0ea;          /* ana metin */
  --color-muted: #a6adbb;         /* açıklama */
  --color-heading: #ffffff;       /* başlık rengi */
  --color-accent: #00a3ff;        /* buton/hover vurgu (tema rengine çek) */
  --shadow-soft: 0 6px 18px rgba(0,0,0,.25);
  --radius-lg: 16px;
  --radius-md: 12px;
  --radius-sm: 10px;
}

/* (Opsiyonel) güzel başlık fontu — globalinde varsa kaldırabilirsin */
/* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600&display=swap'); */

.our-service-wrapper,
.our-service-wrapper.section-padding{
  background: var(--color-bg);
  padding-top: 40px;
  padding-bottom: 10px;
}

/* Bootstrap satırları zaten flex; kolonları da esnetip kartı eşitleyelim */
.our-service-wrapper .row > [class*="col-"]{
  display: flex;
}

/* KART */
.single-blog-card.style-1{
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 100%;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.single-blog-card.style-1:hover{
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.35);
  border-color: #12c2e9;
}

/* ÜSTTE GÖRSEL — sabit oran, taşma yok */
.single-blog-card.style-1 .blog-featured-img{
  position: relative;
  aspect-ratio: 16 / 9; /* Destek yoksa aşağıdaki fallback çalışır */
  background: #0b0e14;
  overflow: hidden;
}
.single-blog-card.style-1 .blog-featured-img img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0; /* img’nin border radius’u karta gerek yok */
}

/* İçerik alanı — butonu alta itmek için flex sütun */
.single-blog-card.style-1 .contents{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 16px 18px;
  min-height: 220px; /* görsel çok kısa olduğunda da dengeli dursun */
  color: var(--color-text);
}

/* BAŞLIK — uzun olsa bile taşma yapma; 2 satır clamp + gerekli yerde kırma */
.single-blog-card.style-1 h3{
  margin: 4px 0 2px;
  font-size: clamp(1.08rem, 1.9vw, 1.22rem);
  line-height: 1.25;
  font-weight: 600;
  font-family: "Poppins", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol", sans-serif;
}
.single-blog-card.style-1 h3 a{
  color: var(--color-heading);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;        /* maksimum 2 satır */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.single-blog-card.style-1 h3 a:hover{
  color: var(--color-accent);
}

/* AÇIKLAMA — 3 satırda sabitle; kart yükseklikleri eşitlensin */
.single-blog-card.style-1 p{
  margin: 0;
  color: var(--color-muted);
  font-size: .95rem;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 3;       /* 3 satırda kırp */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: calc(1em * 1.55 * 3); /* clamp desteklemeyen tarayıcılar için minimum alan */
}

/* “Devamını Oku” butonu — her kartta altta aynı hizada */
.single-blog-card.style-1 .devamoku{
  margin-top: auto;            /* butonu alta iter */
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1;
  padding: 10px 14px;
  color: #0c1116;
  background: #12c2e9;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: filter .2s ease, transform .2s ease, box-shadow .2s ease;
  box-shadow: 0 6px 14px rgba(255, 127, 0, .25);
}
.single-blog-card.style-1 .devamoku span{ display:inline-block; transform: translateY(0) }
.single-blog-card.style-1 .devamoku:hover{
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(255, 255, 255, .35);
}

/* Kenar boşluklarını hassaslaştır */
.col-md-4.pl-15{ padding-left: 15px !important; }
.col-md-4.pr-15{ padding-right: 15px !important; }
.mb-25{ margin-bottom: 25px !important; }

/* Yumuşak köşeler — mevcut img’e de dokunalım */
.border-radius-15{ border-radius: var(--radius-lg) }

/* Placeholder görseli hafif soluk dursun */
.single-blog-card.style-1 .blog-featured-img img[src*="placeholder"]{
  opacity: .9;
  filter: saturate(.8);
}

/* Mobil ve tablet uyarlamalar */
@media (max-width: 991.98px){
  .single-blog-card.style-1 .contents{ min-height: 200px }
}
@media (max-width: 575.98px){
  .single-blog-card.style-1 .contents{ min-height: 180px }
  .single-blog-card.style-1 h3{ font-size: 1.05rem }
}

/* Erişilebilirlik: hareket tercihine saygı */
@media (prefers-reduced-motion: reduce){
  .single-blog-card.style-1,
  .single-blog-card.style-1 *{
    transition: none !important;
  }
}



/* === Blog kartları kolon kırılımları (mobil tek sütun) === */
.our-service-wrapper .row{
  display: flex;
  flex-wrap: wrap;
}

/* Varsayılan: 3 sütun (md ve üstü) — zaten col-md-4 ile uyumlu */
.our-service-wrapper .row > .col-md-4{
  display: flex; /* kart eşitleme için */
}

/* 992px altı: 2 sütun */
@media (max-width: 991.98px){
  .our-service-wrapper .row > .col-md-4{
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

/* 768px altı: 1 sütun (MOBİL) */
@media (max-width: 767.98px){
  .our-service-wrapper .row > .col-md-4{
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
  /* Mobilde yastıkları biraz daralt */
  .our-service-wrapper .pl-15{ padding-left: 12px !important; }
  .our-service-wrapper .pr-15{ padding-right: 12px !important; }
}






/* ====== Content Article (isolated) ====== */
.content-article{
  --ca-bg: #1d2028;          /* sayfa arka planına yakın koyu ton */
  --ca-card: #141820;        /* kart zemin rengi */
  --ca-border: #1f2430;      /* ince çerçeve */
  --ca-text: #dbe0ea;        /* metin */
  --ca-muted: #a6adbb;       /* ikincil metin */
  --ca-heading: #ffffff;     /* başlık */
  --ca-accent: #00a3ff;      /* vurgu (buton/bağlantı) */
  --ca-radius-lg: 16px;
  --ca-radius-md: 12px;
  --ca-shadow: 0 8px 22px rgba(0,0,0,.25);
  padding-top: 25px;
  padding-bottom: 25px;
  background: var(--ca-bg);
}

.content-article .container{ max-width: 1600px }

/* Kart kabı */
.content-article__card{
  background: var(--ca-card);
  border: 1px solid var(--ca-border);
  border-radius: var(--ca-radius-lg);
  box-shadow: var(--ca-shadow);
  padding: clamp(16px, 2.4vw, 24px);
  color: var(--ca-text);
}


/* İç gövde tipografi — sadece bu alan */
.content-article__body h1,
.content-article__body h2,
.content-article__body h3{
  color: var(--ca-heading);
  line-height: 1.25;
  margin: 18px 0 10px;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.content-article__body h1{ font-size: clamp(1.6rem, 2.2vw, 2rem) }
.content-article__body h2{ font-size: clamp(1.3rem, 2vw, 1.6rem) }
.content-article__body h3{ font-size: clamp(1.15rem, 1.6vw, 1.3rem) }

.content-article__body p{
  margin: 0 0 14px;
  color: var(--ca-text);
  line-height: 1.7;
}

.content-article__body ul,
.content-article__body ol{
  padding-left: 1.2rem;
  margin: 0 0 14px;
}
.content-article__body li{ margin: 6px 0 }

.content-article__body a{
  color: var(--ca-accent);
  text-decoration: none;
}
.content-article__body a:hover{ text-decoration: underline }

/* İç görseller */
.content-article__body img{
  max-width: 100%;
  height: auto;
  border-radius: var(--ca-radius-md);
}

/* Kod blokları */
.content-article__body pre,
.content-article__body code{
  background: #0b0f16;
  border: 1px solid var(--ca-border);
  border-radius: 10px;
}
.content-article__body pre{
  padding: 12px;
  overflow: auto;
  margin: 12px 0;
}
.content-article__body code{ padding: 2px 6px }

/* Tablolar */
.content-article__body table{
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0 16px;
  overflow: hidden;
  border-radius: var(--ca-radius-md);
}
.content-article__body table th,
.content-article__body table td{
  padding: 10px 12px;
  border: 1px solid var(--ca-border);
}
.content-article__body table thead th{
  background: #11161e;
  color: var(--ca-heading);
}

/* ===== Reklam bileşeni ===== */
.content-article__ad{
  background: var(--ca-card);
  border: 1px solid var(--ca-border);
  border-radius: var(--ca-radius-lg);
  box-shadow: var(--ca-shadow);
  padding: 10px;
  margin: 22px 0;              /* başlıklar arası nefes */
  overflow: hidden;
}
.content-article__ad img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  aspect-ratio: 16 / 9;        /* sabit oran */
}

/* İçerik içi figure/gallery’ler daha güzel dursun */
.content-article__body figure{
  margin: 16px 0;
}
.content-article__body figcaption{
  color: var(--ca-muted);
  font-size: .9rem;
  margin-top: 6px;
  text-align: center;
}

/* Küçük ekran ince ayar */
@media (max-width: 575.98px){
  .content-article__card{ padding: 14px }
  .content-article__ad{ margin: 18px 0; padding: 8px }
}








/* ================== PAGE HERO (video arkaplanlı) ================== */
.page-hero{
  --ph-bg: #0f1115;
  --ph-text: #dbe0ea;
  --ph-muted: #a6adbb;
  --ph-heading: #ffffff;
  --ph-accent: #00a3ff;
  --ph-border: #1f2430;

  position: relative;
  overflow: clip;
  background: var(--ph-bg);
  color: var(--ph-text);

  /* Yükseklik: içeriğe göre ama minimum bir alan bırak */
  min-height: clamp(280px, 36vh, 460px);
  display: flex;
  align-items: flex-end; /* başlık-alt kısma yaslanır */
  padding-top: 32px;
  padding-bottom: 24px;
}

.ph-container{
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
  z-index: 3; /* video ve overlay’in üstünde */
}

/* Başlık */
.ph-title{
  color: var(--ph-heading);
  font-weight: 800;
  font-size: clamp(1.9rem, 3vw, 2.7rem);
  line-height: 1.2;
  letter-spacing: -.015em;
  margin: 0 0 12px;
  word-break: break-word;
  overflow-wrap: anywhere;
  text-wrap: balance;
  position: relative;
  padding-bottom: 10px;
}
.ph-title::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:72px; height:3px; border-radius:3px;
  background: var(--ph-accent);
  box-shadow: 0 8px 18px rgba(0,163,255,.28);
}

/* Kısa açıklama */
.ph-excerpt{
  margin: 6px 0 14px;
  color: var(--ph-muted);
  font-size: clamp(1rem, 1.2vw, 1.08rem);
  line-height: 1.65;
}

/* Breadcrumb pill */
.ph-breadcrumb ul{
  display:flex; flex-wrap:wrap; gap:8px;
  list-style:none; margin:0; padding:0; font-size:.95rem;
}
.ph-breadcrumb li{ display:inline-flex; align-items:center; color:var(--ph-muted); }
.ph-breadcrumb a{
  display:inline-flex; align-items:center;
  padding: 8px 12px;
  border-radius:9999px;
  border:1px solid var(--ph-border);
  color:#0e131a; background: var(--ph-accent);
  border-color: color-mix(in oklab, var(--ph-accent) 60%, var(--ph-border));
  box-shadow: 0 6px 14px rgba(0,163,255,.28);
  outline:none;
}
.ph-breadcrumb a:hover,
.ph-breadcrumb a:focus-visible{
  color:#0e131a; background: var(--ph-accent);
  border-color: color-mix(in oklab, var(--ph-accent) 60%, var(--ph-border));
  box-shadow: 0 6px 14px rgba(0,163,255,.28);
  outline:none;
}
.ph-breadcrumb li.is-active a{
  color:#0d1016; font-weight:700; background: #12c2e9;
  border-color: color-mix(in oklab, #12c2e9 70%, var(--ph-border));
  box-shadow: 0 0px 2px rgba(255,127,0,.35);
}

/* ===== Arka plan video/resim katmanı ===== */
.ph-bg{
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none;        /* tıklamalar içeriğe gider */
}
.ph-bg video,
.ph-bg iframe,
.ph-bg img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;           /* doldur, kırp */
  display: block;
  background: #0b0f16;
}

/* Koyu overlay – metni okunur yapar */
.ph-overlay{
  position: absolute; inset: 0; z-index: 1;
  
}

/* Renkli “glow” efekti – ekrandaki görünüme benzer */
.ph-glow{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    radial-gradient(900px 420px at 85% 0%, rgba(255,128,64,.20), transparent 60%),
    radial-gradient(900px 420px at 15% 0%, rgba(128,64,255,.16), transparent 60%);
  mix-blend-mode: screen; opacity: .7;
}

/* Küçük ekran ince ayar */
@media (max-width: 575.98px){
  .page-hero{ padding-top: 24px; padding-bottom: 16px; min-height: 240px; }
  .ph-title::after{ width:56px; }
}

/* Hareketi azaltan kullanıcılar için videoyu devre dışı bırak */
@media (prefers-reduced-motion: reduce){
  .ph-bg video{ display:none !important; }
}


/* ================== COMPACT HERO (zarif + mobil uyumlu) ================== */
/* HERO'yu daralt */
.page-hero--compact{
  min-height: clamp(140px, 22vh, 130px);  /* önce 240–380 civarıydı */
  padding-top: 18px;
  padding-bottom: 14px;
}

/* Videonun kadrajını biraz yukarı/merkeze al (isteğe bağlı) */
.page-hero--compact .ph-bg video,
.page-hero--compact .ph-bg img{
  object-position: center 30%; /* 30% yukarıdan kadrajla; istersen 50% yap */
}


/* Başlık: daha küçük, 2 satırla sınırla, taşma yok */
.page-hero--compact .ph-title{
  font-size: clamp(1.6rem, 2.3vw, 2.2rem);
  padding-bottom: 8px;
  margin-bottom: 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;             /* en fazla 2 satır */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Kısa açıklama: daha zarif, 2 satır clamp */
.page-hero--compact .ph-excerpt{
  font-size: clamp(.95rem, 1vw, 1.02rem);
  line-height: 1.55;
  margin: 6px 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;             /* en fazla 2 satır */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Breadcrumb: daha ince pill ve daha küçük boşluklar */
.page-hero--compact .ph-breadcrumb ul{ gap: 6px; }
.page-hero--compact .ph-breadcrumb a{
  padding: 6px 10px;
  border-radius: 9999px;
}

/* -------- Mobil iyileştirmeler -------- */
@media (max-width: 767.98px){
  /* Breadcrumb tek satır ve yatay kaydırılabilir — taşma yapmaz */
  .page-hero--compact .ph-breadcrumb{
    position: relative;
  }
  .page-hero--compact .ph-breadcrumb ul{
    white-space: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;          /* Firefox */
    font-size: .88rem;
  }
  .page-hero--compact .ph-breadcrumb ul::-webkit-scrollbar{ display: none; } /* WebKit */

  /* Sağ kenarda yumuşak maske — kaydırılabilir olduğunu belli eder */
  .page-hero--compact .ph-breadcrumb::after{
    content: "";
    position: absolute;
    right: 0; top: 0; bottom: 0;
    width: 40px;
    background: linear-gradient(90deg, transparent,);
    pointer-events: none;
  }

  /* Aktif kırıntı başlığı çok uzunsa ellipsis uygula */
  .page-hero--compact .ph-breadcrumb li.is-active span[itemprop="name"]{
    display: inline-block;
    max-width: 60vw;                /* ekranın ~%60’ı kadar */
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
    white-space: nowrap;
  }

  /* Başlık alt çizgisi daha kısa */
  .page-hero--compact .ph-title::after{ width: 48px; }
}

/* İsteğe bağlı: çok dar ekranlarda ara kırıntıları gizle (sadece Home + Aktif kalsın) */
/*
@media (max-width: 420px){
  .page-hero--compact .ph-breadcrumb li:not(:first-child):not(.is-active){ display: none; }
}
*/



/* ===== Sadece bu içerikte ortala ===== */
.is-centered{
  text-align: center;
}

/* Başlıklar, paragraflar, alıntılar ortalansın */
.is-centered h1,
.is-centered h2,
.is-centered h3,
.is-centered h4,
.is-centered h5,
.is-centered h6,
.is-centered p,
.is-centered blockquote{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/* Medya: ortala ve bloke çevir */
.is-centered img,
.is-centered video,
.is-centered iframe{
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  height: auto;
}

/* Listeler: blok olarak ortada dursun ama maddeler SOL hizalı kalsın (okunurluk) */
.is-centered ul,
.is-centered ol{
  display: inline-block;         /* kutuyu ortalar */
  text-align: left;              /* madde metni sol */
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.2rem;          /* işaretler için iç boşluk koru */
}

/* Tablolar: kutu ortada, hücreler sol hizalı kalsın */
.is-centered table{
  margin-left: auto;
  margin-right: auto;
}
.is-centered th,
.is-centered td{
  text-align: left;
}

/* Kod blokları: geniş satırlarda taşmayı engelle */
.is-centered pre{
  text-align: left;              /* kod sol kalsın */
  display: inline-block;
  max-width: 100%;
}

/* İsteğe bağlı: dar ekranda biraz daha şık */
@media (max-width: 575.98px){
  .is-centered .ph-breadcrumb ul{ justify-content: center; } /* varsa breadcrumb */
}




/* === AKTİF BREADCRUMB: daha parlak, daha geniş shimmer === */
.ph-breadcrumb li.is-active a{
  position: relative;
  isolation: isolate;

  /* 1) hareketli beyaz şerit  2) sabit turuncu zemin */
  background:
    linear-gradient(115deg,
      rgba(255,255,255,0)   0%,
      rgba(255,255,255,.10) 8%,
      rgba(255,255,255,.38) 18%,
      rgba(255,255,255,.62) 28%,   /* tepe: daha opak */
      rgba(255,255,255,.38) 38%,
      rgba(255,255,255,.10) 48%,
      rgba(255,255,255,0)   58%) ,
    linear-gradient(0deg, #12c2e9, #12c2e9);

  background-size: 240% 100%, 100% 100%;   /* şeridi biraz genişlettik */
  background-position: 200% 50%, 0 0;
  background-blend-mode: screen, normal;   /* beyaz parıltıyı daha etkili karıştır */

  color:#0d1016;
  font-weight:700;
  border-color: color-mix(in oklab, #12c2e9 70%, var(--ph-border));
  box-shadow: 0 10px 22px rgba(255,127,0,.36);

  animation: phShimmer 5.5s linear infinite, phPulse 4.2s ease-in-out infinite;
  will-change: background-position, filter, box-shadow;
}

/* hover’da shimmer bir tık hızlansın (opsiyonel) */
.ph-breadcrumb li.is-active a:hover{
  animation-duration: 3.2s, 3.2s;
}


/* arka plan parıltısı soldan sağa şerit gibi akar */
@keyframes phShimmer{
  0%   { background-position: 200% 50%, 0 0; }
  100% { background-position: -200% 50%, 0 0; }
}

/* yumuşak nefes efekti: hafif parlaklık + gölge */
@keyframes phPulse{
  0%,100% { filter: brightness(1.00); box-shadow: 0 10px 22px rgba(255,127,0,.36); }
  50%     { filter: brightness(1.12); box-shadow: 0 14px 28px rgba(255,127,0,.48); }
}

/* hareketi azalt tercihine saygı */
@media (prefers-reduced-motion: reduce){
  .ph-breadcrumb li.is-active a{
    animation: none;
    background: #12c2e9;
  }
}
















/*Paylaşım Ve Görüntüleme Alanı*/
/* Alt aksiyonlar: buton + paylaş ikonları + görüntülenme */
.single-blog-card.style-1 .card-actions{
  margin-top: auto;              /* alta sabitler */
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;               /* dar alanda alta insin, hizalar korunur */
}

/* Paylaş grubu */
.single-blog-card.style-1 .share-group{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.single-blog-card.style-1 .share-btn{
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  background: #121722;
  border: 1px solid var(--color-border);
  color: var(--color-muted);
  text-decoration: none;
  transition: transform .15s ease, box-shadow .2s ease, color .2s ease, border-color .2s ease, background .2s ease;
}
.single-blog-card.style-1 .share-btn:hover{
  transform: translateY(-1px);
  color: #0d1016;
  background: var(--color-accent);
  border-color: color-mix(in oklab, var(--color-accent) 60%, var(--color-border));
  box-shadow: 0 8px 16px rgba(0,0,0,.35), 0 6px 14px color-mix(in oklab, var(--color-accent) 40%, transparent);
}

/* Görüntülenme rozeti */
.single-blog-card.style-1 .view-count{
  margin-left: auto;            /* sağa yaslar */
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .92rem; color: var(--color-muted);
  padding: 6px 10px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: rgba(20,24,32,.55);           /* hafif transparan */
  backdrop-filter: blur(4px);
}
.single-blog-card.style-1 .view-count svg{
  opacity: .85;
}

/* Dar ekranda rozeti buton altına al, boşluk ekle */
@media (max-width: 420px){
  .single-blog-card.style-1 .view-count{
    margin-left: 0;
  }
}

/* card-actions: solda buton, sağda meta */
.single-blog-card.style-1 .card-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;     /* dar ekranda alta insin */
}

/* sağ blok: görüntülenme + paylaş */
.single-blog-card.style-1 .card-meta{
  margin-left:auto;                 /* sağa yasla */
  display:inline-flex;
  align-items:center;
  gap:10px;
}

/* card-meta içindeyken view-count soldan gelmesin */
.single-blog-card.style-1 .card-meta .view-count{
  margin-left:0;
}

/* dar ekran — meta bloğu genişlesin, elemanları ayırsın */
@media (max-width: 420px){
  .single-blog-card.style-1 .card-meta{
    width:100%;
    justify-content:space-between;
  }
}

.online-badge{
  margin-left:1px; padding:0px 0px;

  backdrop-filter: blur(4px);
  color: var(--color-muted, #a8b0bf);
  font-size:.92rem; line-height:1.9;
}
.online-badge b{ font-variant-numeric: tabular-nums; color:#fff; }
























:root { --lb-controls-h: 64px; } /* alt çubuğun yüksekliği */

/* Katman ve yerleşim */
.ph-lightbox{
  position: fixed; inset: 0;
  display: none; align-items: center; justify-content: center;
  background: rgba(0,0,0,.92);
  z-index: 2147483647; 
  isolation: isolate;
  padding: 24px 16px; /* kenarlık nefesi */
}
.ph-lightbox.is-open{ display: flex; }

.ph-lightbox__imgwrap{
  position: relative;
  z-index: 1;
  max-width: 92vw;
  /* Alt kontrol barına yer aç: görüntü yüksekliğini biraz kıs */
  max-height: calc(92vh - var(--lb-controls-h));
  display: flex; flex-direction: column; align-items: center; gap: 8px;
}
.ph-lightbox__img{
  max-width: 92vw; 
  max-height: calc(92vh - var(--lb-controls-h) - 24px);
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0,0,0,.6);
  user-select: none;
}

/* Altyazı artık resmin ALTINDA akışta */
.ph-lightbox__caption{
  color: #fff; text-align: center; font-size: 14px; opacity: .85;
  line-height: 1.4;
}

/* Kapat butonu (sağ üst) */
.ph-lightbox__close{
  position: absolute;
  top: max(16px, env(safe-area-inset-top));
  right: max(16px, env(safe-area-inset-right));
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 999px; cursor: pointer;
  background: rgba(22,24,28,.96);
  color: #fff; font-size: 18px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 2px 12px rgba(0,0,0,.35);
  backdrop-filter: blur(2px);
}
.ph-lightbox__close:hover{ background: rgba(22,24,28,1); }
.ph-lightbox__close:active{ transform: scale(.98); }

/* === ALT KONTROL ÇUBUĞU === */
.ph-lightbox__controls{
  position: fixed;
  left: 0; right: 0;
  bottom: 0;
  z-index: 3;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  /* antrasit + üstten şeffaf gradyan */
  background: 
    linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0)) ,
    rgba(20,22,26,.5);
  backdrop-filter: blur(3px);
  pointer-events: auto;
  height: var(--lb-controls-h);
}

/* Butonlar (antrasit ve büyük dokunmatik alan) */
.ph-lightbox__btn{
  width: 48px; height: 48px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 999px; cursor: pointer;
  color: #fff; font-size: 24px;

  background: rgba(22,24,28,.96);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.ph-lightbox__btn:hover{ background: rgba(22,24,28,1); }
.ph-lightbox__btn:active{ transform: scale(.98); }

/* Mobil ayarları */
@media (max-width: 768px){
  :root { --lb-controls-h: 56px; }
  .ph-lightbox__btn{ width: 44px; height: 44px; font-size: 22px; }
  .ph-lightbox__caption{ font-size: 13px; }
}








/* ====== GÖRÜNÜRLÜK KONTROLÜ ====== */
/* mobile-first: mobil/tablet yeni slider açık, eski slider kapalı */
#anasayfa-slider{ display:none; }
#anasayfa-slider-fluid{ display:block; }

/* desktop/laptop'ta eski slider'ı kullan */
@media (min-width: 992px){
  #anasayfa-slider{ display:block; }
  #anasayfa-slider-fluid{ display:none; }
}



/* ==== REKLAM BLOĞU: daima normal akışta, slider'dan SONRA başlasın ==== */
.reklam{
  margin: clamp(0px, 2.4vw, 0px) auto 0 !important; /* Slider'dan sonra nefes payı */
}


#anasayfa-slider-fluid .fluid-text{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:clamp(8px,2vw,24px);
  pointer-events:none; /* metin tıklanmayacaksa */
}

/* Akışkan tipografi (kısa) */
#anasayfa-slider-fluid .s1{
  color:#fff; font-weight:900;
  text-shadow:0 0 5px #4475fc;
  font-size:clamp(20px,4.2vw,34px);
  line-height:1.1;
}
#anasayfa-slider-fluid .s2,
#anasayfa-slider-fluid .s3{
  color:#fff; font-weight:900;
  text-shadow:0 0 5px #ff0070;
  font-size:clamp(16px,3.6vw,26px);
  line-height:1.3;
}

/* Dönen metin alanı; mevcut yapıya paralel */
#anasayfa-slider-fluid .m-rotator{
  margin-top:clamp(8px,1.6vw,18px);
  font-size:clamp(18px,3.4vw,30px);
  font-weight:900;
  color:#e9f2ff;
  text-shadow:0 0 22px #000;
}
#anasayfa-slider-fluid .m-rotator span{ display:none; }
#anasayfa-slider-fluid .m-rotator span.aktif{ display:inline-block; }

/* iOS güvenlik boşluğu (home indicator) */
@supports (padding: max(0px)){
  #anasayfa-slider-fluid{ padding-bottom:max(0px, env(safe-area-inset-bottom)); }
}

/* Tablet ve daha küçük ekran ince ayarları */
@media (max-width: 768px){
  #anasayfa-slider-fluid{ aspect-ratio:16/9; } /* istersen 9/16 dikey videoda değiştir */
  #anasayfa-slider-fluid .s1{ font-size:clamp(18px,5vw,26px); }
  #anasayfa-slider-fluid .s2,
  #anasayfa-slider-fluid .s3{ font-size:clamp(14px,4.2vw,20px); }
}

/* Çok dar telefonlar */
@media (max-width: 420px){
  #anasayfa-slider-fluid .m-rotator{ font-size:clamp(16px,4.4vw,22px); }
}

/* ---- Mobil/Tablet sürümünü aç, desktop'ta kapat ---- */
#anasayfa-slider-fluid{ display:block; }
@media (min-width: 992px){
  #anasayfa-slider-fluid{ display:none; }
}

/* ---- Yeni slider temel ayarlar ---- */
#anasayfa-slider-fluid{
  position:relative;
  width:100%;
  /* Başlangıç oranı: JS gerçek oranı yükleyince bunu değiştirecek */
  aspect-ratio: 16/9;
  overflow:hidden;
  background:#000;
  margin:0;
  padding:0;
  clear:both;            /* alttaki içerik bindirmesin */
  z-index:0;
}

/* Video/Resim elemanları: kırpmasız */
#anasayfa-slider-fluid .v-el,
#anasayfa-slider-fluid .i-el{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;           /* kırpma yok */
  object-position:center center;
  background:#000;
}


/* iOS safe-area */
@supports (padding: max(0px)){
  #anasayfa-slider-fluid{ padding-bottom:max(0px, env(safe-area-inset-bottom)); }
}

/* Çok dar telefonlar */
@media (max-width:420px){
  #anasayfa-slider-fluid .m-rotator{ font-size:clamp(16px,4.4vw,22px); }
}





/* === SABİT MENÜ OFFSET'İNİ SADECE MOBİL/TABLETTE UYGULA === */

/* Mobil & tablet */
@media (max-width: 991.98px){
  :root{ --header-h: 64px; } /* JS bunu güncelliyorsa yine kullanılır */

  /* Sabit menü */
  .site-header, #ust-menu, .sabit-menu, header.site-header{
    position: fixed; top: 0; left: 0; right: 0;
    z-index: 1000;
  }

  /* Sayfayı menü kadar aşağı it */
  body.has-fixed-header{
    padding-top: var(--header-h);
  }

  /* Anchor'lar menünün altında kalmasın */
  [id]{ scroll-margin-top: var(--header-h); }

  /* Slider katmanları bindirmesin */
  #anasayfa-slider,
  #anasayfa-slider-fluid{
    margin-top: 0 !important;
    z-index: 0;
  }
  #anasayfa-slider .row,
  #anasayfa-slider-fluid .fluid-row{
    position: relative;
    z-index: 1;
  }
}

/* Masaüstü/laptop (≥992px): önceki düzeni KORU */
@media (min-width: 992px){
  /* Menü sabit değilse bozma; temanın orijinaline bırak */
  .site-header, #ust-menu, .sabit-menu, header.site-header{
    position: static !important;
    z-index: auto;
  }

  /* Her ihtimale karşı, padding eklenmişse kaldır */
  body.has-fixed-header{
    padding-top: 0 !important;
  }

  /* Scroll-margin-top ihtiyacı yoksa etkisiz bırak (opsiyonel) */
  [id]{ scroll-margin-top: 0 !important; }
}






:root{
  --safe-area-top: env(safe-area-inset-top, 0px);
  --bizimkiler-top: 0px; /* JS burayı set edecek */
}

/* Header’da margin/border varsa “göz yanılması” olmasın */
#site-header{ margin:0; border:0; }

/* #bizimkiler header’ın ALTINA sabitlenecek */
#bizimkiler{
  position: fixed;
  z-index: 999990;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(280px, 70vw, 1200px);
  height: 50px;

  top: calc(var(--bizimkiler-top) + 0px); /* anlık header altı */
  /* üstteki 0px’i +6px gibi yaparak mikro boşluk verebilirsin */

  background: #00adef75;
  box-shadow: 0 0 20px #00000091;
  overflow: hidden;
  
}





/* ==== MENÜ AÇIKKEN SCROLL KİLİDİ ==== */
html.body-lock, body.body-lock{
  overflow: hidden !important;
  height: 100% !important;
  touch-action: none !important;
  overscroll-behavior: contain !important;
}

/* Overlay görünürlüğünü güvenli yönet (tıklanamaz/scroll yemez) */
#menu-bg{
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}
.menu-open #menu-bg{
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  display: block; /* mevcut kodun display:none kullanıyorsa sorun olmasın */
}
