@font-face {
        font-family: Baftvest;
        src: url("https://cms.blueoceanfin.com/assets/media/1711013628139-601-Baftvest DEMO VERSION.ttf");
    }

    @font-face {
        font-family: Metamorphous;
        src: url("https://cms.blueoceanfin.com/assets/media/1711014188664-395-Metamorphous-Regular.ttf");
    }
    /* @font-face {
    font-family: 'The Artisan';
    src: url('https://cms.blueoceanfin.com/assets/media/the artisan.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    }
    @font-face {
  font-family: 'Nelagone';
  src: url('https://cms.blueoceanfin.com/assets/media/NelagoneMarker.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Quivert';
  src: url('https://cms.blueoceanfin.com/assets/media/Quivert.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
} */
@font-face {
  font-family: 'Barthez';
  src: url('https://cms.blueoceanfin.com/assets/media/Barthez.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

    @import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Rajdhani:wght@300;400;500;600;700&display=swap');

    body {
        background-image: linear-gradient(#EEFAFF, #F1FBFF) !important;
    }

    h1,
    h2,
    h3,
    h4,
    p {
        margin: 0;
    }

    p {
        font-size: 0.85rem;
    }

    #section-2 {
        background-image: linear-gradient(90deg, #E6F0FF -11.26%, #FFFDF4 111.12%)
    }
    button a {
        color: white !important;
    }
    .section-2-title-container {
        width: 1353px;
        height: fit-content;
    }
    .section-2-title {
        position: absolute;
        width: 497.24px;
        height: fit-content;
        margin-left: 20px;
        text-shadow: 0px 0px 10px #EEF4FC, 0px 0px 10px #EEF4FC, 0px 0px 10px #EEF4FC;
    }
    .section-2-title h1 {
        font-family: 'Figtree';
        font-style: normal;
        font-weight: 700;
        font-size: 52px;
        line-height: 120%;
        display: flex;
        align-items: center;
        color: #061A4D;
    }

    .section-2-title p {
        font-family: 'Figtree';
        font-style: normal;
        font-weight: 400;
        font-size: 15px;
        line-height: 150%;
        display: flex;
        align-items: center;
        color: #061A4D;
    }

    .all-instrument {
        position: absolute;
    }

    /* ── GSAP position fix: set statically so GSAP only animates translateY ── */
    .ins-1, .ins-2, .ins-3,
    .ins-4, .ins-5, .ins-6, .ins-7 {
        position: absolute;
        will-change: transform;
    }

    .instruments {
        z-index: 1;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 26.25px;
        gap: 9.08px;
        width: 315px;
        height: 250px;
        background: #FFFFFF;
        box-shadow: 7.26194px 7.26194px 40.8484px rgba(0, 0, 0, 0.15);
        border-radius: 27.2323px;
    }
    .instruments-card img {
        width: 50px;
        height: 50px;
    }
    .instruments-card h2 {
        font-family: 'Figtree';
        font-style: normal;
        font-weight: 700;
        font-size: 1rem;
        line-height: 1.4;
        align-items: center;
        color: #061A4D;
    }

    .instruments-card p {
        font-family: 'Figtree';
        font-style: normal;
        font-weight: 400;
        font-size: 0.85rem;
        line-height: 1.4;
        align-items: center;
        color: #061A4D;
    }

    .lines {
        position: absolute;
        width: 100%;
        height: 100%;
        min-height: 900px;
        display: flex;
        justify-content: space-between;
        mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 5%, #000000 15%, #000000 85%, rgba(255, 255, 255, 0) 95%);
        -webkit-mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 5%, #000000 15%, #000000 85%, rgba(255, 255, 255, 0) 95%);
    }
    .vl {
        width: 20px;
        height: 100%;
        border-width: 0px 1px;
        border-style: solid;
        border-color: #D6D6D6;
    }
    @media (min-width: 992px) {
        .mxh {
            height: 1300px;
        }

        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 45vh);
        }

        #section-2 .ins-2 {
            margin-left: 249px;
            margin-top: calc(100vh - 35vh);
        }

        #section-2 .ins-3 {
            margin-left: 478px;
            margin-top: calc(100vh - 23vh);
        }

        #section-2 .ins-4 {
            margin-left: 706px;
            margin-top: calc(100vh - 11vh);
        }

        #section-2 .ins-5 {
            margin-left: 249px;
            margin-top: calc(100vh - 8vh);
        }

        #section-2 .ins-6 {
            margin-left: 478px;
            margin-top: calc(100vh - 2vh);
        }

        #section-2 .ins-7 {
            margin-left: 706px;
            margin-top: calc(100vh - 1vh);
        }
    }
    .bg_multimedia {
        background: #FFFFFF;
        box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
        border-radius: 27.6719px;
        overflow: hidden;
    }

    .gallery {
        position: absolute;
        top: -30%;
        left: 15%;
        width: 100%;
        height: 100%;
        transform: rotate(340deg);
    }

    .block-33 {
        width: 45%;
    }

    .display--inline-top {
        display: inline-block;
        vertical-align: top;
    }

    .fill-dimensions {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }

    .relative {
        position: relative;
    }

    .cover-img {
        background-size: cover;
        background-repeat: no-repeat;
    }

    .gallery-image {
        padding-bottom: 2.35em;
        animation: marqueeTop 12s linear infinite;
    }

    .gallery-h--tb .gallery-image {
        animation: marqueeBottom 12s linear infinite;
    }

    .gallery-image__img {
        padding-top: 50vh;
    }

    .gallery-h {
        overflow: hidden;
    }

    @keyframes marqueeTop {
        0% {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }

        100% {
            -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
        }
    }

    @keyframes marqueeBottom {
        0% {
            -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
        }

        100% {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }
    }

    .container-01 {
        grid-area: one;
    }

    .container-02 {
        grid-area: two;
    }

    .container-03 {
        grid-area: three;
    }

    .container-04 {
        grid-area: four;
    }

    .container-05 {
        grid-area: five;
    }

    .container-06 {
        grid-area: six;
    }

    .container-07 {
        grid-area: seven;
    }

    .pdt70 {
        padding-top: 70px;
    }

    .pdb70 {
        padding-bottom: 70px;
    }

    .img_fit {
        max-height: 680px;
        height: 100%;
    }
    @media screen and (min-width:768px) {
        .mb-display {
            display: none;
        }

        .lp-display {
            display: block;
        }

    }

    @media screen and (min-width:992px) {
        .instruments {
            width: 210px !important;
        }

        .laptop_view_only {
            display: block;
        }

        .mb_view_only {
            display: none;
        }

        .best_container {
            display: grid;
            grid-template-areas: 'one two' 'three four';
            gap: 15px;
            grid-template-columns: unset;
            justify-items: center;
        }

        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 250px;
            width: 250px;
            display: flex;
            padding: 15px;
        }

        .small_container_content {
            height: 230px;
            margin: auto;
        }

        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }
    }

    @media screen and (min-width:1200px) {
        .mxh {
            height: 1000px;
        }

        .instruments {
            width: 254px !important;
        }

        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 45vh);
        }

        #section-2 .ins-2 {
            margin-left: 294px;
            margin-top: calc(100vh - 35vh);
        }

        #section-2 .ins-3 {
            margin-left: 568px;
            margin-top: calc(100vh - 23vh);
        }

        #section-2 .ins-4 {
            margin-left: 842px;
            margin-top: calc(100vh - 11vh);
        }

        #section-2 .ins-5 {
            margin-left: 294px;
            margin-top: calc(100vh - 8vh);
        }

        #section-2 .ins-6 {
            margin-left: 568px;
            margin-top: calc(100vh - 2vh);
        }

        #section-2 .ins-7 {
            margin-left: 842px;
            margin-top: calc(100vh - 1vh);
        }

        .deposit_small_container {
            grid-area: one;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 315px;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_small_container2 {
            grid-area: two;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 315px;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_big_container {
            grid-area: three;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 580px;
            padding: 25px;
            word-break: break-word;
        }

        .laptop_view {
            display: block;
        }

        .mobile_view {
            display: none;
        }

        .best_container {
            display: grid;
            grid-template-areas: 'one two three four';
            gap: 15px;
            grid-template-columns: 24% 24% 24% 24%;
            justify-items: center;
        }

        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 250px;
            width: 250px;
            display: flex;
            padding: 15px;
        }

        .small_container_content {
            height: 230px;
            margin: auto;
        }

        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }
    }

    @media screen and (min-width:1400px) {

        .instruments {
            width: 298px !important;
        }

        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 45vh);
        }

        #section-2 .ins-2 {
            margin-left: 340px;
            margin-top: calc(100vh - 35vh);
        }

        #section-2 .ins-3 {
            margin-left: 659px;
            margin-top: calc(100vh - 23vh);
        }

        #section-2 .ins-4 {
            margin-left: 978px;
            margin-top: calc(100vh - 11vh);
        }

        #section-2 .ins-5 {
            margin-left: 340px;
            margin-top: calc(100vh - 8vh);
        }

        #section-2 .ins-6 {
            margin-left: 659px;
            margin-top: calc(100vh - 2vh);
        }

        #section-2 .ins-7 {
            margin-left: 978px;
            margin-top: calc(100vh - 1vh);
        }
        .best_container {
            display: grid;
            grid-template-areas: 'one two three four';
            gap: 15px;
            grid-template-columns: 24% 24% 24% 24%;
            justify-items: center;
        }
        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 300px;
            width: 300px;
            display: flex;
            padding: 15px;
        }
        .small_container_content {
            height: 230px;
            margin: auto;
        }
        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }
    }
    @media (min-width:992px) and (min-height: 1200px) {
        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 66vh);
        }

        #section-2 .ins-2 {
            margin-left: 249px;
            margin-top: calc(100vh - 61vh);
        }

        #section-2 .ins-3 {
            margin-left: 478px;
            margin-top: calc(100vh - 52vh);
        }

        #section-2 .ins-4 {
            margin-left: 706px;
            margin-top: calc(100vh - 45vh);
        }

        #section-2 .ins-5 {
            margin-left: 249px;
            margin-top: calc(100vh - 46vh);
        }

        #section-2 .ins-6 {
            margin-left: 478px;
            margin-top: calc(100vh - 41vh);
        }

        #section-2 .ins-7 {
            margin-left: 706px;
            margin-top: calc(100vh - 40vh);
        }
    }

    @media (min-width:1400px) and (min-height: 1000px) and (max-height: 1200px) {
        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 60vh);
        }

        #section-2 .ins-2 {
            margin-left: 249px;
            margin-top: calc(100vh - 53vh);
        }

        #section-2 .ins-3 {
            margin-left: 478px;
            margin-top: calc(100vh - 44vh);
        }

        #section-2 .ins-4 {
            margin-left: 706px;
            margin-top: calc(100vh - 34vh);
        }

        #section-2 .ins-5 {
            margin-left: 249px;
            margin-top: calc(100vh - 35vh);
        }

        #section-2 .ins-6 {
            margin-left: 478px;
            margin-top: calc(100vh - 35vh);
        }

        #section-2 .ins-7 {
            margin-left: 706px;
            margin-top: calc(100vh - 28vh);
        }
    }

    @media (min-width:1600px) and (max-height: 1350px) {
        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 60vh);
        }

        #section-2 .ins-2 {
            margin-left: 341px;
            margin-top: calc(100vh - 53vh);
        }

        #section-2 .ins-3 {
            margin-left: 660px;
            margin-top: calc(100vh - 44vh);
        }

        #section-2 .ins-4 {
            margin-left: 978px;
            margin-top: calc(100vh - 34vh);
        }

        #section-2 .ins-5 {
            margin-left: 341px;
            margin-top: calc(100vh - 36vh);
        }

        #section-2 .ins-6 {
            margin-left: 660px;
            margin-top: calc(100vh - 31vh);
        }

        #section-2 .ins-7 {
            margin-left: 978px;
            margin-top: calc(100vh - 28vh);
        }
    }

    @media (min-width:1600px) and (min-height: 1351px) {
        #section-2 .ins-1 {
            margin-left: 20px;
            margin-top: calc(100vh - 66vh);
        }

        #section-2 .ins-2 {
            margin-left: 341px;
            margin-top: calc(100vh - 61vh);
        }

        #section-2 .ins-3 {
            margin-left: 660px;
            margin-top: calc(100vh - 54vh);
        }

        #section-2 .ins-4 {
            margin-left: 978px;
            margin-top: calc(100vh - 47vh);
        }

        #section-2 .ins-5 {
            margin-left: 341px;
            margin-top: calc(100vh - 45vh);
        }

        #section-2 .ins-6 {
            margin-left: 660px;
            margin-top: calc(100vh - 41vh);
        }

        #section-2 .ins-7 {
            margin-left: 978px;
            margin-top: calc(100vh - 40vh);
        }
    }

    @media screen and (max-width:1199px) {
        .laptop_view {
            display: none;
        }

        .mobile_view {
            display: block;
        }

        .sticky_column {
            justify-self: end;
        }

        .sticky_column2 {
            justify-self: start;
        }

        .grid_container_temp {
            display: grid;
            grid-template-areas: 'one three' 'two three';
            gap: 15px;
            align-items: center;
        }

        .deposit_small_container {
            grid-area: one;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 260px;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_small_container2 {
            grid-area: two;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 260px;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_big_container {
            grid-area: three;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 580px;
            width: 300px;
            padding: 25px;
            word-break: break-word;
        }
    }

    @media screen and (max-width:991px) {
        .laptop_view_only {
            display: none;
        }

        .mb_view_only {
            display: block;
        }

        .instruments_container {
            display: grid;
            grid-template-areas: 'one two' 'three four' 'five six' 'seven seven';
            gap: 15px;
            grid-template-columns: 48% 48%;
            justify-items: center;
        }

        .instrument_container_content {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 300px;
            width: 100%;
            display: flex;
            padding: 25px;
        }

        .img_fit {
            max-height: 400px !important;
            height: 100%;
        }

        .pdb70 {
            padding-bottom: unset !important;
        }

        .pdt70 {
            padding-top: unset !important;
        }

        .best_container {
            display: grid;
            grid-template-areas: 'one two' 'three four';
            gap: 15px;
            grid-template-columns: 48% 48%;
            justify-items: center;
        }

        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 250px;
            width: 250px;
            display: flex;
            padding: 15px;
        }

        .small_container_content {
            height: 230px;
            margin: auto;
        }

        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }
    }

    @media screen and (max-width:767px) {
        .mb-display {
            display: block;
        }

        .lp-display {
            display: none;
        }

        .best_container {
            display: grid;
            grid-template-areas: 'one two' 'three four';
            gap: 15px;
            grid-template-columns: 48% 48%;
            justify-items: center;
        }

        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 250px;
            width: 250px;
            display: flex;
            padding: 15px;
        }

        .small_container_content {
            height: 230px;
            margin: auto;
        }

        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }

        .sticky_column {
            justify-self: center;
        }

        .sticky_column2 {
            justify-self: center;
        }

        .grid_container_temp {
            display: grid;
            grid-template-areas: 'one two' 'three three';
            gap: 15px;
            align-items: center;
        }

        .deposit_small_container {
            grid-area: one;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 260px;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_small_container2 {
            grid-area: two;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 260px;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_big_container {
            grid-area: three;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 580px;
            width: 100%;
            padding: 65px;
            word-break: break-word;
        }
    }

    @media screen and (max-width:576px) {
        .instruments_container {
            display: grid;
            grid-template-areas: 'one' 'two' 'three' 'four' 'five' 'six' 'seven';
            gap: 15px;
            grid-template-columns: 100%;
            justify-items: center;
        }

        .instrument_container_content {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 300px;
            width: 100%;
            display: flex;
            padding: 25px;
        }

        .grid_container_temp {
            display: grid;
            grid-template-areas: 'one' 'two' 'three';
            gap: 15px;
            align-items: center;
        }

        .best_container {
            display: grid;
            grid-template-areas: 'one' 'two' 'three' 'four';
            gap: 15px;
            grid-template-columns: 100%;
            justify-items: center;
        }

        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 250px;
            width: 100%;
            display: flex;
            padding: 25px;
        }

        .sticky_column {
            justify-self: center;
        }

        .sticky_column2 {
            justify-self: center;
        }

        .small_container_content {
            height: 230px;
            margin: auto;
        }

        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }

        .deposit_small_container {
            grid-area: one;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 100%;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_small_container2 {
            grid-area: two;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 100%;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_big_container {
            grid-area: three;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 580px;
            width: 100%;
            padding: 65px;
            word-break: break-word;
        }
    }

    @media screen and (max-width:470px) {
        .best_container {
            display: grid;
            grid-template-areas: 'one' 'two' 'three' 'four';
            gap: 15px;
            grid-template-columns: 100%;
            justify-items: center;
        }

        .small_container_background {
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 250px;
            width: 100%;
            display: flex;
            padding: 25px;
        }

        .small_container_content {
            height: 230px;
            margin: auto;
        }

        .step_content {
            color: rgba(94, 230, 235, 0.2);
            margin: 0;
            font-size: 4rem;
            text-align: center;
        }

        .deposit_small_container {
            grid-area: one;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 100%;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_small_container2 {
            grid-area: two;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 260px;
            width: 100%;
            padding: 25px;
            word-break: break-word;
        }

        .deposit_big_container {
            grid-area: three;
            background: #FFFFFF;
            box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
            border-radius: 27.6719px;
            height: 580px;
            width: 100%;
            padding: 25px;
            word-break: break-word;
        }
    }

    .section-1 {
        background-color: unset !important;
    }

    .bg_section_1 {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684722829152-768-bg-1.webp');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg_section_2 {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684681940904-437-bg-2.webp');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg_section_3 {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684681940694-888-bg-3.webp');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg_deposit {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684681938903-787-vector-1.webp');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .pd0 {
        padding: 0;
    }

    .title_border_height {
        border-left: 3px solid #5ee6eb;
        height: 40px;
        float: left;
        margin-right: 8px;
    }

    .title_border_height2 {
        border-left: 3px solid #5ee6eb;
        height: 68px;
        float: left;
        margin-right: 8px;
    }

    .instrument_content {
        font-size: 1.5rem;
    }

    .swiper-button-next:after,
    .swiper-button-prev:after {
        color: #000000 !important;
        opacity: 0.2 !important;
    }

    /* .wave-button,
    .wave-header-button {
        padding: 1px 20px;
        width: auto;
        text-align: center;
        background-color: transparent;
        border: 1px solid #3d3d3d20;
        border-radius: 15px;
        position: relative;
        overflow: hidden;
        cursor: pointer;
    } */
    .wave-button,
.wave-header-button {
    padding: 10px 22px;
    width: auto;
    text-align: center;

    background: linear-gradient(90deg, #5B7CFF, #6E8BFF);
    color: #fff;

    border: none;
    border-radius: 999px;

    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.wave-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 6px 16px;        /* 🔑 tighter = matches reference */
    border-radius: 999px;

    background: linear-gradient(90deg, #5B7CFF, #6E8BFF);
    color: #fff;

    font-size: 14px;
    font-weight: 500;
    line-height: 1;           /* 🔑 critical */

    border: none;
    text-decoration: none;

    position: relative;
    overflow: hidden;
}
.wave-button span {
    display: inline-flex;
    align-items: center;
    margin: 10px 20px;
}

    .wave-button .wave {
        position: absolute;
        top: -100px;
        left: 0;
        width: 100%;
        height: 250px;
        background: #4d77ff;
        transition: .5s ease;
    }

    .wave-button:hover .wave::after,
    .wave-button:hover .wave::before {
        width: 0;
        height: 0;
        transition: 2s ease;
    }

    .wave-button .wave::after,
    .wave-button .wave::before {
        content: '';
        position: absolute;
        width: 200%;
        height: 200%;
        top: -10px;
        left: 50%;
        transform: translate(-50%, -75%);
        transition: .5s ease;
    }

    .wave-button .wave::before {
        border-radius: 40%;
        background-image: linear-gradient(#EEFAFF, #F1FBFF);
        animation: wave 7s linear infinite;
    }

    .wave-button .wave::after {
        border-radius: 45%;
        background-image: linear-gradient(#EEFAFF, #F1FBFF);
        animation: wave 12s linear infinite;
    }

    button.wave-header-button {
        font-size: 13px !important;
        line-height: 0 !important;
        height: 25.5px;
    }

    .wave-header-button .wave1 {
        position: absolute;
        top: -100px;
        left: 0;
        width: 100%;
        height: 250px;
        background: #4d77ff;
        transition: .5s ease;
    }

    .wave-header-button:hover .wave1::after,
    .wave-header-button:hover .wave1::before {
        width: 0;
        height: 0;
        transition: 2s ease;
    }

    .wave-header-button .wave1::after,
    .wave-header-button .wave1::before {
        content: '';
        position: absolute;
        width: 200%;
        height: 200%;
        top: -10px;
        left: 50%;
        transform: translate(-50%, -75%);
        transition: .5s ease;
    }

    .wave-header-button .wave1::before {
        border-radius: 40%;
        background-image: linear-gradient(#fafafa, #fcfcfc);
        animation: wave 7s linear infinite;
    }

    .wave-header-button .wave1::after {
        border-radius: 45%;
        background-image: linear-gradient(#fafafa, #fcfcfc);
        animation: wave 12s linear infinite;
    }

    @keyframes wave {
        0% {
            transform: translate(-50%, -75%) rotate(0deg);
        }
        100% {
            transform: translate(-50%, -75%) rotate(360deg);
        }
    }

    @media (max-width: 768px) {
        .section-6 {
            padding: 40px 0px;
        }
    }

/* =========================================================
   Vesak animation
========================================================= */

.vesak-banner *{
box-sizing:border-box;
margin:0;
padding:0;
}
.vesak-wrapper{
  isolation: isolate;
  z-index: 0;
}
:root{
  --gold:      #C8971A;
  --gold2:     #E8C060;
  --gold3:     #FFF0A0;
  --gold-dim:  #7A5E10;
  --ivory:     #FFF8EC;
  --sky-pale:  #DAEEFF;
  --blue-deep: #0D1F3C;
  --blue-mid:  #1A3A6B;
  --blue-sky:  #3B72C4;
  --shadow:    rgba(8,25,65,.85);
  --shadow-sm: rgba(8,25,65,.45);
}

.vesak-banner{background:var(--blue-deep);position: relative;margin-bottom: 100px;z-index: 0;transform: none !important;}

.scroll-wrap{position:relative;height:400vh;}
.sticky-stage{position:sticky;top:0;width:100%;height:100vh;overflow:visible;z-index: 0;padding-top: 1000px;}
.layer{position:absolute;inset:0;pointer-events:none;}

#bg-layer{
  background:
    url('https://cms.blueoceanfin.com/assets/media/vesak-blue-bg.webp') center center / cover no-repeat;
  transform-origin:center;
  will-change:transform;
  overflow:hidden;
  background-attachment:fixed;
}
#bg-layer::before{display:none;}
#bg-layer::after{display:none;}

#reveal-layer{background:var(--blue-deep);will-change:opacity;opacity:1;}
#spotlight-layer{mix-blend-mode:screen;will-change:opacity;}

#halo-layer{display:flex;align-items:center;justify-content:center;padding-left:28%;padding-bottom:8%;}
.halo-ring{width:min(44vw,480px);height:min(44vw,480px);border-radius:50%;border:1.5px solid rgba(200,151,26,0);opacity:0;transform:scale(.3);will-change:transform,opacity;}
.halo-outer{position:absolute;width:min(54vw,580px);height:min(54vw,580px);border-radius:50%;border:1px solid rgba(200,151,26,0);top:50%;left:50%;transform:translate(-50%,-54%) scale(.3);opacity:0;will-change:transform,opacity;}

#lotus-layer{display:flex;align-items:flex-end;justify-content:center;padding-left:26%;}
.lotus-glow{width:min(42vw,440px);height:min(22vw,240px);will-change:opacity;}
#rays-layer{display:flex;align-items:center;justify-content:center;padding-left:28%;padding-bottom:8%;}

#buddha-layer{display:flex;align-items:center;justify-content:center;padding-left:28%;padding-bottom:4%;z-index:4;}
.buddha-statue{font-size:0;width:min(44vw,900px);max-height:84vh;object-fit:contain;opacity:0;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse 43% 70% at 50% 52%,#000 45%,rgba(0,0,0,.85) 60%,transparent 78%);mask-image:radial-gradient(ellipse 43% 70% at 50% 52%,#000 45%,rgba(0,0,0,.85) 60%,transparent 78%);filter:drop-shadow(0 30px 44px rgba(0,0,0,.34));transform:translateY(12vh) scale(.78);transform-origin:50% 78%;will-change:transform,opacity,filter;}
.buddha-aura{position:absolute;left:64%;top:48%;width:min(36vw,430px);height:min(36vw,430px);border-radius:50%;background:radial-gradient(circle,rgba(255,232,154,.22) 0%,rgba(200,151,26,.12) 34%,transparent 70%);opacity:0;transform:translate(-50%,-50%) scale(.7);filter:blur(10px);will-change:transform,opacity;}
.buddha-shadow{position:absolute;left:64%;bottom:8%;width:min(34vw,420px);height:min(8vw,92px);border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.34),transparent 68%);opacity:0;transform:translateX(-50%) scaleX(.72);filter:blur(12px);will-change:transform,opacity;}

.rays-wrap{position:relative;width:min(62vw,660px);height:min(62vw,660px);}
.ray{position:absolute;top:50%;left:50%;height:1.5px;transform-origin:0 50%;background:linear-gradient(90deg,rgba(200,151,26,.6),rgba(255,220,80,.2),transparent);opacity:0;border-radius:2px;}

#lake-lotus-layer{z-index:5;overflow:hidden;}
.lake-lotus{position:absolute;left:var(--x);bottom:var(--bottom);width:var(--w);opacity:0;transform:translate(-50%,48px) scale(.72) rotate(var(--rot));transform-origin:50% 82%;will-change:transform,opacity;}
.lake-lotus img{display:block;width:100%;height:auto;animation:lotusFloat var(--floatDur) ease-in-out infinite;animation-delay:var(--delay);}

/* ── Static lotus filters — JS no longer writes filter every frame ── */
.lake-lotus.is-front { filter: drop-shadow(0 26px 16px rgba(8,37,86,.30)); }
.lake-lotus.is-mid   { filter: drop-shadow(0 18px 12px rgba(8,37,86,.22)); }
.lake-lotus.is-back  { filter: drop-shadow(0 10px 8px  rgba(8,37,86,.14)); }

@keyframes lotusFloat{0%,100%{transform:translateY(0) rotate(-.6deg);}50%{transform:translateY(-10px) rotate(.7deg);}}

#particles-layer{overflow:hidden;}
.particle{position:absolute;border-radius:50%;opacity:0;will-change:transform,opacity;}
#petals-layer{overflow:hidden;z-index:6;}
.petal{position:absolute;opacity:0;will-change:transform,opacity;}

/* ── GPU layer promotion — forces compositing on GPU, prevents CPU repaint ── */
.lake-lotus,
.buddha-statue,
.buddha-aura,
.buddha-shadow,
.corner-lotus,
.halo-ring,
.halo-outer {
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

#corner-lotus-layer{
  z-index:6;
  pointer-events:none;
  overflow:hidden;
}

.corner-lotus{
  position:absolute;
  opacity:0;
  will-change:opacity,filter;
  mix-blend-mode:luminosity;
  filter:brightness(.5) drop-shadow(0 0 0px rgba(200,151,26,0));
}
.corner-lotus img{
  display:block;width:100%;height:auto;
  animation:clSway 9s ease-in-out infinite;
  transform-origin:bottom center;
}
@keyframes clSway{
  0%,100%{transform:rotate(0deg)   translateY(0px);}
  40%    {transform:rotate(.5deg)  translateY(-3px);}
  70%    {transform:rotate(-.4deg) translateY(-1px);}
}

.corner-lotus.lotus-left{
  bottom:-2%;
  left:-1%;
  width:min(14vw,168px);
  transform-origin:bottom left;
}
.corner-lotus.lotus-left img{animation-delay:-3s;}

.corner-lotus.lotus-right{
  bottom:-2%;
  right:-1%;
  width:min(15vw,180px);
  transform-origin:bottom right;
}
.corner-lotus.lotus-right img{animation-delay:-6s;}

@media(max-width:768px){
  .corner-lotus.lotus-left{
    width:min(24vw,110px);
    left:-2%;
    bottom:-1%;
  }
  .corner-lotus.lotus-right{
    width:min(24vw,110px);
    right:-2%;
    bottom:-1%;
  }
}
@media(max-width:420px){
  .corner-lotus.lotus-left,
  .corner-lotus.lotus-right{
    width:min(28vw,90px);
  }
}

#text-layer{
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  padding: 12vh 0 0 13vw;pointer-events:auto;z-index:7;max-width:min(58vw, 900px);
}
#promoBtn {
    margin-top: 24px; /* adjust: 20px, 30px, 40px */
}

.eyebrow{
  font-size:clamp(.52rem,.92vw,3rem);
  font-weight:500;
  letter-spacing:.22em;
  color:#061a4d;
  text-transform:uppercase;
  font-family: 'Figtree', sans-serif;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-30px);
  text-shadow: none;
}

.title-happy{
  /* font-family:'Adobe Garamond Pro', 'EB Garamond', Garamond, serif; */
  /* font-family: 'Cormorant Garamond', serif; */
  /* font-family: 'Bluemun', 'Cormorant Garamond', serif; */
  /* font-family: 'Sacrifice', 'Cormorant Garamond', serif; */
  /* font-family: 'Yeseva One', serif; */
  /* font-family: 'Berkshire Swash', serif; */
  font-family: 'Figtree', sans-serif;
  /* font-family: 'Quivert', 'Berkshire Swash', serif; */
  
  font-size:clamp(.52rem,.7vw,.9rem);
  font-weight:500;
  font-style:normal;
  letter-spacing:.3em;
  line-height:1.3;
  margin-top: 3%;
  text-transform:uppercase;
  display:block;
  background-image: linear-gradient(180deg,
  #0A1A4D 0%,
  #0D2266 50%,
  #061440 100%
) !important;
  /* background-image: linear-gradient(180deg,#F4D470 0%,#C8971A 50%,#FFF0A0 100%) !important; */
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  -webkit-text-stroke:.0px transparent;
  color: transparent;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-40px);
  filter:none
}

.title-vesak{
  font-family: 'Berkshire Swash', serif;
  /* font-family: 'The Artisan', 'Berkshire Swash', serif; */
  /* font-family: 'Nelagone', 'Berkshire Swash', serif; */
  /* font-family: 'Quivert', 'Berkshire Swash', serif; */
  /* font-family: 'Barthez', 'Berkshire Swash', serif; */
  letter-spacing: 0.05em;
  font-size:clamp(3.6rem,8.5vw,7.8rem);
  font-weight:500;
  line-height:1.2;
  display:block;
  background-image: linear-gradient(180deg,
  #0A1A4D 0%,
  #0D2266 50%,
  #061440 100%
) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  -webkit-text-stroke:0px transparent;
  color: transparent;
  opacity:0;
  visibility:hidden;
  transform:translateX(-50px);
  filter:
    drop-shadow(0 2px 0 rgba(255,255,255,.25))
    drop-shadow(0 10px 18px rgba(8,25,65,.3));
}

.divider-line{
  display:flex;align-items:center;gap:12px;
  margin:20px 0 18px;
  width:min(45vw,520px);
  opacity:0;
  visibility:hidden;
}
.divider-line::before,.divider-line::after{
  content:'';flex:1;height:1px;
  background:linear-gradient(90deg,transparent,#C8971A,#E8C060,transparent);
  box-shadow:0 0 8px rgba(200,151,26,.3);
}
/* .divider-lotus{color:#C8971A;font-size:1rem;text-shadow:0 1px 0 rgba(255,240,120,.5);} */

.blessing{
  font-family: 'Figtree', sans-serif;
  visibility:hidden;
  font-size:clamp(1rem,1.95vw,1.5rem);
  font-style:normal;
  font-weight:400;
  line-height:1.3;
  color:rgba(6,26,77,0);
  margin-bottom:24px;
  max-width:min(50vw,680px);
  letter-spacing:.01em;
  text-shadow:
    0 1px 0  rgba(255,255,255,.25),
    0 8px 20px rgba(8,25,65,.5);
}
.blessing .word{display:inline-block;opacity:0;transform:translateY(10px);}

.cta-btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family: 'Cormorant Garamond', serif;
  font-size:clamp(.68rem,1.15vw,.9rem);
  letter-spacing:.15em;
  color:var(--ivory);
  border:1.5px solid rgba(200,151,26,.75);
  padding:.9em 2.5em;
  border-radius:30px;
  text-decoration:none;
  text-transform:uppercase;
  width:fit-content;
  opacity:0;visibility:hidden;transform:translateY(12px);
  background:linear-gradient(180deg,#2A5CAA 0%,#1A4490 52%,#0E2F6E 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.35),
    0 10px 24px rgba(8,25,65,.3),
    0 0 0 3px rgba(200,151,26,.14);
  backdrop-filter:blur(6px);
  pointer-events:auto;
  transition:background .3s,box-shadow .3s,transform .2s;
  position:relative;overflow:hidden;
}
.cta-btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,230,100,.08),transparent);
  transform:translateX(-100%);
  transition:transform .6s ease;
}
.cta-btn:hover::before{transform:translateX(100%);}
.cta-btn:hover{
  background:linear-gradient(180deg,#3468B8 0%,#1E4E9E 52%,#122E78 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.42),0 14px 30px rgba(8,25,65,.35),0 0 0 3px rgba(200,151,26,.22);
  transform:translateY(-1px);
}

.badges{
  display:flex;gap:clamp(16px,2.2vw,30px);
  margin-top:20px;opacity:0;visibility:hidden;transform:translateY(10px);
  padding:10px 18px;
  background:rgba(8,25,65,.32);
  border:1px solid rgba(200,151,26,.22);
  border-radius:10px;
  backdrop-filter:blur(6px);
}
.badge{display:flex;align-items:center;gap:8px;}
.badge-icon{
  width:clamp(28px,2.8vw,38px);height:clamp(28px,2.8vw,38px);
  border-radius:50%;
  border:1.5px solid rgba(200,151,26,.9);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(10px,1.1vw,13px);
  color:#FFE89A;
  background:rgba(200,151,26,.14);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 0 12px rgba(200,151,26,.22);
  flex-shrink:0;
}
.badge-text{
  font-family: 'Cormorant Garamond', serif;
  font-size:clamp(.48rem,.8vw,.64rem);
  font-weight:600;
  color:#FFF8EC;
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1.38;
  text-shadow:0 1px 8px rgba(8,25,65,.75),0 2px 16px rgba(8,25,65,.55);
  text-align: start;
}

#tagline-layer{display:flex;justify-content:center;align-items:flex-start;padding-top:2.8vh;z-index:8;}
.tagline{
  font-family: 'Cormorant Garamond', serif;
  font-size:clamp(.38rem,.68vw,.52rem);
  font-weight:400;
  letter-spacing:.55em;
  color:rgba(200,151,26,0);
  text-transform:uppercase;
  visibility:hidden;
}

.scroll-hint{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;}
.scroll-hint-text{font-family: 'Cormorant Garamond', serif;font-size:.4rem;letter-spacing:.5em;color:rgba(200,151,26,.5);text-transform:uppercase;visibility:hidden;}
.scroll-line{width:1px;height:32px;background:linear-gradient(180deg,rgba(200,151,26,.6),transparent);animation:scrollPulse 1.9s ease-in-out infinite;}
@keyframes scrollPulse{0%,100%{opacity:.45;transform:scaleY(1);}50%{opacity:1;transform:scaleY(1.32);}}

.divider-lotus{
  color: #C8971A;
  font-size: 0.6rem;
  text-shadow: 0 0 8px rgba(200,151,26,.6);
  letter-spacing: 0.3em;
}

@media(max-width:768px){
  #text-layer{padding:0 5vw;max-width:100vw;align-items:center;text-align:center;justify-content:flex-start;padding-top:10vh;}
  .title-vesak{font-size:clamp(2.4rem,11vw,4rem);}
  .title-happy{font-size:clamp(1.4rem,5.5vw,2.2rem);}
  .eyebrow{font-size:clamp(.8rem,2.2vw,.64rem);letter-spacing:.24em;margin-bottom:7px;}
  .divider-line{width:80vw;margin:12px 0 0;}
  .blessing{max-width:88vw;font-size:clamp(.9rem,3.2vw,1.3rem);line-height:1.5;margin-top:300px;margin-bottom:12px;}
  .cta-btn{font-size:clamp(.52rem,2.1vw,.72rem);padding:.76em 1.1em;letter-spacing:.08em;max-width:88vw;}
  .badges{flex-wrap:wrap;justify-content:center;gap:8px 10px;margin-top:10px;}
  .badge-icon{width:26px;height:26px;font-size:10px;}
  .badge-text{font-size:.46rem;}
  #halo-layer,#rays-layer,#buddha-layer{padding-left:0;padding-bottom:20%;}
  .buddha-statue{width:min(75vw,550px);max-height:54vh;}
  .buddha-aura{left:50%;top:50%;width:min(70vw,350px);height:min(70vw,350px);}
  .buddha-shadow{left:50%;width:min(62vw,320px);bottom:16%;}
  .lake-lotus{width:calc(var(--w) * 1.05);bottom:calc(var(--bottom) - 6vh);}
  .lake-lotus:nth-child(2),.lake-lotus:nth-child(5),.lake-lotus:nth-child(8){display:none;}
}

@media (min-width: 769px) and (max-width: 991px){
  #text-layer{
    padding: 0 6vw;
    max-width: 100vw;
    align-items: center;
    text-align: center;
    justify-content: flex-start;
    padding-top: 15vh;
  }
  .title-vesak{ font-size: clamp(2.8rem, 7vw, 4.2rem); }
  .title-happy{ font-size: clamp(1.4rem, 6vw, 3rem); line-height: 1.5; }
  .halo-ring{ width: min(55vw, 380px); height: min(55vw, 380px); }
  .eyebrow{ font-size: clamp(1rem, 2.5vw, .9rem); letter-spacing: .2em; }
  .divider-line{ width: 70vw; margin: 14px 0 6px; }
  .blessing{ max-width: 80vw; font-size: clamp(1rem, 2.3vw, 2rem); line-height: 1.55; margin-top: 385px; margin-bottom: 14px; }
  .cta-btn{ font-size: clamp(.65rem, 1.5vw, .85rem); padding: .8em 1.6em; }
  .badges{ flex-wrap: wrap; justify-content: center; gap: 10px 12px; margin-top: 12px; }
  .badge-icon{ width: 28px; height: 28px; font-size: 11px; }
  .badge-text{ font-size: .5rem; }
  /* #halo-layer, #rays-layer, #buddha-layer{ padding-left: 0; padding-bottom: 8%; } */
  /* .buddha-statue{ width: min(60vw, 420px); max-height: 52vh; } */
  .buddha-shadow{ bottom: 14%; }
  .lake-lotus{ bottom: calc(var(--bottom) - 5vh); }
  .halo-ring{ width: min(52vw, 340px); height: min(52vw, 340px); }
  .halo-outer{ width: min(62vw, 400px); height: min(62vw, 400px); }
  .buddha-statue{ width: min(70vw, 600px); max-height: 55vh; }
  #buddha-layer, #halo-layer, #rays-layer{ padding-left: 0; padding-bottom: 5%; }
}

@media (min-width: 992px){
  #text-layer{
    justify-content:flex-start;
    padding-top:clamp(7vh,8.8vh,11vh);
    overflow:visible;
    padding: 0 0 0 12vw;
  }
  /* .title-happy{line-height:1.8;} */
  .divider-line{margin-top:clamp(36px,3.8vw,64px);}
  .lake-lotus{bottom:calc(var(--bottom) - 9vh);}
}

@media (min-width: 992px) and (max-width: 1439px){
  #text-layer{
    padding: 26vh 0 0 13vw;
    max-width: 45vw;
  }
  .title-happy{ font-size: clamp(4rem, 4vw, 6rem); line-height: 1.5; }
  .title-vesak{ font-size: clamp(3rem, 6vw, 5rem); line-height: 1.2; }
  .eyebrow{ font-size: clamp(.5rem, 0.8vw, .7rem); }
  .blessing{ max-width: 42vw; font-size: clamp(.9rem, 1.4vw, 1.1rem); margin-top: 0; }
  .cta-btn{ font-size: clamp(.6rem, 0.9vw, .8rem); }
  .badge-text{ font-size: clamp(.44rem, 0.6vw, .58rem); }
  #buddha-layer, #halo-layer, #rays-layer{ padding-left: 32%; }
  .buddha-statue{ width: min(38vw, 520px); }
}

@media (max-width: 480px){
  #text-layer{ padding: 14vh 0 0 0; }
}

@media(max-width:420px){
  .title-vesak{font-size:clamp(2rem,13vw,3.2rem);}
  .title-happy{font-size:clamp(1.2rem,6.5vw,1.8rem);}
}

@media (min-width: 1440px){
  #text-layer{ max-width: 50vw; padding: 30vh 0 0 20vw; }
  .buddha-statue{ width: min(38vw, 1100px); }
  #buddha-layer, #halo-layer, #rays-layer{ padding-left: 42%; }
  .title-vesak{ font-size: clamp(5rem, 5.5vw, 8.5rem); }
  .title-happy{ font-size: clamp(5rem, 5vw, 7.5rem); }
  .blessing{ font-size: clamp(1.2rem, 1.3vw, 1.6rem); }
  .cta-btn{ font-size: clamp(.85rem, 0.9vw, 1rem); }
  .badge-text{ font-size: clamp(.55rem, .6vw, .7rem); }
}

@media (min-width: 1920px){
  #text-layer{ padding: 26vh 0 0 20vw; }
  #buddha-layer, #halo-layer, #rays-layer{ padding-left: 35%; padding-top: 5%; }
  .title-vesak{ font-size: clamp(6.2rem, 1.9vw, 3.8rem); }
  .title-happy{ font-size: clamp(4.2rem, 1.9vw, 3.8rem); }
  .blessing{ font-size: clamp(1.25rem, 1.1vw, 1.6rem); }
  .cta-btn{ font-size: clamp(.9rem, 0.7vw, 1.05rem); }
  .badge-text{ font-size: clamp(.6rem, .55vw, .75rem); }
  .halo-ring{ width: min(42vw, 560px); height: min(42vw, 560px); }
  .halo-outer{ width: min(50vw, 660px); height: min(50vw, 660px); }
  .buddha-statue{ width: min(45vw, 1100px); }
}

@media (min-width: 2560px){
  #text-layer{ max-width: 70vw; padding: 25vh 0 0 21vw; }
  #buddha-layer, #halo-layer, #rays-layer{ padding-left: 38%; }
  .title-vesak{ font-size: clamp(10rem, 5.5vw, 15rem); }
  .title-happy{ font-size: clamp(9rem, 2.2vw, 5.5rem); }
  .halo-ring{ width: min(50vw, 720px); height: min(50vw, 720px); }
  .halo-outer{ width: min(58vw, 840px); height: min(58vw, 840px); }
  .buddha-statue{ width: min(42vw, 1600px); }
  .blessing { font-size: clamp(1.25rem, 1.3vw, 2rem);}
}