/* ===== Giriş sayfası · açık, sade, okul logosunun turkuaz tonlarında ===== */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/plus-jakarta-sans-latin-wght-normal.woff2) format('woff2')}

html{min-height:100%;background:#f1f7f7}
body{--la-deep:#06404a;--la-teal:#0b8494;--la-teal-2:#12a3b0;--la-ink:#0c2a30;--la-text:#3f5a60;--la-muted:#6f8a90;--la-line:#dcebed;--la-soft:#eef7f8;
  --la-font:'Plus Jakarta Sans',Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  position:relative;min-height:100vh!important;min-height:100dvh!important;margin:0!important;padding:0!important;display:block!important;overflow-x:hidden;background:linear-gradient(160deg,#f6fbfb 0%,#eaf5f6 55%,#f4f9f7 100%)!important;color:var(--la-text);font-family:var(--la-font)!important;-webkit-font-smoothing:antialiased}
body :where(h1,h2,h3,h4,p,span,strong,small,a,button,input,label,div){font-family:var(--la-font)!important}

/* Arka planda yavaş hareket eden yumuşak ışıklar */
.bg-glow-1,.bg-glow-2,.bg-glow-3{display:block!important;position:fixed!important;z-index:0!important;border-radius:50%!important;filter:blur(80px)!important;pointer-events:none;will-change:transform}
.bg-glow-1{left:-10%!important;top:-16%!important;right:auto!important;bottom:auto!important;width:44vw!important;height:44vw!important;max-width:600px;max-height:600px;background:#7fd6dd!important;opacity:.42!important;animation:laDrift1 24s ease-in-out infinite alternate!important}
.bg-glow-2{right:-12%!important;bottom:-18%!important;left:auto!important;top:auto!important;width:46vw!important;height:46vw!important;max-width:640px;max-height:640px;background:#9fe3d2!important;opacity:.4!important;animation:laDrift2 28s ease-in-out infinite alternate!important}
.bg-glow-3{left:40%!important;top:30%!important;right:auto!important;bottom:auto!important;width:26vw!important;height:26vw!important;max-width:360px;max-height:360px;background:#c7e9f5!important;opacity:.5!important;animation:laDrift3 32s ease-in-out infinite alternate!important}
@keyframes laDrift1{to{transform:translate3d(12vw,10vh,0) scale(1.12)}}
@keyframes laDrift2{to{transform:translate3d(-10vw,-12vh,0) scale(.92)}}
@keyframes laDrift3{to{transform:translate3d(-14vw,10vh,0) scale(1.25)}}

.portal-container{position:relative;z-index:1;display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(0,430px)!important;gap:28px!important;align-items:stretch!important;align-content:center!important;width:100%!important;max-width:1100px!important;min-height:100vh!important;min-height:100dvh!important;margin:0 auto!important;padding:16px 28px!important;box-sizing:border-box}

/* Açılış animasyonları */
@keyframes laRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes laPop{from{opacity:0;transform:translateY(22px) scale(.975)}to{opacity:1;transform:none}}
.login-card{animation:laPop .7s cubic-bezier(.2,.8,.2,1) both}
.info-panel{animation:laPop .7s .08s cubic-bezier(.2,.8,.2,1) both}
.top-info-head{animation:laRise .55s .2s ease both}
.info-headline{animation:laRise .55s .28s ease both}
.info-subtitle{animation:laRise .55s .36s ease both}
.feature-item{animation:laRise .55s ease both}
.feature-item:nth-child(1){animation-delay:.44s}
.feature-item:nth-child(2){animation-delay:.52s}
.feature-item:nth-child(3){animation-delay:.6s}
.feature-item:nth-child(4){animation-delay:.68s}
.quote-card{animation:laRise .55s .78s ease both}
.logo-container{animation:laRise .6s .15s ease both}
.school-name,.school-slogan,.la-welcome,#loginForm{animation:laRise .55s ease both}
.school-name{animation-delay:.22s}.school-slogan{animation-delay:.28s}.la-welcome{animation-delay:.34s}#loginForm{animation-delay:.42s}

/* Tanıtım tarafı: sade liste */
.info-panel{display:flex!important;flex-direction:column!important;gap:22px!important;min-width:0;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--la-text)!important;overflow:visible!important}
.info-panel::before,.info-panel::after{display:none!important}
.top-info-head{display:flex!important;flex-wrap:wrap;align-items:center;gap:10px!important;margin:0!important}
.brand-pill{padding:7px 14px!important;border:1px solid var(--la-line)!important;border-radius:999px!important;background:#fff!important;color:var(--la-deep)!important;font-size:12px!important;font-weight:700!important;letter-spacing:.07em!important;box-shadow:none!important}
.brand-pill span{color:var(--la-deep)!important}
.brand-pill i{color:var(--la-teal)!important}
.pulse-indicator{background:var(--la-teal-2)!important;box-shadow:0 0 0 0 rgba(18,163,176,.6);animation:laPulse 2.4s ease-out infinite!important}
@keyframes laPulse{70%{box-shadow:0 0 0 9px rgba(18,163,176,0)}100%{box-shadow:0 0 0 0 rgba(18,163,176,0)}}
.lgs-countdown-badge{padding:7px 14px!important;border:0!important;border-radius:999px!important;background:var(--la-deep)!important;color:#fff!important;font-size:13px!important;font-weight:650!important;box-shadow:none!important}
.lgs-countdown-badge span{color:#fff!important}
.lgs-countdown-badge i{color:#8fe3ea!important}
.lgs-countdown-badge .lgs-days-count{color:#8fe3ea!important;font-weight:800!important}
.info-headline{position:relative;margin:4px 0 0!important;padding-bottom:16px;font-size:36px!important;font-weight:800!important;line-height:1.14!important;letter-spacing:-.025em!important}
.info-headline::after{content:"";position:absolute;left:0;bottom:0;width:72px;height:4px;border-radius:999px;background:linear-gradient(90deg,var(--la-teal),var(--la-teal-2));transform-origin:left;animation:laLine .9s .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes laLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.animated-gradient-title{background:linear-gradient(100deg,var(--la-deep) 0%,var(--la-teal) 45%,var(--la-deep) 90%)!important;background-size:220% 100%!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important;animation:laShimmer 10s linear infinite!important}
@keyframes laShimmer{to{background-position:-220% 0}}
.info-subtitle{max-width:50ch!important;margin:0!important;color:var(--la-text)!important;font-size:16px!important;line-height:1.65!important}
.feature-list{display:grid!important;grid-template-columns:1fr!important;gap:4px!important;margin:0!important}
.feature-item{display:flex!important;align-items:center!important;gap:14px!important;margin:0!important;padding:8px 12px!important;border:0!important;border-radius:14px!important;background:transparent!important;box-shadow:none!important;transition:background-color .2s ease,transform .2s ease}
.feature-item:hover{background:rgba(11,132,148,.07)!important;transform:translateX(4px)!important}
.feature-icon-box{display:grid!important;place-items:center;flex:0 0 42px!important;width:42px!important;height:42px!important;border:0!important;border-radius:13px!important;background:linear-gradient(135deg,var(--la-teal-2),var(--la-teal))!important;color:#fff!important;font-size:16px!important;box-shadow:0 10px 18px -12px var(--la-teal)!important;transition:transform .25s ease}
.feature-item:hover .feature-icon-box{transform:rotate(-6deg) scale(1.06)}
.feature-icon-box i{color:#fff!important}
.feature-title{margin:0 0 1px!important;color:var(--la-ink)!important;font-size:15.5px!important;font-weight:700!important;line-height:1.3!important}
.feature-desc{margin:0!important;color:var(--la-muted)!important;font-size:13.5px!important;line-height:1.5!important}
.quote-card{margin:0!important;padding:16px 18px!important;border:0!important;border-left:3px solid var(--la-teal)!important;border-radius:0 14px 14px 0!important;background:rgba(11,132,148,.06)!important;box-shadow:none!important}
.quote-body{color:var(--la-deep)!important;font-size:14.5px!important;font-style:italic;line-height:1.6!important}
.quote-body i{color:var(--la-teal)!important}
.quote-author{color:var(--la-teal)!important;font-size:13px!important;font-weight:700!important}
.quote-author i{color:var(--la-teal)!important}

/* Giriş kartı */
.login-card{position:relative;display:flex!important;flex-direction:column!important;gap:14px!important;min-width:0;padding:26px 32px 18px!important;border:1px solid #fff!important;border-radius:28px!important;background:rgba(255,255,255,.92)!important;box-shadow:0 30px 70px -40px rgba(6,64,74,.55),0 2px 6px rgba(6,64,74,.04)!important;color:var(--la-ink)!important;backdrop-filter:blur(10px)}
.login-card::before,.login-card::after{display:none!important}
/* Logo: genişlik yönetim panelindeki ayardan gelir (--logo-w). Arkasında kutu, halka ya da zemin yok;
   gölge ve ışık logonun kendi şeklini izler. */
.logo-container{position:relative;display:flex!important;justify-content:center;margin:0 0 14px!important}
.logo-wrapper{position:relative;display:block!important;width:min(var(--logo-w,110px),62vw)!important;margin:0 auto;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;overflow:visible!important;filter:none!important;transform-origin:50% 60%;animation:laLogoIn .9s .1s cubic-bezier(.2,.9,.25,1.15) both,laFloat 6s 1s ease-in-out infinite}
.logo-wrapper:hover{transform:none!important}
.logo-wrapper::before{content:none!important;display:none!important}
.logo-img{position:relative;display:block!important;width:100%!important;max-width:none!important;height:auto!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(6,64,74,.2)) drop-shadow(0 2px 3px rgba(6,64,74,.12))}
/* Işık süzmesi yalnızca logonun çizildiği yerde görünür (logo maske olarak kullanılır) */
.logo-wrapper::after{content:""!important;display:block!important;position:absolute!important;inset:0!important;top:0!important;left:0!important;width:auto!important;height:auto!important;border-radius:0!important;box-shadow:none!important;opacity:1!important;transform:none!important;background:linear-gradient(112deg,transparent 38%,rgba(255,255,255,.85) 50%,transparent 62%) no-repeat!important;background-size:260% 100%!important;background-position:140% 0;-webkit-mask:var(--logo-url) center/contain no-repeat;mask:var(--logo-url) center/contain no-repeat;animation:laLogoShine 5.5s 1.4s ease-in-out infinite!important;pointer-events:none}
@supports not ((mask:url(x)) or (-webkit-mask:url(x))){.logo-wrapper::after{display:none!important}}
@keyframes laLogoIn{from{opacity:0;transform:translateY(10px) scale(.86)}to{opacity:1;transform:none}}
@keyframes laFloat{50%{transform:translateY(-5px)}}
@keyframes laLogoShine{0%{background-position:140% 0}45%,100%{background-position:-40% 0}}
.school-name{margin:10px 0 0!important;color:var(--la-deep)!important;font-size:21px!important;font-weight:800!important;line-height:1.25!important;letter-spacing:-.02em!important;text-align:center}
.school-slogan{margin:3px 0 0!important;color:var(--la-muted)!important;font-size:13.5px!important;font-weight:500!important;justify-content:center}
.school-slogan span{color:var(--la-muted)!important}
.slogan-dash{display:none!important}
.la-welcome{margin:16px 0 12px;padding-top:16px;border-top:1px solid var(--la-line);text-align:left}
.la-welcome h1{margin:0;color:var(--la-ink);font-size:20px;font-weight:800;line-height:1.25;letter-spacing:-.02em}
.la-welcome p{margin:3px 0 0;color:var(--la-muted);font-size:14.5px;line-height:1.5}
.la-label{display:block;margin:0 0 6px;color:var(--la-text);font-size:13.5px;font-weight:650}
.input-wrapper{margin-bottom:14px!important}
.form-control-app{height:54px!important;border:1.5px solid var(--la-line)!important;border-radius:14px!important;background:#f6fbfb!important;color:var(--la-ink)!important;caret-color:var(--la-teal);font-size:16px!important;font-weight:600!important;box-shadow:none!important;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
.form-control-app::placeholder{color:#9ab1b6!important;font-weight:500!important}
.form-control-app:focus{border-color:var(--la-teal)!important;background:#fff!important;box-shadow:0 0 0 4px rgba(11,132,148,.14)!important;outline:0!important}
.input-icon{color:#8aa3a8!important;font-size:16px!important;transition:color .2s ease,transform .2s ease}
.input-wrapper:focus-within .input-icon{color:var(--la-teal)!important;transform:scale(1.1)}
.password-toggle-btn{color:#8aa3a8!important}
.password-toggle-btn:hover{color:var(--la-teal)!important}
.remember-forgot-row{margin:2px 0 18px!important}
.remember-label,.remember-label span{color:var(--la-text)!important;font-size:14.5px!important;font-weight:500!important}
.remember-label input{width:18px;height:18px;accent-color:var(--la-teal)}
.forgot-pass{color:var(--la-teal)!important;font-size:14.5px!important;font-weight:700!important;text-decoration:none!important}
.forgot-pass:hover{color:var(--la-deep)!important;text-decoration:underline!important}
.btn-app-primary{position:relative;overflow:hidden;height:56px!important;border:0!important;border-radius:16px!important;background:linear-gradient(110deg,var(--la-deep),var(--la-teal) 55%,var(--la-teal-2))!important;background-size:170% 100%!important;color:#fff!important;font-size:17px!important;font-weight:750!important;letter-spacing:0!important;box-shadow:0 18px 30px -18px rgba(6,64,74,.9)!important;transition:transform .15s ease,background-position .5s ease,box-shadow .2s ease}
.btn-app-primary::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:laShine 4.2s ease-in-out infinite}
@keyframes laShine{0%,60%{left:-60%}100%{left:130%}}
.btn-app-primary:hover{background-position:100% 0!important;transform:translateY(-2px);box-shadow:0 22px 34px -18px rgba(11,132,148,.95)!important}
.btn-app-primary:active{transform:scale(.985)}
.btn-app-primary span,.btn-app-primary .btn-arrow-icon{position:relative;z-index:1;color:#fff!important}
.btn-arrow-icon{transition:transform .2s ease}
.btn-app-primary:hover .btn-arrow-icon{transform:translateX(5px)}
.login-error{border:1px solid #f6caca!important;border-radius:14px!important;background:#fdf1f1!important}
.login-error-title{color:#991b1b!important;font-size:15px!important}
.login-error-message,.login-error-help{color:#7f1d1d!important;font-size:14px!important}
.project-creators-card{margin:0!important;padding:14px 0 0!important;border:0!important;border-top:1px solid var(--la-line)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;text-align:center}
.creators-header{color:#93aaaf!important;font-size:11.5px!important;font-weight:700!important;letter-spacing:.07em!important;text-transform:uppercase}
.creators-header i,.creators-team-title i,.creator-pill i{color:#93aaaf!important}
.creators-team-title{color:var(--la-text)!important;font-size:13.5px!important;font-weight:700!important}
.creator-pill{border:0!important;border-radius:999px!important;background:var(--la-soft)!important;color:var(--la-text)!important;font-size:12.5px!important;font-weight:650!important;box-shadow:none!important}
.creator-pill span{color:var(--la-text)!important}
.login-copyright{margin:0!important;padding:0!important;border:0!important;background:transparent!important;color:#93aaaf!important;font-size:12.5px!important;font-weight:500!important;justify-content:center;box-shadow:none!important}
.login-copyright span{color:#93aaaf!important}
.login-copyright strong{color:var(--la-muted)!important}
.login-copyright i{color:#93aaaf!important}

/* Masaüstünde iki taraf aynı yükseklikte */
@media(min-width:961px){
  .info-panel{height:100%!important;justify-content:space-between!important;gap:16px!important;padding:28px 32px!important;border:1px solid #fff!important;border-radius:28px!important;background:rgba(255,255,255,.55)!important;box-shadow:0 30px 70px -46px rgba(6,64,74,.45)!important;box-sizing:border-box;backdrop-filter:blur(10px)}
  .info-panel>*{margin:0!important}
  .info-panel>:first-child{display:flex!important;flex-direction:column!important;gap:16px!important}
  .login-card{height:100%!important;justify-content:space-between!important;box-sizing:border-box}
}
@media(max-width:960px){
  .portal-container{grid-template-columns:minmax(0,1fr)!important;gap:20px!important;max-width:520px!important;min-height:0!important;padding:16px 14px 28px!important}
  .login-card{order:-1!important;padding:26px 20px 20px!important;border-radius:26px!important}
  .info-panel{order:2!important;gap:16px!important;padding:22px 18px!important;border:1px solid #fff!important;border-radius:26px!important;background:rgba(255,255,255,.55)!important;box-shadow:0 30px 70px -46px rgba(6,64,74,.45)!important;box-sizing:border-box;backdrop-filter:blur(10px)}
  .info-headline{font-size:26px!important}
  .info-subtitle{font-size:15px!important}
  .bg-glow-1,.bg-glow-2{width:80vw!important;height:80vw!important;filter:blur(60px)!important}
  .bg-glow-3{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01s!important;animation-iteration-count:1!important;transition-duration:.01s!important}
}

/* Başlık tek satırda; soldan sağa açılır, üzerinden ışık geçer */
.info-headline{font-size:clamp(15px,4.7vw,26px)!important;white-space:nowrap!important;line-height:1.25!important;letter-spacing:-.02em!important;animation:none!important;opacity:1!important}
.info-headline .animated-gradient-title{display:inline-block;white-space:nowrap;background:linear-gradient(100deg,var(--la-deep) 0%,var(--la-deep) 38%,#35c6d2 50%,var(--la-deep) 62%,var(--la-deep) 100%)!important;background-size:260% 100%!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;clip-path:inset(0 100% 0 0);animation:laReveal 1.3s .3s cubic-bezier(.2,.8,.2,1) forwards,laSweep 4.5s 1.6s ease-in-out infinite!important}
@keyframes laReveal{to{clip-path:inset(0 0 0 0)}}
@keyframes laSweep{0%{background-position:130% 0}60%,100%{background-position:-30% 0}}
.info-headline::after{width:100%!important;height:3px!important;background:linear-gradient(90deg,var(--la-teal),var(--la-teal-2) 60%,transparent)!important;animation:laLine 1.3s .3s cubic-bezier(.2,.8,.2,1) both!important}
@media(min-width:961px){.info-headline{font-size:clamp(20px,2.18vw,28px)!important}}
@media(prefers-reduced-motion:reduce){.info-headline .animated-gradient-title{clip-path:none!important}}

/* Giriş kartı: üstte ince renk şeridi, daha net başlık hiyerarşisi */
.login-card{overflow:hidden}
.login-card::before{content:""!important;display:block!important;position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--la-deep),var(--la-teal) 45%,var(--la-teal-2) 75%,#5eead4)}
.school-name{font-size:23px!important}
.school-slogan{font-size:14px!important}
.la-welcome h1{font-size:21px}
.project-creators-card{padding-top:12px!important}
@media(max-width:960px){.logo-container{margin-top:6px!important}}

/* Beş temel özellik: sol sütun boş kalmadan dolar */
.feature-item:nth-child(5){animation-delay:.76s}
@media(min-width:961px){.feature-list{flex:1 1 auto;align-content:space-evenly!important;gap:2px!important}.feature-item{padding:7px 12px!important}}
/* Beş özellik satırı eşit yükseklikte ve eşit aralıkta */
.feature-list{display:grid!important;grid-template-columns:1fr!important;grid-auto-rows:1fr!important;gap:8px!important;align-content:stretch!important}
.feature-item{align-items:center!important;min-height:58px;margin:0!important;padding:6px 12px!important}
@media(min-width:961px){.feature-list{flex:1 1 auto;align-content:stretch!important;gap:8px!important}.feature-item{padding:6px 12px!important}}

/* Telefon: dokunma alanları */
.password-toggle-btn{min-width:40px!important;min-height:40px!important;display:inline-grid!important;place-items:center}
.forgot-pass{display:inline-flex!important;align-items:center;min-height:36px}

/* Mobil: kutu icinde basligin ve metinlerin tasmasini onle */
@media(max-width:960px){
  .info-headline{font-size:clamp(18px,5.4vw,24px)!important;white-space:normal!important;text-wrap:balance;overflow-wrap:anywhere}
  .info-headline .animated-gradient-title{display:inline!important;white-space:normal!important;-webkit-box-decoration-break:clone;box-decoration-break:clone}
  .info-panel,.info-panel>*,.feature-item>div:last-child,.quote-card,.quote-body{min-width:0!important;max-width:100%!important;overflow-wrap:anywhere}
  .info-subtitle{max-width:100%!important}
}

/* ===== Giriş düğmesi: düz, gölgesiz, sade ===== */
.btn-app-primary{display:flex!important;align-items:center;justify-content:center;gap:10px;width:100%;height:54px!important;border:0!important;border-radius:14px!important;background:#0a5c68!important;background-image:none!important;color:#fff!important;font-size:16.5px!important;font-weight:700!important;box-shadow:none!important;transform:none!important;transition:background-color .15s ease!important}
.btn-app-primary::before,.btn-app-primary::after{display:none!important;content:none!important;animation:none!important}
.btn-app-primary:hover{background:#08505a!important;box-shadow:none!important;transform:none!important}
.btn-app-primary:active{background:#063f47!important;transform:none!important}
.btn-app-primary:focus-visible{outline:3px solid rgba(18,163,176,.45)!important;outline-offset:2px}
.btn-app-primary .btn-arrow-icon{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.16);font-size:12px;transition:transform .15s ease}
.btn-app-primary:hover .btn-arrow-icon{transform:translateX(3px)}
body.is-admin-login .btn-app-primary{background:#0f172a!important}
body.is-admin-login .btn-app-primary:hover{background:#1e293b!important}

/* ===== Giriş kutularındaki ikonlar: renkli küçük kutu içinde beyaz ikon ===== */
.input-wrapper .input-icon{display:grid!important;place-items:center;left:9px!important;width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,#12a3b0,#06404a)!important;color:#fff!important;font-size:15px!important;line-height:1;transform:translateY(-50%)!important;transition:background .2s ease!important}
.input-wrapper:focus-within .input-icon{color:#fff!important;transform:translateY(-50%)!important;background:linear-gradient(135deg,#0b8494,#03272b)!important}
.input-wrapper .form-control-app{padding-left:56px!important}