:root{
    --portal-bg:#060b17;
    --portal-bg-2:#0d1430;
    --portal-card:rgba(8,14,33,.78);
    --portal-card-2:rgba(9,16,38,.92);
    --portal-border:rgba(125,142,255,.14);
    --portal-soft:rgba(255,255,255,.06);
    --portal-text:#edf2ff;
    --portal-muted:#9baad3;
    --portal-violet:#af67ff;
    --portal-blue:#35bfff;
    --portal-green:#46f083;
    --portal-gold:#ffd84a;
}

.portal-body{
    background:
        linear-gradient(180deg, rgba(4,8,20,.75) 0%, rgba(4,8,20,.78) 100%),
        url("img/testfon.webp?v=2") center top / cover fixed no-repeat;
    color:var(--portal-text);
}

.portal-home{
    position:relative;
    padding:20px 0 70px;
}

.portal-home::before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    background:
        radial-gradient(circle at 20% 15%, rgba(107,74,255,.18), transparent 24%),
        radial-gradient(circle at 80% 18%, rgba(0,170,255,.14), transparent 20%),
        radial-gradient(circle at 50% 65%, rgba(255,170,0,.08), transparent 28%);
    z-index:0;
}

.portal-home > *{
    position:relative;
    z-index:1;
}

.portal-shell,
.portal-card,
.portal-alert__inner{
    border:1px solid var(--portal-border);
    background:linear-gradient(180deg, rgba(15,24,54,.82) 0%, rgba(7,12,28,.88) 100%);
    box-shadow:0 20px 50px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.02);
    backdrop-filter:blur(12px);
}

.portal-alert{
    padding:10px 0 22px;
}

.portal-alert__inner{
    min-height:58px;
    border-radius:18px;
    display:flex;
    align-items:center;
    gap:16px;
    padding:10px 18px;
    overflow:hidden;
    background:
        linear-gradient(90deg, rgba(93,53,190,.18) 0%, rgba(23,34,77,.92) 24%, rgba(14,21,45,.92) 100%),
        url("img/posts/5.jpg") center / cover no-repeat;
}
.portal-alert__icon{
    width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
    background:linear-gradient(180deg,#ffcc57,#ff8a00);color:#101319;font-weight:900;font-size:18px;
    box-shadow:0 10px 20px rgba(255,166,0,.22);
}
.portal-alert__text{flex:1;font-size:20px;font-weight:700;color:#fff;line-height:1.1;}
.portal-alert__text strong{color:#ffd976;letter-spacing:.05em;}
.portal-alert__link{color:#c8d8ff;font-weight:700;text-decoration:none;white-space:nowrap;}
.portal-alert__link:hover{color:#fff;}

.portal-hero{padding:0 0 42px;}
.portal-hero__shell{
    min-height:540px;
    border-radius:34px;
    padding:64px 56px;
    display:grid;
    grid-template-columns:minmax(0,1.2fr) 380px;
    gap:34px;
    align-items:center;
    background:
        linear-gradient(90deg, rgba(8,14,34,.25) 0%, rgba(8,14,34,.72) 32%, rgba(8,14,34,.9) 100%),
        url("img/ffe.webp") center / cover no-repeat;
}
.portal-eyebrow{
    display:inline-flex;align-items:center;gap:10px;
    padding:8px 14px;border-radius:999px;background:rgba(176,95,255,.08);border:1px solid rgba(176,95,255,.18);
    color:#d48cff;font-size:14px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin-bottom:22px;
}
.portal-hero__title{margin:0 0 20px;font-size:78px;line-height:.94;font-weight:800;color:#fff;max-width:650px;}
.portal-hero__text{margin:0;max-width:590px;font-size:28px;line-height:1.28;color:#dfe6ff;}
.portal-hero__actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:34px;}

.portal-btn{
    min-width:230px;height:58px;padding:0 28px;border-radius:18px;display:inline-flex;align-items:center;justify-content:center;
    text-decoration:none;text-transform:uppercase;font-weight:900;letter-spacing:.07em;font-size:16px;transition:.25s ease;
}
.portal-btn--primary{
    color:#fff;background:linear-gradient(180deg, rgba(66,32,129,.92), rgba(32,23,76,.95));
    border:1px solid rgba(205,116,255,.34);box-shadow:0 16px 34px rgba(0,0,0,.24), 0 0 24px rgba(185,92,255,.12);
}
.portal-btn--secondary{
    color:#e8f7ff;background:linear-gradient(180deg, rgba(12,62,112,.85), rgba(8,37,70,.92));
    border:1px solid rgba(50,191,255,.34);box-shadow:0 16px 34px rgba(0,0,0,.24), 0 0 22px rgba(43,190,255,.12);
}
.portal-btn:hover{transform:translateY(-3px);color:#fff;}

.portal-status{
    position:relative;padding:24px;border-radius:28px;
    border:1px solid rgba(118,142,255,.16);
    background:linear-gradient(180deg, rgba(8,14,34,.92) 0%, rgba(6,11,27,.96) 100%);
    box-shadow:0 22px 44px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.02);
}
.portal-status__badge{
    position:absolute;top:-13px;right:22px;padding:8px 16px;border-radius:14px;text-transform:uppercase;font-weight:900;font-size:12px;letter-spacing:.08em;
    color:#fff;background:linear-gradient(180deg,#49f176,#0f8e42);box-shadow:0 8px 20px rgba(73,241,118,.28);
}
.portal-status__total{
    padding:24px 16px 18px;border-radius:22px;text-align:center;margin-bottom:18px;
    border:1px solid rgba(255,214,53,.14);background:linear-gradient(180deg, rgba(4,8,19,.96), rgba(8,12,24,.96));
}
.portal-status__number{font-size:76px;line-height:.92;font-weight:900;color:#fff200;text-shadow:0 0 18px rgba(255,242,0,.25);}
.portal-status__label{margin-top:6px;color:#dbe3ff;font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;}
.portal-serverlist{display:grid;gap:12px;}
.portal-server{padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);}
.portal-server__top{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:16px;font-weight:800;}
.portal-server__top span{color:#ffe15c;text-transform:uppercase;letter-spacing:.03em;}
.portal-server__top strong{color:#ffdb61;}
.portal-server__bar{height:12px;border-radius:999px;border:1px solid rgba(255,255,255,.06);overflow:hidden;}
.portal-server__bar span{display:block;height:100%;border-radius:999px;box-shadow:0 0 14px rgba(118,255,0,.22);}

.portal-main{padding-top:10px;}
.portal-main__grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:26px;align-items:start;}
.portal-sectionhead{margin-bottom:18px;}
.portal-sectionhead h2,.portal-sectionhead h3{margin:0;color:#fff;font-size:56px;font-weight:800;line-height:1.02;}
.portal-sectionhead--sm h3{font-size:32px;}
.portal-kicker{display:inline-block;margin-bottom:8px;color:#c97dff;font-size:15px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.portal-news__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.portal-card{border-radius:24px;padding:22px;}
.portal-news__card{padding:0;overflow:hidden;}
.portal-news__card--wide{grid-column:span 1;}
.portal-news__thumb{display:block;height:235px;overflow:hidden;}
.portal-news__thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.portal-news__card:hover .portal-news__thumb img{transform:scale(1.05);}
.portal-news__body{padding:20px 22px 22px;}
.portal-chip{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(77,134,255,.1);border:1px solid rgba(77,134,255,.16);color:#dce7ff;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px;}
.portal-news__body h3{margin:0 0 12px;font-size:36px;line-height:1.05;color:#fff;font-weight:800;}
.portal-news__body p{margin:0;color:#c7d2f5;font-size:22px;line-height:1.32;}
.portal-textlink,.portal-morelink{display:inline-flex;align-items:center;gap:8px;margin-top:16px;color:#dbe9ff;text-decoration:none;font-weight:800;}
.portal-textlink:hover,.portal-morelink:hover{color:#fff;}
.portal-drops-card h3{font-size:30px;}
.portal-feed{list-style:none;padding:0;margin:0;display:grid;gap:12px;}
.portal-feed li{display:flex;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:16px;}
.portal-feed li:last-child{border-bottom:0;padding-bottom:0;}
.portal-feed span{color:#dce7ff;font-weight:700;}
.portal-feed strong{color:#fff;font-weight:800;text-align:right;}

.portal-sidebar{display:grid;gap:22px;}
.portal-ranking__list{display:grid;gap:12px;}
.portal-ranking__item{display:grid;grid-template-columns:54px 52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.05);}
.portal-ranking__pos{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(180deg,#7d58ff,#5c43e6);color:#fff;font-weight:900;font-size:18px;}
.portal-ranking__avatar{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(180deg, rgba(44,77,151,.9), rgba(16,30,74,.9));color:#dfe8ff;font-weight:900;font-size:18px;border:1px solid rgba(255,255,255,.08);}
.portal-ranking__item strong{display:block;color:#fff;font-size:22px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.portal-ranking__item small{display:block;color:#9aa8d2;font-size:16px;margin-top:2px;}
.portal-ranking__score{color:#ffd953;font-size:26px;font-weight:900;}
.portal-timetable{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.portal-timetable li{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.05);font-size:20px;}
.portal-timetable span{color:#e8efff;font-weight:700;}
.portal-timetable strong{color:#fff;font-weight:900;}

.portal-lower{padding-top:24px;}
.portal-lower__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
.portal-mini h3{margin:0 0 18px;color:#fff;font-size:34px;font-weight:800;}
.portal-mini__feature{display:grid;grid-template-columns:130px minmax(0,1fr);gap:16px;align-items:center;}
.portal-mini__feature img{width:130px;height:92px;object-fit:cover;border-radius:18px;display:block;}
.portal-mini__feature strong{display:block;color:#fff;font-size:24px;line-height:1.05;}
.portal-mini__feature p{margin:8px 0 0;color:#c4cff2;font-size:18px;line-height:1.3;}
.portal-timetable--compact li,.portal-feed--compact li{font-size:18px;padding:12px 0;border-radius:0;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.06);}
.portal-timetable--compact li:last-child,.portal-feed--compact li:last-child{border-bottom:0;padding-bottom:0;}

.portal-footer{margin-top:46px;background:linear-gradient(180deg, rgba(7,12,28,.92), rgba(5,9,21,.96));border-top:1px solid rgba(123,92,255,.12);}
.portal-footer .footer__logo img{max-width:220px;}
.portal-footer .footer__title{color:#fff;}
.portal-footer .footer__nav a,.portal-footer .footer__tagline,.portal-footer .footer__copyright{color:#aab7de;}
.portal-footer .footer__nav a:hover{color:#fff;}

@media (max-width: 1399px){
    .portal-hero__title{font-size:64px;}
    .portal-hero__text{font-size:24px;}
    .portal-status__number{font-size:64px;}
    .portal-status__label{font-size:18px;}
    .portal-sectionhead h2{font-size:46px;}
    .portal-news__body h3{font-size:29px;}
    .portal-news__body p{font-size:18px;}
}

@media (max-width: 1199px){
    .portal-hero__shell{grid-template-columns:1fr; padding:46px 34px;}
    .portal-main__grid{grid-template-columns:1fr;}
    .portal-sidebar{grid-template-columns:repeat(2,minmax(0,1fr));}
    .portal-lower__grid{grid-template-columns:1fr;}
}

@media (max-width: 991px){
    .portal-alert__text{font-size:16px;}
    .portal-alert__inner{padding:10px 14px;gap:12px;}
    .portal-hero__title{font-size:48px;}
    .portal-hero__text{font-size:20px;}
    .portal-btn{min-width:190px;height:52px;}
    .portal-status__number{font-size:52px;}
    .portal-status__label{font-size:16px;}
    .portal-sectionhead h2{font-size:40px;}
    .portal-sectionhead--sm h3,.portal-mini h3{font-size:28px;}
    .portal-news__grid,.portal-sidebar{grid-template-columns:1fr;}
    .portal-news__card--wide{grid-column:auto;}
}

@media (max-width: 767px){
    .portal-home{padding-top:10px;}
    .portal-alert__inner{flex-wrap:wrap;}
    .portal-alert__link{width:100%;}
    .portal-hero__shell{padding:28px 18px;border-radius:24px;gap:22px;}
    .portal-eyebrow{font-size:11px;padding:7px 11px;}
    .portal-hero__title{font-size:34px;line-height:1.02;}
    .portal-hero__text{font-size:17px;}
    .portal-hero__actions{margin-top:24px;gap:12px;}
    .portal-btn{width:100%;min-width:100%;height:50px;border-radius:14px;font-size:14px;}
    .portal-status{padding:18px;border-radius:22px;}
    .portal-status__badge{right:16px;top:-12px;padding:7px 12px;font-size:10px;}
    .portal-status__number{font-size:40px;}
    .portal-server__top{font-size:13px;}
    .portal-main__grid{gap:18px;}
    .portal-card{padding:18px;border-radius:20px;}
    .portal-news__thumb{height:180px;}
    .portal-news__body{padding:16px 16px 18px;}
    .portal-news__body h3{font-size:24px;}
    .portal-news__body p{font-size:16px;}
    .portal-sectionhead h2{font-size:32px;}
    .portal-sectionhead--sm h3,.portal-mini h3{font-size:24px;}
    .portal-ranking__item{grid-template-columns:46px 46px minmax(0,1fr) auto;padding:12px;}
    .portal-ranking__pos,.portal-ranking__avatar{width:46px;height:46px;border-radius:14px;}
    .portal-ranking__item strong{font-size:18px;}
    .portal-ranking__item small,.portal-timetable li{font-size:14px;}
    .portal-ranking__score{font-size:18px;}
    .portal-mini__feature{grid-template-columns:1fr;}
    .portal-mini__feature img{width:100%;height:160px;}
}
/* =========================================================
   PORTAL COMPACTO REAL - basado en tu HTML actual
========================================================= */

/* ancho general */
.portal-home .container {
    max-width: 1140px;
}

/* separación general */
.portal-alert,
.portal-hero,
.portal-main,
.portal-lower {
    margin-bottom: 24px;
}

/* =========================
   HEADER
========================= */
.header__content {
    min-height: 74px !important;
}

.header__logo img {
    max-height: 40px !important;
    width: auto !important;
}

.header__nav {
    gap: 6px !important;
}

.header__nav > li > a,
.header__nav > li > .dropdown-link {
    height: 40px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
    letter-spacing: .05em !important;
}

.header__cta {
    height: 42px !important;
    padding: 0 16px !important;
    border-radius: 14px !important;
    font-size: 11px !important;
}

.header__cta span {
    font-size: 11px !important;
}

/* =========================
   ALERTA SUPERIOR
========================= */
.portal-alert__inner {
    min-height: 52px !important;
    padding: 10px 16px !important;
    border-radius: 16px !important;
}

.portal-alert__icon {
    width: 30px !important;
    height: 30px !important;
    font-size: 14px !important;
    margin-right: 12px !important;
}

.portal-alert__text {
    font-size: 13px !important;
    line-height: 1.3 !important;
}

.portal-alert__text strong {
    font-size: 13px !important;
}

.portal-alert__link {
    font-size: 12px !important;
}

/* =========================
   HERO
========================= */
.portal-hero__shell {
    min-height: 440px !important;
    padding: 34px 34px !important;
    border-radius: 26px !important;
}

.portal-hero__content {
    max-width: 450px !important;
    padding-top: 6px !important;
}

.portal-eyebrow {
    font-size: 11px !important;
    line-height: 1 !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    margin-bottom: 16px !important;
}

.portal-hero__title {
    margin: 0 0 14px !important;
    font-size: 26px !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    max-width: 420px !important;
    letter-spacing: -.02em !important;
}

.portal-hero__title br {
    display: none !important;
}

.portal-hero__text {
    font-size: 13px !important;
    line-height: 1.5 !important;
    max-width: 430px !important;
    margin-bottom: 18px !important;
}

.portal-hero__actions {
    gap: 10px !important;
}

.portal-btn {
    min-width: 165px !important;
    height: 42px !important;
    padding: 0 18px !important;
    border-radius: 13px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
}

/* =========================
   STATUS / SERVER BOX
========================= */
.portal-status {
    width: 300px !important;
    padding: 14px !important;
    border-radius: 18px !important;
}

.portal-status__badge {
    top: -14px !important;
    right: 18px !important;
    font-size: 11px !important;
    padding: 7px 14px !important;
    border-radius: 999px !important;
}

.portal-status__total {
    padding: 16px 12px !important;
    border-radius: 14px !important;
    margin-bottom: 12px !important;
}

.portal-status__number {
    font-size: 26px !important;
    line-height: 1 !important;
    margin-bottom: 4px !important;
}

.portal-status__label {
    font-size: 11px !important;
    line-height: 1.2 !important;
}

.portal-serverlist {
    gap: 8px !important;
}

.portal-server {
    padding: 10px 11px !important;
    border-radius: 12px !important;
}

.portal-server__top {
    margin-bottom: 6px !important;
}

.portal-server__top span,
.portal-server__top strong {
    font-size: 11px !important;
    line-height: 1.25 !important;
}

.portal-server__bar {
    height: 7px !important;
    border-radius: 999px !important;
}

/* =========================
   GRID PRINCIPAL
========================= */
.portal-main__grid {
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 20px !important;
}

/* =========================
   TITULOS DE SECCIÓN
========================= */
.portal-sectionhead {
    margin-bottom: 14px !important;
}

.portal-sectionhead h2 {
    font-size: 24px !important;
    line-height: 1.08 !important;
    margin: 0 !important;
    font-weight: 800 !important;
}

.portal-sectionhead h3 {
    font-size: 18px !important;
    line-height: 1.12 !important;
    margin: 0 !important;
    font-weight: 800 !important;
}

.portal-kicker {
    font-size: 11px !important;
    letter-spacing: .08em !important;
    margin-bottom: 6px !important;
}

/* =========================
   NEWS GRID
========================= */
.portal-news__grid {
    gap: 18px !important;
}

.portal-card {
    border-radius: 18px !important;
}

.portal-news__thumb img {
    height: 185px !important;
    object-fit: cover !important;
}

.portal-news__body {
    padding: 14px !important;
}

.portal-chip {
    font-size: 11px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    margin-bottom: 10px !important;
}

.portal-news__body h3 {
    font-size: 17px !important;
    line-height: 1.18 !important;
    margin-bottom: 8px !important;
    font-weight: 800 !important;
}

.portal-news__body p {
    font-size: 12px !important;
    line-height: 1.5 !important;
    margin-bottom: 12px !important;
}

.portal-textlink {
    font-size: 12px !important;
    font-weight: 700 !important;
}

/* drops dentro del grid */
.portal-drops-card {
    padding: 16px !important;
}

.portal-feed {
    gap: 8px !important;
}

.portal-feed li {
    padding: 8px 0 !important;
    font-size: 12px !important;
}

.portal-feed li span,
.portal-feed li strong {
    font-size: 12px !important;
}

/* =========================
   SIDEBAR
========================= */
.portal-sidebar {
    gap: 18px !important;
}

.portal-ranking,
.portal-events {
    padding: 16px !important;
    border-radius: 18px !important;
}

/* ranking */
.portal-ranking__list {
    gap: 10px !important;
}

.portal-ranking__item {
    grid-template-columns: 34px 42px minmax(0, 1fr) auto !important;
    gap: 10px !important;
    padding: 10px !important;
    border-radius: 12px !important;
}

.portal-ranking__pos {
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
}

.portal-ranking__avatar {
    width: 42px !important;
    height: 42px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
}

.portal-ranking__item strong {
    font-size: 13px !important;
    line-height: 1.2 !important;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.portal-ranking__item small {
    font-size: 11px !important;
    line-height: 1.35 !important;
    display: block;
}

.portal-ranking__score {
    font-size: 13px !important;
    font-weight: 800 !important;
}

.portal-morelink {
    font-size: 12px !important;
    margin-top: 12px !important;
    display: inline-block;
}

/* eventos */
.portal-timetable {
    gap: 8px !important;
}

.portal-timetable li {
    padding: 8px 0 !important;
    font-size: 12px !important;
}

.portal-timetable li span,
.portal-timetable li strong {
    font-size: 12px !important;
}

/* =========================
   BLOQUES INFERIORES
========================= */
.portal-lower__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.portal-mini {
    padding: 16px !important;
    border-radius: 18px !important;
}

.portal-mini h3 {
    font-size: 18px !important;
    margin-bottom: 12px !important;
}

.portal-mini__feature {
    gap: 12px !important;
}

.portal-mini__feature img {
    width: 120px !important;
    height: 84px !important;
    border-radius: 12px !important;
    object-fit: cover !important;
}

.portal-mini__feature strong {
    font-size: 13px !important;
    display: block;
    margin-bottom: 6px !important;
}

.portal-mini__feature p {
    font-size: 12px !important;
    line-height: 1.45 !important;
    margin-bottom: 8px !important;
}

/* =========================
   FOOTER
========================= */
.portal-footer {
    padding-top: 26px !important;
    padding-bottom: 26px !important;
}

.footer__logo img {
    max-height: 42px !important;
}

.footer__tagline,
.footer__copyright,
.footer__nav a,
.footer__title {
    font-size: 12px !important;
}

.footer__title {
    margin-bottom: 10px !important;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 991px) {
    .portal-hero__shell {
        min-height: auto !important;
        padding: 24px !important;
    }

    .portal-hero__title {
        font-size: 23px !important;
        max-width: 100% !important;
    }

    .portal-hero__content {
        max-width: 100% !important;
    }

    .portal-main__grid,
    .portal-lower__grid {
        grid-template-columns: 1fr !important;
    }

    .portal-status {
        width: 100% !important;
        margin-top: 18px !important;
    }
}

@media (max-width: 767px) {
    .portal-alert__inner {
        padding: 10px 12px !important;
    }

    .portal-alert__text {
        font-size: 12px !important;
    }

    .portal-hero__title {
        font-size: 21px !important;
    }

    .portal-hero__text {
        font-size: 12px !important;
    }

    .portal-btn {
        width: 100% !important;
        min-width: 100% !important;
    }

    .portal-hero__actions {
        flex-direction: column !important;
    }

    .portal-sectionhead h2 {
        font-size: 20px !important;
    }

    .portal-news__thumb img {
        height: 160px !important;
    }
}
.portal-market-card{
    position: relative;
    border-radius: 20px;
    padding: 16px;
    background: linear-gradient(180deg, rgba(7,16,40,.94) 0%, rgba(5,11,28,.98) 100%);
    border: 1px solid rgba(92,114,255,.14);
    box-shadow:
        0 14px 30px rgba(0,0,0,.35),
        inset 0 0 0 1px rgba(255,255,255,.02);
    overflow: hidden;
}

.portal-market-card::before{
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at top left, rgba(124,77,255,.12), transparent 34%),
        radial-gradient(circle at bottom right, rgba(0,163,255,.10), transparent 34%);
    pointer-events: none;
}

.portal-market-card .portal-sectionhead{
    position: relative;
    z-index: 2;
    margin-bottom: 12px;
}

.portal-market-card .portal-sectionhead h3{
    margin: 0;
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: .2px;
}

/* contenedor visible */
.portal-market-marquee{
    position: relative;
    height: 340px;
    overflow: hidden;
    z-index: 2;
    mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
}

/* lista animada */
.portal-market-feed{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    animation: marketScrollUp 18s linear infinite;
}

/* pausa al pasar mouse por todo el modulo */
.portal-market-marquee:hover .portal-market-feed{
    animation-play-state: paused;
}

/* item */
.portal-market-item{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(12,21,48,.92) 0%, rgba(8,14,34,.96) 100%);
    border: 1px solid rgba(120,145,255,.10);
    box-shadow:
        0 6px 14px rgba(0,0,0,.18),
        inset 0 0 0 1px rgba(255,255,255,.015);
    transition: .2s ease;
    min-height: 58px;
}

.portal-market-item:hover{
    border-color: rgba(131,154,255,.22);
    box-shadow:
        0 8px 16px rgba(0,0,0,.24),
        0 0 12px rgba(71,104,255,.10);
}

/* icono */
.portal-market-thumb{
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(24,35,72,.95) 0%, rgba(13,21,45,.98) 100%);
    border: 1px solid rgba(116,140,255,.10);
    overflow: hidden;
}

.portal-market-thumb img{
    max-width: 24px;
    max-height: 24px;
    object-fit: contain;
    display: block;
}

/* texto */
.portal-market-meta{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.portal-market-name{
    font-size: .88rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.portal-market-name.normal{
    color: #dce5ff;
}

.portal-market-name.excellent{
    color: #67ff7a;
    text-shadow: 0 0 8px rgba(103,255,122,.14);
}

.portal-market-name.socket{
    color: #84cfff;
    text-shadow: 0 0 8px rgba(132,207,255,.14);
}

.portal-market-sub{
    font-size: .75rem;
    color: rgba(215,225,255,.64);
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.portal-market-sub span{
    color: #9fd8ff;
    font-weight: 700;
}

/* botón */
.portal-market-action{
    width: 34px;
    height: 34px;
    border-radius: 10px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: .9rem;
    color: #fff;
    background: linear-gradient(180deg, #4668ff 0%, #2941b8 100%);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow:
        0 6px 14px rgba(37,63,198,.28),
        inset 0 1px 0 rgba(255,255,255,.12);
    transition: .2s ease;
}

.portal-market-action:hover{
    transform: scale(1.06);
    color: #fff;
}

/* animación */
@keyframes marketScrollUp {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(calc(-50% - 5px));
    }
}
.portal-boss-card{
    padding: 0;
    overflow: hidden;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(8,14,34,.95) 0%, rgba(5,10,24,.98) 100%);
    border: 1px solid rgba(95,120,255,.14);
    box-shadow:
        0 16px 40px rgba(0,0,0,.35),
        inset 0 0 0 1px rgba(255,255,255,.02);
}

.boss-slider{
    position: relative;
    height: 350px;
    overflow: hidden;
    border-radius: 24px;
    isolation: isolate;
}

.boss-slide{
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.08);
    transition:
        opacity .9s ease,
        transform 5.5s ease,
        visibility .9s ease;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.boss-slide.active{
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    z-index: 2;
}

.boss-slide::before{
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(4,7,16,.88) 0%, rgba(6,12,28,.60) 42%, rgba(8,16,38,.18) 100%);
    z-index: 1;
}

.boss-slide__fx{
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        radial-gradient(circle at 18% 30%, rgba(255,210,90,.18), transparent 22%),
        radial-gradient(circle at 78% 20%, rgba(77,127,255,.15), transparent 24%),
        linear-gradient(135deg, rgba(255,255,255,.05) 0%, transparent 40%);
    mix-blend-mode: screen;
    pointer-events: none;
}

.boss-slider__overlay{
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.04),
        inset 0 -80px 120px rgba(0,0,0,.25);
}

.boss-slide__content{
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 22px;
    z-index: 4;
    max-width: 62%;
}

.boss-slide__badge{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    margin-bottom: 10px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #ffe37e;
    background: linear-gradient(180deg, rgba(255,192,72,.18) 0%, rgba(255,160,40,.10) 100%);
    border: 1px solid rgba(255,211,106,.25);
    box-shadow: 0 0 20px rgba(255,196,72,.10);
}

.boss-slide__meta{
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8fd7ff;
    margin-bottom: 6px;
    text-shadow: 0 0 16px rgba(90,180,255,.15);
}

.boss-slide__title{
    margin: 0 0 8px;
    font-size: 1.55rem;
    line-height: 1.05;
    font-weight: 900;
    color: #fff;
    text-shadow:
        0 2px 12px rgba(0,0,0,.45),
        0 0 18px rgba(255,255,255,.06);
}

.boss-slide__time{
    margin: 0;
    font-size: .92rem;
    font-weight: 600;
    color: rgba(223,232,255,.78);
    text-shadow: 0 2px 10px rgba(0,0,0,.38);
}

.boss-slider__dots{
    position: absolute;
    right: 20px;
    bottom: 18px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
}

.boss-dot{
    width: 10px;
    height: 10px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    background: rgba(255,255,255,.25);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);
    transition: all .25s ease;
}

.boss-dot.active{
    width: 24px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ffd76a 0%, #7ccfff 100%);
    box-shadow:
        0 0 16px rgba(124,207,255,.20),
        0 0 18px rgba(255,215,106,.18);
}

.boss-slider:hover .boss-slide.active{
    transform: scale(1.02);
}

@media (max-width: 768px){
    .boss-slider{
        height: 200px;
    }

    .boss-slide__content{
        max-width: 78%;
        left: 18px;
        right: 18px;
        bottom: 18px;
    }

    .boss-slide__title{
        font-size: 1.2rem;
    }

    .boss-slide__meta{
        font-size: .78rem;
    }

    .boss-slide__time{
        font-size: .82rem;
    }

    .boss-slider__dots{
        right: 14px;
        bottom: 14px;
    }
}

@media (max-width: 520px){
    .boss-slider{
        height: 180px;
    }

    .boss-slide__content{
        max-width: 88%;
    }

    .boss-slide__title{
        font-size: 1rem;
    }

    .boss-slide__badge{
        font-size: .64rem;
        padding: 6px 10px;
    }
}
.portal-ribbon{
    position:relative;
    display:flex;
    align-items:center;
    gap:10px;

    margin-bottom:16px;
    padding:10px 18px;

    border-radius:14px;

    background:
        linear-gradient(90deg,
        rgba(34,193,195,.25) 0%,
        rgba(45,120,255,.25) 40%,
        rgba(0,0,0,.0) 100%);

    border:1px solid rgba(80,180,255,.25);

    box-shadow:
        0 0 12px rgba(0,150,255,.15),
        inset 0 0 8px rgba(255,255,255,.05);
}

.portal-ribbon::after{
    content:"";
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    width:80px;

    background:linear-gradient(
        to right,
        transparent,
        rgba(0,180,255,.25)
    );
}

.portal-ribbon-title{
    font-weight:700;
    font-size:18px;
    letter-spacing:.5px;
    color:#dff3ff;
}

.portal-ribbon-icon{
    font-size:18px;
    opacity:.9;
}
.portal-social-card{
    position: relative;
    padding: 18px 18px 20px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(5,16,48,.96) 0%, rgba(3,10,34,.98) 100%);
    border: 1px solid rgba(92,133,255,.18);
    box-shadow:
        0 10px 30px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.04),
        0 0 18px rgba(60,120,255,.08);
    overflow: hidden;
}

.portal-social-card::before{
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at top left, rgba(80,140,255,.14), transparent 35%),
        radial-gradient(circle at bottom right, rgba(0,220,255,.08), transparent 30%);
    pointer-events: none;
}

.portal-social-head{
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.portal-social-head h3{
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #ffffff;
    letter-spacing: .2px;
}

.portal-social-badge{
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
    color: #8fd3ff;
    background: rgba(60,120,255,.12);
    border: 1px solid rgba(100,160,255,.18);
}

.portal-social-text{
    position: relative;
    z-index: 1;
    margin: 0 0 16px;
    font-size: 13px;
    line-height: 1.5;
    color: rgba(220,235,255,.78);
}

.portal-social-grid{
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.portal-social-item{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    border-radius: 16px;
    text-decoration: none;
    background: linear-gradient(180deg, rgba(10,24,70,.82) 0%, rgba(7,18,52,.92) 100%);
    border: 1px solid rgba(95,135,255,.14);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
    transition: all .25s ease;
}

.portal-social-item:hover{
    transform: translateY(-2px);
    border-color: rgba(130,180,255,.35);
    box-shadow:
        0 8px 18px rgba(0,0,0,.28),
        0 0 14px rgba(80,140,255,.14);
}

.portal-social-icon{
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

.portal-social-info{
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.portal-social-info strong{
    font-size: 16px;
    font-weight: 800;
    color: #fff;
}

.portal-social-info span{
    font-size: 12px;
    color: rgba(215,228,255,.72);
}

/* Colores por red */
.portal-social-item.discord .portal-social-icon{
    background: linear-gradient(135deg, #5865F2 0%, #7983ff 100%);
    box-shadow: 0 0 18px rgba(88,101,242,.30);
}

.portal-social-item.facebook .portal-social-icon{
    background: linear-gradient(135deg, #1877F2 0%, #46a0ff 100%);
    box-shadow: 0 0 18px rgba(24,119,242,.28);
}

.portal-social-item.instagram .portal-social-icon{
    background: linear-gradient(135deg, #fd5949 0%, #d6249f 45%, #285AEB 100%);
    box-shadow: 0 0 18px rgba(214,36,159,.22);
}

/* Responsive */
@media (max-width: 575px){
    .portal-social-card{
        padding: 16px;
        border-radius: 18px;
    }

    .portal-social-item{
        padding: 12px;
        gap: 12px;
    }

    .portal-social-icon{
        width: 46px;
        height: 46px;
        min-width: 46px;
        font-size: 21px;
    }

    .portal-social-info strong{
        font-size: 15px;
    }
}
.portal-social-icon svg{
width:26px;
height:26px;
fill:white;
filter:drop-shadow(0 0 6px rgba(80,160,255,.6));
}
.portal-serverinfo{
    padding: 18px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(5,16,48,.96) 0%, rgba(3,10,34,.98) 100%);
    border: 1px solid rgba(92,133,255,.16);
    box-shadow:
        0 10px 30px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.04),
        0 0 18px rgba(60,120,255,.06);
}

.portal-serverinfo-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}

.portal-serverinfo-head h3{
    margin:0;
    font-size:20px;
    font-weight:800;
    color:#fff;
    letter-spacing:.2px;
}

.portal-serverinfo-badge{
    padding:5px 10px;
    border-radius:999px;
    font-size:10px;
    font-weight:800;
    letter-spacing:1px;
    color:#9ad3ff;
    background:rgba(80,160,255,.12);
    border:1px solid rgba(80,160,255,.22);
}

.portal-serverinfo-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.portal-serverinfo-list li{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:11px 12px;
    border-radius:14px;
    background:rgba(255,255,255,.02);
    border:1px solid rgba(255,255,255,.04);
    transition:all .25s ease;
}

.portal-serverinfo-list li:hover{
    background:rgba(80,140,255,.05);
    border-color:rgba(100,160,255,.12);
}

.portal-info-label{
    display:flex;
    align-items:center;
    gap:10px;
    color:#c9d6f2;
    font-size:14px;
    font-weight:600;
}

.portal-info-label i{
    width:34px;
    height:34px;
    min-width:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    font-size:18px;
    color:#9fd8ff;
    background:linear-gradient(180deg, rgba(22,44,103,.95) 0%, rgba(14,28,72,.95) 100%);
    border:1px solid rgba(97,154,255,.18);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 0 10px rgba(40,120,255,.08);
}

.portal-info-value{
    font-size:14px;
    font-weight:800;
    color:#ffffff;
    text-align:right;
    white-space:nowrap;
}

.portal-info-value.status-on{
    color:#57f0a5;
    text-shadow:0 0 8px rgba(87,240,165,.25);
}

.portal-morelink{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:16px;
    color:#9ed7ff;
    font-size:13px;
    font-weight:700;
    text-decoration:none;
    transition:all .25s ease;
}

.portal-morelink:hover{
    color:#ffffff;
    transform:translateX(3px);
}

.portal-morelink::after{
    content:"→";
    font-size:14px;
}

@media (max-width: 575px){
    .portal-serverinfo{
        padding:14px;
        border-radius:18px;
    }

    .portal-serverinfo-head h3{
        font-size:18px;
    }

    .portal-serverinfo-list li{
        padding:10px;
    }

    .portal-info-label{
        font-size:13px;
        gap:8px;
    }

    .portal-info-label i{
        width:30px;
        height:30px;
        min-width:30px;
        font-size:16px;
        border-radius:9px;
    }

    .portal-info-value{
        font-size:13px;
    }
}
.portal-server__bar{
    width:100%;
    height:10px;
    background:#1a2430;
    border-radius:6px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
}

.portal-server__bar span{
    display:flex;
    width:100%;
    height:100%;
    gap:2px;
    padding:1px;
}

.segment{
    flex:1;
    background:#2b3645;
    border-radius:2px;
}

/* segmentos llenos */
.segment.filled.green{background:#3bd671;}
.segment.filled.yellow{background:#f5d742;}
.segment.filled.orange{background:#ff9c3a;}
.segment.filled.red{background:#ff4d4d;}