@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");
:root { --ink:#111827; --muted:#667085; --line:#e8ecf1; --blue:#2563eb; --soft:#f6f8fb; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--soft); font-family:Inter,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.public-nav { height:72px; display:flex; align-items:center; justify-content:space-between; max-width:1120px; margin:auto; padding:0 24px; }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); font-size:19px; font-weight:700; text-decoration:none; }
.brand-logo { display:block; width:38px; height:38px; object-fit:contain; filter:drop-shadow(0 6px 9px rgba(37,99,235,.14)); }
.nav-actions { display:flex; align-items:center; gap:10px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; border:0; border-radius:10px; padding:0 16px; font:600 13px Inter; cursor:pointer; text-decoration:none; }
.button-primary { color:white; background:var(--blue); box-shadow:0 7px 18px rgba(37,99,235,.2); }
.button-ghost { background:white; border:1px solid var(--line); }
.legal-hero { padding:74px 24px 58px; text-align:center; background:white; border-block:1px solid var(--line); }
.eyebrow { color:var(--blue); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.legal-hero h1 { margin:15px auto 12px; font-size:clamp(36px,6vw,58px); letter-spacing:-.045em; line-height:1.04; }
.legal-hero p { max-width:650px; margin:auto; color:var(--muted); font-size:15px; line-height:1.7; }
.legal-layout { display:grid; grid-template-columns:220px minmax(0,720px); gap:56px; max-width:1040px; margin:0 auto; padding:64px 24px 100px; }
.toc { position:sticky; top:24px; align-self:start; }
.toc p { margin:0 0 14px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.toc a { display:block; padding:7px 0; color:var(--muted); font-size:12px; text-decoration:none; }
.toc a:hover { color:var(--blue); }
.legal-content { background:white; border:1px solid var(--line); border-radius:20px; padding:clamp(28px,5vw,58px); box-shadow:0 2px 8px rgba(17,24,39,.025); }
.legal-content section { scroll-margin-top:30px; }
.legal-content h2 { margin:42px 0 12px; font-size:20px; letter-spacing:-.02em; }
.legal-content section:first-child h2 { margin-top:0; }
.legal-content p,.legal-content li { color:#4b5563; font-size:14px; line-height:1.8; }
.legal-content ul { padding-left:20px; }
.notice { margin:24px 0; border-radius:12px; background:#eff6ff; padding:16px; color:#1e40af !important; }
.public-footer { border-top:1px solid var(--line); background:white; padding:26px 24px; }
.footer-inner { max-width:1120px; margin:auto; display:flex; justify-content:space-between; gap:20px; color:var(--muted); font-size:12px; }
.footer-links { display:flex; gap:18px; }
.auth-layout { min-height:100vh; display:grid; grid-template-columns:minmax(360px,520px) 1fr; background:white; }
.auth-panel { display:flex; flex-direction:column; padding:28px clamp(28px,6vw,72px); }
.auth-content { width:100%; max-width:390px; margin:auto; padding:50px 0; }
.auth-content h1 { margin:0; font-size:32px; letter-spacing:-.04em; }
.auth-content>p { margin:10px 0 30px; color:var(--muted); font-size:14px; line-height:1.6; }
.field { margin-top:17px; }
.field label { display:block; margin-bottom:7px; color:#344054; font-size:12px; font-weight:600; }
.field input { width:100%; height:46px; border:1px solid #dfe3e8; border-radius:10px; padding:0 13px; color:var(--ink); font:14px Inter; outline:none; }
.field input:focus { border-color:#60a5fa; box-shadow:0 0 0 3px rgba(59,130,246,.1); }
.auth-submit { width:100%; margin-top:22px; }
.terms-check { display:flex; align-items:flex-start; gap:9px; margin-top:18px; color:#4b5563; font-size:12px; line-height:1.6; }
.terms-check input { margin-top:3px; accent-color:var(--blue); }
.terms-check a { color:var(--blue); }
.auth-switch { margin-top:22px; color:var(--muted); font-size:12px; text-align:center; }
.auth-switch a { color:var(--blue); font-weight:600; text-decoration:none; }
.form-error { display:none; margin-top:16px; border-radius:10px; background:#fef2f2; padding:11px 12px; color:#b91c1c; font-size:12px; }
.auth-visual { position:relative; overflow:hidden; display:grid; place-items:center; margin:12px; border-radius:22px; background:linear-gradient(145deg,#eff6ff,#f8fafc 48%,#eef2ff); }
.auth-visual::before,.auth-visual::after { content:""; position:absolute; border-radius:50%; filter:blur(2px); }
.auth-visual::before { width:420px; height:420px; right:-160px; top:-130px; background:rgba(37,99,235,.12); }
.auth-visual::after { width:300px; height:300px; left:-100px; bottom:-100px; background:rgba(124,58,237,.1); }
.preview-card { position:relative; z-index:1; width:min(480px,76%); border:1px solid rgba(255,255,255,.8); border-radius:20px; background:rgba(255,255,255,.82); padding:26px; box-shadow:0 30px 80px rgba(37,99,235,.13); backdrop-filter:blur(14px); }
.preview-card h2 { margin:0; font-size:20px; letter-spacing:-.03em; }
.preview-card>p { color:var(--muted); font-size:12px; }
.preview-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:24px; }
.preview-stat { border:1px solid var(--line); border-radius:12px; background:white; padding:14px; }
.preview-stat span { color:var(--muted); font-size:9px; }
.preview-stat strong { display:block; margin-top:7px; font-size:15px; }
.preview-row { display:flex; align-items:center; gap:12px; margin-top:12px; border-radius:12px; background:white; padding:13px; }
.preview-check { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#ecfdf5; color:#059669; }
.preview-row div { flex:1; }
.preview-row p { margin:0; font-size:11px; font-weight:600; }
.preview-row small { color:var(--muted); font-size:9px; }
.preview-row strong { font-size:11px; }
@media(max-width:800px) {
  .legal-layout { display:block; padding-top:30px; }
  .toc { display:none; }
  .auth-layout { display:block; }
  .auth-visual { display:none; }
  .auth-panel { min-height:100vh; }
}
@media(max-width:540px) {
  .public-nav { padding-inline:16px; }
  .nav-actions .button-ghost { display:none; }
  .footer-inner { flex-direction:column; }
  .legal-content { border-radius:14px; }
}
