/* Dr.Med — Giriş (design page styles, verbatim) */

.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:calc(100vh - 76px)}
.aside{position:relative;background:var(--c-cream);overflow:hidden;display:flex;flex-direction:column;
  justify-content:flex-end;padding:clamp(34px,4vw,60px)}
.aside::before{content:"";position:absolute;inset:-25% -15% auto auto;width:70%;aspect-ratio:1;
  background:radial-gradient(circle,color-mix(in srgb,var(--c-gold) 24%,transparent),transparent 66%);animation:dr 24s ease-in-out infinite alternate}
.aside::after{content:"";position:absolute;inset:auto auto -28% -18%;width:60%;aspect-ratio:1;
  background:radial-gradient(circle,color-mix(in srgb,var(--c-gold-soft) 26%,transparent),transparent 68%);animation:dr2 29s ease-in-out infinite alternate}
@keyframes dr{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-6%,6%) scale(1.16)}}
@keyframes dr2{0%{transform:translate(0,0) scale(1.12)}100%{transform:translate(7%,-6%) scale(1)}}
@media (prefers-reduced-motion:reduce){.aside::before,.aside::after{animation:none}}
.aside .in{position:relative;z-index:2;max-width:42ch}
.aside .k{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--c-gold);margin-bottom:18px}
.aside h2{font-family:var(--serif);font-weight:300;font-size:clamp(28px,3.4vw,44px);line-height:1.08;
  letter-spacing:-.015em;margin:0 0 18px}
.aside h2 em{font-style:italic;color:var(--c-gold)}
.aside p{font-family:var(--serif);font-size:17px;line-height:1.6;color:var(--c-ink-2);margin:0 0 26px}
.perks{display:flex;flex-direction:column;gap:12px;padding-top:22px;border-top:.5px solid var(--c-line)}
.perks div{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--c-ink-2)}
.perks svg{width:15px;height:15px;color:var(--c-gold);flex:0 0 auto}

.pane-wrap{display:flex;align-items:center;justify-content:center;padding:clamp(34px,4vw,60px) var(--gutter)}
.box{width:100%;max-width:420px}
.box .mk{font-family:var(--display);font-size:24px;letter-spacing:.3em;color:var(--c-ink);margin-bottom:26px}
.box .mk .dot{color:var(--c-gold)}
.tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:.5px solid var(--c-line);margin-bottom:28px}
.tabs button{background:transparent;border:0;border-bottom:1.5px solid transparent;margin-bottom:-1px;
  padding:14px 6px;cursor:pointer;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--c-mute);
  transition:.28s;min-height:48px}
.tabs button:hover{color:var(--c-ink)}
.tabs button.on{color:var(--c-ink);border-bottom-color:var(--c-gold)}

.view{display:none}
.view.on{display:block;animation:vIn .3s ease}
@keyframes vIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.view h1{font-family:var(--serif);font-weight:300;font-size:clamp(26px,3vw,34px);line-height:1.1;margin:0 0 10px;letter-spacing:-.01em}
.view .lede{font-family:var(--serif);font-size:16px;line-height:1.55;color:var(--c-mute);margin:0 0 26px}

.inline{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:4px 0 20px;font-size:12.5px;color:var(--c-mute);flex-wrap:wrap}
.inline label{display:flex;align-items:center;gap:9px;cursor:pointer;min-height:40px}
.inline input{accent-color:var(--c-gold);width:15px;height:15px}
.link{background:transparent;border:0;padding:0;cursor:pointer;color:var(--c-ink);border-bottom:.5px solid var(--c-gold);
  font-size:12.5px;transition:color .25s}
.link:hover{color:var(--c-gold)}
.view .btn{width:100%;justify-content:center;min-height:52px;margin-top:4px}
.alt{text-align:center;font-size:12.5px;color:var(--c-mute);margin-top:22px}
.alt .link{font-size:12.5px}

.or{display:flex;align-items:center;gap:14px;margin:24px 0;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--c-mute)}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--c-line)}
.social{display:grid;gap:9px}
.social button{display:flex;align-items:center;justify-content:center;gap:11px;background:transparent;
  border:.5px solid var(--c-line);cursor:pointer;min-height:48px;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--c-ink-2);transition:.26s}
.social button:hover{border-color:var(--c-gold);color:var(--c-ink);background:var(--c-cream)}
.social svg{width:16px;height:16px}

.strength{display:flex;gap:5px;margin-top:8px}
.strength i{flex:1;height:2px;background:var(--c-cream-2);transition:background .3s}
.strength i.on{background:var(--c-gold)}
.strength.weak i.on{background:#b4503f}
.strength.mid i.on{background:#9a7b3c}
.stxt{font-size:10.5px;color:var(--c-mute);margin-top:6px}

.sent{text-align:center;padding:10px 0}
.sent .crest{width:58px;height:58px;border-radius:999px;background:var(--c-gold);color:var(--c-paper);
  display:grid;place-items:center;margin:0 auto 20px}
.sent .crest svg{width:24px;height:24px}
.sent h1{font-size:26px}
.sent .lede{margin-bottom:22px}
.sent .mail{font-family:ui-monospace,monospace;font-size:14px;color:var(--c-ink);
  background:var(--c-cream);border:.5px solid var(--c-line);padding:13px 16px;margin-bottom:22px;word-break:break-all}
.sent .small{font-size:12px;line-height:1.6;color:var(--c-mute);margin-top:18px}

.bayi-note{background:var(--c-cream);border-left:2px solid var(--c-gold);padding:14px 16px;margin-bottom:20px;
  font-size:12.5px;line-height:1.65;color:var(--c-ink-2)}

@media (max-width:900px){
  .auth{grid-template-columns:1fr;min-height:0}
  .aside{order:2;min-height:300px;justify-content:center;padding:44px var(--gutter)}
  .pane-wrap{padding:44px var(--gutter) 30px}
}
@media (max-width:720px){
  .box .mk{font-size:21px;margin-bottom:20px}
  .view h1{font-size:25px}
}