/* Speakymobil Header V7
   Referans kaynak ölçülerine göre üst logo/header düzeni.
   Yalnızca header alanını etkiler; ana sayfa ve footer yapısına dokunmaz. */

/* Header kabuğu: referanstaki genişlik, boşluk ve üç sütunlu düzen */
.header{
  padding:16px 0 12px!important;
  position:relative!important;
  z-index:20!important;
}
.header>.container-custom{
  width:calc(100% - 24px)!important;
  max-width:1400px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;
}
.header-wrap{
  position:relative!important;
  border-radius:16px!important;
  padding:1px!important;
  background:linear-gradient(135deg,
    rgba(124,58,237,.40) 0%,
    rgba(236,72,153,.25) 25%,
    rgba(6,182,212,.15) 50%,
    rgba(236,72,153,.25) 75%,
    rgba(124,58,237,.40) 100%)!important;
  background-size:300% 300%!important;
  animation:smHeaderBorderMove 12s ease infinite!important;
  overflow:hidden!important;
  box-shadow:0 20px 60px rgba(0,0,0,.50),0 0 40px rgba(124,58,237,.10)!important;
}
.header-inner{
  position:relative!important;
  border-radius:inherit!important;
  background:linear-gradient(145deg,rgba(12,10,28,.98),rgba(7,12,36,1))!important;
  -webkit-backdrop-filter:blur(20px)!important;
  backdrop-filter:blur(20px)!important;
  padding:12px 24px!important;
  z-index:2!important;
  overflow:hidden!important;
}
.header-inner::before{
  content:''!important;
  position:absolute!important;
  top:0!important;
  left:0!important;
  right:0!important;
  height:2px!important;
  display:block!important;
  background:linear-gradient(90deg,transparent,var(--purple),var(--pink),var(--cyan),var(--purple),transparent)!important;
  background-size:200% auto!important;
  animation:smHeaderLineMove 8s linear infinite!important;
}
.header-grid{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  gap:20px!important;
  align-items:center!important;
  position:relative!important;
  z-index:2!important;
}

/* Logo kutusu: referanstaki 56px ikon + metin + slogan yapısı */
.header .logo{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:14px!important;
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  padding:14px 20px!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,rgba(124,58,237,.08),rgba(236,72,153,.04))!important;
  border:1px solid rgba(124,58,237,.15)!important;
  text-decoration:none!important;
  transition:border-color .25s ease,transform .25s ease!important;
  box-sizing:border-box!important;
}
.header .logo:hover{
  border-color:rgba(124,58,237,.35)!important;
  transform:translateY(-1px)!important;
}
.header .logo-img{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 56px!important;
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  min-height:56px!important;
  max-width:56px!important;
  max-height:56px!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:linear-gradient(145deg,#1a1635,#0f0d20)!important;
  border:1px solid rgba(139,92,246,.20)!important;
  animation:smHeaderLogoFloat 5s ease-in-out infinite!important;
  transform:none!important;
}
.header .logo-img img,
.header .logo-fallback{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:cover!important;
  border-radius:inherit!important;
}
.header .logo-fallback{
  align-items:center!important;
  justify-content:center!important;
  background:linear-gradient(135deg,#9b4dff,#ff3d8d)!important;
}
.header .logo-initials{
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  font-size:1.05rem!important;
  font-weight:800!important;
  letter-spacing:-.4px!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:none!important;
  line-height:1!important;
}
.header .logo-text{
  display:flex!important;
  flex-direction:column!important;
  gap:3px!important;
  min-width:0!important;
}
.header .logo-text h1{
  margin:0!important;
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  font-size:1.60rem!important;
  font-weight:700!important;
  letter-spacing:-1px!important;
  line-height:1!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.header .logo-text h1 .lp-white{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:none!important;
  font-weight:700!important;
}
.header .logo-text h1 .lp-color{
  background:linear-gradient(135deg,var(--pink-light),var(--purple-light))!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  color:var(--purple-light)!important;
  font-weight:700!important;
}
.header .logo-tag{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-top:4px!important;
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  font-size:.55rem!important;
  font-weight:700!important;
  letter-spacing:2px!important;
  line-height:1.2!important;
  color:var(--green)!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.header .logo-tag::before{
  content:''!important;
  width:6px!important;
  height:6px!important;
  flex:0 0 6px!important;
  border-radius:50%!important;
  background:var(--green)!important;
  box-shadow:0 0 6px var(--green)!important;
}

/* Kurucu/yazılımcı kartları */
.header .founders-wrap{
  display:block!important;
  min-width:0!important;
  min-height:0!important;
  padding:8px 10px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,rgba(124,58,237,.04),rgba(236,72,153,.025),rgba(6,182,212,.015))!important;
  border:1px solid rgba(124,58,237,.15)!important;
}
.header .founders{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:16px!important;
}
.header .fcard{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  min-width:0!important;
  padding:8px 14px!important;
  border-radius:100px!important;
  background:rgba(255,255,255,.02)!important;
  transition:all .25s ease!important;
}
.header .favatar-wrap,
.header .favatar{
  width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
}
.header .favatar img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.header .fname{
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  font-size:.80rem!important;
  font-weight:700!important;
  letter-spacing:.3px!important;
}
.header .fbadge{
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  font-size:.55rem!important;
  font-weight:700!important;
  letter-spacing:1.5px!important;
  padding:3px 10px!important;
}

/* Sosyal ikon kutusu */
.header .socials-wrap{
  display:block!important;
  min-height:0!important;
  padding:12px 24px!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,rgba(124,58,237,.03),rgba(6,182,212,.015))!important;
  border:1px solid rgba(124,58,237,.15)!important;
}
.header .socials{
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
}
.header .slink{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  font-size:.85rem!important;
}

@keyframes smHeaderBorderMove{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@keyframes smHeaderLineMove{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}
}
@keyframes smHeaderLogoFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-2px)}
}

@media(max-width:1080px){
  .header-grid{
    grid-template-columns:minmax(250px,auto) minmax(0,1fr)!important;
  }
  .header .socials-wrap{
    grid-column:1/-1!important;
    justify-self:center!important;
    padding:10px 18px!important;
  }
  .header .founders-wrap{
    order:initial!important;
    grid-column:auto!important;
  }
}

@media(max-width:768px){
  .header>.container-custom{
    width:calc(100% - 16px)!important;
  }
  .header-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .header-inner{
    padding:14px!important;
  }
  .header .logo{
    justify-content:center!important;
    padding:10px 12px!important;
  }
  .header .logo-img{
    flex-basis:50px!important;
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    min-height:50px!important;
    max-width:50px!important;
    max-height:50px!important;
  }
  .header .logo-text h1{
    font-size:1.30rem!important;
  }
  .header .founders-wrap{
    grid-column:auto!important;
  }
  .header .founders{
    flex-wrap:wrap!important;
    gap:8px!important;
  }
  .header .socials-wrap{
    display:none!important;
  }
}

@media(max-width:480px){
  .header .logo{
    padding:9px 10px!important;
    gap:10px!important;
  }
  .header .logo-text h1{
    font-size:1.12rem!important;
  }
  .header .logo-tag{
    font-size:.48rem!important;
    letter-spacing:1.4px!important;
  }
  .header .fcard{
    padding:6px 10px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .header-wrap,.header-inner::before,.header .logo-img{
    animation:none!important;
  }
}
