/* =========================================================
   KASA — shared stylesheet for the auth pages
   (login, forgot password, reset password)
========================================================= */

:root { --cream:#f9f5ee; --ink:#1c1914; --gold:#c8a84b; --sage:#4a7a54; --rust:#b85535; --muted:#746b5e; --border:rgba(28,25,20,.12); --surface:#fff; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:var(--cream); font-family:'DM Sans',sans-serif; }
.page { min-height:100vh; display:grid; grid-template-columns:minmax(360px,.95fr) minmax(460px,1.05fr); }
.brand-panel { position:relative; overflow:hidden; padding:46px clamp(34px,6vw,86px); background:var(--ink); color:var(--cream); display:flex; flex-direction:column; justify-content:space-between; }
.brand-panel::after { content:''; position:absolute; width:560px; height:560px; left:-170px; bottom:-250px; border-radius:50%; border:1px solid rgba(200,168,75,.18); box-shadow:0 0 0 80px rgba(200,168,75,.035),0 0 0 160px rgba(200,168,75,.025); }
.logo { position:relative; z-index:1; color:var(--cream); font-family:Fraunces,serif; font-size:27px; font-weight:800; letter-spacing:.08em; text-decoration:none; }
.logo span { color:var(--gold); }
.brand-copy { position:relative; z-index:1; max-width:470px; margin:76px 0; }
.eyebrow { color:var(--gold); font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:20px 0; max-width:540px; font:800 clamp(42px,5vw,68px)/.98 Fraunces,serif; letter-spacing:-.04em; }
h1 em { color:var(--gold); font-weight:400; }
.brand-copy p { max-width:420px; color:#b8ae9e; font-size:17px; line-height:1.7; }
.product-list { position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 26px; max-width:480px; padding:0; margin:0; list-style:none; color:#d8d0c2; font-size:14px; }
.product-list li::before { content:'—'; color:var(--gold); margin-right:9px; }
.login-panel { display:flex; align-items:center; justify-content:center; padding:46px 32px; background:var(--surface); }
.login-card { width:min(100%,430px); }
.back-link { display:inline-flex; align-items:center; gap:8px; margin-bottom:52px; color:var(--muted); font-size:14px; text-decoration:none; }
.back-link:hover { color:var(--ink); }
h2 { margin:0 0 10px; font:800 40px/1 Fraunces,serif; letter-spacing:-.035em; }
.intro { margin:0 0 38px; color:var(--muted); font-size:15px; line-height:1.6; }
form { display:grid; gap:20px; }
label { display:block; margin-bottom:8px; color:#463f34; font-size:13px; font-weight:600; }
.field { position:relative; }
input { width:100%; padding:14px 15px; border:1.5px solid var(--border); border-radius:8px; background:#fff; color:var(--ink); outline:none; font:15px 'DM Sans',sans-serif; transition:border-color .2s,box-shadow .2s; }
input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(200,168,75,.13); }
input[aria-invalid="true"] { border-color:var(--rust); }
.toggle-password { position:absolute; right:8px; bottom:7px; border:0; background:transparent; color:var(--muted); cursor:pointer; padding:7px 8px; font:600 12px 'DM Sans',sans-serif; }
.password-hint { margin:10px 0 0; color:var(--muted); font-size:12px; line-height:1.55; }
.requirements { display:flex; flex-wrap:wrap; gap:7px 14px; margin:10px 0 0; padding:0; list-style:none; color:var(--muted); font-size:12px; }
.requirements li::before { content:'○'; margin-right:5px; color:#a39989; }
.requirements li.met { color:var(--sage); }
.requirements li.met::before { content:'✓'; color:var(--sage); }
.form-message { min-height:21px; margin:0; color:var(--rust); font-size:13px; line-height:1.5; }
.form-message.success { color:var(--sage); }
.submit { width:100%; border:0; border-radius:8px; padding:15px 20px; cursor:pointer; color:var(--cream); background:var(--ink); font:600 15px 'DM Sans',sans-serif; transition:background .2s,transform .2s; }
.submit:hover { background:#332f27; transform:translateY(-1px); }
.submit:disabled { cursor:wait; opacity:.72; transform:none; }
.support { margin:30px 0 0; color:var(--muted); font-size:13px; line-height:1.6; text-align:center; }
.support a { color:var(--ink); font-weight:600; }
.security-note { display:flex; gap:10px; align-items:flex-start; margin-top:32px; padding-top:24px; border-top:1px solid var(--border); color:var(--muted); font-size:12px; line-height:1.55; }
.security-mark { width:20px; height:20px; flex:0 0 auto; border:1px solid rgba(74,122,84,.4); border-radius:50%; color:var(--sage); display:grid; place-items:center; font-size:11px; }
@media (max-width:800px) { .page { grid-template-columns:1fr; } .brand-panel { min-height:355px; padding:32px; } .brand-copy { margin:50px 0; } .product-list { display:none; } .login-panel { padding:44px 26px; } .back-link { margin-bottom:35px; } }