.elementor-356 .elementor-element.elementor-element-3bc4533{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-356 .elementor-element.elementor-element-ed428f2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-356 .elementor-element.elementor-element-c1fd428{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-356 .elementor-element.elementor-element-a97df41{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-b949c89 *//* =========================================================
   GELLYFX
   HERO
========================================================= */

.gellyfx-hero {

    --gx-black: #050505;
    --gx-black-soft: #0a0a0a;
    --gx-white: #f4f4f2;
    --gx-gray: #555557;
    --gx-gray-light: #88888a;
    --gx-orange: #f4511e;
    --gx-orange-light: #ff6428;
    --gx-cyan: #73c9df;

    position: relative;
    width: 100%;
    min-height: 850px;
    display: flex;
    align-items: center;
    overflow: hidden;

    background: var(--gx-black);
    color: var(--gx-white);

}


.gellyfx-hero,
.gellyfx-hero * {
    box-sizing: border-box;
}


/* BACKGROUND */

.gellyfx-hero-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}


.gellyfx-hero-grid {

    position: absolute;
    inset: 0;

    opacity: .30;

    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: 80px 80px;

}


/* GLOW */

.gellyfx-hero-glow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

}


.gellyfx-hero-glow-orange {

    width: 700px;
    height: 700px;

    right: -300px;
    top: 50%;

    transform: translateY(-50%);

    background:
        radial-gradient(
            circle,
            rgba(244,81,30,.18),
            transparent 68%
        );

}


.gellyfx-hero-glow-cyan {

    width: 400px;
    height: 400px;

    left: 25%;
    top: -250px;

    background:
        radial-gradient(
            circle,
            rgba(115,201,223,.07),
            transparent 70%
        );

}


/* ORBITAS */

.gellyfx-hero-orbit {

    position: absolute;

    border-radius: 50%;

    border: 1px solid
        rgba(244,81,30,.14);

}


.gellyfx-orbit-01 {

    width: 700px;
    height: 700px;

    right: -350px;
    top: 50%;

    transform: translateY(-50%)
               rotate(20deg);

}


.gellyfx-orbit-02 {

    width: 480px;
    height: 480px;

    right: -240px;
    top: 50%;

    transform: translateY(-50%)
               rotate(-25deg);

    border-color:
        rgba(115,201,223,.12);

}


/* CONTENEDOR */

.gellyfx-hero-container {

    position: relative;
    z-index: 3;

    width: min(
        1380px,
        calc(100% - 100px)
    );

    min-height: 850px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        1.05fr
        .95fr;

    align-items: center;

    gap: 80px;

}


/* EYEBROW */

.gellyfx-eyebrow {

    display: flex;
    align-items: center;

    gap: 14px;

    margin-bottom: 32px;

    color: var(--gx-gray-light);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .20em;

}


.gellyfx-eyebrow-line {

    width: 35px;
    height: 1px;

    background:
        var(--gx-orange);

}


/* TITULO */

.gellyfx-hero-title {

    margin: 0;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        clamp(
            90px,
            13vw,
            190px
        );

    font-weight: 900;

    line-height: .72;

    letter-spacing: -.09em;

    text-transform: uppercase;

}


.gellyfx-title-orange {

    color:
        var(--gx-orange);

    margin-left: .15em;

}


/* DESCRIPCIÓN */

.gellyfx-hero-description {

    max-width: 550px;

    margin:
        48px 0 0;

    color:
        rgba(244,244,242,.55);

    font-size: 17px;

    line-height: 1.75;

}


/* BOTONES */

.gellyfx-hero-actions {

    display: flex;
    flex-wrap: wrap;

    gap: 14px;

    margin-top: 38px;

}


.gellyfx-button {

    min-height: 54px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 20px;

    padding:
        0 25px;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .13em;

    text-transform: uppercase;

    text-decoration: none;

    transition:
        .3s ease;

}


.gellyfx-button-primary {

    background:
        var(--gx-orange);

    color: #fff;

}


.gellyfx-button-primary:hover {

    background:
        var(--gx-orange-light);

    color: #fff;

    transform:
        translateY(-3px);

}


.gellyfx-button-secondary {

    border:
        1px solid
        rgba(255,255,255,.20);

    color:
        var(--gx-white);

}


.gellyfx-button-secondary:hover {

    border-color:
        var(--gx-orange);

    color:
        var(--gx-orange);

}


/* LOGO */

.gellyfx-hero-visual {

    display: flex;

    align-items: center;
    justify-content: center;

}


.gellyfx-logo-frame {

    position: relative;

    width: 100%;
    max-width: 620px;

    min-height: 570px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(255,255,255,.10);

    background:
        rgba(255,255,255,.015);

}


.gellyfx-logo-frame::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100px;
    height: 2px;

    background:
        var(--gx-orange);

}


.gellyfx-logo-frame::after {

    content: "";

    position: absolute;

    right: 0;
    bottom: 0;

    width: 2px;
    height: 100px;

    background:
        var(--gx-cyan);

}


.gellyfx-logo-image {

    width: 78%;
    max-width: 480px;

    height: auto;

    display: block;

    object-fit: contain;

}


.gellyfx-frame-label,
.gellyfx-frame-footer {

    position: absolute;

    left: 25px;
    right: 25px;

    color:
        rgba(255,255,255,.30);

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .16em;

}


.gellyfx-frame-label {
    top: 22px;
}


.gellyfx-frame-footer {

    bottom: 22px;

    text-align: center;

}


/* SCROLL */

.gellyfx-scroll {

    position: absolute;

    z-index: 5;

    left: 50%;
    bottom: 30px;

    transform:
        translateX(-50%);

    display: flex;

    align-items: center;

    gap: 12px;

    color:
        rgba(255,255,255,.35);

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .18em;

    text-decoration: none;

}


.gellyfx-scroll-line {

    width: 40px;
    height: 1px;

    background:
        var(--gx-orange);

}


/* TABLET */

@media (max-width: 1024px) {

    .gellyfx-hero {

        min-height: 760px;

    }


    .gellyfx-hero-container {

        width:
            calc(100% - 60px);

        min-height: 760px;

        gap: 45px;

    }


    .gellyfx-hero-title {

        font-size:
            clamp(
                70px,
                12vw,
                120px
            );

    }


    .gellyfx-logo-frame {

        min-height: 450px;

    }

}


/* MOBILE */

@media (max-width: 767px) {

    .gellyfx-hero {

        min-height: auto;

        padding:
            85px 0 90px;

    }


    .gellyfx-hero-container {

        width:
            calc(100% - 36px);

        min-height: auto;

        grid-template-columns: 1fr;

        gap: 65px;

    }


    .gellyfx-hero-title {

        font-size:
            clamp(
                70px,
                21vw,
                110px
            );

    }


    .gellyfx-hero-description {

        margin-top: 35px;

        font-size: 15px;

    }


    .gellyfx-hero-actions {

        flex-direction: column;

        align-items: stretch;

    }


    .gellyfx-button {

        width: 100%;

    }


    .gellyfx-logo-frame {

        min-height: 360px;

    }


    .gellyfx-logo-image {

        width: 75%;

    }


    .gellyfx-scroll {

        display: none;

    }

}


/* MOBILE PEQUEÑO */

@media (max-width: 480px) {

    .gellyfx-hero {

        padding:
            70px 0;

    }


    .gellyfx-hero-container {

        width:
            calc(100% - 28px);

    }


    .gellyfx-hero-title {

        font-size: 68px;

    }


    .gellyfx-hero-description {

        font-size: 14px;

    }


    .gellyfx-logo-frame {

        min-height: 300px;

    }


    .gellyfx-frame-label,
    .gellyfx-frame-footer {

        font-size: 6px;

        left: 15px;
        right: 15px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-3652a47 *//* =========================================================
   GELLYFX
   BLOQUE 02 — CONCEPTO
========================================================= */

.gellyfx-concepto {

    --gx-black: #050505;
    --gx-black-soft: #090909;
    --gx-white: #f4f4f2;
    --gx-gray: #777779;
    --gx-gray-light: #a0a0a2;
    --gx-orange: #f4511e;
    --gx-orange-light: #ff6428;
    --gx-cyan: #73c9df;

    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        150px 0 100px;

    background:
        var(--gx-black-soft);

    color:
        var(--gx-white);

}


/* =========================================================
   BOX SIZING
========================================================= */

.gellyfx-concepto,
.gellyfx-concepto *,
.gellyfx-concepto *::before,
.gellyfx-concepto *::after {

    box-sizing: border-box;

}


/* =========================================================
   CONTENEDOR
========================================================= */

.gellyfx-container {

    position: relative;

    z-index: 3;

    width:
        min(
            1380px,
            calc(100% - 100px)
        );

    margin: 0 auto;

}


/* =========================================================
   FONDO
========================================================= */

.gellyfx-concepto-bg {

    position: absolute;

    inset: 0;

    pointer-events: none;

}


/* Número gigante */

.gellyfx-concepto-number {

    position: absolute;

    right: -20px;

    top: -90px;

    color:
        rgba(
            255,
            255,
            255,
            0.018
        );

    font-size:
        clamp(
            350px,
            40vw,
            650px
        );

    font-weight: 900;

    line-height: 1;

    letter-spacing:
        -0.10em;

}


/* Líneas */

.gellyfx-concepto-line {

    position: absolute;

    height: 1px;

    background:
        rgba(
            255,
            255,
            255,
            0.045
        );

}


.line-1 {

    width: 70%;

    top: 35%;

    left: 0;

}


.line-2 {

    width: 45%;

    bottom: 20%;

    right: 0;

}


/* =========================================================
   HEADER
========================================================= */

.gellyfx-section-header {

    margin-bottom: 75px;

}


.gellyfx-section-marker {

    display: flex;

    align-items: center;

    gap: 14px;

}


.gellyfx-section-marker span {

    width: 36px;

    height: 1px;

    background:
        var(--gx-orange);

}


.gellyfx-section-marker small {

    color:
        var(--gx-gray);

    font-size: 9px;

    font-weight: 700;

    letter-spacing:
        0.20em;

}


/* =========================================================
   GRID PRINCIPAL
========================================================= */

.gellyfx-concepto-grid {

    display: grid;

    grid-template-columns:
        1.05fr
        0.95fr;

    gap: 120px;

    align-items: start;

}


/* =========================================================
   COLUMNA IZQUIERDA
========================================================= */

.gellyfx-concepto-title {

    padding-top: 5px;

}


.gellyfx-mini-label {

    display: block;

    margin-bottom: 25px;

    color:
        var(--gx-gray-light);

    font-size: 9px;

    font-weight: 700;

    letter-spacing:
        0.18em;

}


.gellyfx-concepto-title h2 {

    margin: 0;

    font-size:
        clamp(
            65px,
            7.5vw,
            105px
        );

    font-weight: 800;

    line-height:
        0.88;

    letter-spacing:
        -0.065em;

}


.gellyfx-concepto-title h2 span {

    display: block;

    color:
        var(--gx-orange);

}


/* =========================================================
   CONTENIDO
========================================================= */

.gellyfx-concepto-content {

    max-width: 620px;

}


.gellyfx-concepto-lead {

    margin:
        0 0 30px;

    color:
        var(--gx-white);

    font-size: 23px;

    font-weight: 400;

    line-height: 1.45;

}


.gellyfx-concepto-content > p:not(.gellyfx-concepto-lead) {

    margin:
        0 0 22px;

    color:
        rgba(
            244,
            244,
            242,
            0.50
        );

    font-size: 15px;

    line-height: 1.85;

}


/* =========================================================
   DATOS
========================================================= */

.gellyfx-concept-data {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    margin-top: 45px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            0.12
        );

    border-bottom:
        1px solid
        rgba(
            255,
            255,
            255,
            0.12
        );

}


.gellyfx-data-item {

    min-height: 95px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    gap: 9px;

    padding:
        15px 18px;

    border-right:
        1px solid
        rgba(
            255,
            255,
            255,
            0.10
        );

}


.gellyfx-data-item:last-child {

    border-right: none;

}


.gellyfx-data-item strong {

    color:
        var(--gx-orange);

    font-size: 9px;

    font-weight: 700;

}


.gellyfx-data-item span {

    color:
        rgba(
            255,
            255,
            255,
            0.60
        );

    font-size: 9px;

    font-weight: 700;

    letter-spacing:
        0.15em;

}


/* =========================================================
   LINK
========================================================= */

.gellyfx-concept-link {

    display: inline-flex;

    align-items: center;

    gap: 18px;

    margin-top: 35px;

    color:
        var(--gx-orange);

    font-size: 9px;

    font-weight: 700;

    letter-spacing:
        0.15em;

    text-decoration: none;

    text-transform: uppercase;

}


.gellyfx-link-arrow {

    width: 32px;

    height: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid
        rgba(
            244,
            81,
            30,
            0.45
        );

    font-size: 16px;

    transition:
        0.25s ease;

}


.gellyfx-concept-link:hover {

    color:
        var(--gx-orange-light);

}


.gellyfx-concept-link:hover
.gellyfx-link-arrow {

    color:
        #ffffff;

    background:
        var(--gx-orange);

    transform:
        translate(
            3px,
            -3px
        );

}


/* =========================================================
   FOOTER CONCEPTUAL
========================================================= */

.gellyfx-concepto-footer {

    display: grid;

    grid-template-columns:
        repeat(5, 1fr);

    gap: 20px;

    margin-top: 110px;

    padding-top: 25px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            0.09
        );

}


.gellyfx-concepto-footer span {

    color:
        rgba(
            255,
            255,
            255,
            0.22
        );

    font-size: 8px;

    font-weight: 700;

    letter-spacing:
        0.18em;

}


.gellyfx-concepto-footer span:nth-child(2) {

    color:
        rgba(
            244,
            81,
            30,
            0.65
        );

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .gellyfx-concepto {

        padding:
            120px 0 85px;

    }


    .gellyfx-container {

        width:
            calc(100% - 60px);

    }


    .gellyfx-concepto-grid {

        gap: 70px;

    }


    .gellyfx-concepto-title h2 {

        font-size:
            clamp(
                55px,
                7vw,
                80px
            );

    }


    .gellyfx-concepto-lead {

        font-size: 20px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .gellyfx-concepto {

        padding:
            90px 0 70px;

    }


    .gellyfx-container {

        width:
            calc(100% - 36px);

    }


    .gellyfx-section-header {

        margin-bottom: 50px;

    }


    .gellyfx-concepto-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }


    .gellyfx-concepto-title h2 {

        font-size:
            clamp(
                50px,
                13vw,
                75px
            );

    }


    .gellyfx-concepto-content {

        max-width: none;

    }


    .gellyfx-concepto-lead {

        font-size: 20px;

        line-height: 1.45;

    }


    .gellyfx-concepto-content > p:not(.gellyfx-concepto-lead) {

        font-size: 14px;

        line-height: 1.75;

    }


    .gellyfx-concept-data {

        margin-top: 35px;

    }


    .gellyfx-data-item {

        min-height: 80px;

        padding:
            12px 10px;

    }


    .gellyfx-data-item span {

        font-size: 7px;

        letter-spacing:
            0.08em;

    }


    .gellyfx-concepto-footer {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 18px;

        margin-top: 65px;

    }


    .gellyfx-concepto-number {

        right: -80px;

        top: 50px;

        font-size: 300px;

    }

}


/* =========================================================
   MOBILE PEQUEÑO
========================================================= */

@media (max-width: 480px) {

    .gellyfx-concepto {

        padding:
            75px 0 60px;

    }


    .gellyfx-container {

        width:
            calc(100% - 28px);

    }


    .gellyfx-concepto-title h2 {

        font-size: 48px;

    }


    .gellyfx-concepto-lead {

        font-size: 18px;

    }


    .gellyfx-concepto-content > p:not(.gellyfx-concepto-lead) {

        font-size: 13px;

    }


    .gellyfx-data-item {

        min-height: 72px;

        padding:
            10px 7px;

    }


    .gellyfx-data-item strong {

        font-size: 7px;

    }


    .gellyfx-data-item span {

        font-size: 6px;

    }


    .gellyfx-concepto-footer span {

        font-size: 6px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c39d4f8 *//* =========================================================
   GELLYFX
   BLOQUE 03 — EXPERIENCIAS
========================================================= */

.gellyfx-experiencias {

    --gx-black: #050505;
    --gx-black-soft: #090909;
    --gx-white: #f4f4f2;
    --gx-gray: #777779;
    --gx-gray-light: #a0a0a2;
    --gx-orange: #f4511e;
    --gx-orange-light: #ff6428;
    --gx-cyan: #73c9df;

    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        150px 0 100px;

    background:
        var(--gx-black);

    color:
        var(--gx-white);

}


/* =========================================================
   BOX SIZING
========================================================= */

.gellyfx-experiencias,
.gellyfx-experiencias *,
.gellyfx-experiencias *::before,
.gellyfx-experiencias *::after {

    box-sizing: border-box;

}


/* =========================================================
   FONDO
========================================================= */

.gellyfx-experiencias-bg {

    position: absolute;

    inset: 0;

    pointer-events: none;

}


.gellyfx-experiencias-grid {

    position: absolute;

    inset: 0;

    opacity: .18;

    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:
        90px 90px;

}


.gellyfx-experiencias-number {

    position: absolute;

    right: -40px;

    top: 0;

    color:
        rgba(
            255,
            255,
            255,
            .018
        );

    font-size:
        clamp(
            350px,
            40vw,
            650px
        );

    font-weight: 900;

    line-height: .9;

}


/* =========================================================
   CONTENEDOR
========================================================= */

.gellyfx-experiencias
.gellyfx-container {

    position: relative;

    z-index: 2;

    width:
        min(
            1380px,
            calc(100% - 100px)
        );

    margin: 0 auto;

}


/* =========================================================
   HEADER
========================================================= */

.gellyfx-experiencias
.gellyfx-section-header {

    margin-bottom: 65px;

}


.gellyfx-experiencias
.gellyfx-section-marker {

    display: flex;

    align-items: center;

    gap: 14px;

}


.gellyfx-experiencias
.gellyfx-section-marker span {

    width: 36px;

    height: 1px;

    background:
        var(--gx-orange);

}


.gellyfx-experiencias
.gellyfx-section-marker small {

    color:
        var(--gx-gray);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .20em;

}


/* =========================================================
   INTRO
========================================================= */

.gellyfx-experiencias-intro {

    display: grid;

    grid-template-columns:
        1.05fr
        .95fr;

    gap: 120px;

    align-items: end;

    margin-bottom: 80px;

}


.gellyfx-mini-label {

    display: block;

    margin-bottom: 24px;

    color:
        var(--gx-gray-light);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .18em;

}


.gellyfx-experiencias-title h2 {

    margin: 0;

    font-size:
        clamp(
            60px,
            7vw,
            100px
        );

    font-weight: 800;

    line-height: .88;

    letter-spacing: -.065em;

}


.gellyfx-experiencias-title h2 span {

    display: block;

    color:
        var(--gx-orange);

}


.gellyfx-experiencias-description {

    max-width: 570px;

}


.gellyfx-experiencias-description p {

    margin:
        0 0 20px;

    color:
        rgba(
            244,
            244,
            242,
            .50
        );

    font-size: 15px;

    line-height: 1.8;

}


.gellyfx-experiencias-description p:first-child {

    color:
        rgba(
            244,
            244,
            242,
            .85
        );

    font-size: 21px;

    line-height: 1.45;

}


/* =========================================================
   GRID DE EXPERIENCIAS
========================================================= */

.gellyfx-experiencias-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            .12
        );

    border-left:
        1px solid
        rgba(
            255,
            255,
            255,
            .12
        );

}


/* =========================================================
   CARD
========================================================= */

.gellyfx-experiencia-card {

    position: relative;

    min-height: 620px;

    display: flex;

    flex-direction: column;

    padding: 28px;

    overflow: hidden;

    border-right:
        1px solid
        rgba(
            255,
            255,
            255,
            .12
        );

    border-bottom:
        1px solid
        rgba(
            255,
            255,
            255,
            .12
        );

    background:
        rgba(
            255,
            255,
            255,
            .012
        );

    transition:
        background .35s ease;

}


.gellyfx-experiencia-card:hover {

    background:
        rgba(
            244,
            81,
            30,
            .035
        );

}


/* =========================================================
   PARTE SUPERIOR
========================================================= */

.gellyfx-experiencia-top {

    position: relative;

    z-index: 3;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.gellyfx-experiencia-number {

    color:
        var(--gx-orange);

    font-size: 10px;

    font-weight: 700;

}


.gellyfx-experiencia-category {

    color:
        rgba(
            255,
            255,
            255,
            .28
        );

    font-size: 8px;

    font-weight: 700;

    letter-spacing: .17em;

}


/* =========================================================
   ÁREA VISUAL
========================================================= */

.gellyfx-experiencia-visual {

    position: relative;

    width: 100%;

    height: 300px;

    flex-shrink: 0;

    margin-top: 15px;

}


/* =========================================================
   VISUAL 01 — DIGITAL ART
========================================================= */

.gellyfx-visual-digital {

    display: flex;

    align-items: center;

    justify-content: center;

}


.gx-digital-ring {

    position: absolute;

    left: 50%;

    top: 50%;

    transform:
        translate(
            -50%,
            -50%
        );

    border-radius: 50%;

}


.gx-digital-ring.ring-a {

    width: 210px;

    height: 210px;

    border:
        1px solid
        rgba(
            244,
            81,
            30,
            .50
        );

}


.gx-digital-ring.ring-b {

    width: 145px;

    height: 145px;

    border:
        1px solid
        rgba(
            115,
            201,
            223,
            .45
        );

}


.gx-digital-ring.ring-c {

    width: 80px;

    height: 80px;

    border:
        1px solid
        rgba(
            244,
            81,
            30,
            .60
        );

}


.gx-digital-core {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 14px;

    height: 14px;

    transform:
        translate(
            -50%,
            -50%
        );

    border-radius: 50%;

    background:
        var(--gx-orange);

    box-shadow:
        0 0 30px
        rgba(
            244,
            81,
            30,
            .60
        );

}


.gx-digital-line {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 260px;

    height: 1px;

    transform:
        translate(
            -50%,
            -50%
        );

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(
                115,
                201,
                223,
                .40
            ),
            transparent
        );

}


.gx-digital-line.line-a {

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(45deg);

}


.gx-digital-line.line-b {

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(-45deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(
                244,
                81,
                30,
                .35
            ),
            transparent
        );

}


/* =========================================================
   VISUAL 02 — INMERSIVO
========================================================= */

.gellyfx-visual-immersive {

    display: flex;

    align-items: center;

    justify-content: center;

}


.gx-immersive-shape {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 190px;

    height: 190px;

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(45deg);

    border:
        1px solid
        rgba(
            115,
            201,
            223,
            .35
        );

}


.gx-immersive-shape.shape-b {

    width: 145px;

    height: 145px;

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(20deg);

    border-color:
        rgba(
            244,
            81,
            30,
            .55
        );

}


.gx-immersive-shape.shape-c {

    width: 95px;

    height: 95px;

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(65deg);

    border-color:
        rgba(
            244,
            81,
            30,
            .70
        );

}


.gx-immersive-core {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 22px;

    height: 22px;

    transform:
        translate(
            -50%,
            -50%
        );

    background:
        var(--gx-cyan);

    box-shadow:
        0 0 35px
        rgba(
            115,
            201,
            223,
            .55
        );

}


/* =========================================================
   VISUAL 03 — FUTURO
========================================================= */

.gellyfx-visual-future {

    position: relative;

}


.gx-future-node {

    position: absolute;

    width: 10px;

    height: 10px;

    border-radius: 50%;

    background:
        var(--gx-cyan);

    box-shadow:
        0 0 20px
        rgba(
            115,
            201,
            223,
            .50
        );

}


.gx-future-node.node-a {

    left: 18%;

    top: 42%;

}


.gx-future-node.node-b {

    left: 50%;

    top: 25%;

    background:
        var(--gx-orange);

}


.gx-future-node.node-c {

    right: 18%;

    top: 45%;

}


.gx-future-node.node-d {

    left: 50%;

    bottom: 25%;

    background:
        var(--gx-orange);

}


/* LÍNEAS */

.gx-future-line {

    position: absolute;

    height: 1px;

    transform-origin:
        left center;

    background:
        linear-gradient(
            90deg,
            rgba(
                115,
                201,
                223,
                .50
            ),
            rgba(
                244,
                81,
                30,
                .35
            )
        );

}


.future-line-a {

    width: 170px;

    left: 20%;

    top: 43%;

    transform:
        rotate(-18deg);

}


.future-line-b {

    width: 170px;

    left: 50%;

    top: 28%;

    transform:
        rotate(35deg);

}


.future-line-c {

    width: 150px;

    left: 50%;

    top: 30%;

    transform:
        rotate(130deg);

}


/* =========================================================
   CONTENIDO CARD
========================================================= */

.gellyfx-experiencia-content {

    position: relative;

    z-index: 3;

    margin-top: auto;

}


.gellyfx-experiencia-content h3 {

    margin:
        0 0 15px;

    color:
        var(--gx-white);

    font-size:
        clamp(
            26px,
            2.3vw,
            34px
        );

    font-weight: 700;

    line-height: 1;

    letter-spacing:
        -.035em;

}


.gellyfx-experiencia-content p {

    max-width: 340px;

    margin: 0;

    color:
        rgba(
            244,
            244,
            242,
            .43
        );

    font-size: 13px;

    line-height: 1.75;

}


/* =========================================================
   LINK
========================================================= */

.gellyfx-experiencia-link {

    position: relative;

    z-index: 3;

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 25px;

    padding-top: 18px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            .09
        );

    color:
        var(--gx-orange);

    font-size: 8px;

    font-weight: 700;

    letter-spacing:
        .15em;

    text-decoration: none;

    text-transform: uppercase;

}


.gellyfx-experiencia-link span:last-child {

    font-size: 16px;

    transition:
        transform .25s ease;

}


.gellyfx-experiencia-link:hover {

    color:
        var(--gx-orange-light);

}


.gellyfx-experiencia-link:hover span:last-child {

    transform:
        translate(
            3px,
            -3px
        );

}


/* =========================================================
   FOOTER
========================================================= */

.gellyfx-experiencias-footer {

    display: grid;

    grid-template-columns:
        auto
        1fr
        auto;

    align-items: center;

    gap: 25px;

    margin-top: 45px;

    padding-top: 25px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            .09
        );

}


.gellyfx-experiencias-footer > span {

    color:
        rgba(
            255,
            255,
            255,
            .22
        );

    font-size: 7px;

    font-weight: 700;

    letter-spacing:
        .17em;

}


.gellyfx-experiencias-footer > span:first-child {

    color:
        var(--gx-orange);

}


.gellyfx-experiencias-footer-line {

    width: 100%;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(
                244,
                81,
                30,
                .40
            ),
            transparent
        );

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .gellyfx-experiencias {

        padding:
            120px 0 85px;

    }


    .gellyfx-experiencias
    .gellyfx-container {

        width:
            calc(100% - 60px);

    }


    .gellyfx-experiencias-intro {

        gap: 65px;

    }


    .gellyfx-experiencia-card {

        min-height: 580px;

        padding: 22px;

    }


    .gellyfx-experiencia-visual {

        height: 270px;

    }


    .gellyfx-experiencia-content h3 {

        font-size: 26px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .gellyfx-experiencias {

        padding:
            90px 0 70px;

    }


    .gellyfx-experiencias
    .gellyfx-container {

        width:
            calc(100% - 36px);

    }


    .gellyfx-experiencias-intro {

        grid-template-columns: 1fr;

        gap: 40px;

        margin-bottom: 55px;

    }


    .gellyfx-experiencias-title h2 {

        font-size:
            clamp(
                50px,
                13vw,
                75px
            );

    }


    .gellyfx-experiencias-description p:first-child {

        font-size: 19px;

    }


    .gellyfx-experiencias-description p {

        font-size: 14px;

    }


    .gellyfx-experiencias-grid {

        grid-template-columns: 1fr;

    }


    .gellyfx-experiencia-card {

        min-height: 550px;

        padding: 22px;

    }


    .gellyfx-experiencia-visual {

        height: 250px;

    }


    .gellyfx-experiencias-footer {

        grid-template-columns:
            auto
            1fr;

    }


    .gellyfx-experiencias-footer > span:last-child {

        display: none;

    }

}


/* =========================================================
   MOBILE PEQUEÑO
========================================================= */

@media (max-width: 480px) {

    .gellyfx-experiencias {

        padding:
            75px 0 60px;

    }


    .gellyfx-experiencias
    .gellyfx-container {

        width:
            calc(100% - 28px);

    }


    .gellyfx-experiencias-title h2 {

        font-size: 48px;

    }


    .gellyfx-experiencias-description p:first-child {

        font-size: 18px;

    }


    .gellyfx-experiencias-description p {

        font-size: 13px;

        line-height: 1.7;

    }


    .gellyfx-experiencia-card {

        min-height: 520px;

    }


    .gellyfx-experiencia-visual {

        height: 230px;

    }


    .gx-digital-ring.ring-a {

        width: 170px;

        height: 170px;

    }


    .gx-digital-ring.ring-b {

        width: 120px;

        height: 120px;

    }


    .gx-digital-ring.ring-c {

        width: 70px;

        height: 70px;

    }


    .gx-immersive-shape {

        width: 160px;

        height: 160px;

    }


    .gellyfx-experiencia-content h3 {

        font-size: 25px;

    }


    .gellyfx-experiencia-content p {

        font-size: 12px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d9b8432 *//* =========================================================
   GELLYFX
   BLOQUE FINAL — CTA
========================================================= */

.gellyfx-final {

    --gx-black: #050505;
    --gx-black-soft: #090909;

    --gx-white: #f4f4f2;

    --gx-gray: #555557;
    --gx-gray-light: #777779;

    --gx-orange: #f4511e;
    --gx-orange-light: #ff6428;

    --gx-cyan: #73c9df;

    position: relative;

    width: 100%;

    min-height: 760px;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    background:
        var(--gx-black);

    color:
        var(--gx-white);

}


/* =========================================================
   BOX SIZING
========================================================= */

.gellyfx-final,
.gellyfx-final *,
.gellyfx-final *::before,
.gellyfx-final *::after {

    box-sizing: border-box;

}


/* =========================================================
   BACKGROUND
========================================================= */

.gellyfx-final-background {

    position: absolute;

    inset: 0;

    overflow: hidden;

    pointer-events: none;

}


/* =========================================================
   GRID
========================================================= */

.gellyfx-final-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:
        80px 80px;

}


/* =========================================================
   ORBITAS
========================================================= */

.gellyfx-final-orbit {

    position: absolute;

    left: 50%;

    top: 50%;

    border-radius: 50%;

    transform:
        translate(-50%, -50%);

}


.gellyfx-final-orbit.orbit-01 {

    width: 720px;

    height: 720px;

    border:
        1px solid
        rgba(
            244,
            81,
            30,
            .16
        );

}


.gellyfx-final-orbit.orbit-02 {

    width: 500px;

    height: 500px;

    border:
        1px solid
        rgba(
            115,
            201,
            223,
            .13
        );

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(25deg);

}


.gellyfx-final-orbit.orbit-03 {

    width: 300px;

    height: 300px;

    border:
        1px solid
        rgba(
            244,
            81,
            30,
            .20
        );

    transform:
        translate(
            -50%,
            -50%
        )
        rotate(-25deg);

}


/* =========================================================
   GLOW
========================================================= */

.gellyfx-final-glow {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 650px;

    height: 650px;

    transform:
        translate(
            -50%,
            -50%
        );

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(
                244,
                81,
                30,
                .12
            ) 0%,
            rgba(
                244,
                81,
                30,
                .04
            ) 35%,
            transparent 70%
        );

}


/* =========================================================
   CONTENEDOR
========================================================= */

.gellyfx-final-container {

    position: relative;

    z-index: 5;

    width:
        min(
            1000px,
            calc(100% - 50px)
        );

    margin: 0 auto;

    text-align: center;

}


/* =========================================================
   LABEL
========================================================= */

.gellyfx-final-label {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 15px;

}


.gellyfx-final-label span {

    width: 35px;

    height: 1px;

    background:
        var(--gx-orange);

}


.gellyfx-final-label small {

    color:
        var(--gx-gray-light);

    font-size: 8px;

    font-weight: 700;

    letter-spacing:
        .20em;

}


/* =========================================================
   TITULO
========================================================= */

.gellyfx-final-title {

    margin:
        35px 0 0;

    font-size:
        clamp(
            70px,
            10vw,
            140px
        );

    font-weight: 800;

    line-height:
        .82;

    letter-spacing:
        -.075em;

}


.gellyfx-final-title span {

    display: block;

    color:
        var(--gx-orange);

}


/* =========================================================
   DESCRIPCIÓN
========================================================= */

.gellyfx-final-description {

    max-width: 560px;

    margin:
        42px auto 0;

    color:
        rgba(
            244,
            244,
            242,
            .50
        );

    font-size: 16px;

    line-height: 1.8;

}


/* =========================================================
   BOTÓN
========================================================= */

.gellyfx-final-actions {

    display: flex;

    justify-content: center;

    margin-top: 35px;

}


.gellyfx-final-button {

    min-height: 58px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 25px;

    padding:
        0 30px;

    background:
        var(--gx-orange);

    color:
        #ffffff;

    font-size: 9px;

    font-weight: 700;

    letter-spacing:
        .16em;

    text-decoration: none;

    text-transform: uppercase;

    transition:
        background .3s ease,
        transform .3s ease;

}


.gellyfx-final-button:hover {

    background:
        var(--gx-orange-light);

    color:
        #ffffff;

    transform:
        translateY(-4px);

}


.gellyfx-final-arrow {

    font-size: 18px;

    line-height: 1;

    transition:
        transform .3s ease;

}


.gellyfx-final-button:hover
.gellyfx-final-arrow {

    transform:
        translate(
            4px,
            -4px
        );

}


/* =========================================================
   MARCA
========================================================= */

.gellyfx-final-brand {

    display: flex;

    align-items: center;

    justify-content: center;

    margin-top: 95px;

    font-size: 20px;

    font-weight: 900;

    letter-spacing:
        -.04em;

}


.gellyfx-brand-gray {

    color:
        rgba(
            255,
            255,
            255,
            .20
        );

}


.gellyfx-brand-orange {

    color:
        var(--gx-orange);

}


/* =========================================================
   META
========================================================= */

.gellyfx-final-meta {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 20px;

    margin-top: 35px;

    padding-top: 20px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );

}


.gellyfx-final-meta span {

    color:
        rgba(
            255,
            255,
            255,
            .20
        );

    font-size: 7px;

    font-weight: 700;

    letter-spacing:
        .17em;

}


.gellyfx-final-meta span:last-child {

    text-align: right;

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px) {

    .gellyfx-final {

        min-height: 700px;

    }


    .gellyfx-final-title {

        font-size:
            clamp(
                65px,
                10vw,
                110px
            );

    }


    .gellyfx-final-orbit.orbit-01 {

        width: 600px;

        height: 600px;

    }


    .gellyfx-final-orbit.orbit-02 {

        width: 430px;

        height: 430px;

    }


    .gellyfx-final-orbit.orbit-03 {

        width: 270px;

        height: 270px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .gellyfx-final {

        min-height: 650px;

        padding:
            80px 0;

    }


    .gellyfx-final-container {

        width:
            calc(100% - 36px);

    }


    .gellyfx-final-title {

        margin-top: 30px;

        font-size:
            clamp(
                55px,
                14vw,
                85px
            );

    }


    .gellyfx-final-description {

        margin-top: 32px;

        font-size: 14px;

        line-height: 1.7;

    }


    .gellyfx-final-button {

        width: 100%;

        max-width: 330px;

    }


    .gellyfx-final-brand {

        margin-top: 70px;

    }


    .gellyfx-final-meta {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 15px;

    }


    .gellyfx-final-meta span:last-child {

        text-align: left;

    }


    .gellyfx-final-orbit.orbit-01 {

        width: 500px;

        height: 500px;

    }


    .gellyfx-final-orbit.orbit-02 {

        width: 350px;

        height: 350px;

    }


    .gellyfx-final-orbit.orbit-03 {

        width: 220px;

        height: 220px;

    }


    .gellyfx-final-glow {

        width: 500px;

        height: 500px;

    }

}


/* =========================================================
   MOBILE PEQUEÑO
========================================================= */

@media (max-width: 480px) {

    .gellyfx-final {

        min-height: 600px;

        padding:
            70px 0;

    }


    .gellyfx-final-container {

        width:
            calc(100% - 28px);

    }


    .gellyfx-final-title {

        font-size: 52px;

    }


    .gellyfx-final-description {

        font-size: 13px;

    }


    .gellyfx-final-brand {

        margin-top: 60px;

        font-size: 17px;

    }


    .gellyfx-final-meta {

        margin-top: 25px;

    }


    .gellyfx-final-meta span {

        font-size: 6px;

    }

}/* End custom CSS */