/* ============ Neta Ads — login ============ */
.login-body{height:100dvh;overflow:hidden;background:var(--bg)}
.login-grid{display:grid;grid-template-columns:1.08fr 1fr;height:100dvh}

/* ---------- sol: yüzen ürün kartları vitrini ---------- */
.lg-media{
  position:relative;background:#fff;overflow:hidden;
  border-right:1px solid var(--line-soft);
}
.lg-cards{position:absolute;inset:0}
.lgc{
  position:absolute;
  left:min(var(--x), calc(100% - 290px));
  top:min(var(--y), calc(100% - 150px));
  animation:cardIn .9s cubic-bezier(.2,.7,.2,1) both,
            sway var(--sw) ease-in-out var(--sd) infinite alternate,
            bob var(--bob) ease-in-out calc(var(--sd) - 1s) infinite alternate;
}
@keyframes cardIn{from{opacity:0;scale:.9}to{opacity:1;scale:1}}
@keyframes sway{from{translate:-26px 0}to{translate:26px 0}}
@keyframes bob{from{transform:translateY(-9px)}to{transform:translateY(9px)}}
.lgc .kpi,.lgc .crow{box-shadow:var(--shadow-s);border-color:var(--line);animation:none}
.lgc .kpi:hover,.lgc .crow:hover{transform:none;box-shadow:var(--shadow-s)}

/* platform dağılım kartı */
.lg-pl{
  display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow-s);padding:9px 13px;margin-bottom:8px;
}
.lg-pl-name{display:flex;align-items:center;gap:7px;font-size:.72rem;font-weight:700;width:64px}
.lg-pl-name::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--d,var(--ink-3))}
.lg-pl-bar{flex:1;height:5px;border-radius:5px;background:var(--line-soft);overflow:hidden}
.lg-pl-bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--accent),#8fb0ff)}

/* kitle chip kartı */
.lg-chipcard{
  display:flex;flex-wrap:wrap;gap:6px;max-width:230px;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow-s);padding:11px 12px;
}
.lg-av{font-size:.66rem;font-weight:700;color:var(--ink-2);border:1px solid var(--line);border-radius:999px;padding:4px 10px;background:#fff}
.lg-av.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* bütçe kartı */
.lg-budget{
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;width:210px;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-s);padding:11px 13px;
}
.lg-budget span{font-size:.62rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.lg-budget strong{font-size:.95rem;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums}
.lg-budget-track{grid-column:1/-1;height:5px;border-radius:5px;background:var(--line-soft);overflow:hidden}
.lg-budget-track i{display:block;width:42%;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--accent),#8fb0ff)}

/* hedef kartı */
.lg-goal{
  display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid var(--accent);
  border-radius:var(--radius);box-shadow:0 0 0 3px var(--accent-soft),var(--shadow-s);padding:11px 14px;
}
.lg-goal svg{color:var(--accent);flex-shrink:0}
.lg-goal b{display:block;font-size:.76rem;font-weight:700}
.lg-goal i{font-style:normal;font-size:.64rem;font-weight:600;color:var(--ink-3)}

/* merkez logo */
.lg-lockup{
  position:absolute;inset:0;z-index:2;display:grid;place-content:center;justify-items:center;
  text-align:center;pointer-events:none;
}
.lg-lockup::before{
  content:"";position:absolute;width:460px;height:300px;left:50%;top:50%;translate:-50% -50%;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.96) 45%,rgba(255,255,255,0) 75%);
}
.lg-end-logo{
  position:relative;color:var(--ink);font-size:clamp(2.6rem,4.6vw,4rem);
  animation:logoIn 1.1s cubic-bezier(.2,.7,.2,1) .3s backwards;
}
.lg-end-logo i{color:var(--ink)}
.lg-end-logo em{color:var(--accent)}
.lg-lockup-sub{
  position:relative;margin-top:12px;font-size:.88rem;font-weight:600;color:var(--ink-3);
  animation:logoIn 1.1s cubic-bezier(.2,.7,.2,1) .55s backwards;
}
@keyframes logoIn{from{opacity:0;transform:scale(.92) translateY(10px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}

/* ---------- sağ: login (arka plansız) ---------- */
.lg-form-side{
  display:flex;flex-direction:column;justify-content:center;align-items:stretch;
  height:100dvh;overflow-y:auto;padding:40px clamp(32px,6vw,96px);background:none;
}
.lg-form-box{width:min(400px,100%);margin-inline:auto;padding-block:24px}
.lg-brand{display:inline-flex;margin-bottom:38px}
.lg-form-box h1{font-family:var(--font-display);font-size:clamp(1.7rem,2.6vw,2.15rem);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.lg-sub{color:var(--ink-3);font-size:.95rem;margin:8px 0 30px}

.lg-field{margin-bottom:16px}
.lg-field label{display:block;font-size:.8rem;font-weight:700;margin-bottom:7px}
.lg-field input{
  width:100%;font-size:.95rem;color:var(--ink);background:#fff;
  border:1.5px solid var(--line);border-radius:var(--radius);
  padding:12px 14px;min-height:46px;outline:none;
  transition:border-color .25s,box-shadow .25s;
}
.lg-field input::placeholder{color:#aab2c0}
.lg-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.lg-field input.bad{border-color:#d64550;box-shadow:0 0 0 3px #fdecee}
.lg-label-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:7px}
.lg-label-row label{margin:0}
.lg-forgot{font-size:.76rem;font-weight:700;color:var(--accent)}
.lg-forgot:hover{text-decoration:underline}
.lg-pass-wrap{position:relative}
.lg-pass-wrap input{padding-right:46px}
.lg-eye{
  position:absolute;right:6px;top:50%;translate:0 -50%;width:36px;height:36px;
  display:grid;place-items:center;border-radius:8px;color:var(--ink-3);
  transition:color .25s,background .25s;
}
.lg-eye:hover{color:var(--ink);background:var(--bg-alt)}
.lg-eye .eye-off{display:none}
.lg-eye[aria-pressed="true"] svg:first-child{display:none}
.lg-eye[aria-pressed="true"] .eye-off{display:block}
.lg-err{font-size:.76rem;font-weight:600;color:#d64550;margin-top:6px}

.lg-remember{
  display:inline-flex;align-items:center;gap:9px;margin:2px 0 22px;
  font-size:.84rem;font-weight:600;color:var(--ink-2);cursor:pointer;user-select:none;
}
.lg-remember input{position:absolute;opacity:0;pointer-events:none}
.lg-check{
  width:19px;height:19px;border-radius:6px;display:grid;place-items:center;flex-shrink:0;
  border:1.5px solid var(--line);background:#fff;color:transparent;
  transition:background .25s,border-color .25s,color .25s;
}
.lg-remember input:checked ~ .lg-check{background:var(--accent);border-color:var(--accent);color:#fff}
.lg-remember input:focus-visible ~ .lg-check{box-shadow:0 0 0 3px var(--accent-soft)}

.lg-note{
  margin-top:14px;font-size:.84rem;font-weight:600;border-radius:var(--radius);
  padding:11px 14px;border:1px solid var(--mint);color:var(--mint);background:var(--mint-soft);
}
.lg-note.warn{border-color:var(--accent);color:var(--accent-deep);background:var(--accent-soft)}
.btn .spin{
  width:15px;height:15px;border-radius:50%;display:inline-block;
  border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite;
}

.lg-or{
  display:flex;align-items:center;gap:14px;margin:26px 0 16px;
  color:var(--ink-3);font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.lg-or::before,.lg-or::after{content:"";height:1px;flex:1;background:var(--line)}

.lg-social{display:grid;gap:10px}
.lg-social .btn svg{flex-shrink:0}
.lg-social .btn:hover svg{transform:none}

.lg-signup{margin-top:28px;font-size:.88rem;color:var(--ink-3);text-align:center}
.lg-signup a{font-weight:700;color:var(--accent)}
.lg-signup a:hover{text-decoration:underline}
.lg-legal{margin-top:10px;font-size:.72rem;color:var(--ink-3);text-align:center}
.lg-legal a{font-weight:600;color:var(--ink-2)}
.lg-legal a:hover{color:var(--accent)}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .login-grid{grid-template-columns:1fr}
  .lg-media{display:none}
  .lg-form-side{height:100dvh;padding:32px 26px}
  .lg-brand{margin-bottom:28px}
}
@media (prefers-reduced-motion:reduce){
  .lgc{animation:cardIn .3s both}
  .lg-end-logo,.lg-lockup-sub{animation:none}
}
