/* ===============================
           ROOT
        ================================ */

        :root {
            --black: #080808;
            --dark: #111111;
            --dark-light: #181818;
            --gold: #b78a52;
            --copper: #a96f45;
            --light-gold: #d5b27b;
            --white: #f5f2ed;
            --grey: #a7a7a7;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html {
            scroll-behavior: smooth;
            scroll-snap-type: y mandatory;
        }

        body {
            font-family: 'Inter', sans-serif;
            background: var(--black);
            color: var(--white);
            overflow-x: hidden;
        }


        /* ===============================
           NAVIGATION
        ================================ */

        .navbar {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1000;

            padding: 28px 6%;

            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .logo {
            font-family: 'Playfair Display', serif;
            font-size: 25px;
            letter-spacing: 3px;
            color: #fff;
            text-transform: uppercase;
        }

        .logo img { height: 70px; }

        .logo span {
            color: var(--gold);
        }

        .nav-right {
            display: flex;
            align-items: center;
            gap: 30px;
        }

        .wave-logo {
            font-size: 12px;
            letter-spacing: 2px;
            color: #d7d7d7;
            text-transform: uppercase;
        }


        /* ===============================
           HERO SECTION
        ================================ */

        .hero {
            height: 100vh;
            /*min-height: 650px;*/

            position: relative;

            display: flex;
            align-items: flex-end;

            overflow: hidden;
        }

        .hero video {
            position: absolute;

            width: 100%;
            height: 100%;

            top: 0;
            left: 0;

            object-fit: cover;
        }

        .hero-overlay {
            position: absolute;
            inset: 0;

            background:
                linear-gradient(
                    180deg,
                    rgba(0,0,0,.35) 0%,
                    rgba(0,0,0,.15) 40%,
                    rgba(0,0,0,.85) 100%
                );
        }

        .hero-content {
            position: relative;
            z-index: 2;

            padding: 0 6% 80px;

            max-width: 900px;
        }

        .hero-tag {
            color: var(--gold);

            font-size: 11px;
            letter-spacing: 4px;

            text-transform: uppercase;

            margin-bottom: 25px;
        }

        .hero h1 {
            font-family: 'Playfair Display', serif;

            font-size: clamp(55px, 8vw, 120px);

            font-weight: 400;

            line-height: .95;

            letter-spacing: -2px;
        }

        .hero h1 span {
            color: var(--gold);
        }

 .hero-video-wrap {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

#heroVideo {
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
}

/* Sound Button */
#soundToggle {
    position: absolute;
    right: 30px;
    bottom: 30px;

    width: 50px;
    height: 50px;

    border: 1px solid rgba(255,255,255,0.6);
    border-radius: 50%;

    background: rgba(0,0,0,0.35);
    color: #fff;

    font-size: 20px;
    cursor: pointer;

    z-index: 10;

    display: flex;
    align-items: center;
    justify-content: center;

    backdrop-filter: blur(8px);

    transition: all 0.3s ease;
}

#soundToggle:hover {
    background: rgba(0,0,0,0.65);
    transform: scale(1.05);
}


/* Mobile */

@media (max-width: 767px) {

  .hero,
    .hero-video-wrap {
        height: 350px;
    }

    #heroVideo {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

   
    #soundToggle {
        left: 15px;
        bottom: 15px;

        width: 42px;
        height: 42px;

        font-size: 17px;
    }
}
        /* ===============================
           STICKY CTA
        ================================ */

        .sticky-cta {
            position: fixed;
    right: 20px;
    top: 30%;
    transform: translateY(-50%) rotate(-90deg);
    transform-origin: right center;
    z-index: 999;
    background: var(--gold);
    color: #fff;
    text-decoration: none;
    padding: 16px 30px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    transition: .3s ease;
    border-radius: 12px 12px 0px 0px;
        }

        .sticky-cta:hover {
            background: var(--white);
            color: #111;
        }


        /* ===============================
           SECTION COMMON
        ================================ */

        section {
            position: relative;
        }

        .hero,
        .benchmark-section,
        .coming-section {

            height: 100vh;
            height: 100dvh;

            display: flex;

            align-items: center;

            overflow: hidden;

            scroll-snap-align: start;

            scroll-snap-stop: always;

        }

        .container {
            width: min(1200px, 88%);
            margin: auto;
        }


        /* ===============================
           SECTION II - THE NEXT BENCHMARK
        ================================ */

        .benchmark-section {

            position: relative;

            isolation: isolate;

            background-color: #090705;

            background-image:
                radial-gradient(ellipse 55% 65% at 0% 0%, rgba(226,196,143,.30), transparent 70%),
                radial-gradient(ellipse 50% 60% at 78% 50%, rgba(183,138,82,.12), transparent 70%),
                linear-gradient(180deg, #0d0a07, #070605);

            padding: clamp(24px, 5vh, 60px) 0;

        }

        /* neeche wali curved gold light streak */
        .benchmark-section::after {

            content: "";

            position: absolute;

            left: 0;
            right: 0;
            bottom: 0;

            height: 24%;

            z-index: -1;

            pointer-events: none;

            background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 200' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' x2='1'%3E%3Cstop offset='0' stop-color='rgb(213,178,123)' stop-opacity='0'/%3E%3Cstop offset='.25' stop-color='rgb(226,196,143)' stop-opacity='.95'/%3E%3Cstop offset='.7' stop-color='rgb(183,138,82)' stop-opacity='.35'/%3E%3Cstop offset='1' stop-color='rgb(183,138,82)' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath vector-effect='non-scaling-stroke' d='M0 90 C 260 40, 520 60, 760 120 S 1200 170, 1400 150' fill='none' stroke='url(%23g)' stroke-width='2'/%3E%3Cpath vector-effect='non-scaling-stroke' d='M0 125 C 300 75, 560 105, 820 155 S 1200 190, 1400 180' fill='none' stroke='url(%23g)' stroke-width='1' opacity='.5'/%3E%3C/svg%3E") no-repeat center / 100% 100%;

            filter: drop-shadow(0 0 6px rgba(213,178,123,.6));

        }

        .benchmark-section .container {

            width: min(1320px, 90%);

        }

        .benchmark-grid {

            display: grid;

            grid-template-columns: 1fr 1.1fr;

            align-items: center;

            gap: clamp(40px, 5vw, 90px);

        }

        /* eyebrow: gold line + label */
        .benchmark-eyebrow {

            display: flex;

            align-items: center;

            gap: 18px;

            color: var(--light-gold);

            font-size: 12px;

            letter-spacing: 4px;

            text-transform: uppercase;

            margin-bottom: clamp(16px, 3.5vh, 38px);

        }

        .benchmark-eyebrow::before {

            content: "";

            width: 60px;

            height: 1px;

            background: var(--gold);

        }

        .benchmark-content h2 {

            font-family: 'Playfair Display', serif;

            font-size: clamp(30px, 3.4vw, 54px);

            font-weight: 400;

            line-height: 1.14;

            letter-spacing: -.3px;

            margin-bottom: clamp(18px, 3.5vh, 38px);

            text-shadow: 0 6px 30px rgba(0,0,0,.5);

        }

        .benchmark-content h2 .line {

            display: block;

            white-space: nowrap;

            font-style: normal;

        }

        .benchmark-content h2 .line-1 {

            color: var(--white);

        }

        .benchmark-content h2 .line-2 {

            background: linear-gradient(90deg, #f0d9ac 0%, #d5b27b 55%, #b78a52 100%);

            -webkit-background-clip: text;
            background-clip: text;

            -webkit-text-fill-color: transparent;

            color: var(--light-gold);

        }

        .benchmark-content h2 .line-3 {

            color: var(--white);

            font-style: italic;

        }

        /* tagline: chhoti line + spaced caps */
        .benchmark-tagline {

            display: flex;

            align-items: center;

            gap: 20px;

            font-size: 12px;

            font-weight: 300;

            letter-spacing: 4px;

            text-transform: uppercase;

            color: #b7a58c;

            margin-bottom: clamp(20px, 4vh, 44px);

        }

        .benchmark-tagline::before {

            content: "";

            width: 56px;

            height: 1px;

            background: var(--gold);

        }


        /* ===============================
           BUTTON
        ================================ */

        .btn {

            display: inline-flex;

            align-items: center;

            justify-content: center;

            border: 1px solid var(--gold);

            color: var(--gold);

            padding: 16px 32px;

            text-decoration: none;

            font-size: 11px;

            letter-spacing: 2px;

            text-transform: uppercase;

            transition: all .4s ease;

        }

        .btn:hover {

            background: var(--gold);

            color: #111;

        }

        /* Stay Tuned -> arrow wala glowing button */
        .benchmark-content .btn {

            gap: 26px;

            padding: 20px 36px;

            font-size: 12px;

            letter-spacing: 4px;

            color: var(--light-gold);

            background: linear-gradient(90deg, rgba(183,138,82,.16), rgba(0,0,0,.55));

            box-shadow:
                0 0 24px rgba(183,138,82,.22),
                inset 0 0 18px rgba(183,138,82,.10);

        }

        .benchmark-content .btn svg {

            transition: transform .4s ease;

        }

        .benchmark-content .btn:hover {

            color: #111;

            background: linear-gradient(90deg, #e2c48f, var(--gold));

            box-shadow: 0 0 34px rgba(183,138,82,.5);

        }

        .benchmark-content .btn:hover svg {

            transform: translateX(6px);

        }


        /* ===============================
           VISUAL AREA (framed image)
        ================================ */

        .visual-box {

            position: relative;

            height: min(600px, 68vh);

            transform: perspective(1800px) rotateY(-2.5deg);

            transition: transform .8s ease;

        }

        .visual-box:hover {

            transform: perspective(1800px) rotateY(0deg);

        }

        /* peeche wali offset gold frame */
        .visual-box::before {

            content: "";

            position: absolute;

            inset: 0;

            border: 1px solid rgba(226,196,143,.6);

            transform: translate(16px, -16px);

            pointer-events: none;

        }

        .visual-frame {

            position: relative;

            width: 100%;

            height: 100%;

            overflow: hidden;

            background: linear-gradient(135deg, #1a1a1a, #090909);

            border: 1px solid rgba(226,196,143,.7);

            box-shadow:
                0 0 60px rgba(213,178,123,.22),
                0 30px 70px rgba(0,0,0,.6);

        }

        .visual-frame img {

            display: block;

            width: 100%;

            height: 100%;

            object-fit: cover;

            transition: transform 1s ease;

        }

        .visual-box:hover .visual-frame img {

            transform: scale(1.05);

        }

        .visual-frame::after {

            content: "";

            position: absolute;

            inset: 0;

            background: linear-gradient(135deg, rgba(183,138,82,.12), transparent 60%);

            pointer-events: none;

        }


        /* ===============================
           SECTION III - A NEW WAY TO LIVE
           Premium image background + glass cards
           Image path: assets/images/new-way-to-live-bg.jpg
        ================================ */

        .coming-section {

            position: relative;

            isolation: isolate;

            background-color: #0c0c0c;

            /* image upar, gradient neeche (image na mile to fallback dikhega) */
            background-image:
                url("../images/new-way-to-live-bg.jpg"),
                linear-gradient(135deg, #1d1610 0%, #0b0b0b 60%, #17110b 100%);

            background-size: cover, cover;

            background-position: center, center;

            background-repeat: no-repeat, no-repeat;

            color: var(--white);

            padding: clamp(24px, 5vh, 60px) 0;

            text-align: center;

        }

        /* dark + gold overlay taake text hamesha readable rahe */
        .coming-section::before {

            content: "";

            position: absolute;

            inset: 0;

            z-index: -1;

            background:
                radial-gradient(circle at 50% 0%, rgba(183,138,82,.18), transparent 55%),
                linear-gradient(
                    180deg,
                    rgba(8,8,8,.88) 0%,
                    rgba(8,8,8,.62) 45%,
                    rgba(8,8,8,.92) 100%
                );

        }

        .coming-section .container {

            position: relative;

            z-index: 2;

        }

        .location-label {

            color: var(--light-gold);

            font-size: 12px;

            letter-spacing: 3px;

            text-transform: uppercase;

            line-height: 1.8;

            margin-bottom: clamp(14px, 3vh, 34px);

        }

        /* label ke upar patli gold line */
        .location-label::before {

            content: "";

            display: block;

            width: 1px;

            height: clamp(20px, 4vh, 44px);

            margin: 0 auto clamp(10px, 2vh, 18px);

            background: linear-gradient(180deg, transparent, var(--gold));

        }

        .coming-section h2 {

            font-family: 'Playfair Display', serif;

            font-size: clamp(32px, 5.2vw, 68px);

            font-weight: 400;

            line-height: 1;

            letter-spacing: 1px;

            text-shadow: 0 6px 30px rgba(0,0,0,.6);

        }

        .coming-section h2 span, .lead-content h2 span {

            /*font-style: italic;*/

            background: linear-gradient(90deg, var(--light-gold), var(--gold), var(--copper));

            -webkit-background-clip: text;
            background-clip: text;

            -webkit-text-fill-color: transparent;

            color: var(--gold);

        }

        .feature-grid {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: clamp(16px, 2.5vw, 36px);

            max-width: 1040px;

            margin: 0 auto;

        }

        .feature-card {

            position: relative;

            display: flex;

            flex-direction: column;

            align-items: center;

            gap: clamp(10px, 1.6vh, 18px);

            padding: clamp(26px, 4.5vh, 56px) clamp(18px, 2vw, 32px) clamp(24px, 4vh, 48px);

            background: linear-gradient(160deg, rgba(255,255,255,.10), rgba(255,255,255,.02));

            border: 1px solid rgba(213,178,123,.22);

            border-radius: 4px;

            -webkit-backdrop-filter: blur(14px);
            backdrop-filter: blur(14px);

            box-shadow: 0 25px 60px rgba(0,0,0,.45);

            overflow: hidden;

            transition: all .45s cubic-bezier(.25,.8,.25,1);

        }

        .feature-card::before {

            content: "";

            position: absolute;

            top: 0;
            left: 0;
            right: 0;

            height: 2px;

            background: linear-gradient(90deg, var(--gold), var(--copper));

            transform: scaleX(0);

            transform-origin: left;

            transition: transform .45s ease;

        }

        .feature-card:hover {

            transform: translateY(-10px);

            border-color: rgba(213,178,123,.55);

            background: linear-gradient(160deg, rgba(255,255,255,.14), rgba(255,255,255,.04));

            box-shadow: 0 30px 70px rgba(169,111,69,.25);

        }

        .feature-card:hover::before {

            transform: scaleX(1);

        }

        .feature-num {

            position: absolute;

            top: 14px;
            right: 20px;

            font-family: 'Playfair Display', serif;

            font-size: clamp(26px, 4vh, 40px);

            line-height: 1;

            color: rgba(213,178,123,.22);

            transition: color .45s ease;

        }

        .feature-card:hover .feature-num {

            color: rgba(213,178,123,.5);

        }

        .feature-icon {

            width: clamp(52px, 7vh, 80px);
            height: clamp(52px, 7vh, 80px);

            display: flex;
            align-items: center;
            justify-content: center;

            border-radius: 50%;

            border: 1px solid rgba(213,178,123,.45);

            background: rgba(183,138,82,.08);

            color: var(--light-gold);

            transition: all .45s ease;

        }

        .feature-icon svg {

            width: 60%;
            height: 60%;

        }

        .feature-card:hover .feature-icon {

            background: linear-gradient(135deg, var(--gold), var(--copper));

            border-color: transparent;

            color: #111;

            transform: scale(1.08) rotate(-6deg);

        }
         .feature-card:hover .feature-icon svg {color: #fff}

        .feature-card h3 {

            font-size: 12px;

            font-weight: 300;

            letter-spacing: 3px;

            text-transform: uppercase;

            color: var(--white);

        }

        .feature-card h3 strong {

            display: block;

            font-size: clamp(16px, 2.2vh, 20px);

            font-weight: 600;

            letter-spacing: 4px;

            color: var(--light-gold);

            margin-bottom: 6px;

        }

        /* heading ke neeche chhoti gold line */
        .feature-card h3::after {

            content: "";

            display: block;

            width: 28px;

            height: 1px;

            background: var(--gold);

            margin: clamp(10px, 1.6vh, 16px) auto 0;

        }

        .feature-card p {

            font-size: 14px;

            font-weight: 300;

            line-height: 1.7;

            color: rgba(245,242,237,.72);

        }

        @media(max-width: 900px) {

            .feature-grid {

                grid-template-columns: 1fr;

                max-width: 420px;

                gap: 22px;

            }

        }


        /* ===============================
           SECTION IV
        ================================ */

        .lead-section {

            background:
                radial-gradient(
                    circle at top right,
                    #292018,
                    #090909 60%
                );

            /* full height removed - content ke hisaab se height */
            display: block;
            height: auto;
            min-height: 0;
            overflow: visible;

            scroll-snap-align: start;
            scroll-snap-stop: normal;

            padding: clamp(70px, 10vh, 120px) 0;

        }

        .lead-grid {

            display: grid;

            grid-template-columns:
                .9fr
                1.1fr;

            gap: clamp(40px, 6vw, 100px);

            align-items: center;

        }

        .lead-content small {

            color: var(--gold);

            font-size: 11px;

            letter-spacing: 3px;

            text-transform: uppercase;

            display: block;

            margin-bottom: clamp(10px, 2vh, 25px);

        }

        .lead-content h2 {

            font-family:
                'Playfair Display',
                serif;

            font-size:
                clamp(
                    30px,
                    3.5vw,
                    56px
                );

            font-weight: 400;

            line-height: 1.05;

        }


        /* ===============================
           FORM
        ================================ */

        .lead-form {

            background: rgba(255,255,255,.04);

            border: 1px solid rgba(183,138,82,.35);

            padding: clamp(20px, 3.5vh, 50px);

        }

        .form-group {

            margin-bottom: clamp(10px, 2vh, 22px);

        }

        .form-group input,
        .form-group textarea,
        .form-group select {

            width: 100%;

            background: transparent;

            border: none;

            border-bottom:
                1px solid
                rgba(255,255,255,.25);

            padding: clamp(8px, 1.5vh, 15px) 0;

            color: #fff;

            outline: none;

            font-family: inherit;

            font-size: 14px;

            resize: none;

        }

        .form-group textarea {

            height: clamp(36px, 6vh, 60px);

        }

        .form-group select option {

            background: #111;

            color: #fff;

        }

        .form-group input::placeholder {

            color: #888;

        }

        .submit-btn {

            width: 100%;

            border: none;

            background: var(--gold);

            color: #111;

            padding: clamp(12px, 2vh, 18px);

            font-size: 11px;

            font-weight: 600;

            letter-spacing: 2px;

            text-transform: uppercase;

            cursor: pointer;

            margin-top: clamp(6px, 1.5vh, 15px);

            transition: .3s;

        }

        .submit-btn:hover {

            background: var(--white);

        }


        /* ===============================
           FOOTER
        ================================ */

        footer {

            background: #050505;

            border-top:
                1px solid
                rgba(255,255,255,.08);

            padding: 35px 6%;

            display: flex;

            justify-content: space-between;

            align-items: center;

            flex-wrap: wrap;

            gap: 20px;

        }

        footer p {

            font-size: 11px;

            color: #777;

        }

        .footer-brand {

            color: var(--gold);

            font-size: 12px;

            letter-spacing: 2px;

            text-transform: uppercase;

        }


        /* ===============================
           RESPONSIVE
        ================================ */

        @media(max-width: 900px) {

            .benchmark-grid,
            .lead-grid {

                grid-template-columns: 1fr;

                gap: 60px;

            }

            .hero,
        .benchmark-section,
        .coming-section {

                height: auto;
                min-height: 100vh;
                min-height: 100dvh;

                overflow-y: auto;

            }

            .benchmark-section {

                padding: 90px 0;

            }

            .visual-box {

                height: 450px;

            }

            .coming-section {

                padding: 100px 0;

            }

        }


        @media(max-width: 600px) {

            .navbar {

                padding: 22px 6%;

            }

            .logo {

                font-size: 18px;

            }

            .wave-logo {

                display: none;

            }

            .hero {

               /* min-height: 650px;*/

            }

            .hero-content {

                padding-bottom: 55px;

            }

            .lead-form {

                padding: 30px 25px;

            }

            .sticky-cta {

                padding: 13px 22px;

                font-size: 9px;

            }

            .visual-box {

                height: 350px;

            }

            footer {

                justify-content: center;

                text-align: center;

            }

        }


        /* ===============================
           THANK YOU PAGE
        ================================ */

        body.thankyou-page {

            height: 100vh;
            height: 100dvh;

            overflow: hidden;

            display: flex;
            flex-direction: column;

        }

        body.thankyou-page .navbar {

            position: relative;

            padding: clamp(16px, 3vh, 28px) 6%;

        }

        body.thankyou-page footer {

            position: relative;

            padding: clamp(16px, 3vh, 35px) 6%;

        }

        .thankyou-section {

            flex: 1;
            min-height: 0;

            display: flex;

            align-items: center;

            justify-content: center;

            text-align: center;

            padding: 20px 6%;

            background:
                radial-gradient(
                    circle at top right,
                    #292018,
                    #090909 60%
                );

        }

        .thankyou-box {

            max-width: 620px;

        }

        .thankyou-icon {

            width: clamp(56px, 9vh, 90px);
            height: clamp(56px, 9vh, 90px);

            margin: 0 auto clamp(16px, 3.5vh, 40px);

            display: flex;
            align-items: center;
            justify-content: center;

            border-radius: 50%;

            background: linear-gradient(135deg, var(--gold), var(--copper));

            color: #111;

        }

        .thankyou-icon svg {

            width: 40%;
            height: 40%;

        }

        .thankyou-box small {

            display: block;

            color: var(--gold);

            font-size: 11px;

            letter-spacing: 4px;

            text-transform: uppercase;

            margin-bottom: clamp(10px, 2vh, 22px);

        }

        .thankyou-box h1 {

            font-family: 'Playfair Display', serif;

            font-size: clamp(30px, 6vh, 70px);

            font-weight: 400;

            line-height: 1.05;

            letter-spacing: -1px;

            margin-bottom: clamp(12px, 2.5vh, 25px);

        }

        .thankyou-box h1 span {

            color: var(--gold);

        }

        .thankyou-box p {

            font-size: clamp(14px, 2vh, 17px);

            font-weight: 300;

            color: var(--grey);

            line-height: 1.6;

            margin-bottom: clamp(18px, 4vh, 45px);

        }

        .thankyou-actions {

            display: flex;

            justify-content: center;

            flex-wrap: wrap;

            gap: 18px;

        }

        .thankyou-ref {

            margin-top: clamp(18px, 4vh, 50px);

            font-size: 11px;

            letter-spacing: 2px;

            text-transform: uppercase;

            color: #555;

        }

        @media(max-width: 600px) {

            body.thankyou-page .navbar {

                padding: clamp(14px, 3vh, 22px) 6%;

            }

        }


        /* ===============================
           FOOTER SNAP + LEAD (scroll fix)
        ================================ */

        /* footer tak scroll hamesha ho sake (mandatory snap me bhi) */
        footer {
            scroll-snap-align: end;
        }

        @media(max-width: 900px) {

            .lead-section {
                padding: 70px 0;
            }

        }


        /* ===============================
           FIX: SECTION III SPACING
        ================================ */

        /* section ab clip nahi hoga - content ke hisaab se badh sakta hai */
        .coming-section {

            height: auto;

            min-height: 100vh;
            min-height: 100dvh;

            overflow: hidden;

            scroll-snap-stop: normal;

            padding: clamp(70px, 9vh, 110px) 0;

        }

        .coming-section h2 {

            margin-bottom: clamp(26px, 5vh, 56px);

        }

        /* heading ke neeche gold divider (HTML ki zaroorat nahi) */
        .coming-section h2::after {

            content: "";

            display: block;

            width: 90px;

            height: 1px;

            margin: clamp(16px, 3vh, 28px) auto 0;

            background: linear-gradient(90deg, transparent, var(--gold), transparent);

        }

        @media (max-height: 720px) and (min-width: 901px) {

            .coming-section {
                padding: 60px 0 50px;
            }

            .coming-section h2 {
                font-size: clamp(30px, 4.4vw, 54px);
            }

            .location-label::before {
                display: none;
            }

            .feature-icon {
                width: 44px;
                height: 44px;
            }

            .feature-card {
                padding: 22px 18px 22px;
            }

            .feature-card p {
                font-size: 13px;
                line-height: 1.6;
            }

        }


        /* ===============================
           GLOSSY FORM
        ================================ */

        .lead-form {

            position: relative;

            overflow: hidden;

            border-radius: 14px;

            border: 1px solid rgba(213,178,123,.35);

            background:
                linear-gradient(
                    145deg,
                    rgba(255,255,255,.16) 0%,
                    rgba(255,255,255,.05) 35%,
                    rgba(255,255,255,.02) 60%,
                    rgba(255,255,255,.08) 100%
                );

            -webkit-backdrop-filter: blur(18px) saturate(140%);
            backdrop-filter: blur(18px) saturate(140%);

            box-shadow:
                0 30px 70px rgba(0,0,0,.55),
                inset 0 1px 0 rgba(255,255,255,.35),
                inset 0 -1px 0 rgba(0,0,0,.4),
                inset 0 0 40px rgba(183,138,82,.06);

        }

        /* upar wali glossy sheen */
        .lead-form::before {

            content: "";

            position: absolute;

            top: 0;
            left: 0;
            right: 0;

            height: 45%;

            background:
                linear-gradient(
                    180deg,
                    rgba(255,255,255,.12),
                    rgba(255,255,255,0)
                );

            border-radius: 14px 14px 60% 60% / 14px 14px 30px 30px;

            pointer-events: none;

        }

        /* tirchi light streak */
        .lead-form::after {

            content: "";

            position: absolute;

            top: -60%;
            left: -40%;

            width: 60%;
            height: 220%;

            background:
                linear-gradient(
                    100deg,
                    transparent 30%,
                    rgba(255,255,255,.07) 50%,
                    transparent 70%
                );

            transform: rotate(8deg);

            pointer-events: none;

        }

        .lead-form form {

            position: relative;

            z-index: 1;

        }

        .form-group input,
        .form-group textarea,
        .form-group select {

            background: rgba(255,255,255,.06);

            border: 1px solid rgba(255,255,255,.14);

            border-radius: 8px;

            padding: 14px 16px;

            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.10),
                inset 0 2px 8px rgba(0,0,0,.25);

            transition: border-color .3s ease, box-shadow .3s ease, background .3s ease;

        }

        .form-group textarea {

            height: clamp(80px, 12vh, 110px);

        }

        .form-group input:focus,
        .form-group textarea:focus {

            background: rgba(255,255,255,.09);

            border-color: var(--gold);

            box-shadow:
                0 0 0 3px rgba(183,138,82,.18),
                inset 0 1px 0 rgba(255,255,255,.15);

        }

        .form-group input::placeholder,
        .form-group textarea::placeholder {

            color: #9a9a9a;

        }

        .submit-btn {

            position: relative;

            overflow: hidden;

            border-radius: 8px;

            padding: clamp(14px, 2vh, 18px);

            background:
                linear-gradient(
                    180deg,
                    #e2c48f 0%,
                    var(--gold) 50%,
                    var(--copper) 100%
                );

            box-shadow:
                0 10px 25px rgba(183,138,82,.35),
                inset 0 1px 0 rgba(255,255,255,.55),
                inset 0 -2px 0 rgba(0,0,0,.18);

            transition: transform .3s ease, box-shadow .3s ease;

        }

        /* button par glossy shine sweep */
        .submit-btn::after {

            content: "";

            position: absolute;

            top: 0;
            left: -80%;

            width: 60%;
            height: 100%;

            background:
                linear-gradient(
                    100deg,
                    transparent,
                    rgba(255,255,255,.55),
                    transparent
                );

            transform: skewX(-20deg);

            transition: left .7s ease;

        }

        .submit-btn:hover {

            background:
                linear-gradient(
                    180deg,
                    #f0d9ac 0%,
                    #d5b27b 50%,
                    var(--gold) 100%
                );

            transform: translateY(-2px);

            box-shadow:
                0 16px 32px rgba(183,138,82,.45),
                inset 0 1px 0 rgba(255,255,255,.65),
                inset 0 -2px 0 rgba(0,0,0,.18);

        }

        .submit-btn:hover::after {

            left: 130%;

        }


        /* ===============================
           MOBILE / TABLET RESPONSIVE FIX
           (nested scroll removed, snap disabled)
        ================================ */

        @media (max-width: 900px) {

            /* ek hi page scroll - snap aur inner scroll dono band */
            html {
                scroll-snap-type: none;
            }

            body {
                overflow-x: hidden;
            }

            .hero,
            .benchmark-section,
            .coming-section,
            .lead-section {

                height: auto;
                min-height: 0;

                overflow: hidden;      /* auto hataya = andar ka extra scroll khatam */

                scroll-snap-align: none;
                scroll-snap-stop: normal;

            }

            footer {
                scroll-snap-align: none;
            }

            .hero {
                display: block;
            }

            .hero-video-wrap {
                height: 56vw;
                min-height: 260px;
                max-height: 480px;
            }

            .navbar {
                padding: 16px 5%;
            }

            .logo img {
                height: 48px;
            }

            .benchmark-section,
            .lead-section {
                padding: 60px 0;
            }

            .coming-section {
                padding: 64px 0;
            }

            .benchmark-grid,
            .lead-grid {
                gap: 34px;
            }

            .benchmark-content {
                text-align: center;
            }

            .benchmark-content h2 {
                font-size: clamp(26px, 6.5vw, 40px);
            }

            .visual-box {
                height: auto;
                aspect-ratio: 4 / 3;
                max-height: 420px;
            }

            .lead-content {
                text-align: center;
            }

            .lead-content h2 {
                font-size: clamp(28px, 7vw, 44px);
            }

            /* sticky button: side se hata kar neeche bar bana diya */
            .sticky-cta {

                top: auto;
                right: 0;
                left: 0;
                bottom: 0;

                transform: none;

                width: 100%;

                text-align: center;

                border-radius: 0;

                padding: 15px 20px;

                font-size: 11px;

            }

            /* bar ke neeche footer chhupe nahi */
            footer {
                padding-bottom: 80px;
            }

        }


        @media (max-width: 600px) {

            .hero-video-wrap {
                height: 56vw;
                min-height: 220px;
            }

            .location-label {
                font-size: 10.5px;
                letter-spacing: 2px;
            }

            .location-label::before {
                display: none;
            }

            .coming-section h2 {
                font-size: clamp(30px, 9vw, 42px);
            }

            .feature-grid {
                gap: 16px;
            }

            .feature-card {
                padding: 26px 20px 24px;
            }

            .feature-icon {
                width: 54px;
                height: 54px;
            }

            .lead-form {
                padding: 24px 18px;
                border-radius: 12px;
            }

            /* iOS par input zoom na ho */
            .form-group input,
            .form-group textarea {
                font-size: 16px;
            }

            .form-group textarea {
                height: 90px;
            }

            .btn {
                width: auto;
            }

        }



        /* ===============================
           FINAL: NORMAL SINGLE PAGE SCROLL (mobile/tablet/touch)
           Koi bhi section apna alag scroll nahi banayega
        ================================ */

        @media (max-width: 1024px), (pointer: coarse) {

            html {
                scroll-snap-type: none;
                height: auto;
            }

            body {
                height: auto;
                min-height: 0;
                overflow-x: hidden;
                overflow-x: clip;
            }

            .benchmark-section,
            .coming-section,
            .lead-section {

                height: auto;
                min-height: 0;

                /* clip = scroll container hi nahi banta, touch scroll trap nahi hota */
                overflow: visible;
                overflow: clip;

                scroll-snap-align: none;
                scroll-snap-stop: normal;

            }

            .hero {
                scroll-snap-align: none;
                scroll-snap-stop: normal;
            }

            footer {
                scroll-snap-align: none;
            }

        }

        @media (min-width: 901px) and (max-width: 1024px) {

            .benchmark-section,
            .coming-section,
            .lead-section {
                padding: 70px 0;
            }

        }


        /* ===============================
           FOOTER - PRIVACY POLICY
        ================================ */

        footer {

            flex-direction: column;

            justify-content: center;

            text-align: center;

            gap: 14px;

        }

       .footer-links a {
            color: var(--light-gold);
            font-size: 12px;
            letter-spacing: 2px;
            text-transform: uppercase;
            text-decoration: none;
            border-bottom: 1px solid transparent;
            padding-bottom: 2px;
            transition: color .3s ease, border-color .3s ease;
        }

        .footer-links a:hover {
            color: var(--white);
            border-bottom-color: var(--gold);
        }


        .footer-copy {

            width: 100%;

            max-width: 880px;

            padding-top: 14px;

            border-top: 1px solid rgba(255,255,255,.08);

        }

        @media (max-width: 600px) {

            .footer-privacy {
                font-size: 11px;
                line-height: 1.7;
            }

        }


        /* ===============================
           FORM CHECKBOX - WhatsApp / SMS
        ================================ */

        .form-check {

            margin: 4px 0 clamp(14px, 2.4vh, 22px);

        }

        .check-label {

            display: flex;

            align-items: center;

            gap: 12px;

            cursor: pointer;

            font-size: 13px;

            letter-spacing: .3px;

            color: rgba(245,242,237,.82);

            user-select: none;

        }

        .check-label input {

            position: absolute;

            opacity: 0;

            width: 0;

            height: 0;

        }

        .check-box {

            flex: 0 0 20px;

            width: 20px;

            height: 20px;

            display: flex;

            align-items: center;

            justify-content: center;

            border: 1px solid rgba(213,178,123,.65);

            border-radius: 5px;

            background: rgba(255,255,255,.06);

            box-shadow: inset 0 1px 0 rgba(255,255,255,.15);

            transition: all .3s ease;

        }

        .check-box::after {

            content: "";

            width: 5px;

            height: 10px;

            margin-top: -2px;

            border: solid #111;

            border-width: 0 2px 2px 0;

            transform: rotate(45deg) scale(0);

            transition: transform .25s ease;

        }

        .check-label input:checked + .check-box {

            background: linear-gradient(180deg, #e2c48f, var(--gold), var(--copper));

            border-color: transparent;

            box-shadow: 0 0 0 3px rgba(183,138,82,.18);

        }

        .check-label input:checked + .check-box::after {

            transform: rotate(45deg) scale(1);

        }

        .check-label input:focus-visible + .check-box {

            box-shadow: 0 0 0 3px rgba(183,138,82,.4);

        }

        .check-label:hover .check-box {

            border-color: var(--light-gold);

        }


        /* ===============================
           BENCHMARK - TABLET / MOBILE
        ================================ */

        @media (max-width: 900px) {

            .benchmark-eyebrow,
            .benchmark-tagline {
                justify-content: center;
            }

            .benchmark-eyebrow::before,
            .benchmark-tagline::before {
                display: none;
            }

            .benchmark-content h2 .line {
                white-space: normal;
            }

            .benchmark-content .btn {
                padding: 18px 30px;
            }

            .visual-box {
                transform: none;
                width: calc(100% - 16px);
            }

            .visual-box::before {
                transform: translate(12px, -12px);
            }

        }

        @media (max-width: 600px) {

            .benchmark-eyebrow,
            .benchmark-tagline {
                font-size: 10.5px;
                letter-spacing: 3px;
            }

            .benchmark-content h2 {
                font-size: clamp(28px, 8.2vw, 38px);
            }

        }

        /* ===============================
   BENCHMARK CAROUSEL
================================ */

.carousel-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    z-index: 0;
    transition: opacity .9s cubic-bezier(.4, 0, .2, 1);
    will-change: opacity;
    backface-visibility: hidden;
}

/* purani slide neeche full visible rahti hai jab tak nayi fade-in na ho jaye */
.carousel-slide.is-leaving {
    opacity: 1;
    z-index: 1;
    transition: none;
}

.carousel-slide.is-active {
    opacity: 1;
    z-index: 2;
}

.carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;

    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(226,196,143,.6);
    border-radius: 50%;

    background: rgba(0,0,0,.4);
    color: var(--light-gold);

    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);

    cursor: pointer;
    opacity: 0;
    transition: all .35s ease;
}

.carousel-btn.prev { left: 16px; }
.carousel-btn.next { right: 16px; }

.visual-box:hover .carousel-btn,
.carousel-btn:focus-visible { opacity: 1; }

.carousel-btn:hover {
    background: var(--gold);
    color: #111;
    border-color: transparent;
}

.carousel-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 18px;
    z-index: 3;

    display: flex;
    justify-content: center;
    gap: 10px;
}

.carousel-dot {
    width: 28px;
    height: 3px;
    padding: 0;
    border: none;
    background: rgba(255,255,255,.35);
    cursor: pointer;
    transition: background .35s ease, width .35s ease;
}

.carousel-dot.is-active {
    background: var(--light-gold);
    width: 44px;
}

/* touch devices: arrows hamesha dikhen */
@media (hover: none), (max-width: 900px) {
    .carousel-btn { opacity: 1; width: 38px; height: 38px; }
    .carousel-btn.prev { left: 10px; }
    .carousel-btn.next { right: 10px; }
    .carousel-dots { bottom: 12px; }
}

        /* ===============================
           SCROLL REVEAL (desktop only)
           translate/scale individual properties use kiye hain,
           taake hover ke transform se clash na ho
        ================================ */

        @media (min-width: 1025px) and (hover: hover) and (pointer: fine) {

            html.js-reveal [data-reveal] {

                opacity: 0;

                will-change: opacity, translate, scale;

                transition:
                    opacity   1s   cubic-bezier(.22,.61,.36,1) var(--rd, 0s),
                    translate 1.2s cubic-bezier(.22,.61,.36,1) var(--rd, 0s),
                    scale     1.2s cubic-bezier(.22,.61,.36,1) var(--rd, 0s);

            }

            html.js-reveal [data-reveal="up"]    { translate: 0 55px; }
            html.js-reveal [data-reveal="up-sm"] { translate: 0 26px; }
            html.js-reveal [data-reveal="down"]  { translate: 0 -45px; }
            html.js-reveal [data-reveal="left"]  { translate: 90px 0;  scale: .96; }
            html.js-reveal [data-reveal="right"] { translate: -70px 0; }
            html.js-reveal [data-reveal="zoom"]  { translate: 0 45px;  scale: .94; }

            html.js-reveal [data-reveal].is-in {

                opacity: 1;

                translate: 0 0;

                scale: 1;

            }

        }

/* ===============================
   FOOTER: RERA (redesign)
================================ */

footer {
    gap: 28px;
    padding-top: 45px;
}

.rera-box {
    position: relative;
    width: 100%;
    max-width: 960px;

    padding: 34px 30px 26px;

    border: 1px solid rgba(213,178,123,.25);
    border-radius: 10px;

    background: linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.01));
}

/* border ke upar beech me title */
.rera-title {
    position: absolute;
    top: -9px;
    left: 50%;
    transform: translateX(-50%);

    padding: 0 16px;

    background: #050505;           /* footer ka background, taake border cut dikhe */
    color: var(--light-gold);

    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 4px;
    text-transform: uppercase;
    white-space: nowrap;
}

.rera-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.rera-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;

    padding: 4px 18px;
    text-align: center;
}

/* items ke beech patli vertical line */
.rera-item + .rera-item {
    border-left: 1px solid rgba(255,255,255,.1);
}

.rera-label {
    font-size: 10px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #7d7d7d;
}

.rera-value {
    font-size: 13.5px;
    font-weight: 400;
    letter-spacing: .5px;
    color: var(--white);
}

.rera-value a {
    color: var(--light-gold);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    padding-bottom: 1px;
    transition: color .3s ease, border-color .3s ease;
}

.rera-value a:hover {
    color: var(--white);
    border-bottom-color: var(--gold);
}

/* bottom row: copyright left, privacy right */
.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    width: 100%;
    max-width: 960px;

    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.footer-bottom .footer-copy {
    width: auto;
    max-width: none;
    padding-top: 0;
    border-top: none;
}

/* Mobile */
@media (max-width: 767px) {

    footer {
        gap: 24px;
    }

    .rera-box {
        padding: 30px 20px 14px;
    }

    .rera-grid {
        grid-template-columns: 1fr;
    }

    .rera-item {
        padding: 14px 0;
    }

    /* mobile par vertical line ki jagah horizontal line */
    .rera-item + .rera-item {
        border-left: none;
        border-top: 1px solid rgba(255,255,255,.08);
    }

    .footer-bottom {
        flex-direction: column-reverse;   /* Privacy Policy upar, copyright neeche */
        gap: 12px;
        text-align: center;
    }
}

/* ===============================
   MOBILE HERO: black header + video till bottom
================================ */

@media (max-width: 767px) {

    :root {
        --hdr: 72px;   
    }

    /* logo ke liye alag black header */
    .navbar {
        position: relative !important;
        height: var(--hdr);
        padding: 0 5% !important;
        background: #000;
    }

    .logo img {
        height: 48px;
        margin-top: 5px;
    }

    /* header ke baad poori bachi hui screen video ki */
    section.hero {
        display: block !important;
        height: calc(100vh - var(--hdr)) !important;
        height: calc(100svh - var(--hdr)) !important;
        min-height: 0 !important;
    }

    .hero .hero-video-wrap {
        height: 104% !important;
        max-height: none !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
        background: #000;
    }

    .hero #heroVideo {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 80% !important;
        object-fit: cover !important;
        object-position: center center !important;
        -webkit-mask-image: none !important;
        mask-image: none !important;
    }

    /* sound button Register pill ke upar */
    .hero #soundToggle {
        right: 15px !important;
        left: auto !important;
        bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    }
}
/* ===============================
   MOBILE STICKY CTA: floating pill
   (iPhone Safari toolbar se alag dikhega)
================================ */

@media (max-width: 900px) {

    .sticky-cta {
        left: 16px;
        right: 16px;
        bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        top: auto;

        width: auto;
        transform: none;

        border-radius: 50px;
        padding: 16px 20px;

        text-align: center;

        background: linear-gradient(180deg, #e2c48f 0%, var(--gold) 55%, var(--copper) 100%);
        color: #111;

        box-shadow:
            0 10px 28px rgba(0,0,0,.6),
            0 0 0 1px rgba(255,255,255,.12),
            inset 0 1px 0 rgba(255,255,255,.5);
    }

    /* floating button footer ko na dhake */
    footer {
        padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px));
    }
}