/* ═══════════════════════════════════════════════
   SOHBA Hospitality — Complete Premium Stylesheet
   Palette: Light Ivory | Champagne Gold | Espresso Dark
═══════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Inter:wght@300;400;500;600&display=swap');

:root {
    /* ─ Brand Gold (Enhanced Premium) ─ */
    --gold:       #d4af37; /* Metallic Gold */
    --gold-lt:    #f9e596;
    --gold-dim:   rgba(212, 175, 55, 0.15);
    --gold-grad:  linear-gradient(135deg, #d4af37, #aa8c2c);

    /* ─ Text Colors (Richer) ─ */
    --dark:       #0d0c0b;   
    --dark-2:     #1f1c1a;   
    --dark-3:     #332e2b;   

    /* ─ Light Backgrounds (Softer, Elegant) ─ */
    --off:        #fcfbfa;   
    --cream:      #f4f0eb;   
    --white:      #ffffff;

    /* ─ Typography ─ */
    --muted:      #8c8278;   
    --body-text:  #4a4541;   

    --ff-serif:   'Cormorant Garamond', 'Playfair Display', Georgia, serif;
    --ff-sans:    'Inter', system-ui, sans-serif;
    --ease:       cubic-bezier(0.25, 1, 0.15, 1);
    --pad:        clamp(1.5rem,5vw,6rem);
    --max:        1440px;
    
    /* ─ Premium Shadows & Glass ─ */
    --shadow-sm:  0 4px 20px rgba(0,0,0,0.03);
    --shadow-md:  0 10px 40px rgba(0,0,0,0.06);
    --shadow-lg:  0 20px 60px rgba(0,0,0,0.08);
    --glass-bg:   rgba(255, 255, 255, 0.85);
    --glass-blur: blur(12px);
}

/* ─── BASE ─── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; overflow-x: hidden; width: 100%; -webkit-text-size-adjust: 100%; }
html.lenis { height:auto; }
.lenis.lenis-smooth { scroll-behavior:auto; }

body {
    font-family: var(--ff-sans);
    background: var(--white);
    color: var(--dark);
    overflow-x: hidden;
    width: 100%;
    position: relative;
    line-height: 1.7;
}

img { display:block; width:100%; height:100%; object-fit:cover; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }

h1,h2,h3,h4,h5,h6 { font-family:var(--ff-serif); font-weight:400; line-height:1.05; color: var(--dark); }
h2 em, h3 em { font-style:italic; color:var(--gold); }

/* ─── UTILS ─── */
.section-tag {
    font-family: var(--ff-sans);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
    margin-bottom: 1rem;
}
.section-tag.light { color: var(--gold); }

.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    padding: 1.1rem 2.8rem;
    background: var(--gold-grad);
    color: var(--white);
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .2em;
    text-transform: uppercase;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.2);
    transition: all .4s var(--ease);
}
.btn-primary:hover { 
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(212, 175, 55, 0.4); 
    background: linear-gradient(135deg, #e5c158, #bf9c31);
}
.btn-primary.full { width:100%; justify-content:center; }

.btn-ghost-dark {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    padding: 1.2rem 2.5rem;
    border: 1px solid rgba(26,20,16,.25);
    color: var(--dark);
    font-size: .85rem;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    transition: all .35s var(--ease);
}
.btn-ghost-dark:hover { border-color:var(--gold); color:var(--gold); }

.btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    padding: 1.1rem 2.5rem;
    background: var(--white);
    color: var(--dark);
    border: none;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: all .35s var(--ease);
}
.btn-ghost:hover { 
    background: var(--off);
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.2); 
}

/* ─── SECTION DIVIDERS ─── */
.section-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: -1px;
    position: relative;
    z-index: 10;
}
.section-divider::before,
.section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(201,168,76, 0.4), transparent);
    max-width: 400px;
}
.section-divider-icon {
    color: var(--gold);
    font-size: .7rem;
    margin: 0 1.5rem;
    opacity: 0.8;
}

/* ─── HEADER ─── */
#site-header {
    position: fixed;
    top: 0; left: 0;
    width: 100%;
    z-index: 800;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem var(--pad); /* Reduced vertical padding */
    background: transparent;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: all .5s var(--ease);
}
#site-header.scrolled {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    padding: 1rem var(--pad);
    box-shadow: var(--shadow-sm);
    border-bottom: 1px solid rgba(0,0,0,0.02);
}

.hdr-logo {
    display: flex;
    align-items: center;
    width: 140px;
    height: 30px;
    max-width: 40vw;
    margin: 0;
    padding: 0;
    overflow: hidden; /* Crops transparent padding top/bottom */
    position: relative;
}
.hdr-logo img {
    position: absolute;
    width: 110%; 
    height: auto;
    left: -5%; /* Slight trim of left padding */
    top: 50%;
    transform: translateY(-50%);
    mix-blend-mode: darken;
    pointer-events: none;
}

.hdr-nav { display:flex; gap:2.5rem; align-items: center; }
.hdr-nav a {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: capitalize;
    color: #000;
    position: relative;
    transition: color .3s;
    font-family: var(--ff-sans);
}
.hdr-nav a::after {
    content:''; position:absolute; bottom:-3px; left:0;
    width:0; height:1px; background:var(--gold);
    transition: width .4s var(--ease);
}
.hdr-nav a:hover { color:var(--dark); }
.hdr-nav a:hover::after { width:100%; }

.hdr-book-btn {
    display: flex; align-items:center; gap:.6rem;
    padding: .65rem 1.4rem;
    background: var(--gold);
    color: var(--dark);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    transition: background .35s;
}
.hdr-book-btn:hover { background:var(--gold-lt); }

/* Burger Redesign */
.burger {
    display: none; flex-direction: column; gap: 6px;
    background: none; border: none; cursor: pointer; padding: 4px;
    position: relative; z-index: 20; /* Elevate above scaled logo */
}
.burger span {
    display: block; height: 1.5px;
    background: var(--dark); transition: all .4s var(--ease);
}
.burger span:first-child { width: 30px; }
.burger span:last-child  { width: 20px; margin-left: auto; } /* Asymmetrical modern look */

.burger.open span:first-child { transform: rotate(45deg) translate(5px, 5px); width: 26px; }
.burger.open span:last-child  { transform: rotate(-45deg) translate(5px, -5px); width: 26px; margin-left: 0; }

/* Mobile Nav */
.mobile-overlay {
    position:fixed; inset:0; background:var(--white);
    z-index:750; opacity:0; visibility:hidden;
    transition:all .5s var(--ease);
    display:flex; align-items:center; justify-content:center;
    padding-top: 70px; /* Space for header */
    padding-bottom: 2rem;
    overflow-y: auto;
}
.mobile-overlay.open { opacity:1; visibility:visible; }

.mobile-nav-inner { text-align:center; margin: auto; padding: 2rem 0; width: 100%; }
.mob-nav { display:flex; flex-direction:column; gap:1.5rem; margin-bottom:2rem; }
.mob-nav a {
    font-family:var(--ff-serif); font-size:2.2rem;
    color:#000; transition:color .3s;
}
.mob-nav a:hover { color:var(--gold); }

.mob-book-btn {
    display:inline-flex; align-items:center; gap:.75rem;
    padding: 1rem 2.5rem;
    border:1px solid var(--gold); color:var(--gold);
    font-size:.8rem; font-weight:700;
    letter-spacing:.15em; text-transform:uppercase;
    margin-bottom:2rem;
}
.mob-contacts { display:flex; flex-direction:column; gap:1rem; }
.mob-contacts a { color:var(--muted); font-size:.85rem; }
.mob-contacts a i { color:var(--gold); margin-right:.5rem; }

/* ─── HERO ─── */
.hero {
    position:relative; height:100svh; min-height:620px;
    display:flex; align-items:flex-end; overflow:hidden;
}
.hero-bg-wrap { position:absolute; inset:0; overflow:hidden; }
.hero-bg-img { 
    width:100%; height:130%; /* Extra height for parallax */
    object-fit:cover; object-position:center;
    transform-origin:center; will-change:transform; 
}
.hero-overlay {
    position:absolute; inset:0;
    background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.4) 100%);
}

.hero-content {
    position:relative; z-index:2;
    padding: var(--pad);
    padding-bottom: clamp(2rem,5vh,4rem);
    width:100%; max-width:var(--max); margin:0 auto;
    display: flex; flex-direction: column; align-items: center; text-align: center;
}

.hero-pre {
    overflow:hidden; margin-bottom:1.5rem;
}
.hero-pre .reveal-line, h1 .reveal-line {
    display:block; transform:translateY(110%);
    text-shadow: 0 4px 15px rgba(0,0,0,0.5); /* Add text shadow for readability */
}
.hero-pre .reveal-line {
    font-size:.75rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold);
    font-weight:700; text-shadow: 0 2px 10px rgba(0,0,0,0.8);
}

h1 { 
    font-size:clamp(2rem,4.5vw,4.5rem); color:#fff; line-height:1.1; margin-bottom:2rem; 
    text-shadow: 0 4px 30px rgba(0,0,0,.9);
    max-width: 1200px;
}
h1 em { font-style:italic; color:var(--gold); }

.hero-sub {
    display:flex; align-items:center; justify-content: center; gap:1.5rem;
    font-size:.8rem; letter-spacing:.2em; text-transform:uppercase;
    color:#e0e0e0; font-weight:600; margin-bottom:3rem;
    transform:translateY(20px); opacity:0;
    text-shadow: 0 2px 10px rgba(0,0,0,.8);
}
.hero-dot { width:4px; height:4px; border-radius:50%; background:var(--gold); }

.hero-btns {
    display:flex; align-items:center; justify-content: center; gap:1.5rem; flex-wrap:wrap;
    transform:translateY(20px); opacity:0;
}

/* Hero scroll indicator */
.hero-scroll-track {
    position:absolute; bottom:3rem; right:var(--pad); z-index:2;
    display:flex; flex-direction:column; align-items:center; gap:1rem;
    font-size:.65rem; letter-spacing:.25em; text-transform:uppercase;
    color:var(--muted); font-weight:700;
}
.hero-scroll-line {
    width:1px; height:56px;
    background:linear-gradient(to bottom, var(--gold), transparent);
    animation:scrollAnim 2s ease infinite;
}
@keyframes scrollAnim {
    0%   { transform:scaleY(0); transform-origin:top; opacity:1; }
    50%  { transform:scaleY(1); transform-origin:top; opacity:1; }
    100% { transform:scaleY(1); transform-origin:bottom; opacity:0; }
}

/* ─── BOOK CTA SECTION ─── */
.book-cta-section {
    background: var(--white);
    padding: clamp(3rem,6vw,6rem) var(--pad);
}
.book-cta-inner {
    max-width: var(--max);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3rem;
    flex-wrap: wrap;
}
.book-cta-text { flex: 1; }
.book-cta-text .section-tag { color: var(--gold); }
.book-cta-text h2 { font-size: clamp(2rem,5vw,3.8rem); color: var(--dark); margin-bottom:.8rem; }
.book-cta-text p { font-size:1rem; color:var(--body-text); max-width:52ch; }
.book-cta-actions {
    display: flex; gap:1.5rem; flex-wrap:wrap; align-items:center;
    flex-shrink: 0;
}
.btn-ghost-dark {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    padding: 1.2rem 2.5rem;
    border: 1px solid rgba(26,20,16,.25);
    color: var(--dark);
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    transition: all .35s var(--ease);
}
.btn-ghost-dark:hover { border-color:var(--gold); color:var(--gold); background:rgba(201,168,76,.05); }

/* ─── LOADER (hidden by default now) ─── */
#loader { display: none !important; }
.loader-content { display: none !important; }

/* ─── ABOUT ─── */
.about-section {
    padding: clamp(3rem,6vw,5rem) var(--pad);
    max-width: var(--max);
    margin: 0 auto;
    background: var(--white);
}
.about-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: clamp(3rem,6vw,8rem);
    align-items: center;
}
.about-visual { position:relative; }
.about-img-wrap {
    height: clamp(400px,65vh,680px);
    overflow: hidden;
}
.about-kpi-badge {
    position: absolute; bottom:-1.5rem; right:-1.5rem;
    background: var(--gold); color: var(--dark);
    padding: 2rem 2.2rem; text-align:center; z-index:2;
}
.akb-num {
    font-family:var(--ff-serif); font-size:3.5rem;
    font-weight:300; line-height:1;
}
.akb-label {
    font-size:.72rem; font-weight:700;
    letter-spacing:.08em; text-transform:uppercase;
    margin-top:.4rem;
}
.about-copy { padding-left:1.5rem; }
.about-copy h2 { font-size:clamp(2.5rem,5vw,4.5rem); margin-bottom:1.5rem; }
.about-copy p { font-size:1.05rem; color:var(--body-text); margin-bottom:1.2rem; max-width:50ch; }

.kpi-grid {
    display:grid; grid-template-columns:repeat(3,1fr);
    gap:2rem; padding-top:2rem;
    border-top:1px solid rgba(26,20,16,.1); margin-top:2.5rem;
}
.kpi-box { text-align:center; }
.kpi-num {
    display:block; font-family:var(--ff-serif);
    font-size:3rem; color:var(--gold); line-height:1;
}
.kpi-lbl {
    display:block; font-size:.7rem; font-weight:700;
    letter-spacing:.15em; text-transform:uppercase;
    color:var(--muted); margin-top:.4rem;
}

/* ─── MARQUEE ─── */
.marquee-band {
    background:var(--off); padding:1.3rem 0; overflow:hidden;
    border-top:1px solid rgba(0,0,0,.05); border-bottom:1px solid rgba(0,0,0,.05);
}
.marquee-inner {
    display:inline-flex; gap:2rem;
    animation:marqueeScroll 22s linear infinite;
}
.marquee-inner span {
    font-family:var(--ff-serif); font-size:1.4rem;
    font-style:italic; color:var(--muted); flex-shrink:0;
}
.mq-dot { font-style:normal !important; color:var(--gold) !important; font-size:.8rem !important; }
@keyframes marqueeScroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ─── VISION ─── */
.vision-section {
    padding: clamp(3rem,6vw,5rem) var(--pad);
    background: var(--white);
}
.vision-grid {
    max-width:var(--max); margin:0 auto;
    display:grid; grid-template-columns:1fr 1.2fr;
    gap:clamp(3rem,6vw,8rem); align-items:center;
}
.vision-copy h2 { font-size:clamp(2.5rem,5vw,4.5rem); margin-bottom:1.5rem; }
.vision-copy p { font-size:1.05rem; color:var(--body-text); max-width:50ch; margin-bottom:2rem; }
.vision-img-wrap { height:clamp(380px,60vh,620px); overflow:hidden; }

/* ─── PROPERTIES ─── */
.properties-section {
    padding:clamp(3rem,6vw,5rem) 0;
    background:var(--off); overflow:hidden;
}
.props-header {
    padding:0 var(--pad);
    max-width:var(--max); margin:0 auto 4rem;
}
.props-header h2 { font-size:clamp(2.5rem,6vw,5rem); color:var(--dark); }

.props-scroller {
    padding:0 var(--pad) 3rem;
    max-width:var(--max); margin:0 auto;
}
.props-track {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.prop-card {
    width: 100%;
    background:var(--white); overflow:hidden;
    transition:transform .5s var(--ease), box-shadow .5s;
    display:flex; flex-direction:column;
    border: 1px solid rgba(0,0,0,.06);
}
.prop-card:hover { transform:translateY(-8px); box-shadow:0 15px 40px rgba(0,0,0,.08); }

.prop-img-box {
    height:280px; position:relative; overflow:hidden;
}
.prop-img-box img { transition:transform .8s var(--ease); }
.prop-card:hover .prop-img-box img { transform:scale(1.06); }
.prop-img-overlay {
    position:absolute; inset:0;
    background:linear-gradient(to top, rgba(26,20,16,.5) 0%, transparent 60%);
}
.prop-tag {
    position:absolute; bottom:1rem; left:1.5rem;
    background:var(--gold); color:var(--dark);
    font-size:.65rem; font-weight:700; letter-spacing:.1em;
    text-transform:uppercase; padding:.3rem .8rem;
}

.prop-info { padding:2rem; flex:1; display:flex; flex-direction:column; }
.prop-info h3 { font-size:1.9rem; color:var(--dark); margin-bottom:.8rem; }
.prop-info p { font-size:.9rem; color:var(--body-text); flex:1; margin-bottom:1.5rem; }

.prop-foot {
    display:flex; justify-content:space-between; align-items:center;
    border-top:1px solid rgba(0,0,0,.08); padding-top:1.2rem;
}
.prop-keys { font-size:.75rem; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; }
.prop-keys i { color:var(--gold); margin-right:.4rem; }
.prop-link {
    display:flex; align-items:center; gap:.5rem;
    font-size:.75rem; font-weight:700; color:var(--gold);
    text-transform:uppercase; letter-spacing:.1em;
    transition:gap .3s;
}
.prop-link:hover { gap:1rem; }

/* ─── PROPERTIES CTA CARD ─── */
.prop-card-cta {
    background: var(--off);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(0,0,0,.04);
}
.prop-cta-inner {
    padding: 3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 1.5rem;
}
.prop-cta-icon {
    font-size: 2.5rem;
    color: var(--gold);
}
.prop-cta-inner h3 {
    font-size: 2.2rem;
    color: var(--dark);
    line-height: 1.2;
}
.prop-cta-inner .btn-primary {
    margin-top: 0.5rem;
}

/* ─── OFFERS ─── */
.offers-section { padding:clamp(3rem,6vw,6rem) var(--pad); background:var(--white); }
.offers-hdr { max-width:var(--max); margin:0 auto 4rem; }
.offers-hdr h2 { font-size:clamp(2.5rem,6vw,5rem); }

.offers-mosaic {
    max-width:var(--max); margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1.5fr 1fr;
    grid-template-rows:auto;
    gap:2rem;
}
.offer-tile {
    background:var(--off); overflow:hidden;
    display:flex; flex-direction:column;
    transition:transform .5s var(--ease), box-shadow .5s;
    border: 1px solid rgba(0,0,0,.06);
}
.offer-tile:hover { transform:translateY(-6px); box-shadow:0 20px 50px rgba(0,0,0,.08); }
.offer-tile-lg { }

.offer-tile-img {
    height:240px; position:relative; overflow:hidden;
}
.offer-tile-lg .offer-tile-img { height:300px; }
.offer-tile-img img { transition:transform .8s var(--ease); }
.offer-tile:hover .offer-tile-img img { transform:scale(1.07); }
.offer-img-overlay {
    position:absolute; inset:0;
    background:linear-gradient(to top, rgba(26,20,16,.5) 0%, transparent 55%);
}
.offer-label {
    position:absolute; bottom:1rem; left:1.5rem;
    background:var(--gold); color:var(--dark);
    font-size:.65rem; font-weight:700; letter-spacing:.1em;
    text-transform:uppercase; padding:.3rem .8rem;
}

.offer-tile-body { padding:2rem; flex:1; display:flex; flex-direction:column; }
.offer-tile-body h3 { font-size:1.7rem; margin-bottom:.8rem; }
.offer-tile-body p { font-size:.9rem; color:var(--body-text); flex:1; margin-bottom:1.5rem; }
.offer-cta-link {
    display:inline-flex; align-items:center; gap:.5rem;
    font-size:.75rem; font-weight:700; letter-spacing:.12em;
    text-transform:uppercase; color:var(--gold);
    border-bottom:1px solid var(--gold); padding-bottom:3px;
    transition:gap .3s; align-self:flex-start;
}
.offer-cta-link:hover { gap:1rem; }

/* ─── TESTIMONIALS ─── */
.testimonials-section {
    position:relative; padding:clamp(4rem,8vw,8rem) var(--pad);
    background:var(--white); color:var(--dark);
    overflow:hidden;
}
.testi-bg { position:absolute; inset:0; }
.testi-bg img { filter:brightness(1); opacity: 0.05; }
.testi-bg-overlay {
    position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.9) 100%);
}
.testi-header {
    position: relative; z-index: 2;
    text-align: center;
    max-width: 800px;
    margin: 0 auto 4rem;
}
.testi-header h2 { font-size:clamp(2.5rem,6vw,4rem); margin-top:0.8rem; margin-bottom:1rem; color:var(--dark); }
.testi-header h2 em { color:var(--gold); }
.testi-header .section-tag { color: var(--gold); }

.testi-content { position:relative; z-index:2; max-width:var(--max); margin:0 auto; }

.testi-track {
    display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; margin-bottom:4rem;
    max-width: var(--max); margin-left: auto; margin-right: auto;
}

.testi-card {
    background:var(--white);
    border:1px solid rgba(0,0,0,.05);
    border-top: 4px solid var(--gold);
    padding:3rem 2.5rem;
    position: relative;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
    transition:transform .4s var(--ease), box-shadow .4s;
    z-index: 2;
}
.testi-card:hover { transform: translateY(-8px); box-shadow:0 20px 50px rgba(0,0,0,.06); }

.testi-quote-icon {
    position: absolute;
    top: -20px;
    right: 25px;
    font-size: 5rem;
    color: rgba(201,168,76,0.15); /* light gold */
    line-height: 1;
}

.testi-stars { color:var(--gold); margin-bottom:1.5rem; letter-spacing:.2rem; font-size: 0.9rem; }
.testi-card .testi-text {
    font-size:1.05rem; font-style:italic; font-family:var(--ff-serif);
    color:var(--body-text); line-height:1.8; margin-bottom:2.5rem;
    position: relative; z-index: 2;
}
.testi-author { display:flex; align-items:center; gap:1.2rem; }
.testi-avatar {
    width:50px; height:50px; border-radius:50%;
    background:var(--gold); color:var(--white);
    font-size:1.3rem; font-weight:700;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    box-shadow: 0 5px 15px rgba(201,168,76,0.4);
}
.testi-author strong { display:block; color:var(--dark); font-size:1rem; margin-bottom: 0.2rem; }
.testi-author span { display: block; font-size:.8rem; color:var(--muted); font-weight:600; text-transform: uppercase; letter-spacing: 0.05em; }

/* ─── TRUST BADGES ─── */
.testi-trust-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5rem;
    margin-top: 5rem;
    padding-top: 3rem;
    border-top: 1px solid rgba(0,0,0,.06);
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}
.trust-badge {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--dark);
    position: relative;
    z-index: 2;
}
.trust-badge i {
    width: 55px; height: 55px;
    border-radius: 50%;
    background: rgba(201,168,76,0.1);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem;
    color: var(--gold);
    transition: transform 0.4s var(--ease), background 0.4s;
}
.trust-badge:hover i {
    transform: scale(1.1) rotate(10deg);
    background: rgba(201,168,76,0.2);
}

/* ─── CONCIERGE CONTACT ─── */
.concierge-section { padding:0; background:var(--white); }
.concierge-split {
    display:grid; grid-template-columns:1fr 1fr;
    max-width:var(--max); margin:0 auto;
}
.concierge-visual { position:relative; min-height:600px; display:flex; align-items:center; justify-content:center; padding:3rem; }
.concierge-visual img { position:absolute; inset:0; z-index:1; }
.concierge-overlay-box {
    position:relative; z-index:2;
    background:rgba(255,255,255,.9); backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    padding:3.5rem; width:100%; max-width:480px; text-align:center;
    border:1px solid rgba(255,255,255,1);
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
    border-radius: 12px;
}
.concierge-overlay-box .section-tag { margin-bottom:.8rem; }
.concierge-overlay-box h2 { font-size:2.8rem; margin-bottom:1rem; color: var(--dark); }
.concierge-overlay-box p { font-size:.95rem; color:var(--body-text); margin-bottom:2.5rem; }

.c-link-cards { display:flex; flex-direction:column; gap:1rem; }
.c-link-cards a {
    display:flex; align-items:center; gap:1.2rem;
    padding:1.2rem; background:var(--white);
    border:1px solid rgba(0,0,0,.06); text-align:left;
    transition:border-color .3s, transform .3s;
}
.c-link-cards a:hover { border-color:var(--gold); transform:translateX(5px); }
.c-link-cards a i { font-size:1.5rem; color:var(--gold); width:30px; text-align:center; }
.c-link-cards a small { display:block; font-size:.65rem; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); margin-bottom:.2rem; }
.c-link-cards a strong { display:block; font-size:.9rem; color:var(--dark); }

.concierge-form-area {
    background:var(--off);
    padding:clamp(4rem,8vw,8rem) clamp(2rem,5vw,5rem);
    display:flex; align-items:center;
}
.premium-form { width:100%; max-width:540px; margin:0 auto; }
.pf-header { margin-bottom:3rem; }
.pf-header h3 { font-size:2.2rem; margin-bottom:.5rem; }
.pf-header p { font-size:.95rem; color:var(--body-text); }

.pf-row { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:1.5rem; }
.pf-field { margin-bottom:1.5rem; position:relative; }
.pf-row .pf-field { margin-bottom:0; }
.pf-field label {
    display:block; font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.1em;
    color:var(--dark); margin-bottom:.4rem;
}
.pf-field input, .pf-field textarea {
    width:100%; 
    background: rgba(255,255,255,0.7);
    border: 1px solid rgba(0,0,0,.08);
    padding: 1rem 1.2rem; 
    font-family: var(--ff-sans); font-size: .95rem; color: var(--dark);
    transition: all .3s; outline: none;
    border-radius: 6px;
}
.pf-field input:focus, .pf-field textarea:focus { 
    border-color: var(--gold); 
    background: var(--white);
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.1);
}
.pf-field textarea { min-height:120px; resize:vertical; }

/* ─── ARTICLES & NEWS ─── */
.articles-section { background: var(--white); padding: clamp(3rem, 6vw, 6rem) var(--pad); }
.articles-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2.5rem; max-width: var(--max); margin: 0 auto; }
.article-card {
    display: block; background: var(--off); text-decoration: none; border-radius: 12px;
    overflow: hidden; transition: transform 0.4s var(--ease), box-shadow 0.4s;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
}
.article-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
}
.article-img {
    width: 100%; height: 280px; object-fit: cover;
    transition: transform 0.6s var(--ease);
}
.article-card:hover .article-img {
    transform: scale(1.05);
}
.article-body {
    padding: 2rem;
}
.article-date {
    font-size: 0.8rem; color: var(--gold); text-transform: uppercase; letter-spacing: 0.1em;
    font-weight: 600; margin-bottom: 0.8rem;
}
.article-title {
    font-family: var(--ff-serif); font-size: 1.5rem; color: var(--dark);
    margin-bottom: 1rem; line-height: 1.3;
}
.article-excerpt {
    font-size: 0.95rem; color: var(--body-text); line-height: 1.6;
    margin-bottom: 1.5rem;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.article-readmore {
    font-size: 0.85rem; font-weight: 600; color: var(--dark);
    text-transform: uppercase; letter-spacing: 0.1em;
    display: flex; align-items: center; gap: 0.5rem; transition: color 0.3s;
}
.article-card:hover .article-readmore {
    color: var(--gold);
}

/* ─── FOOTER ─── */
.site-footer { background:#1c1c1f; color:var(--white); border-top: 3px solid var(--gold); }
.footer-inner {
    max-width:var(--max); margin:0 auto;
    padding: 4rem var(--pad) 3rem;
    display:grid; grid-template-columns:2fr 1fr 1fr; gap:4rem;
}
.footer-logo-wrapper {
    user-select: none;
}
.f-logo { 
    max-width:250px; 
    height:auto; 
    margin-top: -85px; 
    margin-bottom: -80px; 
    transition: transform 0.4s var(--ease), filter 0.4s; 
    filter: brightness(0) invert(1);
    transform-origin: left center;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
}
.f-logo:hover { 
    transform: scale(1.05); 
    filter: drop-shadow(0 8px 20px rgba(212,175,55,0.25));
}
.f-col-brand p { font-size:.95rem; color:#9ca3af; max-width:32ch; margin-bottom:2.5rem; line-height: 1.8; }
.f-socials { display:flex; gap:1rem; }
.f-socials a {
    width:42px; height:42px; border:1px solid rgba(255,255,255,.08);
    display:flex; align-items:center; justify-content:center;
    color:#d1d5db; transition:all .4s var(--ease); border-radius:50%; background: rgba(255,255,255,0.02);
}
.f-socials a:hover { 
    border-color:var(--gold); 
    background:var(--gold); 
    color:#000; 
    transform: translateY(-5px) scale(1.1); 
    box-shadow: 0 10px 20px rgba(212,175,55,0.3);
}

.footer-inner h6 {
    font-family:var(--ff-sans); font-size:.8rem; font-weight:700;
    letter-spacing:.2em; text-transform:uppercase; color:var(--white);
    margin-bottom:2rem; position: relative; display: inline-block;
}
.footer-inner h6::after {
    content: ''; position: absolute; left: 0; bottom: -8px;
    width: 30px; height: 1px; background: var(--gold);
}
.f-col-links ul li, .f-col-contact ul li { margin-bottom:1.2rem; }
.f-col-links a, .f-col-contact a, .f-col-contact span {
    display: inline-flex; align-items: center;
    font-size:.95rem; color:#9ca3af; transition:all .4s var(--ease);
}
.f-col-links a::before {
    content: '\f105'; font-family: 'Font Awesome 6 Free'; font-weight: 900;
    color: var(--gold); font-size: 0.8rem; opacity: 0; width: 0;
    transform: translateX(-10px); transition: all .4s var(--ease);
}
.f-col-links a:hover::before { opacity: 1; width: 15px; transform: translateX(0); }
.f-col-links a:hover, .f-col-contact a:hover { 
    color:var(--white); 
    transform: translateX(6px); 
}

.footer-bottom { border-top:1px solid rgba(255,255,255,.05); background: #141416; }
.f-bottom-inner {
    max-width:var(--max); margin:0 auto; padding:2rem var(--pad);
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1.5rem;
}
.f-bottom-inner p { font-size:.85rem; color:#6b7280; }
.f-payments { display:flex; gap:1.2rem; font-size:1.6rem; color:#4b5563; }
.f-legal { display:flex; gap:1.2rem; font-size:.85rem; color:#6b7280; }
.f-legal a { color: #6b7280; text-decoration: none; transition: color 0.3s; }
.f-legal a:hover { color:#d1d5db; }
.f-legal .sep { color:#374151; }

/* ─── WHATSAPP FLOAT ─── */
.wa-float {
    position: fixed;
    bottom: 2.5rem; right: 2.5rem;
    z-index: 600;
    width: 58px; height: 58px;
    background: #25d366;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--white);
    font-size: 1.7rem;
    box-shadow: 0 8px 30px rgba(37,211,102,.4);
    transition: transform .35s var(--ease), box-shadow .35s;
    animation: waPulse 3s ease infinite;
}
.wa-float:hover { transform:scale(1.12); box-shadow:0 12px 40px rgba(37,211,102,.5); }
@keyframes waPulse {
    0%,100% { box-shadow:0 8px 30px rgba(37,211,102,.4); }
    50%      { box-shadow:0 8px 30px rgba(37,211,102,.7), 0 0 0 12px rgba(37,211,102,.1); }
}

.wa-tooltip {
    position: absolute;
    right: calc(100% + 14px);
    top: 50%; transform: translateY(-50%);
    background: var(--dark);
    color: var(--white);
    font-size: .75rem; font-weight: 500;
    white-space: nowrap;
    padding: .5rem 1rem;
    border-radius: 4px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s;
}
.wa-tooltip::after {
    content: '';
    position: absolute;
    left: 100%; top: 50%; transform: translateY(-50%);
    border: 6px solid transparent;
    border-left-color: var(--dark);
}
.wa-float:hover .wa-tooltip { opacity: 1; }

/* ─── SCROLL TO TOP ─── */
.scroll-top-btn {
    position: fixed;
    bottom: 2.5rem;
    left: 2.5rem;
    width: 50px;
    height: 50px;
    background: var(--gold);
    color: var(--white);
    border: none;
    border-radius: 50%;
    font-size: 1.2rem;
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(201, 168, 76, 0.4);
    opacity: 0;
    pointer-events: none;
    transform: translateY(20px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}
.scroll-top-btn.visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
.scroll-top-btn:hover {
    background: var(--dark);
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

/* ─── ANIMATIONS ─── */
.fade-up {
    opacity:0; transform:translateY(28px);
    transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.fade-up.visible { opacity:1; transform:translateY(0); }

/* ─── RESPONSIVE ─── */
@media (max-width:1100px) {
    .about-grid, .vision-grid { grid-template-columns:1fr; gap:3rem; }
    .vision-copy { order: 2; }
    .vision-img-wrap { order: 1; }
    .about-copy { padding-left:0; }
    .about-kpi-badge { right:1rem; }
    .offers-mosaic { grid-template-columns:1fr 1fr; }
    .offer-tile-lg { grid-column:span 2; }
    .testi-track { grid-template-columns:1fr; gap:1.5rem; }
    .concierge-split { grid-template-columns:1fr; }
    .concierge-visual { min-height:450px; }
    .footer-inner { grid-template-columns:1fr 1fr; }
    .f-col-brand { grid-column:span 2; }
}

@media (max-width:900px) {
    .booking-row {
        grid-template-columns:1fr 1fr;
    }
    .booking-row .booking-field-new:nth-child(4) { border-right:none; }
    .booking-search-btn { grid-column:span 2; min-height:55px; }
}

@media (max-width:768px) {
    .hdr-nav, .hdr-book-btn { display:none; }
    .burger { display:flex; }

    .hdr-logo { width: 140px; height: 35px; max-width: 60vw; display: flex; align-items: center; margin: 4px 0 0 0; padding: 0; overflow: hidden; position: relative; }
    .hdr-logo img { position: absolute; width: 110%; height: auto; left: -5%; top: 50%; transform: translateY(-50%); pointer-events: none; }

    #site-header { top:0; width:100%; max-width:100%; border-radius:0; border:none;
        border-bottom:1px solid rgba(0,0,0,.08); padding:0.5rem 1rem; box-sizing: border-box; }

    h2 { font-size:clamp(2rem,8vw,3.5rem) !important; }
    h1 { font-size:clamp(2.5rem,10vw,4.5rem); } /* Prevent huge text breaking mobile layout */

    .hero-sub { font-size:.7rem; gap:1rem; }
    .hero-btns { flex-direction:column; align-items:center; gap:1rem; }
    .hero-scroll-track { display:none; }

    .booking-row { grid-template-columns:1fr; }
    .booking-field-new { border-right:none; border-bottom:1px solid rgba(0,0,0,.1); }
    .booking-search-btn { grid-column:auto; min-height:55px; }
    .booking-extras { justify-content:center; }
    .booking-extra-note { margin-left:0; }

    .about-img-wrap { height:42vh; }
    .kpi-grid { grid-template-columns:repeat(3,1fr); gap:1rem; }

    .props-track { grid-template-columns:1fr; }

    .offers-mosaic { grid-template-columns:1fr; }
    .offer-tile-lg { grid-column:auto; }
    .offer-tile-lg .offer-tile-img { height:240px; }

    .pf-row { grid-template-columns:1fr; }

    /* Fix Book CTA for mobile */
    .book-cta-inner { flex-direction: column; text-align: left; gap: 2rem; }
    .book-cta-actions { flex-direction: column; width: 100%; align-items: stretch; gap: 1rem; }
    .book-cta-actions a { width: 100%; justify-content: center; }
    
    /* Fix Contact mobile */
    .concierge-visual { padding: 2rem 1.2rem; min-height: 400px; }
    .concierge-overlay-box { padding: 2rem 1.5rem; width: 100%; box-sizing: border-box; }
    .concierge-form-area { padding: 3rem 1.2rem; }
    .pf-header { margin-bottom: 2rem; }

    .footer-inner { grid-template-columns:1fr; }
    .f-col-brand { grid-column:auto; text-align: center; }
    .f-logo { margin: -85px auto -60px auto; transform-origin: center; max-width: 200px; display: block; }
    .f-col-brand p { margin: 0 auto 2.5rem auto; text-align: center; }
    .f-socials { justify-content: center; margin-bottom: 2rem; }
    .f-bottom-inner { flex-direction:column; text-align:center; }

    .wa-float { bottom:1.5rem; right:1.5rem; width:52px; height:52px; font-size:1.5rem; }
}

@media (max-width:480px) {
    :root { --pad:1.2rem; }
    .testi-trust-row { flex-direction:column; gap:1.5rem; }
    .booking-section { padding:4rem var(--pad); }
}

/* ─── FORM MESSAGES ─── */
.msg-success, .msg-error {
    margin-top: 1.5rem;
    padding: 1rem 1.5rem;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    animation: fadeUpMsg 0.5s ease forwards;
}

.msg-success {
    background: rgba(46, 204, 113, 0.1);
    color: #27ae60;
    border: 1px solid rgba(46, 204, 113, 0.3);
}
.msg-success::before {
    content: '\f058'; /* FontAwesome check-circle */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 1.2rem;
}

.msg-error {
    background: rgba(231, 76, 60, 0.1);
    color: #c0392b;
    border: 1px solid rgba(231, 76, 60, 0.3);
}
.msg-error::before {
    content: '\f071'; /* FontAwesome exclamation-triangle */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 1.2rem;
}

@keyframes fadeUpMsg {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}