:root {
    --geip-night: #071226;
    --geip-night-2: #0A1837;
    --geip-cyan: #05D9FF;
    --geip-blue: #2F6BFF;
    --geip-violet: #8B5CF6;
    --geip-white: #FFFFFF;
}

.geip-intro {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: grid;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 46%, rgba(47, 107, 255, .22), transparent 34%),
        radial-gradient(circle at 28% 22%, rgba(5, 217, 255, .12), transparent 30%),
        radial-gradient(circle at 76% 78%, rgba(139, 92, 246, .16), transparent 31%),
        linear-gradient(145deg, var(--geip-night) 0%, var(--geip-night-2) 54%, #081228 100%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .42s ease, visibility .42s ease;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.geip-intro.geip-is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.geip-intro.geip-is-leaving {
    opacity: 0;
    pointer-events: none;
}

.geip-backdrop {
    position: absolute;
    inset: -15%;
    background:
        conic-gradient(
            from 120deg at 50% 50%,
            transparent 0deg,
            rgba(5, 217, 255, .08) 58deg,
            transparent 126deg,
            rgba(139, 92, 246, .07) 210deg,
            transparent 310deg
        );
    filter: blur(70px);
    animation: geipBackdrop 10s linear infinite;
}

.geip-grid {
    position: absolute;
    inset: 0;
    opacity: .22;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size: 38px 38px;
    mask-image: radial-gradient(circle at center, black 20%, transparent 78%);
}

.geip-stage {
    position: relative;
    width: min(88vw, 560px);
    min-height: 520px;
    display: grid;
    place-items: center;
    isolation: isolate;
}

.geip-halo {
    position: absolute;
    top: 74px;
    left: 50%;
    width: 300px;
    height: 300px;
    transform: translateX(-50%) scale(.72);
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(47, 107, 255, .34) 0%, rgba(5, 217, 255, .13) 36%, rgba(139, 92, 246, .05) 58%, transparent 74%);
    filter: blur(14px);
    opacity: 0;
}

.geip-logo-wrap {
    position: absolute;
    top: 100px;
    left: 50%;
    width: 210px;
    height: 210px;
    transform: translateX(-50%) scale(.72);
    opacity: 0;
    z-index: 6;
}

.geip-logo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter:
        drop-shadow(0 18px 44px rgba(0,0,0,.28))
        drop-shadow(0 0 26px rgba(5,217,255,.16));
}

.geip-orbit {
    position: absolute;
    left: 50%;
    top: 58px;
    border-radius: 50%;
    border: 1px solid rgba(138, 187, 255, .22);
    transform: translateX(-50%) scale(.82);
    opacity: 0;
}

.geip-orbit::before,
.geip-orbit::after {
    content: "";
    position: absolute;
    inset: 8%;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.035);
}

.geip-orbit-outer {
    width: 330px;
    height: 330px;
}

.geip-orbit-inner {
    width: 276px;
    height: 276px;
    top: 85px;
    border-color: rgba(5,217,255,.26);
}

.geip-dot {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #74E8FF;
    box-shadow: 0 0 18px rgba(5,217,255,.9);
}

.geip-dot-a { top: 16%; left: 16%; }
.geip-dot-b { right: 4%; bottom: 28%; background: #9B75FF; box-shadow: 0 0 18px rgba(139,92,246,.9); }
.geip-dot-c { right: 14%; top: 19%; }
.geip-dot-d { left: 1%; bottom: 35%; background: #8B5CF6; box-shadow: 0 0 18px rgba(139,92,246,.88); }

.geip-copy {
    position: absolute;
    top: 340px;
    left: 50%;
    width: min(92vw, 560px);
    transform: translateX(-50%) translateY(12px);
    text-align: center;
    opacity: 0;
    z-index: 8;
}

.geip-kicker,
.geip-brand,
.geip-tagline {
    display: block;
}

.geip-kicker {
    margin-bottom: 12px;
    color: #84E9FF;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .2em;
}

.geip-brand {
    color: var(--geip-white);
    font-size: clamp(32px, 5.2vw, 52px);
    line-height: 1;
    letter-spacing: -.045em;
    text-shadow: 0 8px 30px rgba(0,0,0,.28);
}

.geip-tagline {
    margin-top: 12px;
    color: rgba(255,255,255,.72);
    font-size: clamp(14px, 2vw, 17px);
    font-weight: 600;
    letter-spacing: .02em;
}

.geip-skip {
    position: absolute;
    top: max(18px, env(safe-area-inset-top));
    right: max(18px, env(safe-area-inset-right));
    z-index: 12;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    color: rgba(255,255,255,.62);
    background: rgba(255,255,255,.045);
    backdrop-filter: blur(12px);
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    opacity: 0;
    transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.geip-skip:hover,
.geip-skip:focus-visible {
    color: #fff;
    background: rgba(255,255,255,.09);
    border-color: rgba(255,255,255,.24);
    outline: none;
}

.geip-is-visible .geip-logo-wrap {
    animation: geipLogoIn .78s cubic-bezier(.2,.8,.2,1) .14s forwards;
}

.geip-is-visible .geip-halo {
    animation: geipHaloIn 1.25s ease .08s forwards, geipPulse 1.6s ease-in-out 1.15s infinite alternate;
}

.geip-is-visible .geip-orbit-outer {
    animation:
        geipOrbitReveal .78s ease .28s forwards,
        geipOrbitOuter 16s linear .72s infinite;
}

.geip-is-visible .geip-orbit-inner {
    animation:
        geipOrbitReveal .78s ease .38s forwards,
        geipOrbitInner 12s linear .82s infinite;
}

.geip-is-visible .geip-copy {
    animation: geipCopyIn .58s ease .78s forwards;
}

.geip-is-visible .geip-skip {
    animation: geipSkipIn .35s ease .7s forwards;
}

body.geip-lock {
    overflow: hidden !important;
}

@keyframes geipLogoIn {
    0% { opacity: 0; transform: translateX(-50%) scale(.72) translateY(8px); filter: blur(8px); }
    58% { opacity: 1; transform: translateX(-50%) scale(1.035) translateY(0); filter: blur(0); }
    100% { opacity: 1; transform: translateX(-50%) scale(1); filter: blur(0); }
}

@keyframes geipHaloIn {
    0% { opacity: 0; transform: translateX(-50%) scale(.62); }
    100% { opacity: .95; transform: translateX(-50%) scale(1); }
}

@keyframes geipPulse {
    from { opacity: .7; transform: translateX(-50%) scale(.98); }
    to { opacity: 1; transform: translateX(-50%) scale(1.04); }
}

@keyframes geipOrbitReveal {
    from { opacity: 0; transform: translateX(-50%) scale(.82); }
    to { opacity: 1; transform: translateX(-50%) scale(1); }
}

@keyframes geipOrbitOuter {
    from { transform: translateX(-50%) rotate(0deg); }
    to { transform: translateX(-50%) rotate(360deg); }
}

@keyframes geipOrbitInner {
    from { transform: translateX(-50%) rotate(360deg); }
    to { transform: translateX(-50%) rotate(0deg); }
}

@keyframes geipCopyIn {
    from { opacity: 0; transform: translateX(-50%) translateY(12px); }
    to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@keyframes geipSkipIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes geipBackdrop {
    from { transform: rotate(0deg) scale(1); }
    to { transform: rotate(360deg) scale(1.03); }
}

@media (max-width: 640px) {
    .geip-stage {
        min-height: 460px;
    }

    .geip-logo-wrap {
        top: 92px;
        width: 168px;
        height: 168px;
    }

    .geip-halo {
        top: 72px;
        width: 250px;
        height: 250px;
    }

    .geip-orbit-outer {
        top: 60px;
        width: 278px;
        height: 278px;
    }

    .geip-orbit-inner {
        top: 86px;
        width: 225px;
        height: 225px;
    }

    .geip-copy {
        top: 305px;
    }

    .geip-kicker {
        font-size: 9px;
        letter-spacing: .16em;
    }

    .geip-skip {
        font-size: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .geip-backdrop,
    .geip-orbit,
    .geip-halo,
    .geip-logo-wrap,
    .geip-copy,
    .geip-skip {
        animation: none !important;
    }

    .geip-logo-wrap {
        opacity: 1;
        transform: translateX(-50%) scale(1);
    }

    .geip-halo,
    .geip-orbit {
        opacity: .65;
        transform: translateX(-50%) scale(1);
    }

    .geip-copy {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }

    .geip-skip {
        opacity: 1;
    }
}


/* =========================================================
   GE Intro Premium · v1.1.0
   Microanimación de saludo del pingüino + prueba fiable.
   ========================================================= */

.geip-logo-wrap{
    overflow: visible;
    transform-origin: 50% 62%;
}

.geip-logo{
    transform-origin: 50% 62%;
    will-change: transform, filter;
}

.geip-logo-wrap::before{
    content:"";
    position:absolute;
    inset:8%;
    z-index:2;
    border-radius:50%;
    pointer-events:none;
    background:linear-gradient(
        115deg,
        transparent 28%,
        rgba(255,255,255,.0) 40%,
        rgba(255,255,255,.22) 48%,
        rgba(125,211,252,.14) 52%,
        rgba(255,255,255,0) 60%,
        transparent 72%
    );
    transform:translateX(-140%) rotate(8deg);
    mix-blend-mode:screen;
    opacity:0;
}

.geip-glint{
    position:absolute;
    z-index:4;
    width:8px;
    height:8px;
    border-radius:999px;
    opacity:0;
    background:#8df0ff;
    box-shadow:0 0 16px rgba(5,217,255,.95);
}

.geip-glint-a{
    top:22%;
    right:12%;
}

.geip-glint-b{
    left:12%;
    bottom:26%;
    width:6px;
    height:6px;
    background:#bba2ff;
    box-shadow:0 0 15px rgba(139,92,246,.92);
}

.geip-is-visible .geip-logo{
    animation:
        geipPenguinHello 1.25s cubic-bezier(.22,.78,.22,1) .42s both,
        geipPenguinFloat 2.4s ease-in-out 1.58s infinite alternate;
}

.geip-is-visible .geip-logo-wrap::before{
    animation:geipLogoSweep .82s ease .82s forwards;
}

.geip-is-visible .geip-glint-a{
    animation:geipGlint .58s ease .9s forwards;
}

.geip-is-visible .geip-glint-b{
    animation:geipGlint .58s ease 1.06s forwards;
}

@keyframes geipPenguinHello{
    0%{transform:translateY(7px) rotate(0deg) scale(.94);}
    36%{transform:translateY(-6px) rotate(-3deg) scale(1.025);}
    58%{transform:translateY(-2px) rotate(2.2deg) scale(1.012);}
    78%{transform:translateY(0) rotate(-1deg) scale(1.005);}
    100%{transform:translateY(0) rotate(0deg) scale(1);}
}

@keyframes geipPenguinFloat{
    from{transform:translateY(0) rotate(-.35deg);}
    to{transform:translateY(-3px) rotate(.35deg);}
}

@keyframes geipLogoSweep{
    0%{opacity:0;transform:translateX(-140%) rotate(8deg);}
    22%{opacity:.9;}
    100%{opacity:0;transform:translateX(140%) rotate(8deg);}
}

@keyframes geipGlint{
    0%{opacity:0;transform:scale(.2);}
    45%{opacity:1;transform:scale(1.35);}
    100%{opacity:0;transform:scale(.65);}
}

@media (max-width:640px){
    .geip-stage{
        min-height:430px;
    }

    .geip-logo-wrap{
        top:82px;
        width:158px;
        height:158px;
    }

    .geip-copy{
        top:286px;
    }
}

@media (prefers-reduced-motion:reduce){
    .geip-logo,
    .geip-logo-wrap::before,
    .geip-glint{
        animation:none !important;
        transform:none !important;
    }
}