/* Entry exists only inside the opted-in continuous journey. */
.dc-journey .dc-entry {
    position: absolute;
    inset: 0;
    overflow: clip;
    z-index: 8;
    background: transparent;
    pointer-events: none;
}
.dc-journey .dc-entry__image {
    position: absolute;
    inset: -5%;
    width: 110%;
    height: 110%;
    max-width: none;
    object-fit: cover;
    object-position: var(--dc-entry-focus, 50% 55%);
    transform-origin: var(--dc-entry-focus, 50% 55%);
}
.dc-journey .dc-entry__shade {
    position: absolute;
    inset: -5%;
    background: linear-gradient(90deg, rgb(10 9 7 / 75%), rgb(10 9 7 / 8%)), radial-gradient(ellipse at 55% 45%, transparent, rgb(10 9 7 / 50%));
}
.dc-journey .dc-entry__copy {
    position: absolute;
    inset: 0 7%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #f1e8dc;
}
.dc-journey .dc-entry__title {
    font-family: var(--e-global-typography-primary-font-family, "Cormorant Garamond"), Georgia, serif;
    font-size: clamp(64px, 10vw, 180px);
    font-weight: 400;
    line-height: .9;
    letter-spacing: -.05em;
    margin: 0;
    color: inherit;
}
.dc-journey .dc-entry__label { font: 500 10px/1.5 sans-serif; letter-spacing: .26em; margin-bottom: 26px; }
.dc-journey .dc-entry__placeholder { position: absolute; bottom: 22px; left: 7%; max-width: 80%; color: #eee4d7; font: 12px/1.5 sans-serif; }
.dc-journey .dc-entry__threshold { position: absolute; inset: 0; background: #0b0907; opacity: 0; }
.dc-journey .dc-entry__jamb { position: absolute; inset: 0 auto 0 0; width: 8%; background: #0b0907; transform: scaleX(0); transform-origin: left; }
.dc-journey .dc-entry__jamb--right { left: auto; right: 0; transform-origin: right; }
@media (max-width: 600px) {
    .dc-journey .dc-entry__title { font-size: clamp(60px, 16vw, 96px); }
    .dc-journey .dc-entry__image { object-position: var(--dc-entry-focus-mobile, 48% 55%); }
}
/* Static flow preserves the introductory heading and the completed dish. */
.dc-journey:not(.dc-journey--animated) { height: auto; }
.dc-journey:not(.dc-journey--animated) .dc-entry { position: relative; height: 100svh; min-height: 400px; }
.dc-journey:not(.dc-journey--animated) .dc-assembly__copy { position: relative; inset: auto; margin: 50px 7% 0; width: 86%; }
.dc-journey:not(.dc-journey--animated) .dc-assembly__stage { position: relative; inset: auto; height: 65svh; min-height: 300px; }
.dc-journey:not(.dc-journey--animated) .dc-assembly__dish { width: min(90%, 880px); }


/* =========================================================
   CINEMATIC TREATMENT — SCENE 01
   ========================================================= */

.dc-journey .dc-entry__image {
    filter:
        brightness(.48)
        contrast(1.18)
        saturate(.46)
        grayscale(.12);

    transform: scale(1.025);
}

/* Stronger cinematic shading */
.dc-journey .dc-entry__shade {
    background:
        radial-gradient(
            ellipse at 52% 42%,
            rgb(255 255 255 / 1.5%) 0%,
            rgb(0 0 0 / 5%) 32%,
            rgb(0 0 0 / 42%) 78%,
            rgb(0 0 0 / 65%) 100%
        ),
        linear-gradient(
            90deg,
            rgb(8 10 12 / 58%) 0%,
            rgb(8 10 12 / 16%) 28%,
            rgb(8 10 12 / 8%) 52%,
            rgb(8 10 12 / 24%) 76%,
            rgb(8 10 12 / 62%) 100%
        ),
        linear-gradient(
            180deg,
            rgb(8 10 12 / 36%) 0%,
            rgb(8 10 12 / 5%) 38%,
            rgb(5 6 7 / 48%) 100%
        );
}

/* Subtle cold-grey cinematic tint */
.dc-journey .dc-entry::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;

    background:
        linear-gradient(
            135deg,
            rgb(78 86 94 / 12%) 0%,
            rgb(34 38 42 / 4%) 42%,
            rgb(8 10 12 / 16%) 100%
        );

    mix-blend-mode: color;
    opacity: .82;
}

/* Film grain */
.dc-journey .dc-entry::after {
    content: "";
    position: absolute;
    inset: -25%;
    z-index: 3;
    pointer-events: none;

    opacity: .04;

    background-image:
        repeating-radial-gradient(
            circle at 0 0,
            rgb(255 255 255 / 30%) 0,
            rgb(255 255 255 / 30%) 1px,
            transparent 1px,
            transparent 3px
        );

    background-size: 7px 7px;

    animation: dc-entry-grain .28s steps(2) infinite;
}

@keyframes dc-entry-grain {
    0% {
        transform: translate3d(0, 0, 0);
    }

    25% {
        transform: translate3d(-1%, .8%, 0);
    }

    50% {
        transform: translate3d(.8%, -1%, 0);
    }

    75% {
        transform: translate3d(1%, .8%, 0);
    }

    100% {
        transform: translate3d(-.8%, -.8%, 0);
    }
}

/* Keep text and structural elements above cinematic overlays */
.dc-journey .dc-entry__copy,
.dc-journey .dc-entry__placeholder,
.dc-journey .dc-entry__threshold,
.dc-journey .dc-entry__jamb {
    z-index: 4;
}