/* Project page components (Trishla City / Trishla Little India) */
#introduction, #section-overview, #features, #location, #faq { padding-top: 90px; padding-bottom: 90px; }
#amenities, #why-choose { padding-top: 90px; padding-bottom: 90px; }
#photo-gallery { padding-top: 50px; padding-bottom: 20px; }
#location-map { padding-top: 90px; padding-bottom: 90px; }
#section-hero .subtitle { color: #fff; background: rgba(6,27,14,.65); border: 1px solid #d4af37; }
.p-note { font-size: .85rem; opacity: .7; }

.p-card { height: 100%; padding: 32px 28px; border: 1px solid rgba(128,128,128,.25); background: rgba(255,255,255,.03); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.p-card:hover { transform: translateY(-6px); border-color: #d4af37; box-shadow: 0 18px 40px rgba(0,0,0,.18); }
.p-card h3 { margin: 10px 0 10px; font-size: 1.2rem; }
.p-card p { margin: 0; font-size: .95rem; line-height: 1.7; }
.p-num { display: inline-block; font-size: .8rem; font-weight: 700; letter-spacing: .2em; color: #d4af37; }
.p-light .p-card { background: #fff; border-color: rgba(27,48,34,.14); }

.p-fig { position: relative; margin: 0; display: block; }
.p-cover { height: 300px; object-fit: cover; transition: transform .6s ease; }
.p-fig:hover .p-cover { transform: scale(1.06); }
.p-fig figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 18px 14px; color: #fff; font-size: .85rem; font-weight: 600; letter-spacing: .06em; background: linear-gradient(transparent, rgba(0,0,0,.72)); }

.p-table-wrap { overflow-x: auto; }
.p-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.p-table th, .p-table td { padding: 14px 18px; border-bottom: 1px solid rgba(128,128,128,.25); text-align: left; vertical-align: top; }
.p-table th { width: 32%; font-weight: 700; }
.p-table-3 th { width: auto; }
.p-table thead th { text-transform: uppercase; font-size: .75rem; letter-spacing: .12em; color: #735c00; }

.map-wrap { height: 100%; min-height: 460px; border: 1px solid rgba(27,48,34,.16); overflow: hidden; }
.map-wrap iframe { display: block; width: 100%; height: 100%; min-height: 460px; }

.cta-band { position: relative; padding: 130px 0; background-size: cover; background-position: center; }
.cta-shade { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(6,27,14,.86), rgba(6,27,14,.55)); }

.p-faq { border-bottom: 1px solid rgba(128,128,128,.3); padding: 4px 0; text-align: left; }
.p-faq summary { cursor: pointer; list-style: none; padding: 20px 40px 20px 0; position: relative; font-size: 1.1rem; font-weight: 600; }
.p-faq summary::-webkit-details-marker { display: none; }
.p-faq summary::after { content: "+"; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-size: 1.6rem; color: #d4af37; transition: transform .25s ease; }
.p-faq[open] summary::after { content: "\2212"; }
.p-faq p { margin: 0 0 20px; line-height: 1.75; }

.footer-logo { width: 120px; height: 120px; object-fit: contain; margin: 0 auto; }
footer .subfooter a { margin: 0 4px; }

@media (max-width: 767px) {
  #introduction, #section-overview, #features, #location, #faq, #amenities, #why-choose, #location-map { padding-top: 60px; padding-bottom: 60px; }
  #photo-gallery { padding-top: 40px; padding-bottom: 10px; }
  .p-cover { height: 240px; }
  .cta-band { padding: 90px 0; }
  .p-table th, .p-table td { padding: 10px 12px; }
}

/* fixed-height image tiles (guard against theme img rules) */
.p-fig { height: 300px; overflow: hidden; }
.p-fig img.p-cover { display: block; width: 100% !important; height: 300px !important; max-width: none; object-fit: cover; }
@media (max-width: 767px) { .p-fig { height: 240px; } .p-fig img.p-cover { height: 240px !important; } }

/* ---------- Amenity cards ---------- */
.am-grid > [class*="col-"] { display: flex; }
.am-card { position: relative; display: flex; flex-direction: column; width: 100%; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.12); overflow: hidden; transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, border-color .45s ease; }
.am-card::before { content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 0; background: linear-gradient(90deg, #d4af37, #ffe088); z-index: 3; transition: width .5s ease; }
.am-card:hover { transform: translateY(-10px); border-color: rgba(212,175,55,.6); box-shadow: 0 28px 50px rgba(0,0,0,.35); }
.am-card:hover::before { width: 100%; }
.am-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #0d241b; }
.am-media img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; transform: scale(1.001); transition: transform 1s cubic-bezier(.2,.7,.2,1), filter .6s ease; }
.am-card:hover .am-media img { transform: scale(1.09); filter: saturate(1.15) brightness(1.04); }
.am-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,27,14,0) 60%, rgba(6,27,14,.5)); pointer-events: none; }
.am-media::before { content: ""; position: absolute; top: 0; left: -80%; width: 50%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent); transform: skewX(-18deg); z-index: 2; transition: left .9s ease; pointer-events: none; }
.am-card:hover .am-media::before { left: 130%; }
.am-num { position: absolute; top: 14px; left: 14px; z-index: 3; padding: 5px 11px; font-size: .72rem; font-weight: 800; letter-spacing: .18em; color: #061b0e; background: #d4af37; }
.am-body { flex: 1; padding: 26px 26px 30px; text-align: left; border-top: 1px solid rgba(212,175,55,.25); }
.am-body h3 { margin: 0 0 10px; font-size: 1.25rem; color: #fff; }
.am-body p { margin: 0; font-size: .95rem; line-height: 1.7; color: rgba(255,255,255,.72); min-height: 5.1em; }
.am-extra { margin-top: 56px; }
.am-extra h4 { margin: 0 0 18px; font-size: .78rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #d4af37; }
.am-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0; padding: 0; list-style: none; }
.am-chips li { padding: 9px 18px; font-size: .85rem; font-weight: 600; color: #fff; border: 1px solid rgba(212,175,55,.45); background: rgba(212,175,55,.08); transition: background .3s ease, color .3s ease, transform .3s ease; }
.am-chips li:hover { background: #d4af37; color: #061b0e; transform: translateY(-3px); }
@media (prefers-reduced-motion: reduce) { .am-card, .am-media img, .am-media::before, .am-card::before { transition: none; } }

/* ---------- Counter band (Arkio-style) ---------- */
.st-band { position: relative; padding: 90px 0 60px; background: #0b2418; overflow: hidden; }
.st-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 15% 20%, rgba(212,175,55,.14), transparent 45%), radial-gradient(circle at 85% 90%, rgba(212,175,55,.09), transparent 40%); pointer-events: none; }
.st-band .container { position: relative; z-index: 2; }
.st-col { position: relative; padding: 10px 24px; text-align: center; }
.st-col + .st-col::before { content: ""; position: absolute; left: 0; top: 12%; height: 76%; width: 1px; background: rgba(255,255,255,.14); }
.st-value { display: inline-flex; align-items: flex-start; justify-content: center; gap: 4px; font-family: "Playfair Display", Georgia, serif; font-weight: 500; font-size: clamp(3.4rem, 7vw, 6.2rem); line-height: 1; color: #fff; letter-spacing: -.01em; }
.st-value .st-num { background: linear-gradient(180deg, #fff 30%, #ffe088); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.st-suf { margin-top: .22em; font-size: .38em; font-weight: 600; color: #d4af37; letter-spacing: .04em; }
.st-line { width: 46px; height: 2px; margin: 20px auto 16px; background: #d4af37; transition: width .5s ease; }
.st-item:hover .st-line { width: 90px; }
.st-label { font-size: .82rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.75); }
.st-note { margin: 46px 0 0; font-size: .8rem; color: rgba(255,255,255,.45); }
@media (max-width: 991px) { .st-col { padding: 26px 12px; } .st-col:nth-child(3)::before { display: none; } }
@media (max-width: 575px) { .st-band { padding: 60px 0 40px; } .st-label { font-size: .7rem; letter-spacing: .12em; } }

/* ---------- Nearby location cards ---------- */
.nb-section { background: linear-gradient(180deg, #faf8f3, #f2efe6); }
.nb-grid > [class*="col-"] { display: flex; }
.nb-card { position: relative; display: flex; align-items: center; gap: 18px; width: 100%; padding: 24px 22px; background: #fff; border: 1px solid rgba(27,48,34,.12); border-left: 4px solid #d4af37; box-shadow: 0 12px 28px rgba(27,48,34,.06); transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; overflow: hidden; }
.nb-card::after { content: ""; position: absolute; right: -40px; bottom: -40px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(212,175,55,.16), transparent 70%); transition: transform .5s ease; }
.nb-card:hover { transform: translateY(-6px); box-shadow: 0 22px 44px rgba(27,48,34,.14); border-left-color: #1b3022; }
.nb-card:hover::after { transform: scale(1.8); }
.nb-icon { flex: 0 0 56px; width: 56px; height: 56px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #d4af37; background: #1b3022; transition: transform .4s ease, background .4s ease, color .4s ease; }
.nb-card:hover .nb-icon { transform: rotate(-8deg) scale(1.08); background: #d4af37; color: #1b3022; }
.nb-text { flex: 1; min-width: 0; }
.nb-type { display: block; margin-bottom: 4px; font-size: .68rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #735c00; }
.nb-text h3 { margin: 0; font-size: 1.02rem; line-height: 1.35; color: #1b3022; }
.nb-dist { flex: 0 0 auto; max-width: 42%; padding: 8px 12px; font-size: .8rem; font-weight: 700; line-height: 1.3; text-align: center; color: #1b3022; background: rgba(212,175,55,.18); border: 1px solid rgba(212,175,55,.5); }
@media (max-width: 575px) { .nb-card { flex-wrap: wrap; } .nb-dist { max-width: none; margin-left: 74px; } }
.nb-grid { justify-content: center; }

/* ---------- Nearby locations as event-style cards ---------- */
.ev-section { position: relative; background: #f6f3ec; }
.ev-head { max-width: 760px; margin: 0 auto 54px; }
.ev-grid { justify-content: center; }
.ev-grid > [class*="col-"] { display: flex; }
.ev-card { position: relative; width: 100%; padding: 44px 44px 40px; background: #fff; border: 1px solid rgba(27,48,34,.12); overflow: hidden; isolation: isolate; transition: transform .4s ease, box-shadow .4s ease, border-color .4s ease; }
.ev-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(135deg, #1b3022, #0b2418); transform: translateY(101%); transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.ev-card:hover { transform: translateY(-6px); border-color: #1b3022; box-shadow: 0 26px 50px rgba(27,48,34,.22); }
.ev-card:hover::before { transform: translateY(0); }
.ev-meta { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.ev-dist { color: #735c00; transition: color .4s ease; }
.ev-sep { width: 34px; height: 1px; background: #d4af37; }
.ev-type { color: #646a62; transition: color .4s ease; }
.ev-title { margin: 0 0 30px; font-family: "Playfair Display", Georgia, serif; font-weight: 600; font-size: clamp(1.5rem, 2.4vw, 2.1rem); line-height: 1.2; color: #1b3022; max-width: 85%; transition: color .4s ease; }
.ev-link { display: inline-flex; align-items: center; gap: 10px; font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #1b3022; padding-bottom: 6px; border-bottom: 2px solid #d4af37; transition: color .4s ease, gap .3s ease; }
.ev-link span { transition: transform .3s ease; }
.ev-link:hover { gap: 16px; }
.ev-index { position: absolute; right: 30px; top: 18px; font-family: "Playfair Display", Georgia, serif; font-size: 4.6rem; line-height: 1; color: rgba(27,48,34,.07); transition: color .4s ease; }
.ev-card:hover .ev-dist { color: #ffe088; }
.ev-card:hover .ev-type { color: rgba(255,255,255,.7); }
.ev-card:hover .ev-title, .ev-card:hover .ev-link { color: #fff; }
.ev-card:hover .ev-index { color: rgba(255,255,255,.1); }
@media (max-width: 575px) { .ev-card { padding: 34px 26px 30px; } .ev-title { max-width: 100%; } .ev-index { font-size: 3.4rem; } }

/* ---------- Hero sized to the viewport ---------- */
#section-hero { height: 100vh; height: 100svh; min-height: 540px; }
#section-hero .hero-fit { height: 100%; min-height: 0; }
#section-hero .hero-fit .swiper { height: 100%; }
#section-hero > .abs { bottom: 0; padding: 0 0 clamp(56px, 11vh, 120px); background: linear-gradient(0deg, rgba(6,27,14,.72), rgba(6,27,14,0)); padding-top: 120px; }
#section-hero .hero-title { margin: 0 0 clamp(10px, 2vh, 22px); font-size: clamp(2.4rem, 1.2rem + 6.2vw, 7rem); line-height: 1.02; letter-spacing: .01em; word-break: break-word; }
#section-hero .hero-address { margin: 0 0 clamp(16px, 3vh, 30px); max-width: 640px; font-size: clamp(.95rem, .8rem + .7vw, 1.4rem); font-weight: 500; line-height: 1.4; }
#section-hero .subtitle { margin-bottom: clamp(8px, 1.6vh, 16px) !important; }
#section-hero .btn-main { white-space: nowrap; }
@media (max-height: 640px) and (orientation: landscape) {
  #section-hero > .abs { padding-top: 60px; padding-bottom: 36px; }
  #section-hero .hero-title { font-size: clamp(2rem, 6vw, 3.4rem); }
  #section-hero .hero-address { margin-bottom: 12px; }
}
@media (max-width: 575px) {
  #section-hero > .abs { padding-bottom: 64px; }
  #section-hero .btn-main { flex: 1 1 100%; text-align: center; }
  #section-hero .d-flex.flex-wrap { gap: 10px !important; }
}

/* ---------- Introduction split layout ---------- */
.intro-split { background: #fff; overflow: hidden; }
.intro-media { position: relative; padding: 0 26px 26px 0; }
.intro-frame { position: absolute; right: 0; bottom: 0; width: 82%; height: 82%; border: 2px solid #d4af37; z-index: 0; }
.intro-photo { position: relative; z-index: 1; overflow: hidden; box-shadow: 0 30px 60px rgba(27,48,34,.22); aspect-ratio: 4 / 4.4; background: #e9e5da; }
.intro-photo img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.intro-media:hover .intro-photo img { transform: scale(1.06); }
.intro-badge { position: absolute; left: -18px; bottom: 56px; z-index: 2; padding: 20px 26px; min-width: 190px; color: #fff; background: linear-gradient(135deg, #1b3022, #0b2418); border-left: 4px solid #d4af37; box-shadow: 0 18px 40px rgba(6,27,14,.35); }
.intro-badge strong { display: block; font-family: "Playfair Display", Georgia, serif; font-size: 1.9rem; line-height: 1.1; color: #ffe088; }
.intro-badge span { display: block; margin-top: 4px; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.8); }
.intro-copy { padding-left: 24px; }
.intro-copy h2 { margin-bottom: 26px; font-size: clamp(1.9rem, 3.2vw, 3rem); line-height: 1.15; }
.intro-copy p { font-size: 1.02rem; line-height: 1.85; color: #4b524a; }
.intro-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 28px; margin-top: 34px; padding-top: 30px; border-top: 1px solid rgba(27,48,34,.14); }
.intro-call { font-size: .92rem; color: #4b524a; text-decoration: none; }
.intro-call strong { color: #1b3022; border-bottom: 2px solid #d4af37; transition: color .3s ease; }
.intro-call:hover strong { color: #735c00; }
@media (max-width: 991px) { .intro-copy { padding-left: 0; } .intro-badge { left: 10px; } }
@media (max-width: 575px) { .intro-media { padding: 0 14px 14px 0; } .intro-badge { bottom: 34px; padding: 14px 18px; min-width: 0; } .intro-badge strong { font-size: 1.4rem; } .intro-actions .btn-main { width: 100%; text-align: center; } }

/* ---------- About: text + 4-image collage ---------- */
.ab-section { background: linear-gradient(180deg, #ffffff, #f7f4ec); overflow: hidden; }
.ab-copy p { font-size: 1.02rem; line-height: 1.85; color: #4b524a; }
.ab-copy h2 { font-size: clamp(1.9rem, 3.2vw, 3rem); line-height: 1.15; margin-bottom: 26px; }
.ab-collage { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.ab-col { display: flex; flex-direction: column; gap: 20px; }
.ab-col-b { margin-top: 0; }
.ab-tile { position: relative; margin: 0; overflow: hidden; background: #e9e5da; box-shadow: 0 20px 44px rgba(27,48,34,.18); isolation: isolate; }
.ab-t1, .ab-t2, .ab-t3, .ab-t4 { aspect-ratio: 4 / 3; }
.ab-tile img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; transform: scale(1.001); transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .6s ease; }
.ab-tile:hover img { transform: scale(1.1); filter: saturate(1.15) brightness(1.05); }
.ab-tile::before { content: ""; position: absolute; top: 0; left: -90%; width: 55%; height: 100%; z-index: 3; background: linear-gradient(100deg, transparent, rgba(255,255,255,.32), transparent); transform: skewX(-18deg); transition: left 1s ease; pointer-events: none; }
.ab-tile:hover::before { left: 140%; }
.ab-tile::after { content: ""; position: absolute; inset: 12px; z-index: 2; border: 1px solid rgba(255,224,136,0); transform: scale(1.06); transition: border-color .5s ease, transform .5s ease; pointer-events: none; }
.ab-tile:hover::after { border-color: rgba(255,224,136,.9); transform: scale(1); }
.ab-tile figcaption { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 46px 16px 14px; font-size: .74rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #fff; background: linear-gradient(transparent, rgba(6,27,14,.78)); transform: translateY(8px); opacity: .9; transition: transform .4s ease, opacity .4s ease; }
.ab-tile:hover figcaption { transform: translateY(0); opacity: 1; }

@media (max-width: 575px) { .ab-collage, .ab-col { gap: 12px; } .ab-tile figcaption { font-size: .62rem; padding: 32px 10px 10px; } }

/* ---------- Floor plan tabs ---------- */
.fp-section { position: relative; overflow: hidden; }
.fp-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 85% 8%, rgba(212,175,55,.12), transparent 42%), radial-gradient(circle at 8% 92%, rgba(212,175,55,.08), transparent 40%); pointer-events: none; }
.fp-section .container { position: relative; z-index: 2; }
.fp-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 46px 0 40px; }
.fp-tab { position: relative; display: inline-flex; flex-direction: column; align-items: center; min-width: 118px; padding: 14px 22px 12px; color: rgba(255,255,255,.78); background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.16); cursor: pointer; font-family: inherit; transition: color .3s ease, background .3s ease, border-color .3s ease, transform .3s ease; }
.fp-tab span { font-size: .95rem; font-weight: 800; letter-spacing: .06em; }
.fp-tab small { margin-top: 2px; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; opacity: .75; }
.fp-tab::after { content: ""; position: absolute; left: 0; bottom: -1px; height: 3px; width: 0; background: #d4af37; transition: width .4s ease; }
.fp-tab:hover { color: #fff; border-color: rgba(212,175,55,.6); transform: translateY(-3px); }
.fp-tab.is-on { color: #061b0e; background: #d4af37; border-color: #d4af37; }
.fp-tab.is-on::after { width: 100%; background: #061b0e; }
.fp-tab:focus-visible { outline: 2px solid #ffe088; outline-offset: 3px; }
.fp-panel[hidden] { display: none; }
.fp-panel.is-on { animation: fpIn .6s cubic-bezier(.2,.7,.2,1); }
@keyframes fpIn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.fp-visual { position: relative; padding: 16px; background: #fff; box-shadow: 0 34px 70px rgba(0,0,0,.4); }
.fp-visual::before, .fp-visual::after { content: ""; position: absolute; width: 46px; height: 46px; border: 3px solid #d4af37; pointer-events: none; transition: transform .5s ease; }
.fp-visual::before { top: -10px; left: -10px; border-right: 0; border-bottom: 0; }
.fp-visual::after { right: -10px; bottom: -10px; border-left: 0; border-top: 0; }
.fp-visual:hover::before { transform: translate(-6px, -6px); }
.fp-visual:hover::after { transform: translate(6px, 6px); }
.fp-zoom { position: relative; display: block; overflow: hidden; cursor: zoom-in; }
.fp-zoom img { display: block; width: 100%; height: auto; transition: transform .9s cubic-bezier(.2,.7,.2,1); }
.fp-zoom:hover img { transform: scale(1.06); }
.fp-zoom-tag { position: absolute; right: 12px; bottom: 12px; padding: 7px 14px; font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #061b0e; background: #d4af37; opacity: 0; transform: translateY(8px); transition: opacity .35s ease, transform .35s ease; }
.fp-zoom:hover .fp-zoom-tag { opacity: 1; transform: none; }
.fp-diagram svg { display: block; width: 100%; height: auto; max-height: 460px; }
.fp-cap { margin: 22px 0 0; font-size: .8rem; color: rgba(255,255,255,.55); text-align: center; }
.fp-info { padding-left: 10px; }
.fp-kicker { display: inline-block; margin-bottom: 12px; font-size: .72rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #d4af37; }
.fp-info h3 { margin: 0 0 14px; font-size: clamp(1.6rem, 2.6vw, 2.3rem); color: #fff; }
.fp-info > p { margin: 0 0 24px; line-height: 1.8; color: rgba(255,255,255,.75); }
.fp-facts { list-style: none; margin: 0 0 30px; padding: 0; border-top: 1px solid rgba(255,255,255,.14); }
.fp-facts li { display: flex; justify-content: space-between; gap: 18px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.14); font-size: .92rem; }
.fp-facts li span { color: rgba(255,255,255,.6); }
.fp-facts li strong { color: #fff; text-align: right; font-weight: 700; }
.fp-note { margin-top: 44px; color: rgba(255,255,255,.5) !important; opacity: 1 !important; }
@media (max-width: 991px) { .fp-info { padding-left: 0; } }
@media (max-width: 575px) { .fp-tab { min-width: 46%; padding: 12px 10px; } .fp-visual { padding: 10px; } .fp-facts li { flex-direction: column; gap: 2px; } .fp-facts li strong { text-align: left; } }
@media (prefers-reduced-motion: reduce) { .fp-panel.is-on { animation: none; } }

/* ---------- Curved 3D card gallery ---------- */
.gx-section { position: relative; overflow: hidden; padding-bottom: 60px; background: linear-gradient(180deg, #0b2418, #113a30 55%, #0b2418); }
.gx-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 55%, rgba(212,175,55,.16), transparent 55%); pointer-events: none; }
.gx-stage { position: relative; z-index: 2; height: clamp(360px, 44vw, 560px); margin-top: 10px; perspective: 1500px; perspective-origin: 50% 45%; overflow: hidden; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
.gx-stage.is-drag { cursor: grabbing; }
.gx-track { position: absolute; inset: 0; transform-style: preserve-3d; }
.gx-card { position: absolute; left: 50%; top: 50%; width: clamp(190px, 21vw, 300px); aspect-ratio: 4 / 5; margin: 0; border-radius: 28px; overflow: hidden; background: #fff; border: 6px solid rgba(255,255,255,.96); box-shadow: 0 26px 60px rgba(0,0,0,.45); will-change: transform, opacity; backface-visibility: hidden; cursor: pointer; }
.gx-card img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.gx-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.22), transparent 30%); pointer-events: none; }
.gx-card figcaption { position: absolute; left: 12px; right: 12px; bottom: 12px; padding: 8px 14px; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #1b3022; background: rgba(255,255,255,.9); border-radius: 999px; text-align: center; backdrop-filter: blur(6px); }
.gx-btn { position: absolute; top: 50%; z-index: 5; width: 52px; height: 52px; margin-top: -26px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.3rem; color: #fff; background: rgba(6,27,14,.55); border: 1px solid rgba(255,255,255,.4); border-radius: 50%; cursor: pointer; backdrop-filter: blur(8px); transition: background .3s ease, color .3s ease, transform .3s ease; }
.gx-btn:hover { background: #d4af37; color: #061b0e; transform: scale(1.08); }
.gx-prev { left: clamp(10px, 4vw, 60px); }
.gx-next { right: clamp(10px, 4vw, 60px); }
.gx-caption { position: relative; z-index: 2; margin: 18px 0 0; font-size: .8rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #ffe088; min-height: 1.4em; }
@media (max-width: 575px) { .gx-btn { width: 42px; height: 42px; margin-top: -21px; } .gx-card { border-width: 4px; border-radius: 20px; } }

/* ---------- USP expanding cards: one animated property, fixed inner sizes ---------- */
.us-section { background: #fff; }
.us-wrap { display: grid; gap: 12px; margin-top: 50px; padding: 12px; background: #efeeeb; border-radius: 34px; }
.us-row { container-type: inline-size; display: grid; grid-template-columns: 2.1fr 1fr 1fr; gap: 12px; transition: grid-template-columns .8s cubic-bezier(.22, .9, .3, 1); }
.us-row[data-active="1"] { grid-template-columns: 1fr 2.1fr 1fr; }
.us-row[data-active="2"] { grid-template-columns: 1fr 1fr 2.1fr; }
.us-card { position: relative; min-width: 0; min-height: 340px; padding: 12px; background: #fff; border-radius: 24px; overflow: hidden; cursor: pointer; outline: none; isolation: isolate; transform: translateZ(0); transition: box-shadow .6s ease; }
.us-card.is-active { box-shadow: 0 22px 46px rgba(27,48,34,.12); }
.us-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; height: 100%; width: 21.5cqw; min-width: 165px; padding: 14px 8px 14px 14px; }
.us-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; color: #1b3022; background: linear-gradient(135deg, #ffe088, #d4af37); transition: transform .8s cubic-bezier(.22, .9, .3, 1); }
.us-card.is-active .us-icon { transform: rotate(-8deg) scale(1.08); }
.us-text h3 { margin: 0 0 10px; font-size: 1.35rem; line-height: 1.25; color: #1b1c1a; }
.us-text p { margin: 0; font-size: .95rem; line-height: 1.7; color: #6b6f68; }
.us-img { position: absolute; z-index: 1; top: 12px; right: 12px; bottom: 12px; width: 23cqw; border-radius: 18px; overflow: hidden; background: #e4e0d4; opacity: 0; clip-path: inset(0 0 0 100% round 18px); transition: clip-path .8s cubic-bezier(.22, .9, .3, 1), opacity .5s ease; will-change: clip-path; }
.us-card.is-active .us-img { opacity: 1; clip-path: inset(0 0 0 0 round 18px); }
.us-img img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.14); transition: transform 1.2s cubic-bezier(.22, .9, .3, 1); }
.us-card.is-active .us-img img { transform: scale(1); }
.us-card:focus-visible { box-shadow: 0 0 0 3px #d4af37; }
@media (max-width: 991px) {
  .us-row, .us-row[data-active] { grid-template-columns: 1fr; transition: none; }
  .us-card { min-height: 0; display: flex; flex-direction: column-reverse; }
  .us-copy { width: auto; min-width: 0; height: auto; gap: 26px; }
  .us-img, .us-card.is-active .us-img { position: relative; inset: auto; width: 100%; height: 210px; opacity: 1; clip-path: none; }
  .us-img img { transform: none; }
}
@media (max-width: 575px) { .us-wrap { border-radius: 24px; padding: 8px; gap: 8px; } .us-row { gap: 8px; } }
@media (prefers-reduced-motion: reduce) { .us-row, .us-img, .us-img img, .us-icon { transition: none; } }

/* About: image grid matches text column height (top & bottom aligned) on desktop */
@media (min-width: 992px) {
  #section-overview .row { align-items: stretch !important; }
  #section-overview .row > .col-lg-6:first-child { display: flex; align-items: center; }
  #section-overview .row > .col-lg-6:last-child { display: flex; }
  .ab-collage { flex: 1; height: auto; align-items: stretch; }
  .ab-col { height: 100%; }
  .ab-t1, .ab-t2, .ab-t3, .ab-t4 { aspect-ratio: auto; flex: 1 1 0; min-height: 0; }
  .ab-tile img { position: absolute; inset: 0; }
}

/* ---------- Map popup ---------- */
.map-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(0,0,0,.65); }
.map-modal[hidden] { display: none; }
.map-modal-box { position: relative; width: min(900px, 100%); height: min(600px, 80vh); background: #fff; border-radius: 6px; overflow: hidden; }
.map-modal-box iframe { width: 100%; height: 100%; border: 0; }
.map-modal-close { position: absolute; top: 8px; right: 8px; z-index: 1; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #1b3022; color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }

/* Contact CTA */
.cta-panel { display: grid; grid-template-columns: 1.15fr 1fr; gap: 56px; align-items: center; max-width: 1040px; margin: 0 auto; padding: 56px 60px; text-align: left; background: rgba(8,24,14,.62); border: 1px solid rgba(255,224,136,.28); border-top: 3px solid #d4af37; box-shadow: 0 30px 70px rgba(0,0,0,.35); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.cta-eyebrow { display: inline-block; margin-bottom: 18px; font-size: .74rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #ffe088; }
.cta-copy h2 { margin: 0 0 16px; font-size: clamp(1.7rem, 2.8vw, 2.5rem); line-height: 1.2; color: #fff; }
.cta-copy p { margin: 0; font-size: 1.02rem; line-height: 1.8; color: rgba(255,255,255,.82); }
.cta-actions { display: flex; flex-direction: column; gap: 16px; }
.cta-btn { display: flex; align-items: center; gap: 16px; padding: 18px 22px; text-decoration: none; border: 1px solid transparent; transition: background .3s ease, color .3s ease, border-color .3s ease, transform .3s ease, box-shadow .3s ease; }
.cta-btn:hover { transform: translateY(-2px); }
.cta-ico { flex: 0 0 auto; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; }
.cta-txt { flex: 1 1 auto; display: flex; flex-direction: column; line-height: 1.25; }
.cta-txt small { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .8; }
.cta-txt strong { font-size: 1.18rem; font-weight: 700; letter-spacing: .01em; }
.cta-arrow { flex: 0 0 auto; transition: transform .3s ease; }
.cta-btn:hover .cta-arrow { transform: translateX(5px); }
.cta-btn-primary { background: #d4af37; color: #1b2a1e; box-shadow: 0 14px 30px rgba(212,175,55,.28); }
.cta-btn-primary .cta-ico { background: rgba(27,42,30,.12); }
.cta-btn-primary:hover { background: #e3c14f; color: #1b2a1e; box-shadow: 0 18px 38px rgba(212,175,55,.4); }
.cta-btn-ghost { background: rgba(255,255,255,.04); color: #fff; border-color: rgba(255,255,255,.4); }
.cta-btn-ghost .cta-ico { background: #25d366; color: #fff; }
.cta-btn-ghost:hover { background: rgba(255,255,255,.12); border-color: #fff; color: #fff; }
@media (max-width: 991px) { .cta-panel { grid-template-columns: 1fr; gap: 32px; padding: 40px 32px; } }
@media (max-width: 575px) { .cta-panel { padding: 32px 20px; } .cta-btn { padding: 14px 16px; gap: 12px; } .cta-txt strong { font-size: 1.02rem; } .cta-arrow { display: none; } }

/* Contact CTA - light theme override (no dark/grey backgrounds) */
.cta-band.cta-light { padding: 110px 0; background: linear-gradient(135deg, #fbf7ea 0%, #f3ead0 100%) !important; color: #1b3022; }
.cta-light .cta-shade { display: none; }
.cta-light .cta-panel { background: #fff; border: 1px solid #ecdfb4; border-top: 4px solid #d4af37; box-shadow: 0 24px 60px rgba(176,126,80,.18); backdrop-filter: none; -webkit-backdrop-filter: none; }
.cta-light .cta-eyebrow { color: #a77c1a; }
.cta-light .cta-copy h2 { color: #1b3022; }
.cta-light .cta-copy p { color: #4b524a; }
.cta-light .cta-btn-primary { background: #1f7a3d; color: #fff; box-shadow: 0 14px 30px rgba(31,122,61,.28); }
.cta-light .cta-btn-primary .cta-ico { background: rgba(255,255,255,.2); }
.cta-light .cta-btn-primary:hover { background: #18642f; color: #fff; box-shadow: 0 18px 38px rgba(31,122,61,.4); }
.cta-light .cta-btn-ghost { background: #fffaf0; color: #1b3022; border-color: #d4af37; }
.cta-light .cta-btn-ghost:hover { background: #d4af37; color: #1b3022; border-color: #d4af37; }
@media (max-width: 991px) { .cta-band.cta-light { padding: 70px 0; } }

/* Contact CTA - green section background */
.cta-band.cta-light { background: linear-gradient(135deg, #14803f 0%, #1f9d55 55%, #2bb673 100%) !important; }
.cta-light .cta-panel { border: none; border-top: 4px solid #ffd45a; box-shadow: 0 28px 64px rgba(6,60,30,.35); }

/* Contact CTA - plain white section background */
.cta-band.cta-light { background: #fff !important; }
.cta-light .cta-panel { border: 1px solid #ecdfb4; border-top: 4px solid #d4af37; box-shadow: none; }

/* Contact CTA - split layout with image */
.cta-band.cta-light { padding: 100px 0; }
.cta-panel.cta-split { display: grid; grid-template-columns: 1fr 1.05fr; gap: 0; padding: 0; max-width: 1120px; overflow: hidden; border: 1px solid #ecdfb4; border-top: 1px solid #ecdfb4; box-shadow: none; }
.cta-media { position: relative; margin: 0; min-height: 520px; overflow: hidden; }
.cta-media img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.cta-split:hover .cta-media img { transform: scale(1.05); }
.cta-media::after { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(255,224,136,.85); pointer-events: none; }
.cta-media figcaption { position: absolute; left: 34px; bottom: 34px; z-index: 2; display: flex; flex-direction: column; gap: 4px; padding: 14px 20px; background: #fff; border-left: 4px solid #d4af37; box-shadow: 0 12px 30px rgba(0,0,0,.18); }
.cta-media figcaption span { font-size: .68rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #a77c1a; }
.cta-media figcaption b { font-size: .95rem; color: #1b3022; }
.cta-body { display: flex; flex-direction: column; justify-content: center; gap: 30px; padding: 56px 54px; background: #fff; }
.cta-body .cta-actions { gap: 14px; }
@media (max-width: 991px) { .cta-panel.cta-split { grid-template-columns: 1fr; } .cta-media { min-height: 300px; } .cta-body { padding: 36px 28px; } .cta-media figcaption { left: 24px; bottom: 24px; } }
@media (max-width: 575px) { .cta-body { padding: 28px 18px; } .cta-media figcaption b { font-size: .85rem; } }

/* Contact CTA - compact height, tighter spacing above */
#location-map { padding-bottom: 30px; }
.cta-band.cta-light { padding: 30px 0 70px; }
.cta-media { min-height: 380px; }
.cta-body { gap: 20px; padding: 34px 44px; }
.cta-copy h2 { font-size: clamp(1.5rem, 2.3vw, 2rem); margin-bottom: 10px; }
.cta-copy p { font-size: .97rem; line-height: 1.65; }
.cta-eyebrow { margin-bottom: 10px; }
.cta-btn { padding: 12px 18px; }
.cta-ico { width: 40px; height: 40px; }
.cta-body .cta-actions { gap: 10px; }
@media (max-width: 991px) { .cta-band.cta-light { padding: 20px 0 50px; } #location-map { padding-bottom: 20px; } .cta-media { min-height: 240px; } .cta-body { padding: 28px 22px; } }

/* Contact CTA - no bottom spacing */
.cta-band.cta-light { padding-bottom: 0; }
#faq { padding-top: 40px; }
@media (max-width: 991px) { .cta-band.cta-light { padding-bottom: 0; } #faq { padding-top: 30px; } }

/* Headings re-levelled for hierarchy (h4 -> h3): keep the previous h4 look */
.p-card h3, .am-body h3, .nb-text h3, .us-text h3 { font-weight: var(--h4-font-weight); letter-spacing: var(--h4-letter-spacing); line-height: var(--h4-line-height); }
.am-extra h4 { font-weight: var(--h5-font-weight); line-height: var(--h5-line-height); }

/* Compact vertical rhythm: no oversized gaps between sections */
#introduction, #section-overview, #features, #location, #amenities, #why-choose, #location-map { padding-top: 64px; padding-bottom: 64px; }
#floor-plans { padding-top: 64px; padding-bottom: 64px; }
#photo-gallery { padding-top: 64px; padding-bottom: 40px; }
#stats.st-band { padding-top: 40px; padding-bottom: 40px; }
#location-map { padding-bottom: 40px; }
#faq { padding-top: 48px; padding-bottom: 64px; }
.cta-band.cta-light { padding: 40px 0 0; }
#location-map-image { padding: 0; line-height: 0; }
.row.g-4.justify-content-center.text-center + .row, .ev-head { margin-bottom: 0; }
.ix-section.ix-faq { padding: 48px 0 64px; }
.ix-heading { margin-bottom: 32px; }
@media (max-width: 767px) {
  #introduction, #section-overview, #features, #location, #amenities, #why-choose, #location-map, #floor-plans { padding-top: 44px; padding-bottom: 44px; }
  #photo-gallery { padding-top: 44px; padding-bottom: 24px; }
  #faq, .ix-section.ix-faq { padding-top: 32px; padding-bottom: 44px; }
  .cta-band.cta-light { padding-top: 24px; }
}

/* ---------- Project snapshot: fact cards + villa strip ---------- */
.sn-section { background: #f6f3ec; }
.sn-card { position: relative; height: 100%; padding: 32px 28px 28px; background: #fff; border: 1px solid rgba(27,48,34,.14); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.sn-card:hover { transform: translateY(-6px); border-color: #d4af37; box-shadow: 0 18px 40px rgba(0,0,0,.12); }
.sn-icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; margin-bottom: 16px; color: #735c00; background: rgba(212,175,55,.14); border: 1px solid rgba(212,175,55,.45); border-radius: 50%; transition: background .3s ease, color .3s ease; }
.sn-card:hover .sn-icon { background: #d4af37; color: #061b0e; }
.sn-card h3 { margin: 0 0 14px; font-size: 1.2rem; color: #1b3022; }
.sn-list { margin: 0; padding: 0; list-style: none; }
.sn-list li { display: flex; flex-direction: column; gap: 2px; padding: 11px 0; border-top: 1px solid rgba(27,48,34,.12); }
.sn-list li span { font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #735c00; }
.sn-list li strong { font-size: .95rem; font-weight: 600; line-height: 1.55; color: #3a403a; }
.sn-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; font-size: .85rem; font-weight: 700; color: #735c00; border-bottom: 1px solid rgba(115,92,0,.4); transition: gap .3s ease, color .3s ease; }
.sn-link:hover { gap: 14px; color: #1b3022; }
.sn-villa { display: grid; grid-template-columns: 1.4fr auto auto; align-items: center; gap: 40px; margin-top: 40px; padding: 40px 44px; color: #fff; background: #0b2418; position: relative; overflow: hidden; }
.sn-villa::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 10% 20%, rgba(212,175,55,.16), transparent 50%); pointer-events: none; }
.sn-villa > * { position: relative; }
.sn-villa h3 { margin: 6px 0 10px; font-size: clamp(1.5rem, 2.6vw, 2.2rem); color: #fff; }
.sn-villa p { margin: 0; max-width: 520px; line-height: 1.75; color: rgba(255,255,255,.78); }
.sn-villa-stats { display: flex; gap: 36px; }
.sn-villa-stats > div { display: flex; flex-direction: column; text-align: center; padding-left: 36px; border-left: 1px solid rgba(255,255,255,.18); }
.sn-villa-stats > div:first-child { padding-left: 0; border-left: 0; }
.sn-villa-stats strong { font-family: "Playfair Display", Georgia, serif; font-weight: 500; font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.1; color: #ffe088; }
.sn-villa-stats span { margin-top: 6px; font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.7); }
@media (max-width: 991px) { .sn-villa { grid-template-columns: 1fr; gap: 26px; padding: 32px 26px; } .sn-villa .btn-main { justify-self: start; } }
@media (max-width: 575px) { .sn-card { padding: 26px 20px 22px; } .sn-villa-stats { gap: 22px; } .sn-villa-stats > div { padding-left: 22px; } .sn-villa .btn-main { width: 100%; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .sn-card, .sn-icon, .sn-link { transition: none; } }

/* ---------- Compact, premium rhythm: balanced bands, no dead space ---------- */
.st-band { padding: 52px 0 44px; }
.st-label { font-size: .76rem; letter-spacing: .12em; line-height: 1.5; }
.st-line { margin: 16px auto 14px; }
.us-wrap { margin-top: 32px; }
.us-card { min-height: 290px; }
.gx-section { padding-bottom: 44px; }
.gx-stage { height: clamp(340px, 40vw, 500px); margin-top: 0; }
@media (max-width: 575px) { .st-band { padding: 40px 0 28px; } .st-col { padding: 18px 10px; } .gx-stage { height: 340px; } }
.sn-section { padding: 64px 0; }
.sn-villa .subtitle { color: #ffe088; background: rgba(255,224,136,.12); border: 1px solid rgba(212,175,55,.45); }
.sn-villa { margin-top: 32px; }
@media (max-width: 575px) { .sn-section { padding: 44px 0; } }

/* ---------- Buttons: same palette and style as the home page ---------- */
a.btn-main, a.btn-main:active, a.btn-main:focus, a.btn-main:visited, .btn-main, input[type=button].btn-main, input[type=submit].btn-main, button.btn-main {
  color: #fff; background: #1b3022; border: 1px solid transparent; border-radius: 4px;
  font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
}
a.btn-main:hover, .btn-main:hover, input[type=submit].btn-main:hover, button.btn-main:hover {
  color: #fff; background: #1b3022; border-bottom-color: #d4af37; transform: translateY(-3px); box-shadow: 0 16px 30px rgba(6,27,14,.2);
}
a.btn-main.btn-line, a.btn-main.btn-line:visited, .btn-main.btn-line {
  color: #d4af37; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.42);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
a.btn-main.btn-line:hover, .btn-main.btn-line:hover { color: #d4af37; background: rgba(255,255,255,.08); }

/* ---------- Feature cards: hover motion (original colours kept) ---------- */
.p-card { transition: transform .4s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .4s ease; }
.p-card:hover, .p-card:focus-within { transform: translateY(-8px); border-color: #d4af37; box-shadow: 0 22px 44px rgba(0,0,0,.18); }
.p-card h3, .p-card p, .p-num { transition: transform .4s cubic-bezier(.2,.8,.2,1), letter-spacing .4s ease; }
.p-card:hover h3, .p-card:hover p { transform: translateX(8px); }
.p-card:hover .p-num { transform: scale(1.35); transform-origin: left center; letter-spacing: .32em; }
@media (hover: none), (prefers-reduced-motion: reduce) {
  .p-card:hover { transform: none; }
  .p-card:hover h3, .p-card:hover p { transform: none; }
}