/*
 * Adaptador Gutenberg de la nueva portada.
 *
 * Este archivo solo se carga en la plantilla Gutenberg y en el editor de
 * páginas. Los estilos históricos del tema quedan fuera de su alcance.
 */

.dn-home-main--blocks {
    overflow: hidden;
}

.dn-home-main--blocks > .dn-pattern,
.dn-pattern .wp-block-group,
.dn-pattern .wp-block-columns,
.dn-pattern .wp-block-column,
.dn-pattern .wp-block-image,
.dn-pattern .wp-block-heading,
.dn-pattern .wp-block-buttons,
.dn-pattern .wp-block-button,
.dn-pattern p {
    margin-block-start: 0;
    margin-block-end: 0;
}

.dn-pattern,
.dn-pattern * {
    box-sizing: border-box;
}

.dn-pattern.alignfull {
    width: 100%;
    max-width: none;
    margin-inline: 0;
}

/*
 * En temas clásicos, WordPress 7 añade un contenedor de compatibilidad dentro
 * de cada bloque Grupo. Sin esta regla los grids solo ven ese único hijo y
 * apilan todas las tarjetas en la primera columna.
 */
.dn-home-main--blocks .dn-pattern .wp-block-group__inner-container {
    display: contents;
}

/* Los estilos del bloque Columnas se imprimen después de los del tema. */
.dn-home-main--blocks .dn-pattern .dn-two-columns.wp-block-columns {
    display: grid;
    flex-wrap: initial;
}

/* Hero */
.dn-pattern--hero .dn-hero__media {
    margin: 0;
}

.dn-pattern--hero .dn-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.dn-pattern--hero .dn-hero__media::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(16, 25, 61, 0.52) 0%, rgba(18, 29, 65, 0.18) 48%, rgba(18, 29, 65, 0) 76%),
        linear-gradient(0deg, rgba(23, 29, 72, 0.22) 0%, rgba(23, 29, 72, 0) 50%);
    content: "";
    pointer-events: none;
}

.dn-pattern--hero .dn-hero__content {
    position: relative;
    z-index: 1;
}

/* Texto y botones nativos */
.dn-pattern .dn-copy > .wp-block-heading + p,
.dn-pattern .dn-copy > .wp-block-group__inner-container > .wp-block-heading + p {
    margin-top: 18px;
}

.dn-pattern .dn-copy > p + p,
.dn-pattern .dn-copy > .wp-block-group__inner-container > p + p {
    margin-top: 12px;
}

.dn-pattern .dn-copy > p + .dn-buttons,
.dn-pattern .dn-copy > .dn-buttons,
.dn-pattern .dn-copy > .wp-block-group__inner-container > p + .dn-buttons,
.dn-pattern .dn-copy > .wp-block-group__inner-container > .dn-buttons {
    margin-top: 22px;
}

.dn-pattern .dn-buttons {
    gap: 0;
}

.dn-pattern .dn-block-button .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 203px;
    min-height: 42px;
    padding: 11px 28px;
    border: 0;
    border-radius: 999px;
    background: var(--dn-orange);
    box-shadow: 0 4px 2px rgba(0, 0, 0, 0.24);
    color: var(--dn-white) !important;
    font-family: "Manrope", Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.1;
    text-decoration: none !important;
    transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.dn-pattern .dn-block-button .wp-block-button__link:hover,
.dn-pattern .dn-block-button .wp-block-button__link:focus-visible {
    background: #e38200;
    box-shadow: 0 7px 15px rgba(114, 63, 0, 0.28);
    transform: translateY(-2px);
}

/* Tarjetas de atracciones */
.dn-pattern .dn-services-grid.wp-block-group {
    display: grid;
    margin-top: 24px;
}

.dn-pattern .dn-service-card.wp-block-group {
    position: relative;
    display: block;
    overflow: visible;
    aspect-ratio: 321.676 / 391.784;
    border-radius: 30px;
    container-type: size;
    filter: drop-shadow(0 14px 18px rgba(37, 80, 126, 0.2));
    isolation: isolate;
    transform: translateZ(0);
    transform-origin: center bottom;
    transition:
        filter 420ms ease,
        transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dn-pattern .dn-service-card .dn-service-card__image {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    overflow: hidden;
    margin: 0;
    border-radius: 28px;
    background: #d7eef8;
    clip-path: polygon(
        10% 0%,
        50% 3%,
        87% 6%,
        93% 7%,
        97% 12%,
        98% 18%,
        98% 84%,
        97% 90%,
        91% 95%,
        12% 100%,
        6% 99%,
        2% 94%,
        1% 88%,
        1% 15%,
        2% 8%,
        5% 3%
    );
    transition: clip-path 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dn-pattern .dn-service-card .dn-service-card__image::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(0deg, rgba(13, 29, 67, 0.62) 0%, rgba(13, 29, 67, 0.06) 48%, rgba(13, 29, 67, 0) 72%);
    content: "";
    pointer-events: none;
}

.dn-pattern .dn-service-card .dn-service-card__image img {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.025);
    transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dn-pattern .dn-service-card__title {
    position: absolute;
    z-index: 2;
    top: 81.07%;
    right: 4.88%;
    bottom: auto;
    left: 6.22%;
    color: var(--dn-white);
    font-family: "Ubuntu", Arial, sans-serif;
    font-size: clamp(17px, 1.75vw, 26px);
    font-weight: 700;
    line-height: 1.05;
    text-shadow: 0 2px 10px rgba(13, 33, 76, 0.6);
    transition: top 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dn-pattern .dn-service-card__title a {
    color: inherit;
    text-decoration: none;
}

.dn-pattern .dn-service-card__title a::after {
    position: absolute;
    z-index: 3;
    top: -81.07cqh;
    left: -6.22cqw;
    width: 100cqw;
    height: 100cqh;
    border-radius: 28px;
    content: "";
    transition: top 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dn-pattern .dn-service-card:hover,
.dn-pattern .dn-service-card:focus-within {
    z-index: 3;
    filter: saturate(1.04) drop-shadow(0 21px 25px rgba(37, 80, 126, 0.3));
    transform: translateY(-14px) scale(1.0725);
}

.dn-pattern .dn-service-card:hover .dn-service-card__image,
.dn-pattern .dn-service-card:focus-within .dn-service-card__image {
    clip-path: polygon(
        8% 0%,
        50% 0%,
        92% 0%,
        96% 1%,
        99% 4%,
        100% 8%,
        100% 92%,
        99% 96%,
        96% 99%,
        8% 100%,
        4% 99%,
        1% 96%,
        0% 92%,
        0% 8%,
        1% 4%,
        4% 1%
    );
}

.dn-pattern .dn-service-card:hover .dn-service-card__image img,
.dn-pattern .dn-service-card:focus-within .dn-service-card__image img {
    transform: scale(1);
}

.dn-pattern .dn-service-card:hover .dn-service-card__title,
.dn-pattern .dn-service-card:focus-within .dn-service-card__title {
    top: 76.31%;
}

.dn-pattern .dn-service-card:hover .dn-service-card__title a::after,
.dn-pattern .dn-service-card:focus-within .dn-service-card__title a::after {
    top: -76.31cqh;
}

/* Fotografías anguladas */
.dn-pattern .dn-media-column .dn-angled-media {
    margin: 0;
}

.dn-pattern--event .dn-media-column .dn-angled-media {
    margin-left: auto;
}

/* Tarjetas de ventajas */
.dn-pattern .dn-benefits-grid.wp-block-group {
    display: grid;
    margin-top: 42px;
}

.dn-pattern .dn-benefit-card.wp-block-group {
    overflow: visible;
    background: url(../img/home/feature-card.svg) center / 100% 100% no-repeat;
}

.dn-pattern .dn-benefit-card.wp-block-group:last-child {
    background-image: url(../img/home/feature-card-last.svg);
}

.dn-pattern .dn-benefit-card__content.wp-block-group {
    display: flex;
}

.dn-pattern .dn-benefit-card__icon.wp-block-image {
    flex: 0 0 auto;
    width: auto;
    height: 27px;
    margin: 0 0 17px;
}

.dn-pattern .dn-benefit-card__icon img {
    width: auto;
    max-width: 100%;
    height: 27px;
}

/* FAQ con el bloque Detalles de WordPress */
.dn-pattern .dn-block-faq__item {
    overflow: hidden;
    margin: 0;
    border: 0;
    border-bottom: 1px solid rgba(230, 230, 230, 0.95);
    border-radius: 20px;
    background: transparent;
    transition: background-color 260ms ease, box-shadow 260ms ease, transform 260ms ease;
}

.dn-pattern .dn-block-accordion.wp-block-group {
    margin-top: 31px;
}

.dn-pattern .dn-block-faq__item.is-open,
.dn-pattern .dn-block-faq__item:not(.is-enhanced)[open] {
    background: rgba(62, 62, 171, 0.16);
    box-shadow: 0 16px 36px rgba(39, 72, 124, 0.14);
    transform: translateY(-2px);
}

.dn-pattern .dn-block-faq__item > summary {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 69px;
    padding: 18px 60px 18px 28px;
    color: var(--dn-white);
    cursor: pointer;
    font-family: "Manrope", Arial, sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 28px;
    list-style: none;
    text-align: left;
}

.dn-pattern .dn-block-faq__item > summary::-webkit-details-marker {
    display: none;
}

.dn-pattern .dn-block-faq__item > summary::marker {
    content: "";
}

.dn-pattern .dn-block-faq__item > summary::after {
    position: absolute;
    top: 50%;
    right: 28px;
    width: 16px;
    height: 16px;
    background: url(../img/home/icon-chevron.svg) center / contain no-repeat;
    content: "";
    transform: translateY(-50%);
    transition: transform 360ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.dn-pattern .dn-block-faq__item > summary:focus-visible {
    border-radius: 18px;
    outline: 2px solid rgba(255, 255, 255, 0.95);
    outline-offset: -5px;
}

.dn-pattern .dn-block-faq__item.is-open > summary::after,
.dn-pattern .dn-block-faq__item:not(.is-enhanced)[open] > summary::after {
    transform: translateY(-50%) rotate(180deg);
}

.dn-block-faq__panel {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 380ms cubic-bezier(0.22, 1, 0.36, 1), opacity 240ms ease;
}

.dn-block-faq__panel-inner {
    overflow: hidden;
}

.dn-pattern .dn-block-faq__item.is-open .dn-block-faq__panel {
    grid-template-rows: 1fr;
    opacity: 1;
}

.dn-pattern .dn-block-faq__panel p,
.dn-pattern .dn-block-faq__item:not(.is-enhanced) > p {
    max-width: 816px;
    padding: 0 28px 22px;
    color: rgba(255, 255, 255, 0.94);
    font-size: 15px;
    line-height: 1.55;
}

.dn-pattern .dn-block-faq__panel p + p,
.dn-pattern .dn-block-faq__item:not(.is-enhanced) > p + p {
    margin-top: 10px;
}

@media (max-width: 960px) {
    .dn-pattern .dn-services-grid.wp-block-group {
        margin-top: 30px;
    }

    .dn-pattern .dn-service-card__title {
        font-size: clamp(21px, 3.2vw, 28px);
    }
}

@media (max-width: 740px) {
    .dn-pattern--hero .dn-hero__media img {
        object-position: 55% center;
    }

    .dn-pattern--hero .dn-hero__media::after {
        background: linear-gradient(0deg, rgba(17, 28, 72, 0.58) 0%, rgba(17, 28, 72, 0.05) 68%);
    }

    .dn-pattern .dn-two-columns--reverse-mobile .dn-media-column {
        order: 1;
    }

    .dn-pattern .dn-two-columns--reverse-mobile .dn-copy {
        order: 2;
    }

    .dn-pattern .dn-media-column .dn-angled-media {
        margin-inline: auto;
    }

    .dn-pattern .dn-service-card__title {
        font-size: clamp(17px, 4vw, 24px);
    }

    .dn-pattern .dn-block-faq__item > summary {
        min-height: 64px;
        padding: 17px 50px 17px 18px;
        font-size: 16px;
    }

    .dn-pattern .dn-block-faq__item > summary::after {
        right: 18px;
    }

    .dn-pattern .dn-block-faq__panel p,
    .dn-pattern .dn-block-faq__item:not(.is-enhanced) > p {
        padding: 0 18px 20px;
    }
}

@media (max-width: 480px) {
    .dn-pattern--hero .dn-hero__media img {
        object-position: 58% center;
    }

    .dn-pattern .dn-service-card__title {
        font-size: 25px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dn-pattern *,
    .dn-pattern *::before,
    .dn-pattern *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}
