
      :root {
        --green: #17392c;
        --deep: #0d251c;
        --moss: #73804a;
        --gold: #b89a72;
        --brown: #76553d;
        --cream: #f4f0e8;
        --sand: #e7dfd2;
        --ink: #252923;
        --muted: #6f756e;
        --line: rgba(33, 54, 43, 0.18);
      }
      * {
        box-sizing: border-box;
      }
      html {
        scroll-behavior: smooth;
      }
      body {
        margin: 0;
        background: var(--cream);
        color: var(--ink);
        font:
          16px/1.7 Barlow,
          Arial,
          sans-serif;
        font-weight: 300;
      }
      a {
        color: inherit;
        text-decoration: none;
      }
      button,
      input,
      select,
      textarea {
        font: inherit;
      }
      .container {
        width: min(1220px, calc(100% - 80px));
        margin: auto;
      }
      .display,
      h1,
      h2,
      h3 {
        font-family: "Gilda Display", Georgia, serif;
        font-weight: 400;
      }
      .eyebrow {
        font-size: 0.72rem;
        letter-spacing: 0.25em;
        text-transform: uppercase;
        color: var(--gold);
        font-weight: 500;
      }
      .heading {
        font-size: clamp(3rem, 5.4vw, 5.7rem);
        line-height: 1.02;
        margin: 16px 0 28px;
        color: var(--green);
      }
      .lead {
        font: 1.45rem/1.45 "Gilda Display";
        color: #536056;
      }
      .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 48px;
        padding: 0 24px;
        border: 1px solid currentColor;
        font-size: 0.71rem;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        transition: 0.3s;
      }
      .btn:hover {
        background: var(--gold);
        border-color: var(--gold);
        color: #fff;
      }
      .arrow {
        display: inline-flex;
        gap: 18px;
        align-items: center;
        font-size: 0.71rem;
        letter-spacing: 0.16em;
        text-transform: uppercase;
      }
      .arrow:after {
        content: "→";
        transition: 0.3s;
      }
      .arrow:hover:after {
        transform: translateX(6px);
      }
      header {
        position: fixed;
        z-index: 40;
        inset: 0 0 auto;
        color: #fff;
        transition: 0.4s;
      }
      .nav {
        height: 96px;
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      .brand {
        font: 2.05rem/0.8 "Gilda Display";
        letter-spacing: 0.17em;
      }
      .brand small {
        display: block;
        margin-top: 11px;
        font: 500 0.46rem Barlow;
        letter-spacing: 0.25em;
        color: #d7c6a5;
      }
      .links {
        display: flex;
        align-items: center;
        gap: 25px;
        font-size: 0.65rem;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }
      .links a:hover {
        color: #d7c6a5;
      }
      .menu {
        display: none;
        border: 0;
        background: none;
        color: white;
        font-size: 1.5rem;
      }
      header.stuck {
        background: #0d251cf2;
        backdrop-filter: blur(14px);
        box-shadow: 0 1px #ffffff1b;
      }
      .hero {
        height: 100svh;
        min-height: 740px;
        position: relative;
        overflow: hidden;
        background: var(--deep);
        color: #fff;
      }
      .motion-frame {
        position: absolute;
        inset: -4%;
        opacity: 0;
        background-size: cover;
        background-position: center;
        animation: cinema 18s infinite;
      }
      .motion-frame:nth-child(1) {
        background-image: url("images/raaga-night-aerial-close-v3.png");
        animation-delay: 0s;
      }
      .motion-frame:nth-child(2) {
        background-image: url("images/raaga-night-aerial-close-v3.png");
        background-position: 58% center;
        animation-delay: 6s;
      }
      .motion-frame:nth-child(3) {
        background-image: url("images/raaga-night-aerial-close-v3.png");
        background-position: 72% center;
        animation-delay: 12s;
      }
      .hero:after {
        content: "";
        position: absolute;
        inset: 0;
        background:
          linear-gradient(90deg, #081e16e8 0%, #081e1680 45%, transparent 78%),
          linear-gradient(0deg, #081e16a5, transparent 55%);
      }
      @keyframes cinema {
        0% {
          opacity: 0;
          transform: scale(1);
        }
        6% {
          opacity: 1;
        }
        31% {
          opacity: 1;
        }
        39% {
          opacity: 0;
          transform: scale(1.1);
        }
        100% {
          opacity: 0;
        }
      }
      .hero-inner {
        height: 100%;
        position: relative;
        z-index: 2;
        display: flex;
        align-items: center;
      }
      .hero-copy {
        padding-top: 70px;
        max-width: 900px;
      }
      .hero h1 {
        font-size: clamp(4.4rem, 8.4vw, 8.5rem);
        line-height: 0.9;
        letter-spacing: -0.025em;
        margin: 24px 0 30px;
      }
      .hero p {
        max-width: 620px;
        color: #e0e6e1;
        font-size: 1.1rem;
      }
      .hero-actions {
        display: flex;
        gap: 14px;
        flex-wrap: wrap;
        margin-top: 38px;
      }
      .hero .btn:first-child {
        background: var(--gold);
        border-color: var(--gold);
      }
      .hero .btn:first-child:hover {
        background: white;
        border-color: white;
        color: var(--green);
      }
      .film-label {
        position: absolute;
        z-index: 3;
        right: 5vw;
        bottom: 42px;
        font-size: 0.66rem;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        color: #e8e1d6;
        display: flex;
        align-items: center;
        gap: 12px;
      }
      .film-label:before {
        content: "";
        width: 52px;
        border-top: 1px solid;
      }
      .intro {
        padding: 145px 0;
      }
      .intro-grid {
        display: grid;
        grid-template-columns: 1.06fr 0.94fr;
        gap: 100px;
        align-items: center;
      }
      .intro-img {
        min-height: 690px;
        background: url("images/raaga-landscape.png") center/cover;
        position: relative;
      }
      .seal {
        position: absolute;
        right: -45px;
        bottom: 55px;
        width: 160px;
        height: 160px;
        border-radius: 50%;
        background: var(--green);
        color: white;
        border: 8px solid var(--cream);
        display: grid;
        place-items: center;
        text-align: center;
        font-size: 0.66rem;
        letter-spacing: 0.13em;
        text-transform: uppercase;
      }
      .seal strong {
        display: block;
        font: 1.55rem "Gilda Display";
        color: #dfcaa6;
      }
      .intro-copy p {
        color: var(--muted);
      }
      .signature {
        font: 2.1rem "Gilda Display";
        color: var(--brown);
        margin-top: 24px;
      }
      .climate {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        margin-top: 38px;
        border-block: 1px solid var(--line);
      }
      .climate-item {
        padding: 20px 12px;
        border-right: 1px solid var(--line);
      }
      .climate-item:last-child {
        border: 0;
      }
      .climate-icon {
        font-size: 1.4rem;
        color: var(--gold);
      }
      .climate-item strong {
        display: block;
        font: 1.12rem "Gilda Display";
        color: var(--green);
        margin: 6px 0 2px;
      }
      .climate-item span {
        font-size: 0.69rem;
        color: var(--muted);
      }
      .features {
        background: var(--sand);
        border-block: 1px solid var(--line);
      }
      .feature-row {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
      }
      .feature {
        padding: 42px 25px;
        text-align: center;
        border-right: 1px solid var(--line);
      }
      .feature:last-child {
        border: 0;
      }
      .feature b {
        display: block;
        font: 2.5rem "Gilda Display";
        color: var(--green);
      }
      .feature span {
        font-size: 0.68rem;
        letter-spacing: 0.13em;
        text-transform: uppercase;
        color: var(--brown);
      }
      .experience {
        padding: 105px 0 115px;
      }
      .experience-head {
        text-align: center;
        max-width: 780px;
        margin: 0 auto 65px;
      }
      .experience-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
      }
      .experience-card {
        min-height: 560px;
        position: relative;
        background-size: cover;
        background-position: center;
        color: #fff;
        overflow: hidden;
      }
      .experience-card:nth-child(1) {
        background-image: url("images/raaga-villa-v2.png");
      }
      .experience-card:nth-child(2) {
        background-image: url("images/raaga-slow-living-v2.png");
      }
      .experience-card:nth-child(3) {
        background-image: url("images/raaga-wellness-circle.png");
      }
      .experience-card:after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(0deg, #071c15ec, transparent 70%);
      }
      .experience-card > div {
        position: absolute;
        z-index: 2;
        left: 34px;
        right: 34px;
        bottom: 35px;
      }
      .experience-card .eyebrow {
        position: static;
        margin-bottom: 8px;
        color: #dfccaa;
      }
      .experience-card h3 {
        font-size: 2.25rem;
        margin: 0 0 8px;
      }
      .experience-card p {
        font-size: 0.85rem;
        color: #dce3de;
        margin: 0;
      }
      .video {
        min-height: 78svh;
        display: grid;
        place-items: center;
        text-align: center;
        color: white;
        background:
          linear-gradient(#0a2319a3, #0a2319a3),
          url("images/raaga-landscape.png") center/cover fixed;
      }
      .video .eyebrow {
        color: #dfccaa;
      }
      .video h2 {
        font-size: clamp(3.6rem, 7vw, 7rem);
        line-height: 0.96;
        margin: 20px 0;
      }
      .play {
        width: 84px;
        height: 84px;
        border-radius: 50%;
        border: 1px solid #ffffffa0;
        background: #ffffff12;
        color: white;
        font-size: 1.2rem;
        display: inline-grid;
        place-items: center;
        transition: 0.3s;
      }
      .play:hover {
        background: white;
        color: var(--green);
      }
      .amenities {
        padding: 100px 0 72px;
        background: var(--cream);
        color: var(--ink);
      }
      .amenities .heading {
        color: var(--green);
      }
      .amenity-head {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 75px;
        align-items: end;
        margin-bottom: 48px;
      }
      .amenity-head p {
        color: var(--muted);
      }
      .amenity-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
      }
      .amenity {
        min-height: 305px;
        position: relative;
        background-size: cover;
        background-position: center;
        overflow: hidden;
      }
      .amenity:nth-child(1) {
        background-image: url("images/raaga-wellness-circle.png");
      }
      .amenity:nth-child(2) {
        background-image: url("images/raaga-couple-sunrise.png");
      }
      .amenity:nth-child(3) {
        background-image: url("images/raaga-slow-living-v2.png");
      }
      .amenity:nth-child(4) {
        background-image: url("images/raaga-landscape.png");
      }
      .amenity:nth-child(5) {
        background-image: url("images/raaga-family-life.png");
      }
      .amenity:nth-child(6) {
        background-image: url("images/raaga-wellness-circle.png");
      }
      .amenity:after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(0deg, #081f17e7, transparent 68%);
      }
      .amenity div {
        position: absolute;
        z-index: 2;
        left: 28px;
        right: 28px;
        bottom: 27px;
      }
      .amenity h3 {
        font-size: 1.55rem;
        margin: 0 0 5px;
        color: #fff;
        text-shadow: 0 2px 18px #071c15;
      }
      .amenity p {
        font-size: 0.76rem;
        color: #d6ded8;
        margin: 0;
      }
      .villas {
        padding: 145px 0;
        background: var(--sand);
      }
      .villa-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
        margin-top: 68px;
      }
      .villa {
        background: var(--cream);
      }
      .villa-image {
        height: 460px;
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .villa:nth-child(1) .villa-image {
        background-image: url("images/raaga-villa-v2.png");
      }
      .villa:nth-child(2) .villa-image {
        background-image: url("images/raaga-slow-living-v2.png");
      }
      .villa:nth-child(3) .villa-image {
        background-image: url("images/raaga-couple-sunrise.png");
      }
      .villa-badge {
        position: absolute;
        right: 22px;
        top: 22px;
        background: var(--green);
        color: #fff;
        padding: 9px 13px;
        font-size: 0.63rem;
        letter-spacing: 0.13em;
        text-transform: uppercase;
      }
      .villa-copy {
        padding: 30px;
      }
      .villa-copy h3 {
        font-size: 2.15rem;
        color: var(--green);
        margin: 0 0 8px;
      }
      .villa-copy p {
        font-size: 0.86rem;
        color: var(--muted);
        min-height: 48px;
      }
      .villa-meta {
        display: flex;
        justify-content: space-between;
        padding-top: 18px;
        border-top: 1px solid var(--line);
        align-items: center;
      }
      .villa-meta span {
        font-size: 0.7rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--brown);
      }
      .plan {
        padding: 145px 0;
      }
      .plan-grid {
        display: grid;
        grid-template-columns: 1.1fr 0.9fr;
        gap: 95px;
        align-items: center;
      }
      .site-plan {
        background: #e8e1d3;
        padding: 28px;
        min-height: 650px;
        position: relative;
        border: 1px solid #d4c8b6;
        overflow: hidden;
      }
      .plan-road {
        position: absolute;
        left: 47%;
        top: -20px;
        width: 80px;
        height: 730px;
        background: #cabba5;
        transform: rotate(5deg);
        border-inline: 3px dashed #f3eee4;
      }
      .plot {
        position: absolute;
        width: 118px;
        height: 64px;
        border: 1px solid #71804d;
        background: #91a26333;
        display: grid;
        place-items: center;
        text-align: center;
        font-size: 0.65rem;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--green);
      }
      .plot b {
        display: block;
        font: 1rem "Gilda Display";
        letter-spacing: 0;
      }
      .p1 {
        left: 30px;
        top: 50px;
      }
      .p2 {
        left: 32px;
        top: 135px;
      }
      .p3 {
        left: 38px;
        top: 220px;
      }
      .p4 {
        left: 45px;
        top: 305px;
      }
      .p5 {
        left: 52px;
        top: 390px;
      }
      .p6 {
        left: 60px;
        top: 475px;
      }
      .p7 {
        right: 26px;
        top: 70px;
      }
      .p8 {
        right: 20px;
        top: 160px;
      }
      .p9 {
        right: 18px;
        top: 250px;
      }
      .p10 {
        right: 25px;
        top: 340px;
      }
      .p11 {
        right: 32px;
        top: 430px;
      }
      .p12 {
        right: 38px;
        top: 520px;
      }
      .amenity-node {
        position: absolute;
        left: 41%;
        width: 105px;
        height: 105px;
        border-radius: 50%;
        background: var(--green);
        color: #fff;
        display: grid;
        place-items: center;
        text-align: center;
        font-size: 0.64rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
      .dome {
        top: 70px;
      }
      .tree {
        top: 280px;
        background: var(--moss);
      }
      .hall {
        top: 500px;
        background: var(--brown);
      }
      .plan-copy p {
        color: var(--muted);
      }
      .plan-list {
        margin: 32px 0;
        border-top: 1px solid var(--line);
      }
      .plan-list div {
        display: flex;
        justify-content: space-between;
        padding: 16px 0;
        border-bottom: 1px solid var(--line);
      }
      .plan-list strong {
        font-family: "Gilda Display";
        font-size: 1.2rem;
        color: var(--green);
      }
      .plan-list span {
        font-size: 0.72rem;
        letter-spacing: 0.11em;
        text-transform: uppercase;
        color: var(--muted);
      }
      .invest {
        padding: 145px 0;
        background: var(--deep);
        color: #fff;
      }
      .invest .heading {
        color: #fff;
      }
      .invest-head {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 85px;
        align-items: end;
      }
      .invest-head p {
        color: #b7c2ba;
      }
      .chart-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
        margin-top: 65px;
      }
      .chart {
        background: #153b2d;
        padding: 30px;
        min-height: 370px;
      }
      .chart h3 {
        font-size: 1.55rem;
        margin: 0 0 5px;
      }
      .chart .metric {
        font: 2.7rem "Gilda Display";
        color: #d9c49f;
        margin: 20px 0 3px;
      }
      .chart small {
        color: #aebbb2;
      }
      .chart svg {
        width: 100%;
        height: 125px;
        margin-top: 24px;
        overflow: visible;
      }
      .chart .axis {
        stroke: #ffffff2f;
        stroke-width: 1;
      }
      .chart .line {
        fill: none;
        stroke: #cbb184;
        stroke-width: 3;
      }
      .chart .area {
        fill: #b89a7230;
      }
      .chart .bar {
        fill: #8b9b58;
      }
      .chart text {
        fill: #c4cec7;
        font: 9px Barlow;
      }
      .insights {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        border-block: 1px solid #ffffff32;
        margin-top: 55px;
      }
      .insight {
        padding: 28px;
        border-right: 1px solid #ffffff32;
      }
      .insight:last-child {
        border: 0;
      }
      .insight strong {
        display: block;
        font: 2rem "Gilda Display";
        color: #d9c49f;
      }
      .insight span {
        font-size: 0.75rem;
        color: #b7c2ba;
      }
      .disclaimer {
        margin-top: 28px;
        color: #91a097;
        font-size: 0.72rem;
      }
      .programs {
        padding: 145px 0;
      }
      .program-head {
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 60px;
      }
      .program-scroll {
        display: flex;
        gap: 16px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding: 65px 0 24px;
        scrollbar-color: var(--gold) transparent;
      }
      .program {
        min-width: 320px;
        scroll-snap-align: start;
        background: var(--sand);
      }
      .program-img {
        height: 350px;
        background-size: cover;
        background-position: center;
      }
      .program:nth-child(1) .program-img {
        background-image: url("images/raaga-couple-sunrise.png");
      }
      .program:nth-child(2) .program-img {
        background-image: url("images/raaga-wellness-circle.png");
      }
      .program:nth-child(3) .program-img {
        background-image: url("images/raaga-family-life.png");
      }
      .program:nth-child(4) .program-img {
        background-image: url("images/raaga-slow-living-v2.png");
      }
      .program:nth-child(5) .program-img {
        background-image: url("images/raaga-landscape.png");
      }
      .program:nth-child(6) .program-img {
        background-image: url("images/raaga-villa-v2.png");
      }
      .program-copy {
        padding: 24px;
      }
      .program-copy small {
        font-size: 0.64rem;
        letter-spacing: 0.13em;
        text-transform: uppercase;
        color: var(--brown);
      }
      .program-copy h3 {
        font-size: 1.55rem;
        margin: 7px 0;
        color: var(--green);
      }
      .program-copy p {
        font-size: 0.8rem;
        color: var(--muted);
      }
      .community {
        min-height: 92svh;
        display: flex;
        align-items: center;
        background:
          linear-gradient(90deg, #0d251ce8 0%, #0d251c9a 48%, transparent 80%),
          url("images/raaga-family-life.png") center/cover;
        color: #fff;
      }
      .community-copy {
        max-width: 680px;
        padding: 110px 0;
      }
      .community .heading {
        color: #fff;
      }
      .community-copy p {
        color: #d4dcd6;
        max-width: 560px;
      }
      .community-words {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        margin: 34px 0;
      }
      .community-words span {
        border: 1px solid #ffffff68;
        padding: 10px 14px;
        font-size: 0.68rem;
        letter-spacing: 0.11em;
        text-transform: uppercase;
      }
      .faq {
        padding: 125px 0;
        background: var(--cream);
      }
      .faq-grid {
        display: grid;
        grid-template-columns: 0.72fr 1.28fr;
        gap: 100px;
        align-items: start;
      }
      .faq .heading {
        font-size: clamp(2.8rem, 4.5vw, 4.8rem);
      }
      .faq-list {
        border-top: 1px solid var(--line);
      }
      .faq details {
        border-bottom: 1px solid var(--line);
        padding: 0;
      }
      .faq summary {
        list-style: none;
        cursor: pointer;
        padding: 23px 42px 23px 0;
        position: relative;
        font: 1.28rem "Gilda Display";
        color: var(--green);
      }
      .faq summary::-webkit-details-marker {
        display: none;
      }
      .faq summary:after {
        content: "+";
        position: absolute;
        right: 4px;
        color: var(--gold);
        font: 1.5rem Barlow;
      }
      .faq details[open] summary:after {
        content: "−";
      }
      .faq details p {
        margin: -5px 55px 23px 0;
        color: var(--muted);
        font-size: 0.88rem;
      }
      .testimonial {
        padding: 130px 0;
        text-align: center;
        background: var(--sand);
      }
      .quote {
        max-width: 900px;
        margin: auto;
      }
      .quote p {
        font: clamp(2.2rem, 4vw, 4rem) / 1.25 "Gilda Display";
        color: var(--green);
      }
      .quote span {
        font-size: 0.7rem;
        letter-spacing: 0.17em;
        text-transform: uppercase;
        color: var(--brown);
      }
      .contact {
        padding: 135px 0;
        background: var(--green);
        color: #fff;
      }
      .contact-grid {
        display: grid;
        grid-template-columns: 0.85fr 1.15fr;
        gap: 110px;
      }
      .contact .heading {
        color: #fff;
      }
      .contact-copy p {
        color: #b9c5bc;
      }
      .contact-actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        margin-top: 30px;
      }
      .form {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
      }
      .form label {
        font-size: 0.67rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: #b9c5bc;
      }
      .form input,
      .form select,
      .form textarea {
        width: 100%;
        padding: 12px 0;
        background: transparent;
        color: #fff;
        border: 0;
        border-bottom: 1px solid #ffffff50;
        outline: 0;
      }
      .form option {
        color: #222;
      }
      .form textarea {
        min-height: 85px;
      }
      .full,
      .success {
        grid-column: 1/-1;
      }
      .form button {
        background: var(--gold);
        border-color: var(--gold);
        color: #fff;
        cursor: pointer;
        justify-self: start;
      }
      .success {
        display: none;
        color: #e0cea9;
      }
      .success.show {
        display: block;
      }
      footer {
        padding: 65px 0 30px;
        background: #061812;
        color: #a8b4ac;
      }
      .footer-grid {
        display: grid;
        grid-template-columns: 1.2fr 0.8fr 0.8fr;
        gap: 75px;
      }
      .footer-brand p {
        max-width: 360px;
        font-size: 0.82rem;
      }
      .footer h3 {
        font: 1rem Barlow;
        text-transform: uppercase;
        letter-spacing: 0.14em;
        color: #fff;
      }
      .footer a {
        display: block;
        font-size: 0.78rem;
        margin: 7px 0;
      }
      .footer-bottom {
        margin-top: 45px;
        padding-top: 22px;
        border-top: 1px solid #ffffff25;
        display: flex;
        justify-content: space-between;
        font-size: 0.7rem;
      }
      .reveal {
        opacity: 0;
        transform: translateY(28px);
        transition: 0.8s;
      }
      .reveal.on {
        opacity: 1;
        transform: none;
      }
      @media (max-width: 900px) {
        .container {
          width: min(100% - 40px, 1220px);
        }
        .links {
          display: none;
        }
        .menu {
          display: block;
        }
        .links.open {
          display: flex;
          position: absolute;
          top: 82px;
          left: 20px;
          right: 20px;
          background: var(--deep);
          padding: 25px;
          flex-direction: column;
          align-items: flex-start;
        }
        .intro-grid,
        .amenity-head,
        .plan-grid,
        .invest-head,
        .contact-grid,
        .faq-grid {
          grid-template-columns: 1fr;
          gap: 58px;
        }
        .seal {
          right: 25px;
        }
        .amenity-grid,
        .villa-grid,
        .chart-grid,
        .experience-grid {
          grid-template-columns: 1fr 1fr;
        }
        .villa:nth-child(3),
        .chart:nth-child(3),
        .experience-card:nth-child(3) {
          grid-column: 1/-1;
        }
        .feature-row {
          grid-template-columns: repeat(2, 1fr);
        }
        .feature:nth-child(2) {
          border-right: 0;
        }
        .feature:nth-child(-n + 2) {
          border-bottom: 1px solid var(--line);
        }
        .site-plan {
          max-width: 600px;
        }
        .insights {
          grid-template-columns: 1fr;
        }
        .insight {
          border-right: 0;
          border-bottom: 1px solid #ffffff32;
        }
        .footer-grid {
          grid-template-columns: 1fr 1fr;
        }
        .footer-brand {
          grid-column: 1/-1;
        }
      }
      @media (max-width: 600px) {
        .container {
          width: min(100% - 28px, 1220px);
        }
        .nav {
          height: 80px;
        }
        .hero h1 {
          font-size: 4rem;
        }
        .hero-actions {
          align-items: stretch;
          flex-direction: column;
        }
        .hero-actions .btn {
          width: 100%;
        }
        .intro,
        .experience,
        .amenities,
        .villas,
        .plan,
        .invest,
        .programs,
        .contact,
        .testimonial {
          padding: 90px 0;
        }
        .intro-img {
          min-height: 520px;
        }
        .climate {
          grid-template-columns: 1fr;
        }
        .climate-item {
          border-right: 0;
          border-bottom: 1px solid var(--line);
        }
        .feature-row,
        .amenity-grid,
        .villa-grid,
        .chart-grid,
        .experience-grid {
          grid-template-columns: 1fr;
        }
        .feature {
          border-right: 0;
          border-bottom: 1px solid var(--line);
        }
        .villa:nth-child(3),
        .chart:nth-child(3),
        .experience-card:nth-child(3) {
          grid-column: auto;
        }
        .experience-card {
          min-height: 480px;
        }
        .amenity {
          min-height: 320px;
        }
        .villa-image {
          height: 420px;
        }
        .site-plan {
          min-height: 680px;
          transform: scale(0.94);
          transform-origin: top left;
          width: 106%;
        }
        .plot {
          width: 92px;
        }
        .amenity-node {
          left: 37%;
        }
        .program-head {
          align-items: flex-start;
          flex-direction: column;
        }
        .program {
          min-width: 88vw;
        }
        .community {
          background-position: 65%;
        }
        .video {
          background-attachment: scroll;
        }
        .form {
          grid-template-columns: 1fr;
        }
        .full,
        .success {
          grid-column: auto;
        }
        .footer-grid {
          grid-template-columns: 1fr;
        }
        .footer-brand {
          grid-column: auto;
        }
        .footer-bottom {
          align-items: flex-start;
          flex-direction: column;
          gap: 10px;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .motion-frame {
          animation: none;
        }
        .motion-frame:first-child {
          opacity: 1;
        }
        .reveal {
          opacity: 1;
          transform: none;
          transition: none;
        }
      }
    

/* Refinements only: the reference palette, wording and section order are retained. */
html{scroll-padding-top:95px}body{overflow-x:clip}a,button,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--gold,#b89a72);outline-offset:5px}
.skip-link{position:fixed;top:-90px;left:20px;z-index:100;background:var(--cream);color:var(--green);padding:10px 18px}.skip-link:focus{top:12px}
.container{width:min(1220px,calc(100% - 96px))}.nav{height:88px}.links{gap:24px}.links a{position:relative}.links a:not(.btn):after{content:'';position:absolute;left:0;right:100%;bottom:-6px;border-bottom:1px solid var(--gold);transition:right .25s}.links a:hover:after{right:0}.btn{transition:background .25s,color .25s,border-color .25s,transform .25s}.btn:hover{transform:translateY(-2px)}
.hero{min-height:700px}.hero-copy{max-width:940px}.hero h1{font-size:clamp(4rem,7.4vw,7.7rem);line-height:1.01;letter-spacing:-.025em}.hero p{max-width:560px;font-size:1.04rem}.hero-actions{margin-top:30px}.hero .eyebrow{color:#d7c6a5}.motion-frame:first-child{opacity:1}.hero:after{background:linear-gradient(90deg,#081e16db 0%,#081e1670 48%,#081e1620 100%),linear-gradient(0deg,#081e16a5,transparent 50%)}
.intro{padding:105px 0}.intro-grid{gap:80px}.intro-img{min-height:610px}.seal{width:136px;height:136px;right:-35px;bottom:40px;border-width:6px;box-shadow:0 0 0 1px #b89a7240}.intro-copy .heading{font-size:clamp(2.8rem,4.5vw,4.6rem)}.climate{margin-top:28px}.climate-item{padding:18px 12px}.climate-icon{line-height:1}.feature{padding:34px 22px}
.amenities{padding:95px 0 78px}.amenity-head{gap:65px;margin-bottom:40px}.amenity-head .heading{margin-bottom:0}.amenity{min-height:355px;border-radius:2px;transition:transform .35s,box-shadow .35s}.amenity:hover{transform:translateY(-5px);box-shadow:0 18px 35px #17392c20}.amenity:after{background:linear-gradient(0deg,#081f17f2,transparent 80%)}.amenity div{left:25px;right:25px;bottom:25px}.amenity p{font-size:.82rem;line-height:1.65}.amenity:nth-child(1){background-image:url('images/raaga-night-aerial-close-v3.png');background-position:70% center}.amenity:nth-child(2){background-image:url('images/raaga-wellness-circle.png')}.amenity:nth-child(3){background-image:url('images/raaga-family-life.png')}
.experience{padding:88px 0 100px}.experience-head{margin-bottom:42px}.experience-card{min-height:490px;border-radius:2px}.experience-card>div{left:28px;right:28px;bottom:30px}.experience-card:nth-child(2){background-image:url('images/raaga-landscape.png');background-position:75% center}.video{min-height:68svh;background-attachment:scroll}.video>div{padding:70px 24px}.video h2{font-size:clamp(3.3rem,6vw,6rem)}
.villas,.plan,.invest,.programs{padding:105px 0}.villa-grid{margin-top:45px;gap:22px}.villa{border:1px solid #17392c16;transition:box-shadow .35s,transform .35s;display:flex;flex-direction:column}.villa:hover{box-shadow:0 22px 45px #17392c17;transform:translateY(-5px)}.villa-image{height:380px}.villa-copy{padding:28px;display:flex;flex-direction:column;flex:1}.villa-copy p{min-height:0;flex:1;margin-bottom:24px}.villa-meta{gap:10px}.villa-badge{right:18px;top:18px;background:#17392ce6}.plan-grid{gap:70px}.site-plan{border-radius:2px}.plan-copy .heading{font-size:clamp(2.8rem,4.6vw,4.8rem)}.chart{border:1px solid #ffffff25;border-radius:2px}.chart svg{display:block;width:100%;height:auto}.chart small{line-height:1.65;display:block}.disclaimer{line-height:1.8}
.program-head{gap:35px}.program-head .heading{margin-bottom:0}.program-scroll{padding-top:42px}.program{min-width:310px;max-width:310px;border:1px solid var(--line);transition:transform .25s}.program:hover{transform:translateY(-4px)}.program-img{height:290px}.program-copy{padding:25px}.program:nth-child(1) .program-img,.program:nth-child(3) .program-img,.program:nth-child(6) .program-img{background-image:url('images/raaga-wellness-circle.png')}.program:nth-child(2) .program-img{background-image:url('images/raaga-landscape.png')}.program:nth-child(4) .program-img{background-image:url('images/raaga-family-life.png')}.community{min-height:72svh}.community-copy{padding:90px 0}.testimonial{padding:100px 0}.quote p{line-height:1.3}.contact{padding:105px 0}.contact-grid{gap:75px}.contact .heading{font-size:clamp(2.8rem,4.5vw,4.9rem)}.form input,.form select,.form textarea{border-radius:0}.form-preview-note{font-size:.72rem;color:#d7c6a5;margin:0;letter-spacing:0;text-transform:none}.form .success{line-height:1.65;font-size:.85rem;padding:16px;border:1px solid #b89a7270}.faq{padding:95px 0}.faq-grid{gap:75px}.faq summary{line-height:1.45}footer h3{font:500 .78rem Barlow,sans-serif;letter-spacing:.15em;color:var(--cream);text-transform:uppercase}footer .footer-grid a{display:block;font-size:.8rem;margin:9px 0}footer .brand{color:var(--cream)}
/* Progressive enhancement: no invisible sections if scripts or CDNs fail. */
.reveal{opacity:1;transform:none;transition:none}.motion-ready .reveal{animation:soft-entry .7s both}@keyframes soft-entry{from{opacity:.8;translate:0 12px}to{opacity:1;translate:0 0}}
.top{min-height:62svh}.top .wrap{padding:100px 0 65px}.grid{padding:85px 0}.card{border:1px solid #17392c16}.card:nth-child(1) .img,.card:nth-child(3) .img,.card:nth-child(6) .img{background-image:url('images/raaga-wellness-circle.png')}.card:nth-child(2) .img{background-image:url('images/raaga-landscape.png')}.card:nth-child(4) .img{background-image:url('images/raaga-family-life.png')}.copy .eye{color:#76553d}.top h1{font-size:clamp(3rem,7vw,6rem)}
@media(max-width:1000px){.container{width:calc(100% - 64px)}.intro-grid{gap:50px}.intro-img{min-height:570px}.links{gap:17px}.villa-copy{padding:24px}.contact-grid{gap:48px}.plan-grid{gap:45px}.hero h1{font-size:clamp(4rem,8vw,7rem)}}
@media(max-width:900px){html{scroll-padding-top:88px}.container{width:calc(100% - 48px)}.links.open{top:88px;left:24px;right:24px;border:1px solid #b89a7240;box-shadow:0 15px 40px #0002}.menu{min-width:44px;min-height:44px}.intro-grid,.amenity-head,.plan-grid,.contact-grid,.faq-grid{gap:40px}.intro-img{min-height:520px}.intro-copy{max-width:650px}.intro,.villas,.plan,.invest,.programs,.contact{padding:80px 0}.amenity-head{align-items:start}.villa-image{height:370px}.villa:nth-child(3) .villa-image{height:420px}.villa-copy p{min-height:48px}.faq{padding:80px 0}.seal{right:24px}.site-plan{width:100%;max-width:600px}.community{min-height:65svh}}
@media(max-width:600px){.container{width:calc(100% - 40px)}.nav{height:80px}.brand{font-size:1.8rem}.hero{min-height:720px;height:100svh}.hero-copy{padding-top:70px}.hero h1{font-size:clamp(3.2rem,10.6vw,4.6rem);line-height:1.04;overflow-wrap:normal}.hero p{font-size:.95rem;line-height:1.7}.hero .eyebrow{font-size:.59rem;letter-spacing:.18em}.hero-actions{gap:12px;margin-top:25px}.hero-actions .btn{min-height:47px}.film-label{font-size:.53rem;bottom:25px;right:20px}.film-label:before{width:28px}.heading{font-size:clamp(2.4rem,10vw,3.4rem)}.intro,.amenities,.experience,.villas,.plan,.invest,.programs,.contact,.faq,.testimonial{padding:64px 0}.intro-img{min-height:390px}.intro-grid{gap:36px}.intro-copy .heading{font-size:2.8rem}.seal{width:116px;height:116px;bottom:24px;right:20px}.climate{grid-template-columns:repeat(3,1fr)}.climate-item{border-bottom:0;border-right:1px solid var(--line);padding:15px 8px}.climate-item strong{font-size:.95rem}.climate-item span{font-size:.6rem}.climate-icon{font-size:1.25rem}.feature-row{grid-template-columns:repeat(2,1fr)}.feature{padding:25px 12px;border-bottom:1px solid var(--line)}.feature:nth-child(2){border-right:0}.feature b{font-size:2.25rem}.feature span{font-size:.59rem;letter-spacing:.09em}.experience-head{margin-bottom:32px}.experience-card{min-height:420px}.amenity{min-height:335px}.amenity-grid,.villa-grid{gap:20px}.villa-grid{margin-top:32px}.villa-image,.villa:nth-child(3) .villa-image{height:360px}.villa-copy{padding:25px}.villa-copy p{min-height:0}.video{min-height:540px}.video h2{font-size:3.1rem}.site-plan{min-height:680px;transform:none;width:100%;padding:15px}.plot{width:clamp(70px,21vw,92px);font-size:.58rem}.plot.p1,.plot.p2,.plot.p3,.plot.p4,.plot.p5,.plot.p6{left:14px}.plot.p7,.plot.p8,.plot.p9,.plot.p10,.plot.p11,.plot.p12{right:14px}.plan-road{left:45%;width:45px}.amenity-node{left:35%;width:30%;font-size:.53rem}.program-scroll{padding-top:30px}.program{min-width:82vw;max-width:82vw}.program-img{height:280px}.program-head{gap:16px}.community{min-height:570px}.community-copy{padding:65px 0}.quote p{font-size:2.2rem}.contact-grid{gap:38px}.contact .heading{font-size:2.8rem}.form{gap:22px}.form-preview-note,.success{grid-column:1/-1}.faq-grid{gap:30px}.faq summary{font-size:1.15rem;padding-block:20px}.footer-grid{gap:25px}footer{padding-top:45px}.links.open{top:80px;left:20px;right:20px}.wrap{width:calc(100% - 40px)}.grid{padding:60px 0}.top .wrap{padding:105px 0 60px}.back{left:20px}.close{padding:65px 0}.close h2{font-size:2.6rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-frame{opacity:0}.motion-frame:first-child{opacity:1}.reveal{opacity:1;transform:none}.btn:hover,.villa:hover,.amenity:hover,.program:hover{transform:none}}

/* Content-specific illustrative photography. Existing palette, copy and structure unchanged. */
.hero h1.hero-title{font-size:clamp(1.4rem,5.8vw,5rem);line-height:1.08}
.hero-title>span{display:block;white-space:nowrap}
.motion-frame:nth-child(1){background-image:url('images/content-resort.png');background-position:center}
.motion-frame:nth-child(2){background-image:url('images/content-landscape.png');background-position:center}
.motion-frame:nth-child(3){background-image:url('images/content-dome.png');background-position:center}
.intro-img{background-image:url('images/content-landscape.png');background-position:center}
.amenity:nth-child(1){background-image:url('images/content-dome.png');background-position:center}
.amenity:nth-child(2){background-image:url('images/content-ayur.png');background-position:center}
.amenity:nth-child(3){background-image:url('images/content-cafe.png');background-position:center}
.amenity:nth-child(4){background-image:url('images/content-tree.png');background-position:center}
.amenity:nth-child(5){background-image:url('images/content-hall.png');background-position:center}
.amenity:nth-child(6){background-image:url('images/content-yoga.png');background-position:center}
.experience-card:nth-child(1){background-image:url('images/content-amoha.png');background-position:center}
.experience-card:nth-child(2){background-image:url('images/content-rest.png');background-position:center}
.experience-card:nth-child(3){background-image:url('images/content-yoga.png');background-position:center}
.video{background-image:linear-gradient(#0d251c80,#0d251c80),url('images/content-landscape.png');background-position:center}
.villa:nth-child(1) .villa-image{background-image:url('images/content-amoha.png');background-position:center}
.villa:nth-child(2) .villa-image{background-image:url('images/content-aroha.png');background-position:center}
.villa:nth-child(3) .villa-image{background-image:url('images/content-antara.png');background-position:center}
.program:nth-child(1) .program-img, .card:nth-child(1) .img{background-image:url('images/content-yoga.png');background-position:center}
.program:nth-child(2) .program-img, .card:nth-child(2) .img{background-image:url('images/content-rest.png');background-position:center}
.program:nth-child(3) .program-img, .card:nth-child(3) .img{background-image:url('images/content-women.png');background-position:center}
.program:nth-child(4) .program-img, .card:nth-child(4) .img{background-image:url('images/content-family.png');background-position:center}
.program:nth-child(5) .program-img, .card:nth-child(5) .img{background-image:url('images/content-leader.png');background-position:center}
.program:nth-child(6) .program-img, .card:nth-child(6) .img{background-image:url('images/content-ayur.png');background-position:center}
.community{background-image:linear-gradient(#0d251c80,#0d251c80),url('images/content-family.png');background-position:center}
.top{background-image:linear-gradient(#0d251c80,#0d251c80),url('images/content-yoga.png');background-position:center}
.motion-frame:nth-child(1){background-position:60% center}.amenity:nth-child(1){background-position:center}.experience-card:nth-child(2){background-position:65% center}


/* Requested brand, property imagery and restrained motion updates. */
.amenity-grid.amenity-carousel{display:flex;gap:20px;overflow:hidden;position:relative;scroll-behavior:auto;padding-top:6px;padding-bottom:6px;touch-action:pan-y}
.amenity-carousel>.amenity{flex:0 0 calc((100% - 40px)/3);min-height:410px;transform:none}
.amenity-carousel>.amenity:hover{transform:none}
.amenity-carousel-controls{display:flex;align-items:center;gap:12px;margin-top:24px;color:var(--green)}
.amenity-carousel-button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 14px;border:1px solid var(--line);background:transparent;color:inherit;font:inherit;cursor:pointer;transition:background .25s,color .25s}
.amenity-carousel-button:hover{background:var(--green);color:var(--cream)}
.amenity-carousel-counter{font-size:.72rem;letter-spacing:.12em;margin-left:8px}
.amenity-autoplay{margin-left:auto;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase}
.amenity-autoplay[hidden]{display:none}
@media(max-width:900px){.amenity-carousel>.amenity{flex-basis:calc((100% - 20px)/2)}}
@media(max-width:600px){.amenity-carousel>.amenity{flex-basis:100%;min-height:390px}.amenity-carousel-controls{gap:8px}.amenity-carousel-counter{margin-left:0}.amenity-autoplay{padding-inline:10px;font-size:.58rem}}
.brand-logo{display:block;width:180px;height:auto}
.motion-frame:nth-child(1){background-image:url('images/hero-vibrant-aerial.png');background-position:center}
.motion-frame:nth-child(2){background-image:url('images/hero-vibrant-buildings.png');background-position:center}
.motion-frame:nth-child(3){background-image:url('images/raaga-entrance-concept.png');background-position:center}
.hero:after{background:linear-gradient(90deg,#081e169c,#081e1630 65%,#081e1610),linear-gradient(0deg,#081e1650,transparent 65%)}
.intro-img{background-image:url('images/raaga-entrance-concept.png');background-position:center}
.entrance-caption{position:absolute;bottom:20px;left:20px;max-width:55%;padding:8px 12px;background:#102b22d9;color:#f5f0e8;font-size:.7rem;letter-spacing:.03em}
.approval-badge{display:inline-flex;align-items:center;gap:9px;margin:0 0 20px;padding:8px 14px;border:1px solid #b99a6380;color:#254b3c;background:#b99a6310;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase}
.approval-badge span{color:#9c7c45}
.features{position:relative;overflow:hidden}
.feature-marquee{overflow:hidden;padding-bottom:26px}
.feature-track.is-running{display:flex;width:max-content;animation:stats-flow 32s linear infinite}
.feature-track.is-running .feature-row{display:flex;flex-shrink:0;width:max(100vw,1040px);max-width:none;margin:0;padding-inline:24px}
.feature-track.is-running .feature{flex:1;padding-inline:20px}
.feature-track.is-paused{animation-play-state:paused}
.motion-toggle{position:absolute;right:24px;bottom:10px;border:0;background:transparent;color:inherit;font:inherit;font-size:.65rem;letter-spacing:.08em;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.motion-toggle[hidden]{display:none}
@keyframes stats-flow{to{transform:translateX(-50%)}}
.experience-card{transition:transform .5s ease,box-shadow .5s ease}
.experience.motion-ready .experience-card{animation:arrival-in .9s ease both}
.experience.motion-ready .experience-card:nth-child(2){animation-delay:.16s}
.experience.motion-ready .experience-card:nth-child(3){animation-delay:.32s}
.experience-card:hover{transform:translateY(-7px);box-shadow:0 20px 40px #132c2224}
@keyframes arrival-in{from{opacity:.65;translate:0 22px}to{opacity:1;translate:0 0}}
.experience-card:before{content:'';position:absolute;inset:-3%;background-image:inherit;background-size:cover;background-position:inherit;z-index:0;animation:experience-image-breathe var(--experience-loop-duration,14s) ease-in-out infinite;animation-play-state:paused;transform-origin:50% 55%;pointer-events:none}
.experience-card:after{z-index:1}
.experience.image-loop-running .experience-card:before{animation-play-state:running}
.experience-card:nth-child(2):before{animation-name:experience-image-drift;animation-delay:-5s}
.experience-card:nth-child(3):before{animation-name:experience-image-breathe;animation-delay:-9s;transform-origin:65% 45%}
@keyframes experience-image-breathe{0%,100%{transform:scale(1.01) translate(-.4%,.4%)}50%{transform:scale(1.09) translate(.8%,-.8%)}}
@keyframes experience-image-drift{0%,100%{transform:scale(1.06) translate(-1.1%,-.4%)}50%{transform:scale(1.01) translate(1.1%,.4%)}}
.experience-motion-controls{display:flex;justify-content:flex-end;margin-top:18px}
.experience-motion-toggle{border:0;background:transparent;color:var(--green);padding:8px 0 8px 16px;font:inherit;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:underline;text-underline-offset:5px;cursor:pointer}
.experience[data-image-motion=""] .experience-card:before{animation:none}
@media(prefers-reduced-motion:reduce){.experience-card:before{animation:none!important;transform:none}.experience-motion-controls{display:none}}
.plot-map{margin:0;min-width:0;padding:12px;background:#ece9de;border:1px solid #b99a6340}
.plot-map a{display:block}
.plot-map img{display:block;width:100%;height:auto;object-fit:contain}
.plot-map figcaption{padding:12px 4px 2px;font-size:.7rem;color:#496052;letter-spacing:.04em}
@media(max-width:600px){.brand-logo{width:150px}.entrance-caption{left:12px;bottom:12px;font-size:.62rem}.plot-map{padding:7px}}
@media(prefers-reduced-motion:reduce){.feature-track.is-running{display:block;width:100%;animation:none}.feature-track.is-running .feature-row{display:grid;width:auto;grid-template-columns:repeat(2,1fr)}.feature-track .feature-row[aria-hidden="true"],.motion-toggle{display:none}.experience.motion-ready .experience-card{animation:none}.experience-card{transition:none}.experience-card:hover{transform:none}}
