:root {
    --auth-ink: #080706;
    --auth-panel: rgba(16, 13, 11, .94);
    --auth-gold: #d6ad55;
    --auth-gold-light: #f1d488;
    --auth-red: #8f211b;
    --auth-text: #f1e9da;
    --auth-muted: #aa9f90;
    --auth-line: rgba(214, 173, 85, .28);
}

* { box-sizing: border-box; }

body.auth-page {
    min-height: 100vh;
    margin: 0;
    padding: 7.5rem max(1.25rem, 5vw) 3rem;
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(360px, 520px);
    align-items: center;
    gap: clamp(3rem, 8vw, 8rem);
    overflow-x: hidden;
    background:
        linear-gradient(90deg, rgba(5,4,3,.88), rgba(5,4,3,.42) 48%, rgba(5,4,3,.82)),
        linear-gradient(0deg, rgba(5,4,3,.9), transparent 55%),
        url('images-new/hero-steppe.webp') center / cover fixed !important;
    color: var(--auth-text);
    font-family: 'Inter', 'Segoe UI', sans-serif;
}

body.auth-page::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .12;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.24'/%3E%3C/svg%3E");
}

.auth-brand {
    position: absolute;
    z-index: 3;
    top: 1.5rem;
    left: max(1.25rem, 5vw);
    display: flex;
    align-items: center;
    gap: .8rem;
    color: var(--auth-gold-light);
    text-decoration: none;
    font-family: 'Cinzel', Georgia, serif;
    text-transform: uppercase;
}

.auth-brand img { width: 66px; height: 58px; object-fit: contain; filter: drop-shadow(0 8px 14px rgba(0,0,0,.5)); }
.auth-brand span { display: grid; line-height: 1.05; }
.auth-brand strong { font-size: 1rem; letter-spacing: .05em; }
.auth-brand small { margin-top: .3rem; color: var(--auth-gold); font-size: .56rem; letter-spacing: .1em; }

.auth-intro { position: relative; z-index: 1; max-width: 720px; }
.auth-kicker { margin: 0 0 1rem; color: var(--auth-gold); font-size: .7rem; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; }
.auth-intro h2 { margin: 0 0 1.4rem; color: var(--auth-text); font-family: 'Cinzel', Georgia, serif; font-size: clamp(2.8rem, 5.7vw, 6rem); line-height: .96; text-transform: uppercase; text-shadow: 0 8px 30px rgba(0,0,0,.68); }
.auth-intro h2 span { color: var(--auth-gold-light); }
.auth-intro>p:not(.auth-kicker) { max-width: 590px; color: #d9cfbf; font-size: 1.03rem; }
.auth-benefits { margin: 2rem 0 0; padding: 0; display: flex; gap: .7rem; flex-wrap: wrap; list-style: none; }
.auth-benefits li { padding: .55rem .75rem; border: 1px solid var(--auth-line); background: rgba(8,6,5,.56); color: #d9cebd; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

body.auth-page .giris-kutusu,
body.auth-page .kayit-kutusu,
body.auth-page .basari-kutusu {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 520px;
    margin: 0;
    padding: clamp(2rem, 4vw, 3rem);
    overflow: visible;
    border: 1px solid var(--auth-line);
    border-radius: 0;
    background: linear-gradient(145deg, rgba(24,19,16,.97), var(--auth-panel));
    box-shadow: 0 35px 90px rgba(0,0,0,.56), inset 0 1px rgba(255,255,255,.04);
}

body.auth-page .giris-kutusu::before,
body.auth-page .kayit-kutusu::before,
body.auth-page .basari-kutusu::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    height: auto;
    background: linear-gradient(var(--auth-gold-light), var(--auth-red), transparent);
}

.auth-panel-emblem { width: 86px; height: 74px; margin: -1.15rem auto .5rem; object-fit: contain; filter: drop-shadow(0 10px 18px rgba(0,0,0,.45)); }
body.auth-page .giris-baslik,
body.auth-page .kayit-baslik,
body.auth-page .basari-baslik { margin: 0 0 .6rem; color: var(--auth-gold-light); font-family: 'Cinzel', Georgia, serif; font-size: clamp(1.65rem, 4vw, 2.25rem); letter-spacing: .04em; text-align: center; text-transform: uppercase; }
.auth-panel-copy { margin: 0 0 2rem; color: var(--auth-muted); text-align: center; font-size: .88rem; }

body.auth-page .form-grup { margin-bottom: 1.15rem; }
body.auth-page .form-grup label { display: block; margin: 0 0 .45rem; color: #d9c28b; font-family: 'Cinzel', Georgia, serif; font-size: .67rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
body.auth-page .form-grup input {
    width: 100%;
    min-height: 52px;
    padding: 0 .95rem;
    border: 1px solid rgba(214,173,85,.34);
    border-radius: 0;
    outline: 0;
    background: rgba(5,4,3,.72);
    color: var(--auth-text);
    font: inherit;
    transition: border-color .2s ease, box-shadow .2s ease;
}
body.auth-page .form-grup input:focus { border-color: var(--auth-gold); box-shadow: 0 0 0 3px rgba(214,173,85,.1); }
body.auth-page .form-grup input::placeholder { color: #746c61; }
body.auth-page .uyari { display: block; margin-top: .4rem; color: #887f74; font-size: .7rem; }

body.auth-page .btn,
body.auth-page button[type='submit'] {
    width: 100%;
    min-height: 54px;
    margin-top: .7rem;
    border: 1px solid var(--auth-gold-light);
    border-radius: 0;
    background: linear-gradient(135deg, #efd083, #ad741f) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.32), 0 12px 28px rgba(139,87,15,.18);
    color: #160e06 !important;
    cursor: pointer;
    font-family: 'Cinzel', Georgia, serif;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    transition: transform .2s ease, box-shadow .2s ease;
}
body.auth-page .btn:hover,
body.auth-page button[type='submit']:hover { transform: translateY(-2px); box-shadow: inset 0 1px rgba(255,255,255,.32), 0 17px 34px rgba(139,87,15,.27); }

body.auth-page .error,
body.auth-page .success { margin-bottom: 1.3rem; padding: .85rem 1rem; border: 1px solid rgba(205,69,61,.4); border-left: 3px solid #d3544d; background: rgba(92,19,16,.28); color: #ffd4cf; font-size: .82rem; }
body.auth-page .success { border-color: rgba(98,180,109,.4); border-left-color: #72c77d; background: rgba(24,74,31,.28); color: #d8ffe0; }
body.auth-page .ekstra-linkler,
body.auth-page .giris-link { margin-top: 1.5rem; display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; color: var(--auth-muted); font-size: .82rem; }
body.auth-page .ekstra-linkler a,
body.auth-page .giris-link a,
.auth-home-link { color: var(--auth-gold-light); text-decoration: none; }
body.auth-page .ekstra-linkler a:hover,
body.auth-page .giris-link a:hover,
.auth-home-link:hover { text-decoration: underline; text-underline-offset: .3rem; }
.auth-divider { width: 100%; height: 1px; margin: 1.4rem 0 1rem; background: linear-gradient(90deg,transparent,var(--auth-line),transparent); }
.auth-home { text-align: center; font-size: .76rem; }

@media (max-width: 900px) {
    body.auth-page { grid-template-columns: 1fr; justify-items: center; padding-top: 7rem; background-position: 64% center !important; }
    body.auth-page::after { content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: rgba(4,3,3,.52); }
    .auth-intro { display: none; }
    .auth-brand { left: 50%; transform: translateX(-50%); width: max-content; }
}

@media (max-width: 520px) {
    body.auth-page { padding: 6.5rem 1rem 2rem; }
    .auth-brand img { width: 54px; height: 48px; }
    .auth-brand strong { font-size: .83rem; }
    .auth-brand small { font-size: .49rem; }
    body.auth-page .giris-kutusu,
    body.auth-page .kayit-kutusu,
    body.auth-page .basari-kutusu {
        width: calc(100vw - 2rem) !important;
        min-width: 0;
        padding: 1.7rem 1.25rem;
    }
    body.auth-page form,
    body.auth-page .form-grup,
    body.auth-page .form-grup input { min-width: 0; max-width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
