/* ModernTW acilis sayfasi — Metin2 klasik gorunum (AnkSOFT, 2026).
   Harici CDN yok: yazi tipleri ve ozgun SVG sahne ModernTW tema klasorunden (ayni paket).
   Isaretleme (index.php) degismedi; sahne govde arka planinda, sis/kivilcim bos katmanlarin
   sozde ogelerinde cizilir. Admin videosu ayarliysa sahnenin ustunde oynar. */
@import url("../../../../WM_tema/ModernTW/assets/fonts/fonts.css");

:root{
  --wm-bg:#09070c; --wm-metin:#ecdfc6; --wm-soluk:#b3a283;
  --wm-altin:#ddb055; --wm-altin-acik:#f6dc8f;
}

*{box-sizing:border-box;}
html,body{height:100%;}
body.wm-govde{
  margin:0; color:var(--wm-metin); overflow-x:hidden;
  font-family:'Alegreya Sans','Segoe UI',system-ui,sans-serif; -webkit-font-smoothing:antialiased;
  background-color:#07050a;
  background-image:
    url("../../../../WM_tema/ModernTW/assets/img/m2/sahne.svg"),
    radial-gradient(circle at 80% 17%, rgba(255,246,225,.95) 0, rgba(242,221,178,.9) 3.2vmin, rgba(255,210,150,.16) 3.6vmin, rgba(255,190,140,.06) 14vmin, transparent 26vmin),
    radial-gradient(1px 1px at 12% 18%, rgba(255,255,255,.8), transparent 60%),
    radial-gradient(1px 1px at 27% 9%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 41% 22%, rgba(255,240,220,.7), transparent 60%),
    radial-gradient(1px 1px at 58% 12%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1px 1px at 66% 30%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(1px 1px at 91% 36%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(1px 1px at 6% 34%, rgba(255,255,255,.45), transparent 60%),
    radial-gradient(70% 45% at 50% 82%, rgba(150,62,48,.5), transparent 72%),
    linear-gradient(180deg,#06050b 0%,#170e2a 38%,#351733 72%,#1d0d16 100%);
  background-repeat:no-repeat;
  background-position:center bottom, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
  background-size:max(100%, 1100px) auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto;
  background-attachment:fixed;
}

/* ---- Arka plan videosu (admin ayarli; sahnenin ustunde, yari saydam) ---- */
.wm-video{position:fixed;inset:0;overflow:hidden;background:transparent;z-index:0;}
.wm-video iframe{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.5);
  width:100vw;height:56.25vw;min-height:100%;min-width:177.78vh;
  pointer-events:none;border:0;opacity:.6;
}
/* Tiklama kalkani + iki sis bandi */
.wm-kalkan{position:fixed;inset:0;z-index:1;overflow:hidden;}
.wm-kalkan::before,.wm-kalkan::after{
  content:"";position:absolute;left:0;right:0;pointer-events:none;
  background:url("../../../../WM_tema/ModernTW/assets/img/m2/sis.svg") repeat-x 0 0/1200px 100%;
}
.wm-kalkan::before{bottom:8%;height:40%;opacity:.85;animation:wmSis1 80s linear infinite;}
.wm-kalkan::after{bottom:-6%;height:34%;opacity:.55;background-size:1600px 100%;animation:wmSis2 120s linear infinite;filter:brightness(.75);}
@keyframes wmSis1{to{background-position:1200px 0}}
@keyframes wmSis2{to{background-position:-1600px 0}}
/* Okunabilirlik karartmasi + yukselen kivilcimlar */
.wm-karart{position:fixed;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(ellipse 70% 65% at 50% 46%,rgba(5,3,8,.35),rgba(5,3,8,.15) 55%,rgba(4,3,6,.7) 100%);}
.wm-karart::after{
  content:"";position:absolute;left:0;bottom:-10px;width:3px;height:3px;border-radius:50%;background:#ffc46b;opacity:0;
  box-shadow:8vw 0 0 0 #ffb45a,17vw -4vh 0 -.5px #ff9a3c,26vw 2vh 0 0 #ffd27a,37vw -6vh 0 -.5px #ffb45a,48vw 1vh 0 0 #ffcf7a,
    57vw -3vh 0 -.5px #ff9a3c,66vw 3vh 0 0 #ffbf66,75vw -5vh 0 -.5px #ffd27a,83vw 0 0 0 #ff9a3c,92vw -2vh 0 -.5px #ffb45a,12vw -8vh 0 -.5px #ffcf7a;
  filter:drop-shadow(0 0 3px #ff8a2a);animation:wmKivilcim 10s linear infinite;
}
@keyframes wmKivilcim{0%{opacity:0;transform:translate(0,0)}10%{opacity:.95}70%{opacity:.5}100%{opacity:0;transform:translate(3vw,-75vh)}}
/* Ilk saniyedeki YouTube yukleme flasini gizleyen kapak */
.wm-perde{position:fixed;inset:0;z-index:3;background:#07050a;pointer-events:none;animation:wmPerde 1.4s ease-out forwards;}
@keyframes wmPerde{0%,40%{opacity:1}100%{opacity:0}}

/* ---- Sahne ---- */
.wm-sahne{
  position:relative;z-index:4;min-height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 16px 22px;gap:26px;
}

/* ---- Islemeli plaka ---- */
.wm-kart{
  position:relative;width:100%;max-width:720px;text-align:center;
  padding:46px 40px 36px;
  border:1px solid #3a2718;border-radius:4px;
  background:
    url("../../../../WM_tema/ModernTW/assets/img/m2/doku.svg"),
    radial-gradient(120% 70% at 50% 0%,rgba(110,22,30,.35),transparent 62%),
    linear-gradient(180deg,rgba(27,19,29,.88) 0%,rgba(14,9,15,.92) 100%);
  box-shadow:0 0 0 1px #040205,0 30px 70px -20px rgba(0,0,0,.9),inset 0 0 40px rgba(0,0,0,.55);
  animation:wmGir .7s cubic-bezier(.2,.8,.2,1) both;
}
.wm-kart::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  border:26px solid transparent;
  border-image:url("../../../../WM_tema/ModernTW/assets/img/m2/cerceve.svg") 32 / 26px stretch;
}
.wm-kart::before{
  content:"";position:absolute;left:50%;top:-14px;width:150px;height:28px;transform:translateX(-50%);
  background:url("../../../../WM_tema/ModernTW/assets/img/m2/ayrac.svg") no-repeat center/contain;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.9));
}
@keyframes wmGir{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Eski isaretlemedeki <img class="wm-logo" src="images/logo.png"> kok dizinde bulunmayan bir yolu gosterir
   (kirik resim kutusu cikar); sunucu adi zaten susleme yazisiyla basildigi icin gizlenir. */
.wm-logo{display:none;}

.wm-ustyazi{
  display:inline-flex;align-items:center;gap:14px;margin:0 0 12px;
  color:var(--wm-altin-acik);font-family:'Cinzel',Georgia,serif;font-size:12.5px;font-weight:700;
  letter-spacing:.45em;text-transform:uppercase;text-shadow:0 0 18px rgba(221,176,85,.35);
}
.wm-ustyazi::before,.wm-ustyazi::after{content:"";width:46px;height:1px;background:linear-gradient(90deg,transparent,var(--wm-altin));}
.wm-ustyazi::after{transform:scaleX(-1);}
.wm-baslik{
  margin:0;padding:0 .06em;
  font-family:'Cinzel Decorative','Cinzel',Georgia,serif;font-weight:700;
  font-size:clamp(40px,8vw,84px);line-height:1.05;letter-spacing:.02em;overflow-wrap:anywhere;
  background:linear-gradient(180deg,#fff8dc 0%,#f6dc8f 26%,#dcaa4a 50%,#8e5b1e 66%,#d9ad58 84%,#fbe7ad 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 0 #3a1f08) drop-shadow(0 0 1px #1d0f04) drop-shadow(0 10px 20px rgba(0,0,0,.85));
}
.wm-ayrac{
  display:block;height:26px;width:min(380px,80%);margin:14px auto 14px;
  background:url("../../../../WM_tema/ModernTW/assets/img/m2/ayrac.svg") no-repeat center/contain;
}
.wm-alt{margin:0 auto 26px;max-width:46ch;color:var(--wm-soluk);font-size:16.5px;line-height:1.6;}

/* ---- Iri metal dugmeler ---- */
.wm-butonlar{display:flex;flex-direction:column;align-items:center;gap:14px;filter:drop-shadow(0 10px 16px rgba(0,0,0,.75));}
@media (min-width:600px){ .wm-butonlar{flex-direction:row;flex-wrap:wrap;justify-content:center;} }
.wm-btn{
  position:relative;isolation:isolate;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:58px;padding:0 30px;min-width:190px;text-decoration:none;
  font-family:'Cinzel',Georgia,serif;font-weight:800;font-size:15px;letter-spacing:.12em;text-transform:uppercase;
  color:#fbe6ae;text-shadow:0 1px 0 #2a0406;
  background:linear-gradient(180deg,#e3b65a,#6e4515);
  clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 50%,calc(100% - 18px) 100%,18px 100%,0 50%);
  transition:transform .16s ease,filter .16s ease;
}
.wm-btn::before{
  content:"";position:absolute;inset:3px;z-index:-1;
  clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,16px 100%,0 50%);
  background:linear-gradient(180deg,#c8463a 0%,#9a2124 42%,#6a0f17 54%,#7f1720 82%,#a83430 100%);
}
.wm-btn svg{width:19px;height:19px;flex:0 0 19px;}
.wm-btn:hover{transform:translateY(-2px);filter:brightness(1.12);}
.wm-btn:focus-visible{outline:none;filter:brightness(1.15) drop-shadow(0 0 6px var(--wm-altin));}
.wm-btn-ana{color:#2a1505;text-shadow:0 1px 0 rgba(255,236,180,.6);background:linear-gradient(180deg,#b98a3f,#4a2c0c);}
.wm-btn-ana::before{background:linear-gradient(180deg,#fff1bf 0%,#f2cf78 20%,#d6a043 48%,#a46b24 52%,#c78f33 80%,#f3d47f 100%);}
@media (max-width:599px){ .wm-btn{width:100%;max-width:330px;} }

.wm-sosyal{margin-top:22px;padding-top:16px;border-top:1px solid rgba(221,176,85,.18);}
.wm-sosyal a{color:#d2bf98;text-decoration:none;font-family:'Cinzel',Georgia,serif;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;}
.wm-sosyal a:hover{color:var(--wm-altin-acik);}

.wm-dip{color:rgba(190,175,145,.8);font-size:13px;text-align:center;text-shadow:0 1px 4px #000;}
.wm-dip a{color:inherit;text-decoration:none;}.wm-dip a:hover{text-decoration:underline;}

@media (max-width:640px){
  body.wm-govde{background-size:auto 52vh,auto,auto,auto,auto,auto,auto,auto,auto,auto,auto;background-position:84% bottom,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0;}
  .wm-sahne{justify-content:flex-start;padding-top:56px;}
}
@media (max-width:420px){
  .wm-kart{padding:40px 20px 28px;}
  .wm-ustyazi{letter-spacing:.3em;font-size:11px;gap:9px;}
  .wm-ustyazi::before,.wm-ustyazi::after{width:24px;}
}
@media (prefers-reduced-motion:reduce){
  .wm-perde{animation:none;opacity:0}.wm-kart{animation:none}
  .wm-kalkan::before,.wm-kalkan::after{animation:none}.wm-karart::after{display:none}
}