/* SesliMarka Üye Giriş/Kayıt Ortak Tasarım - Final */
*{box-sizing:border-box}
body.sm-auth-page{
    margin:0;
    min-height:100vh;
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
    color:#291a1e;
    background:#ead7d7;
    overflow-x:hidden;
}
body.sm-auth-page::before{
    content:"";
    position:fixed;
    inset:0;
    background-image:linear-gradient(90deg,rgba(255,255,255,.28),rgba(255,255,255,.08)),var(--sm-auth-bg);
    background-size:cover;
    background-position:center;
    filter:saturate(1.05);
    z-index:-3;
}
body.sm-auth-page::after{
    content:"";
    position:fixed;
    inset:0;
    background:
        radial-gradient(circle at 30% 20%,rgba(255,255,255,.52),transparent 22%),
        radial-gradient(circle at 72% 32%,rgba(255,110,170,.18),transparent 24%),
        linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,229,237,.5));
    z-index:-2;
}
.sm-auth-shell{
    min-height:100vh;
    display:grid;
    grid-template-columns:minmax(360px,1fr) minmax(420px,760px);
    align-items:center;
    gap:34px;
    padding:54px 7vw;
}
.sm-auth-visual{
    position:relative;
    min-height:620px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.sm-auth-orb{
    position:absolute;
    border-radius:999px;
    filter:blur(1px);
    opacity:.9;
}
.orb-one{
    width:280px;
    height:280px;
    left:4%;
    top:8%;
    background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(108,222,255,.26),rgba(255,187,90,.38));
    box-shadow:0 30px 90px rgba(0,0,0,.14);
}
.orb-two{
    width:180px;
    height:180px;
    right:18%;
    bottom:12%;
    background:linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,78,145,.28),rgba(99,102,241,.18));
    box-shadow:0 30px 90px rgba(0,0,0,.12);
}
.sm-brand-card{
    position:relative;
    width:min(420px,84%);
    aspect-ratio:1.04/1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    border-radius:42px;
    background:rgba(255,255,255,.44);
    border:1px solid rgba(255,255,255,.65);
    box-shadow:0 36px 90px rgba(44,24,34,.16), inset 0 1px 0 rgba(255,255,255,.72);
    backdrop-filter:blur(18px);
    transform:rotate(-7deg);
}
.sm-brand-card img{
    width:min(230px,70%);
    max-height:120px;
    object-fit:contain;
    margin-bottom:22px;
    filter:drop-shadow(0 20px 30px rgba(0,0,0,.12));
}
.sm-brand-card strong{
    font-size:clamp(28px,4vw,54px);
    letter-spacing:.04em;
    color:#2d2428;
    line-height:1;
}
.sm-brand-card span{
    display:block;
    margin-top:10px;
    color:rgba(41,26,30,.62);
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.sm-auth-copy{
    position:absolute;
    left:8%;
    bottom:8%;
    max-width:420px;
    padding:22px 24px;
    border-radius:26px;
    background:rgba(255,255,255,.30);
    border:1px solid rgba(255,255,255,.55);
    backdrop-filter:blur(14px);
}
.sm-auth-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.55);
    color:#9b405d;
    font-weight:900;
    font-size:12px;
    letter-spacing:.13em;
    text-transform:uppercase;
}
.sm-auth-copy h1{
    margin:14px 0 8px;
    font-size:clamp(30px,4vw,58px);
    line-height:.98;
    color:#2c1d24;
}
.sm-auth-copy p{
    margin:0;
    color:rgba(41,26,30,.62);
    font-weight:700;
}
.sm-auth-panel{
    width:100%;
    display:flex;
    justify-content:center;
}
.sm-auth-card{
    width:100%;
    max-width:760px;
    padding:clamp(28px,4vw,54px);
    border-radius:38px;
    background:rgba(240,215,218,.76);
    border:1px solid rgba(255,255,255,.42);
    box-shadow:0 40px 120px rgba(46,20,31,.16);
    backdrop-filter:blur(20px);
}
.sm-auth-card-login{max-width:620px}
.sm-auth-head{text-align:center;margin-bottom:24px}
.sm-auth-head>span{
    display:inline-flex;
    padding:7px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.36);
    color:#9b405d;
    font-weight:900;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.sm-auth-head h2{
    margin:14px 0 8px;
    font-size:clamp(28px,3vw,42px);
    color:#2b1d23;
    font-weight:500;
}
.sm-auth-head p{
    margin:0 auto;
    max-width:520px;
    color:rgba(43,29,35,.62);
    font-weight:700;
}
.sm-auth-form label{
    display:block;
    color:#34242a;
    font-size:13px;
    font-weight:900;
    margin-bottom:14px;
}
.sm-auth-form label span{display:block;margin:0 0 8px}
.sm-auth-form input,
.sm-auth-form select{
    width:100%;
    min-height:48px;
    border:0;
    outline:0;
    border-radius:999px;
    padding:0 19px;
    background:rgba(255,255,255,.42);
    color:#2b1d23;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);
}
.sm-auth-form input:focus,
.sm-auth-form select:focus{
    background:rgba(255,255,255,.62);
    box-shadow:0 0 0 4px rgba(172,107,126,.14), inset 0 0 0 1px rgba(128,78,94,.28);
}
.sm-auth-grid{display:grid;gap:18px}
.sm-auth-grid.two{grid-template-columns:1fr 1fr}
.sm-auth-grid.three{grid-template-columns:1fr 1fr 1fr}
.sm-pass-wrap{position:relative}
.sm-pass-wrap input{padding-right:86px}
.sm-pass-wrap button{
    position:absolute;
    top:50%;
    right:8px;
    transform:translateY(-50%);
    border:0;
    border-radius:999px;
    padding:9px 12px;
    background:rgba(55,36,45,.12);
    color:#3e2a31;
    font-weight:900;
    cursor:pointer;
}
.sm-auth-inline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin:3px 0 2px;
}
.sm-auth-inline a{
    color:#4b303a;
    font-weight:900;
    text-decoration:none;
}
.sm-check-row{
    display:flex!important;
    align-items:center;
    gap:10px;
    margin-top:8px;
}
.sm-check-row.mini{margin:0}
.sm-check-row input{
    width:18px!important;
    min-height:18px!important;
    height:18px;
    flex:0 0 18px;
}
.sm-check-row span{margin:0!important;color:#3b2730}
.sm-auth-button{
    width:100%;
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:18px;
    border:0;
    border-radius:999px;
    background:linear-gradient(135deg,#b09a9e,#8d767c);
    color:#fff;
    font-weight:900;
    text-decoration:none;
    cursor:pointer;
    box-shadow:0 18px 34px rgba(95,69,79,.20);
}
.sm-auth-button:hover{filter:brightness(.96)}
.sm-auth-links{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:24px;
    margin-top:22px;
    flex-wrap:wrap;
}
.sm-auth-links a{
    color:#4b303a;
    font-weight:900;
    text-decoration:none;
}
.sm-auth-alert{
    padding:14px 16px;
    border-radius:18px;
    margin:0 0 18px;
    font-weight:800;
    line-height:1.45;
}
.sm-auth-alert.ok{background:rgba(22,163,74,.13);color:#166534;border:1px solid rgba(22,163,74,.20)}
.sm-auth-alert.err{background:rgba(220,38,38,.11);color:#8b1d1d;border:1px solid rgba(220,38,38,.16)}
@media(max-width:1100px){
    .sm-auth-shell{grid-template-columns:1fr;padding:34px 22px}
    .sm-auth-visual{min-height:360px}
    .sm-auth-copy{display:none}
    .sm-brand-card{width:min(360px,86%)}
}
@media(max-width:680px){
    .sm-auth-shell{padding:24px 14px}
    .sm-auth-card{border-radius:28px;padding:24px 18px}
    .sm-auth-grid.two,.sm-auth-grid.three{grid-template-columns:1fr}
    .sm-auth-visual{min-height:260px}
    .sm-brand-card{border-radius:30px}
    .sm-auth-inline{justify-content:center}
}