/* ==========================================================================
   Portada de Foros 2026 — complementa foro.css
   ========================================================================== */

/* ============ BARRA FOROS 2026 ============ */
.foros-bar{background:linear-gradient(90deg,#0d4f8b 0%,#1063ab 60%,#1476c4 100%);color:#fff;}
.foros-bar__inner{
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:1rem 20px;
}
.foros-bar__title{
  font-family:var(--ff-head);font-size:1.35rem;font-weight:700;letter-spacing:.06em;
  margin-right:.6rem;
}
.foros-bar__title span{color:var(--gold-light);}

.tags-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:#fff;color:#2b3a4a;border:none;border-radius:6px;
  padding:.55rem 1.2rem;font-weight:600;font-size:.88rem;cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.16);transition:.2s;
}
.tags-btn:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(0,0,0,.24);}
.tags-btn.is-open{background:var(--gold);color:#3a2600;}
.tags-btn__icon{font-size:1rem;}

.foros-bar__search{
  display:flex;align-items:center;gap:.5rem;margin-left:auto;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);
  border-radius:50px;padding:.45rem 1.1rem;min-width:280px;
}
.foros-bar__search input{
  border:none;outline:none;background:none;width:100%;font-size:.86rem;color:#fff;
}
.foros-bar__search input::placeholder{color:rgba(255,255,255,.7);}

.foros-bar__view{display:flex;gap:.25rem;background:rgba(255,255,255,.13);border-radius:6px;padding:.2rem;}
.foros-bar__view button{
  background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;
  padding:.35rem .7rem;border-radius:4px;font-size:.78rem;letter-spacing:-2px;
}
.foros-bar__view button.is-active{background:#fff;color:var(--blue-700);}

/* -- Panel de etiquetas -- */
.tags-panel{background:#0a3f74;border-top:1px solid rgba(255,255,255,.12);}
.tags-panel[hidden]{display:none;}
.tags-panel__inner{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;padding:.9rem 20px;}
.tags-panel__label{font-size:.82rem;color:#bcd8f0;font-weight:600;}
.tags-panel__list{display:flex;gap:.5rem;flex-wrap:wrap;flex:1;}
.tag-chip{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);color:#fff;
  border-radius:50px;padding:.32rem .95rem;font-size:.78rem;font-weight:600;cursor:pointer;transition:.18s;
}
.tag-chip:hover{background:rgba(255,255,255,.24);}
.tag-chip.is-active{background:var(--gold);border-color:var(--gold);color:#3a2600;}
.tag-chip small{opacity:.7;margin-left:.3rem;font-weight:400;}
.tags-panel__clear{
  background:none;border:none;color:#9dc4e8;font-size:.8rem;cursor:pointer;text-decoration:underline;
}
.tags-panel__clear:hover{color:#fff;}

/* ============ LISTADO ============ */
.foros-main{background:var(--bg);padding:2rem 0 4rem;min-height:52vh;}
.foros-meta{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.4rem;
}
.foros-meta p{font-size:.88rem;color:var(--ink-soft);}
#forosSort{
  background:#fff;border:1px solid var(--line);border-radius:50px;
  padding:.45rem 1.1rem;font-size:.84rem;cursor:pointer;
}
.foros-empty{text-align:center;color:var(--ink-soft);padding:3rem;font-size:.95rem;}

.foros-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem;}
.foros-grid.is-list{grid-template-columns:1fr;}

/* ============ TARJETA DE FORO ============ */
.foro-card{
  display:block;background:#fff;border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;
  position:relative;border:1px solid #e6ebf0;
}
.foro-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);}
.foro-card--disabled{cursor:default;opacity:.94;}
.foro-card--disabled:hover{transform:none;box-shadow:var(--shadow-sm);}

/* -- Arte de portada -- */
.foro-card__art{
  position:relative;aspect-ratio:16/9;overflow:hidden;
  display:flex;align-items:center;justify-content:center;padding:1.8rem;
}
.foro-card__art *{position:relative;z-index:2;}

.foro-card__kicker{
  display:block;font-family:var(--ff-head);font-size:.7rem;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;margin-bottom:.5rem;
}
.foro-card__art-title{
  font-family:var(--ff-head);font-weight:800;line-height:1.08;
}

/* Arte 1 — ACADEMIA SDG (desarrollo sostenible) */
.art--sdg{background:#ffffff;color:#123f1c;flex-direction:column;text-align:center;}
.art--sdg .foro-card__kicker{color:#1f8ecb;letter-spacing:.3em;}
.art--sdg .foro-card__art-title{font-size:clamp(1.5rem,4vw,2.5rem);color:#14431f;letter-spacing:.02em;}
.art--sdg .art__sub{
  font-family:var(--ff-head);font-size:clamp(.85rem,1.7vw,1.15rem);font-weight:700;color:#1c5c2a;margin-top:.2rem;
}
.art--sdg .art__scene{
  position:absolute;left:0;right:0;bottom:0;height:52%;z-index:1;
}
.art--sdg .art__dots{
  position:absolute;left:4%;top:8%;width:34%;height:38%;z-index:0;opacity:.5;
  background-image:radial-gradient(#9fb8a6 1.1px,transparent 1.2px);
  background-size:9px 9px;
}

/* Arte 2 — UNIVERSIDAD 2030 (magenta / digital) */
.art--uni{background:#0d2a4a;padding:0;}
.art--uni .art__left{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(120deg,rgba(10,40,72,.2),rgba(6,26,48,.9)),
    repeating-linear-gradient(90deg,rgba(120,190,255,.09) 0 2px,transparent 2px 9px),
    repeating-linear-gradient(0deg,rgba(120,190,255,.07) 0 2px,transparent 2px 9px),
    radial-gradient(circle at 26% 52%,#1b5c96,#0a2440 68%);
}
.art--uni .art__figure{
  position:absolute;left:6%;bottom:0;width:44%;height:88%;z-index:2;opacity:.95;
}
.art--uni .art__panel{
  position:absolute;right:0;top:0;bottom:0;width:60%;z-index:3;
  background:linear-gradient(150deg,#8e1a6e 0%,#6d1266 100%);
  clip-path:polygon(22% 0,100% 0,100% 100%,0 100%);
  display:flex;flex-direction:column;justify-content:center;
  padding:1.6rem 1.6rem 1.6rem 3.2rem;color:#fff;
}
.art--uni .foro-card__kicker{color:var(--gold-light);letter-spacing:.14em;}
.art--uni .foro-card__art-title{font-size:clamp(.92rem,1.85vw,1.32rem);font-weight:700;line-height:1.3;}

/* Arte 3 — ACADEMIA IA */
.art--ia{
  background:radial-gradient(circle at 74% 46%,#0d5566 0%,#083240 44%,#04202a 100%);
  color:#fff;align-items:flex-end;justify-content:flex-start;
}
.art--ia .art__orb{
  position:absolute;right:-4%;top:50%;transform:translateY(-50%);
  width:62%;aspect-ratio:1;border-radius:50%;z-index:1;
  background:
    radial-gradient(circle at 42% 36%,rgba(56,214,232,.6),transparent 56%),
    radial-gradient(circle at 62% 64%,rgba(28,120,180,.55),transparent 62%),
    conic-gradient(from 210deg,rgba(56,214,232,.24),rgba(6,40,60,.05),rgba(56,214,232,.24));
  box-shadow:0 0 90px rgba(56,214,232,.4);
}
.art--ia .art__orb::after{
  content:"";position:absolute;inset:24%;border-radius:50%;
  border:2px solid rgba(56,214,232,.55);
  box-shadow:inset 0 0 40px rgba(56,214,232,.5),0 0 26px rgba(56,214,232,.35);
}
.art--ia .art__circuit{position:absolute;inset:0;z-index:1;opacity:.5;}
.art--ia .foro-card__kicker{color:#cdf0f6;}
.art--ia .foro-card__art-title{font-size:clamp(1.9rem,5.2vw,3.4rem);letter-spacing:.05em;line-height:.94;}
.art--ia .foro-card__art-title em{font-style:normal;color:var(--cyan-400);text-shadow:0 0 22px rgba(56,214,232,.65);}

/* Arte 4 — EDUCAR PARA TRANSFORMAR */
.art--educar{
  background:linear-gradient(180deg,#3f5772 0%,#243b57 55%,#16273c 100%);
  color:#fff;align-items:flex-start;justify-content:flex-start;flex-direction:column;
}
.art--educar .art__city{position:absolute;left:0;right:0;bottom:0;height:62%;z-index:1;}
.art--educar .art__haze{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(20,35,55,.15) 0%,rgba(20,35,55,.55) 62%,rgba(14,24,38,.85) 100%);
}
.art--educar .foro-card__kicker{color:#dbe6f2;letter-spacing:.22em;}
.art--educar .foro-card__art-title{font-size:clamp(1.15rem,2.9vw,2rem);font-weight:600;letter-spacing:.01em;}

/* -- Cuerpo de la tarjeta -- */
.foro-card__body{padding:1.2rem 1.4rem 1.4rem;}
.foro-card__badges{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.7rem;}
.badge{
  font-size:.7rem;font-weight:700;padding:.22rem .7rem;border-radius:50px;letter-spacing:.03em;
}
.badge--live{background:#fdecec;color:#c62828;}
.badge--live::before{content:"● ";}
.badge--soon{background:#fff5e0;color:#a5700a;}
.badge--done{background:#eef1f4;color:#5b6b7c;}
.badge--tag{background:var(--blue-050);color:var(--blue-700);font-weight:600;}

.foro-card__title{
  font-size:1.05rem;color:var(--blue-800);font-weight:700;line-height:1.35;margin-bottom:.45rem;
}
.foro-card__desc{
  font-size:.85rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.9rem;
}
.foro-card__foot{
  display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;
  padding-top:.9rem;border-top:1px solid #eef2f6;
}
.foro-card__stats{display:flex;gap:1.1rem;font-size:.78rem;color:var(--ink-soft);}
.foro-card__stats span{display:inline-flex;align-items:center;gap:.32rem;}
.foro-card__cta{
  font-family:var(--ff-head);font-size:.82rem;font-weight:700;color:var(--blue-600);
  display:inline-flex;align-items:center;gap:.35rem;
}
.foro-card:hover .foro-card__cta{gap:.6rem;}
.foro-card__cta--off{color:#9aa8b6;}

/* -- Vista de lista -- */
.foros-grid.is-list .foro-card{display:grid;grid-template-columns:320px 1fr;}
.foros-grid.is-list .foro-card__art{aspect-ratio:auto;height:100%;min-height:180px;}
.foros-grid.is-list .foro-card__body{display:flex;flex-direction:column;justify-content:center;}

/* ============ RESPONSIVE ============ */
@media (max-width:1024px){
  .foros-bar__search{min-width:220px;}
}
@media (max-width:860px){
  .foros-grid{grid-template-columns:1fr;}
  .foros-grid.is-list .foro-card{grid-template-columns:1fr;}
  .foros-grid.is-list .foro-card__art{aspect-ratio:16/9;min-height:0;}
  .foros-bar__view{display:none;}
}
@media (max-width:680px){
  .foros-bar__inner{gap:.7rem;}
  .foros-bar__title{font-size:1.1rem;width:100%;}
  .foros-bar__search{margin-left:0;min-width:100%;order:3;}
  .tags-panel__inner{gap:.5rem;}
  .art--uni .art__panel{width:70%;padding:1rem 1rem 1rem 2.2rem;}
  .foro-card__foot{flex-direction:column;align-items:flex-start;gap:.6rem;}
}