/* ============================================================
   Fe Creativa — css/style.css
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --bg:#F8F9FF;
  --azul:#2563EB;
  --azul-d:#1D4ED8;
  --tx:#0F1629;
  --tx2:#4B5280;
  --amarillo:#FCD34D;
  --rojo:#DC2626;
  --verde:#16A34A;
  --dark:#0F1629;
  --card-dark:#161E35;
  --line:#E3E7F5;
  --white:#fff;
  --r:16px;
  --r-sm:10px;
  --ease:cubic-bezier(.22,1,.36,1);
  --sh:0 2px 8px rgba(15,22,41,.06);
  --sh-lg:0 18px 44px rgba(15,22,41,.14);
  --grad:linear-gradient(135deg,#FCD34D 0%,#DC2626 52%,#2563EB 100%);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--tx);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0 0 .4em;line-height:1.2;font-weight:800;letter-spacing:-.02em}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--azul);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.sec{padding:44px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}
.sec-head h2{font-size:clamp(21px,3vw,28px);margin:0}
.sec-head p{margin:2px 0 0;color:var(--tx2);font-size:13.5px}
.sec-head a{color:var(--azul);font-weight:600;font-size:14px;white-space:nowrap}

/* ---------- botones ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:999px;border:1px solid transparent;
  font-weight:600;font-size:14px;cursor:pointer;background:none;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .2s,color .2s;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-primary{background:var(--azul);color:#fff;box-shadow:0 6px 18px rgba(37,99,235,.28)}
.btn-primary:hover{background:var(--azul-d)}
.btn-ghost{border-color:var(--line);background:var(--white);color:var(--tx)}
.btn-ghost:hover{border-color:var(--azul);color:var(--azul)}
.btn-danger{background:var(--rojo);color:#fff}
.btn-ok{background:var(--verde);color:#fff}
.btn-amber{background:var(--amarillo);color:#0F1629}
.btn-sm{padding:7px 14px;font-size:13px}
.btn-block{width:100%}

/* ---------- marca ---------- */
.brand{display:flex;align-items:center;gap:10px}
.brand-mark{
  width:38px;height:38px;flex:none;border-radius:11px;background:var(--grad);
  color:#fff;font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:1px;
  display:grid;place-items:center;box-shadow:0 4px 14px rgba(220,38,38,.28);
}
.brand-txt b{display:block;font-size:15.5px;letter-spacing:-.02em}
.brand-txt i{display:block;font-style:normal;font-size:11px;color:var(--tx2)}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(248,249,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-in{width:min(1180px,100% - 32px);margin-inline:auto;display:flex;align-items:center;gap:18px;height:66px}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:22px}
.nav-links>a{font-size:14.5px;font-weight:500;color:var(--tx2);transition:color .2s}
.nav-links>a:hover,.nav-links>a.on{color:var(--azul);font-weight:600}
.nav-auth{display:flex;align-items:center;gap:10px;margin-left:8px}
.nav-burger{display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--line);background:var(--white);border-radius:12px;cursor:pointer;flex-direction:column;gap:4px;align-items:center;justify-content:center}
.nav-burger span{width:18px;height:2px;background:var(--tx);border-radius:2px;transition:.3s var(--ease)}
.nav-burger.x span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-burger.x span:nth-child(2){opacity:0}
.nav-burger.x span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.umenu{position:relative}
.uavatar{width:38px;height:38px;border-radius:50%;border:2px solid var(--azul);background:var(--azul);color:#fff;font-weight:700;cursor:pointer;display:grid;place-items:center;overflow:hidden;padding:0}
.uavatar img{width:100%;height:100%;object-fit:cover}
.udrop{
  position:absolute;right:0;top:calc(100% + 10px);width:224px;background:var(--white);
  border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-lg);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:.28s var(--ease);
}
.udrop.open{opacity:1;visibility:visible;transform:translateY(0)}
.udrop-head{padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:6px}
.udrop-head b{display:block;font-size:14px}
.udrop-head span{font-size:12px;color:var(--tx2);word-break:break-all}
.udrop a,.udrop button{display:block;width:100%;text-align:left;padding:9px 10px;border-radius:9px;font-size:14px;border:0;background:none;cursor:pointer;color:var(--tx)}
.udrop a:hover,.udrop button:hover{background:#EEF3FF;color:var(--azul)}
.udrop button{color:var(--rojo)}

@media(max-width:900px){
  .nav-burger{display:flex}
  .nav-links{
    position:absolute;left:0;right:0;top:66px;background:var(--white);border-bottom:1px solid var(--line);
    flex-direction:column;align-items:stretch;gap:0;padding:8px 16px 16px;
    display:none;box-shadow:var(--sh-lg);
  }
  .nav-links.open{display:flex}
  .nav-links>a{padding:12px 4px;border-bottom:1px solid var(--line)}
  .nav-auth{margin:12px 0 0;flex-wrap:wrap}
}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;border-radius:0 0 28px 28px;background:var(--dark);color:#fff;min-height:min(74vh,540px)}
.hero-slides{position:relative;height:100%;min-height:inherit}
.hero-slide{
  position:absolute;inset:0;opacity:0;transition:opacity .7s var(--ease);
  display:grid;place-items:center;pointer-events:none;
}
.hero-slide.on{opacity:1;pointer-events:auto}
.hero-bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;filter:blur(18px) brightness(.35);transform:scale(1.1)}
.hero-in{position:relative;width:min(1180px,100% - 32px);display:grid;grid-template-columns:1fr 300px;gap:36px;align-items:center;padding:56px 0}
.hero-txt .eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--amarillo);font-weight:700}
.hero-txt h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(38px,7vw,72px);letter-spacing:.01em;font-weight:400;margin:.1em 0 .18em}
.hero-txt p{color:#C9D2EA;max-width:52ch;font-size:15px}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.hero-tags span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);padding:5px 12px;border-radius:999px;font-size:12.5px}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap}
.hero-cover{border-radius:18px;overflow:hidden;box-shadow:var(--sh-lg);aspect-ratio:3/4;background:#1b2440}
.hero-cover img,.hero-cover .card-emoji{width:100%;height:100%;object-fit:cover}
.hero-dots{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:3}
.hero-dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0;transition:.3s var(--ease)}
.hero-dots button.on{background:var(--amarillo);width:26px;border-radius:6px}
@media(max-width:820px){
  .hero-in{grid-template-columns:1fr;padding:40px 0 56px}
  .hero-cover{display:none}
}

/* ---------- grid + cards ---------- */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(178px,1fr))}
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s;display:block;
}
.card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg);border-color:#C9D6FB}
.card-cover{position:relative;aspect-ratio:3/4;background:#EDF1FC;overflow:hidden}
.card-img{width:100%;height:100%;object-fit:cover}
.card-emoji{display:grid;place-items:center;font-size:56px;color:#fff}
.card-body{padding:11px 13px 14px}
.card-body h3{font-size:14.5px;margin:0 0 2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-autor{margin:0 0 7px;font-size:12px;color:var(--tx2)}
.card-meta{display:flex;gap:10px;font-size:11.5px;color:var(--tx2);margin-bottom:8px;flex-wrap:wrap}
.chip{display:inline-block;background:#EEF3FF;color:var(--azul);font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px}
.tag{position:absolute;top:9px;left:9px;font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:999px;background:rgba(15,22,41,.72);color:#fff;backdrop-filter:blur(6px)}
.tag-en-emision{background:var(--verde)}
.tag-finalizado{background:var(--azul)}
.tag-pausado{background:#8892b0}
.tag-draft{background:var(--rojo);left:auto;right:9px}

/* ---------- skeleton ---------- */
.sk{background:linear-gradient(90deg,#E9EDF9 25%,#F3F6FF 50%,#E9EDF9 75%);background-size:400% 100%;animation:shine 1.4s infinite;border-radius:8px}
@keyframes shine{0%{background-position:100% 0}100%{background-position:-100% 0}}
.sk-cover{aspect-ratio:3/4;border-radius:0}
.sk-line{height:12px;margin:8px 0}
.sk-pill{width:120px;height:36px;border-radius:999px}
.w80{width:80%}.w50{width:50%}.w60{width:60%}

/* ---------- empty / guard ---------- */
.empty{text-align:center;padding:56px 20px;color:var(--tx2);grid-column:1/-1}
.empty-ico{font-size:44px;margin-bottom:8px}
.empty h3{color:var(--tx);font-size:18px;margin-bottom:4px}
.empty p{margin:0 0 14px;font-size:14px}
.guard{min-height:100vh;display:grid;place-content:center;text-align:center;gap:10px;padding:24px;background:var(--bg)}
.guard-ico{font-size:52px}

/* ---------- filtros ---------- */
.filters{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:22px;box-shadow:var(--sh)}
.filters-row{display:flex;gap:10px;flex-wrap:wrap}
.field{display:flex;flex-direction:column;gap:5px;flex:1;min-width:150px}
.field label{font-size:12px;font-weight:600;color:var(--tx2)}
.inp,select.inp,textarea.inp{
  width:100%;padding:10px 13px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--white);font-size:14px;transition:border-color .2s,box-shadow .2s;
}
.inp:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px rgba(37,99,235,.14)}
textarea.inp{resize:vertical;min-height:96px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.chip-btn{border:1px solid var(--line);background:var(--white);border-radius:999px;padding:6px 14px;font-size:13px;cursor:pointer;transition:.25s var(--ease)}
.chip-btn:hover{border-color:var(--azul);color:var(--azul)}
.chip-btn.on{background:var(--azul);border-color:var(--azul);color:#fff}

/* ---------- detalle de cómic ---------- */
.detalle{display:grid;grid-template-columns:280px 1fr;gap:32px;padding:34px 0}
.detalle-cover{border-radius:18px;overflow:hidden;box-shadow:var(--sh-lg);aspect-ratio:3/4;background:#EDF1FC}
.detalle-cover img,.detalle-cover .card-emoji{width:100%;height:100%;object-fit:cover}
.detalle h1{font-size:clamp(26px,4vw,38px)}
.detalle-meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--tx2);font-size:13.5px;margin-bottom:14px}
.detalle-acts{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.star{font-size:22px;color:#D7DEF0;background:none;border:0;padding:0 1px;cursor:default;line-height:1}
button.star{cursor:pointer;transition:transform .25s var(--ease)}
button.star:hover{transform:scale(1.18)}
.star.on{color:var(--amarillo)}
.rating-box{display:flex;align-items:center;gap:10px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:12px 16px;margin:16px 0;flex-wrap:wrap}
.caps{display:flex;flex-direction:column;gap:8px}
.cap{
  display:flex;align-items:center;gap:12px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:12px 14px;transition:.3s var(--ease);
}
.cap:hover{border-color:var(--azul);transform:translateX(4px);box-shadow:var(--sh)}
.cap-num{width:38px;height:38px;flex:none;border-radius:10px;background:#EEF3FF;color:var(--azul);font-weight:700;display:grid;place-items:center;font-size:14px}
.cap-info{flex:1;min-width:0}
.cap-info b{display:block;font-size:14.5px}
.cap-info span{font-size:12px;color:var(--tx2)}
.favon{background:#FEE2E2;border-color:#FCA5A5;color:var(--rojo)}
@media(max-width:760px){.detalle{grid-template-columns:1fr;gap:20px}.detalle-cover{width:min(230px,60%);margin-inline:auto}}

/* ---------- lector ---------- */
body.lector{background:#0B1020;color:#E8ECF8}
.lbar{position:fixed;left:0;right:0;z-index:50;background:rgba(11,16,32,.94);backdrop-filter:blur(12px);transition:transform .4s var(--ease);border-color:rgba(255,255,255,.08)}
.lbar-top{top:0;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;gap:12px;padding:11px 16px}
.lbar-bot{bottom:0;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 16px}
.lbar.hide.lbar-top{transform:translateY(-105%)}
.lbar.hide.lbar-bot{transform:translateY(105%)}
.lbar b{font-size:14px}
.lbar small{display:block;color:#9BA8C9;font-size:12px}
.lbtn{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);color:#E8ECF8;border-radius:10px;padding:8px 14px;font-size:13.5px;cursor:pointer;transition:.25s var(--ease)}
.lbtn:hover:not(:disabled){background:var(--azul);border-color:var(--azul)}
.lbtn:disabled{opacity:.4;cursor:not-allowed}
.lienzo{max-width:820px;margin:0 auto;padding:78px 0 88px}
.lienzo img{width:100%;display:block}
.lienzo.modo-pagina{display:grid;place-items:center;min-height:100vh}
.lienzo.modo-pagina img{max-height:calc(100vh - 170px);width:auto;object-fit:contain}
.ltexto{max-width:720px;margin:0 auto;padding:96px 20px 110px;font-size:17px;line-height:1.85;color:#DCE3F5;white-space:pre-wrap}
.lprog{position:fixed;top:0;left:0;height:3px;background:var(--amarillo);z-index:70;transition:width .15s linear}

/* ---------- auth ---------- */
.auth{min-height:100vh;display:grid;place-items:center;padding:32px 16px;background:
  radial-gradient(1000px 460px at 50% -10%,rgba(37,99,235,.14),transparent),var(--bg)}
.auth-card{width:min(430px,100%);background:var(--white);border:1px solid var(--line);border-radius:22px;padding:32px;box-shadow:var(--sh-lg)}
.auth-card h1{font-size:25px;text-align:center;margin-bottom:4px}
.auth-sub{text-align:center;color:var(--tx2);font-size:14px;margin-bottom:22px}
.auth-brand{display:flex;justify-content:center;margin-bottom:16px}
.form{display:flex;flex-direction:column;gap:14px}
.err{color:var(--rojo);font-size:12.5px;min-height:16px}
.divider{display:flex;align-items:center;gap:12px;color:var(--tx2);font-size:12.5px;margin:18px 0}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--line)}
.auth-foot{text-align:center;font-size:14px;color:var(--tx2);margin-top:18px}
.auth-foot a{color:var(--azul);font-weight:600}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:11px;border:1px solid var(--line);border-radius:999px;background:var(--white);font-weight:600;cursor:pointer;transition:.3s var(--ease)}
.gbtn:hover{border-color:var(--azul);transform:translateY(-2px)}

/* ---------- perfil ---------- */
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:22px;overflow-x:auto}
.tab{padding:11px 16px;border:0;background:none;font-size:14px;font-weight:600;color:var(--tx2);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.tab.on{color:var(--azul);border-bottom-color:var(--azul)}
.panel{display:none}
.panel.on{display:block}
.pf-head{display:flex;gap:20px;align-items:center;padding:28px 0;flex-wrap:wrap}
.pf-av{width:88px;height:88px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:32px;font-weight:800;overflow:hidden;flex:none}
.pf-av img{width:100%;height:100%;object-fit:cover}
.box{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--sh);margin-bottom:18px}

/* ---------- toasts ---------- */
.toast-box{position:fixed;right:16px;bottom:16px;z-index:999;display:flex;flex-direction:column;gap:9px}
.toast{
  display:flex;align-items:center;gap:9px;background:var(--dark);color:#fff;padding:12px 16px;
  border-radius:12px;font-size:14px;box-shadow:var(--sh-lg);opacity:0;transform:translateY(14px);
  transition:.32s var(--ease);max-width:330px;
}
.toast.in{opacity:1;transform:translateY(0)}
.toast-ok,.toast-success{background:var(--verde)}
.toast-error{background:var(--rojo)}
.toast-warn{background:var(--amarillo);color:#0F1629}

/* ============================================================
   ADMIN (dark)
   ============================================================ */
body.admin{background:var(--dark);color:#E8ECF8}
.adm{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.side{background:var(--card-dark);border-right:1px solid rgba(255,255,255,.07);padding:20px 14px;position:sticky;top:0;height:100vh;overflow-y:auto}
.side .brand-txt i{color:#8A96B8}
.side .brand{margin-bottom:24px}
.side nav{display:flex;flex-direction:column;gap:3px}
.side nav a{padding:11px 13px;border-radius:10px;font-size:14px;color:#AEB8D4;transition:.25s var(--ease)}
.side nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.side nav a.on{background:var(--azul);color:#fff;font-weight:600}
.side-foot{margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:6px}
.side-foot a,.side-foot button{padding:10px 13px;border-radius:10px;font-size:13.5px;color:#AEB8D4;background:none;border:0;text-align:left;cursor:pointer}
.side-foot a:hover{color:#fff}
.side-foot button{color:#F87171}
.main{padding:28px 30px 60px;min-width:0}
.main h1{font-size:25px}
.main .sub{color:#8A96B8;font-size:14px;margin-bottom:24px}
.stats{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-bottom:28px}
.stat{background:var(--card-dark);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:20px}
.stat b{display:block;font-family:'Bebas Neue',sans-serif;font-size:36px;line-height:1;color:#fff;letter-spacing:.02em}
.stat span{font-size:12.5px;color:#8A96B8;text-transform:uppercase;letter-spacing:.1em}
.stat.amber b{color:var(--amarillo)}
.stat.blue b{color:#60A5FA}
.stat.green b{color:#4ADE80}
.stat.red b{color:#F87171}
.dark-box{background:var(--card-dark);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:22px;margin-bottom:20px}
.dark-box h2{font-size:17px;margin-bottom:14px}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;padding:11px 10px;color:#8A96B8;font-size:12px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid rgba(255,255,255,.09)}
.tbl td{padding:12px 10px;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:middle}
.tbl tr:hover td{background:rgba(255,255,255,.03)}
.tbl img.mini{width:38px;height:50px;object-fit:cover;border-radius:6px}
.pill{font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;display:inline-block}
.pill-ok{background:rgba(22,163,74,.18);color:#4ADE80}
.pill-no{background:rgba(220,38,38,.18);color:#F87171}
.pill-b{background:rgba(37,99,235,.2);color:#60A5FA}
.pill-a{background:rgba(252,211,77,.2);color:var(--amarillo)}
body.admin .inp,body.admin select.inp,body.admin textarea.inp{background:#0F1629;border-color:rgba(255,255,255,.12);color:#E8ECF8}
body.admin .inp:focus{border-color:var(--azul)}
body.admin .field label{color:#8A96B8}
.modal{position:fixed;inset:0;background:rgba(6,10,22,.72);z-index:200;display:none;place-items:center;padding:20px;overflow-y:auto}
.modal.open{display:grid}
.modal-card{background:var(--card-dark);border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:26px;width:min(620px,100%);max-height:88vh;overflow-y:auto}
.modal-card h2{margin-bottom:16px;font-size:19px}
.form-grid{display:grid;gap:14px;grid-template-columns:1fr 1fr}
.form-grid .full{grid-column:1/-1}
.drop{border:2px dashed rgba(255,255,255,.18);border-radius:var(--r);padding:26px;text-align:center;cursor:pointer;transition:.3s var(--ease);color:#8A96B8}
.drop:hover,.drop.over{border-color:var(--azul);background:rgba(37,99,235,.08);color:#fff}
.prev-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));margin-top:14px}
.prev{position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}
.prev img{width:100%;height:120px;object-fit:cover}
.prev b{position:absolute;top:4px;left:4px;background:rgba(15,22,41,.8);font-size:11px;padding:2px 7px;border-radius:6px}
.prev button{position:absolute;top:4px;right:4px;background:var(--rojo);color:#fff;border:0;width:22px;height:22px;border-radius:6px;cursor:pointer;line-height:1}
.bar{height:8px;background:rgba(255,255,255,.1);border-radius:999px;overflow:hidden;margin-top:12px}
.bar i{display:block;height:100%;background:var(--grad);width:0;transition:width .3s var(--ease)}
.adm-burger{display:none}
@media(max-width:900px){
  .adm{grid-template-columns:1fr}
  .side{position:fixed;z-index:120;width:250px;left:0;top:0;transform:translateX(-100%);transition:transform .35s var(--ease)}
  .side.open{transform:none}
  .main{padding:20px 16px 60px}
  .adm-burger{display:inline-flex;margin-bottom:16px}
  .form-grid{grid-template-columns:1fr}
}

/* ---------- footer ---------- */
.foot{background:var(--dark);color:#C3CCE6;margin-top:50px}
.foot-in{width:min(1180px,100% - 32px);margin-inline:auto;display:grid;grid-template-columns:1fr 2fr;gap:32px;padding:44px 0 30px}
.foot-brand{display:flex;gap:12px;align-items:center}
.foot-brand b{color:#fff;font-size:16px}
.foot-brand p{margin:0;font-size:12.5px;color:#8A96B8}
.foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.foot-cols h4{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}
.foot-cols a{display:block;font-size:13.5px;padding:3px 0;color:#AEB8D4;transition:color .2s}
.foot-cols a:hover{color:var(--amarillo)}
.foot-bar{border-top:1px solid rgba(255,255,255,.08);padding:16px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12.5px;width:min(1180px,100% - 32px);margin-inline:auto}
@media(max-width:760px){.foot-in{grid-template-columns:1fr}.foot-cols{grid-template-columns:1fr 1fr}}