/* Seslidadas Header Reference V10
   Kullanıcının paylaştığı SesliYoutube üst alan referansına uyarlanmıştır.
   Sadece üst logo / kurucu / sosyal medya alanını etkiler. */

:root{
  --sr-bg:#061021;
  --sr-panel:#08152c;
  --sr-panel-deep:#050b1d;
  --sr-line:rgba(93,151,255,.30);
  --sr-text:#f5f8ff;
  --sr-muted:#93a7c7;
  --sr-blue:var(--cyan,#18aaff);
  --sr-cyan:#19e1ff;
  --sr-purple:var(--purple,#914cff);
  --sr-pink:var(--pink,#ff3d9a);
  --sr-green:#2ce278;
}

.header{
  padding:10px 0 12px!important;
  position:relative!important;
  z-index:40!important;
}
.header>.container-custom{
  width:calc(100% - 24px)!important;
  max-width:1340px!important;
  margin:0 auto!important;
  padding:0!important;
}
.header-wrap{
  position:relative!important;
  overflow:hidden!important;
  padding:0!important;
  border-radius:30px!important;
  border:1px solid var(--sr-line)!important;
  background:
    radial-gradient(circle at 12% 0%,rgba(145,76,255,.20),transparent 34%),
    radial-gradient(circle at 86% 18%,rgba(25,225,255,.08),transparent 30%),
    linear-gradient(180deg,rgba(12,29,59,.96),rgba(6,16,33,.98))!important;
  box-shadow:0 28px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08)!important;
  animation:none!important;
}
.header-wrap::before{
  content:''!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  height:2px!important;
  background:linear-gradient(90deg,var(--sr-blue),var(--sr-purple),var(--sr-pink),var(--sr-cyan),var(--sr-blue))!important;
  background-size:220% 100%!important;
  animation:srHeaderLine 9s linear infinite!important;
  z-index:3!important;
  pointer-events:none!important;
}
.header-wrap::after{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1.8px)!important;
  background-size:22px 22px!important;
  opacity:.16!important;
  pointer-events:none!important;
  z-index:0!important;
}
.header-inner{
  position:relative!important;
  z-index:2!important;
  overflow:visible!important;
  padding:16px 22px!important;
  border-radius:inherit!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.header-inner::before,
.header-inner::after{display:none!important}
.header-grid{
  display:grid!important;
  grid-template-columns:minmax(410px,1.25fr) minmax(390px,1fr) minmax(290px,.78fr)!important;
  align-items:stretch!important;
  gap:24px!important;
  position:relative!important;
  z-index:2!important;
}

/* Sol marka alanı: kare ikon + yazı tipiyle SESLİ DADAŞ */
.header .logo.sm-reference-logo{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-width:0!important;
  min-height:98px!important;
  padding:12px 18px!important;
  overflow:hidden!important;
  border-radius:24px!important;
  border:1px solid rgba(93,151,255,.30)!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(145,76,255,.18),transparent 38%),
    linear-gradient(180deg,rgba(12,29,59,.94),rgba(6,16,33,.96))!important;
  box-shadow:0 22px 62px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.07)!important;
  text-decoration:none!important;
  transform:none!important;
}
.header .logo.sm-reference-logo::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.035) 48%,transparent 72%)!important;
  transform:translateX(-120%)!important;
  transition:transform .65s ease!important;
  pointer-events:none!important;
}
.header .logo.sm-reference-logo:hover::before{transform:translateX(120%)!important}
.header .logo.sm-reference-logo:hover{
  border-color:rgba(25,225,255,.48)!important;
  box-shadow:0 0 28px rgba(25,225,255,.12),0 22px 62px rgba(0,0,0,.30)!important;
}
.header .sm-reference-brand-icon{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 76px!important;
  width:76px!important;
  height:76px!important;
  min-width:76px!important;
  min-height:76px!important;
  max-width:76px!important;
  max-height:76px!important;
  padding:4px!important;
  overflow:visible!important;
  border-radius:23px!important;
  background:conic-gradient(from 0deg,var(--sr-cyan),#fff,var(--sr-purple),var(--sr-pink),var(--sr-cyan))!important;
  border:0!important;
  box-shadow:0 0 24px rgba(25,225,255,.30)!important;
  animation:srIconFloat 4.8s ease-in-out infinite!important;
}
.header .sm-reference-brand-icon::before{
  content:''!important;
  position:absolute!important;
  inset:4px!important;
  border-radius:19px!important;
  background:#071024!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important;
  z-index:0!important;
}
.header .sm-reference-brand-icon img,
.header .sm-reference-icon-fallback{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:66px!important;
  height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
  border-radius:18px!important;
  object-fit:cover!important;
  background:linear-gradient(145deg,#182c59,#111b39)!important;
}
.header .sm-reference-icon-fallback{
  color:#fff!important;
  font-size:30px!important;
  text-shadow:0 0 20px rgba(25,225,255,.75)!important;
}
.header .logo-text{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  min-width:0!important;
}
.header .logo-text h1{
  display:flex!important;
  align-items:baseline!important;
  gap:9px!important;
  margin:0!important;
  font-family:'Syne',Arial,'Helvetica Neue',sans-serif!important;
  font-size:clamp(28px,2.35vw,36px)!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:-1.4px!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;
  text-shadow:0 5px 18px rgba(0,0,0,.30)!important;
}
.header .logo-text h1 .lp-color{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(90deg,var(--sr-cyan),var(--sr-blue),var(--sr-purple),var(--sr-pink))!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  text-shadow:none!important;
}
.header .logo-tag{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:9px!important;
  padding:6px 13px!important;
  border-radius:999px!important;
  border:1px solid rgba(93,151,255,.28)!important;
  background:rgba(255,255,255,.06)!important;
  color:#eaf2ff!important;
  font-family:'Syne',Arial,sans-serif!important;
  font-size:8px!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:1.8px!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.header .logo-tag::before{
  content:''!important;
  width:8px!important;
  height:8px!important;
  flex:0 0 8px!important;
  border-radius:50%!important;
  background:var(--sr-green)!important;
  box-shadow:0 0 14px var(--sr-green)!important;
}

/* Orta kurucu alanı */
.header .founders-wrap{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  min-height:98px!important;
  padding:13px!important;
  overflow:visible!important;
  border-radius:24px!important;
  border:1px solid rgba(93,151,255,.30)!important;
  background:
    radial-gradient(circle at 12% 0%,rgba(145,76,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(12,29,59,.94),rgba(6,16,33,.96))!important;
  box-shadow:0 22px 62px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.header .founders{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:12px!important;
  width:100%!important;
  min-width:0!important;
}
.header .fcard,
.header .fcard.mirror{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  flex:1 1 0!important;
  min-width:0!important;
  max-width:none!important;
  padding:11px 13px!important;
  overflow:visible!important;
  border-radius:20px!important;
  border:1px solid rgba(93,151,255,.22)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035))!important;
  box-shadow:0 14px 30px rgba(0,0,0,.18)!important;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease!important;
}
.header .fcard.mirror{flex-direction:row-reverse!important}
.header .fcard:hover{
  transform:translateY(-5px)!important;
  border-color:rgba(25,225,255,.50)!important;
  box-shadow:0 0 28px rgba(25,225,255,.16),0 18px 38px rgba(0,0,0,.28)!important;
}
.header .fcrown{
  position:absolute!important;
  top:-14px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:28px!important;
  height:28px!important;
  border-radius:50%!important;
  background:#071024!important;
  border:1px solid rgba(25,225,255,.30)!important;
  box-shadow:0 0 15px rgba(25,225,255,.22)!important;
  font-size:14px!important;
  line-height:1!important;
  z-index:5!important;
}
.header .favatar-wrap{
  position:relative!important;
  flex:0 0 52px!important;
  width:52px!important;
  height:52px!important;
  border-radius:50%!important;
}
.header .favatar-wrap::before{
  content:''!important;
  position:absolute!important;
  inset:-2px!important;
  border-radius:50%!important;
  animation:srAvatarRing 7s linear infinite!important;
  z-index:0!important;
}
.header .fcard.erkek .favatar-wrap::before{
  background:conic-gradient(from 0deg,var(--sr-blue),#fff,var(--sr-cyan),var(--sr-blue))!important;
}
.header .fcard.bayan .favatar-wrap::before{
  background:conic-gradient(from 0deg,var(--sr-pink),#fff,var(--sr-purple),var(--sr-pink))!important;
}
.header .favatar{
  position:relative!important;
  z-index:1!important;
  width:52px!important;
  height:52px!important;
  overflow:hidden!important;
  border-radius:50%!important;
  background:#111a2f!important;
  border:3px solid #071024!important;
  box-shadow:0 0 20px rgba(24,170,255,.18)!important;
}
.header .favatar img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:50%!important;
}
.header .fgender-dot{
  position:absolute!important;
  right:0!important;
  bottom:1px!important;
  z-index:4!important;
  width:11px!important;
  height:11px!important;
  border-radius:50%!important;
  border:2px solid #071024!important;
}
.header .fcard.erkek .fgender-dot{background:var(--sr-blue)!important;box-shadow:0 0 10px var(--sr-blue)!important}
.header .fcard.bayan .fgender-dot{background:var(--sr-pink)!important;box-shadow:0 0 10px var(--sr-pink)!important}
.header .finfo,
.header .fcard.mirror .finfo{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  min-width:0!important;
  gap:5px!important;
  text-align:left!important;
}
.header .fcard.mirror .finfo{align-items:flex-end!important;text-align:right!important}
.header .fname{
  max-width:110px!important;
  overflow:hidden!important;
  color:#fff!important;
  font-family:'Syne',Arial,sans-serif!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.header .fbadge{
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  padding:3px 9px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.065)!important;
  border:1px solid rgba(93,151,255,.22)!important;
  color:#eaf2ff!important;
  font-family:'Syne',Arial,sans-serif!important;
  font-size:8px!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:1.1px!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.header .fcard.bayan .fbadge{color:#ff9ad1!important;border-color:rgba(255,61,154,.32)!important}
.header .fcard.erkek .fbadge{color:#8bdcff!important;border-color:rgba(25,225,255,.32)!important}

/* Sağ sosyal medya alanı */
.header .socials-wrap{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:98px!important;
  padding:13px!important;
  overflow:hidden!important;
  border-radius:24px!important;
  border:1px solid rgba(93,151,255,.30)!important;
  background:
    radial-gradient(circle at 85% 0%,rgba(255,61,154,.13),transparent 38%),
    linear-gradient(180deg,rgba(12,29,59,.94),rgba(6,16,33,.96))!important;
  box-shadow:0 22px 62px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.header .socials{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
}
.header .slink{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 43px!important;
  width:43px!important;
  height:43px!important;
  border-radius:15px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  color:#fff!important;
  font-size:16px!important;
  text-decoration:none!important;
  box-shadow:0 10px 22px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.13)!important;
  transition:transform .25s ease,filter .25s ease,box-shadow .25s ease!important;
}
.header .slink.fb{background:#1877f2!important}
.header .slink.ig{background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045)!important}
.header .slink.tt{background:linear-gradient(135deg,#050505,#222)!important}
.header .slink.tw{background:#111827!important}
.header .slink.yt{background:#ff0000!important}
.header .slink.wp{background:#25d366!important;color:#061021!important}
.header .slink:hover{
  transform:translateY(-5px) scale(1.06)!important;
  filter:saturate(1.12) brightness(1.08)!important;
  box-shadow:0 0 22px rgba(25,225,255,.22),0 12px 26px rgba(0,0,0,.25)!important;
}

@keyframes srHeaderLine{from{background-position:0 0}to{background-position:220% 0}}
@keyframes srIconFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes srAvatarRing{to{transform:rotate(360deg)}}

@media(max-width:1180px){
  .header-grid{
    grid-template-columns:minmax(390px,1.12fr) minmax(360px,1fr)!important;
  }
  .header .socials-wrap{
    grid-column:1/-1!important;
    min-height:76px!important;
  }
}
@media(max-width:860px){
  .header-grid{grid-template-columns:1fr!important;gap:12px!important}
  .header .logo.sm-reference-logo{justify-content:center!important}
  .header .founders-wrap,.header .socials-wrap{grid-column:auto!important}
}
@media(max-width:768px){
  .header>.container-custom{width:calc(100% - 16px)!important}
  .header-wrap{border-radius:22px!important}
  .header-inner{padding:12px!important}
  .header .logo.sm-reference-logo{min-height:82px!important;padding:10px 12px!important;border-radius:20px!important}
  .header .sm-reference-brand-icon{flex-basis:60px!important;width:60px!important;height:60px!important;min-width:60px!important;min-height:60px!important;max-width:60px!important;max-height:60px!important;border-radius:19px!important}
  .header .sm-reference-brand-icon img,.header .sm-reference-icon-fallback{width:51px!important;height:51px!important;max-width:51px!important;max-height:51px!important;border-radius:15px!important}
  .header .logo-text h1{font-size:clamp(21px,6vw,28px)!important}
  .header .logo-tag{font-size:7px!important;padding:5px 10px!important}
  .header .founders-wrap{min-height:0!important;padding:13px 10px!important}
  .header .founders{flex-wrap:wrap!important}
  .header .fcard,.header .fcard.mirror{flex:1 1 170px!important;max-width:260px!important}
  .header .socials-wrap{display:none!important}
}
@media(max-width:480px){
  .header .logo.sm-reference-logo{gap:10px!important;justify-content:flex-start!important}
  .header .sm-reference-brand-icon{flex-basis:54px!important;width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;max-width:54px!important;max-height:54px!important}
  .header .sm-reference-brand-icon img,.header .sm-reference-icon-fallback{width:45px!important;height:45px!important;max-width:45px!important;max-height:45px!important}
  .header .logo-text h1{gap:5px!important;font-size:20px!important;letter-spacing:-.8px!important}
  .header .logo-tag{font-size:6.4px!important;letter-spacing:1.2px!important;margin-top:7px!important}
  .header .fcard,.header .fcard.mirror{padding:10px!important}
  .header .fname{max-width:95px!important;font-size:11px!important}
}
@media(prefers-reduced-motion:reduce){
  .header-wrap::before,.header .sm-reference-brand-icon,.header .favatar-wrap::before{animation:none!important}
}