/* ============================================================
   Landing motion — petal, japan (secrets), interior
   Loaded only on the page-naked template.
   Scene layering is always on; motion only with scroll-driven
   animation support and without reduced-motion preference.
   ============================================================ */

/* Entrance offsets and rotations must not widen the page; clip keeps sticky working. */
.wp-site-blocks {
    overflow-x: clip;
}

@property --lm-spin {
    syntax: '<angle>';
    inherits: true;
    initial-value: 0deg;
}


/* ------------------------------------------------------------
   Shared: load entrances (hero copy)
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: no-preference) {
    .lm-load-title {
        animation: lm-title-in 1s cubic-bezier(.16, 1, .3, 1) both;
    }

    .lm-load-fade {
        animation: lm-fade-in .7s cubic-bezier(.16, 1, .3, 1) both;
    }

    .lm-d1 { animation-delay: .15s; }
    .lm-d2 { animation-delay: .3s; }
    .lm-d3 { animation-delay: .45s; }
    .lm-d4 { animation-delay: .6s; }

    .lm-card img {
        transition: transform .8s cubic-bezier(.2, .7, .2, 1);
    }

    .lm-card:hover img {
        transform: translateY(-8px) rotate(2deg);
    }
}

/* Hero title, letter by letter: each word keeps together, delays build per word + per char. */
.lm-word {
    display: inline-block;
    white-space: nowrap;
}

.lm-char {
    display: inline-block;
}

@media (prefers-reduced-motion: no-preference) {
    .lm-letters .lm-char {
        animation: lm-char-in 1.1s cubic-bezier(.16, 1, .3, 1) both;
        animation-delay: calc(var(--lm-w, .1s) + var(--lm-c, 0) * .05s);
    }

    /* indices come from classes (lm-w*, lm-c*), so wrappers like <mark> don't matter */
    .lm-w2 { --lm-w: .32s; }
    .lm-w3 { --lm-w: .65s; }
    .lm-w4 { --lm-w: .85s; }

    .lm-c2 { --lm-c: 1; }
    .lm-c3 { --lm-c: 2; }
    .lm-c4 { --lm-c: 3; }
    .lm-c5 { --lm-c: 4; }
    .lm-c6 { --lm-c: 5; }
    .lm-c7 { --lm-c: 6; }
}

@keyframes lm-char-in {
    from {
        opacity: 0;
        transform: translateY(.55em) rotate(10deg) scale(.85);
        filter: blur(10px);
    }
    to {
        opacity: 1;
        transform: none;
        filter: blur(0);
    }
}

@keyframes lm-title-in {
    from {
        opacity: 0;
        transform: translateY(.4em) rotate(1deg);
        filter: blur(4px);
    }
    to {
        opacity: 1;
        transform: none;
        filter: blur(0);
    }
}

@keyframes lm-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}


/* ------------------------------------------------------------
   Shared: scroll reveals, card entrances, image pan
   ------------------------------------------------------------ */

@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {

        :is(.lm-title, .lm-fade, .lm-in-left, .lm-in-up, .lm-in-right, .lm-scroll-pan) {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: view();
        }

        .lm-title {
            animation-name: lm-title-in;
            animation-range: entry 0% cover 20%;
        }

        .lm-fade {
            animation-name: lm-fade-in;
            animation-range: entry 0% cover 18%;
        }

        :is(.lm-in-left, .lm-in-up, .lm-in-right) {
            --lm-stagger: 0%;
            animation-range:
                entry calc(5% + var(--lm-stagger))
                cover calc(35% + var(--lm-stagger));
        }

        .lm-in-left  { animation-name: lm-left-in; }
        .lm-in-up    { animation-name: lm-up-in; }
        .lm-in-right { animation-name: lm-right-in; }

        .lm-stagger > :nth-child(2) { --lm-stagger: 3%; }
        .lm-stagger > :nth-child(3) { --lm-stagger: 6%; }

        /* Petal collection cards: further out, tilted, starting later */
        .lm-stagger {
            --lm-dist: 180px;
            --lm-lift: 90px;
            --lm-tilt: 9deg;
            --lm-rise: 240px;
        }

        .lm-stagger > :is(.lm-in-left, .lm-in-up, .lm-in-right) {
            animation-range:
                entry calc(25% + var(--lm-stagger))
                cover calc(40% + var(--lm-stagger));
        }

        .lm-scroll-pan {
            animation-name: lm-pan;
            animation-range: entry 0% exit 100%;
        }
    }
}

/* Reveal (clip wipe) and rise (masked lift) — from the fx motion library.
   The last frame drops the clip so descenders and overflow are not cut. */
@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
        :is(.lm-reveal, .lm-rise) {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: view();
        }

        .lm-reveal {
            animation-name: lm-reveal-in;
            animation-range: entry 10% cover 30%;
        }

        .lm-rise {
            animation-name: lm-rise-in;
            animation-range: entry 5% cover 32%;
        }
    }
}

@keyframes lm-reveal-in {
    0%   { clip-path: inset(0 100% 0 0); }
    99%  { clip-path: inset(0); }
    100% { clip-path: none; }
}

@keyframes lm-rise-in {
    0% {
        opacity: 0;
        translate: 0 40%;
        rotate: 3deg;
        clip-path: inset(100% 0 0);
    }
    99% {
        opacity: 1;
        translate: 0 0;
        rotate: 0deg;
        clip-path: inset(0);
    }
    100% {
        opacity: 1;
        translate: 0 0;
        rotate: 0deg;
        clip-path: none;
    }
}

/* Distance / lift / tilt are variables so a section can make them bolder. */
@keyframes lm-left-in {
    from {
        opacity: 0;
        translate: calc(var(--lm-dist, 60px) * -1) var(--lm-lift, 0px);
        rotate: calc(var(--lm-tilt, 0deg) * -1);
    }
    to { opacity: 1; translate: 0 0; rotate: 0deg; }
}

@keyframes lm-up-in {
    from { opacity: 0; translate: 0 var(--lm-rise, 60px); }
    to   { opacity: 1; translate: 0 0; }
}

@keyframes lm-right-in {
    from {
        opacity: 0;
        translate: var(--lm-dist, 60px) var(--lm-lift, 0px);
        rotate: var(--lm-tilt, 0deg);
    }
    to { opacity: 1; translate: 0 0; rotate: 0deg; }
}

@keyframes lm-pan {
    from { translate: 0 4vh; scale: 1.12; }
    to   { translate: 0 -4vh; scale: 1.03; }
}


/* ============================================================
   PETAL — hero scene
   ============================================================ */

.lm-petal-track {
    position: relative;
    margin-block: 0 !important;
}

.lm-petal-scene {
    position: relative;
    display: flex;
    align-items: center;
    height: 100svh;
    min-height: 640px;
    max-width: none !important;
    margin-block: 0 !important;
    overflow: clip;
    isolation: isolate;
}

.lm-petal-scene > .wp-block-columns {
    flex: 1 1 auto;
    width: 100%;
    margin-block: 0 !important;
}

.lm-petal-copy {
    z-index: 5;
}

.lm-petal-scene .lm-petal-specimen {
    position: absolute;
    z-index: 7;
    right: 7%;
    bottom: 15%;
    width: 300px;
    margin: 0 !important;
}

.lm-petal-scene > .lm-petal-flower {
    position: absolute;
    z-index: 2;
    left: 25.5%;
    top: 12%;
    width: 49%;
    max-width: none;
    margin: 0 !important;
    opacity: .85;
    transform-origin: 50% 60%;
    will-change: transform;
}

.lm-petal-scene > .lm-petal-bottle {
    position: absolute;
    z-index: 4;
    right: 19%;
    top: 15%;
    width: 35%;
    max-width: none;
    margin: 0 !important;
    pointer-events: none;
    filter: drop-shadow(12px 25px 24px #4d4a3617);
}

:is(.lm-petal-flower, .lm-petal-bottle, .lm-petal) img {
    display: block;
    width: 100%;
}

.lm-petal-layer {
    display: contents;
}

.lm-petal-layer > .lm-petal {
    position: absolute;
    z-index: 6;
    width: 12vw;
    max-width: 240px;
    margin: 0 !important;
    opacity: .6;
    pointer-events: none;
    will-change: transform;
}

.lm-petal-layer > .lm-petal-0 { left: 5%;  top: 5%;  width: 14vw; filter: blur(3px); }
.lm-petal-layer > .lm-petal-1 { left: 48%; top: 12%; width: 8vw;  z-index: 3; }
.lm-petal-layer > .lm-petal-2 { left: 86%; top: 10%; width: 19vw; filter: blur(5px); }
.lm-petal-layer > .lm-petal-3 { left: 31%; top: 66%; width: 6vw;  z-index: 3; }
.lm-petal-layer > .lm-petal-4 { left: 62%; top: 34%; width: 9vw;  z-index: 3; filter: blur(.5px); }
.lm-petal-layer > .lm-petal-5 { left: 13%; top: 72%; width: 16vw; filter: blur(4px); }
.lm-petal-layer > .lm-petal-6 { left: 76%; top: 52%; width: 7vw; }


/* ------------------------------------------------------------
   PETAL — drift scene ("let it bloom")
   ------------------------------------------------------------ */

.lm-drift-scene {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100svh;
    max-width: none !important;
    margin-block: 0 !important;
    overflow: clip;
    isolation: isolate;
}

.lm-drift-scene::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 15%;
    top: -10vw;
    width: 70vw;
    aspect-ratio: 1;
    border: 1px solid #75856924;
    border-radius: 50%;
    pointer-events: none;
}

.lm-drift-title {
    transform-origin: center;
}

.lm-drift-card {
    position: relative;
    z-index: 7;
}

.lm-drift-petals > .lm-petal-0 { left: 3%;  top: 0;   width: 25vw; }
.lm-drift-petals > .lm-petal-2 { left: 76%; top: 40%; width: 27vw; filter: blur(7px); }
.lm-drift-petals > .lm-petal-4 { left: 48%; width: 19vw; }
.lm-drift-petals > .lm-petal-6 { left: 67%; top: 15%; width: 13vw; }


/* ------------------------------------------------------------
   PETAL — scroll motion
   ------------------------------------------------------------ */

@supports (animation-timeline: view()) and (animation-range: contain) {
    @media (prefers-reduced-motion: no-preference) {

        .lm-petal-track {
            height: 300svh;
            view-timeline: --lm-petal block;
            --lm-tl: --lm-petal;
        }

        .lm-drift-track {
            box-sizing: border-box;
            height: 280svh;
            padding-block: 0 !important;
            view-timeline: --lm-drift block;
            --lm-tl: --lm-drift;
        }

        .lm-petal-scene,
        .lm-drift-scene {
            position: sticky;
            top: 0;
            height: 100svh;
        }

        :is(.lm-petal-flower, .lm-petal-bottle, .lm-petal-specimen, .lm-petal,
            .lm-drift-title, .lm-drift-card) {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: var(--lm-tl);
            animation-range: contain 0% contain 100%;
        }

        .lm-petal-flower   { animation-name: lm-flower-travel; }
        .lm-petal-bottle   { animation-name: lm-bottle-travel; }
        .lm-petal-specimen { animation-name: lm-card-travel; }
        .lm-drift-card     { animation-name: lm-card-rise; }
        .lm-drift-title    { animation-name: lm-title-travel; }

        .lm-drift-scene::before {
            animation: lm-halo-travel auto linear both;
            animation-timeline: --lm-drift;
            animation-range: contain 0% contain 100%;
        }

        .lm-petal-0 { animation-name: lm-petal-travel-0; }
        .lm-petal-1 { animation-name: lm-petal-travel-1; }
        .lm-petal-2 { animation-name: lm-petal-travel-2; }
        .lm-petal-3 { animation-name: lm-petal-travel-3; }
        .lm-petal-4 { animation-name: lm-petal-travel-4; }
        .lm-petal-5 { animation-name: lm-petal-travel-5; }
        .lm-petal-6 { animation-name: lm-petal-travel-6; }
    }
}

/* centred flower turns gently from left to right */
@keyframes lm-flower-travel {
    from { transform: translateY(0) rotate(-10deg) scale(1); }
    to   { transform: translateY(-9vh) rotate(8deg) scale(1.12); }
}

@keyframes lm-bottle-travel {
    from { transform: translateY(0) rotate(0); }
    to   { transform: translateY(-7vh) rotate(3deg); }
}

@keyframes lm-card-travel {
    from { transform: translateY(0); }
    to   { transform: translateY(-5vh); }
}

/* the drift card sits under the growing title, so it rises into place */
@keyframes lm-card-rise {
    from { transform: translateY(5vh); }
    to   { transform: translateY(0); }
}

@keyframes lm-halo-travel {
    from { transform: scale(1); }
    to   { transform: scale(.8); }
}

@keyframes lm-title-travel {
    from { transform: scale(1);   opacity: 1; }
    to   { transform: scale(1.2); opacity: .45; }
}

/* Petal paths — taken verbatim from the petal demo */
@keyframes lm-petal-travel-0 {
    0.00% {
        transform: translate3d(0.000vw, -22.000vh, 0) rotate(0.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.124vw, -15.125vh, 0) rotate(7.813deg);
        opacity: 0.508
    }

    10.00% {
        transform: translate3d(0.487vw, -8.250vh, 0) rotate(15.625deg);
        opacity: 0.695
    }

    15.00% {
        transform: translate3d(1.059vw, -1.375vh, 0) rotate(23.437deg);
        opacity: 0.882
    }

    20.00% {
        transform: translate3d(1.793vw, 5.500vh, 0) rotate(31.250deg);
        opacity: 1.000
    }

    25.00% {
        transform: translate3d(2.630vw, 12.375vh, 0) rotate(39.063deg);
        opacity: 1.000
    }

    30.00% {
        transform: translate3d(3.495vw, 19.250vh, 0) rotate(46.875deg);
        opacity: 1.000
    }

    35.00% {
        transform: translate3d(4.311vw, 26.125vh, 0) rotate(54.687deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(4.998vw, 33.000vh, 0) rotate(62.500deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(5.478vw, 39.875vh, 0) rotate(70.313deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(5.683vw, 46.750vh, 0) rotate(78.125deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(5.558vw, 53.625vh, 0) rotate(85.938deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(5.066vw, 60.500vh, 0) rotate(93.750deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(4.188vw, 67.375vh, 0) rotate(101.563deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(2.931vw, 74.250vh, 0) rotate(109.375deg);
        opacity: 0.850
    }

    75.00% {
        transform: translate3d(1.323vw, 81.125vh, 0) rotate(117.188deg);
        opacity: 0.475
    }

    80.00% {
        transform: translate3d(-0.584vw, 88.000vh, 0) rotate(125.000deg);
        opacity: 0.100
    }

    85.00% {
        transform: translate3d(-0.584vw, 88.000vh, 0) rotate(125.000deg);
        opacity: 0.100
    }

    90.00% {
        transform: translate3d(-0.584vw, 88.000vh, 0) rotate(125.000deg);
        opacity: 0.100
    }

    95.00% {
        transform: translate3d(-0.584vw, 88.000vh, 0) rotate(125.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(-0.584vw, 88.000vh, 0) rotate(125.000deg);
        opacity: 0.100
    }
}

@keyframes lm-petal-travel-1 {
    0.00% {
        transform: translate3d(0.000vw, 8.000vh, 0) rotate(39.000deg);
        opacity: 0.320
    }

    2.80% {
        transform: translate3d(0.000vw, 8.000vh, 0) rotate(39.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.244vw, 11.217vh, 0) rotate(36.388deg);
        opacity: 0.403
    }

    10.00% {
        transform: translate3d(0.864vw, 18.530vh, 0) rotate(30.450deg);
        opacity: 0.590
    }

    15.00% {
        transform: translate3d(1.520vw, 25.843vh, 0) rotate(24.513deg);
        opacity: 0.778
    }

    20.00% {
        transform: translate3d(2.135vw, 33.155vh, 0) rotate(18.575deg);
        opacity: 0.965
    }

    25.00% {
        transform: translate3d(2.637vw, 40.467vh, 0) rotate(12.638deg);
        opacity: 1.000
    }

    30.00% {
        transform: translate3d(2.955vw, 47.780vh, 0) rotate(6.700deg);
        opacity: 1.000
    }

    35.00% {
        transform: translate3d(3.033vw, 55.092vh, 0) rotate(0.763deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(2.827vw, 62.405vh, 0) rotate(-5.175deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(2.311vw, 69.718vh, 0) rotate(-11.112deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(1.480vw, 77.030vh, 0) rotate(-17.050deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(0.350vw, 84.343vh, 0) rotate(-22.987deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(-1.043vw, 91.655vh, 0) rotate(-28.925deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(-2.640vw, 98.968vh, 0) rotate(-34.862deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(-4.365vw, 106.280vh, 0) rotate(-40.800deg);
        opacity: 1.000
    }

    75.00% {
        transform: translate3d(-6.128vw, 113.593vh, 0) rotate(-46.737deg);
        opacity: 0.685
    }

    80.00% {
        transform: translate3d(-7.829vw, 120.905vh, 0) rotate(-52.675deg);
        opacity: 0.310
    }

    82.80% {
        transform: translate3d(-8.716vw, 125.000vh, 0) rotate(-56.000deg);
        opacity: 0.100
    }

    85.00% {
        transform: translate3d(-8.716vw, 125.000vh, 0) rotate(-56.000deg);
        opacity: 0.100
    }

    90.00% {
        transform: translate3d(-8.716vw, 125.000vh, 0) rotate(-56.000deg);
        opacity: 0.100
    }

    95.00% {
        transform: translate3d(-8.716vw, 125.000vh, 0) rotate(-56.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(-8.716vw, 125.000vh, 0) rotate(-56.000deg);
        opacity: 0.100
    }
}

@keyframes lm-petal-travel-2 {
    0.00% {
        transform: translate3d(0.000vw, -35.000vh, 0) rotate(78.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.000vw, -35.000vh, 0) rotate(78.000deg);
        opacity: 0.320
    }

    5.60% {
        transform: translate3d(0.000vw, -35.000vh, 0) rotate(78.000deg);
        opacity: 0.320
    }

    10.00% {
        transform: translate3d(0.452vw, -28.180vh, 0) rotate(84.875deg);
        opacity: 0.485
    }

    15.00% {
        transform: translate3d(0.814vw, -20.430vh, 0) rotate(92.688deg);
        opacity: 0.672
    }

    20.00% {
        transform: translate3d(0.965vw, -12.680vh, 0) rotate(100.500deg);
        opacity: 0.860
    }

    25.00% {
        transform: translate3d(0.867vw, -4.930vh, 0) rotate(108.313deg);
        opacity: 1.000
    }

    30.00% {
        transform: translate3d(0.503vw, 2.820vh, 0) rotate(116.125deg);
        opacity: 1.000
    }

    35.00% {
        transform: translate3d(-0.126vw, 10.570vh, 0) rotate(123.938deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(-0.999vw, 18.320vh, 0) rotate(131.750deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(-2.073vw, 26.070vh, 0) rotate(139.563deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(-3.289vw, 33.820vh, 0) rotate(147.375deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(-4.575vw, 41.570vh, 0) rotate(155.188deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(-5.845vw, 49.320vh, 0) rotate(163.000deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(-7.009vw, 57.070vh, 0) rotate(170.813deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(-7.975vw, 64.820vh, 0) rotate(178.625deg);
        opacity: 1.000
    }

    75.00% {
        transform: translate3d(-8.657vw, 72.570vh, 0) rotate(186.438deg);
        opacity: 0.895
    }

    80.00% {
        transform: translate3d(-8.979vw, 80.320vh, 0) rotate(194.250deg);
        opacity: 0.520
    }

    85.00% {
        transform: translate3d(-8.877vw, 88.070vh, 0) rotate(202.062deg);
        opacity: 0.145
    }

    85.60% {
        transform: translate3d(-8.835vw, 89.000vh, 0) rotate(203.000deg);
        opacity: 0.100
    }

    90.00% {
        transform: translate3d(-8.835vw, 89.000vh, 0) rotate(203.000deg);
        opacity: 0.100
    }

    95.00% {
        transform: translate3d(-8.835vw, 89.000vh, 0) rotate(203.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(-8.835vw, 89.000vh, 0) rotate(203.000deg);
        opacity: 0.100
    }
}

@keyframes lm-petal-travel-3 {
    0.00% {
        transform: translate3d(0.000vw, 20.000vh, 0) rotate(117.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.000vw, 20.000vh, 0) rotate(117.000deg);
        opacity: 0.320
    }

    8.40% {
        transform: translate3d(0.000vw, 20.000vh, 0) rotate(117.000deg);
        opacity: 0.320
    }

    10.00% {
        transform: translate3d(0.016vw, 22.620vh, 0) rotate(115.100deg);
        opacity: 0.380
    }

    15.00% {
        transform: translate3d(-0.101vw, 30.807vh, 0) rotate(109.163deg);
        opacity: 0.567
    }

    20.00% {
        transform: translate3d(-0.459vw, 38.995vh, 0) rotate(103.225deg);
        opacity: 0.755
    }

    25.00% {
        transform: translate3d(-1.035vw, 47.182vh, 0) rotate(97.288deg);
        opacity: 0.942
    }

    30.00% {
        transform: translate3d(-1.785vw, 55.370vh, 0) rotate(91.350deg);
        opacity: 1.000
    }

    35.00% {
        transform: translate3d(-2.650vw, 63.557vh, 0) rotate(85.413deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(-3.560vw, 71.745vh, 0) rotate(79.475deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(-4.435vw, 79.933vh, 0) rotate(73.537deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(-5.194vw, 88.120vh, 0) rotate(67.600deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(-5.758vw, 96.308vh, 0) rotate(61.663deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(-6.055vw, 104.495vh, 0) rotate(55.725deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(-6.026vw, 112.683vh, 0) rotate(49.787deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(-5.626vw, 120.870vh, 0) rotate(43.850deg);
        opacity: 1.000
    }

    75.00% {
        transform: translate3d(-4.832vw, 129.058vh, 0) rotate(37.912deg);
        opacity: 1.000
    }

    80.00% {
        transform: translate3d(-3.643vw, 137.245vh, 0) rotate(31.975deg);
        opacity: 0.730
    }

    85.00% {
        transform: translate3d(-2.082vw, 145.433vh, 0) rotate(26.037deg);
        opacity: 0.355
    }

    88.40% {
        transform: translate3d(-0.831vw, 151.000vh, 0) rotate(22.000deg);
        opacity: 0.100
    }

    90.00% {
        transform: translate3d(-0.831vw, 151.000vh, 0) rotate(22.000deg);
        opacity: 0.100
    }

    95.00% {
        transform: translate3d(-0.831vw, 151.000vh, 0) rotate(22.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(-0.831vw, 151.000vh, 0) rotate(22.000deg);
        opacity: 0.100
    }
}

@keyframes lm-petal-travel-4 {
    0.00% {
        transform: translate3d(0.000vw, -15.000vh, 0) rotate(156.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.000vw, -15.000vh, 0) rotate(156.000deg);
        opacity: 0.320
    }

    10.00% {
        transform: translate3d(0.000vw, -15.000vh, 0) rotate(156.000deg);
        opacity: 0.320
    }

    11.20% {
        transform: translate3d(0.000vw, -15.000vh, 0) rotate(156.000deg);
        opacity: 0.320
    }

    15.00% {
        transform: translate3d(-0.402vw, -8.445vh, 0) rotate(161.938deg);
        opacity: 0.462
    }

    20.00% {
        transform: translate3d(-1.029vw, 0.180vh, 0) rotate(169.750deg);
        opacity: 0.650
    }

    25.00% {
        transform: translate3d(-1.703vw, 8.805vh, 0) rotate(177.563deg);
        opacity: 0.838
    }

    30.00% {
        transform: translate3d(-2.348vw, 17.430vh, 0) rotate(185.375deg);
        opacity: 1.000
    }

    35.00% {
        transform: translate3d(-2.890vw, 26.055vh, 0) rotate(193.188deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(-3.258vw, 34.680vh, 0) rotate(201.000deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(-3.390vw, 43.305vh, 0) rotate(208.813deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(-3.239vw, 51.930vh, 0) rotate(216.625deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(-2.773vw, 60.555vh, 0) rotate(224.438deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(-1.984vw, 69.180vh, 0) rotate(232.250deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(-0.880vw, 77.805vh, 0) rotate(240.063deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(0.505vw, 86.430vh, 0) rotate(247.875deg);
        opacity: 1.000
    }

    75.00% {
        transform: translate3d(2.118vw, 95.055vh, 0) rotate(255.688deg);
        opacity: 1.000
    }

    80.00% {
        transform: translate3d(3.886vw, 103.680vh, 0) rotate(263.500deg);
        opacity: 0.940
    }

    85.00% {
        transform: translate3d(5.720vw, 112.305vh, 0) rotate(271.313deg);
        opacity: 0.565
    }

    90.00% {
        transform: translate3d(7.521vw, 120.930vh, 0) rotate(279.125deg);
        opacity: 0.190
    }

    91.20% {
        transform: translate3d(7.937vw, 123.000vh, 0) rotate(281.000deg);
        opacity: 0.100
    }

    95.00% {
        transform: translate3d(7.937vw, 123.000vh, 0) rotate(281.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(7.937vw, 123.000vh, 0) rotate(281.000deg);
        opacity: 0.100
    }
}

@keyframes lm-petal-travel-5 {
    0.00% {
        transform: translate3d(0.000vw, 4.000vh, 0) rotate(195.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.000vw, 4.000vh, 0) rotate(195.000deg);
        opacity: 0.320
    }

    10.00% {
        transform: translate3d(0.000vw, 4.000vh, 0) rotate(195.000deg);
        opacity: 0.320
    }

    14.00% {
        transform: translate3d(0.000vw, 4.000vh, 0) rotate(195.000deg);
        opacity: 0.320
    }

    15.00% {
        transform: translate3d(-0.118vw, 5.812vh, 0) rotate(193.813deg);
        opacity: 0.357
    }

    20.00% {
        transform: translate3d(-0.648vw, 14.875vh, 0) rotate(187.875deg);
        opacity: 0.545
    }

    25.00% {
        transform: translate3d(-1.027vw, 23.937vh, 0) rotate(181.938deg);
        opacity: 0.732
    }

    30.00% {
        transform: translate3d(-1.199vw, 33.000vh, 0) rotate(176.000deg);
        opacity: 0.920
    }

    35.00% {
        transform: translate3d(-1.126vw, 42.062vh, 0) rotate(170.063deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(-0.783vw, 51.125vh, 0) rotate(164.125deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(-0.167vw, 60.187vh, 0) rotate(158.188deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(0.703vw, 69.250vh, 0) rotate(152.250deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(1.790vw, 78.313vh, 0) rotate(146.313deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(3.039vw, 87.375vh, 0) rotate(140.375deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(4.377vw, 96.438vh, 0) rotate(134.438deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(5.722vw, 105.500vh, 0) rotate(128.500deg);
        opacity: 1.000
    }

    75.00% {
        transform: translate3d(6.981vw, 114.563vh, 0) rotate(122.563deg);
        opacity: 1.000
    }

    80.00% {
        transform: translate3d(8.062vw, 123.625vh, 0) rotate(116.625deg);
        opacity: 1.000
    }

    85.00% {
        transform: translate3d(8.874vw, 132.688vh, 0) rotate(110.688deg);
        opacity: 0.775
    }

    90.00% {
        transform: translate3d(9.336vw, 141.750vh, 0) rotate(104.750deg);
        opacity: 0.400
    }

    94.00% {
        transform: translate3d(9.407vw, 149.000vh, 0) rotate(100.000deg);
        opacity: 0.100
    }

    95.00% {
        transform: translate3d(9.407vw, 149.000vh, 0) rotate(100.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(9.407vw, 149.000vh, 0) rotate(100.000deg);
        opacity: 0.100
    }
}

@keyframes lm-petal-travel-6 {
    0.00% {
        transform: translate3d(0.000vw, -40.000vh, 0) rotate(234.000deg);
        opacity: 0.320
    }

    5.00% {
        transform: translate3d(0.000vw, -40.000vh, 0) rotate(234.000deg);
        opacity: 0.320
    }

    10.00% {
        transform: translate3d(0.000vw, -40.000vh, 0) rotate(234.000deg);
        opacity: 0.320
    }

    15.00% {
        transform: translate3d(0.000vw, -40.000vh, 0) rotate(234.000deg);
        opacity: 0.320
    }

    16.80% {
        transform: translate3d(0.000vw, -40.000vh, 0) rotate(234.000deg);
        opacity: 0.320
    }

    20.00% {
        transform: translate3d(-0.062vw, -33.920vh, 0) rotate(239.000deg);
        opacity: 0.440
    }

    25.00% {
        transform: translate3d(0.046vw, -24.420vh, 0) rotate(246.813deg);
        opacity: 0.627
    }

    30.00% {
        transform: translate3d(0.400vw, -14.920vh, 0) rotate(254.625deg);
        opacity: 0.815
    }

    35.00% {
        transform: translate3d(0.979vw, -5.420vh, 0) rotate(262.438deg);
        opacity: 1.000
    }

    40.00% {
        transform: translate3d(1.743vw, 4.080vh, 0) rotate(270.250deg);
        opacity: 1.000
    }

    45.00% {
        transform: translate3d(2.636vw, 13.580vh, 0) rotate(278.063deg);
        opacity: 1.000
    }

    50.00% {
        transform: translate3d(3.589vw, 23.080vh, 0) rotate(285.875deg);
        opacity: 1.000
    }

    55.00% {
        transform: translate3d(4.524vw, 32.580vh, 0) rotate(293.688deg);
        opacity: 1.000
    }

    60.00% {
        transform: translate3d(5.357vw, 42.080vh, 0) rotate(301.500deg);
        opacity: 1.000
    }

    65.00% {
        transform: translate3d(6.009vw, 51.580vh, 0) rotate(309.313deg);
        opacity: 1.000
    }

    70.00% {
        transform: translate3d(6.402vw, 61.080vh, 0) rotate(317.125deg);
        opacity: 1.000
    }

    75.00% {
        transform: translate3d(6.473vw, 70.580vh, 0) rotate(324.938deg);
        opacity: 1.000
    }

    80.00% {
        transform: translate3d(6.172vw, 80.080vh, 0) rotate(332.750deg);
        opacity: 1.000
    }

    85.00% {
        transform: translate3d(5.471vw, 89.580vh, 0) rotate(340.563deg);
        opacity: 0.985
    }

    90.00% {
        transform: translate3d(4.361vw, 99.080vh, 0) rotate(348.375deg);
        opacity: 0.610
    }

    95.00% {
        transform: translate3d(2.859vw, 108.580vh, 0) rotate(356.188deg);
        opacity: 0.235
    }

    96.80% {
        transform: translate3d(2.229vw, 112.000vh, 0) rotate(359.000deg);
        opacity: 0.100
    }

    100.00% {
        transform: translate3d(2.229vw, 112.000vh, 0) rotate(359.000deg);
        opacity: 0.100
    }
}


/* ============================================================
   JAPAN — torii gate scene
   ============================================================ */

.lm-jp-track {
    position: relative;
}

.lm-jp-scene {
    position: relative;
    height: 100svh;
    min-height: 600px;
    max-width: none !important;
    margin-block: 0 !important;
    overflow: hidden;
    isolation: isolate;
}

.lm-jp-scene > * {
    margin: 0 !important;
}

.lm-jp-scene > .lm-jp-copy {
    position: absolute;
    z-index: 12;
    left: max(24px, 5.5vw);
    top: 6vh;
    width: min(420px, 80vw);
    max-width: none;
}

.lm-jp-scene > :is(.lm-jp-sun, .lm-jp-hills, .lm-jp-torii, .lm-jp-mist, .lm-jp-rocks) {
    position: absolute;
    max-width: none;
    pointer-events: none;
}

:is(.lm-jp-sun, .lm-jp-hills, .lm-jp-torii, .lm-jp-mist, .lm-jp-rocks) img {
    display: block;
    width: 100%;
    height: auto;
}

.lm-jp-scene > .lm-jp-sun {
    z-index: 1;
    left: 68%;
    top: 46%;
    width: min(42vw, 670px);
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 0 60px rgba(228, 49, 39, .24));
}

.lm-jp-scene > .lm-jp-hills {
    z-index: 2;
    left: -3%;
    bottom: -1vh;
    width: 106%;
}

.lm-jp-scene > .lm-jp-torii {
    z-index: 4;
    left: 50%;
    bottom: -2vh;
    width: min(90vw, 1540px);
    transform: translateX(-50%);
}

.lm-jp-scene > .lm-jp-mist {
    z-index: 5;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: .28;
}

.lm-jp-scene .lm-jp-mist img {
    height: 100%;
    object-fit: cover;
}

.lm-jp-scene > .lm-jp-lockup {
    position: absolute;
    z-index: 6;
    left: 50%;
    bottom: 32vh;
    width: max-content;
    max-width: none;
    translate: -50% 0;
}

.lm-jp-word {
    margin: 0;
    white-space: nowrap;
    line-height: .9;
}

.lm-letter {
    display: inline-block;
}

.lm-jp-scene > .lm-jp-rocks {
    z-index: 7;
    left: -2%;
    bottom: -7vh;
    width: 104%;
}

@media (max-width: 850px) {
    .lm-jp-scene > .lm-jp-sun   { left: 67%; top: 48%; width: 80vw; }
    .lm-jp-scene > .lm-jp-torii { width: 145vw; }
    .lm-jp-scene > :is(.lm-jp-hills, .lm-jp-rocks) { left: -30%; width: 160%; }
    .lm-jp-scene > .lm-jp-lockup { bottom: 30vh; }
}


/* ------------------------------------------------------------
   JAPAN — scroll motion
   ------------------------------------------------------------ */

@supports (animation-timeline: view()) and (animation-range: contain) {
    @media (prefers-reduced-motion: no-preference) {

        .lm-jp-track {
            height: 310svh;
            view-timeline: --lm-jp block;
        }

        .lm-jp-scene {
            position: sticky;
            top: 0;
        }

        :is(.lm-jp-sun, .lm-jp-hills, .lm-jp-torii, .lm-jp-mist, .lm-jp-rocks, .lm-jp-copy, .lm-letter) {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: --lm-jp;
            animation-range: contain 0% contain 100%;
        }

        .lm-jp-sun   { animation-name: lm-jp-sun; }
        .lm-jp-torii { animation-name: lm-jp-torii; }
        .lm-jp-hills { animation-name: lm-jp-hills; }
        .lm-jp-rocks { animation-name: lm-jp-rocks; }
        .lm-jp-mist  { animation-name: lm-jp-mist; }

        .lm-jp-copy {
            animation-name: lm-jp-copy;
            animation-range: contain 0% contain 65%;
        }

        .lm-letter {
            animation-name: lm-letter-in;
            animation-range: contain var(--lm-from) contain calc(var(--lm-from) + 16%);
        }

        .lm-letter:nth-child(1) { --lm-from: 4%; }
        .lm-letter:nth-child(2) { --lm-from: 7%; }
        .lm-letter:nth-child(3) { --lm-from: 10%; }
        .lm-letter:nth-child(4) { --lm-from: 13%; }
        .lm-letter:nth-child(5) { --lm-from: 16%; }
        .lm-letter:nth-child(6) { --lm-from: 19%; }
        .lm-letter:nth-child(7) { --lm-from: 22%; }
        .lm-letter:nth-child(8) { --lm-from: 25%; }
        .lm-letter:nth-child(9) { --lm-from: 28%; }

        /* Second section: the sushi turns with the scroll */
        .lm-jp-food {
            animation: lm-jp-food auto linear both;
            animation-timeline: view();
            animation-range: cover 0% cover 100%;
        }
    }
}

@keyframes lm-jp-sun {
    from { transform: translate(-50%, -50%) scale(.68); opacity: .55; }
    to   { transform: translate(-47%, -57%) scale(1.22); opacity: .95; }
}

@keyframes lm-jp-torii {
    from { transform: translateX(-50%) scale(.92); }
    to   { transform: translateX(-50%) scale(1.08) translateY(-7vh); }
}

@keyframes lm-jp-hills {
    from { transform: translateY(3vh) scale(1.02); }
    to   { transform: translateY(-5vh) scale(1.08); }
}

@keyframes lm-jp-rocks {
    from { transform: translateY(6vh) scale(1.05); }
    to   { transform: translateY(-11vh) scale(1.15); }
}

@keyframes lm-jp-mist {
    from { transform: translateX(-3%) scale(1.05); opacity: .6; }
    to   { transform: translateX(5%) scale(1.14); opacity: 1; }
}

@keyframes lm-jp-copy {
    from { transform: translateY(0); opacity: 1; }
    to   { transform: translateY(-70px); opacity: 0; }
}

@keyframes lm-letter-in {
    from { opacity: 0; transform: translateY(110%) rotate(8deg); }
    to   { opacity: 1; transform: translateY(0) rotate(0); }
}

/* ------------------------------------------------------------
   JAPAN — tasting cards
   Cards unfold in 3D one after another, a sheen sweeps across,
   then each sushi spins down with a red glow behind it.
   ------------------------------------------------------------ */

.lm-jp-card {
    position: relative;
    isolation: isolate;
}

.lm-jp-card::before,
.lm-jp-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
}

/* sheen */
.lm-jp-card::before {
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(110deg, transparent 35%, #ffffff1c 50%, transparent 65%) no-repeat;
    background-size: 250% 100%;
    background-position: 120% 0;
}

/* glow behind the sushi */
.lm-jp-card::after {
    left: 50%;
    top: -4rem;
    width: 70%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, #e4312738, transparent 62%);
    translate: -50% 0;
}

.lm-jp-sushi {
    position: relative;
}

@media (prefers-reduced-motion: no-preference) {
    .lm-jp-card:hover .lm-jp-sushi img {
        transform: translateY(-14px) rotate(-10deg) scale(1.06);
    }
}

@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {

        .lm-jp-cards > :nth-child(2) { --lm-stagger: 6%; }
        .lm-jp-cards > :nth-child(3) { --lm-stagger: 12%; }

        .lm-jp-card,
        .lm-jp-card::before,
        .lm-jp-card::after {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: view();
        }

        .lm-jp-card {
            animation-name: lm-jp-card-in;
            animation-range:
                entry calc(0% + var(--lm-stagger, 0%))
                cover calc(38% + var(--lm-stagger, 0%));
        }

        .lm-jp-card::before {
            animation-name: lm-jp-sheen;
            animation-range:
                cover calc(25% + var(--lm-stagger, 0%))
                cover calc(55% + var(--lm-stagger, 0%));
        }

        .lm-jp-card::after {
            animation-name: lm-jp-glow;
            animation-range:
                cover calc(22% + var(--lm-stagger, 0%))
                cover calc(48% + var(--lm-stagger, 0%));
        }

        .lm-jp-sushi {
            animation-name: lm-jp-sushi-in, lm-jp-sushi-float;
            animation-duration: auto, auto;
            animation-timing-function: linear, linear;
            animation-fill-mode: both, both;
            animation-timeline: view(), view();
            animation-range:
                cover calc(40% + var(--lm-stagger, 0%)) cover calc(60% + var(--lm-stagger, 0%)),
                cover 0% cover 100%;
        }
    }
}

@keyframes lm-jp-card-in {
    0% {
        opacity: 0;
        transform: perspective(1200px) translateY(140px) rotateX(28deg) scale(.88);
        clip-path: inset(100% 0 0 0 round 1rem);
        filter: blur(6px);
    }
    60% {
        opacity: 1;
        filter: blur(0);
    }
    99% {
        opacity: 1;
        transform: none;
        clip-path: inset(0 0 0 0 round 1rem);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: none;
        clip-path: none;
        filter: none;
    }
}

@keyframes lm-jp-sheen {
    from { background-position: 120% 0; }
    to   { background-position: -20% 0; }
}

@keyframes lm-jp-glow {
    from { opacity: 0; scale: .2; }
    to   { opacity: 1; scale: 1; }
}

@keyframes lm-jp-sushi-in {
    0% {
        opacity: 0;
        translate: 0 -140px;
        scale: .3;
        rotate: -200deg;
        filter: blur(12px);
    }
    70% {
        opacity: 1;
        translate: 0 10px;
        scale: 1.08;
        rotate: 10deg;
        filter: blur(0);
    }
    100% {
        opacity: 1;
        translate: 0 0;
        scale: 1;
        rotate: 0deg;
        filter: none;
    }
}

@keyframes lm-jp-sushi-float {
    from { transform: translateY(12px) rotate(-5deg); }
    to   { transform: translateY(-12px) rotate(5deg); }
}

/* ------------------------------------------------------------
   JAPAN — menu ("03 / Étlap")
   Rows: name slides in from the left, price from the right,
   a dotted leader draws between them. Separators draw in,
   category titles wipe in, the right column follows a beat later.
   ------------------------------------------------------------ */

.lm-menu .is-content-justification-space-between::before {
    content: "";
    order: 1;
    flex: 1 1 auto;
    align-self: center;
    min-width: 2rem;
    margin: 0 1rem;
    border-bottom: 2px dotted #e9ece533;
    translate: 0 .35em;
    transform-origin: left center;
}

.lm-menu .is-content-justification-space-between > p:last-child {
    order: 2;
    transition: color .3s;
}

.lm-menu .is-content-justification-space-between > p:first-child {
    transition: transform .45s cubic-bezier(.2, .7, .2, 1);
}

.lm-menu .is-content-justification-space-between:hover > p:first-child {
    transform: translateX(8px);
}

.lm-menu .is-content-justification-space-between:hover > p:last-child {
    color: #e43127 !important;
}

@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {

        .lm-menu .wp-block-column:nth-child(2) { --lm-stagger: 5%; }

        .lm-menu .is-content-justification-space-between {
            view-timeline: --lm-row block;
        }

        .lm-menu .is-content-justification-space-between > p:first-child,
        .lm-menu .is-content-justification-space-between > p:last-child,
        .lm-menu .is-content-justification-space-between::before {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: --lm-row;
        }

        .lm-menu .is-content-justification-space-between > p:first-child {
            animation-name: lm-menu-name;
            animation-range: entry calc(0% + var(--lm-stagger, 0%)) cover calc(22% + var(--lm-stagger, 0%));
        }

        .lm-menu .is-content-justification-space-between > p:last-child {
            animation-name: lm-menu-price;
            animation-range: entry calc(20% + var(--lm-stagger, 0%)) cover calc(28% + var(--lm-stagger, 0%));
        }

        .lm-menu .is-content-justification-space-between::before {
            animation-name: lm-draw;
            animation-range: entry calc(10% + var(--lm-stagger, 0%)) cover calc(30% + var(--lm-stagger, 0%));
        }

        .lm-menu :is(.wp-block-separator, h4, .wp-block-column > p) {
            animation-duration: auto;
            animation-timing-function: linear;
            animation-fill-mode: both;
            animation-timeline: view();
        }

        .lm-menu .wp-block-separator {
            transform-origin: left center;
            animation-name: lm-draw;
            animation-range: entry calc(0% + var(--lm-stagger, 0%)) cover calc(30% + var(--lm-stagger, 0%));
        }

        .lm-menu h4 {
            animation-name: lm-menu-cat;
            animation-range: entry calc(10% + var(--lm-stagger, 0%)) cover calc(30% + var(--lm-stagger, 0%));
        }

        .lm-menu .wp-block-column > p {
            --lm-rise: 20px;
            animation-name: lm-up-in;
            animation-range: entry calc(20% + var(--lm-stagger, 0%)) cover calc(30% + var(--lm-stagger, 0%));
        }
    }
}

@keyframes lm-menu-name {
    from { opacity: 0; translate: -40px 0; filter: blur(4px); }
    to   { opacity: 1; translate: 0 0; filter: blur(0); }
}

@keyframes lm-menu-price {
    from { opacity: 0; translate: 40px 0; }
    to   { opacity: 1; translate: 0 0; }
}

@keyframes lm-draw {
    from { scale: 0 1; }
    to   { scale: 1 1; }
}

@keyframes lm-menu-cat {
    0%   { opacity: 0; translate: -24px 0; clip-path: inset(0 100% 0 0); }
    99%  { opacity: 1; translate: 0 0; clip-path: inset(0); }
    100% { opacity: 1; translate: 0 0; clip-path: none; }
}

@keyframes lm-jp-food {
    from { transform: rotate(-12deg); }
    to   { transform: translate(5%, 3%) rotate(7deg) scale(1.1); }
}


/* ============================================================
   INTERIOR — hero intro (time based)
   ============================================================ */

.lm-int-hero {
    isolation: isolate;
    overflow: clip;
}

.lm-int-hero > .wp-block-cover__inner-container {
    z-index: 2;
}

.lm-int-title br {
    display: none;
}

.lm-line {
    display: block;
    overflow: clip;
    padding-bottom: .13em;
    margin-bottom: -.13em;
}

.lm-line > span {
    display: block;
}

@media (prefers-reduced-motion: no-preference) {
    .lm-int-hero::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background:
            radial-gradient(circle at 54% 50%, transparent calc(35vmin - 1px), #d5f39777 35vmin, transparent calc(35vmin + 1px)),
            linear-gradient(115deg, #082d38ea, #367a80a8);
        backdrop-filter: blur(28px);
        animation: lm-int-veil 3.4s .2s cubic-bezier(.2, .7, .2, 1) both;
    }

    .lm-int-hero > .wp-block-cover__video-background {
        animation: lm-int-video 4.5s cubic-bezier(.2, .65, .2, 1) both;
    }

    .lm-line > span {
        animation: lm-int-line 1.5s .4s cubic-bezier(.16, 1, .3, 1) both;
    }

    .lm-line + br + .lm-line > span {
        animation-delay: .65s;
    }

    .lm-int-hero .lm-int-enter {
        animation: lm-int-enter 1.2s .25s both;
    }

    .lm-int-hero .lm-int-enter.lm-d3 { animation-delay: 1.05s; }
    .lm-int-hero .lm-int-enter.lm-d4 { animation-delay: 1.7s; }

    .lm-int-card {
        animation: lm-int-card 1.8s 1.35s cubic-bezier(.16, 1, .3, 1) both;
    }
}

@keyframes lm-int-veil {
    0%, 18% { opacity: 1; backdrop-filter: blur(28px); }
    85%     { opacity: 0; backdrop-filter: blur(0); }
    100%    { opacity: 0; visibility: hidden; backdrop-filter: blur(0); }
}

@keyframes lm-int-video {
    from { transform: scale(1.12); filter: blur(6px); }
    to   { transform: scale(1); filter: blur(0); }
}

@keyframes lm-int-line {
    from { opacity: 0; transform: translateY(115%) rotate(3deg); filter: blur(8px); }
    to   { opacity: 1; transform: none; filter: blur(0); }
}

@keyframes lm-int-enter {
    from { opacity: 0; translate: 0 20px; }
    to   { opacity: 1; translate: 0 0; }
}

@keyframes lm-int-card {
    from { opacity: 0; transform: translateY(65px) rotate(5deg); filter: blur(10px); }
    to   { opacity: 1; transform: none; filter: blur(0); }
}


/* ------------------------------------------------------------
   INTERIOR — category orbit (scroll driven, pinned)
   Without support / with reduced motion the original grid stays.
   ------------------------------------------------------------ */

@supports (animation-timeline: view()) and (animation-range: contain) {
    @media (prefers-reduced-motion: no-preference) {

        .lm-orbit-track {
            box-sizing: border-box;
            height: 440svh;
            padding-block: 0 !important;
            view-timeline: --lm-orbit block;
        }

        .lm-orbit-stage {
            --lm-r: clamp(290px, 43vw, 720px);
            --lm-card: clamp(210px, 22vw, 350px);
            position: sticky;
            top: 0;
            display: flex;
            align-items: center;
            height: 100svh;
            min-height: 660px;
            overflow: clip;
            isolation: isolate;
        }

        .lm-orbit-stage::before {
            content: "";
            position: absolute;
            left: calc(-1 * var(--lm-r) - 10vw);
            top: calc(50% - var(--lm-r));
            width: calc(var(--lm-r) * 2);
            aspect-ratio: 1;
            border: 1px solid #4179823b;
            border-radius: 50%;
            box-shadow: 0 0 100px #548e9220, inset 0 0 100px #edf8f540;
            pointer-events: none;
        }

        .lm-orbit-stage > .wp-block-columns {
            flex: 1 1 auto;
            margin: 0;
        }

        .lm-orbit-copy {
            position: relative;
            z-index: 2;
        }

        .lm-orbit-stage .lm-orbit-wheel {
            position: absolute;
            left: -10vw;
            top: 50%;
            display: block !important;
            width: 0;
            height: 0;
            margin: 0;
            animation: lm-spin auto linear both;
            animation-timeline: --lm-orbit;
            animation-range: contain;
        }

        .lm-orbit-wheel > .lm-orbit-card {
            --lm-a: 0deg;
            position: absolute;
            left: 0;
            top: 0;
            box-sizing: border-box;
            width: var(--lm-card);
            margin: 0 0 0 calc(var(--lm-card) / -2) !important;
            translate: 0 -50%;
            transform:
                rotate(calc(var(--lm-a) - var(--lm-spin)))
                translateX(var(--lm-r))
                rotate(calc(var(--lm-spin) - var(--lm-a)));
        }

        /* compact cards, as in the demo */
        .lm-orbit-card .wp-block-image img {
            display: block;
            width: auto;
            max-height: calc(var(--lm-card) * .5);
            margin-inline: auto;
        }

        .lm-orbit-wheel > .lm-orbit-card:nth-child(2) { --lm-a: 60deg; }
        .lm-orbit-wheel > .lm-orbit-card:nth-child(3) { --lm-a: 120deg; }
        .lm-orbit-wheel > .lm-orbit-card:nth-child(4) { --lm-a: 180deg; }

        @media (max-width: 781px) {
            .lm-orbit-track { height: 360svh; }

            .lm-orbit-stage {
                --lm-r: 80vw;
                --lm-card: 42vw;
                align-items: flex-start;
                min-height: 760px;
                padding-top: 7vh;
            }

            .lm-orbit-stage::before {
                left: calc(-1 * var(--lm-r) - 25vw);
                top: calc(78% - var(--lm-r));
            }

            .lm-orbit-stage .lm-orbit-wheel {
                left: -25vw;
                top: 78%;
            }
        }
    }
}

@keyframes lm-spin {
    to { --lm-spin: 180deg; }
}


/* ------------------------------------------------------------
   Responsive — petal scene
   ------------------------------------------------------------ */

@media (max-width: 781px) {
    .lm-petal-scene {
        align-items: flex-start;
        min-height: 720px;
    }

    .lm-petal-scene > .lm-petal-flower { left: 11%; top: 30%; width: 78%; }
    .lm-petal-scene > .lm-petal-bottle { right: 4%; top: 35%; width: 66%; }
    .lm-petal-scene .lm-petal-specimen { right: 5%; bottom: 9%; width: 200px; }

    .lm-petal-layer > .lm-petal-0 { width: 28vw; }
    .lm-petal-layer > .lm-petal-2 { width: 30vw; }
    .lm-petal-layer > .lm-petal-5 { width: 26vw; }

    .lm-drift-petals > .lm-petal-0 { width: 42vw; }
    .lm-drift-petals > .lm-petal-2 { left: 70%; width: 50vw; }
    .lm-drift-petals > .lm-petal-4 { width: 30vw; }
}

@supports (animation-timeline: view()) and (animation-range: contain) {
    @media (prefers-reduced-motion: no-preference) and (max-width: 781px) {
        .lm-petal-track { height: 260svh; }
    }
}


/* ==========================================================
   Petal hero v2 — layout, glass nav, load + scroll motion
   Builds on the theme's lm- motion system (--lm-tl, view-timeline)
   ========================================================== */

/* ---------- Layout ---------- */

.lm-petal-scene > .wp-block-columns {
  padding-top: clamp(56px, 7vh, 88px);
}

.lm-petal-copy .wp-block-heading {
  font-size: clamp(3.4rem, 7vw, 6.6rem);
  letter-spacing: -0.02em;
}

.lm-petal-copy .lm-petal-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.9em;
}
.lm-petal-copy .lm-petal-eyebrow::before {
  content: "";
  width: 2.8em;
  height: 1px;
  background: currentColor;
  opacity: 0.45;
}

/* The bottle sits inside the right column, so the old
   `.lm-petal-scene > .lm-petal-bottle` rule never matched and the
   flower covered it. Descendant selector brings it to the front. */
.lm-petal-scene .lm-petal-bottle {
  position: absolute;
  z-index: 4;
  right: 11%;
  top: 17%;
  width: min(34vw, 560px);
  margin: 0 !important;
  pointer-events: none;
  filter: drop-shadow(0 34px 42px rgba(77, 74, 54, 0.16));
}
.lm-petal-scene .lm-petal-bottle img { display: block; width: 100%; }

.lm-petal-scene > .lm-petal-flower {
  left: auto;
  right: 29%;
  top: 5%;
  width: min(33vw, 560px);
  opacity: 0.95;
  z-index: 3;
}

.lm-petal-scene .lm-petal-specimen {
  right: 5%;
  bottom: 11%;
}

/* Halo ring + soft glow behind the bottle */
.lm-petal-scene::before,
.lm-petal-scene::after {
  content: "";
  position: absolute;
  z-index: 1;
  pointer-events: none;
  border-radius: 50%;
  aspect-ratio: 1;
}
.lm-petal-scene::before {
  right: 7%;
  top: 10%;
  width: min(42vw, 700px);
  background: radial-gradient(circle, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0) 62%);
}
.lm-petal-scene::after {
  right: 9%;
  top: 13%;
  width: min(38vw, 630px);
  border: 1px solid rgba(117, 133, 105, 0.22);
}

/* ---------- Glass nav (top of hero) ---------- */

.lm-petal-scene .lm-petal-nav {
  position: absolute;
  z-index: 9;
  top: clamp(14px, 2.2vw, 28px);
  left: 50%;
  translate: -50% 0;
  width: min(1180px, calc(100% - 32px));
  margin: 0 !important;
}
.lm-petal-nav .lm-petal-brand {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1;
}
.lm-petal-nav .wp-block-navigation {
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.lm-petal-nav .wp-block-navigation-item__content {
  position: relative;
  padding-block: 0.35em;
}
.lm-petal-nav .wp-block-button__link {
  padding: 0.75em 1.5em;
  font-size: 0.8rem;
  letter-spacing: 0.06em;
}
.lm-petal-nav .wp-block-navigation-item__content::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: currentColor;
  scale: 0 1;
  transform-origin: right;
  transition: scale 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.lm-petal-nav .wp-block-navigation-item__content:hover::after,
.lm-petal-nav .wp-block-navigation-item__content:focus-visible::after {
  scale: 1 1;
  transform-origin: left;
}

@media (max-width: 781px) {
  .lm-petal-scene .lm-petal-nav { top: 12px; width: calc(100% - 24px); padding-left: 1.2rem !important; }
  .lm-petal-nav .wp-block-button__link { padding: 0.6em 1.1em; }
  .lm-petal-scene .lm-petal-bottle { right: 6%; top: auto; bottom: 5%; width: 44vw; }
  .lm-petal-scene > .lm-petal-flower { right: 30%; top: auto; bottom: 13%; width: 50vw; }
  .lm-petal-scene::before { right: -4%; top: auto; bottom: -2%; width: 68vw; }
  .lm-petal-scene::after { right: 0; top: auto; bottom: 2%; width: 58vw; }
  .lm-petal-scene .lm-petal-specimen { display: none; }
}

/* ---------- Load motion (time-based) ---------- */

@media (prefers-reduced-motion: no-preference) {
  .lm-petal-scene .lm-petal-nav {
    animation: lm-nav-in 1s cubic-bezier(0.16, 1, 0.3, 1) 0.9s both;
  }

  .lm-petal-scene > .lm-petal-flower {
    animation: lm-bloom 1.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both;
  }
  .lm-petal-scene > .lm-petal-flower img {
    animation: lm-sway 7s ease-in-out 2s infinite alternate;
  }

  .lm-petal-scene .lm-petal-bottle {
    animation: lm-bottle-in 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.35s both;
  }
  .lm-petal-scene .lm-petal-bottle img {
    animation: lm-float 6s ease-in-out 1.9s infinite alternate;
  }
  .lm-petal-scene .lm-petal-bottle::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, 0.7) 50%, transparent 60%) no-repeat;
    background-size: 260% 100%;
    background-position: 150% 0;
    -webkit-mask: var(--lm-bottle-mask, url("/wp-content/uploads/perfume-bergamotto-1024x1024.png")) center / contain no-repeat;
    mask: var(--lm-bottle-mask, url("/wp-content/uploads/perfume-bergamotto-1024x1024.png")) center / contain no-repeat;
    mix-blend-mode: soft-light;
    animation: lm-sheen 6s ease-in-out 1.8s infinite;
  }

  .lm-petal-scene .lm-petal-specimen {
    animation: lm-card-in 1.1s cubic-bezier(0.16, 1, 0.3, 1) 1.2s both;
  }

  .lm-petal-scene::before { animation: lm-glow-in 2s ease-out 0.2s both; }
  .lm-petal-scene::after  { animation: lm-ring-in 2s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both; }
}

/* ---------- Scroll motion (sticky 300svh track) ---------- */

@supports (animation-timeline: view()) and (animation-range: contain) {
  @media (prefers-reduced-motion: no-preference) {
    .lm-petal-scene > .lm-petal-flower {
      animation-name: lm-bloom, lm-flower-travel-2;
      animation-duration: 1.8s, auto;
      animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1), linear;
      animation-delay: 0.1s, 0s;
      animation-iteration-count: 1, 1;
      animation-fill-mode: both, both;
      animation-timeline: auto, var(--lm-tl);
      animation-range: normal, contain;
    }
    .lm-petal-scene > .lm-petal-flower img {
      animation-name: lm-sway, lm-depth;
      animation-duration: 7s, auto;
      animation-timing-function: ease-in-out, linear;
      animation-delay: 2s, 0s;
      animation-iteration-count: infinite, 1;
      animation-direction: alternate, normal;
      animation-fill-mode: none, both;
      animation-timeline: auto, var(--lm-tl);
      animation-range: normal, contain;
    }

    .lm-petal-scene .lm-petal-bottle {
      animation-name: lm-bottle-in, lm-bottle-travel-2;
      animation-duration: 1.5s, auto;
      animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1), linear;
      animation-delay: 0.35s, 0s;
      animation-iteration-count: 1, 1;
      animation-fill-mode: both, both;
      animation-timeline: auto, var(--lm-tl);
      animation-range: normal, contain;
    }

    .lm-petal-scene .lm-petal-specimen {
      animation-name: lm-card-in, lm-card-travel-2;
      animation-duration: 1.1s, auto;
      animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1), linear;
      animation-delay: 1.2s, 0s;
      animation-iteration-count: 1, 1;
      animation-fill-mode: both, both;
      animation-timeline: auto, var(--lm-tl);
      animation-range: normal, contain;
    }

    .lm-petal-scene .lm-petal-copy {
      animation: lm-copy-out linear both;
      animation-timeline: var(--lm-tl);
      animation-range: contain 0% contain 55%;
    }

    .lm-petal-scene::after {
      animation-name: lm-ring-in, lm-ring-travel;
      animation-duration: 2s, auto;
      animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1), linear;
      animation-delay: 0.25s, 0s;
      animation-iteration-count: 1, 1;
      animation-fill-mode: both, both;
      animation-timeline: auto, var(--lm-tl);
      animation-range: normal, contain;
    }
  }
}

/* ---------- Keyframes ---------- */

@keyframes lm-nav-in {
  from { opacity: 0; translate: -50% -140%; filter: blur(8px); }
  to   { opacity: 1; translate: -50% 0; filter: blur(0); }
}

@keyframes lm-bloom {
  0%   { opacity: 0; scale: 0.55; rotate: -28deg; filter: blur(12px); clip-path: circle(0% at 55% 62%); }
  99%  { scale: 1; rotate: 0deg; filter: blur(0); clip-path: circle(95% at 55% 62%); }
  100% { scale: 1; rotate: 0deg; filter: blur(0); clip-path: none; }
}

@keyframes lm-sway {
  from { rotate: 0deg; translate: 0 0; }
  to   { rotate: 4deg; translate: 0 -1.2vh; }
}

@keyframes lm-bottle-in {
  from { opacity: 0; translate: 0 22vh; scale: 0.86; rotate: -7deg;
         filter: blur(14px) drop-shadow(0 34px 42px rgba(77, 74, 54, 0)); }
  to   { opacity: 1; translate: 0 0; scale: 1; rotate: 0deg;
         filter: blur(0) drop-shadow(0 34px 42px rgba(77, 74, 54, 0.16)); }
}

@keyframes lm-float {
  from { translate: 0 0; }
  to   { translate: 0 -1.4vh; }
}

@keyframes lm-sheen {
  0%   { background-position: 150% 0; }
  45%  { background-position: -50% 0; }
  100% { background-position: -50% 0; }
}

@keyframes lm-card-in {
  from { opacity: 0; translate: 12vw 0; rotate: 4deg; }
  to   { opacity: 1; translate: 0 0; rotate: 0deg; }
}

@keyframes lm-glow-in {
  from { opacity: 0; scale: 0.6; }
  to   { opacity: 1; scale: 1; }
}

@keyframes lm-ring-in {
  from { opacity: 0; scale: 0.4; }
  to   { opacity: 1; scale: 1; }
}

@keyframes lm-flower-travel-2 {
  0%   { transform: translate(0, 0) rotate(-4deg) scale(1); }
  100% { transform: translate(-12vw, -14vh) rotate(36deg) scale(1.4); }
}

@keyframes lm-depth {
  0%   { filter: blur(0); opacity: 1; }
  45%  { filter: blur(0); opacity: 1; }
  100% { filter: blur(7px); opacity: 0.4; }
}

@keyframes lm-bottle-travel-2 {
  0%   { transform: translate(0, 0) rotate(0deg) scale(1); }
  55%  { transform: translate(-16vw, -3vh) rotate(-3deg) scale(1.12); }
  100% { transform: translate(-22vw, -8vh) rotate(2deg) scale(1.18); }
}

@keyframes lm-card-travel-2 {
  0%   { transform: translate(0, 0) rotate(0deg); }
  100% { transform: translate(-6vw, -12vh) rotate(-2deg); }
}

@keyframes lm-copy-out {
  0%   { transform: translateY(0); opacity: 1; filter: blur(0); }
  100% { transform: translateY(-18vh); opacity: 0; filter: blur(10px); }
}

@keyframes lm-ring-travel {
  0%   { transform: scale(1); }
  100% { transform: scale(1.7); }
}


/* ============================================================
   Orma — the GSAP demo rebuilt as CSS (load + scroll-driven).
   Easings follow the original: InOut .75,0,.25,1 · Out .25,1,.5,1
   · In .5,0,.75,0 · dive .6,0,0,1. Interactions: js/orma.js.
   ============================================================ */

@property --orma-p {
    syntax: '<integer>';
    inherits: true;
    initial-value: 0;
}

@property --orma-prog {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%;
}

/* Letter index for staggered title reveals (classes, so the editor keeps them). */
.lm-orma-c0 { --i: 0; }
.lm-orma-c1 { --i: 1; }
.lm-orma-c2 { --i: 2; }
.lm-orma-c3 { --i: 3; }
.lm-orma-c4 { --i: 4; }
.lm-orma-c5 { --i: 5; }
.lm-orma-c6 { --i: 6; }
.lm-orma-c7 { --i: 7; }
.lm-orma-c8 { --i: 8; }
.lm-orma-c9 { --i: 9; }

/* Load: the hero photo opens out of an arch, then the copy comes in. */
.orma {
    --orma-intro: 2.5s;
}

@media (prefers-reduced-motion: no-preference) {

    /* hero load: the photo opens from a centred arch to full bleed while it settles */
    .orma-hero-day {
        animation: orma-hero-arch 3s linear .15s both;
    }

    /* thin outline arch, slightly larger than the opening — opens with it, then fades */
    .lm-orma-hero-sticky::before {
        content: "";
        position: absolute;
        z-index: 1;
        border: 1px solid rgb(239 234 224 / .28);
        border-bottom: 0;
        pointer-events: none;
        animation: orma-hero-edge 3s linear .15s both;
    }

    .orma-hero-day img {
        transform-origin: 50% 40%;
        animation: orma-hero-in 1.8s cubic-bezier(.6, 0, 0, 1) 1.35s both;
    }

    /* hero copy: letters turn in, then the rest floats up */
    .orma-hero-title {
        perspective: 60rem;
    }

    .orma-hero-title .lm-orma-char {
        animation: orma-h-in 1.2s cubic-bezier(.25, 1, .5, 1) calc(var(--orma-intro) + var(--i) * .05s) both;
    }

    .orma-title-b .lm-orma-char {
        animation-delay: calc(var(--orma-intro) + .15s + var(--i) * .05s);
    }

    .lm-orma-load {
        animation: orma-up 1.2s cubic-bezier(.25, 1, .5, 1) calc(var(--orma-intro) + .4s) both;
    }

    /* accordion height + content */
    .orma-acc {
        interpolate-size: allow-keywords;
    }

    .orma-acc::details-content {
        block-size: 0;
        overflow-y: clip;
        transition: block-size 1.2s cubic-bezier(.25, 1, .5, 1), content-visibility 1.2s allow-discrete;
    }

    .orma-acc[open]::details-content {
        block-size: auto;
    }

    .orma-acc[open] > :not(summary) {
        animation: orma-up 1.2s cubic-bezier(.25, 1, .5, 1) .3s both;
    }

    .orma-slider.is-playing .orma-pag-progress {
        animation: orma-prog 6s linear both;
    }

    /* ---------- Scroll-driven ---------- */
    @supports (animation-timeline: view()) {

        /* Hero: landscape and copy slide up at different speeds, then the landscape zooms */
        .orma-hero {
            view-timeline: --orma-hero block;
        }

        .lm-orma-hero-bg {
            transform-origin: 50% 75%;
            animation: orma-hero-up linear both, orma-hero-zoom cubic-bezier(.5, 0, .75, 0) both;
            animation-timeline: --orma-hero, --orma-hero;
            animation-range: contain 0% contain 60%, contain 45% contain 100%;
        }

        .lm-orma-hero-content {
            animation: orma-hero-copy linear both;
            animation-timeline: --orma-hero;
            animation-range: contain 0% contain 60%;
        }

        /* Intro arch: narrow and tall while it rises, opens to a straight full-width edge */
        .orma .orma-intro {
            border-radius: 0;
            animation: orma-arch-open linear both;
            animation-timeline: view();
            animation-range: entry 0% entry 100%;
        }

        /* Words drift apart */
        .lm-orma-spread {
            animation: orma-spread linear both;
            animation-timeline: view();
            animation-range: entry 0% exit 100%;
        }

        /* Lines draw from left */
        .lm-orma-line {
            animation: orma-line linear both;
            animation-timeline: view();
            animation-range: entry 20% cover 40%;
        }

        /* Location: inside the plugin's --fx-horizontal timeline */
        .lm-orma-hline-t {
            display: inline-block;
            animation: orma-hline linear both;
            animation-timeline: --fx-horizontal;
            animation-range: contain 0% contain 100%;
        }

        .lm-orma-hline-t:nth-of-type(1) { --a: -5%; --b: 5%; }
        .lm-orma-hline-t:nth-of-type(2) { --a: 25%; --b: -25%; }
        .lm-orma-hline-t:nth-of-type(3) { --a: -15%; --b: 25%; }

        .lm-orma-hflower {
            animation: orma-hflower linear both;
            animation-timeline: --fx-horizontal;
            animation-range: contain 0% contain 100%;
        }

        .lm-orma-hclip {
            animation: orma-clip-x linear both;
            animation-timeline: --fx-horizontal;
            animation-range: contain 4% contain 26%;
        }

        .lm-orma-hitem {
            animation: orma-up linear both;
            animation-timeline: --fx-horizontal;
            animation-range: contain 30% contain 50%;
        }

        .lm-orma-hline {
            animation: orma-line linear both;
            animation-timeline: --fx-horizontal;
            animation-range: contain 30% contain 50%;
        }

        /* Info box scales in under the sticky area */
        .lm-orma-info {
            view-timeline: --orma-info block;
        }

        .lm-orma-info-s {
            animation: orma-grow linear both;
            animation-timeline: --orma-info;
            animation-range: entry 70% contain 100%;
        }

        .lm-orma-info-t {
            animation: orma-up linear both;
            animation-timeline: --orma-info;
            animation-range: entry 75% entry 100%;
        }

        /* Full-bleed landscape settles from 1.15 */
        .lm-orma-zoom .wp-block-cover__image-background {
            animation: orma-zoom cubic-bezier(.25, .1, .25, 1) both;
            animation-timeline: view();
            animation-range: entry 0% entry 100%;
        }

        /* Amenities: list zooms through, block fades */
        .lm-orma-amen {
            view-timeline: --orma-amen block;
        }

        .lm-orma-amen-list {
            animation: orma-amen-zoom cubic-bezier(.5, 0, .75, 0) both;
            animation-timeline: --orma-amen;
            animation-range: contain 0% contain 100%;
        }

        .lm-orma-amen-w {
            animation: orma-amen-fade cubic-bezier(.5, 0, .75, 0) both;
            animation-timeline: --orma-amen;
            animation-range: contain 0% contain 100%;
        }

        .lm-orma-amen-t,
        .lm-orma-amen-list > * {
            animation: orma-up linear both;
            animation-timeline: --orma-amen;
            animation-range: entry calc(35% + var(--n, 0) * 12%) entry calc(75% + var(--n, 0) * 12%);
        }

        .lm-orma-amen-list > :nth-child(2) { --n: 1; }
        .lm-orma-amen-list > :nth-child(3) { --n: 2; }
        .lm-orma-amen-list > :nth-child(4) { --n: 3; }

        /* Footer: image mask shrinks, content scales in */
        .lm-orma-footer {
            view-timeline: --orma-foot block;
        }

        .lm-orma-footer-img {
            animation: orma-foot-clip linear both;
            animation-timeline: --orma-foot;
            animation-range: entry 70% entry 100%;
        }

        .lm-orma-footer-s {
            animation: orma-grow linear both;
            animation-timeline: --orma-foot;
            animation-range: entry 70% entry 100%;
        }

        /* Scroll percentage + thumb */
        .lm-orma-sbar {
            animation: orma-scroll-p linear both;
            animation-timeline: scroll(root);
        }

        .lm-orma-sbar::before {
            content: counter(orma-p, decimal-leading-zero);
            counter-reset: orma-p var(--orma-p);
            font-size: var(--wp--preset--font-size--small);
            font-weight: 600;
            letter-spacing: .14em;
        }

        .lm-orma-sbar::after {
            content: "";
            order: 1;
            width: 9px;
            height: 160px;
            background: linear-gradient(currentColor, currentColor) 50% calc(var(--orma-p) * 1%) / 3px 28px no-repeat,
                linear-gradient(rgb(128 128 128 / .45), rgb(128 128 128 / .45)) 50% 0 / 1px 100% no-repeat;
        }

        /* Window: two wall openings align, the mullion disappears, we fly through */
        @media (min-width: 992px) {
            .lm-orma-window {
                view-timeline: --orma-win block;
            }

            .lm-orma-window-stage::before,
            .lm-orma-window-stage::after {
                content: "";
                position: absolute;
                inset: 0;
                z-index: 1;
                background: #efeae0;
                pointer-events: none;
                transform-origin: 50% 50%;
                animation: linear both;
                animation-timeline: --orma-win;
                animation-range: entry 0% contain 45%;
            }

            .lm-orma-window-stage::before {
                animation-name: orma-wall-l;
            }

            .lm-orma-window-stage::after {
                animation-name: orma-wall-r;
            }

            .lm-orma-window-img {
                animation: orma-win-img linear both;
                animation-timeline: --orma-win;
                animation-range: entry 0% contain 45%;
            }

            .lm-orma-window-img img {
                animation: orma-win-drift linear both;
                animation-timeline: --orma-win;
                animation-range: contain 55% exit 100%;
            }

            .lm-orma-window-fl,
            .lm-orma-window-fr {
                z-index: 2;
                animation: linear both;
                animation-timeline: --orma-win;
                animation-range: entry 0% contain 45%;
            }

            .lm-orma-window-fl {
                animation-name: orma-win-fl;
            }

            .lm-orma-window-fr {
                animation-name: orma-win-fr;
            }

            .lm-orma-window-text {
                animation: orma-up linear both;
                animation-timeline: --orma-win;
                animation-range: contain 46% contain 56%;
            }
        }
    }
}

@keyframes orma-h-in {
    from { opacity: 0; transform: translateY(50%) rotateY(90deg); }
}

@keyframes orma-hero-in {
    from { scale: 1.25; }
}

/* rises in from below the screen (0–40%), then opens to full bleed (40–100%) */
@keyframes orma-hero-edge {
    0% { inset: calc(104vh - 1.4vw) 32vw -1px 32vw; border-radius: 18vw 18vw 0 0; animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    40% { inset: calc(24vh - 1.4vw) 32vw -1px 32vw; border-radius: 18vw 18vw 0 0; animation-timing-function: cubic-bezier(.6, 0, 0, 1); }
    85% { opacity: 1; }
    100% { inset: -1px -1px -1px -1px; border-radius: 0 0 0 0; opacity: 0; }
}

@keyframes orma-hero-arch {
    0% { clip-path: inset(104vh 33vw 0 33vw round 17vw 17vw 0 0); animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    40% { clip-path: inset(24vh 33vw 0 33vw round 17vw 17vw 0 0); animation-timing-function: cubic-bezier(.6, 0, 0, 1); }
    100% { clip-path: inset(0 0 0 0 round 0 0 0 0); }
}

@keyframes orma-up {
    from { opacity: 0; translate: 0 3.3rem; }
}

@keyframes orma-hero-up {
    to { translate: 0 -60vh; }
}

@keyframes orma-hero-zoom {
    to { scale: 2; }
}

@keyframes orma-hero-copy {
    to { translate: 0 -100vh; }
}

@keyframes orma-arch-open {
    /* horizontal radius = half of the visible width, so it stays a true arch while it flattens */
    from { clip-path: inset(0 12vw 0 12vw round 38vw 38vw 0 0 / 34vw 34vw 0 0); }
    to { clip-path: inset(0 0vw 0 0vw round 50vw 50vw 0 0 / 0vw 0vw 0 0); }
}

@keyframes orma-spread {
    from { word-spacing: 0; }
    to { word-spacing: 10rem; }
}

@keyframes orma-line {
    from { clip-path: inset(0 100% 0 0); }
    to { clip-path: inset(0); }
}

@keyframes orma-hline {
    from { translate: var(--a) 0; }
    to { translate: var(--b) 0; }
}

@keyframes orma-hflower {
    to { translate: -25% 0; }
}

@keyframes orma-clip-x {
    from { clip-path: inset(0 100% 0 0); }
    to { clip-path: inset(0); }
}

@keyframes orma-grow {
    from { opacity: 0; scale: .75; }
}

@keyframes orma-zoom {
    from { scale: 1.15; }
}

@keyframes orma-amen-zoom {
    to { scale: 2; }
}

@keyframes orma-amen-fade {
    to { opacity: 0; }
}

@keyframes orma-foot-clip {
    to { clip-path: inset(8% 22% 8% 22%); }
}

@media (max-width: 991px) {
    @keyframes orma-foot-clip {
        to { clip-path: inset(30% 6% 30% 6%); }
    }

    @keyframes orma-hero-in {
        from { scale: 1.15; }
    }
}

@keyframes orma-scroll-p {
    to { --orma-p: 100; }
}

@keyframes orma-prog {
    to { --orma-prog: 100%; }
}

/* Left wall: opening x 22%→r, y t→b. Right wall: opening x l→78%. */
@keyframes orma-wall-l {
    0% { clip-path: polygon(0% 0%, 0% 100%, 22% 100%, 22% 36%, 49.5% 36%, 49.5% 99%, 22% 99%, 22% 100%, 50.2% 100%, 50.2% 0%); scale: 1; }
    50% { clip-path: polygon(0% 0%, 0% 100%, 22% 100%, 22% 18.5%, 49.5% 18.5%, 49.5% 81.5%, 22% 81.5%, 22% 100%, 50.2% 100%, 50.2% 0%); scale: 1; }
    60% { clip-path: polygon(0% 0%, 0% 100%, 22% 100%, 22% 18.5%, 50% 18.5%, 50% 81.5%, 22% 81.5%, 22% 100%, 50.2% 100%, 50.2% 0%); scale: 1; animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    100% { clip-path: polygon(0% 0%, 0% 100%, 22% 100%, 22% 18.5%, 50% 18.5%, 50% 81.5%, 22% 81.5%, 22% 100%, 50.2% 100%, 50.2% 0%); scale: 1.84; }
}

@keyframes orma-wall-r {
    0% { clip-path: polygon(50% 0%, 50% 100%, 50.5% 100%, 50.5% 1%, 78% 1%, 78% 64%, 50.5% 64%, 50.5% 100%, 100% 100%, 100% 0%); scale: 1; }
    50% { clip-path: polygon(50% 0%, 50% 100%, 50.5% 100%, 50.5% 18.5%, 78% 18.5%, 78% 81.5%, 50.5% 81.5%, 50.5% 100%, 100% 100%, 100% 0%); scale: 1; }
    60% { clip-path: polygon(50% 0%, 50% 100%, 50% 100%, 50% 18.5%, 78% 18.5%, 78% 81.5%, 50% 81.5%, 50% 100%, 100% 100%, 100% 0%); scale: 1; animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    100% { clip-path: polygon(50% 0%, 50% 100%, 50% 100%, 50% 18.5%, 78% 18.5%, 78% 81.5%, 50% 81.5%, 50% 100%, 100% 100%, 100% 0%); scale: 1.84; }
}

@keyframes orma-win-img {
    0%, 60% { scale: .75; animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    100% { scale: 1; }
}

@keyframes orma-win-drift {
    to { translate: 0 10%; }
}

@keyframes orma-win-fl {
    0%, 60% { scale: 1; translate: 0 0; animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    100% { scale: 1.84; translate: -50% 0; }
}

@keyframes orma-win-fr {
    0%, 60% { scale: 1; translate: 0 0; animation-timing-function: cubic-bezier(.75, 0, .25, 1); }
    100% { scale: 1.84; translate: 50% 0; }
}