/* Puerta de entrada a Pukkart RWA · mismo lenguaje que los paneles (.fp) */
:root{--ath-ink:#12141B;--ath-ink2:#3F4553;--ath-muted:#697080;--ath-hair:#D9DCE4;
  --ath-accent:#002FA7;--ath-wash:#E8EDFB;--ath-surface:#fff;--ath-bg:#F4F6F9}
html,body{height:100%}
body.ath{/* tokens de .fp para que los botones y campos funcionen fuera del panel */
  --ink:#12141B;--ink-2:#3F4553;--muted:#697080;--hair:#D9DCE4;--surface:#fff;--raise:#FAFBFC;
  --accent:#002FA7;--accent-soft:#C3CEF0;--accent-wash:#E8EDFB;--ok:#1D7447;--ok-soft:#DDF1E6;
  margin:0;background:var(--ath-bg);color:var(--ath-ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  display:flex;flex-direction:column;min-height:100vh}
.ath-demo{background:#FFF3CD;color:#664D03;border-bottom:1px solid #FFE69C;
  font-size:13px;line-height:1.4;text-align:center;padding:7px 14px}
.ath-wrap{display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch}

/* ---------- lado de marca ---------- */
.ath-brand{background:var(--ath-ink);color:#fff;padding:46px clamp(28px,4vw,64px) 52px;
  display:flex;flex-direction:column;justify-content:center;gap:18px}
.ath-brand img{height:34px;width:auto;align-self:flex-start}
.ath-brand .eyebrow{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;color:#9AA3B5;margin:14px 0 0}
.ath-brand h1{margin:0;font-size:clamp(28px,3.4vw,42px);line-height:1.08;letter-spacing:-.01em;font-weight:800;max-width:15ch}
.ath-lead{margin:0;color:#C9CFDB;font-size:15.5px;line-height:1.6;max-width:56ch}
.ath-pts{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;max-width:56ch}
.ath-pts li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;font-size:14px;line-height:1.5;color:#C9CFDB}
.ath-pts svg{width:19px;height:19px;color:#8FA6E8;margin-top:1px}
.ath-pts b{display:block;color:#fff;font-weight:700;margin-bottom:1px}
.ath-atlas{align-self:flex-start;margin-top:8px;color:#fff;text-decoration:none;font-weight:600;font-size:14px;
  border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:9px 16px}
.ath-atlas:hover{border-color:#fff;background:rgba(255,255,255,.08)}

/* ---------- lado del formulario ---------- */
.ath-form{display:flex;align-items:center;justify-content:center;padding:44px 22px}
.ath-card{width:100%;max-width:412px;background:var(--ath-surface);border:1px solid var(--ath-hair);
  border-radius:20px;padding:30px 28px;box-shadow:0 18px 44px rgba(18,20,27,.07)}
.ath-card h2{margin:2px 0 4px;font-size:25px;font-weight:800;letter-spacing:-.01em}
.ath-sub{margin:0 0 20px;color:var(--ath-muted);font-size:14px}
.ath-card .fp-f{margin-bottom:14px}
.ath-card .fp-f input{padding:11px 12px;border-radius:11px;font-size:15px}
.ath-card .fp-f input:focus{outline:none;border-color:var(--ath-accent);box-shadow:0 0 0 3px var(--ath-wash)}
.ath-pw{position:relative}
.ath-pw button{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:none;
  color:var(--ath-muted);cursor:pointer;padding:6px;line-height:0;border-radius:8px}
.ath-pw button svg{width:19px;height:19px;display:block}
.ath-pw button .eye.off,.ath-pw button.on .eye{display:none}
.ath-pw button.on .eye.off{display:block}
.ath-pw button:hover{color:var(--ath-accent);background:var(--ath-wash)}
.ath-pw input{padding-right:42px!important}
.ath-go{width:100%;justify-content:center;padding:12px 18px;font-size:15px;margin-top:4px}
.ath-msg{border-radius:12px;padding:10px 13px;font-size:13.5px;line-height:1.45;margin-bottom:14px}
.ath-msg.danger{background:#F8E1DE;color:#A3261B}
.ath-msg.warning{background:#F7EBD2;color:#8A5E0B}
.ath-msg.info,.ath-msg.success{background:#DDF1E6;color:#1D7447}
.ath-note{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--ath-hair);
  font-size:13px;line-height:1.55;color:var(--ath-muted)}
.ath-note b{color:var(--ath-ink2)}
.ath-seed{margin:12px 0 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;
  color:var(--ath-muted);background:var(--ath-bg);border-radius:10px;padding:9px 11px}

/* ---------- landing: cómo funciona ---------- */
.ath-how{background:var(--ath-surface);border-top:1px solid var(--ath-hair);padding:46px clamp(18px,4vw,44px)}
.ath-how .in,.ath-who .in{max-width:1180px;margin:0 auto}
.ath-how .eyebrow{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ath-muted);margin:0 0 8px}
.ath-how h2{margin:0 0 26px;font-size:clamp(21px,2.4vw,28px);font-weight:800;letter-spacing:-.01em}
.ath-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.ath-steps li{border-top:2px solid var(--ath-wash);padding-top:14px}
.ath-steps .n{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700;color:var(--ath-accent)}
.ath-steps b{display:block;margin:6px 0 5px;font-size:15.5px}
.ath-steps p{margin:0;color:var(--ath-ink2);font-size:14px;line-height:1.55}

/* ---------- landing: a quién sirve ---------- */
.ath-who{padding:40px clamp(18px,4vw,44px) 46px}
.ath-who .in{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;align-items:start}
.ath-who .w{background:var(--ath-surface);border:1px solid var(--ath-hair);border-radius:16px;padding:18px}
.ath-who .eyebrow{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ath-accent);margin:0 0 7px}
.ath-who p{margin:0;color:var(--ath-ink2);font-size:14px;line-height:1.55}
.ath-who .fp-btn2{align-self:center;justify-self:start}

/* ---------- pie ---------- */
.ath-foot{background:var(--ath-surface);border-top:1px solid var(--ath-hair);padding:20px clamp(18px,4vw,44px)}
.ath-foot .in{max-width:1180px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;justify-content:space-between}
.ath-foot nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.ath-foot a{color:var(--ath-ink2);text-decoration:none;font-size:13px}
.ath-foot a:hover{color:var(--ath-accent);text-decoration:underline}
.ath-foot .c{color:var(--ath-muted);font-size:12.5px}
.ath-foot .legal{max-width:1180px;margin:12px auto 0;color:var(--ath-muted);font-size:12px;line-height:1.55}

@media (max-width:900px){
  .ath-wrap{grid-template-columns:minmax(0,1fr)}
  .ath-form{order:-1}                     /* en el móvil, primero entrar */
  .ath-brand{padding:32px 22px;gap:14px}
  .ath-brand h1{max-width:none}
  .ath-pts{gap:11px}
  .ath-form{padding:28px 18px}
  .ath-foot .in{flex-direction:column;align-items:flex-start}
}

/* ---------- páginas legales ---------- */
.lg{max-width:820px;margin:0 auto;padding:34px 22px 60px}
.lg h1{font-size:clamp(26px,3.4vw,36px);font-weight:800;letter-spacing:-.01em;margin:6px 0 10px}
.lg h2{font-size:17px;margin:28px 0 8px}
.lg p,.lg li{color:var(--ath-ink2);font-size:15px;line-height:1.65}
.lg ul{padding-left:20px}
.lg .draft{background:#F7EBD2;color:#8A5E0B;border-radius:12px;padding:11px 14px;font-size:13.5px;line-height:1.5;margin:0 0 22px}
.lg .back{display:inline-block;margin-bottom:6px;color:var(--ath-muted);text-decoration:none;font-size:13.5px;font-weight:600}
.lg .back:hover{color:var(--ath-accent)}
.lg dl{margin:0}
.lg dt{font-weight:700;font-size:14px;margin-top:12px}
.lg dd{margin:2px 0 0;color:var(--ath-ink2);font-size:14.5px}