/* =====================================================
   ATV TOURS WITH FIDEL - HERO
===================================================== */

.fidel-hero {
    position: relative;
    width: 100%;
    min-height: 720px;
    height: 92vh;
    max-height: 900px;
    overflow: hidden;
    display: flex;
    align-items: center;
}


/* Imagen de fondo */

.fidel-hero-img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    /*
       IMPORTANTE:
       Puedes cambiar esto dependiendo
       de dónde esté el sujeto en la nueva fotografía.
    */
    object-position: center 52%;

    z-index: 1;

    transform: scale(1.02);

    transition: transform 8s ease;
}


.fidel-hero:hover .fidel-hero-img {
    transform: scale(1.07);
}


/* Overlay */

.fidel-hero-overlay {
    position: absolute;
    inset: 0;

    z-index: 2;

    background:

        linear-gradient(
            90deg,
            rgba(7, 17, 12, 0.88) 0%,
            rgba(7, 17, 12, 0.70) 35%,
            rgba(7, 17, 12, 0.30) 67%,
            rgba(7, 17, 12, 0.18) 100%
        ),

        linear-gradient(
            0deg,
            rgba(0, 0, 0, 0.60) 0%,
            transparent 45%
        );
}


/* Container */

.fidel-hero-container {
    position: relative;
    z-index: 4;

    display: flex;
    align-items: center;

    min-height: inherit;
}


/* Contenido */

.fidel-hero-content {
    max-width: 760px;

    color: white;

    padding-top: 40px;
}


/* Label */

.fidel-hero-label {
    display: inline-flex;

    padding: 9px 17px;

    margin-bottom: 20px;

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

    border-radius: 50px;

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

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    font-size: 13px;

    font-weight: 600;

    letter-spacing: 1.8px;

    text-transform: uppercase;

    color: #ffffff;
}


/* Título */

.fidel-hero h1 {
    margin: 0 0 22px;

    font-size: clamp(55px, 6vw, 92px);

    font-weight: 800;

    line-height: .95;

    letter-spacing: -3px;

    color: white;

    text-shadow:
        0 5px 20px rgba(0,0,0,.30);
}


.fidel-hero h1 span {
    display: block;

    color: #f5a623;
}


/* Descripción */

.fidel-hero-content > p {
    max-width: 660px;

    margin-bottom: 30px;

    font-size: 19px;

    line-height: 1.7;

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

    text-shadow:
        0 2px 10px rgba(0,0,0,.35);
}


/* =====================================================
   BOTONES
===================================================== */

.fidel-hero-actions {
    display: flex;

    flex-wrap: wrap;

    gap: 14px;

    margin-bottom: 38px;
}


.fidel-btn {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    min-height: 53px;

    padding: 0 27px;

    border-radius: 50px;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;

    transition: all .3s ease;
}


/* Botón principal */

.fidel-btn-primary {
    background: #f5a623;

    color: #111;
}


.fidel-btn-primary:hover {
    background: #ffffff;

    color: #111;

    transform: translateY(-3px);

    box-shadow:
        0 12px 30px rgba(0,0,0,.30);
}


/* WhatsApp */

.fidel-btn-whatsapp {
    background: rgba(255,255,255,.10);

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

    color: white;

    backdrop-filter: blur(10px);
}


.fidel-btn-whatsapp:hover {
    background: #25d366;

    border-color: #25d366;

    color: white;

    transform: translateY(-3px);
}


/* =====================================================
   REDES SOCIALES
===================================================== */

.fidel-social-bar {
    display: inline-flex;

    align-items: center;

    gap: 11px;

    padding: 10px;

    border-radius: 50px;

    background: rgba(13, 23, 17, .50);

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

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    box-shadow:
        0 12px 35px rgba(0,0,0,.20);
}


.fidel-social-bar a {
    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

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

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}


.fidel-social-bar a:hover {
    transform: translateY(-5px) scale(1.06);

    background: white;

    box-shadow:
        0 10px 25px rgba(0,0,0,.30);
}


.fidel-social-bar img {
    width: 26px;
    height: 26px;

    object-fit: contain;
}


/* =====================================================
   SCROLL INDICATOR
===================================================== */

.fidel-scroll-down {
    position: absolute;

    left: 50%;
    bottom: 26px;

    z-index: 5;

    width: 28px;
    height: 46px;

    transform: translateX(-50%);

    border: 2px solid rgba(255,255,255,.60);

    border-radius: 30px;
}


.fidel-scroll-down span {
    position: absolute;

    width: 5px;
    height: 8px;

    border-radius: 10px;

    background: white;

    left: 50%;
    top: 9px;

    transform: translateX(-50%);

    animation: fidelScroll 2s infinite;
}


@keyframes fidelScroll {

    0% {
        opacity: 0;
        transform: translate(-50%, 0);
    }

    30% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translate(-50%, 17px);
    }
}


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

@media (max-width: 991px) {

    .fidel-hero {
        min-height: 650px;
        height: 85vh;
    }

    .fidel-hero-overlay {

        background:

            linear-gradient(
                90deg,
                rgba(7,17,12,.82),
                rgba(7,17,12,.45)
            ),

            linear-gradient(
                0deg,
                rgba(0,0,0,.60),
                transparent 60%
            );
    }

    .fidel-hero-content {
        max-width: 650px;
    }

}


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

@media (max-width: 767px) {

    .fidel-hero {
        min-height: 660px;

        height: auto;

        padding: 110px 0 75px;
    }


    .fidel-hero-img {

        /*
          Para una fotografía casi cuadrada normalmente
          queda mejor centrarla en móvil.
        */

        object-position: center center;
    }


    .fidel-hero-overlay {

        background:

            linear-gradient(
                0deg,
                rgba(5,13,8,.91) 0%,
                rgba(5,13,8,.60) 70%,
                rgba(5,13,8,.37) 100%
            );
    }


    .fidel-hero-container {
        min-height: unset;
    }


    .fidel-hero-content {
        width: 100%;

        padding-top: 0;

        text-align: center;
    }


    .fidel-hero-label {
        font-size: 11px;

        letter-spacing: 1px;
    }


    .fidel-hero h1 {
        font-size: 49px;

        letter-spacing: -2px;
    }


    .fidel-hero-content > p {
        margin-left: auto;
        margin-right: auto;

        font-size: 16px;

        line-height: 1.6;
    }


    .fidel-hero-actions {
        justify-content: center;
    }


    .fidel-btn {
        min-width: 210px;
    }


    .fidel-social-bar {
        display: flex;

        width: fit-content;

        margin: 0 auto;
    }


    .fidel-social-bar a {
        width: 43px;
        height: 43px;
    }


    .fidel-social-bar img {
        width: 23px;
        height: 23px;
    }


    .fidel-scroll-down {
        display: none;
    }

}


/* Móviles pequeños */

@media (max-width: 420px) {

    .fidel-hero {
        padding-top: 100px;
    }


    .fidel-hero h1 {
        font-size: 42px;
    }


    .fidel-hero-actions {
        flex-direction: column;

        align-items: center;
    }


    .fidel-btn {
        width: 100%;

        max-width: 290px;
    }


    .fidel-social-bar {
        gap: 7px;

        padding: 8px;
    }


    .fidel-social-bar a {
        width: 40px;
        height: 40px;
    }

}


/* =========================================================================================================================================

=========VAMOS CON LA SECCION DE LOS MANSORYCARD TOURS Y ARRIBA AL DESCRIPCION ATERIOR=============================================*/ 
/* =====================================================
   FIDEL EXPERIENCES
===================================================== */

.fidel-experiences {
    position: relative;
    padding: 110px 0;
    background: #f4f1e9;
    overflow: hidden;
}


/* Decorative background detail */

.fidel-experiences::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border: 1px solid rgba(26, 55, 39, 0.08);
    border-radius: 50%;
    right: -170px;
    top: -170px;
    pointer-events: none;
}

.fidel-experiences::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    border: 1px solid rgba(26, 55, 39, 0.06);
    border-radius: 50%;
    right: -80px;
    top: -80px;
    pointer-events: none;
}


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

.fidel-experiences-header {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 80px;

    align-items: end;

    margin-bottom: 55px;
}


.fidel-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 20px;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;

    color: #52735a;
}


.fidel-eyebrow span {
    display: block;

    width: 45px;
    height: 2px;

    background: #d99532;
}


.fidel-experiences-header h2 {
    margin: 0;

    max-width: 720px;

    font-size: clamp(42px, 5vw, 72px);
    line-height: .98;

    font-weight: 700;

    letter-spacing: -2.5px;

    color: #17231a;
}


.fidel-experiences-header h2 strong {
    display: block;

    margin-top: 7px;

    color: #b96d22;

    font-weight: 700;
}


.fidel-experiences-description {
    max-width: 510px;
    padding-bottom: 4px;
}


.fidel-experiences-description p {
    margin: 0 0 13px;

    color: #5f665f;

    line-height: 1.8;

    font-size: 15px;
}


.fidel-experiences-description p:last-child {
    margin-bottom: 0;
}


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

.fidel-tour-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 270px;

    gap: 16px;
}


/* GENERAL CARD */

.fidel-tour-card {
    position: relative;

    display: block;

    overflow: hidden;

    border-radius: 5px;

    background: #182319;

    text-decoration: none;

    isolation: isolate;
}


.fidel-tour-card img {
    position: absolute;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .8s cubic-bezier(.2,.7,.2,1),
        filter .5s ease;
}


/* CARD SIZES */

.fidel-tour-featured {
    grid-column: span 7;
    grid-row: span 2;
}


.fidel-tour-medium {
    grid-column: span 5;
}


.fidel-tour-small {
    grid-column: span 5;
}


.fidel-tour-wide {
    grid-column: span 7;
}


/* =====================================================
   OVERLAY
===================================================== */

.fidel-card-shade {
    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.05) 10%,
            rgba(0,0,0,.12) 45%,
            rgba(8,18,12,.88) 100%
        );

    transition: background .4s ease;
}


/* =====================================================
   CATEGORY
===================================================== */

.fidel-tour-category {
    position: absolute;

    top: 22px;
    left: 22px;

    z-index: 3;

    padding: 8px 13px;

    border-radius: 2px;

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

    color: #1a3223;

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

    letter-spacing: 1.7px;

    backdrop-filter: blur(5px);
}


/* =====================================================
   ARROW
===================================================== */

.fidel-card-arrow {
    position: absolute;

    top: 20px;
    right: 20px;

    z-index: 3;

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

    width: 42px;
    height: 42px;

    border-radius: 50%;

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

    color: white;

    font-size: 21px;

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


/* =====================================================
   CONTENT
===================================================== */

.fidel-tour-content {
    position: absolute;

    z-index: 3;

    left: 27px;
    right: 27px;
    bottom: 27px;
}


.fidel-tour-number {
    display: block;

    margin-bottom: 7px;

    color: #e6b05c;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 2px;
}


.fidel-tour-content h3 {
    margin: 0;

    color: #fff;

    font-size: clamp(22px, 2vw, 32px);

    line-height: 1.08;

    font-weight: 700;

    letter-spacing: -.6px;
}


.fidel-tour-content p {
    max-width: 440px;

    margin: 9px 0 0;

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

    line-height: 1.6;

    font-size: 13px;
}


/* Featured card title */

.fidel-tour-featured .fidel-tour-content {
    left: 36px;
    bottom: 35px;
}


.fidel-tour-featured .fidel-tour-content h3 {
    max-width: 540px;

    font-size: clamp(33px, 4vw, 49px);

    letter-spacing: -1.2px;
}


/* =====================================================
   HOVER
===================================================== */

@media (hover: hover) {

    .fidel-tour-card:hover img {
        transform: scale(1.075);
        filter: saturate(1.08);
    }


    .fidel-tour-card:hover .fidel-card-shade {
        background:
            linear-gradient(
                180deg,
                rgba(0,0,0,.02) 5%,
                rgba(0,0,0,.08) 40%,
                rgba(8,18,12,.93) 100%
            );
    }


    .fidel-tour-card:hover .fidel-card-arrow {
        background: #e1a347;
        border-color: #e1a347;

        color: #152219;

        transform: rotate(45deg);
    }
}


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

@media (max-width: 991px) {

    .fidel-experiences {
        padding: 80px 0;
    }


    .fidel-experiences-header {
        grid-template-columns: 1fr;
        gap: 25px;

        margin-bottom: 40px;
    }


    .fidel-experiences-description {
        max-width: 650px;
    }


    .fidel-tour-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 320px;
    }


    .fidel-tour-featured {
        grid-column: span 2;
        grid-row: span 1;
    }


    .fidel-tour-medium,
    .fidel-tour-small {
        grid-column: span 1;
    }


    .fidel-tour-wide {
        grid-column: span 2;
    }

}


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

@media (max-width: 575px) {

    .fidel-experiences {
        padding: 65px 0;
    }


    .fidel-experiences-header {
        margin-bottom: 32px;
    }


    .fidel-eyebrow {
        font-size: 10px;
        letter-spacing: 2px;
    }


    .fidel-experiences-header h2 {
        font-size: 39px;

        letter-spacing: -1.5px;
    }


    .fidel-experiences-description p {
        font-size: 14px;
    }


    .fidel-experiences-description p + p {
        display: none;
    }


    .fidel-tour-grid {
        display: flex;
        flex-direction: column;

        gap: 14px;
    }


    .fidel-tour-card,
    .fidel-tour-featured,
    .fidel-tour-medium,
    .fidel-tour-small,
    .fidel-tour-wide {
        width: 100%;
        height: 350px;
    }


    .fidel-tour-featured {
        height: 430px;
    }


    .fidel-tour-category {
        top: 18px;
        left: 18px;

        padding: 7px 11px;
    }


    .fidel-card-arrow {
        top: 17px;
        right: 17px;

        width: 39px;
        height: 39px;
    }


    .fidel-tour-content,
    .fidel-tour-featured .fidel-tour-content {
        left: 22px;
        right: 22px;
        bottom: 23px;
    }


    .fidel-tour-content h3,
    .fidel-tour-featured .fidel-tour-content h3 {
        font-size: 27px;
    }


    .fidel-tour-content p {
        font-size: 13px;
    }

}
/****** SECCION DE POQUE NOSOTROS===========================================================================================================================
======================================================================================================*/ 
/* =====================================================
   WHY ATV TOURS WITH FIDEL
===================================================== */

.fidel-why {
    position: relative;

    padding: 110px 0;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f6f3ec 100%
        );

    overflow: hidden;
}


/* Decorative detail */

.fidel-why::before {
    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    border-radius: 50%;

    background: rgba(213, 150, 63, .07);

    top: -220px;
    right: -150px;

    pointer-events: none;
}


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

.fidel-why-header {

    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns: 1.1fr .9fr;

    gap: 80px;

    align-items: end;

    margin-bottom: 60px;
}


.fidel-mini-title {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 18px;

    color: #b66c23;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2.5px;
}


.fidel-mini-title::before {

    content: "";

    width: 35px;
    height: 2px;

    background: #b66c23;
}


.fidel-why-title h2 {

    max-width: 720px;

    margin: 0;

    color: #17251b;

    font-size: clamp(40px, 5vw, 68px);

    line-height: 1.03;

    letter-spacing: -2px;

    font-weight: 700;
}


.fidel-why-title h2 span {

    display: block;

    color: #b66c23;
}


.fidel-why-intro {

    max-width: 500px;
}


.fidel-why-intro p {

    margin: 0 0 13px;

    color: #616861;

    font-size: 15px;

    line-height: 1.8;
}


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

.fidel-benefit-grid {

    display: grid;

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

    gap: 16px;

    margin-bottom: 18px;
}


.fidel-benefit-card {

    position: relative;

    min-height: 330px;

    padding: 38px 32px;

    background: #fff;

    border: 1px solid rgba(25, 54, 38, .09);

    border-radius: 8px;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.fidel-benefit-number {

    position: absolute;

    top: 25px;
    right: 25px;

    color: rgba(25, 54, 38, .15);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 2px;
}


.fidel-benefit-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 58px;
    height: 58px;

    margin-bottom: 50px;

    border-radius: 50%;

    background: #1f3828;

    color: #fff;

    font-size: 24px;
}


.fidel-benefit-card h3 {

    margin-bottom: 12px;

    color: #1b2a20;

    font-size: 23px;

    font-weight: 700;
}


.fidel-benefit-card p {

    margin: 0;

    color: #666d67;

    font-size: 14px;

    line-height: 1.75;
}


.fidel-benefit-card:hover {

    transform: translateY(-6px);

    border-color: rgba(182, 108, 35, .35);

    box-shadow: 0 18px 45px rgba(20, 37, 25, .08);
}


/* =====================================================
   EXPERIENCE STRIP
===================================================== */

.fidel-experience-strip {

    display: grid;

    grid-template-columns: 1fr 1fr auto;

    gap: 35px;

    align-items: center;

    padding: 38px 40px;

    margin-bottom: 18px;

    background: #1b2f22;

    border-radius: 8px;
}


.fidel-strip-label {

    display: block;

    margin-bottom: 8px;

    color: #e2aa55;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;
}


.fidel-strip-left h3 {

    margin: 0;

    color: #fff;

    font-size: 28px;

    line-height: 1.15;
}


.fidel-strip-center p {

    margin: 0;

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

    font-size: 14px;

    line-height: 1.7;
}


.fidel-contact-btn {

    display: inline-flex;

    align-items: center;

    gap: 18px;

    padding: 16px 21px;

    border-radius: 5px;

    background: #d88732;

    color: #fff;

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;

    white-space: nowrap;

    transition: .3s ease;
}


.fidel-contact-btn span {

    font-size: 17px;
}


.fidel-contact-btn:hover {

    background: #ef9c43;

    color: #fff;

    transform: translateY(-2px);
}


/* =====================================================
   TRUST AREA
===================================================== */

.fidel-trust {

    display: grid;

    grid-template-columns: auto 1fr auto;

    gap: 28px;

    align-items: center;

    padding: 32px 38px;

    background: #fff;

    border: 1px solid rgba(21, 51, 34, .09);

    border-radius: 8px;
}


.fidel-trust-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 72px;
    height: 72px;

    border-radius: 50%;

    background: #f1eee7;

    color: #b66c23;

    font-size: 30px;
}


.fidel-trust-small {

    display: block;

    margin-bottom: 4px;

    color: #b66c23;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;
}


.fidel-trust-content h3 {

    margin: 0 0 6px;

    color: #1c2c21;

    font-size: 21px;

    font-weight: 700;
}


.fidel-trust-content p {

    max-width: 680px;

    margin: 0;

    color: #697069;

    font-size: 13px;

    line-height: 1.6;
}


.fidel-trust-badge {

    text-align: right;
}


.fidel-rating {

    display: flex;

    gap: 3px;

    margin-bottom: 6px;

    color: #d79132;

    font-size: 13px;
}


.fidel-trust-badge span {

    color: #586159;

    font-size: 11px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;
}


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

@media (max-width: 991px) {

    .fidel-why {

        padding: 80px 0;
    }


    .fidel-why-header {

        grid-template-columns: 1fr;

        gap: 30px;
    }


    .fidel-benefit-grid {

        grid-template-columns: 1fr;
    }


    .fidel-benefit-card {

        min-height: auto;
    }


    .fidel-benefit-icon {

        margin-bottom: 35px;
    }


    .fidel-experience-strip {

        grid-template-columns: 1fr;

        gap: 20px;
    }


    .fidel-strip-action {

        margin-top: 5px;
    }

}


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

@media (max-width: 575px) {

    .fidel-why {

        padding: 65px 0;
    }


    .fidel-why-header {

        margin-bottom: 40px;
    }


    .fidel-why-title h2 {

        font-size: 39px;

        letter-spacing: -1.5px;
    }


    .fidel-benefit-card {

        padding: 30px 25px;
    }


    .fidel-benefit-icon {

        width: 52px;
        height: 52px;

        margin-bottom: 30px;

        font-size: 21px;
    }


    .fidel-experience-strip {

        padding: 30px 25px;
    }


    .fidel-strip-left h3 {

        font-size: 24px;
    }


    .fidel-contact-btn {

        width: 100%;

        justify-content: space-between;
    }


    .fidel-trust {

        grid-template-columns: auto 1fr;

        padding: 25px;

        gap: 18px;
    }


    .fidel-trust-icon {

        width: 55px;
        height: 55px;

        font-size: 23px;
    }


    .fidel-trust-badge {

        grid-column: 1 / -1;

        padding-top: 15px;

        border-top: 1px solid #eee;

        text-align: left;
    }

}

/*==================================================================================================================================
REEMPLAZO DEL MONO
====================================================================================================================================*/ 
/* =====================================================
   DISCOVER GUANACASTE
===================================================== */

.fidel-discover {
    padding: 110px 0;
    background: #f5f2ea;
}


/* =====================================================
   MAIN VISUAL
===================================================== */

.fidel-discover-visual {
    position: relative;

    min-height: 680px;

    overflow: hidden;

    border-radius: 12px;

    background: #1a271d;
}


.fidel-discover-img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* subtle image treatment */

.fidel-discover-visual::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(12, 27, 18, .22) 0%,
            rgba(12, 27, 18, .05) 52%,
            rgba(12, 27, 18, .08) 100%
        );

    pointer-events: none;
}


/* =====================================================
   LOCATION TAG
===================================================== */

.fidel-discover-tag {
    position: absolute;

    top: 30px;
    right: 30px;

    z-index: 3;

    display: flex;
    flex-direction: column;

    padding: 14px 18px;

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

    border-radius: 5px;

    backdrop-filter: blur(8px);

    box-shadow: 0 10px 30px rgba(0,0,0,.08);
}


.fidel-discover-tag span {
    color: #1c3525;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 2px;
}


.fidel-discover-tag small {
    margin-top: 2px;

    color: #9a642b;

    font-size: 11px;
}


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

.fidel-discover-card {
    position: absolute;

    z-index: 4;

    left: 45px;
    bottom: 45px;

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

    padding: 45px;

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

    border-radius: 8px;

    box-shadow:
        0 25px 60px rgba(0,0,0,.18);

    backdrop-filter: blur(10px);
}


.fidel-discover-kicker {
    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 17px;

    color: #b56c28;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2.4px;
}


.fidel-discover-kicker::before {
    content: "";

    width: 32px;
    height: 2px;

    background: #b56c28;
}


.fidel-discover-card h2 {
    margin: 0 0 23px;

    color: #18281d;

    font-size: clamp(36px, 4vw, 55px);

    line-height: 1.02;

    letter-spacing: -2px;

    font-weight: 700;
}


.fidel-discover-card h2 span {
    display: block;

    color: #b56c28;
}


.fidel-discover-card p {
    margin: 0 0 13px;

    color: #646c66;

    font-size: 14px;

    line-height: 1.75;
}


/* =====================================================
   BUTTON
===================================================== */

.fidel-discover-btn {
    display: inline-flex;

    align-items: center;

    justify-content: space-between;

    gap: 28px;

    margin-top: 17px;

    padding: 15px 20px;

    background: #1d3828;

    border-radius: 4px;

    color: #fff;

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;

    transition:
        transform .25s ease,
        background .25s ease;
}


.fidel-discover-btn span {
    font-size: 19px;

    transition: transform .25s ease;
}


.fidel-discover-btn:hover {
    background: #b56c28;

    color: #fff;

    transform: translateY(-2px);
}


.fidel-discover-btn:hover span {
    transform: translateX(4px);
}


/* =====================================================
   FEATURES STRIP
===================================================== */

.fidel-discover-features {
    display: grid;

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

    margin-top: 16px;

    background: #20372a;

    border-radius: 8px;

    overflow: hidden;
}


.fidel-discover-feature {
    display: flex;

    align-items: center;

    gap: 20px;

    padding: 28px 30px;

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


.fidel-discover-feature:last-child {
    border-right: none;
}


.feature-number {
    color: #dca052;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;
}


.fidel-discover-feature div {
    display: flex;

    flex-direction: column;
}


.fidel-discover-feature strong {
    color: #fff;

    font-size: 17px;

    font-weight: 700;
}


.fidel-discover-feature small {
    margin-top: 3px;

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

    font-size: 12px;
}


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

@media (max-width: 991px) {

    .fidel-discover {
        padding: 80px 0;
    }


    .fidel-discover-visual {
        min-height: 720px;
    }


    .fidel-discover-card {
        left: 30px;
        bottom: 30px;

        width: calc(100% - 60px);
    }


    .fidel-discover-features {
        grid-template-columns: 1fr;
    }


    .fidel-discover-feature {
        border-right: none;

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


    .fidel-discover-feature:last-child {
        border-bottom: none;
    }

}


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

@media (max-width: 575px) {

    .fidel-discover {
        padding: 60px 0;
    }


    .fidel-discover-visual {
        min-height: auto;

        display: flex;
        flex-direction: column;

        background: transparent;

        overflow: visible;
    }


    .fidel-discover-img {
        position: relative;

        height: 390px;

        border-radius: 10px;

        object-fit: cover;
    }


    .fidel-discover-visual::after {
        display: none;
    }


    .fidel-discover-tag {
        top: 18px;
        right: 18px;
    }


    .fidel-discover-card {
        position: relative;

        left: auto;
        bottom: auto;

        width: calc(100% - 24px);

        margin: -45px auto 0;

        padding: 30px 25px;
    }


    .fidel-discover-card h2 {
        font-size: 37px;

        letter-spacing: -1.5px;
    }


    .fidel-discover-card p {
        font-size: 13px;
    }


    .fidel-discover-btn {
        width: 100%;

        justify-content: space-between;
    }


    .fidel-discover-features {
        margin-top: 14px;
    }

}