/* =============================================================
   ISTANBUL PENTHOUSE — TRUMP RESIDENCE
   Editorial Luxury Theme
   ============================================================= */

/* ---------- Fonts ---------- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400&family=Jost:wght@200;300;400;500;600&family=DM+Mono:wght@300;400;500&display=swap');

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{background:none;border:none;cursor:pointer;font:inherit;color:inherit}
ul,ol{list-style:none}

/* ---------- Theme Tokens ---------- */
:root{
    /* Colors */
    --black:#0a0a0a;
    --ink:#141414;
    --charcoal:#1c1c1c;
    --graphite:#242424;
    --border:#2a2a2a;
    --border-soft:#1f1f1f;
    --muted:#8a8580;
    --muted-light:#b8b3ad;
    --cream:#f5f1ea;
    --bone:#ebe6dd;
    --white:#ffffff;

    /* Gold palette */
    --gold:#c9a961;
    --gold-light:#d4b87a;
    --gold-dark:#a88a48;
    --gold-glow:rgba(201,169,97,.18);

    /* Fonts */
    --font-display:'Cormorant Garamond', 'Times New Roman', serif;
    --font-body:'Jost', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono:'DM Mono', 'Courier New', monospace;

    /* Type scale */
    --fs-mega:clamp(3.5rem,8vw,7.5rem);
    --fs-hero:clamp(2.8rem,6vw,5.5rem);
    --fs-h1:clamp(2.4rem,5vw,4.5rem);
    --fs-h2:clamp(1.8rem,3.5vw,3rem);
    --fs-h3:clamp(1.4rem,2vw,1.8rem);
    --fs-body:1rem;
    --fs-small:.875rem;
    --fs-micro:.75rem;

    /* Spacing */
    --space-xxl:10rem;
    --space-xl:7rem;
    --space-lg:5rem;
    --space-md:3rem;
    --space-sm:1.5rem;

    /* Containers */
    --container:1440px;
    --container-narrow:1200px;
    --container-text:860px;

    /* Transitions */
    --ease:cubic-bezier(.22,.61,.36,1);
    --ease-out:cubic-bezier(.16,1,.3,1);
    --t-fast:.3s var(--ease);
    --t-med:.6s var(--ease);
    --t-slow:1.1s var(--ease-out);
}

/* ---------- Base ---------- */
body{
    font-family:var(--font-body);
    font-weight:300;
    font-size:var(--fs-body);
    line-height:1.65;
    color:var(--cream);
    background:var(--black);
    letter-spacing:.01em;
}

/* ---------- Typography ---------- */
h1,h2,h3,h4,h5{
    font-family:var(--font-display);
    font-weight:400;
    line-height:1.08;
    letter-spacing:-.01em;
    color:var(--cream);
}
h1{font-size:var(--fs-hero)}
h2{font-size:var(--fs-h1)}
h3{font-size:var(--fs-h2)}
h4{font-size:var(--fs-h3)}

.display{
    font-family:var(--font-display);
    font-style:italic;
    font-weight:300;
}

.eyebrow{
    font-family:var(--font-mono);
    font-size:var(--fs-micro);
    font-weight:400;
    letter-spacing:.3em;
    text-transform:uppercase;
    color:var(--gold);
    display:inline-flex;
    align-items:center;
    gap:.8rem;
}
.eyebrow::before{
    content:"";
    width:2.2rem;
    height:1px;
    background:var(--gold);
    display:inline-block;
}

.section-number{
    font-family:var(--font-mono);
    font-size:var(--fs-micro);
    letter-spacing:.25em;
    color:var(--gold);
    text-transform:uppercase;
    display:block;
    margin-bottom:1.2rem;
}

p{
    color:var(--muted-light);
    max-width:65ch;
}

/* ---------- Utilities ---------- */
.container{
    width:100%;
    max-width:var(--container);
    margin:0 auto;
    padding:0 2rem;
}
.container-narrow{max-width:var(--container-narrow)}

section{padding:var(--space-xl) 0;position:relative}

.divider{
    width:80px;
    height:1px;
    background:var(--gold);
    margin:1.5rem 0;
}

.reveal{
    opacity:0;
    transform:translateY(40px);
    transition:opacity 1s var(--ease-out), transform 1.2s var(--ease-out);
}
.reveal.in{opacity:1;transform:none}

/* =============================================================
   NAV
   ============================================================= */
.nav{
    position:fixed;
    top:0;left:0;right:0;
    z-index:100;
    padding:1.5rem 2rem;
    background:transparent;
    transition:background var(--t-med), padding var(--t-med), border-color var(--t-med);
    border-bottom:1px solid transparent;
}
.nav.scrolled{
    background:rgba(10,10,10,.88);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    padding:1rem 2rem;
    border-bottom-color:var(--border-soft);
}
.nav-inner{
    max-width:var(--container);
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2rem;
}
.nav-logo{
    display:flex;
    align-items:center;
    color:var(--cream);
}
.nav-logo svg{height:42px;width:auto;color:var(--gold);transition:opacity .3s}
.nav-logo:hover svg{opacity:.85}

.nav-menu{
    display:flex;
    gap:2.2rem;
    align-items:center;
}
.nav-menu a{
    font-family:var(--font-mono);
    font-size:.72rem;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:var(--cream);
    position:relative;
    padding:.5rem 0;
    transition:color var(--t-fast);
}
.nav-menu a::after{
    content:"";
    position:absolute;
    left:0;bottom:0;
    height:1px;
    width:0;
    background:var(--gold);
    transition:width var(--t-med);
}
.nav-menu a:hover{color:var(--gold)}
.nav-menu a:hover::after{width:100%}

.nav-right{
    display:flex;
    align-items:center;
    gap:1.5rem;
}

.lang-switch{
    display:flex;
    align-items:center;
    gap:.6rem;
    font-family:var(--font-mono);
    font-size:.72rem;
    letter-spacing:.15em;
}
.lang-switch button{
    color:var(--muted);
    padding:.3rem;
    transition:color var(--t-fast);
}
.lang-switch button.active{color:var(--gold)}
.lang-switch .sep{color:var(--border);}

.nav-cta{
    padding:.8rem 1.4rem;
    border:1px solid var(--gold);
    color:var(--gold);
    font-family:var(--font-mono);
    font-size:.68rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    transition:all var(--t-fast);
    background:transparent;
}
.nav-cta:hover{
    background:var(--gold);
    color:var(--black);
}

.nav-toggle{
    display:none;
    flex-direction:column;
    gap:5px;
    padding:.5rem;
}
.nav-toggle span{
    width:22px;
    height:1px;
    background:var(--cream);
    transition:var(--t-fast);
}

/* =============================================================
   HERO SLIDER
   ============================================================= */
.hero{
    height:100vh;
    min-height:680px;
    position:relative;
    overflow:hidden;
    background:var(--black);
}
.hero-slider{
    position:absolute;
    inset:0;
}
.hero-slide{
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity 1.4s var(--ease-out);
    background-size:cover;
    background-position:center;
    background-color:var(--ink);
}
.hero-slide.active{opacity:1}
.hero-slide::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(10,10,10,.35) 0%, rgba(10,10,10,.15) 40%, rgba(10,10,10,.85) 100%),
        linear-gradient(90deg, rgba(10,10,10,.45) 0%, transparent 50%);
}

.hero-content{
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    align-items:flex-end;
    padding:0 2rem var(--space-lg);
}
.hero-content-inner{
    max-width:var(--container);
    margin:0 auto;
    width:100%;
}
.hero-eyebrow{margin-bottom:1.5rem}

.hero-title{
    font-size:var(--fs-mega);
    font-weight:300;
    line-height:.95;
    letter-spacing:-.02em;
    max-width:16ch;
    margin-bottom:1.5rem;
}
.hero-title em{
    font-style:italic;
    font-weight:300;
    color:var(--gold);
}
.hero-sub{
    font-size:1.15rem;
    max-width:48ch;
    color:var(--bone);
    margin-bottom:2.5rem;
    line-height:1.6;
}
.hero-meta{
    display:flex;
    align-items:center;
    gap:2.5rem;
    flex-wrap:wrap;
    padding-top:2rem;
    border-top:1px solid rgba(201,169,97,.25);
    max-width:700px;
}
.hero-meta-item{
    font-family:var(--font-mono);
    font-size:.7rem;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--bone);
}
.hero-meta-item strong{
    display:block;
    font-family:var(--font-display);
    font-size:1.8rem;
    letter-spacing:-.02em;
    color:var(--gold);
    font-weight:400;
    text-transform:none;
    margin-top:.3rem;
}

/* Slider UI */
.slider-nav{
    position:absolute;
    bottom:2rem;
    right:2rem;
    z-index:3;
    display:flex;
    align-items:center;
    gap:1.2rem;
}
.slider-arrow{
    width:52px;height:52px;
    border:1px solid rgba(245,241,234,.25);
    border-radius:50%;
    display:grid;place-items:center;
    color:var(--cream);
    transition:all var(--t-fast);
}
.slider-arrow:hover{
    border-color:var(--gold);
    color:var(--gold);
    background:var(--gold-glow);
}
.slider-arrow svg{width:14px;height:14px}

.slider-count{
    font-family:var(--font-mono);
    font-size:.72rem;
    letter-spacing:.2em;
    color:var(--cream);
    min-width:60px;
    text-align:center;
}
.slider-count .current{color:var(--gold);font-size:1rem}

.slider-dots{
    position:absolute;
    left:2rem;bottom:2.5rem;
    z-index:3;
    display:flex;
    gap:.6rem;
}
.slider-dots button{
    width:28px;height:2px;
    background:rgba(245,241,234,.25);
    transition:background var(--t-fast);
}
.slider-dots button.active{background:var(--gold)}

.scroll-ind{
    position:absolute;
    left:50%;bottom:2.5rem;
    transform:translateX(-50%);
    z-index:3;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.6rem;
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    color:var(--cream);
    text-transform:uppercase;
    opacity:.7;
}
.scroll-ind-line{
    width:1px;height:40px;
    background:linear-gradient(180deg,var(--gold),transparent);
    animation:scrollPulse 2.4s var(--ease) infinite;
}
@keyframes scrollPulse{
    0%,100%{transform:scaleY(1);opacity:.6}
    50%{transform:scaleY(1.4);opacity:1}
}

/* =============================================================
   VIDEO SECTION
   ============================================================= */
.video-section{
    padding:var(--space-xl) 0 var(--space-lg);
    background:var(--black);
    position:relative;
}
.video-intro{
    max-width:var(--container-narrow);
    margin:0 auto var(--space-md);
    padding:0 2rem;
    display:grid;
    grid-template-columns:1fr 1.4fr;
    gap:4rem;
    align-items:end;
}
.video-intro h2{
    font-size:var(--fs-h1);
    line-height:1.05;
}
.video-intro h2 em{color:var(--gold);font-style:italic;font-weight:300}
.video-intro p{
    font-size:1.05rem;
    color:var(--muted-light);
}

.video-frame{
    max-width:var(--container);
    margin:0 auto;
    padding:0 2rem;
    position:relative;
}
.video-wrapper{
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
    background:var(--ink);
    border:1px solid var(--border-soft);
}
.video-wrapper video,
.video-wrapper iframe{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.video-poster{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    cursor:pointer;
    z-index:2;
    transition:opacity var(--t-med);
}
.video-poster.hidden{opacity:0;pointer-events:none}
.video-poster::before{
    content:"";
    position:absolute;inset:0;
    background:linear-gradient(0deg,rgba(10,10,10,.4),rgba(10,10,10,.05));
}
.play-btn{
    position:absolute;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    width:100px;height:100px;
    border:1px solid var(--gold);
    border-radius:50%;
    display:grid;place-items:center;
    background:rgba(10,10,10,.3);
    transition:all var(--t-fast);
    z-index:2;
}
.play-btn::before{
    content:"";
    position:absolute;inset:-12px;
    border:1px solid rgba(201,169,97,.3);
    border-radius:50%;
    animation:pulse 2.4s var(--ease) infinite;
}
@keyframes pulse{
    0%,100%{transform:scale(1);opacity:.6}
    50%{transform:scale(1.15);opacity:.2}
}
.play-btn:hover{
    background:var(--gold);
}
.play-btn:hover svg{fill:var(--black)}
.play-btn svg{
    width:24px;height:24px;
    fill:var(--gold);
    margin-left:3px;
    transition:fill var(--t-fast);
}

.video-caption{
    position:absolute;
    bottom:1.5rem;left:3rem;
    z-index:3;
    color:var(--cream);
    font-family:var(--font-mono);
    font-size:.7rem;
    letter-spacing:.22em;
    text-transform:uppercase;
}

/* =============================================================
   ABOUT / INTRO
   ============================================================= */
.about{
    padding:var(--space-xl) 0;
    background:var(--ink);
    position:relative;
    overflow:hidden;
}
.about::before{
    content:"TRUMP";
    position:absolute;
    right:-2rem;top:50%;
    transform:translateY(-50%);
    font-family:var(--font-display);
    font-size:clamp(12rem,22vw,22rem);
    font-weight:400;
    color:var(--graphite);
    line-height:.8;
    letter-spacing:-.05em;
    z-index:0;
    user-select:none;
    pointer-events:none;
}
.about-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:1fr 1.3fr;
    gap:5rem;
    align-items:start;
}
.about-head h2{
    font-size:var(--fs-h1);
    line-height:1.05;
    margin-top:1rem;
    margin-bottom:2rem;
}
.about-head h2 em{color:var(--gold);font-style:italic;font-weight:300}

.about-stats{
    margin-top:3rem;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:2rem 1rem;
    padding-top:2.5rem;
    border-top:1px solid var(--border);
}
.about-stats .stat{
    display:flex;
    flex-direction:column;
    gap:.5rem;
}
.about-stats .stat-val{
    font-family:var(--font-display);
    font-size:2.8rem;
    line-height:1;
    color:var(--gold);
    font-weight:400;
}
.about-stats .stat-label{
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--muted);
}

.about-body p{
    font-size:1.1rem;
    line-height:1.8;
    margin-bottom:1.5rem;
    color:var(--muted-light);
}
.about-body p:first-child::first-line{
    font-family:var(--font-display);
    font-size:1.35rem;
    color:var(--cream);
    letter-spacing:.01em;
}
.about-sign{
    margin-top:2.5rem;
    padding-top:2rem;
    border-top:1px solid var(--border);
    display:flex;
    align-items:center;
    gap:1.5rem;
    font-family:var(--font-mono);
    font-size:.7rem;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:var(--muted);
}
.about-sign strong{color:var(--gold);font-weight:400}

/* =============================================================
   FEATURES / SIGNATURE
   ============================================================= */
.features{
    padding:var(--space-xl) 0;
    background:var(--black);
    position:relative;
}
.features-head{
    text-align:center;
    max-width:720px;
    margin:0 auto var(--space-md);
}
.features-head .eyebrow{justify-content:center}
.features-head .eyebrow::before{display:none}
.features-head .eyebrow::after{
    content:"";
    width:2.2rem;
    height:1px;
    background:var(--gold);
}
.features-head .eyebrow{
    gap:.8rem;
}
.features-head h2{
    margin-top:1.5rem;
    font-size:var(--fs-h1);
}
.features-head h2 em{color:var(--gold);font-style:italic;font-weight:300}

.features-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:var(--border-soft);
    border:1px solid var(--border-soft);
}
.feature-card{
    background:var(--black);
    padding:3rem 2.5rem;
    transition:background var(--t-med);
    position:relative;
    overflow:hidden;
    min-height:320px;
    display:flex;
    flex-direction:column;
}
.feature-card:hover{background:var(--ink)}
.feature-card::before{
    content:"";
    position:absolute;
    top:0;left:0;
    width:0;height:1px;
    background:var(--gold);
    transition:width var(--t-slow);
}
.feature-card:hover::before{width:100%}

.feature-icon{
    width:44px;height:44px;
    margin-bottom:2rem;
    color:var(--gold);
}
.feature-icon svg{width:100%;height:100%;stroke-width:1.2}
.feature-num{
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    color:var(--muted);
    position:absolute;
    top:2rem;right:2.5rem;
}
.feature-card h3{
    font-family:var(--font-display);
    font-size:1.6rem;
    line-height:1.2;
    margin-bottom:1rem;
    color:var(--cream);
}
.feature-card p{
    font-size:.92rem;
    color:var(--muted-light);
    line-height:1.7;
    flex-grow:1;
}

/* =============================================================
   AMENITIES
   ============================================================= */
.amenities{
    padding:var(--space-xl) 0;
    background:var(--ink);
}
.amenities-head{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:4rem;
    align-items:end;
    margin-bottom:var(--space-md);
}
.amenities-head h2{font-size:var(--fs-h1);line-height:1.05}
.amenities-head h2 em{color:var(--gold);font-style:italic;font-weight:300}

.amenities-grid{
    display:grid;
    grid-template-columns:repeat(12,1fr);
    grid-auto-rows:minmax(240px, auto);
    gap:1rem;
}
.amenity{
    position:relative;
    overflow:hidden;
    background:var(--graphite);
    cursor:default;
}
.amenity img{
    width:100%;height:100%;
    object-fit:cover;
    transition:transform 1.2s var(--ease-out), filter var(--t-med);
    filter:brightness(.85) saturate(.95);
}
.amenity:hover img{transform:scale(1.04);filter:brightness(1) saturate(1)}
.amenity-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(10,10,10,.88) 0%,rgba(10,10,10,.15) 55%,rgba(10,10,10,0) 100%);
    pointer-events:none;
}
.amenity-content{
    position:absolute;
    left:1.8rem;bottom:1.5rem;right:1.8rem;
    z-index:2;
}
.amenity-content h4{
    font-family:var(--font-display);
    font-size:1.8rem;
    line-height:1.1;
    color:var(--cream);
    margin-bottom:.4rem;
}
.amenity-content span{
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--gold);
}

.amenity.large{grid-column:span 7;grid-row:span 2}
.amenity.medium{grid-column:span 5}
.amenity.small{grid-column:span 4}
.amenity.wide{grid-column:span 8}

/* =============================================================
   LOCATION
   ============================================================= */
.location{
    padding:var(--space-xl) 0;
    background:var(--black);
}
.location-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:5rem;
    align-items:center;
}
.location-content h2{
    font-size:var(--fs-h1);
    line-height:1.05;
    margin-top:1.5rem;
    margin-bottom:2rem;
}
.location-content h2 em{color:var(--gold);font-style:italic;font-weight:300}
.location-content > p{
    font-size:1.05rem;
    margin-bottom:2.5rem;
    line-height:1.75;
}

.distances{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.5rem;
    margin-top:2rem;
    padding-top:2rem;
    border-top:1px solid var(--border);
}
.distances li{
    padding:1rem 0;
    border-bottom:1px solid var(--border-soft);
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:1rem;
    font-family:var(--font-mono);
    font-size:.75rem;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.distances li strong{
    color:var(--gold);
    font-weight:400;
    font-family:var(--font-display);
    font-size:1.1rem;
    letter-spacing:0;
    text-transform:none;
}

.location-visual{
    position:relative;
    aspect-ratio:4/5;
    background:var(--ink);
    overflow:hidden;
    border:1px solid var(--border-soft);
}
.location-visual img{
    width:100%;height:100%;object-fit:cover;
    filter:grayscale(.2) brightness(.92);
}
.location-badge{
    position:absolute;
    top:1.5rem;left:1.5rem;
    padding:.7rem 1.2rem;
    background:rgba(10,10,10,.85);
    backdrop-filter:blur(12px);
    border:1px solid var(--gold);
    font-family:var(--font-mono);
    font-size:.7rem;
    letter-spacing:.2em;
    color:var(--gold);
    text-transform:uppercase;
}

/* =============================================================
   GALLERY
   ============================================================= */
.gallery{
    padding:var(--space-xl) 0;
    background:var(--ink);
    overflow:hidden;
}
.gallery-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    margin-bottom:var(--space-md);
    gap:2rem;
    flex-wrap:wrap;
}
.gallery-head h2{font-size:var(--fs-h1)}
.gallery-head h2 em{color:var(--gold);font-style:italic;font-weight:300}

.gallery-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    grid-auto-rows:220px;
    gap:.75rem;
}
.gallery-item{
    position:relative;
    overflow:hidden;
    background:var(--graphite);
    cursor:pointer;
}
.gallery-item img{
    width:100%;height:100%;object-fit:cover;
    transition:transform 1s var(--ease-out);
}
.gallery-item:hover img{transform:scale(1.05)}

.gallery-item.tall{grid-row:span 2}
.gallery-item.wide{grid-column:span 2}
.gallery-item.feature{grid-column:span 2;grid-row:span 2}

/* =============================================================
   INVESTMENT
   ============================================================= */
.investment{
    padding:var(--space-xl) 0;
    background:var(--black);
    position:relative;
}
.investment-inner{
    max-width:var(--container-narrow);
    margin:0 auto;
    padding:0 2rem;
    text-align:center;
}
.investment-inner .eyebrow{justify-content:center;margin-bottom:1.5rem}
.investment-inner .eyebrow::after{
    content:"";width:2.2rem;height:1px;background:var(--gold);
}
.investment-inner h2{
    font-size:var(--fs-h1);
    max-width:20ch;
    margin:1rem auto 2rem;
    line-height:1.1;
}
.investment-inner h2 em{color:var(--gold);font-style:italic;font-weight:300}
.investment-inner > p{
    font-size:1.1rem;
    max-width:60ch;
    margin:0 auto var(--space-md);
    color:var(--muted-light);
}
.investment-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:0;
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
}
.inv-stat{
    padding:2.5rem 1.5rem;
    border-right:1px solid var(--border);
    text-align:center;
}
.inv-stat:last-child{border-right:none}
.inv-stat-num{
    font-family:var(--font-display);
    font-size:3rem;
    line-height:1;
    color:var(--gold);
    font-weight:400;
    margin-bottom:.5rem;
}
.inv-stat-label{
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--muted);
}

/* =============================================================
   CONTACT / CTA
   ============================================================= */
.contact{
    padding:var(--space-xl) 0;
    background:var(--ink);
    position:relative;
    overflow:hidden;
}
.contact::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(ellipse at 20% 50%, rgba(201,169,97,.07) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(201,169,97,.05) 0%, transparent 50%);
    pointer-events:none;
}
.contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:5rem;
    position:relative;
    z-index:1;
}
.contact-info h2{
    font-size:var(--fs-h1);
    line-height:1.05;
    margin-top:1rem;
    margin-bottom:2rem;
}
.contact-info h2 em{color:var(--gold);font-style:italic;font-weight:300}
.contact-info > p{
    font-size:1.05rem;
    margin-bottom:2.5rem;
    line-height:1.7;
}
.contact-methods{
    display:flex;
    flex-direction:column;
    gap:1.5rem;
    padding-top:2rem;
    border-top:1px solid var(--border);
}
.contact-method{
    display:flex;
    align-items:center;
    gap:1.2rem;
}
.contact-method .ico{
    width:42px;height:42px;
    border:1px solid var(--border);
    border-radius:50%;
    display:grid;place-items:center;
    color:var(--gold);
    flex-shrink:0;
}
.contact-method .ico svg{width:16px;height:16px}
.contact-method-body{
    display:flex;
    flex-direction:column;
}
.contact-method-body span{
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--muted);
    margin-bottom:.2rem;
}
.contact-method-body a,
.contact-method-body strong{
    font-family:var(--font-display);
    font-size:1.2rem;
    color:var(--cream);
    font-weight:400;
    transition:color var(--t-fast);
}
.contact-method-body a:hover{color:var(--gold)}

/* Form */
.contact-form{
    background:var(--charcoal);
    padding:3rem;
    border:1px solid var(--border);
    position:relative;
}
.contact-form::before{
    content:"";
    position:absolute;
    top:0;left:0;
    width:60px;height:1px;
    background:var(--gold);
}
.contact-form h3{
    font-family:var(--font-display);
    font-size:1.8rem;
    margin-bottom:.5rem;
    color:var(--cream);
}
.contact-form > p{
    font-size:.9rem;
    margin-bottom:2rem;
}

.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
    margin-bottom:1rem;
}
.form-field{margin-bottom:1rem}
.form-field label{
    display:block;
    font-family:var(--font-mono);
    font-size:.62rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--muted);
    margin-bottom:.6rem;
}
.form-field input,
.form-field textarea,
.form-field select{
    width:100%;
    background:transparent;
    border:none;
    border-bottom:1px solid var(--border);
    padding:.8rem 0;
    color:var(--cream);
    font-family:var(--font-body);
    font-size:.95rem;
    transition:border-color var(--t-fast);
    font-weight:300;
}
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus{
    outline:none;
    border-bottom-color:var(--gold);
}
.form-field textarea{
    resize:vertical;
    min-height:90px;
}
.form-field select{
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c9a961' stroke-width='1' fill='none'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right .5rem center;
    background-size:10px;
    appearance:none;
    -webkit-appearance:none;
    padding-right:1.5rem;
}
.form-field select option{background:var(--charcoal);color:var(--cream)}

.checkbox-field{
    display:flex;
    align-items:flex-start;
    gap:.8rem;
    margin:1.5rem 0;
}
.checkbox-field input[type="checkbox"]{
    width:16px;height:16px;
    accent-color:var(--gold);
    margin-top:3px;
    flex-shrink:0;
}
.checkbox-field label{
    font-size:.78rem;
    color:var(--muted-light);
    letter-spacing:.02em;
    text-transform:none;
    font-family:var(--font-body);
    line-height:1.5;
    margin:0;
}
.checkbox-field label a{color:var(--gold);border-bottom:1px solid var(--gold)}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:1rem;
    padding:1.1rem 2.5rem;
    border:1px solid var(--gold);
    color:var(--gold);
    font-family:var(--font-mono);
    font-size:.72rem;
    letter-spacing:.28em;
    text-transform:uppercase;
    transition:all var(--t-fast);
    background:transparent;
    cursor:pointer;
    position:relative;
    overflow:hidden;
}
.btn::before{
    content:"";
    position:absolute;
    inset:0;
    background:var(--gold);
    transform:translateX(-101%);
    transition:transform .5s var(--ease-out);
    z-index:-1;
}
.btn:hover{color:var(--black)}
.btn:hover::before{transform:translateX(0)}
.btn svg{width:12px;height:12px;transition:transform var(--t-fast)}
.btn:hover svg{transform:translateX(4px)}
.btn-full{width:100%}
.btn-gold-solid{
    background:var(--gold);
    color:var(--black);
}
.btn-gold-solid::before{background:var(--cream)}
.btn-gold-solid:hover{color:var(--black)}

.form-msg{
    margin-top:1rem;
    padding:1rem;
    font-size:.85rem;
    font-family:var(--font-mono);
    letter-spacing:.05em;
    display:none;
}
.form-msg.success{
    display:block;
    background:rgba(201,169,97,.08);
    border:1px solid var(--gold);
    color:var(--gold);
}
.form-msg.error{
    display:block;
    background:rgba(180,50,50,.08);
    border:1px solid #b43232;
    color:#e88;
}

/* =============================================================
   FOOTER
   ============================================================= */
.footer{
    padding:var(--space-lg) 0 2rem;
    background:var(--black);
    border-top:1px solid var(--border);
}
.footer-inner{
    max-width:var(--container);
    margin:0 auto;
    padding:0 2rem;
}
.footer-top{
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr 1fr;
    gap:3rem;
    margin-bottom:3rem;
    padding-bottom:3rem;
    border-bottom:1px solid var(--border);
}
.footer-brand{
    display:flex;
    flex-direction:column;
    gap:1.2rem;
}
.footer-brand svg{height:76px;width:auto;color:var(--gold);margin-left:-14px}
.footer-brand p{
    font-size:.9rem;
    color:var(--muted-light);
    max-width:34ch;
}
.footer-col h5{
    font-family:var(--font-mono);
    font-size:.65rem;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:1.5rem;
    font-weight:400;
}
.footer-col ul li{
    margin-bottom:.8rem;
}
.footer-col ul a,
.footer-col ul span{
    font-size:.9rem;
    color:var(--muted-light);
    transition:color var(--t-fast);
    font-weight:300;
}
.footer-col ul a:hover{color:var(--gold)}

.footer-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem;
    font-family:var(--font-mono);
    font-size:.7rem;
    letter-spacing:.1em;
    color:var(--muted);
}

/* =============================================================
   MODAL (Lightbox)
   ============================================================= */
.modal{
    position:fixed;
    inset:0;
    z-index:200;
    background:rgba(5,5,5,.96);
    display:none;
    align-items:center;
    justify-content:center;
    padding:2rem;
}
.modal.open{display:flex}
.modal img{
    max-width:90vw;
    max-height:85vh;
    object-fit:contain;
}
.modal-close{
    position:absolute;
    top:1.5rem;right:1.5rem;
    width:44px;height:44px;
    border:1px solid var(--border);
    border-radius:50%;
    color:var(--cream);
    display:grid;place-items:center;
    transition:var(--t-fast);
}
.modal-close:hover{border-color:var(--gold);color:var(--gold)}

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 1100px){
    .features-grid{grid-template-columns:repeat(2,1fr)}
    .gallery-grid{grid-template-columns:repeat(3,1fr)}
    .investment-stats{grid-template-columns:repeat(2,1fr)}
    .inv-stat:nth-child(2){border-right:none}
    .inv-stat:nth-child(1),
    .inv-stat:nth-child(2){border-bottom:1px solid var(--border)}
}

@media (max-width: 860px){
    :root{
        --space-xl:5rem;
        --space-lg:3.5rem;
    }
    .nav-menu{display:none}
    .nav.open .nav-menu{
        display:flex;
        position:fixed;
        inset:0;
        background:var(--black);
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:2rem;
        font-size:1.1rem;
    }
    .nav.open .nav-menu a{font-size:1.1rem}
    .nav-toggle{display:flex}
    .nav.open .nav-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
    .nav.open .nav-toggle span:nth-child(2){opacity:0}
    .nav.open .nav-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
    .nav-cta{display:none}

    .hero-title{font-size:clamp(2.8rem,9vw,4.5rem)}
    .hero-sub{font-size:1rem}
    .hero-meta{gap:1.5rem}
    .scroll-ind{display:none}

    .video-intro,
    .about-grid,
    .amenities-head,
    .location-grid,
    .contact-grid{
        grid-template-columns:1fr;
        gap:2.5rem;
    }

    .amenities-grid{grid-template-columns:repeat(6,1fr)}
    .amenity.large{grid-column:span 6;grid-row:span 1}
    .amenity.medium{grid-column:span 6}
    .amenity.small{grid-column:span 3}
    .amenity.wide{grid-column:span 6}

    .features-grid{grid-template-columns:1fr}
    .feature-card{padding:2.2rem}

    .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:180px}
    .gallery-item.wide,
    .gallery-item.feature{grid-column:span 2}
    .gallery-item.feature{grid-row:span 1}

    .footer-top{grid-template-columns:1fr 1fr;gap:2rem}

    .form-row{grid-template-columns:1fr}
    .contact-form{padding:2rem}

    .investment-stats{grid-template-columns:1fr 1fr}
}

@media (max-width:500px){
    .footer-top{grid-template-columns:1fr}
    .about-stats{grid-template-columns:1fr}
    .distances{grid-template-columns:1fr}
    .investment-stats{grid-template-columns:1fr}
    .inv-stat{border-right:none;border-bottom:1px solid var(--border)}
    .inv-stat:last-child{border-bottom:none}
    .hero-content{padding-bottom:6rem}
}
