/*====================================================
//  Variables
//  Common
//  Logo animation
//===================================================*/
/*====================================================
//  Variables
//===================================================*/
/*====================================================
//  Common
//===================================================*/
*, *::before, *::after {
  box-sizing: border-box;
}

* {
  transition: color 0.15s, background 0.15s, border 0.15s, opacity 0.15s;
}

*:after, *:before {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  outline: none;
}

@-ms-viewport {
  width: device-width;
}
html {
  position: relative;
  box-sizing: border-box;
  height: 100%;
  font-size: 100%;
}

body {
  position: relative;
  min-width: 310px;
  height: 100%;
  margin: 0;
  background-color: #000000;
}

/*====================================================
//  Logo animation
//===================================================*/
.hero-logo {
  display: block !important;
  width: 300px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -150px;
  margin-top: -75px;
  transition: all 400ms ease-out;
}
.hero-logo svg {
  height: 140px;
  width: 300px;
  transition: all 400ms ease-out;
}
.hero-logo.is-animated svg {
  opacity: 1;
}
.hero-logo .js-hero-logo-polygon {
	 fill: #000000;  /* İç dolgu siyah */
  stroke: #ffffff;  /* Beyaz çizgi */
  stroke-width: 4;  /* Beyaz çizgiyi eşit hale getirmek için stroke genişliği ayarlandı */
  
}
.hero-logo .outer-stroke {
  fill: none;  /* Dış çizgi sadece çizgi olacak */
  stroke: #000000;  /* Dış siyah çizgi */
  stroke-width: 10;  /* Siyah çizgiyi eşit yapmak için stroke genişliği ayarlandı */
   
}
.hero-logo.end-animation .js-hero-logo-polygon {
  fill: #000000;  /* Logonun içini siyah doldurduk */
}

  
 /* Yazı belirme ve kaybolma */
    .fade-in-text {
      opacity: 0;  /* İlk başta görünmez */
      transition: opacity 2s ease-in-out;  /* Belirme süresi */
    }

    .fade-in-text-visible {
      opacity: 1;  /* Belirginleşir */
    }
  
   /* Yazı kaybolma */
    .fade-in-text {
      opacity: 1;  /* İlk başta görünür */
      transition: opacity 1s ease-in-out;  /* Yavaşça kaybolur */
    }

     .fade-out-text {
      opacity: 0;  /* Yavaşça kaybolur */
      transition: opacity 2s ease-in-out;  /* Kaybolma süresi */
    }