.c2 * {
     box-sizing: border-box;
 }

 .c2 {
     font-family: 'DM Sans', sans-serif;
     color: var(--text-dark);
     overflow-x: hidden;
 }

 .c2 img {
     max-width: 100%;
     display: block;
 }

 .c2 a {
     text-decoration: none;
 }

 .c2 ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .c2-label {
     font-size: 10px;
     letter-spacing: 5px;
     text-transform: uppercase;
     font-weight: 500;
     color: var(--teal);
     display: block;
     margin-bottom: 12px;
 }

 .c2-gold-line {
     width: 50px;
     height: 2px;
     background: var(--gold);
     margin: 20px 0 28px;
 }

 .c2 .serif {
     font-family: 'Playfair Display', serif;
 }

 .breadcrumb-nav-wrap {
     padding: 162px 0;
     background-position: center !important;
     background-repeat: no-repeat !important;
     background-size: cover !important;
 }

 /* ── 1. HERO ──────────────────────────────────────────────── */
 .c2-hero {
     position: relative;
     min-height: 90vh;
     display: grid;
     grid-template-columns: 1fr 1fr;
     overflow: hidden;
 }

 /* Right panel content first (opposite of casa-1) */
 .c2-hero__content {
     background: var(--teal-dark);
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding: 70px 48px 33px;
     position: relative;
     overflow: hidden;
     order: -1;
 }

 .c2-hero__content::before {
     content: '';
     position: absolute;
     top: -80px;
     left: -80px;
     width: 360px;
     height: 360px;
     background: radial-gradient(circle, rgba(201, 160, 88, 0.12), transparent 70%);
     border-radius: 50%;
 }

 .c2-hero__badge {
     display: inline-block;
     /* border: 1px solid rgba(201, 160, 88, 0.45); */
     color: var(--bs-body-bg);
     font-size: 14px;
     letter-spacing: 5px;
     text-transform: uppercase;
     padding: 7px 20px;
     /* margin-bottom: 28px; */
     font-weight: 500;
     align-self: flex-start;
 }

 .c2-hero__title {
     font-family: 'Playfair Display', serif;
     font-size: clamp(50px, 6vw, 88px);
     font-weight: 700;
     line-height: 0.92;
     color: #fff;
     margin-bottom: 6px;
 }

 .c2-hero__title em {
     font-style: italic;
     color: var(--gold);
 }

 .c2-hero__tagline {
     font-size: 11px !important;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: var(--bs-body-bg);
     margin: 18px 0 32px;
     font-weight: 700;
 }

 .c2-hero__content p {
     color: var(--white);
     font-size: 19px;
     text-align: justify;
 }

 .c2-hero__divider {
     width: 50px;
     height: 1px;
     background: var(--gold);
     margin-bottom: 28px;
 }

 .c2-hero__specs {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
     margin-bottom: 36px;
 }

 .c2-hero__spec {
     background: rgba(255, 255, 255, 0.08);
     border: 1px solid rgba(255, 255, 255, 0.15);
     color: rgba(255, 255, 255, 0.8);
     font-size: 11px;
     letter-spacing: 1px;
     padding: 7px 16px;
     font-weight: 300;
 }

 .c2-hero__cta {
     display: inline-flex;
     align-items: center;
     gap: 12px;
     padding: 16px 40px;
     background: var(--gold);
     color: var(--brown);
     font-size: 10px;
     letter-spacing: 3px;
     text-transform: uppercase;
     font-weight: 500;
     align-self: flex-start;
     transition: background 0.3s, color 0.3s, transform 0.3s;
 }

 .c2-hero__cta:hover {
     background: var(--white);
     color: var(--teal-dark);
     transform: translateY(-2px);
 }

 /* Gallery side */
 .c2-hero__gallery {
     position: relative;
     overflow: hidden;
     background: var(--brown);
     display: flex;
     flex-direction: column;
 }

 .c2-hero__main-img {
     flex: 1;
     width: 100%;
     object-fit: cover;
     display: block;
     min-height: 0;
     transition: opacity 0.45s ease;
 }

 .c2-hero__main-img.switching {
     opacity: 0;
 }

 .c2-hero__thumbs {
     display: flex;
     gap: 2px;
     padding: 6px;
     background: rgba(20, 50, 45, 0.65);
     flex-shrink: 0;
 }

 .c2-hero__thumb {
     flex: 1;
     height: 72px;
     overflow: hidden;
     cursor: pointer;
     border: 2px solid transparent;
     transition: border-color 0.3s;
 }

 .c2-hero__thumb img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     filter: brightness(0.72) saturate(0.85);
     transition: transform 0.4s, filter 0.3s;
 }

 .c2-hero__thumb:hover img {
     transform: scale(1.1);
     filter: brightness(1) saturate(1.1);
 }

 .c2-hero__thumb.active {
     border-color: var(--gold);
 }

 .c2-hero__thumb.active img {
     filter: brightness(1) saturate(1.1);
 }

 /* ── 2. OVERVIEW + VIDEO ──────────────────────────────────── */
 .c2-overview {
     display: grid;
     grid-template-columns: 1fr 1fr;
     min-height: 55vh;
 }

 .c2-overview__text {
     background: var(--off-white);
     padding: 72px 64px;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .c2-overview__text h2 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(28px, 3vw, 44px);
     font-weight: 600;
     color: var(--brown);
     line-height: 1.15;
     margin-bottom: 0;
 }

 .c2-overview__text h2 em {
     font-style: italic;
     color: var(--teal);
 }

 .c2-overview__text p {
     font-size: 14px;
     line-height: 1.9;
     color: var(--text-mid);
     font-weight: 300;
     margin-bottom: 14px;
 }

 .c2-overview__video {
     position: relative;
     background: var(--brown);
     overflow: hidden;
     min-height: 380px;
 }

 .c2-overview__video iframe {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     border: none;
 }

 .c2-overview__video-label {
     position: absolute;
     top: 24px;
     right: 24px;
     z-index: 3;
     background: rgba(201, 160, 88, 0.9);
     color: var(--brown);
     font-size: 10px;
     letter-spacing: 3px;
     text-transform: uppercase;
     padding: 7px 18px;
     font-weight: 500;
 }

 /* ── 3. STATS BAR ─────────────────────────────────────────── */
 .c2-stats {
     background: var(--brown);
     display: grid;
     grid-template-columns: repeat(5, 1fr);
 }

 .c2-stat {
     padding: 36px 20px;
     text-align: center;
     border-right: 1px solid rgba(255, 255, 255, 0.08);
 }

 .c2-stat:last-child {
     border-right: none;
 }

 .c2-stat__val {
     font-family: 'Playfair Display', serif;
     font-size: 38px;
     font-weight: 700;
     color: var(--gold);
     display: block;
 }

 .c2-stat__key {
     font-size: 9px;
     letter-spacing: 3px;
     text-transform: uppercase;
     color: rgba(255, 255, 255, 0.55);
     margin-top: 6px;
     display: block;
 }

 /* ── 4. AMENITIES ─────────────────────────────────────────── */
 .c2-amenities {
     padding: 90px 8%;
     background: var(--cream);
 }

 .c2-amenities__header {
     text-align: center;
     margin-bottom: 60px;
 }

 .c2-amenities__header h2 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(28px, 3vw, 44px);
     color: var(--brown);
     font-weight: 600;
 }

 .c2-amenities__header h2 em {
     font-style: italic;
     color: var(--teal);
 }

 .c2-amenities__cols {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 3px;
     margin-bottom: 3px;
 }

 .c2-amenities__col {
     background: var(--white);
     padding: 44px 48px;
 }

 .c2-amenities__col-title {
     font-family: 'Playfair Display', serif;
     font-size: 18px;
     color: var(--teal);
     font-weight: 600;
     margin-bottom: 20px;
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .c2-amenities__col-title svg {
     width: 20px;
     height: 20px;
     flex-shrink: 0;
 }

 .c2-amenities__col li {
     font-size: 13.5px;
     line-height: 1.7;
     color: var(--text-mid);
     font-weight: 300;
     padding: 7px 0;
     border-bottom: 1px solid var(--cream);
     display: flex;
     align-items: flex-start;
     gap: 10px;
 }

 .c2-amenities__col li::before {
     content: '';
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: var(--gold);
     margin-top: 8px;
     flex-shrink: 0;
 }

 .c2-amenities__desc {
     background: var(--white);
     padding: 44px 52px;
     border-left: 4px solid var(--teal);
     font-size: 15px;
     line-height: 1.9;
     color: var(--text-mid);
     font-weight: 300;
 }

 /* ── 5. BEDROOMS ──────────────────────────────────────────── */
 .c2-bedrooms {
     padding: 90px 8%;
     background: var(--white);
 }

 .c2-bedrooms__header {
     text-align: center;
     margin-bottom: 70px;
 }

 .c2-bedrooms__header h2 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(30px, 3vw, 48px);
     color: var(--brown);
     font-weight: 600;
 }

 .c2-bedrooms__header h2 em {
     font-style: italic;
     color: var(--teal);
 }

 .c2-bedroom {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 3px;
     margin-bottom: 3px;
     min-height: 420px;
     margin-bottom: 31px;
 }

 /* Alternate: odd rows = gallery left, even rows = gallery right */
 .c2-bedroom:nth-child(even) {
     direction: rtl;
 }

 .c2-bedroom:nth-child(even)>* {
     direction: ltr;
 }

 .c2-bedroom__gallery {
     position: relative;
     overflow: hidden;
     background: var(--brown);
     display: flex;
     flex-direction: column;
 }

 .c2-bedroom__main-wrap {
     flex: 1;
     overflow: hidden;
     position: relative;
 }

 .c2-bedroom__main-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     transition: opacity 0.4s ease;
     min-height: 320px;
 }

 .c2-bedroom__main-img.switching {
     opacity: 0;
 }

 .c2-bedroom__thumbs {
     display: flex;
     gap: 2px;
     padding: 4px;
     background: rgba(20, 50, 45, 0.65);
 }

 .c2-bedroom__thumb {
     flex: 1;
     height: 60px;
     overflow: hidden;
     cursor: pointer;
     border: 2px solid transparent;
     transition: border-color 0.3s;
 }

 .c2-bedroom__thumb img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     filter: brightness(0.7) saturate(0.8);
     transition: transform 0.4s, filter 0.3s;
 }

 .c2-bedroom__thumb:hover img {
     transform: scale(1.12);
     filter: brightness(1) saturate(1.1);
 }

 .c2-bedroom__thumb.active {
     border-color: var(--gold);
 }

 .c2-bedroom__thumb.active img {
     filter: brightness(1) saturate(1.1);
 }

 .c2-bedroom__content {
     background: var(--off-white);
     padding: 56px 52px;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .c2-bedroom__num {
     font-family: 'Playfair Display', serif;
     font-size: 80px;
     font-weight: 700;
     line-height: 1;
     color: rgba(74, 155, 140, 0.12);
     margin-bottom: -16px;
 }

 .c2-bedroom__title {
     font-family: 'Playfair Display', serif;
     font-size: clamp(22px, 2.5vw, 32px);
     color: var(--brown);
     font-weight: 600;
     margin-bottom: 6px;
     line-height: 1.2;
 }

 .c2-bedroom__title em {
     font-style: italic;
     color: var(--teal);
 }

 .c2-bedroom__divider {
     width: 40px;
     height: 2px;
     background: var(--gold);
     margin: 18px 0 22px;
 }

 .c2-bedroom__desc {
     font-size: 14px;
     line-height: 1.85;
     color: var(--text-mid);
     font-weight: 300;
     margin-bottom: 28px;
 }

 .c2-bedroom__features {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 8px;
 }

 .c2-bedroom__feature {
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 12.5px;
     color: var(--text-mid);
     font-weight: 300;
 }

 .c2-bedroom__feature::before {
     content: '';
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: var(--teal);
     flex-shrink: 0;
 }

 /* Caretaker note card */
 .c2-caretaker {
     margin-top: 3px;
     background: var(--cream);
     border-left: 4px solid var(--gold);
     padding: 36px 52px;
     display: flex;
     align-items: flex-start;
     gap: 24px;
 }

 .c2-caretaker__icon {
     color: var(--gold);
     flex-shrink: 0;
     margin-top: 4px;
 }

 .c2-caretaker__icon svg {
     width: 28px;
     height: 28px;
 }

 .c2-caretaker__title {
     font-family: 'Playfair Display', serif;
     font-size: 20px;
     color: var(--brown);
     font-weight: 600;
     margin-bottom: 8px;
 }

 .c2-caretaker__desc {
     font-size: 13.5px;
     line-height: 1.8;
     color: var(--text-mid);
     font-weight: 300;
 }

 /* ── 6. DETAILS + PDF ─────────────────────────────────────── */
 .c2-details {
     background: var(--cream);
     padding: 90px 8%;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 60px;
     align-items: start;
 }

 .c2-details__heading {
     font-family: 'Playfair Display', serif;
     font-size: clamp(28px, 3vw, 42px);
     color: var(--brown);
     font-weight: 600;
 }

 .c2-details__heading em {
     font-style: italic;
     color: var(--teal);
 }

 .c2-details__list {
     margin-top: 28px;
 }

 .c2-details__list li {
     font-size: 13.5px;
     line-height: 1.7;
     color: var(--text-mid);
     font-weight: 300;
     padding: 9px 0;
     border-bottom: 1px solid var(--cream-dk);
     display: flex;
     gap: 12px;
     align-items: flex-start;
 }

 .c2-details__list li::before {
     content: '';
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: var(--gold);
     margin-top: 8px;
     flex-shrink: 0;
 }

 .c2-details__list li strong {
     color: var(--brown-mid);
     font-weight: 500;
 }

 .c2-details__pdf {
     background: var(--white);
     padding: 40px 44px;
     border-top: 3px solid var(--teal);
     display: flex;
     flex-direction: column;
     gap: 18px;
 }

 .c2-details__pdf-title {
     font-family: 'Playfair Display', serif;
     font-size: 22px;
     color: var(--brown);
     font-weight: 600;
 }

 .c2-details__pdf-meta {
     font-size: 12px;
     color: var(--text-mid);
     font-weight: 300;
     line-height: 1.6;
 }

 .c2-details__pdf-btn {
     display: inline-flex;
     align-items: center;
     gap: 12px;
     padding: 14px 32px;
     background: var(--teal);
     color: #fff;
     font-size: 10px;
     letter-spacing: 3px;
     text-transform: uppercase;
     font-weight: 500;
     align-self: flex-start;
     transition: background 0.3s, transform 0.3s;
     margin-top: 20px;
 }

 .c2-details__pdf-btn:hover {
     background: var(--teal-dark);
     transform: translateY(-2px);
 }

 .c2-details__pdf-btn svg {
     width: 16px;
     height: 16px;
 }

 /* ── 7. CTA ───────────────────────────────────────────────── */
 .c2-cta {
     text-align: center;
     padding: 100px 8%;
     background: var(--teal-dark);
     position: relative;
     overflow: hidden;
 }

 .c2-cta::before {
     content: 'OCEANA';
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     font-family: 'Playfair Display', serif;
     font-size: 200px;
     font-weight: 700;
     color: rgba(255, 255, 255, 0.04);
     white-space: nowrap;
     pointer-events: none;
 }

 .c2-cta__label {
     font-size: 10px;
     letter-spacing: 5px;
     text-transform: uppercase;
     color: var(--gold);
     display: block;
     margin-bottom: 18px;
     font-weight: 500;
 }

 .c2-cta h2 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(32px, 3.5vw, 52px);
     color: #fff;
     font-weight: 600;
     margin-bottom: 0;
 }

 .c2-cta h2 em {
     font-style: italic;
     color: var(--gold);
 }

 .c2-cta__divider {
     width: 50px;
     height: 1px;
     background: var(--gold);
     margin: 28px auto;
 }

 .c2-cta__btn {
     display: inline-flex;
     align-items: center;
     gap: 14px;
     padding: 18px 52px;
     background: var(--gold);
     color: var(--brown);
     font-size: 10px;
     letter-spacing: 3px;
     text-transform: uppercase;
     font-weight: 500;
     transition: background 0.3s, transform 0.3s;
 }

 .c2-cta__btn:hover {
     background: #fff;
     color: var(--teal-dark);
     transform: translateY(-2px);
 }

 /* ── 8. NEED MORE ROOMS ───────────────────────────────────── */
 .c2-more {
     padding: 90px 8%;
     background: var(--off-white);
     text-align: center;
 }

 .c2-more h2 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(28px, 3vw, 44px);
     color: var(--brown);
     font-weight: 600;
     margin-bottom: 12px;
 }

 .c2-more h2 em {
     font-style: italic;
     color: var(--teal);
 }

 .c2-more p {
     font-size: 15px;
     color: var(--text-mid);
     font-weight: 300;
     line-height: 1.8;
     max-width: 560px;
     margin: 0 auto 56px;
 }

 .c2-more__grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 3px;

     margin: 0 auto;
 }

 .c2-more-card {
     position: relative;
     overflow: hidden;
     min-height: 300px;
     display: flex;
     align-items: flex-end;
 }

 .c2-more-card img {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     filter: brightness(0.6);
     transition: transform 0.6s, filter 0.4s;
 }

 .c2-more-card:hover img {
     transform: scale(1.06);
     filter: brightness(0.45);
 }

 .c2-more-card__content {
     position: relative;
     z-index: 2;
     padding: 36px;
     width: 100%;
     background: #ffffff38;
 }

 .c2-more-card__title {
     font-family: 'Playfair Display', serif;
     font-size: 22px;
     color: #fff;
     font-weight: 600;
     margin-bottom: 10px;
 }

 .c2-more-card__sub {
     font-size: 10px;
     letter-spacing: 3px;
     text-transform: uppercase;
     color: var(--gold);
     font-weight: 400;
     margin-bottom: 18px;
 }

 .c2-more-card__btn {
     display: inline-block;
     padding: 10px 26px;
     border: 1px solid rgba(201, 160, 88, 0.6);
     color: var(--gold);
     font-size: 9px;
     letter-spacing: 2px;
     text-transform: uppercase;
     transition: background 0.3s, color 0.3s;
 }

 .c2-more-card__btn:hover {
     background: var(--gold);
     color: var(--brown);
 }

 /* ── 9. CONTACT STRIP ─────────────────────────────────────── */
 .c2-contact {
     background: var(--brown);
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     border-top: 2px solid var(--gold);
 }

 .c2-contact-item {
     padding: 48px 36px;
     border-right: 1px solid rgba(255, 255, 255, 0.07);
 }

 .c2-contact-item:last-child {
     border-right: none;
 }

 .c2-contact-item__label {
     font-size: 9px;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 10px;
     display: block;
 }

 .c2-contact-item__val {
     font-family: 'Playfair Display', serif;
     font-size: 17px;
     color: #fff;
 }

 .c2-contact-item__val a {
     color: #fff;
     transition: color 0.2s;
 }

 .c2-contact-item__val a:hover {
     color: var(--gold);
 }

 /* ── RESPONSIVE ───────────────────────────────────────────── */
 @media (max-width: 960px) {
     .c2-hero {
         grid-template-columns: 1fr;
     }

     .c2-hero__content {
         order: 0;
         padding: 52px 36px 60px;
     }

     .c2-hero__gallery {
         min-height: 55vw;
     }

     .c2-overview {
         grid-template-columns: 1fr;
     }

     .c2-overview__video {
         min-height: 52vw;
     }

     .c2-overview__text {
         padding: 52px 36px;
     }

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

     .c2-amenities__cols {
         grid-template-columns: 1fr;
     }

     .c2-bedroom {
         grid-template-columns: 1fr;
     }

     .c2-bedroom:nth-child(even) {
         direction: ltr;
     }

     .c2-bedroom__content {
         padding: 44px 36px;
     }

     .c2-details {
         grid-template-columns: 1fr;
         gap: 40px;
     }

     .c2-more__grid {
         grid-template-columns: 1fr;
     }

     .c2-contact {
         grid-template-columns: 1fr 1fr;
     }

     .c2-contact-item:nth-child(2) {
         border-right: none;
     }

     .c2-contact-item:nth-child(n+3) {
         border-top: 1px solid rgba(255, 255, 255, 0.07);
     }
 }

 @media (max-width: 600px) {
     .c2-stats {
         grid-template-columns: 1fr 1fr;
     }

     .c2-hero__thumb {
         height: 52px;
     }

     .c2-bedroom__thumb {
         height: 48px;
     }

     .c2-bedroom__features {
         grid-template-columns: 1fr;
     }

     .c2-contact {
         grid-template-columns: 1fr;
     }

     .c2-caretaker {
         flex-direction: column;
         gap: 14px;
         padding: 30px 36px;
     }
 }