/* Nodo Andino · capa premium institucional
   Objetivo: reducir estética infantil/tosca y dar aspecto serio, sutil y corporativo. */
:root,
[data-theme='dark']{
    --primary:#162033;
    --primary-light:#26364f;
    --primary-dark:#0f1726;
    --accent:#8a6f3d;
    --accent-dark:#6d552b;
    --bg-main:#f6f4ef;
    --bg-secondary:#ebe7dd;
    --bg-card:#ffffff;
    --text-main:#151923;
    --text-muted:#596273;
    --text-light:#7d8491;
    --border:rgba(21,25,35,.14);
    --border-soft:rgba(21,25,35,.09);
    --shadow-3d:0 18px 45px rgba(21,25,35,.08);
    --shadow-md:0 18px 45px rgba(21,25,35,.08);
    --font-heading:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
    --font-body:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
    --radius:18px;
}

*{letter-spacing:normal}
body{
    background:#f6f4ef;
    background-image:none!important;
    animation:none!important;
    color:var(--text-main);
    font-family:var(--font-body);
    line-height:1.55;
}
.container{max-width:1180px;padding:0 28px}

header,header.scrolled{
    background:rgba(246,244,239,.86);
    backdrop-filter:saturate(150%) blur(16px);
    border-bottom:1px solid rgba(21,25,35,.08);
    padding:14px 0;
    box-shadow:none;
}
.logo,.logo span{
    font-family:var(--font-body);
    color:#151923;
    text-shadow:none;
    font-size:1.08rem;
    font-weight:800;
    letter-spacing:-.02em;
}
.logo span{color:#6d552b}
.brand-logo{
    display:inline-flex!important;
    align-items:center!important;
    min-width:0;
    text-decoration:none;
}
.brand-logo-img{
    display:block;
    width:clamp(178px,18vw,244px);
    height:auto;
    max-height:58px;
    object-fit:contain;
}
.nav-links{gap:1.25rem}
.nav-links a{
    color:#596273;
    font-size:.76rem;
    font-weight:650;
    text-transform:none;
    letter-spacing:.01em;
}
.nav-links a:hover{color:#151923}
.theme-switch{
    border:1px solid rgba(21,25,35,.12)!important;
    box-shadow:none!important;
    background:#fff;
    color:#596273;
}

.hero,.pei-home-hero{
    min-height:auto;
    padding:138px 0 78px;
    color:#151923;
    border-bottom:1px solid rgba(21,25,35,.08);
    background:
        radial-gradient(circle at 82% 18%,rgba(138,111,61,.12),transparent 28%),
        linear-gradient(180deg,#fbfaf7 0%,#f1eee7 100%)!important;
    overflow:hidden;
    text-align:left;
}
.rain-item{display:none!important}
.pei-hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(300px,.72fr);gap:48px;align-items:center}
.hero-tag,.pei-hero-copy .hero-tag{
    background:transparent;
    color:#8a6f3d;
    border:0;
    box-shadow:none;
    padding:0;
    margin-bottom:18px;
    font-family:var(--font-body);
    font-size:.78rem;
    font-weight:750;
    letter-spacing:.12em;
    text-transform:uppercase;
    animation:none;
}
.hero h1,.pei-hero-copy h1{
    font-family:var(--font-body);
    font-size:clamp(2.15rem,4.5vw,4.35rem);
    line-height:1.03;
    font-weight:720;
    letter-spacing:-.055em;
    color:#151923;
    text-shadow:none!important;
    animation:none!important;
    max-width:760px;
    margin-bottom:22px;
}
.hero p,.pei-hero-copy p{
    color:#596273;
    font-size:clamp(1rem,1.45vw,1.18rem);
    font-weight:450;
    line-height:1.62;
    max-width:690px;
    margin:0 0 28px;
}
.pei-hero-actions{gap:12px}
.btn-cta,.pei-home-hero .btn-cta,.pei-news-card .btn-cta{
    background:#151923!important;
    color:#fff!important;
    border:1px solid #151923!important;
    border-radius:999px!important;
    box-shadow:none!important;
    padding:12px 20px!important;
    font-family:var(--font-body)!important;
    font-size:.92rem!important;
    font-weight:650!important;
    text-transform:none!important;
    text-shadow:none!important;
    letter-spacing:0!important;
}
.btn-cta:hover,.pei-home-hero .btn-cta:hover,.pei-news-card .btn-cta:hover{background:#2a3140!important;transform:none!important;color:#fff!important}
.pei-home-hero .pei-secondary-btn{
    background:transparent!important;
    color:#151923!important;
    border-color:rgba(21,25,35,.22)!important;
}
.pei-home-hero .pei-secondary-btn:hover{background:rgba(21,25,35,.05)!important;color:#151923!important}

.pei-hero-panel{
    background:rgba(255,255,255,.72)!important;
    border:1px solid rgba(21,25,35,.10)!important;
    border-radius:22px!important;
    border-left:1px solid rgba(21,25,35,.10)!important;
    box-shadow:0 24px 70px rgba(21,25,35,.10)!important;
    padding:28px!important;
    transform:none!important;
}
.pei-status{
    background:#f0ece2!important;
    color:#6d552b!important;
    border:1px solid rgba(109,85,43,.18)!important;
    box-shadow:none!important;
    border-radius:999px!important;
    padding:6px 10px!important;
    font-size:.7rem!important;
    font-weight:750!important;
    letter-spacing:.08em!important;
}
.pei-hero-panel h2{
    color:#151923!important;
    font-family:var(--font-body)!important;
    font-size:1.35rem!important;
    line-height:1.18!important;
    font-weight:760!important;
    letter-spacing:-.03em!important;
    margin:18px 0 10px!important;
    text-shadow:none!important;
}
.pei-hero-panel p{color:#596273!important;font-size:.94rem!important;font-weight:450!important;line-height:1.55!important;margin-bottom:18px!important}
.pei-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px!important}
.pei-mini-grid span{
    background:#f8f6f1!important;
    border:1px solid rgba(21,25,35,.08)!important;
    color:#313845!important;
    border-radius:12px!important;
    font-size:.84rem!important;
    font-weight:650!important;
    padding:10px 12px!important;
}

.pei-news-strip{padding:34px 0;background:#f6f4ef!important;border-bottom:1px solid rgba(21,25,35,.08)!important}
.pei-news-card{
    background:#fff!important;
    border:1px solid rgba(21,25,35,.08)!important;
    border-radius:22px!important;
    box-shadow:0 18px 55px rgba(21,25,35,.06)!important;
    padding:28px!important;
}
.news-kicker,.top-kicker{
    background:transparent!important;
    color:#8a6f3d!important;
    border:0!important;
    box-shadow:none!important;
    padding:0!important;
    font-family:var(--font-body)!important;
    font-size:.72rem!important;
    font-weight:760!important;
    letter-spacing:.12em!important;
}
.pei-news-card h2,.section-title h2,.top-apps-heading h3{
    font-family:var(--font-body)!important;
    color:#151923!important;
    text-shadow:none!important;
    font-size:clamp(1.45rem,2.5vw,2.2rem)!important;
    line-height:1.12!important;
    font-weight:720!important;
    letter-spacing:-.04em!important;
}
.pei-news-card p,.section-title p,.top-apps-heading p{color:#596273!important;font-weight:450!important;font-size:1rem!important;line-height:1.6!important}

.access-section{padding:56px 0;background:#f6f4ef}
.access-feature-divider{
    width:auto!important;
    display:inline-block!important;
    margin:0 auto 20px!important;
    padding:8px 14px!important;
    background:#ebe7dd!important;
    color:#596273!important;
    border:1px solid rgba(21,25,35,.08)!important;
    border-radius:999px!important;
    box-shadow:none!important;
    font-size:.76rem!important;
    font-family:var(--font-body)!important;
    font-weight:650!important;
    text-transform:none!important;
    letter-spacing:.02em!important;
}
.top-apps-box{
    background:#fff!important;
    border:1px solid rgba(21,25,35,.08)!important;
    border-radius:24px!important;
    box-shadow:0 20px 60px rgba(21,25,35,.06)!important;
    padding:24px!important;
}
.top-apps-heading{margin-bottom:22px}
.top-apps-grid,.access-grid{gap:16px}
.card,.access-card,.top-card{
    background:#fff!important;
    border:1px solid rgba(21,25,35,.08)!important;
    border-radius:18px!important;
    box-shadow:0 12px 30px rgba(21,25,35,.055)!important;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease!important;
}
.card:hover,.access-card:hover,.top-card:hover{transform:translateY(-2px)!important;box-shadow:0 18px 40px rgba(21,25,35,.08)!important;border-color:rgba(21,25,35,.14)!important}
.top-card.most-used{outline:none!important;transform:none!important}
.access-card[href="pei/"],.top-card[href="pei/"]{outline:none!important}
.access-card[href="pei/"]::after,.top-card[href="pei/"]::after{
    background:#f0ece2!important;
    color:#6d552b!important;
    border:1px solid rgba(109,85,43,.18)!important;
    box-shadow:none!important;
    font-size:.62rem!important;
    font-weight:700!important;
}
.app-ribbon{
    transform:none!important;
    left:10px!important;
    top:10px!important;
    width:auto!important;
    background:rgba(255,255,255,.92)!important;
    color:#596273!important;
    border:1px solid rgba(21,25,35,.10)!important;
    border-radius:999px!important;
    box-shadow:none!important;
    font-family:var(--font-body)!important;
    font-size:.6rem!important;
    font-weight:700!important;
    padding:4px 8px!important;
}
.most-used .app-ribbon{background:#151923!important;color:#fff!important;border-color:#151923!important}
.card-img-placeholder,.access-thumb{
    border:0!important;
    border-radius:14px!important;
    margin-bottom:12px!important;
    height:96px;
    filter:saturate(.88) contrast(.96);
}
.access-card{width:190px!important;padding:10px!important;text-align:left!important;align-items:stretch!important}
.access-card h3,.top-card h3,.card h3{
    font-family:var(--font-body)!important;
    color:#151923!important;
    font-size:.95rem!important;
    line-height:1.22!important;
    font-weight:680!important;
    letter-spacing:-.02em!important;
    margin:4px 0 5px!important;
    text-shadow:none!important;
}
.access-card p,.top-card p,.card p{
    color:#687184!important;
    font-size:.76rem!important;
    line-height:1.35!important;
    font-weight:430!important;
}

#sponsor{background:#fff!important;border-top:1px solid rgba(21,25,35,.08)!important;border-bottom:1px solid rgba(21,25,35,.08)!important;padding:70px 0!important}
#sponsor .hero-tag{background:transparent!important;color:#8a6f3d!important;border:0!important;box-shadow:none!important;transform:none!important;text-shadow:none!important}
#sponsor h2{font-family:var(--font-body)!important;font-size:clamp(1.7rem,3vw,2.4rem)!important;color:#151923!important;text-shadow:none!important;font-weight:720!important;letter-spacing:-.04em!important}
footer{background:#f6f4ef;border-top:1px solid rgba(21,25,35,.08);padding:56px 0 28px}
.footer-bottom{border-top:1px solid rgba(21,25,35,.08)}

@media (max-width:880px){
    .pei-hero-grid{grid-template-columns:1fr;gap:28px}
    .pei-home-hero{text-align:left!important;padding:116px 0 54px}
    .pei-hero-actions{justify-content:flex-start!important}
    .pei-news-card{align-items:flex-start!important;text-align:left!important}
}
@media (max-width:520px){
    .container{padding:0 18px}
    .access-card{width:calc(50% - 8px)!important;padding:8px!important}
    .access-thumb{height:74px!important}
    .access-card h3,.top-card h3{font-size:.82rem!important}
    .access-card p{display:none!important}
}


/* Refinamiento premium final: más contraste, menos escala y menos lenguaje lúdico */
[data-theme='dark'] body,
[data-theme='dark']{
    --bg-main:#f6f4ef;
    --bg-secondary:#ebe7dd;
    --bg-card:#ffffff;
    --text-main:#151923;
    --text-muted:#596273;
}
[data-theme='dark'] .pei-home-hero,
[data-theme='dark'] .hero{
    color:#151923!important;
    background:
        radial-gradient(circle at 82% 18%,rgba(138,111,61,.10),transparent 28%),
        linear-gradient(180deg,#fbfaf7 0%,#f1eee7 100%)!important;
}
[data-theme='dark'] .pei-hero-copy h1,
.pei-hero-copy h1,
.hero h1{
    color:#151923!important;
    font-size:clamp(2rem,3.6vw,3.65rem)!important;
    font-weight:680!important;
    letter-spacing:-.05em!important;
    line-height:1.06!important;
    text-shadow:none!important;
}
[data-theme='dark'] .pei-hero-copy p,
.pei-hero-copy p{
    color:#4f596b!important;
    font-size:1.05rem!important;
    font-weight:430!important;
}
.pei-hero-panel{max-width:380px;justify-self:end}
.pei-news-card h2,.section-title h2,.top-apps-heading h3{
    font-size:clamp(1.3rem,2vw,1.85rem)!important;
    font-weight:680!important;
    letter-spacing:-.035em!important;
}
.section-title{margin-bottom:1.35rem!important}
.access-section{padding-top:46px!important}
.top-apps-box{padding:22px!important;margin-bottom:2rem!important}
.top-apps-heading p{max-width:620px;margin-left:auto;margin-right:auto}
.app-ribbon{
    text-transform:none!important;
    letter-spacing:0!important;
    background:rgba(246,244,239,.94)!important;
}
.card-img-placeholder.access-thumb{
    background-blend-mode:luminosity!important;
    opacity:.86;
}
.access-card,.top-card{width:184px!important}
.access-card h3,.top-card h3,.card h3{font-size:.9rem!important;font-weight:650!important}
.access-card p,.top-card p,.card p{font-size:.72rem!important;color:#727b8c!important}
.access-card[href="pei/"]::after,.top-card[href="pei/"]::after{content:'Activo'!important;text-transform:none!important}
#sponsor .card iframe{background:#f1eee7!important;border-bottom:0!important}
#sponsor .card{box-shadow:0 12px 30px rgba(21,25,35,.055)!important;border:1px solid rgba(21,25,35,.08)!important}
@media (max-width:880px){.pei-hero-panel{max-width:none;justify-self:stretch}}

.video-preview{
    display:block;
    position:relative;
    aspect-ratio:16/9;
    background-size:cover;
    background-position:center;
    text-decoration:none;
    overflow:hidden;
}
.video-preview::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,25,35,.08),rgba(21,25,35,.38))}
.video-preview span{position:absolute;left:18px;bottom:16px;background:rgba(255,255,255,.9);color:#151923;border-radius:999px;padding:8px 12px;font-size:.82rem;font-weight:650}

/* Header público: sin controles internos para mantener una presencia institucional limpia */
.nav-actions{display:none!important}


/* Contacto PEI por WhatsApp: sutil, institucional y con microanimación */
.pei-whatsapp-link{
    display:inline-flex;
    align-items:center;
    gap:9px;
    margin-top:18px;
    padding:10px 14px;
    border-radius:999px;
    text-decoration:none;
    color:#132017!important;
    background:linear-gradient(180deg,#f7fbf4,#edf6ea);
    border:1px solid rgba(37,127,67,.22);
    box-shadow:0 10px 24px rgba(21,25,35,.055);
    font-size:.88rem;
    font-weight:650;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.pei-whatsapp-link i{
    width:24px;
    height:24px;
    display:inline-grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:#1fa855;
    font-size:1rem;
    animation:peiWhatsappPulse 2.6s ease-in-out infinite;
}
.pei-whatsapp-link:hover{
    transform:translateY(-1px);
    border-color:rgba(37,127,67,.36);
    box-shadow:0 14px 32px rgba(21,25,35,.09);
}
@keyframes peiWhatsappPulse{
    0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(31,168,85,.24)}
    50%{transform:scale(1.06);box-shadow:0 0 0 7px rgba(31,168,85,0)}
}
@media (prefers-reduced-motion: reduce){.pei-whatsapp-link i{animation:none}}


/* Catálogo unificado de juegos y demos */
.juegos-hero{
    padding: 132px 0 54px;
    background:
        radial-gradient(circle at 15% 20%, rgba(168,149,106,.16), transparent 34%),
        linear-gradient(180deg,#f7f4ee 0%,#eee8dc 100%);
    border-bottom:1px solid rgba(21,25,35,.08);
}
.juegos-hero .container{max-width:920px;}
.juegos-hero h1{
    margin:.55rem 0 .7rem;
    max-width:760px;
    font-size:clamp(2rem,4vw,3.4rem);
    letter-spacing:-.055em;
    line-height:.98;
    color:#151923;
}
.juegos-hero p{max-width:760px;color:#596273;font-size:1.02rem;line-height:1.65;}
.juegos-catalog-section{padding-top:48px;}
.juegos-grid{align-items:stretch;}
.empty-state{grid-column:1/-1;text-align:center;color:#596273;background:#fff;border:1px solid rgba(21,25,35,.08);border-radius:18px;padding:24px;}
