:root {
    /* Base Backgrounds - Deeper and richer */
    --bg-dark: #050a18;
    --bg-darker: #010205; /* Darkened for higher contrast */
    --bs-primary: var(--bg-dark);
    
    /* Luxury Gold Palette - Refined to feel less "yellow" and more "metallic" */
    --accent: #c5a059;           /* Classic Gold */
    --accent-secondary: #e5c17e; /* Soft Gold */
    --accent-light: #f5dba8;     /* Champagne */
    --accent-dark: #8e6f2e;      /* Deep Gold */
    --accent-gold-bright: #ffcc00; 
    
    /* Glassmorphism & Cards */
    --card-bg: rgba(10, 20, 45, 0.6);       /* Lowered opacity for blur effect */
    --card-bg-hover: rgba(15, 30, 60, 0.8);
    --glass-reflection: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%);
    
    /* Borders - Using HSL/RGBA for better blending */
    --border-light: rgba(197, 160, 89, 0.2);
    --border-accent: rgba(197, 160, 89, 0.5);
    
    /* Typography */
    --text-main: #f0f0f0;
    --text-muted: rgba(255, 249, 249, 0.6);
    --text-light: rgba(255, 255, 255, 0.4);
    --stroke: rgba(197, 160, 89, 0.2);

    /* --- ENHANCED GRADIENTS --- */
    
    /* 1. The Main Background: A 3-stop "Radial-Mesh" Gradient 0f1e3c*/
    /* This creates a light source in the top left and a deep void in the bottom right */
    --gradient-bg: radial-gradient(circle at 0% 0%, #020408 0%, transparent 100%),
                   radial-gradient(circle at 50% 50%, #1a2a4a 0%, transparent 70%),
                   radial-gradient(circle at 100% 100%, #020408 0%, #050a18 100%);

    /* 2. The Luxury Text Gradient: Gives a "shimmer" effect */
    --gradient-gold: linear-gradient(135deg, 
        var(--accent-dark) 0%, 
        var(--accent) 25%, 
        var(--accent-light) 50%, 
        var(--accent) 75%, 
        var(--accent-dark) 100%);

    /* 3. Glow Effects */
    --accent-glow: 0 0 20px rgba(197, 160, 89, 0.3);
    --card-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.8);
    --real-secondary-blue: #c5a059; 
    --real-gold: #ffcc00;
    --white: #f0f0f0;
    --color-white: #f0f0f0;
    --color-light: #f0f0f0;
    --color-dark: #f0f0f0;
    --black: #0b0f18;
    --max: 1180px;
    --line: rgba(201,166,89,0.20);
    /* 4. Concierge page variables */
    --gold-primary: #D4AF37;
    --gold-light: #F2D06B;
    --gold-dark: #AA8C2C;
    --black-deep: #050505;
    --black-card: rgba(15, 15, 15, 0.75);
    --glass-border: rgba(212, 175, 55, 0.3);
    --transition-slow: all 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
html{scroll-behavior:smooth;}
[data-bs-theme="dark"] body {
    font-family: 'Inter', sans-serif;
    background:
        linear-gradient(to bottom, #010205 0%, #050a18 13%, #1a2a4a 45%, #050a18 82%, #010205 100%),
        var(--gradient-bg);
    font-family:Inter,sans-serif;
    color:var(--color-light);
    overflow-x:hidden;
}
.max{max-width:var(--max); margin:0 auto; padding:0 32px;}
.eyebrow{
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--accent-light);
  display:flex; align-items:center; gap:12px;
  margin-bottom: 16px;
}
.eyebrow::before{
  content:"";
  width:28px; height:1px; 
  background: var(--accent-dark);
  display:inline-block;
}
.white{
color: #fefefe !important
}
.hero-heading{
	font-family:'Playfair Display',Cinzel,serif;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:0.01em
	}
.chips{ display:flex; gap:14px; justify-content:center; margin-top:32px; flex-wrap:wrap; }
.chip{
  border:1px solid var(--line); padding:11px 24px; border-radius:1px;
  font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--steel);
}
.chip strong{ color: var(--gold-bright); font-weight:500; }

/* ---------- Feature grid (section 5) ---------- */
.features{
  display:grid; grid-template-columns: repeat(4, 1fr); gap:1px;
  background: var(--line);
  border:1px solid var(--line);
  margin-top:24px;
}
.feature{
  background: var(--bg-dark);
  padding: 34px 26px;
  text-align:center;
}
.feature svg{ width:76px; height:76px; margin-bottom:12px; }
.feature h3{ 
	font-family:var(--sans); 
	font-weight:600; 
	font-size:1.2rem; 
	letter-spacing:0.06em; 
	text-transform:uppercase; 
	color:var(--accent-dark); }
.feature p{ font-size:13px; color:var(--steel); margin-top:10px; line-height:1.5; }
@media (max-width:900px){ .features{ grid-template-columns: 1fr 1fr; } }
@media (max-width:560px){ .features{ grid-template-columns: 1fr; } }

.h3,h1,h2,h3,h4 {
	font-family:'Playfair Display',Cinzel,serif;
	color:var(--accent);
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:0.01em
}
.body-text{
  font-size:15px; color: var(--steel); max-width:500px; margin-top:16px; font-weight:300;
}
.body-text strong{color:var(--ivory); font-weight:500;}
/* ---------- Hero ---------- */
.hero{
  min-height: 82vh;
  display:flex; align-items:center;
  padding-top: 110px;
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; z-index:0; opacity:0.55;
}
.hero .max{ position:relative; z-index:2; }
.hero-copy{ max-width:760px; }
.scroll-cue{
  position:absolute; 
  bottom:26px; 
  left:50%; 
  transform:translateX(-50%);
  display:flex; 
  flex-direction:column; 
  align-items:center; 
  gap:8px;
  font-size:10px; 
  letter-spacing:0.3em; 
  text-transform:uppercase; 
  color:var(--accent-light);
}
.scroll-cue .line{ 
width:1px; 
height:28px; 
background:linear-gradient(var(--accent-dark), transparent); animation: pulse-line 2.4s ease-in-out infinite; }
@keyframes pulse-line{ 0%,100%{opacity:.3;} 50%{opacity:1;} }
/* ---------- Sections ---------- */
.section{
  position:relative;
  padding: 76px 0;
  border-bottom: 1px solid var(--line);
}
.section:last-of-type{ border-bottom:none; }

.split{
  display:grid; grid-template-columns: 1fr 1fr; gap:56px; align-items:center;
}
.split.reverse .visual{ order:2; }
.split.reverse .copy{ order:1; }
@media (max-width:900px){
  .split, .split.reverse{ grid-template-columns:1fr; gap:36px; }
  .split .visual, .split.reverse .visual{ order:1 !important; }
  .split .copy, .split.reverse .copy{ order:2 !important; }
  .section{ padding: 64px 0; }
}
/* ---------- Visual / image fallback ---------- */
.visual{
  position:relative;
  aspect-ratio: 4/4.6;
  border-radius:1px;
  overflow:hidden;
  border:1px solid var(--line);
  background: linear-gradient(155deg, #10192c 0%, #060a13 100%);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,0.6);
}
.visual img{ width:100%; height:100%; object-fit:cover; }
.visual-mark{
  display:none; position:absolute; inset:0;
  align-items:center; justify-content:center;
  background:
    radial-gradient(circle at 30% 20%, rgba(201,166,89,0.10), transparent 55%),
    linear-gradient(155deg, #101a2e 0%, #060a13 100%);
}
.visual.visual-fallback .visual-mark{ display:flex; }
.visual-mark svg{ width:34%; opacity:0.85; }
.visual-caption{
  position:absolute; left:18px; bottom:16px;
  font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color: var(--gold-dim);
}
.lede{
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(17px, 1.8vw, 21px);
  color: var(--white);
  max-width: 600px;
  margin-top: 14px;
}
/* ---------- Bullets (sections 3 & 7) ---------- */
.bullets{ list-style:none; margin-top:26px; display:flex; flex-direction:column; gap:14px; }
.bullets li{
  display:flex; gap:14px; align-items:baseline;
  font-size:1.2rem; color:var(--white); font-weight:300;
}
.bullets li::before{ content:"—"; color:var(--accent); flex:none; }
/* ---------- Final CTA (section 9) ---------- */
.final{
  text-align:center;
  padding: 110px 0 96px;
  position:relative;
}
.final h2{ font-size: clamp(30px, 5.2vw, 54px); }
.final .btn-row{ justify-content:center; }
/* ---------- FAQ ---------- */
.faq{ max-width:760px; margin:0 auto; }
.faq-item{ border-bottom:1px solid var(--line); padding:22px 0; }
.faq-q{
  display:flex; justify-content:space-between; align-items:center; cursor:pointer;
  font-family:var(--serif); font-size:20px; color:var(--accent-dark);
}
.faq-q .plus{ color:var(--accent); font-size:20px; transition: transform .3s; }
.faq-item.open .plus{ transform: rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition: max-height .35s ease; }
.faq-item.open .faq-a{ max-height:200px; }
.faq-a p{ padding-top:14px; color:var(--white); font-size:15px; max-width:640px; }

.bg-primary{
    background:transparent !important;
}
a {
text-decoration:none!important
}

.property-archive-wrapper {
min-height:100vh;
background:var(--gradient-bg);
position:relative;
overflow:hidden
}

.property-archive-wrapper::before {
content:'';
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:radial-gradient(circle at 20% 50%,#c5a0590d 0,transparent 50%),radial-gradient(circle at 80% 80%,#c5a05908 0,transparent 50%);
pointer-events:none;
z-index:0
}

.gold-gradient-text,
.luxury-text,
.text-gold {
    background: linear-gradient(
        135deg,
        var(--accent-dark) 0%,
        var(--accent) 30%,
        var(--accent-light) 50%,
        var(--accent) 70%,
        var(--accent-dark) 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.border-secondary{
    border-color: var(--gold-primary) !important;
}
.filter-wrapper {
background:#ffffff05;
border:1px solid var(--border-accent);
border-radius:60px;
padding:1.5rem 2rem;
backdrop-filter:blur(20px);
margin-bottom:4rem;
box-shadow:0 4px 16px #0000004d;
position:relative;
z-index:1;
animation:fadeInUp .8s ease-out .4s both
}

.filter-wrapper::before {
content:'';
position:absolute;
inset:0;
background:linear-gradient(135deg,#c5a0591a 0,transparent 100%);
border-radius:60px;
pointer-events:none
}

@keyframes fadeInUp {
from {
opacity:0;
transform:translateY(30px)
}

to {
opacity:1;
transform:translateY(0)
}
}

.filter-select {
background:#ffffff0d;
border:1px solid var(--border-light);
border-radius:30px;
color:var(--accent);
font-family:'Playfair Display',serif;
font-size:.95rem;
text-transform:uppercase;
cursor:pointer;
outline:0;
padding:.6rem 1.2rem;
transition:all .3s ease;
letter-spacing:.05em
}

.filter-select:hover {
border-color:var(--accent);
background:#c5a0591a;
box-shadow:0 0 5px #c5a05933
}

.filter-select:focus {
border-color:var(--accent-secondary);
box-shadow:0 0 10px #c5a0594d
}

.archive-prop-card {
background:var(--card-bg);
border:1px solid var(--border-light);
border-radius:5px;
overflow:hidden;
transition:all .6s cubic-bezier(.23,1,.32,1);
backdrop-filter:blur(25px);
position:relative;
height:100%;
display:flex;
flex-direction:column;
box-shadow:0 5px 10px #0000004d
}

.archive-prop-card::before {
content:'';
position:absolute;
inset:0;
background:linear-gradient(135deg,#c5a0591a 0,transparent 100%);
opacity:0;
transition:opacity .6s ease;
pointer-events:none;
z-index:1
}

.archive-prop-card:hover {
transform:translateY(-1px) scale(1.01);
box-shadow:0 5px 10px #c5a05904 0 0 10px #c5a05903
}

.archive-prop-card:hover::before {
opacity:1
}

.prop-img-wrapper img {
width:100%;
max-height:280px;
object-fit:cover;
transition:transform .8s cubic-bezier(.23,1,.32,1);
aspect-ratio:16/10;
overflow:hidden
}

.archive-prop-card:hover .prop-img-wrapper img {
transform:scale(1.12) rotate(1deg)
}

.price-display {
font-family:'Playfair Display',serif;
font-size:2rem;
color:var(--accent-light);
font-weight:700;
letter-spacing:.05em;
text-shadow:0 2px 8px #00000080
}

.price-tag {
padding:0 .5rem .5rem!important
}

@keyframes slideInRight {
from {
opacity:0;
transform:translateX(30px)
}

to {
opacity:1;
transform:translateX(0)
}
}

.prop-stats {
display:grid;
grid-template-columns:repeat(3,1fr);
gap:0;
border-top:1px solid var(--border-light);
padding:.7rem 0;
margin-top:auto
}

.stat-item {
text-align:center;
padding:0 .5rem;
transition:all .3s ease
}

.stat-item:not(:last-child) {
border-right:1px solid var(--border-light)
}

.stat-item:hover {
transform:scale(1.05)
}

.icn-gold {
max-height:45px;
margin-bottom:.3rem;
opacity:.5;
transition:transform .3s ease
}

.stat-item:hover .icn-gold {
transform:scale(1.05)
}

.stat-value {
font-size:1.12rem;
color: var(--white);
font-weight:600;
font-family:'Playfair Display',serif
}

.stat-label {
font-size:1rem;
color:var(--text-light);
font-weight:400;
text-transform:uppercase;
letter-spacing:.05em
}

.mini-amenities {
display:flex;
flex-wrap:wrap;
gap:.8rem;
padding-top:1rem;
border-top:1px dashed var(--border-light)
}

.mini-amenity-item {
font-size:.75rem;
color:var(--text-muted);
display:inline-flex;
align-items:center;
gap:.4rem;
background:#c5a05914;
padding:.4rem .8rem;
border-radius:20px;
border:1px solid #c5a05926;
transition:all .3s ease;
white-space:nowrap
}

.mini-amenity-item:hover {
background:#c5a05926;
border-color:var(--accent);
color:var(--accent)
}

.mini-amenity-item i {
color:var(--accent);
font-size:.9rem;
transition:transform .3s ease
}

.mini-amenity-item:hover i {
transform:scale(1.2)
}

.luxury-title-wrap {
padding:2rem 0
}

.ttlfont {
font-family:'Cormorant SC',serif;
font-weight:300
}

.luxury-text {
font-family:'Cormorant SC',serif;
font-weight:300;
font-size:4rem;
letter-spacing:.15em;
line-height:1.2;
filter:drop-shadow(0 2px 2px #0003)
}
.display-7{
    font-size: 1.8rem;
}
.luxury-divider {
height:1px;
width:15rem;
background:radial-gradient(circle,#a6822b 0,#a6822b00 100%);
margin:20px auto;
opacity:.8
}
.luxury-divider-hero {
height:1.6px;
width:33rem;
background:radial-gradient(circle,#a6822b 0,#a6822b00 100%);
margin:18px;
opacity:.9
}
.luxury-divider-footer {
height:1px;
width:66%;
background:radial-gradient(circle,#a6822b 0,#a6822b00 100%);
margin:20px auto;
opacity:.8
}
.luxury-subtitle {
font-family:'Cormorant SC',serif;
font-weight:400;
font-size:.85rem;
letter-spacing:.5em;
color:var(--accent);
text-transform:uppercase;
opacity:.7
}

.property-grid {
display:grid;
grid-template-columns:repeat(auto-fill,minmax(350px,1fr));
gap:2.5rem;
position:relative;
z-index:1
}

.publisher-name {
color:var(--accent-light)
}

@media (max-width:1200px) {
.property-grid {
grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
gap:2rem
}
}

@media (max-width:768px) {
.property-grid {
grid-template-columns:1fr;
gap:1.5rem
}
}

@media (max-width:991px) {
.luxury-text {
font-size:2rem;
letter-spacing:.2em;
line-height:1.1;
filter:drop-shadow(0 2px 2px #0003)
}

.luxury-subtitle {
font-family:'Cormorant SC',serif;
font-weight:400;
font-size:.75rem;
letter-spacing:.4em;
color:var(--accent);
text-transform:uppercase;
opacity:.7
}
}





.main-slider-wrap {
box-shadow:0 20px 40px #00000080;
border:1px solid var(--border-light);
flex:9;
border-radius:16px;
overflow:hidden
}

p,small,span {
font-family:'Helvetica Neue',Inter,sans-serif;
letter-spacing:.3px
}

.summary-item span {
font-size:.8rem;
color:var(--color-light);
text-transform:uppercase
}

.gallery-container {
height:420px;
display:flex;
gap:12px;
margin-bottom:30px
}

.thumb-slider .swiper-slide {
opacity:.6;
cursor:pointer;
border-radius:10px;
transition:opacity .3s ease,transform .3s ease
}

.thumb-slider .swiper-slide:hover {
opacity:.9;
transform:scale(1.03)
}

.main-slider img {
width:100%;
height:100%;
object-fit:cover
}

.thumb-slider img {
width:100%;
height:100%;
object-fit:cover
}

.summary-bar {
border-radius:12px;
border:1px solid var(--border-light);
backdrop-filter:blur(20px)
}

.summary-item {
padding:16px;
flex:1;
border-right:1px solid var(--stroke)
}

.summary-item:last-child {
border-right:none
}

.meta-icon-box {
width:48px;
height:48px;
display:flex;
align-items:center;
justify-content:center;
margin:0 auto 3px;
border:none!important;
background:0 0!important
}

.meta-icon-box i {
font-size:1.7rem;
color:var(--accent)
}

.sticky-top .prop-card {
text-align:center
}

.archive-prop-card,
.prop-card,
.summary-bar,
.glass-card {
    background: var(--card-bg);
    border: 1px solid var(--border-light);
    box-shadow: var(--card-shadow);
    backdrop-filter: blur(20px);
}

.prop-card,.sticky-top,.summary-bar {
border:1px solid #c5a05926;
border-radius:12px;
box-shadow:0 10px 30px #0000004d;
backdrop-filter:blur(25px)
}

.sticky-top .h3 {
font-family:'Playfair Display',serif;
color:var(--accent);
margin-bottom:20px
}

.publisher-avatar-wrapper img {
border:1px solid var(--accent);
padding:4px;
border-radius:50%;
width:90px;
height:90px;
object-fit:cover;
background:var(--bg-dark)
}

.prop-card {
background:var(--card-bg);
padding:28px;
margin-bottom:28px;
border:1px solid #ffffff0d
}

.prop-card:hover {
border-color:var(--accent)
}

.amenity-item {
background:#ffffff05;
padding:14px;
border-radius:6px;
border:1px solid var(--stroke);
font-family:Cinzel,serif;
font-size:.95rem;
letter-spacing:.5px;
text-transform:capitalize;
font-weight:300
}

.amenity-item i {
color:var(--accent)
}

.amenity-item:hover {
background:#00d4ff1a
}

#property-map {
background:var(--card-bg);
border-radius:16px;
overflow:hidden;
box-shadow:var(--accent-glow)
}

.btn-success {
background-color:transparent!important;
border-color:var(--accent);
color:var(--accent)
}

.btn-success:hover {
background-color:var(--dark-light);
border-color:var(--dark-light)
}

.btn-outline-light {
border:1px solid var(--accent)!important;
color:var(--accent)!important;
background:0 0;
transition:all .4s ease
}

.btn-outline-light:hover {
background:var(--accent);
color:var(--black)!important
}

.icn {
max-height:45px;
padding-bottom:4px
}

@media (max-width:991px) {
.gallery-container {
flex-direction:column;
height:auto
}

.thumb-slider-wrap {
height:80px
}

.thumb-slider .swiper-slide {
height:100%!important
}
}


/* ==========================================================================
   2. NAVIGATION & HEADER
   ========================================================================== */
.navbar {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
    /*background-color: var(--bs-primary) !important;*/
}

.plus700-top-nav {
    min-height: 92px;
}

.plus700-nav-inner {
    position: relative;
    min-height: 92px;
    align-items: center;
}

.plus700-nav-logo {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
}

.plus700-nav-logo img {
    max-height: 180px;
    width: auto;
    object-fit: contain;
}

.plus700-main-menu {
    padding-left: 240px;
}

.plus700-main-menu .dropdown-menu {
    background: rgba(5, 10, 24, 0.96);
    border: 1px solid var(--border-accent);
    border-radius: 8px;
}

.plus700-main-menu .dropdown-item {
    color: var(--text-main);
    text-transform: uppercase;
    font-size: 0.88rem;
    letter-spacing: 0.04em;
}

.plus700-main-menu .dropdown-item:hover,
.plus700-main-menu .dropdown-item:focus {
    background: rgba(197, 160, 89, 0.18);
    color: var(--accent-light);
}

/* Corrected Menu Selectors */
.navbar-nav li {
    margin-left: 15px;
    margin-right: 15px;
    list-style: none;
}

.navbar-nav li a {
    font-size: 1.1rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--color-dark) !important;
    transition: all 0.3s ease;
    text-decoration: none;
}

.navbar-nav li a:hover {
    color: var(--accent) !important; /* Secondary Blue Hover */
    text-decoration: none !important;
}

.navbar-brand img {
    transition: transform 0.3s ease;
}

.navbar-brand img:hover {
    transform: scale(1.05);
}

/* ==========================================================================
   3. HERO SECTION (Real700 Branding)
   ========================================================================== */


.hero-section {
    padding: 50px 0;
    position: relative;
    overflow: hidden;
    /* Hero bg is handled by the body gradient, but we can add depth here */
}

.hero-section::before {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-image: url('https://www.transparenttextures.com/patterns/carbon-fibre.png');
    opacity: 0.05;
    pointer-events: none;
}

.real700-title {
    font-size: clamp(3rem, 8vw, 5rem);
    font-weight: 800;
    letter-spacing: -2px;
}

.text-secondary-color {
    color: var(--accent-secondary) !important;
    text-shadow: 0 0 5px rgba(197, 160, 89, 0.2);
}

.text-info {
    color: var(--color-light) !important; /* Cyan helper */
}
.text-white{
    color:var(--white) !important;
}
.fw-bold-gold {
    color: var(--real-gold);
    font-weight: 700 !important;
}

/* The horizontal line under the title */
.divider-line {
    width: 100px;
    height: 3px;
    background-color: var(--real-secondary-blue);
}

/* --- The Button with the Glow Effect --- */
.btn-real-cta {
    background: transparent;
    color: white;
    border: 2px solid var(--real-secondary-blue);
    padding: 15px 35px;
    font-weight: 700;
    font-size: 1.2rem;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 0 5px rgba(197, 160, 89, 0.2);
}

.btn-real-cta:hover {
    background: var(--real-secondary-blue);
    color: var(--real-dark-blue);
    box-shadow: 0 0 5px rgba(197, 160, 89, 0.2);
    transform: translateY(-2px);
}

/* --- THE MAIN BUTTON (From Image) --- */
.btn-start-listing {
    background: linear-gradient(135deg, #ffcc00 0%, #ffbb00 100%);
    color: #001f3f !important;
    font-size: 1.4rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 15px 40px;
    border: none;
    box-shadow: 0 5px 10px rgba(197, 160, 89, 0.2);
    transition: all 0.3s ease;
}

.btn-start-listing:hover {
    background: #ffffff;
    transform: translateY(-5px);
    box-shadow: 0 5px 10px rgba(197, 160, 89, 0.2);
}

/* --- Footer Styling --- */
.footer-menu li {
    margin-bottom: 10px;
}

.footer-menu li a {
    color: var(--dark-light);
    text-decoration: none;
    transition: color 0.3s ease;
    font-size: 0.95rem;
}

.footer-menu li a:hover {
    color: var(--real-secondary-blue);
}

/* --- Social Icons Styling --- */
.social-icons {
    display: flex !important;
    flex-wrap: wrap;
    gap: 20px; /* Adjust spacing between icons here */
    padding-left: 0;
    margin-bottom: 0;
}

.social-icons li {
    list-style: none !important;
    display: inline-block;
}

.social-icons li a {
    font-size: 1.5rem; /* Make icons look high-end */
    color: var(--accent);
    transition: transform 0.3s ease, color 0.3s ease;
}

.social-icons li a:hover {
    color: var(--accent-light);
    transform: translateY(-3px);
}
.section-title {
    font-weight: 700;
    font-size: clamp(25px, 2.1vw, 40px);
    letter-spacing: -0.03em;
    margin-top: 1rem;
    margin-left: 1rem;
    margin-bottom: 0;
    letter-spacing: 0.01em;
    margin-bottom: clamp(5px, 0.42vw, 8px);
    position: relative;
    display: inline-block;
    z-index: 1;
}

.section-title:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(40%, -10%);
    
    height: 1.5em; 
    width: 1.5em;
    
    background: radial-gradient(circle, #c5a059 0%, #e5c17e 100%);
    border-radius: 50%;
    opacity: 0.8;
    z-index: -1;
    
    animation: heartbeat-pulse 1.2s ease-in-out 3;
}

/* 3 heartbeats then stops */
@keyframes heartbeat-pulse {
    0%, 100% {
        transform: translate(40%, -10%) scale(1);
        opacity: 0.8;
    }
    25% {
        transform: translate(40%, -10%) scale(1.3);
        opacity: 0.6;
    }
    50% {
        transform: translate(40%, -10%) scale(1);
        opacity: 0.8;
    }
}
.fit-column img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* This is the magic line */
    display: block;
}

.bg-second {
    --bs-bg-opacity: 1;
    background-color: var(--accent) !important;
}
/* Homepage Specific Mini-Cards */
.home-property-card {
    background: var(--card-bg);
    backdrop-filter: blur(15px);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
}

.home-property-card:hover {
    transform: translateY(-8px);
    border-color: var(--accent);
    box-shadow: var(--accent-glow);
}

.mini-img-wrapper {
    position: relative;
    height: 200px; /* Smaller than archive height */
    overflow: hidden;
}

.mini-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.home-property-card:hover .mini-img-wrapper img {
    transform: scale(1.1);
}

.price-badge-mini {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: rgba(5, 10, 24, 0.8);
    color: var(--accent-light);
    padding: 4px 12px;
    border-radius: 4px;
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    border: 1px solid var(--border-light);
}

.home-card-body {
    padding: 1.2rem;
}

.mini-title {
    font-size: 1.1rem !important; /* Significantly smaller than archive */
    margin-bottom: 0.8rem;
    color: var(--text-main);
    letter-spacing: 1px;
    /* Limit to 1 line for clean look */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mini-meta {
    font-size: 0.75rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.mini-meta i {
    color: var(--accent);
}
.luxury-search-group {
    background: var(--card-bg);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-light);
    border-radius: 50px !important;
    padding: 8px;
    transition: all 0.3s ease;
}

.luxury-search-group:focus-within {
    border-color: var(--accent);
    box-shadow: var(--accent-glow);
}

.luxury-search-group .form-control {
    background: transparent;
    color: var(--text-main);
    border: none;
    font-size: 1.1rem;
}

.luxury-search-group .form-control::placeholder {
    color: var(--text-light);
}

.btn-gold {
    background: var(--accent);
    color: var(--bg-darker);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.btn-gold:hover {
    background: var(--accent-secondary);
    color: var(--bg-darker);
}

.text-accent { color: var(--accent); }

/*Concierge page specifics*/
/* =========================================================
   LUXURY HERO SECTION
========================================================= */

.plus700-concierge-hero {
    position: relative;
    min-height: 60vh;
    height: 60vh;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    /*background:
        radial-gradient(
            circle at center,
            rgba(15, 30, 60, 0.65) 0%,
            #051025 45%,
            #02050b 100%
        );*/
}

/* =========================================================
   ATMOSPHERIC BACKGROUND
========================================================= 

.luxury-bg-gradient {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            circle at center,
            rgba(25, 45, 85, 0.35) 0%,
            rgba(5, 16, 37, 0.2) 35%,
            rgba(0, 0, 0, 0.85) 100%
        );
    z-index: 0;
}

/* =========================================================
   HERO LAYOUT
========================================================= */

.luxury-hero-shell {
    position: relative;
    z-index: 2;
}

.luxury-hero-grid {
    min-height: 60vh;
    align-items: flex-end;
    padding:
        2rem
        0
        1.5rem;
}
/* =========================================================
   CENTER CHARACTER
========================================================= */

.luxury-character-stage {
    position: relative;

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

    height: 60vh;

    z-index: 3;
}

.character-wrapper {
    position: relative;
    z-index: 3;
}

.character-img {
    height: 60%;
    max-height: 60%;
    width: auto;
    max-width: 65%;
    object-fit: contain;
    object-position: bottom;

    filter:
        drop-shadow(0 30px 60px rgba(0,0,0,0.55));

    will-change: transform, opacity;
}



/* =========================================================
   BRAND MARK
========================================================= */

.plus700-concierge-brand-mark {
    position: absolute;
    top: 0%;
    left: 55%;
    transform: translateX(-50%);
    z-index: 2;
    text-align: center;
}

.badge-plus {
    width: 52px;
    height: 52px;
    margin: 0 auto 1rem;

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

    border-radius: 50%;
    border: 1px solid rgba(212,175,55,0.4);

    background: rgba(5,16,37,0.65);

    color: var(--accent-light);

    font-family: 'Playfair Display', serif;
    font-size: 1.4rem;
}

.plus700-brand-text {
    font-family: 'Cormorant SC', serif;
    font-size: clamp(1.8rem, 4vw, 3rem);
    letter-spacing: 0.18em;
}

.plus700-brand-sub {
    margin-top: 0.5rem;

    font-size: 0.85rem;
    letter-spacing: 0.45em;
    text-transform: uppercase;

    color: var(--text-muted);
}

/* =========================================================
   PANELS / FAUX GLASS
========================================================= */

.luxury-panel {
    position: absolute;

    background: rgba(5, 16, 37, 0.72);

    border: 1px solid rgba(212, 175, 55, 0.22);

    border-radius: 24px;
    bottom:33px;
    padding: 2rem;

    box-shadow:
        0 12px 40px rgba(0,0,0,0.45),
        inset 0 1px 0 rgba(255,255,255,0.04);

    overflow: hidden;

    transition:
        transform 0.45s ease,
        border-color 0.45s ease,
        box-shadow 0.45s ease;

    will-change: transform;
}

/* subtle metallic edge */
.luxury-panel::before {
    content: "";
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.05),
            transparent 30%
        );

    pointer-events: none;
}

/* Hover */
.luxury-panel:hover {
    transform: translateY(-5px);

    border-color: rgba(212,175,55,0.4);

    box-shadow:
        0 18px 60px rgba(0,0,0,0.55),
        0 0 30px rgba(197,160,89,0.08);
}

/* =========================================================
   TYPOGRAPHY
========================================================= */

.luxury-eyebrow {
    display: inline-block;

    margin-bottom: 1rem;

    font-size: 0.78rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;

    color: var(--text-light);
}

.text-gold {
    background: var(--gradient-gold);
    background-size: 200% auto;

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* LEFT */
.trust-number {
    font-family: 'Playfair Display', serif;
    font-size: clamp(3rem, 7vw, 5rem);
    line-height: 1;
    margin-bottom: 0.75rem;
}

.trust-label {
    color: var(--text-main);
    font-size: 1rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* RIGHT */
.gratitude-title {
    font-family: 'Playfair Display', serif;
    font-size: 2rem;
    margin-bottom: 1rem;
}

.gratitude-copy {
    color: var(--text-muted);
    line-height: 1.9;
    font-size: 1rem;
}

/* =========================================================
   ENTRANCE ANIMATION
========================================================= */

.animate-fade-up {
    opacity: 0;
    transform: translateY(20px);
    animation: luxuryEntrance 1.5s cubic-bezier(.22,1,.36,1) forwards;
}

.delay-2 {
    animation-delay: 0.25s;
}

.delay-3 {
    animation-delay: 0.45s;
}



@keyframes luxuryEntrance {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}



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

@media (max-width: 991px) {

    .luxury-hero-grid {
        row-gap: 2rem;
        padding: 6rem 0 3rem;
    }

    .luxury-character-stage {
        min-height: auto;
    }

    .character-img {
        max-width: 420px;
        max-height: 60vh;
    }

    

    .luxury-panel {
        text-align: center;
    }

    .plus700-concierge-brand-mark {
        top: -1.5rem;
    }
}

@media (max-width: 576px) {

    .plus700-concierge-hero {
        min-height: auto;
    }

    .luxury-hero-grid {
        min-height: auto;
    }

    .character-img {
        max-width: 320px;
        max-height: 48vh;
    }

    .luxury-panel {
        padding: 1.5rem;
    }

    .trust-number {
        font-size: 3rem;
    }

    .gratitude-title {
        font-size: 1.6rem;
    }

    .plus700-brand-text {
        font-size: 2rem;
    }
}

/* =========================================================
   DELAYED CONCIERGE MESSAGE
========================================================= */

.luxury-concierge-message {
    position: absolute;

    right: 15%;
    top: 52%;

    transform: translateY(-50%);

    z-index: 6;

    width: min(230px, 90%);
}

/* Card Style */
.plus700-intro-card {
    position: relative;

    background:
        linear-gradient(
            135deg,
            rgba(10, 22, 48, 0.88),
            rgba(5, 16, 37, 0.74)
        );

    border: 1px solid rgba(212,175,55,0.18);

    border-radius: 24px;

    padding: 1.5rem 1.75rem;

    overflow: hidden;

    box-shadow:
        0 15px 50px rgba(0,0,0,0.45),
        inset 0 1px 0 rgba(255,255,255,0.04);

    backdrop-filter: blur(6px);

    opacity: 0;

    transform:
        translateY(24px)
        translateX(10px);

    animation:
        conciergeReveal 1.4s cubic-bezier(.19,1,.22,1) forwards;

    animation-delay: 1.15s;
}

/* subtle elegant line */
.plus700-intro-card .intro-line {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(245,219,168,0.7),
            transparent
        );
}

/* Typographic Feel */
.intro-pretext {
    color: rgba(255,255,255,0.65);

    letter-spacing: 0.06em;

    opacity: 0;

    animation: textFade 0.8s ease forwards;
    animation-delay: 1.55s;
}

.concierge-title {
    font-size: 1.8rem;
    letter-spacing: 0.08em;

    opacity: 0;

    animation:
        luxuryTyping 1.1s steps(12) forwards,
        textFade 0.4s ease forwards;

    animation-delay: 1.8s;

    white-space: nowrap;
    overflow: hidden;

    width: 0;
}

/* elegant fade after title */
.concierge-subtext {
    opacity: 0;

    animation: textFade 0.8s ease forwards;
    animation-delay: 2.8s;
}

/* =========================================================
   MESSAGE REVEAL
========================================================= */

@keyframes conciergeReveal {

    from {
        opacity: 0;

        transform:
            translateY(30px)
            translateX(18px);
    }

    to {
        opacity: 1;

        transform:
            translateY(0)
            translateX(0);
    }
}

/* =========================================================
   SOFT TEXT APPEAR
========================================================= */

@keyframes textFade {

    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =========================================================
   LUXURY "TYPING"
========================================================= */

@keyframes luxuryTyping {
    from {
        width: 0;
    }

    to {
        width: 12ch;
    }
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991px) {

    .luxury-concierge-message {
        position: relative;

        top: auto;
        right: auto;

        transform: none;

        width: 100%;

        margin-top: -1rem;

        display: flex;
        justify-content: center;
    }

    .plus700-intro-card {
        max-width: 420px;
    }
}

@media (max-width: 576px) {

    .plus700-intro-card {
        padding: 1.3rem;
        border-radius: 20px;
    }

    .concierge-title {
        font-size: 1.45rem;
    }
}

/* =========================================================
   ATMOSPHERIC BACKGROUND LOGO
========================================================= */

.luxury-bg-logo {
    position: absolute;

    inset: 0;

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

    z-index: 1;

    pointer-events: none;

    overflow: hidden;
}

/* Main logo */
.bg-logo-img {

    width: min(48vh, 520px);
    height: auto;

    object-fit: contain;

    opacity: 0;

    transform:
        translateY(20px)
        scale(1.08);

    animation:
        bgLogoReveal 2s cubic-bezier(.19,1,.22,1) forwards;

    animation-delay: 0.35s;

    /* Luxury softness */
    filter:
        brightness(1.1)
        saturate(0.8)
        drop-shadow(0 0 30px rgba(197,160,89,0.08));

    mix-blend-mode: screen;
}

/* elegant atmospheric fade */
.bg-logo-img::after {
    content: '';
}

/* =========================================================
   LOGO REVEAL
========================================================= */

@keyframes bgLogoReveal {

    from {
        opacity: 0;

        transform:
            translateY(24px)
            scale(1.12);
    }

    to {
        opacity: 0.08;

        transform:
            translateY(0)
            scale(1);
    }
}
