@font-face {
  font-family: 'MostraNuova';
  src: url('/fonts/MostraNuova-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Merchant';
  src: url('/fonts/Merchant-Thin.otf') format('opentype');
  font-weight: normal; 
  font-style: normal;
}

@font-face {
  font-family: 'ppeditorialold';
  src: url('/fonts/ppeditorialold-italic.otf') format('opentype');
  font-weight: normal; 
  font-style: normal;
}
@font-face {
  font-family: 'ppeditorialold_regular';
  src: url('/fonts/ppeditorialold-ultralight.otf') format('opentype');
  font-weight: normal; 
  font-style: normal;
}
@font-face {
  font-family: 'Outfit';
  src: url('/fonts/Outfit-Medium.ttf') format('truetype');
  font-weight: normal; 
  font-style: normal;
}
@font-face {
  font-family: 'Outfit_light';
  src: url('/fonts/Outfit-Light.ttf') format('truetype');
  font-weight: normal; 
  font-style: normal;
}
@font-face {
  font-family: 'Courier';
  src: url('/fonts/Courier Prime Sans.ttf') format('truetype');
  font-weight: normal; 
  font-style: normal;
}


body{
  max-width: 100%;
  overflow-x: hidden;
}
img {
  display: block;  /* inline öğelerin altında boşluk sorununu engeller */
  max-width: 100%; /* ebeveyn genişliğini aşmaz */
  height: auto;    /* orantıyı korur */
  width: 100%;     /* mümkünse genişliği ebeveyne göre ayarlar */
}
h1,
h2,
h3,
h4,
h5,
h6,
span,
p{
  font-family: 'Outfit', sans-serif;
}
.mostra_font{
  font-family: 'MostraNuova', sans-serif;
}
.courier-font{
  font-family: 'Courier', sans-serif;
}
.outfit_font{
  font-family: 'Outfit', sans-serif;
}
.outfit_light_font{
  font-family: 'Outfit_light', sans-serif;
}
.ppeditorialold{
  font-family: 'ppeditorialold', sans-serif;
}
.ppeditorialold_regular{
  font-family: 'ppeditorialold_regular', sans-serif;
}
.merchant_font{
  font-family: 'Merchant', sans-serif;
}
.menu_font{
  font-family: 'MostraNuova', sans-serif;
  font-size: 22px;
}
.poppins-regular {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.menu_selected{
  color: #EA1939;
  position: relative;
}
.menu_selected::after {
  content: '';
  position: absolute;
  bottom: -25px;
  left: 0;
  width: 100%;
  height: 20px; 
  background-image: url('../selected_menu.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.menu_lang_button{
  font-size: 22px;
  display: flex;
  gap:10px;
}
.menu_search_button{
  font-size: 22px;
}
.sub_menu {
  display: none;
  position: absolute;
  top: 100%; 
  left: 0;
  background: white;
  font-size: 22px;
  min-width: 100%;
  z-index: 20;
  border: 1px solid #ccc;
  padding: 25px;
}
.parent_menu {
  position: relative;
}
.parent_menu:hover .sub_menu {
  display: block;
}
.parent_menu .parent-item > i {
    transition: transform 0.2s ease-in-out;
    display: inline-block;
}
.selected_meet{
  background-color: #0C2156 !important;
  color: #C2DEED !important;
}
.parent_menu:hover .parent-item > i {
    transform: rotate(180deg);
}
.btn-red{
    background-color: #EA1939;
    color: #fff;
    border: 1px solid #EA1939;
    border-bottom-left-radius: 40px;
    border-top-right-radius: 40px;
    padding: 15px 20px;
    font-size: 18px;
    transition: 0.2s ease-in-out;
}
.btn-red:hover{
    background-color: #fff;
    color: #EA1939;
    transition: 0.2s ease-in-out;

}
.btn-wp{
    background-color: #EA1939;
    color: #fff;
    border: 1px solid #EA1939;
    border-radius: 100%;
    width: 60px;
    height: 60px;
    font-size: 30px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    transition: 0.2s ease-in-out;
}
.btn-wp:hover{
    background-color: #fff;
    color: #EA1939;
    transition: 0.2s ease-in-out;

}
.btn-aqua{
    background-color: #8AD4E2;
    color: #0C2156;
    border: 1px solid #8AD4E2;
    border-bottom-left-radius: 40px;
    border-top-right-radius: 40px;
    padding: 15px 20px;
    font-size: 18px;
    transition: 0.2s ease-in-out;
}
.btn-aqua:hover{
    background-color: #0C2156;
    color: #8AD4E2;
    transition: 0.2s ease-in-out;

}
.btn-blue{
    background-color: #0C2156;
    color: #fff;
    border: 1px solid #0C2156;
    border-bottom-left-radius: 40px;
    border-top-right-radius: 40px;
    padding: 15px 20px;
    font-size: 18px;
    transition: 0.2s ease-in-out;
}
.btn-blue:hover{
    background-color: #fff;
    color: #0C2156;
    transition: 0.2s ease-in-out;

}
.red-underline {
  text-decoration-line: underline;
  text-decoration-thickness: 5px;
  text-decoration-color: #EA1939; 
}


.form-btn-blue{
    background-color: #5BCBF5;
    color: #fff;
    border: 1px solid #5BCBF5;
    border-bottom-left-radius:6px;
    border-top-right-radius:6px;
    padding: 10px 55px;
    font-size: 12px;
    transition: 0.2s ease-in-out;
}
.form-btn-blue:hover{
    background-color: #fff;
    color: #5BCBF5;
    transition: 0.2s ease-in-out;

}
.form-btn-red{
    background-color: #EA1939;
    color: #fff;
    border: 1px solid #EA1939;
    border-bottom-left-radius:6px;
    border-top-right-radius:6px;
    padding: 10px 55px;
    font-size: 12px;
    transition: 0.2s ease-in-out;
}
.form-btn-red:hover{
    background-color: #fff;
    color: #EA1939;
    transition: 0.2s ease-in-out;

}
#upButton {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s;
}

#upButton.visible {
  opacity: 1;
  visibility: visible;
}

#wpButton {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s;
}

#wpButton.visible {
  opacity: 1;
  visibility: visible;
}
.custom-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    justify-content: center;
    align-items: center;
}

.custom-modal-content {
    background: white;
    padding: 20px 30px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
    background-image: url('../modal_bg.svg');
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 500px;
    width: 90%;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    position: relative;
    animation: fadeIn 0.3s ease-in-out;
}

.custom-close {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 24px;
    cursor: pointer;
}
.five_item{
  color:#231F20;
  border-top-right-radius: 50px;
  border-bottom-left-radius: 50px;
  padding:15px;
  transition: 0.5s ease-in-out;
}
.five_item_active{
  background-color: #EA1939;
  color: #fff;
}
.five_item:hover{
  background-color: #EA1939;
  color: #fff;
  transition: 0.5s ease-in-out;
}
.five_item_element{
  display: none;
}
.five_item_element_active{
  display: block;
}
@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}
.overlay {
  position: relative;
}
.overlay::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.137);
  z-index: 1;
  pointer-events: none;
}

.overlay_blue {
  position: relative;
}
.overlay_blue::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0c21569c;
  z-index: 2;
  transition: opacity 0.4s ease;
  pointer-events: none;
}
.overlay_blue:hover::after {
  opacity: 0;
}
.overlay_blue .second_card_text {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
  z-index: 3;
}
.cardHoverText{
  color: #fff;
}
.overlay_blue:hover .cardHoverText{
  color: #8AD4E2;
}

.overlay_blue:hover .second_card_text {
  opacity: 1;
  transform: translateY(0);
}

.overlay_blue .second_card_title {
  transition: transform 0.4s ease;
  z-index: 3;
}

.overlay_blue:hover .second_card_title {
  transform: translateY(-20px);
}

.overlay_blue .second_card_icon {
  filter: brightness(0) invert(1); /* beyaz yapar */
  transition: filter 0.4s ease;
  z-index: 3;
}

.overlay_blue:hover .second_card_icon {
  filter: none;

}
.banner_blue_bg::after{
 content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0c21569c;
  z-index: 1;
}

.banner_overlay::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.247);
  z-index: 1;
}
.consulting_first_circle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  align-items: center;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background-color: #fff;
  text-align: center;
  box-shadow: 20px 15px 27px rgba(0, 0, 0, 0.2);
  
}

.consulting_first_circle::after {
  content: "";
  position: absolute;
  top: -60px;
  left: calc(50% - 0px);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #fff;
  border: 12px solid #EA1939;
  z-index: 2;
}

.arc-fill {
    position: absolute;
    top: -40px;
    left: -60px;
    width: 200px;
    height: 370px;
    border-top: 0 solid transparent;
    border-left: 0 solid transparent;
    border-bottom: 0 solid transparent;
    border-right: none;
    border-radius: 185px 0 0 185px;
    z-index: 1;
    animation: borderLoad 1.5s forwards infinite;
}

.arc-fill_second {
    position: absolute;
    top: -40px;
    right: -115px;
    width: 200px;
    height: 370px;
    border-top: 0 solid transparent;
    border-right: 0 solid transparent;
    border-bottom: 0 solid transparent;
    border-left: none;
    border-radius: 185px 0 0 185px;
    transform: rotate(180deg);
    z-index: 1;
    animation: borderLoad 1.5s forwards infinite;
}

@keyframes borderLoad {
  0% {
    border-top-width: 0;
    border-left-width: 0;
    border-bottom-width: 0;
    border-top-color: transparent;
    border-left-color: transparent;
    border-bottom-color: transparent;
  }
  33% {
    border-top-width: 12px;
    border-top-color: #EA1939;
  }
  66% {
    border-left-width: 12px;
    border-left-color: #EA1939;
  }
  100% {
    border-bottom-width: 12px;
    border-bottom-color: #EA1939;
  }
}
@keyframes borderLoadSecond {
  0% {
    border-top-width: 0;
    border-right-width: 0;
    border-bottom-width: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
  }
  33% {
    border-top-width: 12px;
    border-top-color: #EA1939;
  }
  66% {
    border-right-width: 12px;
    border-right-color: #EA1939;
  }
  100% {
    border-bottom-width: 12px;
    border-bottom-color: #EA1939;
  }
}


.lotus_animate{
  animation: rotate360 35s linear infinite;

}
@keyframes rotate360 {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.formActive{
  display: flex;
}
.formDisabled{
  display: none;
}
.formTabActive{
  background-color: #FFF9F5 !important;
  color: #0C2156 !important;
  border-top-right-radius: 15px !important;
  border-bottom-left-radius: 15px !important;
}

.tarif ul{
  display: block;
  list-style-type: disc;        
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 40px;             
  padding-left: 0;              
}
.tarif ul li{
  display: list-item;
  text-align: match-parent;
  font-size: 30px;  
}
.tarif h3{
  font-size: 45px;
}
.menu-item,
.btn-red { 
  white-space: nowrap; 
}

.btn-red{
  display: inline-flex;        /* içeriği tek satırda tut */
  align-items: center;
}

/* Safari’de olası taşmaları kesmek için */
nav ul#menu {
  -webkit-overflow-scrolling: touch;
}
@media only screen and (max-width: 1024px) {
    .menu_selected::after {
      display: none; 
    }
     .consulting_first_circle {
    width: 200px;
    height: 200px;
  }
  .consulting_first_circle::after {
    top: -30px;
    left: calc(50% - 0px);
    width: 30px;
    height: 30px;
    border-width: 8px;
  }

  .arc-fill {
    top: -20px;
    left: -40px;
    width: 135px;
    height: 235px;
    border-width: 8px;
    border-radius: 115px 0 0 115px;
  }
    .arc-fill_second {
    top: -20px;
    right: -40px;
    width: 135px;
    height: 235px;
    border-width: 8px;
    border-radius: 115px 0 0 115px;
  }
  .tarif h3{
    font-size: 25px;
  }
  .tarif ul li{
    font-size: 20px;  
  }
  .btn-red{
    font-size: 15px;
  }
   .btn-aqua{
    font-size: 15px;
  }
  .btn-blue{
    font-size: 15px;
  }
}