/* Ajuste cromático de las escenas según la referencia aprobada. */
.df-guide-feature {
    background:
        linear-gradient(90deg, #0b0c0c 0%, rgba(11,12,12,.985) 27%, rgba(11,12,12,.86) 47%, rgba(11,12,12,.46) 71%, rgba(11,12,12,.10) 100%),
        linear-gradient(0deg, rgba(10,11,11,.39), rgba(10,11,11,.03)),
        var(--guide-section-image) center/cover no-repeat;
    height: auto;
    min-height: 336px;
}

.df-guide-feature__copy {
    color: #bcb7b0;
}

/* Pregunta y respuesta directa: composición editorial propia de las guías. */
.df-answer {
    background: #020707;
    border: 1px solid rgba(94, 222, 209, .62);
    border-radius: 22px;
    color: #fff;
    margin: 0 0 88px;
    overflow: hidden;
    position: relative;
    transform: translateX(-50%);
    max-width: none;
    width: 64.4vw;
    left: 50%;
}

.df-answer::before {
    background: linear-gradient(90deg, rgba(1,7,8,.99) 0%, rgba(1,7,8,.93) 41%, rgba(1,7,8,.43) 70%, rgba(1,7,8,.04) 100%), var(--df-answer-image) center/cover no-repeat;
    content: "";
    inset: 0 0 auto;
    height: 382px;
    position: absolute;
}

.df-answer::after {
    background: #20dfcc;
    content: "";
    height: calc(100% - 76px);
    left: 54px;
    position: absolute;
    top: 52px;
    width: 3px;
    z-index: 1;
}

.df-answer__question, .df-answer__response { padding-left: 104px; padding-right: 64px; position: relative; z-index: 2; }
.df-answer__question { min-height: 382px; padding-bottom: 44px; padding-top: 54px; }
.df-answer__meta { align-items: center; color: #1ddbc9; display: flex; font: 600 14px/1 Poppins, Arial, sans-serif; gap: 27px; letter-spacing: .25em; text-transform: uppercase; }
.df-answer__meta span:first-child { letter-spacing: .12em; }
.df-answer h2 { color: #fff; font: 700 clamp(30px, 2.75vw, 48px)/1.08 Poppins, Arial, sans-serif; letter-spacing: -.035em; margin: 29px 0 0; max-width: 670px; }
.df-answer__rule { background: #20dfcc; display: block; height: 5px; margin-top: 28px; width: 57px; }
.df-answer__response { border-top: 1px solid rgba(164, 184, 186, .48); min-height: 238px; padding-bottom: 42px; padding-top: 39px; }
.df-answer__response .df-answer__rule { height: 4px; margin-top: 22px; width: 31px; }
.df-answer__response-copy { align-items: center; display: flex; gap: 23px; margin-top: 23px; max-width: 850px; }
.df-answer__response-copy > i { align-items: center; border: 2px solid rgba(32, 223, 204, .48); border-radius: 50%; color: #20dfcc; display: inline-flex; flex: 0 0 66px; font-size: 25px; height: 66px; justify-content: center; }
.df-answer__response-copy p { border-left: 1px solid rgba(171, 190, 192, .45); color: rgba(255,255,255,.85); font: 400 clamp(16px, 1.2vw, 19px)/1.5 Lato, Arial, sans-serif; margin: 0; padding-left: 23px; }

@media (max-width: 700px) {
    .df-answer { border-radius: 14px; margin-bottom: 58px; max-width: none; transform: none; width: 100%; left: auto; }
    .df-answer::before { height: 510px; }
    .df-answer::after { height: calc(100% - 70px); left: 26px; top: 42px; width: 2px; }
    .df-answer__question, .df-answer__response { padding-left: 58px; padding-right: 25px; }
    .df-answer__question { min-height: 510px; padding-bottom: 40px; padding-top: 48px; }
    .df-answer__meta { font-size: 11px; gap: 18px; letter-spacing: .2em; }
    .df-answer h2 { font-size: 38px; margin-top: 31px; }
    .df-answer__rule { height: 4px; margin-top: 30px; width: 52px; }
    .df-answer__response { min-height: 0; padding-bottom: 36px; padding-top: 39px; }
    .df-answer__response-copy { align-items: flex-start; gap: 15px; margin-top: 24px; }
    .df-answer__response-copy > i { flex-basis: 52px; font-size: 19px; height: 52px; }
    .df-answer__response-copy p { font-size: 18px; padding-left: 17px; }
}

.df-guide-feature__details {
    margin-top: 18px;
}

.df-guide-feature__details summary {
    color: #c39032;
    cursor: pointer;
    font: 600 12px/1 Poppins, Arial, sans-serif;
    letter-spacing: .12em;
    list-style: none;
    text-transform: uppercase;
}

.df-guide-feature__details summary::-webkit-details-marker { display: none; }
.df-guide-feature__details summary b { display: inline-block; font-size: 17px; margin-left: 5px; }
.df-guide-feature__less-label { display: none; }
.df-guide-feature__details[open] .df-guide-feature__more-label { display: none; }
.df-guide-feature__details[open] .df-guide-feature__less-label { display: inline; }
.df-guide-feature__excerpt:has(.df-guide-feature__details[open]) .df-guide-feature__preview { display: none; }

@media (max-width: 700px) {
    .df-guide-feature {
        background:
            linear-gradient(90deg, rgba(11,12,12,.99), rgba(11,12,12,.65)),
            linear-gradient(0deg, rgba(10,11,11,.44), rgba(10,11,11,.04)),
            var(--guide-section-image) center/cover no-repeat;
    }

}