/* simplecillo · identidad visual
   Tipografía: Outfit (títulos, redonda y sólida) + Figtree (texto)
   Colores: Violeta Simple #6C4DFF · Lima Chispa #C8F560 · Tinta #17142E · Nube #F5F3FF */
:root{
  --ink:#17142E;--ink2:#4B4766;--mut:#7C7898;
  --bg:#F7F6FF;--bg2:#EFECFF;--card:#FFFFFF;--line:#E4E0FA;
  --pri:#6C4DFF;--pri-d:#5536F0;--pri-l:#EAE5FF;
  --lime:#C8F560;--lime-d:#9FD12E;--sky:#7FD4FF;--pink:#FF8FD8;
  --ok:#16B67A;--warn:#FFB020;--bad:#FF5470;
  --r:22px;--r2:30px;--sh:0 1px 0 rgba(23,20,46,.04),0 12px 40px -18px rgba(54,32,170,.28);
  --ease:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.56,.64,1);
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:16px/1.6 Figtree,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4,.f{font-family:Outfit,Figtree,sans-serif;letter-spacing:-.025em;line-height:1.05;text-wrap:balance}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
a{color:inherit;text-decoration:none}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}

/* logo */
.logo{display:inline-flex;align-items:center;gap:10px;font-family:Outfit;font-weight:800;font-size:23px;letter-spacing:-.04em}
.logo svg{width:36px;height:36px;flex:none;transition:transform .6s var(--spring)}
.logo:hover svg{transform:rotate(-10deg) scale(1.08)}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:14px 26px;font-weight:700;font-family:Outfit;font-size:16px;letter-spacing:-.01em;transition:transform .35s var(--spring),box-shadow .35s,background .3s;white-space:nowrap}
.btn:active{transform:scale(.96)}
.btn-pri{background:var(--pri);color:#fff;box-shadow:0 10px 28px -10px rgba(108,77,255,.7)}
.btn-pri:hover{background:var(--pri-d);transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(108,77,255,.8)}
.btn-lime{background:var(--lime);color:var(--ink);box-shadow:0 10px 28px -12px rgba(159,209,46,.9)}
.btn-lime:hover{transform:translateY(-2px)}
.btn-ghost{background:var(--card);border:1.5px solid var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--pri);color:var(--pri)}
.btn-sm{padding:9px 16px;font-size:14px}

.pill{display:inline-flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--line);padding:7px 14px;border-radius:999px;font-size:13px;font-weight:700;color:var(--ink2)}
.pill i{width:8px;height:8px;border-radius:50%;background:var(--lime-d);box-shadow:0 0 0 0 rgba(159,209,46,.7);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(159,209,46,0)}100%{box-shadow:0 0 0 0 rgba(159,209,46,0)}}
.hl{background:linear-gradient(transparent 60%,var(--lime) 60%,var(--lime) 92%,transparent 92%);padding:0 .08em}

.card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh)}
input,textarea,select{width:100%;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:14px 16px;outline:none;transition:border-color .25s,box-shadow .25s}
input:focus,textarea:focus,select:focus{border-color:var(--pri);box-shadow:0 0 0 4px var(--pri-l)}
label{display:block;font-size:13px;font-weight:700;color:var(--ink2);margin:14px 0 7px}

/* revelar al hacer scroll */
.rv{opacity:0;transform:translateY(36px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%,220%);visibility:hidden;background:var(--ink);color:#fff;padding:13px 22px;border-radius:999px;font-weight:700;z-index:999;transition:transform .5s var(--spring);max-width:calc(100vw - 32px);text-align:center;font-size:15px}
.toast.on{transform:translate(-50%,0);visibility:visible}