/* home */





        /* ... your existing styles ... */

        body {
            background-color: #EFECE6;
            color: #2C2A29;
            font-family: 'Montserrat', sans-serif;
            overflow-x: hidden;
            width: 100%;
            max-width: 100%;
            position: relative;
            /* ADD THIS */
        }

        /* ADD THIS: Force all sections to hide horizontal overflow */
        section,
        main,
        footer {
            max-width: 100vw;
            overflow-x: hidden;
        }

        html {
            overflow-x: hidden;
        }

        /* ... rest of your styles ... */

        .serif-title {
            font-family: 'Cormorant Garamond', serif;
        }

        /* 1. CONTINUOUS BOTTOM-TO-TOP FILM ANIMATION */
        @keyframes slideUp {
            0% {
                transform: translateY(0);
            }

            100% {
                transform: translateY(-50%);
            }
        }

        .animate-slide-up {
            animation: slideUp 15s linear infinite;
        }

        /* Pause on Hover for the film track */
        .film-container:hover .animate-slide-up {
            animation-play-state: paused;
        }

        /* 2. EXACT TRANSPARENT CHECKERED PATTERN */
        .bg-checkers {
            background-color: #e5e5e5;
            background-image:
                linear-gradient(45deg, #d4d4d4 25%, transparent 25%, transparent 75%, #d4d4d4 75%, #d4d4d4),
                linear-gradient(45deg, #d4d4d4 25%, transparent 25%, transparent 75%, #d4d4d4 75%, #d4d4d4);
            background-size: 16px 16px;
            background-position: 0 0, 8px 8px;
        }

        /* 3. 3D SCENE SETUP */
        .scene-3d {
            perspective: 1200px;
        }

        .card-3d {
            transform-style: preserve-3d;
            transition: transform 0.1s ease-out;
        }

        /* Physical Film Edge Highlight and Deep Shadow */
        .film-edge {
            box-shadow:
                inset 2px 2px 5px rgba(255, 255, 255, 0.1),
                inset -2px -2px 5px rgba(0, 0, 0, 0.8),
                15px 25px 40px rgba(0, 0, 0, 0.4);
        }

        /* Glowing Inner Light */
        .glow-inner {
            box-shadow:
                inset 0 0 30px rgba(96, 165, 250, 0.4),
                inset 0 0 60px rgba(255, 255, 255, 0.2);
        }

        /* Custom Scrollbar */
        ::-webkit-scrollbar {
            width: 8px;
        }

        ::-webkit-scrollbar-track {
            background: #EFECE6;
        }

        ::-webkit-scrollbar-thumb {
            background: #706C61;
            border-radius: 4px;
        }




/* ---- Container: fade + slide in ---- */
.mainarrow {
    opacity: 0;
    translate: 30px 0;
    scale: 1;
    transition: opacity 1s cubic-bezier(.22, .61, .36, 1),
                translate 1s cubic-bezier(.22, .61, .36, 1),
                scale 1s cubic-bezier(.22, .61, .36, 1);
    will-change: opacity, translate, scale;
}

.in-view .mainarrow {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    transition-delay: .85s;
}

/* ---- All paths start un-drawn ---- */
.mainarrow path {
    stroke-dasharray: 400;
    stroke-dashoffset: 400;
    transition: stroke-dashoffset 1.5s cubic-bezier(.22, .61, .36, 1);
}

/* ---- Main curve draws first ---- */
.in-view .mainarrow path:nth-child(1) {
    stroke-dashoffset: 0;
    transition-delay: .85s;
}

/* ---- Arrowhead draws after curve finishes ---- */
.in-view .mainarrow path:nth-child(2) {
    stroke-dashoffset: 0;
    transition-delay: 1.35s; /* .85s entrance + 1.5s curve draw */
}

.in-view .mainarrow path:nth-child(3) {
    stroke-dashoffset: 0;
    transition-delay: 1.45s; /* slightly after the first head stroke */
}



/* Hero */





                            /* Keep the 3D depth permanently */
                            .camera-3d-wrapper {
                                transform: translateZ(70px);
                            }

                            /* Updated spin class specifically including the translateZ */
                            .fade-spin {
                                opacity: 0;
                                transform: translateZ(70px) rotate(360deg) scale(0.5);
                            }

                            /* Override transition speed specifically for the camera to make it slower */
                            [data-animate="camera"] {
                                transition: opacity 2s cubic-bezier(0.22, 0.61, 0.36, 1),
                                    transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
                            }

                            /* The trigger state (when visible) */
                            .in-view [data-animate="camera"] {
                                opacity: 1 !important;
                                transform: translateZ(70px) rotate(0deg) scale(1) !important;
                            }







                             /* ==== FADE / SLIDE PRESETS ==== */
        .fade-up {
            opacity: 0;
            transform: translateY(200px);
        }

        .fade-down {
            opacity: 0;
            transform: translateY(-200px);
        }

        .fade-left {
            opacity: 0;
            transform: translateX(-200px);
        }

        .fade-right {
            opacity: 0;
            transform: translateX(400px);
        }

        .fade-zoom {
            opacity: 0;
            transform: scale(.8);
        }

        /* .fade-spin  { opacity:0; transform:rotate(360deg) scale(0.5); } */

        /* ==== BASE TRANSITION ==== */
        [data-animate] {
            transition: opacity .9s cubic-bezier(.22, .61, .36, 1),
                transform .9s cubic-bezier(.22, .61, .36, 1);
            will-change: opacity, transform;
        }

        /* ==== TRIGGERED STATE (only when .in-view is on the section) ==== */
        .in-view [data-animate] {
            opacity: 1 !important;
            transform: none !important;
        }

        /* ==== STAGGER DELAYS ==== */
        .in-view [data-animate="camera"] {
            transition-delay: .1s
        }

        .in-view [data-animate="roll"] {
            transition-delay: .25s
        }

        .in-view [data-animate="phone"] {
            transition-delay: .4s
        }

        .in-view [data-animate="zoom"] {
            transition-delay: .5s
        }

        .in-view [data-animate="text"] {
            transition-delay: .65s
        }

        .in-view [data-animate="fade"] {
            transition-delay: .8s
        }




              @keyframes floatRightToLeft {
            0% {
                transform: translateX(0px) rotate(0deg);
            }

            50% {
                /* Moves left and rotates slightly, swinging the bottom further out */
                transform: translateX(-20px) rotate(4deg);
            }

            100% {
                transform: translateX(0px) rotate(0deg);
            }
        }

        .animate-float-left {
            animation: floatRightToLeft 4s ease-in-out infinite;
            /* This is the magic part: it pins the top and lets the bottom swing */
            transform-origin: top center;
        }

/* About */








            /* HIDE until visible — scoped to this section only */
            .about-reveal-section .reveal-rise,
            .about-reveal-section .reveal-slide-left,
            .about-reveal-section .reveal-slide-right,
            .about-reveal-section .reveal-pop {
                opacity: 0;
                transition: opacity .9s cubic-bezier(.22, .61, .36, 1),
                    translate .9s cubic-bezier(.22, .61, .36, 1),
                    scale .9s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, scale;
            }

            .about-reveal-section .reveal-rise {
                translate: 0 60px;
            }

            .about-reveal-section .reveal-slide-left {
                translate: -60px 0;
            }

            .about-reveal-section .reveal-slide-right {
                translate: 60px 0;
            }

            .about-reveal-section .reveal-pop {
                scale: .6;
            }

            /* SHOW when .in-view is added to THIS section */
            .about-reveal-section.in-view .reveal-rise,
            .about-reveal-section.in-view .reveal-slide-left,
            .about-reveal-section.in-view .reveal-slide-right,
            .about-reveal-section.in-view .reveal-pop {
                opacity: 1;
                translate: 0 0;
                scale: 1;
            }

            /* Stagger */
            .about-reveal-section.in-view .reveal-rise {
                transition-delay: .15s;
            }

            .about-reveal-section.in-view .reveal-slide-left {
                transition-delay: .35s;
            }

            .about-reveal-section.in-view .reveal-pop {
                transition-delay: .55s;
            }

            .about-reveal-section.in-view .reveal-slide-right {
                transition-delay: .45s;
            }






/* Achivement */








            .ach-block .cert-slide-left,
            .ach-block .cert-slide-right,
            .ach-block .cert-drop,
            .ach-block .cert-rise,
            .ach-block .ach-fade-up,
            .ach-block .ach-zoom {
                opacity: 0;
                transition: opacity .9s cubic-bezier(.22, .61, .36, 1),
                    translate .9s cubic-bezier(.22, .61, .36, 1),
                    scale .9s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, scale;
            }

            .ach-block .cert-slide-left {
                translate: -80px 0;
            }

            .ach-block .cert-slide-right {
                translate: 80px 0;
            }

            .ach-block .cert-drop {
                translate: 0 -80px;
            }

            .ach-block .cert-rise {
                translate: 0 80px;
            }

            .ach-block .ach-fade-up {
                translate: 0 40px;
            }

            .ach-block .ach-zoom {
                scale: .75;
            }

            .ach-block.in-view .cert-slide-left,
            .ach-block.in-view .cert-slide-right,
            .ach-block.in-view .cert-drop,
            .ach-block.in-view .cert-rise,
            .ach-block.in-view .ach-fade-up,
            .ach-block.in-view .ach-zoom {
                opacity: 1;
                translate: 0 0;
                scale: 1;
            }

            .ach-block.in-view .cert-slide-left {
                transition-delay: .10s;
            }

            .ach-block.in-view .cert-drop {
                transition-delay: .25s;
            }

            .ach-block.in-view .cert-rise {
                transition-delay: .40s;
            }

            .ach-block.in-view .cert-slide-right {
                transition-delay: .55s;
            }

            .ach-block.in-view .ach-fade-up {
                transition-delay: .30s;
            }

            .ach-block.in-view .ach-zoom {
                transition-delay: .50s;
            }

            .ach-block.in-view .ach-cta {
                transition-delay: .70s;
            }










/* origin */






            /* ==== STORY SECTION — UNIQUE CLASSES ==== */
            .story-block .story-phone-l,
            .story-block .story-phone-c,
            .story-block .story-phone-r,
            .story-block .story-title-sm,
            .story-block .story-title-lg,
            .story-block .story-text-1,
            .story-block .story-text-2,
            .story-block .story-badge,
            .story-block .story-note,
            .story-block .story-arrow-1,
            .story-block .story-arrow-2 {
                opacity: 0;
                transition: opacity .9s cubic-bezier(.22, .61, .36, 1),
                    translate .9s cubic-bezier(.22, .61, .36, 1),
                    scale .9s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, scale;
            }

            /* Initial offsets */
            .story-block .story-phone-l {
                translate: -80px 0;
            }

            .story-block .story-phone-c {
                translate: 0 80px;
            }

            .story-block .story-phone-r {
                translate: 80px 0;
            }

            .story-block .story-title-sm {
                translate: 0 40px;
            }

            .story-block .story-title-lg {
                translate: 0 50px;
            }

            .story-block .story-text-1 {
                translate: 0 40px;
            }

            .story-block .story-text-2 {
                translate: 0 40px;
            }

            .story-block .story-badge {
                scale: .6;
            }

            .story-block .story-note {
                translate: 0 -20px;
            }

            .story-block .story-arrow-1,
            .story-block .story-arrow-2 {
                translate: 40px 0;
            }

            /* TRIGGERED STATE */
            .story-block.in-view .story-phone-l,
            .story-block.in-view .story-phone-c,
            .story-block.in-view .story-phone-r,
            .story-block.in-view .story-title-sm,
            .story-block.in-view .story-title-lg,
            .story-block.in-view .story-text-1,
            .story-block.in-view .story-text-2,
            .story-block.in-view .story-badge,
            .story-block.in-view .story-note,
            .story-block.in-view .story-arrow-1,
            .story-block.in-view .story-arrow-2 {
                opacity: 1;
                translate: 0 0;
                scale: 1;
            }

            /* Stagger */
            .story-block.in-view .story-phone-l {
                transition-delay: .10s;
            }

            .story-block.in-view .story-phone-c {
                transition-delay: .25s;
            }

            .story-block.in-view .story-phone-r {
                transition-delay: .40s;
            }

            .story-block.in-view .story-note {
                transition-delay: .30s;
            }

            .story-block.in-view .story-title-sm {
                transition-delay: .55s;
            }

            .story-block.in-view .story-title-lg {
                transition-delay: .65s;
            }

            .story-block.in-view .story-text-1 {
                transition-delay: .45s;
            }

            .story-block.in-view .story-text-2 {
                transition-delay: .60s;
            }

            .story-block.in-view .story-badge {
                transition-delay: .75s;
            }

            .story-block.in-view .story-arrow-1 {
                transition-delay: .85s;
            }

            .story-block.in-view .story-arrow-2 {
                transition-delay: .95s;
            }

            /* Arrow draw effect */
            .story-block .story-arrow-1 path,
            .story-block .story-arrow-2 path {
                stroke-dasharray: 400;
                stroke-dashoffset: 400;
                transition: stroke-dashoffset 1.4s cubic-bezier(.22, .61, .36, 1);
            }

            .story-block.in-view .story-arrow-1 path,
            .story-block.in-view .story-arrow-2 path {
                stroke-dashoffset: 0;
            }

            .story-block.in-view .story-arrow-1 path:nth-child(1) {
                transition-delay: .85s;
            }

            .story-block.in-view .story-arrow-1 path:nth-child(2) {
                transition-delay: 1.3s;
            }

            .story-block.in-view .story-arrow-1 path:nth-child(3) {
                transition-delay: 1.35s;
            }

            .story-block.in-view .story-arrow-2 path:nth-child(1) {
                transition-delay: .95s;
            }

            .story-block.in-view .story-arrow-2 path:nth-child(2) {
                transition-delay: 1.4s;
            }

            .story-block.in-view .story-arrow-2 path:nth-child(3) {
                transition-delay: 1.45s;
            }











/* COLLABORATIONS */





       /* ==== COLLAB SECTION — UNIQUE CLASSES ==== */
            .collab-block .collab-heading,
            .collab-block .collab-phone-1,
            .collab-block .collab-phone-2,
            .collab-block .collab-phone-3,
            .collab-block .collab-phone-4,
            .collab-block .collab-phone-5 {
                opacity: 0;
                transition: opacity 1s cubic-bezier(.22, .61, .36, 1),
                    translate 1s cubic-bezier(.22, .61, .36, 1),
                    rotate .8s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, rotate;
            }

            /* Initial offsets — alternating directions */
            .collab-block .collab-heading {
                translate: 0 40px;
            }

            .collab-block .collab-phone-1 {
                translate: -60px 80px;
            }

            .collab-block .collab-phone-2 {
                translate: 0 -100px;
            }

            .collab-block .collab-phone-3 {
                translate: 0 100px;
            }

            .collab-block .collab-phone-4 {
                translate: 0 -100px;
            }

            .collab-block .collab-phone-5 {
                translate: 60px 80px;
            }

            /* Triggered state */
            .collab-block.in-view .collab-heading,
            .collab-block.in-view .collab-phone-1,
            .collab-block.in-view .collab-phone-2,
            .collab-block.in-view .collab-phone-3,
            .collab-block.in-view .collab-phone-4,
            .collab-block.in-view .collab-phone-5 {
                opacity: 1;
                translate: 0 0;
            }

            /* Stagger delays */
            .collab-block.in-view .collab-heading {
                transition-delay: .05s;
            }

            .collab-block.in-view .collab-phone-1 {
                transition-delay: .20s;
            }

            .collab-block.in-view .collab-phone-2 {
                transition-delay: .35s;
            }

            .collab-block.in-view .collab-phone-3 {
                transition-delay: .50s;
            }

            .collab-block.in-view .collab-phone-4 {
                transition-delay: .65s;
            }

            .collab-block.in-view .collab-phone-5 {
                transition-delay: .80s;
            }
     








/* photoshoot */





            /* ==== SHOTS SECTION — UNIQUE CLASSES ==== */
            .shots-block .shots-title,
            .shots-block .shots-m-back-1,
            .shots-block .shots-m-front-1,
            .shots-block .shots-m-back-2,
            .shots-block .shots-m-front-2,
            .shots-block .shots-m-back-3,
            .shots-block .shots-m-front-3,
            .shots-block .shots-photo-back-1,
            .shots-block .shots-photo-main-1,
            .shots-block .shots-photo-back-2,
            .shots-block .shots-photo-main-2,
            .shots-block .shots-photo-back-3,
            .shots-block .shots-photo-main-3 {
                opacity: 0;
                transition: opacity 1s cubic-bezier(.22, .61, .36, 1),
                    translate 1s cubic-bezier(.22, .61, .36, 1),
                    scale 1s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, scale;
            }

            /* Title */
            .shots-block .shots-title {
                translate: 0 -30px;
            }

            /* Mobile slide 1 */
            .shots-block .shots-m-back-1 {
                translate: -40px 20px;
            }

            .shots-block .shots-m-front-1 {
                translate: 40px -60px;
                scale: .85;
            }

            /* Mobile slide 2 */
            .shots-block .shots-m-back-2 {
                translate: -40px 20px;
            }

            .shots-block .shots-m-front-2 {
                translate: 40px 30px;
                scale: .85;
            }

            /* Mobile slide 3 */
            .shots-block .shots-m-back-3 {
                translate: -40px -20px;
            }

            .shots-block .shots-m-front-3 {
                translate: 40px -40px;
                scale: .85;
            }

            /* Desktop back images */
            .shots-block .shots-photo-back-1 {
                translate: -60px 0;
                scale: .85;
            }

            .shots-block .shots-photo-back-2 {
                translate: 0 60px;
                scale: .85;
            }

            .shots-block .shots-photo-back-3 {
                translate: 60px 0;
                scale: .85;
            }

            /* Desktop main images */
            .shots-block .shots-photo-main-1 {
                translate: -40px -60px;
                scale: .9;
            }

            .shots-block .shots-photo-main-2 {
                translate: 0 80px;
                scale: .9;
            }

            .shots-block .shots-photo-main-3 {
                translate: 40px -60px;
                scale: .9;
            }

            /* TRIGGERED */
            .shots-block.in-view .shots-title,
            .shots-block.in-view .shots-m-back-1,
            .shots-block.in-view .shots-m-front-1,
            .shots-block.in-view .shots-m-back-2,
            .shots-block.in-view .shots-m-front-2,
            .shots-block.in-view .shots-m-back-3,
            .shots-block.in-view .shots-m-front-3,
            .shots-block.in-view .shots-photo-back-1,
            .shots-block.in-view .shots-photo-main-1,
            .shots-block.in-view .shots-photo-back-2,
            .shots-block.in-view .shots-photo-main-2,
            .shots-block.in-view .shots-photo-back-3,
            .shots-block.in-view .shots-photo-main-3 {
                opacity: 1;
                translate: 0 0;
                scale: 1;
            }

            /* Stagger delays */
            .shots-block.in-view .shots-title {
                transition-delay: .05s;
            }

            .shots-block.in-view .shots-photo-back-1 {
                transition-delay: .20s;
            }

            .shots-block.in-view .shots-photo-back-2 {
                transition-delay: .35s;
            }

            .shots-block.in-view .shots-photo-back-3 {
                transition-delay: .50s;
            }

            .shots-block.in-view .shots-photo-main-1 {
                transition-delay: .40s;
            }

            .shots-block.in-view .shots-photo-main-2 {
                transition-delay: .55s;
            }

            .shots-block.in-view .shots-photo-main-3 {
                transition-delay: .70s;
            }

            .shots-block.in-view .shots-m-back-1 {
                transition-delay: .15s;
            }

            .shots-block.in-view .shots-m-front-1 {
                transition-delay: .30s;
            }

            .shots-block.in-view .shots-m-back-2 {
                transition-delay: .20s;
            }

            .shots-block.in-view .shots-m-front-2 {
                transition-delay: .35s;
            }

            .shots-block.in-view .shots-m-back-3 {
                transition-delay: .25s;
            }

            .shots-block.in-view .shots-m-front-3 {
                transition-delay: .40s;
            }



/* why me */









            /* ==== WHY SECTION — UNIQUE CLASSES ==== */
            .why-block .why-img,
            .why-block .why-title-wrap,
            .why-block .why-subtitle,
            .why-block .why-heading,
            .why-block .why-text-1,
            .why-block .why-text-2,
            .why-block .why-text-3,
            .why-block .why-arrow-1,
            .why-block .why-arrow-2,
            .why-block .why-arrow-3 {
                opacity: 0;
                transition: opacity 1s cubic-bezier(.22, .61, .36, 1),
                    translate 1s cubic-bezier(.22, .61, .36, 1),
                    scale 1s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, scale;
            }

            /* Initial offsets */
            .why-block .why-img {
                translate: 0 80px;
                scale: .95;
            }

            .why-block .why-title-wrap {
                scale: .75;
            }

            .why-block .why-subtitle {
                translate: 0 30px;
            }

            .why-block .why-heading {
                translate: 0 40px;
            }

            .why-block .why-text-1 {
                translate: -60px 0;
            }

            .why-block .why-text-2 {
                translate: 60px 0;
            }

            .why-block .why-text-3 {
                translate: 0 60px;
            }

            .why-block .why-arrow-1,
            .why-block .why-arrow-2,
            .why-block .why-arrow-3 {
                translate: 30px 0;
            }

            /* TRIGGERED */
            .why-block.in-view .why-img,
            .why-block.in-view .why-title-wrap,
            .why-block.in-view .why-subtitle,
            .why-block.in-view .why-heading,
            .why-block.in-view .why-text-1,
            .why-block.in-view .why-text-2,
            .why-block.in-view .why-text-3,
            .why-block.in-view .why-arrow-1,
            .why-block.in-view .why-arrow-2,
            .why-block.in-view .why-arrow-3 {
                opacity: 1;
                translate: 0 0;
                scale: 1;
            }

            /* Stagger */
            .why-block.in-view .why-img {
                transition-delay: .10s;
            }

            .why-block.in-view .why-title-wrap {
                transition-delay: .30s;
            }

            .why-block.in-view .why-subtitle {
                transition-delay: .40s;
            }

            .why-block.in-view .why-heading {
                transition-delay: .50s;
            }

            .why-block.in-view .why-text-1 {
                transition-delay: .60s;
            }

            .why-block.in-view .why-text-2 {
                transition-delay: .70s;
            }

            .why-block.in-view .why-text-3 {
                transition-delay: .80s;
            }

            .why-block.in-view .why-arrow-1 {
                transition-delay: .65s;
            }

            .why-block.in-view .why-arrow-2 {
                transition-delay: .75s;
            }

            .why-block.in-view .why-arrow-3 {
                transition-delay: .85s;
            }

            /* Arrow draw effect */
            .why-block .why-arrow-1 path,
            .why-block .why-arrow-2 path,
            .why-block .why-arrow-3 path {
                stroke-dasharray: 400;
                stroke-dashoffset: 400;
                transition: stroke-dashoffset 1.5s cubic-bezier(.22, .61, .36, 1);
            }

            .why-block.in-view .why-arrow-1 path,
            .why-block.in-view .why-arrow-2 path,
            .why-block.in-view .why-arrow-3 path {
                stroke-dashoffset: 0;
            }

            .why-block.in-view .why-arrow-1 path:nth-child(1) {
                transition-delay: .65s;
            }

            .why-block.in-view .why-arrow-1 path:nth-child(2) {
                transition-delay: 1.05s;
            }

            .why-block.in-view .why-arrow-1 path:nth-child(3) {
                transition-delay: 1.10s;
            }

            .why-block.in-view .why-arrow-2 path:nth-child(1) {
                transition-delay: .75s;
            }

            .why-block.in-view .why-arrow-2 path:nth-child(2) {
                transition-delay: 1.15s;
            }

            .why-block.in-view .why-arrow-2 path:nth-child(3) {
                transition-delay: 1.20s;
            }

            .why-block.in-view .why-arrow-3 path {
                transition-delay: .85s;
            }






/* socialmeet */



/* ==== MEET SECTION — UNIQUE CLASSES ==== */
.meet-block .meet-heading,
.meet-block .meet-m-back-1,
.meet-block .meet-m-front-1,
.meet-block .meet-m-back-2,
.meet-block .meet-m-front-2,
.meet-block .meet-m-back-3,
.meet-block .meet-m-front-3,
.meet-block .meet-m-back-4,
.meet-block .meet-m-front-4,
.meet-block .meet-m-back-5,
.meet-block .meet-m-front-5,
.meet-block .meet-img-1,
.meet-block .meet-img-2,
.meet-block .meet-img-3,
.meet-block .meet-img-5,
.meet-block .meet-img-6,
.meet-block .meet-img-7,
.meet-block .meet-img-8,
.meet-block .meet-img-9,
.meet-block .meet-img-10,
.meet-block .meet-img-11 {
    opacity: 0;
    transition: opacity 1s cubic-bezier(.22, .61, .36, 1),
        translate 1s cubic-bezier(.22, .61, .36, 1),
        scale 1s cubic-bezier(.22, .61, .36, 1);
    will-change: opacity, translate, scale;
}

/* Heading */
.meet-block .meet-heading {
    translate: 0 -40px;
}

/* Mobile slide 1 */
.meet-block .meet-m-back-1 {
    translate: -50px -40px;
    scale: .85;
}
.meet-block .meet-m-front-1 {
    translate: 50px 30px;
    scale: .85;
}

/* Mobile slide 2 */
.meet-block .meet-m-back-2 {
    translate: -50px 0;
    scale: .85;
}
.meet-block .meet-m-front-2 {
    translate: 50px 20px;
    scale: .85;
}

/* Mobile slide 3 */
.meet-block .meet-m-back-3 {
    translate: -50px 20px;
    scale: .85;
}
.meet-block .meet-m-front-3 {
    translate: 50px -30px;
    scale: .85;
}

/* Mobile slide 4 (NEW) */
.meet-block .meet-m-back-4 {
    translate: 50px -40px;
    scale: .85;
}
.meet-block .meet-m-front-4 {
    translate: -50px 30px;
    scale: .85;
}

/* Mobile slide 5 (NEW) */
.meet-block .meet-m-back-5 {
    translate: -40px 40px;
    scale: .85;
}
.meet-block .meet-m-front-5 {
    translate: 50px -20px;
    scale: .85;
}

/* Desktop images — alternating directions */
.meet-block .meet-img-1 {
    translate: 0 -60px;
    scale: .9;
}
.meet-block .meet-img-2 {
    translate: -80px 0;
    scale: .9;
}
.meet-block .meet-img-3 {
    translate: 0 80px;
    scale: .9;
}
.meet-block .meet-img-5 {
    translate: -60px 60px;
    scale: .9;
}
.meet-block .meet-img-6 {
    translate: 0 80px;
    scale: .9;
}
.meet-block .meet-img-7 {
    translate: 80px 60px;
    scale: .9;
}

/* NEW desktop images */
.meet-block .meet-img-8 {
    translate: 80px -50px;
    scale: .9;
}
.meet-block .meet-img-9 {
    translate: -70px 40px;
    scale: .9;
}
.meet-block .meet-img-10 {
    translate: 60px -60px;
    scale: .9;
}
.meet-block .meet-img-11 {
    translate: 90px 50px;
    scale: .9;
}

/* TRIGGERED */
.meet-block.in-view .meet-heading,
.meet-block.in-view .meet-m-back-1,
.meet-block.in-view .meet-m-front-1,
.meet-block.in-view .meet-m-back-2,
.meet-block.in-view .meet-m-front-2,
.meet-block.in-view .meet-m-back-3,
.meet-block.in-view .meet-m-front-3,
.meet-block.in-view .meet-m-back-4,
.meet-block.in-view .meet-m-front-4,
.meet-block.in-view .meet-m-back-5,
.meet-block.in-view .meet-m-front-5,
.meet-block.in-view .meet-img-1,
.meet-block.in-view .meet-img-2,
.meet-block.in-view .meet-img-3,
.meet-block.in-view .meet-img-5,
.meet-block.in-view .meet-img-6,
.meet-block.in-view .meet-img-7,
.meet-block.in-view .meet-img-8,
.meet-block.in-view .meet-img-9,
.meet-block.in-view .meet-img-10,
.meet-block.in-view .meet-img-11 {
    opacity: 1;
    translate: 0 0;
    scale: 1;
}

/* Stagger delays — existing */
.meet-block.in-view .meet-heading { transition-delay: .05s; }
.meet-block.in-view .meet-img-2  { transition-delay: .20s; }
.meet-block.in-view .meet-img-1  { transition-delay: .30s; }
.meet-block.in-view .meet-img-3  { transition-delay: .40s; }
.meet-block.in-view .meet-img-5  { transition-delay: .50s; }
.meet-block.in-view .meet-img-6  { transition-delay: .60s; }
.meet-block.in-view .meet-img-7  { transition-delay: .70s; }

/* NEW desktop stagger delays */
.meet-block.in-view .meet-img-8  { transition-delay: .45s; }
.meet-block.in-view .meet-img-9  { transition-delay: .55s; }
.meet-block.in-view .meet-img-10 { transition-delay: .65s; }
.meet-block.in-view .meet-img-11 { transition-delay: .75s; }

/* Mobile stagger delays — existing */
.meet-block.in-view .meet-m-back-1  { transition-delay: .15s; }
.meet-block.in-view .meet-m-front-1 { transition-delay: .30s; }
.meet-block.in-view .meet-m-back-2  { transition-delay: .20s; }
.meet-block.in-view .meet-m-front-2 { transition-delay: .35s; }
.meet-block.in-view .meet-m-back-3  { transition-delay: .25s; }
.meet-block.in-view .meet-m-front-3 { transition-delay: .40s; }

/* NEW mobile stagger delays */
.meet-block.in-view .meet-m-back-4  { transition-delay: .30s; }
.meet-block.in-view .meet-m-front-4 { transition-delay: .45s; }
.meet-block.in-view .meet-m-back-5  { transition-delay: .35s; }
.meet-block.in-view .meet-m-front-5 { transition-delay: .50s; }

/* Hide scrollbar on mobile carousel */
.meet-block .snap-x::-webkit-scrollbar {
    display: none;
}






/* Desktop */









     /* ==== PUZZLE ANIMATION (untouched, your original) ==== */
            .puzzle-piece {
                opacity: 0;
                transform: translate(var(--x), var(--y)) rotate(var(--r)) scale(0.1);
                transition: all 1.6s cubic-bezier(0.16, 1, 0.3, 1);
                transition-delay: var(--delay);
                will-change: transform, opacity;
            }

            .puzzle-container.is-visible .puzzle-piece {
                opacity: 1;
                transform: translate(0, 0) rotate(0deg) scale(1);
            }

            /* ==== WLC SECTION — ENTRANCE CLASSES ==== */
            .wlc-block .wlc-phone-mobile,
            .wlc-block .wlc-laptop,
            .wlc-block .wlc-heading,
            .wlc-block .wlc-copy {
                opacity: 0;
                transition: opacity .9s cubic-bezier(.22, .61, .36, 1),
                    translate .9s cubic-bezier(.22, .61, .36, 1),
                    scale .9s cubic-bezier(.22, .61, .36, 1);
                will-change: opacity, translate, scale;
            }

            /* Initial offsets */
            .wlc-block .wlc-phone-mobile {
                translate: 0 60px;
            }

            .wlc-block .wlc-laptop {
                translate: -80px 0;
            }

            .wlc-block .wlc-heading {
                translate: 0 30px;
            }

            .wlc-block .wlc-copy {
                translate: 0 40px;
            }

            /* Triggered state */
            .wlc-block.in-view .wlc-phone-mobile,
            .wlc-block.in-view .wlc-laptop,
            .wlc-block.in-view .wlc-heading,
            .wlc-block.in-view .wlc-copy {
                opacity: 1;
                translate: 0 0;
                scale: 1;
            }

            /* Stagger */
            .wlc-block.in-view .wlc-laptop {
                transition-delay: .10s;
            }

            .wlc-block.in-view .wlc-phone-mobile {
                transition-delay: .10s;
            }

            .wlc-block.in-view .wlc-heading {
                transition-delay: .35s;
            }

            .wlc-block.in-view .wlc-copy {
                transition-delay: .55s;
            }