/*
Theme Name: Luxury Homes Egypt
Theme URI: https://luxuryhomesegypt.com
Description: A bespoke luxury real-estate theme for Luxury Homes Egypt. Deep Mediterranean green identity with brass, limestone and terracotta accents. Works with the "Luxury Homes Egypt — Core" plugin (Property post type + Property Type, Destination and Collection taxonomies) and Advanced Custom Fields for property details.
Version: 1.0.0
Author: Luxury Homes Egypt
Text Domain: lhe
Requires at least: 6.2
Tested up to: 6.7
*/

/* ===== TOKENS ===== */
:root{
  --paper:#FBFAF7; --ink:#1C1A17; --ink-soft:#5A554C;
  --stone:#E7E2D7; --white:#fff; --maxw:1300px;
  --hero:#14433B; --hero-deep:#0E322C; --accent:#A07E4A; --accent-soft:#C6A365;
  --limestone:#EDE6D6; --limestone-line:#DED3BC; --sage:#E4EBE3; --terracotta:#BC6B48; --terracotta-soft:#F4E9E2;
}
*{box-sizing:border-box;}
html,body{width:100%; max-width:100%; overflow-x:hidden;}
body{margin:0; background:var(--paper); color:var(--ink); font-family:"Jost",system-ui,sans-serif; font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
.hero,.section,.head{width:100%;}
h1,h2,h3,.serif{font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; line-height:1.1; margin:0;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; height:auto; display:block;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
.eyebrow{font-size:.72rem; letter-spacing:.32em; text-transform:uppercase; color:var(--accent);}
.eyebrow.on-dark{color:var(--accent-soft);}
.btn{display:inline-flex; align-items:center; gap:9px; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; padding:14px 26px; border:1px solid var(--hero); color:var(--hero); background:transparent; transition:.25s; cursor:pointer;}
.btn:hover{background:var(--hero); color:var(--paper);}
.btn-solid{background:var(--accent); border-color:var(--accent); color:#20180c;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}

/* ===== HEADER (overlay on front page, solid elsewhere) ===== */
.head{z-index:80; width:100%; transition:background .3s, border-color .3s;}
.head--solid{position:sticky; top:0; background:rgba(251,250,247,.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--stone);}
.head--overlay{position:fixed; top:0; left:0; right:0; background:transparent; border-bottom:1px solid transparent;}
.head--overlay.scrolled{background:rgba(251,250,247,.95); backdrop-filter:blur(10px); border-bottom:1px solid var(--stone);}
.head-in{display:flex; align-items:center; justify-content:space-between; height:82px; gap:24px;}
.brand{display:flex; align-items:baseline; gap:8px; flex:0 0 auto; white-space:nowrap;}
.brand .mk{font-family:"Cormorant Garamond",serif; font-size:1.5rem; font-weight:600; letter-spacing:.02em; color:var(--ink); white-space:nowrap;}
.brand .sb{font-size:.6rem; letter-spacing:.34em; text-transform:uppercase; color:var(--accent); white-space:nowrap;}
.brand.light .mk{color:var(--paper);}

.head-tools{display:flex; align-items:center; gap:14px;}
.icon-btn{display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border:1px solid transparent; border-radius:50%; color:var(--ink); background:transparent; transition:.2s;}
.icon-btn:hover{border-color:var(--stone); color:var(--hero);}
.menu-btn{display:inline-flex; align-items:center; gap:10px; background:transparent; border:0; color:var(--ink); font-family:inherit; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; cursor:pointer; padding:8px 4px;}
.menu-lines{display:inline-flex; flex-direction:column; gap:5px; width:24px;}
.menu-lines i{display:block; height:1.5px; background:currentColor; width:100%;}
.menu-lines i:last-child{width:60%;}

/* overlay-header light state (over the hero, before scroll) */
.head--overlay:not(.scrolled) .brand .mk{color:var(--paper);}
.head--overlay:not(.scrolled) .icon-btn,
.head--overlay:not(.scrolled) .menu-btn{color:var(--paper);}
.head--overlay:not(.scrolled) .icon-btn:hover{border-color:rgba(251,250,247,.5); color:var(--paper);}

/* ===== FULL-SCREEN MENU OVERLAY ===== */
.menu-overlay{position:fixed; inset:0; z-index:120; background:var(--hero); color:var(--paper);
  opacity:0; visibility:hidden; transform:translateY(-10px); transition:.35s ease;}
.menu-overlay.open{opacity:1; visibility:visible; transform:none;}
.menu-overlay-in{padding-top:26px; height:100%; display:flex; flex-direction:column;}
.mo-head{display:flex; align-items:center; justify-content:space-between; padding-bottom:40px;}
.menu-close{display:inline-flex; align-items:center; gap:10px; background:transparent; border:0; color:var(--paper); font-family:inherit; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; cursor:pointer;}
.mo-grid{display:grid; grid-template-columns:1.5fr 1fr; gap:60px; align-items:center; flex:1;}
.mo-list{list-style:none; margin:0; padding:0;}
.mo-list li{border-top:1px solid rgba(251,250,247,.16);}
.mo-list li:last-child{border-bottom:1px solid rgba(251,250,247,.16);}
.mo-list a{display:block; font-family:"Cormorant Garamond",serif; font-size:clamp(1.8rem,4vw,3rem); padding:16px 0; color:var(--paper); transition:.2s;}
.mo-list a:hover{padding-left:20px; color:var(--accent-soft);}
.mo-side{border-left:1px solid rgba(251,250,247,.16); padding-left:44px; display:flex; flex-direction:column; gap:30px;}
.mo-label{display:block; font-size:.64rem; letter-spacing:.24em; text-transform:uppercase; color:var(--accent-soft); margin-bottom:12px;}
.mo-search input[type="search"]{width:100%; background:transparent; border:0; border-bottom:1px solid rgba(251,250,247,.4); color:var(--paper); font-family:"Cormorant Garamond",serif; font-size:1.3rem; padding:8px 0; outline:none;}
.mo-search input[type="search"]::placeholder{color:rgba(251,250,247,.5);}
.mo-search button{margin-top:10px; background:transparent; border:1px solid rgba(251,250,247,.4); color:var(--paper); padding:8px 18px; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; cursor:pointer;}
.mo-contact a{display:block; color:var(--paper); padding:4px 0;}
.mo-phone{font-family:"Cormorant Garamond",serif; font-size:1.5rem;}
.mo-email{opacity:.85; font-size:.92rem;}
.mo-wa{color:var(--accent-soft)!important; margin-top:10px; font-size:.82rem; letter-spacing:.06em;}
body.menu-open{overflow:hidden;}

/* ===== HERO (full-screen) ===== */
.hero{position:relative; height:100vh; min-height:600px; overflow:hidden; background:var(--hero-deep); display:flex; align-items:flex-end;}
.slide{position:absolute; inset:0; opacity:0; transition:opacity 1.1s ease; display:flex; align-items:flex-end;}
.slide.on{opacity:1;}
.slide .bg{position:absolute; inset:0; background-size:cover; background-position:center;}
.slide .bg::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(14,20,18,.35) 0%, rgba(14,20,18,.35) 40%, rgba(14,20,18,.78) 100%);}
.slide .art{position:absolute; inset:0; opacity:.14;}
.s-in{position:relative; z-index:2; color:var(--paper); padding-bottom:12vh; width:100%;}
.s-in .eyebrow{display:block; margin-bottom:18px;}
.s-in h2{font-size:clamp(2.6rem,6.4vw,5.6rem); max-width:16ch; color:var(--paper);}
.s-in h2 em{font-style:italic; color:var(--accent-soft);}
.s-in .meta{display:flex; gap:24px; align-items:center; margin:22px 0 28px; flex-wrap:wrap;}
.s-in .price{font-family:"Cormorant Garamond",serif; font-size:1.8rem;}
.s-in .loc{font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; opacity:.85;}
.hero-actions .btn{border-color:rgba(251,250,247,.55); color:var(--paper);}
.hero-actions .btn:hover{background:var(--paper); color:var(--hero-deep);}
.hero-actions .btn-solid{background:var(--accent); border-color:var(--accent); color:#20180c;}

/* centered play button */
.hero-play{position:absolute; z-index:4; top:44%; left:50%; transform:translate(-50%,-50%); width:88px; height:88px; border-radius:50%;
  border:1px solid rgba(251,250,247,.7); background:rgba(20,30,26,.25); color:var(--paper); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.25s; backdrop-filter:blur(2px);}
.hero-play:hover{background:var(--accent); border-color:var(--accent); color:#20180c; transform:translate(-50%,-50%) scale(1.06);}

.arrows{position:absolute; z-index:5; right:32px; bottom:12vh; display:flex; gap:10px;}
.arrows button{width:50px; height:50px; border:1px solid rgba(251,250,247,.45); background:transparent; color:var(--paper); font-size:1.1rem; cursor:pointer; transition:.2s;}
.arrows button:hover{background:var(--paper); color:var(--hero-deep);}
.dots{position:absolute; z-index:5; left:32px; bottom:38px; display:flex; gap:10px;}
.dots button{width:32px; height:3px; border:0; background:rgba(251,250,247,.4); cursor:pointer; padding:0;}
.dots button.on{background:var(--accent-soft);}
.scroll-cue{position:absolute; z-index:5; left:50%; bottom:26px; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:6px; color:var(--paper); font-size:.6rem; letter-spacing:.24em; text-transform:uppercase; opacity:.85;}
.scroll-cue svg{animation:cue 1.8s ease-in-out infinite;}
@keyframes cue{0%,100%{transform:translateY(0);}50%{transform:translateY(5px);}}

/* ===== VIDEO MODAL ===== */
.video-modal{position:fixed; inset:0; z-index:140; background:rgba(14,20,18,.92); display:none; align-items:center; justify-content:center; padding:24px;}
.video-modal.open{display:flex;}
.video-frame{width:min(1000px,92vw); aspect-ratio:16/9; background:#000;}
.video-frame iframe,.video-frame video{width:100%; height:100%; border:0;}
.video-close{position:absolute; top:22px; right:28px; background:transparent; border:0; color:var(--paper); font-size:2rem; cursor:pointer; line-height:1;}

/* ===== SECTIONS ===== */
.section{padding:92px 0;}
.sec-head{display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:44px; flex-wrap:wrap;}
.sec-head h2{font-size:clamp(2rem,3.6vw,3rem); margin-top:.4rem;}
.sec-head .lnk{font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--hero); border-bottom:1px solid var(--accent); padding-bottom:4px;}
.bg-limestone{background:var(--limestone);}
.bg-sage{background:var(--sage);}

/* index (types / destinations) */
.index{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--limestone-line); border:1px solid var(--limestone-line);}
.fam{background:var(--limestone); padding:28px 26px;}
.fam-h{display:flex; align-items:baseline; gap:12px; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--limestone-line);}
.fam-h .fn{font-family:"Cormorant Garamond",serif; font-size:1.05rem; color:var(--accent);}
.fam-h h3{font-size:1.55rem;}
.fam-list{display:flex; flex-direction:column;}
.fam-list a{font-size:.9rem; color:var(--ink-soft); padding:6px 0 6px 16px; position:relative; transition:.2s;}
.fam-list a::before{content:""; position:absolute; left:0; top:14px; width:7px; height:1px; background:var(--accent); transition:.2s;}
.fam-list a:hover{color:var(--hero); padding-left:22px;}
.fam-list a:hover::before{width:12px; background:var(--terracotta);}
.fam-list .area{font-weight:500; color:var(--ink); font-size:.82rem; margin-top:12px;}

/* plates grid */
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
.plate{background:var(--white); border:1px solid var(--stone); transition:.3s; overflow:hidden; display:block;}
.plate:hover{box-shadow:0 26px 54px -30px rgba(20,30,26,.45); transform:translateY(-3px);}
.plate .ph{position:relative; aspect-ratio:4/3; background:var(--hero); overflow:hidden;}
.plate .ph img{width:100%; height:100%; object-fit:cover; transition:transform .6s;}
.plate:hover .ph img{transform:scale(1.045);}
.plate .ph .art{position:absolute; inset:0; opacity:.2;}
.plate .serial{position:absolute; top:14px; left:14px; z-index:3; font-size:.62rem; letter-spacing:.18em; color:var(--paper); background:rgba(14,20,18,.55); padding:5px 9px;}
.plate .badge{position:absolute; top:14px; right:14px; z-index:3; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; background:var(--accent); color:#20180c; padding:5px 10px;}
.plate .badge.excl{background:var(--terracotta); color:var(--terracotta-soft);}
.plate .body{padding:22px;}
.plate .loc{font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin-bottom:8px;}
.plate h3{font-size:1.5rem; margin-bottom:6px; color:var(--ink);}
.plate .price{font-family:"Cormorant Garamond",serif; font-size:1.4rem; color:var(--hero); margin:10px 0 14px;}
.plate .specs{display:flex; gap:18px; font-size:.8rem; color:var(--ink-soft); border-top:1px solid var(--stone); padding-top:14px;}
.plate .specs b{color:var(--ink); font-weight:500;}

/* collections */
.coll-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.coll{border:1px solid var(--limestone-line); background:var(--limestone); padding:24px 20px; min-height:120px; display:flex; flex-direction:column; justify-content:space-between; transition:.25s;}
.coll:hover{background:var(--hero); color:var(--paper);}
.coll:hover .cn{color:var(--accent-soft);}
.coll .cn{font-size:.62rem; letter-spacing:.2em; color:var(--accent);}
.coll h3{font-size:1.3rem; color:inherit;}

/* advisor */
.advisor{background:var(--hero-deep); color:var(--paper); text-align:center;}
.advisor h2{font-size:clamp(2.2rem,4vw,3.4rem); max-width:18ch; margin:16px auto;}
.advisor p{max-width:48ch; margin:0 auto 30px; opacity:.85;}
.wa{display:inline-flex; align-items:center; gap:9px; background:#1f9d5b; color:#fff; border:0; padding:14px 26px; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; cursor:pointer;}
.wa:hover{background:#188a4f;}

/* single property */
.detail-hero{aspect-ratio:16/8; background:var(--hero); position:relative; overflow:hidden; margin-bottom:36px;}
.detail-hero img{width:100%; height:100%; object-fit:cover;}
.detail-hero .art{position:absolute; inset:0; opacity:.16;}
.back{display:inline-flex; gap:8px; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--hero); margin:26px 0;}
.detail-grid{display:grid; grid-template-columns:1.7fr 1fr; gap:52px; align-items:start;}
.detail-main .loc{font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); margin-bottom:10px;}
.detail-main h1{font-size:clamp(2.2rem,4.5vw,3.4rem); margin-bottom:12px;}
.detail-main .price{font-family:"Cormorant Garamond",serif; font-size:2.1rem; color:var(--hero); margin-bottom:24px;}
.spec-row{display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--stone); margin-bottom:32px;}
.spec-row > div{padding:20px; border-right:1px solid var(--stone);}
.spec-row > div:last-child{border-right:0;}
.spec-row .l{font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:6px;}
.spec-row .v{font-family:"Cormorant Garamond",serif; font-size:1.6rem;}
.detail-main h3{font-size:1.7rem; margin:30px 0 12px;}
.feat-list{columns:2; gap:30px; list-style:none; padding:0; margin:0;}
.feat-list li{padding:7px 0 7px 18px; position:relative; font-size:.92rem; break-inside:avoid;}
.feat-list li::before{content:""; position:absolute; left:0; top:15px; width:8px; height:1px; background:var(--brass,var(--accent));}
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:12px 0 8px;}
.gallery-grid img{width:100%; aspect-ratio:4/3; object-fit:cover;}
.enquiry{border:1px solid var(--stone); padding:26px; position:sticky; top:96px; background:var(--white);}
.enquiry h3{margin-bottom:6px; font-size:1.6rem;}
.enquiry p{font-size:.86rem; color:var(--ink-soft); margin:0 0 16px;}
.enquiry .wa{width:100%; justify-content:center;}

/* archive header */
.page-head{padding:64px 0 40px; border-bottom:1px solid var(--stone);}
.page-head h1{font-size:clamp(2.2rem,4.5vw,3.6rem); margin-top:.4rem;}
.term-chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px;}
.term-chips a{font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; border:1px solid var(--stone); padding:8px 14px; color:var(--ink-soft);}
.term-chips a:hover{border-color:var(--hero); color:var(--hero);}
.pagination{display:flex; gap:8px; justify-content:center; margin-top:48px;}
.pagination .page-numbers{padding:10px 15px; border:1px solid var(--stone); font-size:.8rem;}
.pagination .current{background:var(--hero); color:var(--paper); border-color:var(--hero);}
.empty{padding:80px 0; text-align:center; color:var(--ink-soft);}

/* footer */
.foot{background:var(--ink); color:#cfc9bd; padding:60px 0 32px; font-size:.84rem;}
.foot-top{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:34px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,.12);}
.foot .mk{font-family:"Cormorant Garamond",serif; font-size:1.6rem; color:var(--paper);}
.foot h4{color:var(--paper); font-weight:500; font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; margin:0 0 14px;}
.foot ul{list-style:none; margin:0; padding:0;}
.foot a{display:block; opacity:.8; padding:4px 0;}
.foot a:hover{opacity:1; color:var(--paper);}
.foot-bot{display:flex; justify-content:space-between; padding-top:22px; opacity:.6; font-size:.76rem; flex-wrap:wrap; gap:10px;}

/* ===== SIGNATURE COLLECTION — cinematic slider ===== */
.signature{background:var(--limestone);}
.cslider{position:relative; height:72vh; min-height:520px; overflow:hidden;}
.cslide{position:absolute; inset:0; opacity:0; transition:opacity 1s ease; display:flex; align-items:flex-end;}
.cslide.on{opacity:1;}
.cslide .cbg{position:absolute; inset:0; background-size:cover; background-position:center; background-color:var(--hero);}
.cslide .cbg::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(14,20,18,.82) 0%, rgba(14,20,18,.45) 42%, rgba(14,20,18,.15) 72%, rgba(14,20,18,.35) 100%);}
.cslide .art{position:absolute; inset:0; opacity:.14;}
.ctop{position:absolute; top:34px; left:38px; z-index:3; color:var(--paper);}
.ctop .eyebrow{display:block; margin-bottom:8px;}
.ctop h3{font-size:clamp(1.4rem,2.4vw,2rem); opacity:.95;}
.cbody{position:relative; z-index:3; color:var(--paper); padding:38px; max-width:620px;}
.clabel{font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:var(--accent-soft); margin-bottom:10px;}
.crule{width:38px; height:1px; background:var(--accent); margin-bottom:14px;}
.cbody h3{font-size:clamp(2rem,4vw,3.2rem); margin-bottom:12px; color:var(--paper);}
.cbody p{font-size:.98rem; opacity:.9; max-width:48ch; margin-bottom:22px; line-height:1.6;}
.cbtns{display:flex; gap:12px; align-items:center; flex-wrap:wrap;}
.cbtns .btn{border-color:rgba(251,250,247,.55); color:var(--paper); padding:13px 24px;}
.cbtns .btn:hover{background:var(--paper); color:var(--hero-deep);}
.cbtns .btn-solid{background:var(--accent); border-color:var(--accent); color:#20180c;}
.cplay{top:44%; right:16%; left:auto; transform:translateY(-50%);}
.cplay:hover{transform:translateY(-50%) scale(1.06);}
.cdots{position:absolute; z-index:5; left:50%; bottom:24px; transform:translateX(-50%); display:flex; gap:10px;}
.cdots button{width:30px; height:3px; border:0; background:rgba(251,250,247,.4); cursor:pointer; padding:0;}
.cdots button.on{background:var(--accent-soft);}
.carrows{position:absolute; z-index:5; right:30px; bottom:26px; display:flex; gap:10px;}
.carrows button{width:46px; height:46px; border-radius:50%; border:1px solid rgba(251,250,247,.5); background:transparent; color:var(--paper); font-size:1.1rem; cursor:pointer; transition:.2s;}
.carrows button:hover{background:var(--paper); color:var(--hero-deep);}

@media(max-width:1050px){
  .index,.grid3{grid-template-columns:repeat(2,1fr);} .coll-grid{grid-template-columns:repeat(2,1fr);}
  .detail-grid{grid-template-columns:1fr;} .enquiry{position:static;} .foot-top{grid-template-columns:1fr 1fr;}
  .mo-grid{grid-template-columns:1fr; gap:36px; align-items:start; overflow-y:auto;}
  .mo-side{border-left:0; border-top:1px solid rgba(251,250,247,.16); padding-left:0; padding-top:26px;}
}
@media(max-width:640px){
  .index,.grid3,.coll-grid{grid-template-columns:1fr;} .section{padding:60px 0;}
  .spec-row{grid-template-columns:repeat(2,1fr);} .feat-list{columns:1;} .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .foot-top{grid-template-columns:1fr;} .arrows{display:none;}
  .menu-label{display:none;} .head-tools{gap:8px;}
  .mo-list a{font-size:1.8rem; padding:12px 0;}
  .cbody{padding:24px;} .ctop{top:22px; left:24px;} .carrows{display:none;}
  .cplay{right:auto; left:50%; top:38%; transform:translate(-50%,-50%);}
  .cplay:hover{transform:translate(-50%,-50%) scale(1.06);}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important;}}
