﻿/* ==========================================================================
   ankadorm — giriş ekranı (Views/Login/Index.cshtml)
   Kaynak tasarım: docs/ankadorm-giris-tasarim.html (2026-08-07 mockup)

   NEDEN AYRI DOSYA: Razor, .cshtml içindeki <style> bloğunda da '@' işaretini
   kod geçişi sayar; @media / @keyframes / @supports derleme hatası verirdi.

   NEDEN 'ad-' ÖNEKİ: sayfa MainLogin layout'unu kullanıyor, Bootstrap + tema
   styles.min.css yüklü. Önek olmasaydı btn / card / alert / social / main
   sınıfları tema kurallarıyla çakışırdı. Tüm sınıflar ve özel değişkenler önekli.
   ========================================================================== */

:root{
  --ad-bg:            #060911;
  --ad-bg-2:          #0B1220;
  /* KURUMSAL PALET — kaynak: ankadorm.com.tr, 2026-08-10'da getComputedStyle
     ile ölçüldü (tahmin değil). Eski birincil renk #1753FC MAVİ idi ve o mavi
     tanıtım sitesinin paletinde HİÇ YOK; giriş ekranıyla site arasındaki tek
     görünür kopukluk buydu. Fotoğraf ikisinde de aynı.

     MİNT ZEMİN ÜZERİNDE YAZI KOYU OLMALI. Tanıtım sitesi mint/zeytin zemine
     beyaz yazıyor ama ölçülen kontrast 1.91:1 ve 1.99:1 — WCAG AA eşiği 4.5:1.
     Sitenin kendi erişilebilirlik hatası, kopyalanmadı: koyu mürekkeple 9.84:1.
     Yeni renk eskisinden DAHA erişilebilir: kart zemininde mint 9.16:1,
     eski mavi 5.14:1 idi. */
  --ad-brand:         #8DC9A4;             /* mint — birincil eylem (site: KATALOG butonu) */
  --ad-brand-2:       #A9DCC0;             /* açık mint — bağlantı, ikon, odak halkası */
  --ad-brand-soft:    rgba(141,201,164,.32);
  --ad-brand-ink:     #08131C;             /* mint zeminin ÜSTÜNDEKİ yazı rengi */
  --ad-accent:        #C3BC2E;             /* zeytin — sitede büyük dolu paneller */
  --ad-accent-2:      #F9A609;             /* turuncu — tek noktalık dikkat çekici */

  --ad-glass:         rgba(10,17,30,.46);
  --ad-glass-2:       rgba(255,255,255,.13);
  --ad-stroke:        rgba(255,255,255,.17);
  --ad-stroke-strong: rgba(255,255,255,.30);

  --ad-txt:           #F3F6FC;
  --ad-muted:         #A9B4C7;
  --ad-muted-2:       #7C8798;

  --ad-danger:        #FF6B6B;
  --ad-ok:            #34D399;

  --ad-r-lg: 22px;
  --ad-r-md: 14px;
  --ad-r-sm: 10px;

  --ad-shadow: 0 32px 80px -24px rgba(0,0,0,.85), 0 2px 8px rgba(0,0,0,.35);
  --ad-font: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }

html,body{ height:100%; }
body{
  margin:0;
  font-family:var(--ad-font);
  color:var(--ad-txt);
  background:var(--ad-bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* MainLogin layout'u <body class="bg-white"> veriyor ve o kural !important.
   Ayni onemde ozgulluk kazanir; 'body' tek basina yetmez, 'body.bg-white' gerek. */
body, body.bg-white{ background:var(--ad-bg) !important; }

/* ---------- Arka plan katmanları ---------------------------------------- */
.ad-bg{ position:fixed; inset:0; z-index:-3; overflow:hidden; }
.ad-bg__img{
  position:absolute; inset:-4%;
  background-image:url("/assets/images/svgs/logo/slider.jpg");
  background-size:cover; background-position:center 42%;
  filter:saturate(1.02) contrast(1.02) brightness(1);
  transform:scale(1.06);
  animation:drift 46s ease-in-out infinite alternate;
}
@keyframes drift{
  from{ transform:scale(1.06) translate3d(0,0,0); }
  to  { transform:scale(1.14) translate3d(-1.6%,-1.2%,0); }
}
/* Okunabilirlik perdesi: metnin durduğu sol/alt taraf daha koyu.
   2026-08-10'da DARALTILDI. Gerekçe: tanıtım sitesi (ankadorm.com.tr) aynı bina
   görselini hiç karartmadan kullanıyor — gökyüzü ve güneş ışınları görünüyor.
   Perde binayı yutuyordu. Karartma sadece metnin gerçekten durduğu ilk ~%22'ye
   çekildi, orta bant neredeyse açıldı (.12 → .06).
   Kart ETKİLENMEZ: kendi zemini var (rgba(9,15,27,.58)), okunurluğu perdeye
   bağlı değil — 2026-08-07'deki "beyaz cam okunmaz oldu" hatası bu yüzden
   tekrarlamıyor. Hero metni gölgeyle taşınıyor (aşağıda güçlendirildi). */
.ad-bg__scrim{
  position:fixed; inset:0; z-index:-2;
  background:
    linear-gradient(100deg, rgba(6,11,22,.66) 0%, rgba(6,11,22,.38) 22%, rgba(6,11,22,.10) 44%, rgba(6,11,22,.14) 100%),
    linear-gradient(180deg, rgba(5,9,18,.38) 0%, transparent 15%, transparent 76%, rgba(5,9,18,.56) 100%);
}
/* Video katmanı — poster (bg__img) üstünde, hazır olunca yumuşak geçişle açılır */
.ad-bg__video{
  position:absolute; inset:0; opacity:0; pointer-events:none;
  transition:opacity 1.1s ease;
  filter:saturate(1.02) contrast(1.02) brightness(.92);
}
.ad-bg__video.ad-is-on{ opacity:1; }
.ad-bg__video iframe,
.ad-bg__video video{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:100vw; height:56.25vw;            /* 16:9 → genişliğe göre */
  min-height:100vh; min-width:177.78vh;   /* 16:9 → yüksekliğe göre */
  border:0; object-fit:cover; pointer-events:none;
}
/* Video oynarken hareket + parlaklık okunurluğu düşürür.
   Üç önlem: fazladan perde, metne gölge, kartın arkasını daha çok bulanıklaştır. */
body.ad-video-acik .ad-bg__veil{
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    linear-gradient(100deg, rgba(4,7,14,.26) 0%, rgba(4,7,14,.10) 50%, rgba(4,7,14,.16) 100%);
}
body.ad-video-acik .ad-hero h1,
body.ad-video-acik .ad-hero p,
body.ad-video-acik .ad-hero__list li{ text-shadow:0 2px 22px rgba(0,0,0,.6); }
body.ad-video-acik .ad-card{
  background:rgba(9,15,27,.70);
  -webkit-backdrop-filter:blur(34px) saturate(135%);
  backdrop-filter:blur(34px) saturate(135%);
}
/* İnce grenli doku — düz gradyanın "plastik" görünmesini engeller */
.ad-bg__grain{
  position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.35;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='140' height='140' filter='url(%23n)' opacity='.45'/></svg>");
  mix-blend-mode:overlay;
}

/* ---------- Sayfa iskeleti ---------------------------------------------- */
.ad-page{
  position:relative;
  min-height:100dvh;
  display:grid;
  grid-template-rows:auto 1fr auto;
  padding:clamp(18px,2.4vw,34px) clamp(18px,4vw,56px);
  gap:clamp(18px,3vh,40px);
}

/* ---------- Üst bar ------------------------------------------------------ */
.ad-top{ display:flex; align-items:center; justify-content:space-between; gap:14px 18px; flex-wrap:wrap; }
.ad-top__logo{ display:flex; align-items:center; gap:14px; text-decoration:none; }
.ad-top__logo img{ height:30px; width:auto; display:block; }
.ad-top__logo span{
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ad-muted-2); padding-left:14px; border-left:1px solid var(--ad-stroke);
  font-weight:600; white-space:nowrap;
}
.ad-top__nav{ display:flex; align-items:center; gap:10px; }

/* ---------- Ortak: cam yüzey -------------------------------------------- */
.ad-glass{
  background:var(--ad-glass);
  border:1px solid var(--ad-stroke);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  backdrop-filter:blur(22px) saturate(150%);
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .ad-glass{ background:rgba(11,18,32,.88); }
}

/* ---------- Butonlar ----------------------------------------------------- */
.ad-btn{
  --ad-h:52px;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:var(--ad-h); padding:0 20px; border-radius:var(--ad-r-md);
  font:inherit; font-size:15px; font-weight:700; letter-spacing:.01em;
  border:1px solid transparent; cursor:pointer; text-decoration:none;
  transition:transform .16s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease, opacity .2s ease;
  white-space:nowrap;
}
.ad-btn:active{ transform:translateY(1px); }
/* Birincil buton: mint dolgu + KOYU yazı (bkz. :root'taki kontrast notu).
   Gradyan bilerek çok dar tutuldu — tanıtım sitesinin butonları düz renk. */
.ad-btn--primary{
  width:100%;
  background:linear-gradient(135deg, #9AD3AE 0%, var(--ad-brand) 55%, #79BC93 100%);
  color:var(--ad-brand-ink);
  box-shadow:0 12px 28px -10px var(--ad-brand-soft), inset 0 1px 0 rgba(255,255,255,.45);
}
.ad-btn--primary:hover{ box-shadow:0 18px 38px -12px rgba(141,201,164,.55), inset 0 1px 0 rgba(255,255,255,.55); }
/* Buton içindeki ok simgesi currentColor kullanıyor, koyu mürekkebi devralır. */
.ad-btn--ghost{
  width:100%;
  background:var(--ad-glass-2); color:var(--ad-txt); border-color:var(--ad-stroke);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  font-weight:600;
}
.ad-btn--ghost:hover{ background:rgba(255,255,255,.15); border-color:var(--ad-stroke-strong); }
.ad-btn--pill{
  --ad-h:38px; padding:0 16px; font-size:13px; font-weight:600;
  border-radius:999px; color:var(--ad-txt);
  background:var(--ad-glass); border-color:var(--ad-stroke);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
}
.ad-btn--pill:hover{ background:rgba(255,255,255,.14); border-color:var(--ad-stroke-strong); }
.ad-btn[aria-busy="true"]{ pointer-events:none; opacity:.85; }

/* ---------- Orta bölüm --------------------------------------------------- */
.ad-main{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,472px);
  align-items:center;
  gap:clamp(32px,6vw,96px);
}

/* Sol: tanıtım */
/* container-type: başlık ekranın değil, KENDİ SÜTUNUNUN genişliğine göre ölçekleniyor.
   1080-1400px arasında sütun daralınca vw tabanlı boyut taşıp "Öğrenci" kelimesini
   tek başına satırda bırakıyordu. */
.ad-hero{ max-width:700px; container-type:inline-size; }
.ad-hero__eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-size:11.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:#C8E6D6; padding:7px 14px; border-radius:999px;
  background:rgba(141,201,164,.16); border:1px solid rgba(141,201,164,.34);
}
/* Nokta turuncu: tanıtım sitesindeki turuncu çipin karşılığı. Palete üçüncü
   rengi tek bir noktadan sokuyor — durum göstergesi değil, marka vurgusu. */
.ad-hero__eyebrow::before{
  content:""; width:7px; height:7px; border-radius:50%; background:var(--ad-accent-2);
  box-shadow:0 0 0 4px rgba(249,166,9,.20);
}
.ad-hero h1{
  margin:22px 0 0;
  font-size:clamp(32px,4.2vw,52px); line-height:1.06; font-weight:800; letter-spacing:-.026em;
  text-wrap:pretty;
  /* Perde daraldıkça metnin sağ ucu aydınlık göğe taşıyor; okunurluk artık
     perdeden değil GÖLGEDEN geliyor. İki katman: geniş yumuşak halka + sıkı
     kenar. Kaldırılırsa başlık gökyüzünde erir. */
  text-shadow:0 2px 30px rgba(3,7,15,.82), 0 1px 3px rgba(3,7,15,.6);
}
@supports (font-size:1cqi){
  .ad-hero h1{ font-size:clamp(32px,8.4cqi,52px); }
}
.ad-hero h1 em{ font-style:normal; color:#fff; }
.ad-hero p{
  margin:20px 0 0; max-width:47ch;
  font-size:clamp(15px,1.15vw,17.5px); line-height:1.62; color:#DFE6F0; font-weight:400;
  text-shadow:0 1px 18px rgba(3,7,15,.88), 0 1px 2px rgba(3,7,15,.5);
}
.ad-hero__list{ list-style:none; margin:34px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px; }
.ad-hero__list li{
  display:inline-flex; align-items:center; gap:9px;
  font-size:13.5px; font-weight:600; color:#E3E9F4;
  padding:9px 15px 9px 12px; border-radius:999px;
  background:rgba(10,17,30,.44); border:1px solid var(--ad-stroke);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.ad-hero__list svg{ width:16px; height:16px; color:var(--ad-brand-2); flex:none; }

/* ---------- Giriş kartı -------------------------------------------------- */
.ad-card{
  border-radius:var(--ad-r-lg);
  padding:clamp(26px,2.6vw,38px);
  box-shadow:var(--ad-shadow);
  position:relative;
  isolation:isolate;
  /* Diğer cam yüzeylerden daha dolu: formun okunması pazarlık konusu değil.
     .58 → .66 (2026-08-10): perde daralınca kartın ARKASINDAKİ fotoğraf da
     aydınlandı, bileşik zemin açıldı ve kart metinlerinin kontrastı düştü
     (ölçüldü: başlık 7.98 → 7.32, alt metin 4.40 → 4.13). Çözüm perdeyi geri
     koyulaştırmak DEĞİL — o zaman bina yine kaybolurdu — kartın kendi
     zeminini doldurmak. Fotoğraf açık kalıyor, form okunuyor. */
  background:rgba(9,15,27,.66);
}
/* üst kenarda ince ışık çizgisi */
.ad-card::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(160deg, rgba(255,255,255,.42), rgba(255,255,255,0) 42%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.ad-card__head{ margin-bottom:26px; }
.ad-card__head h2{ margin:0; font-size:25px; font-weight:800; letter-spacing:-.02em; }
/* #B8C3D4 → #C8D2E0: eski renk 14px'te AA'yı zaten geçmiyordu (ölçüm 4.40:1,
   eşik 4.5). Palet işi sırasında düzeltildi. */
.ad-card__head p{ margin:8px 0 0; font-size:14px; color:#C8D2E0; line-height:1.55; }

/* ---------- Form alanları ------------------------------------------------ */
.ad-field{ margin-bottom:16px; }
.ad-field__label{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  margin-bottom:8px;
}
/* Mikro etiket üslubu: tanıtım sitesi form etiketlerini ("ADINIZ - SOYADINIZ")
   küçük punto, BÜYÜK HARF ve geniş harf aralığıyla yazıyor. Aynı üslup zaten
   .ad-sep ve .ad-hero__eyebrow'da vardı; form alanlarına da taşındı, sayfa
   kendi içinde tek bir tipografik ritme oturdu.
   Renk BİLEREK açık bırakıldı (#DCE3EF): küçük ve seyrek harf, kontrastı
   düşürülürse okunmaz. */
.ad-field__label label{
  font-size:11px; font-weight:700; color:#DCE3EF;
  text-transform:uppercase; letter-spacing:.14em;
}
.ad-field__label a{ font-size:12.5px; font-weight:600; color:var(--ad-brand-2); text-decoration:none; }
.ad-field__label a:hover{ text-decoration:underline; }

.ad-control{ position:relative; display:flex; align-items:center; }
.ad-control__icon{
  position:absolute; left:15px; width:18px; height:18px; color:var(--ad-muted-2);
  pointer-events:none; transition:color .2s ease;
}
.ad-control input{
  width:100%; height:54px;
  padding:0 15px 0 46px;
  font:inherit; font-size:15px; font-weight:500; color:var(--ad-txt);
  background:rgba(255,255,255,.10);
  border:1px solid var(--ad-stroke);
  border-radius:var(--ad-r-md);
  outline:none;
  transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.ad-control input::placeholder{ color:#93A0B2; font-weight:400; }
.ad-control input:hover{ border-color:var(--ad-stroke-strong); }
.ad-control input:focus{
  border-color:var(--ad-brand-2);
  background:rgba(255,255,255,.085);
  box-shadow:0 0 0 4px rgba(141,201,164,.24);
}
.ad-control:focus-within .ad-control__icon{ color:var(--ad-brand-2); }
.ad-control--pw input{ padding-right:52px; }
.ad-control__eye{
  position:absolute; right:8px;
  width:38px; height:38px; display:grid; place-items:center;
  background:none; border:0; border-radius:9px; cursor:pointer; color:var(--ad-muted-2);
  transition:color .18s ease, background .18s ease;
}
.ad-control__eye:hover{ color:var(--ad-txt); background:rgba(255,255,255,.09); }
.ad-control__eye svg{ width:19px; height:19px; }

/* hata durumu */
.ad-field.ad-is-invalid .ad-control input{ border-color:var(--ad-danger); box-shadow:0 0 0 4px rgba(255,107,107,.16); }
.ad-field.ad-is-invalid .ad-control__icon{ color:var(--ad-danger); }
.ad-field__msg{
  display:none; align-items:center; gap:6px;
  margin-top:7px; font-size:12.5px; font-weight:600; color:var(--ad-danger);
}
.ad-field.ad-is-invalid .ad-field__msg{ display:flex; }
.ad-field__msg svg{ width:14px; height:14px; flex:none; }

/* caps-lock uyarısı */
.ad-hint{
  display:none; align-items:center; gap:6px;
  margin-top:7px; font-size:12.5px; font-weight:600; color:#FFCF6B;
}
.ad-hint.ad-is-on{ display:flex; }
.ad-hint svg{ width:14px; height:14px; flex:none; }

/* ---------- Güvenlik kodu (CAPTCHA) -------------------------------------- */
.ad-captcha{ margin-bottom:18px; }
.ad-captcha__box{
  display:flex; align-items:center; gap:12px;
  padding:10px 10px 10px 16px; margin-bottom:10px;
  background:rgba(255,255,255,.055);
  border:1px solid var(--ad-stroke); border-radius:var(--ad-r-md);
}
.ad-captcha__q{
  flex:1; font-size:21px; font-weight:800; letter-spacing:.10em;
  color:#fff; font-variant-numeric:tabular-nums; user-select:none;
}
.ad-captcha__q b{ color:var(--ad-brand-2); font-weight:800; }
.ad-captcha__refresh{
  width:40px; height:40px; flex:none; display:grid; place-items:center;
  border-radius:var(--ad-r-sm); border:1px solid var(--ad-stroke);
  background:rgba(255,255,255,.07); color:var(--ad-txt); cursor:pointer;
  transition:background .18s ease, transform .35s ease;
}
.ad-captcha__refresh:hover{ background:rgba(255,255,255,.15); }
.ad-captcha__refresh.ad-spin{ transform:rotate(-360deg); }
.ad-captcha__refresh svg{ width:18px; height:18px; }

/* ---------- Ayırıcı ------------------------------------------------------ */
.ad-sep{
  display:flex; align-items:center; gap:14px;
  margin:22px 0; font-size:11.5px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ad-muted-2);
}
.ad-sep::before,.ad-sep::after{ content:""; flex:1; height:1px; background:var(--ad-stroke); }

/* ---------- Kart altı ---------------------------------------------------- */
.ad-card__foot{
  margin-top:22px; padding-top:20px; border-top:1px solid var(--ad-stroke);
  text-align:center; font-size:13.5px; color:var(--ad-muted); line-height:1.6;
}
.ad-card__foot strong{ display:block; color:var(--ad-txt); font-weight:700; margin-bottom:12px; font-size:14px; }
.ad-stack{ display:grid; gap:10px; }

/* ---------- Alt bar ------------------------------------------------------ */
.ad-bottom{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:16px;
  font-size:12.5px; color:#9AA6B8;
  text-shadow:0 1px 10px rgba(3,7,15,.8);
}
.ad-bottom__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; }
.ad-bottom__meta span{ display:inline-flex; align-items:center; gap:7px; }
.ad-bottom__meta svg{ width:14px; height:14px; color:var(--ad-muted-2); flex:none; }
.ad-bottom a{ color:var(--ad-muted-2); text-decoration:none; }
.ad-bottom a:hover{ color:var(--ad-txt); }

/* Videoyu durdur/oynat — WCAG 2.2.2: 5 sn'den uzun otomatik hareket durdurulabilmeli */
.ad-vidbtn{
  display:none; align-items:center; gap:7px;
  height:30px; padding:0 12px; border-radius:999px;
  font:inherit; font-size:11.5px; font-weight:700; letter-spacing:.02em;
  color:var(--ad-muted); cursor:pointer;
  background:var(--ad-glass); border:1px solid var(--ad-stroke);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  transition:color .18s ease, background .18s ease, border-color .18s ease;
}
.ad-vidbtn.ad-is-shown{ display:inline-flex; }
.ad-vidbtn:hover{ color:var(--ad-txt); background:rgba(255,255,255,.14); border-color:var(--ad-stroke-strong); }
.ad-vidbtn svg{ width:13px; height:13px; flex:none; }

/* Yerel dosyada video oynayamayınca gösterilen açıklama (mockup'a özel) */
.ad-vidnote{
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 12px; border-radius:999px;
  font-size:11.5px; font-weight:600; color:#FFCF6B;
  background:rgba(255,207,107,.10); border:1px solid rgba(255,207,107,.26);
}
.ad-vidnote[hidden]{ display:none; }
.ad-vidnote svg{ width:13px; height:13px; flex:none; }
/* Sosyal ikonlar her platformun kendi rengiyle: soluk gri tek renk fotoğrafın
   üstünde neredeyse görünmüyordu. Simge beyaz, zemin marka rengi. */
.ad-social{ display:flex; align-items:center; gap:9px; }
.ad-social a{
  width:38px; height:38px; display:grid; place-items:center; border-radius:11px;
  color:#fff; border:1px solid rgba(255,255,255,.20);
  box-shadow:0 6px 18px -6px rgba(0,0,0,.75);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.ad-social a:hover{ transform:translateY(-2px); filter:brightness(1.14); box-shadow:0 12px 24px -8px rgba(0,0,0,.85); }
.ad-social a:focus-visible{ outline:2px solid #fff; outline-offset:3px; }
.ad-social svg{ width:18px; height:18px; }
.ad-social__ig{ background:radial-gradient(circle at 28% 108%, #FDF497 0%, #FD5949 45%, #D6249F 62%, #285AEB 92%); }
.ad-social__yt{ background:#FF0000; }
.ad-social__fb{ background:#1877F2; }
.ad-social__map{ background:#34A853; }

/* ---------- Video paneli ------------------------------------------------- */
.ad-vmodal{ position:fixed; inset:0; z-index:60; display:none; }
.ad-vmodal.ad-is-open{ display:grid; place-items:center; padding:clamp(14px,3vw,28px); }
.ad-vmodal__perde{
  position:absolute; inset:0; background:rgba(3,6,12,.74);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.ad-vmodal__kutu{
  position:relative; width:min(880px,100%);
  max-height:min(86dvh,760px); overflow:auto;
  border-radius:var(--ad-r-lg); padding:clamp(20px,2.4vw,30px);
  box-shadow:var(--ad-shadow);
  animation:vac .22s ease both;
}
@keyframes vac{ from{ opacity:0; transform:translateY(10px) scale(.99); } }
.ad-vmodal__ust{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:20px; }
.ad-vmodal__ust h3{ margin:0; font-size:21px; font-weight:800; letter-spacing:-.02em; }
.ad-vmodal__ust p{ margin:6px 0 0; font-size:13.5px; color:var(--ad-muted); line-height:1.5; }
.ad-vmodal__kapat{
  width:38px; height:38px; flex:none; display:grid; place-items:center;
  border-radius:10px; border:1px solid var(--ad-stroke);
  background:rgba(255,255,255,.07); color:var(--ad-txt); cursor:pointer;
}
.ad-vmodal__kapat:hover{ background:rgba(255,255,255,.16); }
.ad-vmodal__kapat svg{ width:17px; height:17px; }

.ad-vliste{ display:grid; grid-template-columns:repeat(auto-fill,minmax(212px,1fr)); gap:14px; }
.ad-vkart{
  display:block; text-decoration:none; color:inherit;
  border-radius:14px; overflow:hidden;
  border:1px solid var(--ad-stroke); background:rgba(255,255,255,.05);
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}
.ad-vkart:hover{ transform:translateY(-3px); border-color:var(--ad-stroke-strong); background:rgba(255,255,255,.11); }
.ad-vkart__gorsel{ position:relative; aspect-ratio:16/9; background:#0D1421; display:grid; place-items:center; }
.ad-vkart__gorsel img{ width:100%; height:100%; object-fit:cover; display:block; }
.ad-vkart__gorsel.ad-bos img{ display:none; }
.ad-vkart__oynat{
  position:absolute; width:46px; height:46px; border-radius:50%;
  background:rgba(9,14,26,.62); border:1px solid rgba(255,255,255,.34);
  display:grid; place-items:center;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  transition:background .18s ease, transform .18s ease, border-color .18s ease;
}
/* Hover'da mint dolgu geliyor; oynat üçgeni beyaz kalsaydı 1.91:1 olurdu. */
.ad-vkart:hover .ad-vkart__oynat{ background:var(--ad-brand); border-color:transparent; transform:scale(1.07); }
.ad-vkart:hover .ad-vkart__oynat svg{ color:var(--ad-brand-ink); }
.ad-vkart__oynat svg{ width:16px; height:16px; color:#fff; margin-left:2px; }
.ad-vkart__rozet{
  position:absolute; top:8px; left:8px; padding:4px 9px; border-radius:999px;
  font-size:10.5px; font-weight:700; letter-spacing:.03em; color:#DCE6F7;
  background:rgba(9,14,26,.74); border:1px solid rgba(255,255,255,.26);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.ad-vkart__ad{ display:block; padding:11px 13px 13px; font-size:13.5px; font-weight:600; line-height:1.42; }
.ad-vkart__baslik{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; overflow-wrap:anywhere;
}
.ad-vkart__ad span.ad-vkart__meta{ display:flex; align-items:center; gap:5px; margin-top:7px; font-size:11.5px; font-weight:600; color:var(--ad-muted-2); }
.ad-vkart__ad span.ad-vkart__meta svg{ width:12px; height:12px; flex:none; }
.ad-vmodal__alt{
  margin-top:18px; padding-top:16px; border-top:1px solid var(--ad-stroke);
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-size:12.5px; color:var(--ad-muted-2);
}
.ad-vmodal__alt a{ color:var(--ad-brand-2); font-weight:700; text-decoration:none; }
.ad-vmodal__alt a:hover{ text-decoration:underline; }
@media (max-width:520px){
  .ad-vliste{ grid-template-columns:1fr; }
  .ad-vmodal__ust h3{ font-size:18px; }
}

/* ---------- Erişilebilirlik --------------------------------------------- */
:where(a,button,input,[tabindex]):focus-visible{
  outline:2px solid var(--ad-brand-2); outline-offset:3px; border-radius:6px;
}
.ad-sr{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.ad-skip{
  position:absolute; left:16px; top:-60px; z-index:50;
  padding:10px 16px; border-radius:10px; background:var(--ad-brand); color:var(--ad-brand-ink);
  font-weight:700; font-size:13px; text-decoration:none; transition:top .18s ease;
}
.ad-skip:focus{ top:16px; }


/* ---------- Uyarı şeridi ------------------------------------------------- */
.ad-alert{
  display:none; align-items:flex-start; gap:10px;
  margin-bottom:18px; padding:12px 14px; border-radius:var(--ad-r-md);
  font-size:13px; font-weight:600; line-height:1.5;
  background:rgba(255,107,107,.12); border:1px solid rgba(255,107,107,.34); color:#FFC9C9;
}
.ad-alert.ad-is-on{ display:flex; }
/* Bilgi şeridi: kum (#B9A171, kurumsal palet). Mint DEĞİL — mint birincil eylem
   rengi; yeşil DEĞİL — o başarı (--ad-ok); amber DEĞİL — o caps-lock uyarısı. */
.ad-alert.ad-is-info{ background:rgba(185,161,113,.16); border-color:rgba(185,161,113,.42); color:#E6D9C2; }
.ad-alert svg{ width:17px; height:17px; flex:none; margin-top:1px; }

/* ---------- Yükleniyor --------------------------------------------------- */
.ad-spinner{
  width:18px; height:18px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  animation:spin .7s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ---------- Duyarlı yerleşim -------------------------------------------- */
@media (max-width:1080px){
  .ad-main{ grid-template-columns:minmax(0,1fr); justify-items:center; gap:34px; }
  .ad-hero{ display:none; }
  .ad-card{ width:100%; max-width:472px; }
  .ad-top__logo span{ display:none; }
}
/* alçak ekranlarda (dizüstü + güvenlik kodu açıkken) dikey sıkıştırma */
@media (min-width:1081px) and (max-height:900px){
  .ad-card{ padding:26px 30px; }
  .ad-card__head{ margin-bottom:20px; }
  .ad-field{ margin-bottom:13px; }
  .ad-control input{ height:50px; }
  .ad-btn{ --ad-h:48px; }
  .ad-sep{ margin:16px 0; }
  .ad-card__foot{ margin-top:18px; padding-top:16px; }
}
@media (max-width:640px){
  .ad-page{ padding:16px 14px 22px; gap:18px; }
  .ad-top{ gap:10px; }
  .ad-top__nav{ gap:8px; margin-left:auto; }
  .ad-btn--pill{ --ad-h:34px; padding:0 12px; font-size:12px; }
  /* Mobilde hero metni fotoğrafın TAM üstünde duruyor, masaüstündeki gibi yan
     sütunda değil — bu yüzden perde burada daha güçlü kalmalı, sadece bir tık açıldı. */
  .ad-bg__scrim{ background:
      linear-gradient(180deg, rgba(5,9,18,.30) 0%, rgba(5,9,18,.48) 42%, rgba(4,7,14,.70) 100%); }
  .ad-card{ padding:24px 20px; border-radius:18px; }
  .ad-card__head h2{ font-size:22px; }
  .ad-top__logo img{ height:26px; }
  .ad-bottom{ justify-content:center; text-align:center; }
  .ad-bottom__meta{ justify-content:center; }
  }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

/* ---------- Apple ile devam et --------------------------------------------
   Apple arayuz kilavuzu: butonun zemini siyah (ya da beyaz), logo tek renk ve
   metin "Apple ile devam et". Google butonunun (ad-btn--ghost) hemen altinda
   durdugu icin ayni yukseklik ve kose yaricapini paylasiyor.
   -------------------------------------------------------------------------- */
.ad-btn--apple{
  width:100%;
  background:#000; color:#fff; border-color:rgba(255,255,255,.28);
  font-weight:600;
}
.ad-btn--apple:hover{ background:#141414; border-color:rgba(255,255,255,.45); }
.ad-btn--apple svg{ margin-top:-2px; }

/* ==========================================================================
   ASP.NET doğrulama sınıflarıyla köprü
   asp-validation-summary / asp-validation-for hata YOKKEN de etiketi basar
   (boş <div>, içinde gizli <li>). 'ad-is-on' verilseydi ekranda boş kırmızı
   kutu dururdu; onun yerine hatayı ASP.NET'in kendi sınıfından anlıyoruz.
   ========================================================================== */
.ad-alert.validation-summary-errors{ display:flex; }
.ad-alert.validation-summary-valid{ display:none; }
.ad-alert.validation-summary-errors ul{ margin:0; padding-left:18px; }
.ad-field__msg.field-validation-error{ display:flex; }
.ad-field__msg.field-validation-valid{ display:none; }
