/* =====================================================================
   Kit de estrategias UASEP · sistema visual compartido (formato UNAMente Sana)
   Cada estrategia define su acento en :root (ver php/estrategia.php).
   ===================================================================== */
@font-face{font-family:"Manrope";font-style:normal;font-display:swap;font-weight:200 800;src:url("/unamentesana/assets/fonts/manrope-latin-wght-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url("/unamentesana/assets/fonts/inter-latin-wght-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --bg:#f6f8fa;--surface:#fff;--surface-2:#f3f6f8;--surface-3:#e9eef2;--hairline:rgba(31,42,51,.08);--hairline-strong:rgba(31,42,51,.14);
  --ink:#1f2a33;--ink-2:#3f4d58;--ink-3:#5b6b77;--muted:#5e6d79;--on-accent:#fff;
  /* acento por defecto (se sobreescribe por estrategia) */
  --accent:#4f8f93;--accent-strong:#3e777b;--accent-deep:#2f5d61;--accent-soft:#e0f1ef;--accent-50:#eef7f6;--accent-ring:rgba(79,143,147,.28);
  --grad-brand:linear-gradient(135deg,var(--accent) 0%,var(--accent-strong) 100%);
  --grad-hero:linear-gradient(135deg,#e4f1f5 0%,#efeaf8 48%,#fbeee5 100%);
  --success:#3b8a5c;--success-soft:#e3f3e8;--warning:#b2731c;--warning-soft:#fbf0d8;--danger:#b84a48;--danger-soft:#f9e3e2;
  --font-display:"Manrope","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --fs-xs:.78rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:clamp(1.0625rem,1rem + .3vw,1.125rem);--fs-xl:clamp(1.25rem,1.1rem + .6vw,1.5rem);--fs-2xl:clamp(1.55rem,1.3rem + 1vw,2rem);--fs-3xl:clamp(1.95rem,1.5rem + 1.7vw,2.75rem);
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--s-12:48px;--s-14:56px;--s-16:64px;--s-20:80px;
  --gutter:clamp(16px,4vw,32px);--container:1160px;--container-narrow:760px;
  --r-xs:8px;--r-sm:12px;--r-md:16px;--r-lg:22px;--r-xl:28px;--r-2xl:36px;--r-pill:999px;
  --sh-0:0 1px 2px rgba(31,42,51,.04);--sh-1:0 1px 2px rgba(31,42,51,.04),0 10px 28px -14px rgba(31,42,51,.16);--sh-2:0 2px 4px rgba(31,42,51,.05),0 24px 56px -24px rgba(31,42,51,.26);--sh-3:0 4px 10px rgba(31,42,51,.06),0 40px 80px -30px rgba(31,42,51,.32);
  --ease:cubic-bezier(.2,.7,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);--t-fast:160ms;--t-base:240ms;--t-slow:420ms;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:light}
*,*::before,*::after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);font-size:var(--fs-md);line-height:1.65;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;min-height:100dvh}
img,svg{display:block;max-width:100%}img{height:auto}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0;padding:0}
a{color:var(--accent-strong);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.15;letter-spacing:-.015em;margin:0 0 .5em;color:var(--ink);text-wrap:balance}
h1{font-size:var(--fs-3xl);letter-spacing:-.025em}h2{font-size:var(--fs-2xl)}h3{font-size:var(--fs-xl)}h4{font-size:var(--fs-lg)}p{margin:0 0 1em}
:focus{outline:none}:focus-visible{outline:3px solid var(--accent-ring);outline-offset:2px;border-radius:var(--r-xs)}
[hidden]{display:none!important}
.skip-link{position:absolute;left:var(--s-4);top:-60px;z-index:1000;background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r-sm)}.skip-link:focus{top:var(--s-4)}
.container{width:min(100% - 2*var(--gutter),var(--container));margin-inline:auto}.container-narrow{width:min(100% - 2*var(--gutter),var(--container-narrow));margin-inline:auto}
.cluster{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}.grid{display:grid;gap:var(--s-5)}.muted{color:var(--muted)}.text-sm{font-size:var(--fs-sm)}.text-center{text-align:center}
.eyebrow{font-family:var(--font-display);font-size:var(--fs-xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-strong);margin:0 0 var(--s-2)}
.lead{font-size:var(--fs-lg);color:var(--ink-2);max-width:66ch}
.icon{display:inline-block;width:1.25em;height:1.25em;flex:none;vertical-align:-.25em}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
/* ---------- Botones ---------- */
.btn{--btn-bg:var(--surface);--btn-fg:var(--ink);--btn-bd:var(--hairline-strong);display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:46px;padding:0 1.25rem;border-radius:var(--r-pill);font-family:var(--font-display);font-weight:650;font-size:var(--fs-md);line-height:1;background:var(--btn-bg);color:var(--btn-fg);border:1px solid var(--btn-bd);box-shadow:var(--sh-0);text-decoration:none;white-space:nowrap;transition:transform var(--t-fast) var(--ease),box-shadow var(--t-base) var(--ease),background var(--t-fast);user-select:none}
.btn:hover{text-decoration:none;transform:translateY(-1px);box-shadow:var(--sh-1)}.btn:active{transform:translateY(0) scale(.985)}.btn:disabled{opacity:.55;pointer-events:none}
.btn-primary{--btn-bg:var(--accent);--btn-fg:var(--on-accent);--btn-bd:transparent;background-image:var(--grad-brand);box-shadow:0 8px 20px -10px var(--accent-strong)}.btn-primary:hover{box-shadow:0 14px 28px -12px var(--accent-strong)}
.btn-soft{--btn-bg:var(--accent-soft);--btn-fg:var(--accent-deep);--btn-bd:transparent;box-shadow:none}
.btn-ghost{--btn-bg:transparent;--btn-bd:transparent;--btn-fg:var(--ink-2);box-shadow:none}.btn-ghost:hover{background:var(--surface-2);box-shadow:none}
.btn-sm{min-height:38px;padding:0 1rem;font-size:var(--fs-sm)}.btn-lg{min-height:54px;padding:0 1.75rem;font-size:var(--fs-lg)}.btn-block{width:100%}
.btn .icon{width:1.15em;height:1.15em}
/* ---------- Tarjetas, píldoras, formularios, avisos ---------- */
.card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:var(--s-6);position:relative}
.card-pad-lg{padding:clamp(24px,4vw,40px)}.card-tinted{border:0}.tint-accent{background:var(--accent-soft);color:var(--accent-deep)}
.pill{display:inline-flex;align-items:center;gap:.4em;padding:.3em .8em;border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:650;font-family:var(--font-display);background:var(--surface-2);color:var(--ink-2);line-height:1.4}.pill-accent{background:var(--accent-soft);color:var(--accent-deep)}
.field{display:flex;flex-direction:column;gap:var(--s-2);margin-bottom:var(--s-5)}.field>label{font-family:var(--font-display);font-weight:650;font-size:var(--fs-sm);color:var(--ink-2)}
.field .hint{font-size:var(--fs-sm);color:var(--muted);margin:0}.field .error{font-size:var(--fs-sm);color:var(--danger);margin:0}
.input{width:100%;min-height:48px;padding:12px 16px;border-radius:var(--r-md);border:1px solid var(--hairline-strong);background:var(--surface);color:var(--ink);font-size:16px;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.input:hover{border-color:var(--accent)}.input:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-ring);outline:none}
.input-wrap{position:relative}.input-wrap .icon-left{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}.input-wrap .input{padding-left:44px}
.input-wrap .toggle-pw{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--muted)}.input-wrap .toggle-pw:hover{background:var(--surface-2);color:var(--ink)}
.check{display:flex;gap:var(--s-3);align-items:flex-start;cursor:pointer;font-size:var(--fs-sm);color:var(--ink-2)}.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.alert{display:flex;gap:var(--s-3);align-items:flex-start;padding:14px 16px;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-deep);font-size:var(--fs-sm);line-height:1.5;margin-bottom:var(--s-4)}
.alert-success{background:var(--success-soft);color:var(--success)}.alert-error{background:var(--danger-soft);color:var(--danger)}.alert p{margin:0}
/* ---------- Marca ---------- */
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.brand:hover{text-decoration:none}
.brand-mark{width:42px;height:42px;border-radius:13px;background:#fff;display:grid;place-items:center;box-shadow:var(--sh-1);padding:5px;overflow:hidden}.brand-mark img{width:100%;height:100%;object-fit:contain}
.brand-name{font-family:var(--font-display);font-weight:800;font-size:1.05rem;letter-spacing:-.02em;line-height:1.1}.brand-name small{display:block;margin-top:3px;font-size:var(--fs-xs);font-weight:500;color:var(--muted);line-height:1.2}
/* ---------- Topbar pública / bienvenida ---------- */
.topbar-public{position:absolute;top:var(--safe-top);left:0;right:0;z-index:5;padding:var(--s-4) 0}.topbar-public .bar{display:flex;justify-content:space-between;align-items:center;gap:var(--s-4)}.topbar-public nav{flex-wrap:nowrap;flex:none}
.hero{position:relative;overflow:hidden;background:var(--grad-hero);padding:calc(104px + var(--safe-top)) 0 var(--s-12)}
.hero::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(31,42,51,.10) 1px,transparent 1.5px);background-size:24px 24px;-webkit-mask-image:radial-gradient(ellipse 60% 60% at 70% 40%,transparent 20%,#000 90%);mask-image:radial-gradient(ellipse 60% 60% at 70% 40%,transparent 20%,#000 90%)}
.hero::after{content:"";position:absolute;inset:auto -10% -40% auto;width:60vw;max-width:720px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--accent-ring),transparent 70%);pointer-events:none}
.hero .container{position:relative;z-index:1}.hero-grid{display:grid;gap:var(--s-8);align-items:center}
.hero h1{font-size:clamp(2.2rem,1.4rem + 2.6vw,3.4rem);max-width:18ch}.hero .lead{font-size:var(--fs-lg)}
.hero-art{display:flex;flex-direction:column;align-items:center;gap:var(--s-4);position:relative}
.hero-art .stage{position:relative;display:grid;place-items:center;width:clamp(240px,34vw,340px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.96) 0%,rgba(255,255,255,.75) 45%,rgba(255,255,255,0) 72%)}
.hero-art .stage::before{content:"";position:absolute;inset:10%;border-radius:50%;border:1.5px dashed var(--accent-ring);animation:spin-slow 60s linear infinite}
.hero-art .stage img{width:62%;filter:drop-shadow(0 18px 26px rgba(31,42,51,.18));position:relative}
.hero-art .stage.square img{width:70%;border-radius:22px}
@keyframes spin-slow{to{transform:rotate(360deg)}}
.feature-list{display:grid;gap:var(--s-4);margin:var(--s-8) 0;padding:0;list-style:none}.feature-list li{display:flex;gap:var(--s-4);align-items:flex-start}
.feature-list .feature-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;flex:none;background:var(--surface);box-shadow:var(--sh-1);color:var(--accent-strong)}
.feature-list strong{display:block;font-family:var(--font-display);font-size:var(--fs-md)}.feature-list p{margin:2px 0 0;color:var(--ink-3);font-size:var(--fs-sm)}
.module-strip{padding:var(--s-14) 0}.module-strip .grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.mini-module{padding:var(--s-5);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--hairline);display:flex;gap:var(--s-3);align-items:flex-start;transition:transform var(--t-base) var(--ease),box-shadow var(--t-base)}.mini-module:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.mini-module .num{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:var(--fs-sm);flex:none;background:var(--accent-soft);color:var(--accent-deep)}
.mini-module strong{font-family:var(--font-display);font-size:var(--fs-sm);display:block;line-height:1.3}.mini-module small{color:var(--muted)}
.steps{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));counter-reset:paso}
.step{position:relative;padding:var(--s-6);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--sh-1)}
.step::before{counter-increment:paso;content:"0" counter(paso);font-family:var(--font-display);font-weight:800;font-size:2.2rem;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--accent-ring);position:absolute;right:var(--s-5);top:var(--s-4)}
.step .step-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--grad-brand);color:#fff;margin-bottom:var(--s-4);box-shadow:0 8px 18px -8px var(--accent-strong)}
.step strong{display:block;font-family:var(--font-display);font-size:var(--fs-md);margin-bottom:4px}.step p{margin:0;color:var(--ink-3);font-size:var(--fs-sm)}
.facts{display:flex;flex-wrap:wrap;gap:var(--s-3)}.fact{display:inline-flex;align-items:center;gap:.5em;padding:.55em 1em;border-radius:var(--r-pill);background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.9);font-family:var(--font-display);font-weight:650;font-size:var(--fs-sm);color:var(--ink-2);backdrop-filter:blur(8px)}.fact .icon{color:var(--accent-strong)}
.public-footer{padding:var(--s-10) 0 var(--s-12);color:var(--muted);font-size:var(--fs-sm);border-top:1px solid var(--hairline)}.public-footer .cluster{justify-content:space-between}
@media(min-width:900px){.hero-grid{grid-template-columns:1.15fr .85fr}.hero{padding:calc(120px + var(--safe-top)) 0 var(--s-20)}}
/* ---------- Pantallas de acceso ---------- */
.auth-shell{min-height:100dvh;display:grid;grid-template-columns:1fr;background:var(--grad-hero)}
.auth-side{display:none;padding:var(--s-12);position:relative;overflow:hidden}
.auth-side .blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.7}.auth-side .blob-1{width:420px;height:420px;background:var(--accent-soft);top:-120px;right:-80px}.auth-side .blob-2{width:360px;height:360px;background:#fff;bottom:-120px;left:-80px;opacity:.6}
.auth-side .side-inner{position:relative;max-width:460px;margin:auto 0}.auth-side .side-inner h2{font-size:var(--fs-3xl)}
.auth-side .side-logo{width:120px;height:120px;border-radius:32px;background:#fff;display:grid;place-items:center;padding:16px;box-shadow:var(--sh-2);margin-bottom:var(--s-8)}.auth-side .side-logo img{max-width:100%;max-height:100%;object-fit:contain}
.auth-panel{display:flex;flex-direction:column;justify-content:center;padding:calc(var(--s-8) + var(--safe-top)) var(--gutter) calc(var(--s-10) + var(--safe-bottom))}
.auth-card{width:min(100%,460px);margin:0 auto;background:var(--surface);border-radius:var(--r-2xl);padding:clamp(28px,5vw,44px);box-shadow:var(--sh-2);border:1px solid rgba(255,255,255,.7)}
.auth-card h1{font-size:var(--fs-2xl);margin-top:var(--s-5)}.auth-card .brand{margin-bottom:var(--s-2)}
.auth-foot{text-align:center;font-size:var(--fs-sm);color:var(--muted);margin-top:var(--s-6)}
@media(min-width:960px){.auth-shell{grid-template-columns:1.05fr 1fr}.auth-side{display:flex}}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--r-pill);background:var(--surface-2);margin:var(--s-5) 0}
.auth-tabs a{display:flex;align-items:center;justify-content:center;min-height:40px;border-radius:var(--r-pill);font-family:var(--font-display);font-weight:650;font-size:var(--fs-sm);color:var(--ink-3)}
.auth-tabs a[aria-current="page"]{background:#fff;color:var(--accent-deep);box-shadow:var(--sh-1)}.auth-tabs a:hover{text-decoration:none;color:var(--ink)}
.pw-meter{height:6px;border-radius:999px;background:var(--surface-3);overflow:hidden;margin-top:6px}.pw-meter>span{display:block;height:100%;width:0;background:var(--danger);transition:width var(--t-base),background var(--t-base);border-radius:inherit}
/* ---------- Entrada ---------- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity var(--t-slow) var(--ease-out),transform var(--t-slow) var(--ease-out)}.reveal.is-visible{opacity:1;transform:none}
.reveal-delay-1{transition-delay:60ms}.reveal-delay-2{transition-delay:120ms}.reveal-delay-3{transition-delay:180ms}.reveal-delay-4{transition-delay:240ms}
.no-js .reveal{opacity:1;transform:none}
