/* ============================================================
   Portal Lic. Zeta — sistema visual (claro/oscuro)
   Basado en el diseño aprobado de Claude Design.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Inter:wght@400;450;500;600;700&display=swap');

:root{
  --brand-blue:#37429D; --brand-dark:#1F255E;
  --radius:14px; --radius-sm:9px; --radius-lg:20px;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
.theme-light{
  --bg:#F5F0E8; --surface:#FFFDF9; --surface-2:#F3ECDF; --inset:#FBF7F0;
  --text:#2B2B2B; --text-strong:#1F255E; --muted:#5E5F72; --faint:#8C8D9C;
  --accent:#37429D; --accent-weak:#E7E5F2; --on-accent:#FFFDF9;
  --border:#E2D8C8; --line:rgba(31,37,94,.10);
  --ok:#2E7D5B; --ok-weak:#DDEBE2;
  --shadow-sm:0 1px 3px rgba(31,37,94,.06);
  --shadow-md:0 4px 16px rgba(31,37,94,.08);
  --shadow-lg:0 18px 50px rgba(31,37,94,.16);
  color-scheme:light;
}
.theme-dark{
  --bg:#121539; --surface:#1C2150; --surface-2:#232A63; --inset:#181C44;
  --text:#ECEAF6; --text-strong:#FFFFFF; --muted:#A6AAD0; --faint:#767BA6;
  --accent:#8E99F0; --accent-weak:#262C66; --on-accent:#10133A;
  --border:rgba(255,255,255,.10); --line:rgba(255,255,255,.09);
  --ok:#5FCB97; --ok-weak:#1C3A30;
  --shadow-sm:0 1px 2px rgba(0,0,0,.3);
  --shadow-md:0 6px 22px rgba(0,0,0,.34);
  --shadow-lg:0 22px 60px rgba(0,0,0,.5);
  color-scheme:dark;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:var(--sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;}
.serif{font-family:var(--serif);}
.h-display{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;color:var(--text-strong);line-height:1.12;}
.h-title{font-family:var(--serif);font-weight:600;color:var(--text-strong);}
.muted{color:var(--muted);} .faint{color:var(--faint);}
.eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--accent);}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:none;cursor:pointer;
  font-family:inherit;font-size:14.5px;font-weight:550;padding:12px 20px;border-radius:var(--radius-sm);
  transition:transform .15s var(--ease),background .2s,border-color .2s;text-decoration:none;}
.btn:active{transform:scale(.985);}
.btn-primary{background:var(--accent);color:var(--on-accent);}
.btn-primary:hover{filter:brightness(1.06);}
.btn-block{width:100%;}
.btn-lg{padding:14px 22px;font-size:15px;}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border);}
.btn-ghost:hover{border-color:var(--accent);}
.btn-soft{background:var(--accent-weak);color:var(--accent);}

/* inputs */
.field{display:flex;flex-direction:column;gap:7px;}
.field label{font-size:12px;font-weight:600;color:var(--muted);}
.input{width:100%;padding:13px 15px;border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--inset);color:var(--text);font-family:inherit;font-size:15px;outline:none;transition:border-color .2s,background .2s;}
.input:focus{border-color:var(--accent);background:var(--surface);}

/* cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.divider{border:none;border-top:1px solid var(--border);}

/* theme toggle */
.theme-toggle{width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:var(--surface);
  color:var(--text);display:grid;place-items:center;cursor:pointer;transition:border-color .2s;}
.theme-toggle:hover{border-color:var(--accent);}

@keyframes pop{from{opacity:0;transform:scale(.96);}to{opacity:1;transform:none;}}
.screen-in{animation:pop .4s var(--ease) both;}