/* Qué es y en qué consiste la terapia EMDR */
/* =========================================================
   BASE
========================================================= */

.ge-article,
.ge-article *{
    box-sizing:border-box;
}

.ge-article{
    --green:#31c91d;
    --green-light:#42d52f;
    --green-dark:#08752d;
    --green-deep:#04521f;

    --yellow:#ffd523;

    --white:#ffffff;

    --soft:#f4faf1;
    --soft-2:#e9f6e5;
    --yellow-soft:#fff8d9;

    --black:#172019;
    --text:#465048;
    --muted:#737d75;

    --border:#dce9da;

    --shadow:0 20px 55px rgba(19,72,31,.10);
    --shadow-soft:0 12px 35px rgba(19,72,31,.07);

    --max:1240px;
    --reading:820px;

    width:100%;
    margin:0;
    padding:0;

    overflow:hidden;

    background:#ffffff;

    color:var(--text);

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

    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

.ge-article a{
    text-decoration:none;
}

.ge-article img{
    display:block;
    max-width:100%;
}

.ge-article p{
    margin:0;
}


/* =========================================================
   HERO
========================================================= */

.ge-article-hero{
    position:relative;

    width:100%;

    background:
        linear-gradient(
            135deg,
            #f5fbf2 0%,
            #ffffff 55%,
            #f1f9ed 100%
        );
}

.ge-article-hero::before{
    content:"";

    position:absolute;

    width:480px;
    height:480px;

    right:-190px;
    top:-240px;

    border-radius:50%;

    background:rgba(49,201,29,.08);

    pointer-events:none;
}

.ge-article-hero__inner{
    width:100%;
    max-width:var(--max);

    margin:0 auto;

    padding:82px 30px 75px;

    position:relative;
    z-index:2;

    display:grid;

    grid-template-columns:
        minmax(0,.9fr)
        minmax(440px,1.1fr);

    align-items:center;

    gap:75px;
}


/* =========================================================
   HERO TEXTO
========================================================= */

.ge-article-breadcrumb{
    margin-bottom:25px;

    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:8px;

    color:var(--muted);

    font-size:12px;
    line-height:1.4;
}

.ge-article-breadcrumb a{
    color:var(--green-dark);
    font-weight:600;
}

.ge-article-breadcrumb span{
    opacity:.65;
}


.ge-article-category{
    width:fit-content;

    margin-bottom:20px;

    padding:8px 13px;

    display:inline-flex;
    align-items:center;

    gap:7px;

    border-radius:999px;

    background:var(--yellow);

    color:var(--green-deep);

    font-size:11px;
    line-height:1;

    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.07em;
}

.ge-article-category::before{
    content:"";

    width:7px;
    height:7px;

    border-radius:50%;

    background:var(--green-dark);
}


.ge-article h1{
    max-width:680px;

    margin:0 0 24px;

    color:var(--black);

    font-size:clamp(38px,4.4vw,50px);
    line-height:1.04;

    font-weight:700;

    letter-spacing:-.045em;
}

.ge-article h1 span{
    color:var(--green-dark);
}


.ge-article-hero__lead{
    max-width:650px;

    color:var(--text);

    font-size:17px;
    line-height:1.8;

    font-weight:400;
}


.ge-article-meta{
    margin-top:28px;

    padding-top:22px;

    border-top:1px solid var(--border);

    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:10px 22px;

    color:var(--muted);

    font-size:12px;
}

.ge-article-meta__item{
    display:flex;
    align-items:center;

    gap:7px;
}

.ge-article-meta__dot{
    width:5px;
    height:5px;

    border-radius:50%;

    background:var(--green);
}


/* =========================================================
   HERO IMAGEN
========================================================= */

.ge-article-hero__visual{
    position:relative;
}

.ge-article-hero__image{
    width:100%;
    height:570px;

    object-fit:cover;
    object-position:center;

    border-radius:30px 30px 30px 8px;

    box-shadow:var(--shadow);
}

.ge-article-hero__label{
    position:absolute;

    left:-30px;
    bottom:30px;

    width:215px;

    padding:20px 21px;

    border-radius:18px;

    background:var(--green-dark);

    color:#ffffff;

    box-shadow:
        0 18px 40px
        rgba(0,0,0,.18);
}

.ge-article-hero__label strong{
    display:block;

    margin-bottom:5px;

    color:var(--yellow);

    font-size:12px;
    line-height:1.4;

    text-transform:uppercase;
    letter-spacing:.05em;
}

.ge-article-hero__label span{
    display:block;

    font-size:13px;
    line-height:1.55;
}


/* =========================================================
   FRANJA
========================================================= */

.ge-article-strip{
    width:100%;

    background:var(--green-dark);
}

.ge-article-strip__inner{
    width:100%;
    max-width:var(--max);

    margin:0 auto;

    padding:0 30px;

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

.ge-article-strip__item{
    min-height:90px;

    padding:20px 30px;

    display:flex;
    align-items:center;

    gap:14px;

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

.ge-article-strip__item:first-child{
    border-left:
        1px solid
        rgba(255,255,255,.14);
}

.ge-article-strip__number{
    color:var(--yellow);

    font-size:22px;
    line-height:1;

    font-weight:700;
}

.ge-article-strip__text strong{
    display:block;

    margin-bottom:3px;

    color:#ffffff;

    font-size:13px;
    line-height:1.4;

    font-weight:600;
}

.ge-article-strip__text span{
    display:block;

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

    font-size:11.5px;
    line-height:1.4;
}


/* =========================================================
   CUERPO
========================================================= */

.ge-article-body{
    width:100%;

    padding:90px 30px 105px;
}

.ge-article-body__inner{
    width:100%;
    max-width:var(--reading);

    margin:0 auto;
}


/* =========================================================
   INTRODUCCIÓN
========================================================= */

.ge-article-intro{
    margin-bottom:55px;

    font-size:18px;
    line-height:1.9;

    color:#354039;
}

.ge-article-intro strong{
    color:var(--green-dark);
}


/* =========================================================
   ÍNDICE
========================================================= */

.ge-article-index{
    margin-bottom:65px;

    padding:28px 30px;

    border:1px solid var(--border);

    border-radius:20px;

    background:var(--soft);

    box-shadow:var(--shadow-soft);
}

.ge-article-index__title{
    margin-bottom:16px !important;

    color:var(--green-deep);

    font-size:14px;

    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.05em;
}

.ge-article-index__links{
    display:grid;

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

    gap:10px 25px;
}

.ge-article-index__links a{
    position:relative;

    padding-left:18px;

    color:var(--text);

    font-size:13px;
    line-height:1.55;

    font-weight:500;

    transition:color .18s ease;
}

.ge-article-index__links a::before{
    content:"";

    position:absolute;

    left:0;
    top:.62em;

    width:7px;
    height:7px;

    border-radius:50%;

    background:var(--green);
}

.ge-article-index__links a:hover{
    color:var(--green-dark);
}


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

.ge-article-section{
    margin-bottom:64px;

    scroll-margin-top:120px;
}

.ge-article-section:last-child{
    margin-bottom:0;
}

.ge-article-eyebrow{
    margin-bottom:10px !important;

    color:var(--green-dark);

    font-size:11px;
    line-height:1.4;

    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.08em;
}

.ge-article h2{
    margin:0 0 22px;

    color:var(--black);

    font-size:clamp(27px,3vw,38px);
    line-height:1.2;

    font-weight:700;

    letter-spacing:-.025em;
}

.ge-article h3{
    margin:32px 0 13px;

    color:var(--green-deep);

    font-size:20px;
    line-height:1.35;

    font-weight:700;
}

.ge-article-section > p{
    margin-bottom:20px;

    color:var(--text);

    font-size:15.5px;
    line-height:1.9;
}

.ge-article-section > p:last-child{
    margin-bottom:0;
}

.ge-article-section strong{
    color:var(--black);

    font-weight:600;
}

.ge-article-section a{
    color:var(--green-dark);

    font-weight:600;

    text-decoration:underline;

    text-decoration-thickness:1px;
    text-underline-offset:3px;
}


/* =========================================================
   DESTACADO
========================================================= */

.ge-article-highlight{
    margin:38px 0 62px;

    padding:32px 35px;

    position:relative;

    overflow:hidden;

    border-radius:5px 22px 22px 5px;

    background:var(--green-deep);

    color:#ffffff;
}

.ge-article-highlight::before{
    content:"“";

    position:absolute;

    right:22px;
    top:-18px;

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

    font-family:Georgia,serif;

    font-size:145px;
    line-height:1;
}

.ge-article-highlight p{
    position:relative;
    z-index:2;

    color:#ffffff;

    font-size:19px;
    line-height:1.7;

    font-weight:500;
}


/* =========================================================
   TARJETAS
========================================================= */

.ge-article-signs{
    margin:30px 0;

    display:grid;

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

    gap:14px;
}

.ge-article-sign{
    padding:22px;

    border:1px solid var(--border);

    border-radius:16px;

    background:#ffffff;
}

.ge-article-sign__icon{
    width:37px;
    height:37px;

    margin-bottom:13px;

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

    border-radius:10px;

    background:var(--soft-2);

    color:var(--green-dark);

    font-size:18px;
    font-weight:700;
}

.ge-article-sign strong{
    display:block;

    margin-bottom:6px;

    color:var(--black);

    font-size:14px;
}

.ge-article-sign p{
    color:var(--text);

    font-size:13px;
    line-height:1.7;
}


/* =========================================================
   AVISO
========================================================= */

.ge-article-note{
    margin:40px 0;

    padding:27px 30px;

    border-left:
        5px solid
        var(--yellow);

    border-radius:0 16px 16px 0;

    background:var(--yellow-soft);
}

.ge-article-note strong{
    display:block;

    margin-bottom:7px;

    color:var(--green-deep);

    font-size:15px;
}

.ge-article-note p{
    color:#4e5144;

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1050px){

    .ge-article-hero__inner{
        grid-template-columns:
            minmax(0,1fr)
            minmax(360px,.9fr);

        gap:45px;
    }

    .ge-article-hero__image{
        height:500px;
    }

    .ge-article-hero__label{
        left:-15px;
    }

}


@media(max-width:850px){

    .ge-article-hero__inner{
        padding:60px 24px;

        grid-template-columns:1fr;

        gap:42px;
    }

    .ge-article h1{
        max-width:750px;
    }

    .ge-article-hero__image{
        height:470px;
    }

    .ge-article-hero__label{
        left:20px;
        bottom:20px;
    }

    .ge-article-strip__inner{
        padding:0 24px;
    }

    .ge-article-strip__item{
        padding:18px;
    }

}


@media(max-width:650px){

    .ge-article-hero__inner{
        padding:45px 18px 50px;
    }

    .ge-article-breadcrumb{
        margin-bottom:20px;
        font-size:11px;
    }

    .ge-article-category{
        margin-bottom:16px;
    }

    .ge-article h1{
        font-size:clamp(34px,11vw,48px);
    }

    .ge-article-hero__lead{
        font-size:15px;
        line-height:1.7;
    }

    .ge-article-hero__image{
        height:390px;

        border-radius:20px 20px 20px 6px;
    }

    .ge-article-hero__label{
        width:190px;

        left:14px;
        bottom:14px;

        padding:16px;
    }

    .ge-article-strip__inner{
        padding:0;

        grid-template-columns:1fr;
    }

    .ge-article-strip__item,
    .ge-article-strip__item:first-child{
        min-height:72px;

        padding:15px 20px;

        border-left:0;
        border-right:0;

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

    .ge-article-body{
        padding:65px 18px 75px;
    }

    .ge-article-intro{
        margin-bottom:42px;

        font-size:16px;
        line-height:1.8;
    }

    .ge-article-index{
        margin-bottom:50px;

        padding:23px 20px;
    }

    .ge-article-index__links{
        grid-template-columns:1fr;
    }

    .ge-article-section{
        margin-bottom:52px;
    }

    .ge-article-section > p{
        font-size:14.5px;
        line-height:1.85;
    }

    .ge-article-signs{
        grid-template-columns:1fr;
    }

    .ge-article-highlight{
        margin:32px 0 50px;

        padding:27px 24px;
    }

    .ge-article-highlight p{
        font-size:17px;
    }

    .ge-article-note{
        padding:23px 21px;
    }

}