/* Frontend + editor shared styles */
.ic-what-explore {
    position: relative;
    overflow: hidden;
    background: var(--ic-explore-bg, #141a20);
    color: var(--ic-explore-text, #d0ccc6);
    padding-top: var(--ic-explore-pt-mobile, 80px);
    padding-bottom: var(--ic-explore-pb-mobile, 80px);
}

.ic-what-explore__container {
    width: min(var(--ic-explore-container-max, 1280px), calc(100% - (var(--ic-explore-side-mobile, 24px) * 2)));
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.ic-what-explore__heading-wrap {
    max-width: 900px;
    margin: 0 0 var(--ic-explore-heading-space, 56px);
}

.ic-what-explore--centered .ic-what-explore__heading-wrap {
    margin-inline: auto;
    text-align: center;
}

.ic-what-explore__eyebrow {
    margin: 0 0 1rem;
    color: var(--ic-explore-accent, #c5a95e);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ic-what-explore__heading {
    margin: 0 0 1.25rem;
    color: var(--ic-explore-heading, #faf8f5);
    font-size: var(--ic-explore-heading-size-mobile, 40px);
    line-height: var(--ic-explore-heading-line-height, 1.1);
    font-weight: 700;
    text-wrap: balance;
}

.ic-what-explore__description {
    margin: 0;
    color: var(--ic-explore-text, #d0ccc6);
    font-size: var(--ic-explore-description-size-mobile, 19px);
    line-height: var(--ic-explore-description-line-height, 1.75);
}

.ic-what-explore__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--ic-explore-gap-mobile, 18px);
    max-width: var(--ic-explore-content-max, 1180px);
}

.ic-what-explore__item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    align-items: start;
    padding: var(--ic-explore-item-py, 18px) var(--ic-explore-item-px, 0px);
    border-top: var(--ic-explore-divider-thickness, 1px) solid var(--ic-explore-divider, rgba(255,255,255,0.12));
    transition: transform 0.25s ease, border-color 0.25s ease;
}

.ic-what-explore__list .ic-what-explore__item:last-child {
    border-bottom: var(--ic-explore-divider-thickness, 1px) solid var(--ic-explore-divider, rgba(255,255,255,0.12));
}

.ic-what-explore--hover-shift .ic-what-explore__item:hover {
    transform: translateX(6px);
    border-color: var(--ic-explore-item-hover, rgba(197,169,94,0.35));
}

.ic-what-explore__index {
    width: var(--ic-explore-index-size, 34px);
    height: var(--ic-explore-index-size, 34px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ic-explore-index-border, rgba(255,255,255,0.18));
    border-radius: 999px;
    color: var(--ic-explore-index-text, #faf8f5);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.ic-what-explore__item-main {
    min-width: 0;
}

.ic-what-explore__item-eyebrow {
    margin: 0 0 6px;
    color: var(--ic-explore-accent, #c5a95e);
    font-size: var(--ic-explore-item-eyebrow-size, 12px);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ic-what-explore__item-title {
    margin: 0 0 8px;
    color: var(--ic-explore-heading, #faf8f5);
    font-size: var(--ic-explore-item-title-size, 26px);
    line-height: 1.25;
    font-weight: 600;
}

.ic-what-explore__item-description {
    margin: 0;
    color: var(--ic-explore-text, #d0ccc6);
    font-size: var(--ic-explore-item-body-size, 16px);
    line-height: var(--ic-explore-item-body-line-height, 1.7);
}

.ic-what-explore--animate .ic-what-explore__heading-wrap {
    opacity: 0;
    animation: icExploreFadeUp var(--ic-explore-animation-duration, 0.8s) ease-out var(--ic-explore-animation-delay, 0s) forwards;
}

.ic-what-explore--animate .ic-what-explore__item {
    opacity: 0;
    animation: icExploreFadeUp var(--ic-explore-animation-duration, 0.8s) ease-out forwards;
}

.ic-what-explore--animate .ic-what-explore__item:nth-child(1) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.12s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(2) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.20s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(3) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.28s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(4) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.36s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(5) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.44s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(6) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.52s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(7) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.60s); }
.ic-what-explore--animate .ic-what-explore__item:nth-child(8) { animation-delay: calc(var(--ic-explore-animation-delay, 0s) + 0.68s); }

@keyframes icExploreFadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (min-width: 1024px) {
    .ic-what-explore {
        padding-top: var(--ic-explore-pt-desktop, 128px);
        padding-bottom: var(--ic-explore-pb-desktop, 128px);
    }

    .ic-what-explore__container {
        width: min(var(--ic-explore-container-max, 1280px), calc(100% - (var(--ic-explore-side-desktop, 48px) * 2)));
    }

    .ic-what-explore__heading {
        font-size: var(--ic-explore-heading-size-desktop, 56px);
    }

    .ic-what-explore__description {
        font-size: var(--ic-explore-description-size-desktop, 21px);
    }

    .ic-what-explore__list {
        grid-template-columns: repeat(var(--ic-explore-columns-desktop, 2), minmax(0, 1fr));
        gap: var(--ic-explore-gap-desktop, 24px) 36px;
    }

    .ic-what-explore__item {
        min-height: 100%;
    }
}


/* Frontend-only scroll animation support */
.ic-what-explore.ic-animate-on-scroll .ic-what-explore__heading-wrap,
.ic-what-explore.ic-animate-on-scroll .ic-what-explore__item { animation-play-state: paused; }
.ic-what-explore.ic-animate-on-scroll.is-visible .ic-what-explore__heading-wrap,
.ic-what-explore.ic-animate-on-scroll.is-visible .ic-what-explore__item { animation-play-state: running; }