/* 2EA Kalıp logosu: 2eapool'un 2EA işareti (kırmızı 2 · beyaz EA) + kare hatlı KALIP. Efektler: 2 düşer, A yükselir,
   mavi LED takım ucu E'yi çizer (üst kol → uç kalkar → orta kol, sivri köşe, alt kol), KALIP harf harf yazılır. */
.logo{display:inline-flex;align-items:center;gap:.3em;font-size:34px;line-height:1;white-space:nowrap;filter:drop-shadow(0 .04em .02em #000c) drop-shadow(0 0 .28em #3fa9ff26)}
.lg-mark{display:block;height:.8em;width:auto;overflow:visible}
.lg-glyph{display:block;height:.715em;width:auto;overflow:visible}
/* header/footer: yalnız 2EA işareti; KALIP olmadığı için biraz daha büyük */
.brand .logo.is-mark .lg-mark{height:.92em}
.lg-kalip{display:inline-flex;align-items:center;gap:.27em;font-size:.49em;color:#eef2f6}
.lg-kalip>span{display:block}
.lg-kalip svg{display:block;height:1em;overflow:hidden}
.lg-draw{stroke-dasharray:1;stroke-dashoffset:0}
.lg-tool{fill:#eaf6ff;opacity:0;offset-rotate:0deg;filter:drop-shadow(0 0 2px #3fa9ff) drop-shadow(0 0 7px #3fa9ff)}
.lg-caret{display:none}
.logo-md{font-size:44px}
.logo-xl{font-size:clamp(58px,7.4vw,124px)}
.logo-lg{font-size:clamp(40px,4.3vw,70px)}

/* oynatma: site.js data-logo-play'e göre .play-full / .play-loop ekler, "KALIP" harflerini sırayla açar */
.logo.is-playing .lg-kalip>span{opacity:0}
.logo.is-playing .lg-kalip>span.on{opacity:1}
.logo.is-playing .lg-caret,.play-loop .lg-caret{display:block;width:.13em;height:1.1em;background:#3fa9ff;box-shadow:0 0 .3em #3fa9ff}
.logo.is-playing .lg-caret{animation:lg-caret .5s steps(1) infinite}
.logo.is-typed .lg-caret{animation:lg-caret .5s steps(1) 6;animation-fill-mode:forwards}
.play-full .lg-2{animation:lg-drop .8s cubic-bezier(.2,1.25,.4,1) .15s both}
.play-full .lg-a{animation:lg-rise .8s cubic-bezier(.2,1.25,.4,1) .6s both}
.play-full .lg-draw1{animation:lg-draw1 1.7s cubic-bezier(.45,0,.3,1) 1.1s both}
.play-full .lg-draw2{animation:lg-draw2 1.7s cubic-bezier(.45,0,.3,1) 1.1s both}
.play-full .lg-tool{animation:lg-tool 1.7s cubic-bezier(.45,0,.3,1) 1.1s forwards}
.play-fast .lg-2{animation:lg-drop .38s cubic-bezier(.2,1.25,.4,1) 0s both}
.play-fast .lg-a{animation:lg-rise .38s cubic-bezier(.2,1.25,.4,1) .12s both}
.play-fast .lg-draw1{animation:lg-draw1 .7s cubic-bezier(.45,0,.3,1) .3s both}
.play-fast .lg-draw2{animation:lg-draw2 .7s cubic-bezier(.45,0,.3,1) .3s both}
.play-fast .lg-tool{animation:lg-tool .7s cubic-bezier(.45,0,.3,1) .3s forwards}
/* dönüşümler SVG kullanıcı biriminde (işaret 80 birim yüksek): her boyutta aynı oranda düşer/yükselir */
@keyframes lg-drop{from{transform:translateY(-64px);opacity:0}to{transform:none;opacity:1}}
@keyframes lg-rise{from{transform:translateY(64px);opacity:0}to{transform:none;opacity:1}}
/* E iki parçada çizilir: üst kol yolun %32,9'u; takım ucu arada kalkıp orta kola geçer */
@keyframes lg-draw1{0%{stroke-dashoffset:1}32.9%,100%{stroke-dashoffset:0}}
@keyframes lg-draw2{0%,32.9%{stroke-dashoffset:1}94%,100%{stroke-dashoffset:0}}
@keyframes lg-tool{0%{offset-distance:0%;opacity:1}32.9%{offset-distance:32.9%;opacity:1}94%{offset-distance:100%;opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes lg-caret{0%{opacity:1}50%{opacity:0}}
/* header: sürekli, yavaş döngü (Yusuf, 30 Eylül). 10 sn: 2 düşer → A yükselir → LED uç E'yi çizer → KALIP yazılır → bekler → söner → baştan */
.play-loop .lg-2{animation:lgl-2 10s cubic-bezier(.2,1,.3,1) infinite}
.play-loop .lg-a{animation:lgl-a 10s cubic-bezier(.2,1,.3,1) infinite}
.play-loop .lg-e{animation:lgl-e 10s linear infinite}
.play-loop .lg-draw1{animation:lgl-draw1 10s cubic-bezier(.45,0,.3,1) infinite}
.play-loop .lg-draw2{animation:lgl-draw2 10s cubic-bezier(.45,0,.3,1) infinite}
.play-loop .lg-tool{animation:lgl-tool 10s cubic-bezier(.45,0,.3,1) infinite}
.play-loop .lg-kalip>span{animation:lgl-type 10s steps(1) infinite}
.play-loop .lg-kalip>span:nth-child(2){animation-delay:.14s}.play-loop .lg-kalip>span:nth-child(3){animation-delay:.28s}.play-loop .lg-kalip>span:nth-child(4){animation-delay:.42s}.play-loop .lg-kalip>span:nth-child(5){animation-delay:.56s}
.play-loop .lg-caret{animation:lgl-caret 10s linear infinite}
@keyframes lgl-2{0%{transform:translateY(-64px);opacity:0}9%,86%{transform:none;opacity:1}94%,100%{transform:none;opacity:0}}
@keyframes lgl-a{0%,5%{transform:translateY(64px);opacity:0}14%,86%{transform:none;opacity:1}94%,100%{transform:none;opacity:0}}
@keyframes lgl-e{0%,86%{opacity:1}94%,99.9%{opacity:0}100%{opacity:1}}
@keyframes lgl-draw1{0%,14%{stroke-dashoffset:1}21.2%,100%{stroke-dashoffset:0}}
@keyframes lgl-draw2{0%,21.2%{stroke-dashoffset:1}36%,100%{stroke-dashoffset:0}}
@keyframes lgl-tool{0%,13.9%{offset-distance:0%;opacity:0}14%{offset-distance:0%;opacity:1}21.2%{offset-distance:32.9%;opacity:1}36%{offset-distance:100%;opacity:1}38%,100%{offset-distance:100%;opacity:0}}
@keyframes lgl-type{0%,37%{opacity:0}38%,86%{opacity:1}94%,100%{opacity:0}}
@keyframes lgl-caret{0%,36%{opacity:0}37%,40%,47%,54%,61%{opacity:1}43.5%,50.5%,57.5%{opacity:0}66%,100%{opacity:0}}
@media (max-width:900px){.logo{font-size:28px}.logo-xl{font-size:clamp(38px,12.2vw,72px)}.logo-lg{font-size:clamp(32px,9.4vw,48px)}}
@media (prefers-reduced-motion:reduce){.logo *{animation:none!important}.logo.is-playing .lg-kalip>span{opacity:1}.lg-caret,.lg-tool{display:none!important}}