/* public/css/site.css — "Lagos Modern" redesign
   Confident hospitality brand. Deep teal as a real canvas, orange as the spark,
   the logo's pentagon house-mark as a recurring structural motif. */

:root {
  --ink:#0a3845;          /* deepest teal, page base for dark sections */
  --teal:#0d4657;         /* brand teal */
  --teal-2:#11566b;       /* elevated surface on dark */
  --teal-3:#1a6680;       /* hover / borders on dark */
  --orange:#fe7f38;       /* the spark */
  --orange-2:#ff9355;
  --cream:#f7f3ec;        /* light section bg */
  --paper:#ffffff;
  --line:#e4ddcf;         /* light borders */
  --line-dark:rgba(255,255,255,.14);
  --ink-text:#13242b;     /* text on light */
  --muted:#5d6b70;        /* muted on light */
  --muted-d:#a9c2cb;      /* muted on dark */
  --radius:18px;
  --radius-sm:12px;
  --maxw:1200px;
  --shadow:0 24px 60px -20px rgba(7,40,50,.45);
  --shadow-card:0 12px 32px -12px rgba(7,40,50,.28);
  --font-display:'Clash Display','Space Grotesk',system-ui,sans-serif;
  --font-body:'Inter',system-ui,-apple-system,sans-serif;
  --house: polygon(50% 0%, 92% 34%, 82% 34%, 82% 100%, 18% 100%, 18% 34%, 8% 34%);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{max-width:100%;overflow-x:hidden}
body{margin:0;font-family:var(--font-body);color:var(--ink-text);background:var(--cream);line-height:1.6;-webkit-font-smoothing:antialiased}
img,video,iframe{max-width:100%}
img{display:block}
a{color:inherit}
.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* Type */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;line-height:1.04;margin:0}
.display{font-size:clamp(2.8rem,7vw,5.6rem);font-weight:600;letter-spacing:-.03em;line-height:.98}
.eyebrow{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;letter-spacing:.2em;font-size:.7rem;font-weight:700;color:var(--orange)}
.eyebrow::before{content:"";width:18px;height:18px;background:var(--orange);clip-path:var(--house);display:inline-block}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;border:none;font:inherit;font-weight:600;background:var(--orange);color:#1a1205;padding:15px 26px;border-radius:999px;text-decoration:none;transition:transform .15s ease,background .2s ease,box-shadow .2s ease;box-shadow:0 8px 20px -8px rgba(254,127,56,.7)}
.btn:hover{background:var(--orange-2);transform:translateY(-2px)}
.btn-lg{padding:18px 34px;font-size:1.05rem}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid var(--line-dark);box-shadow:none}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:#fff}
.btn-ghost-dark{background:transparent;color:var(--teal);border:1.5px solid var(--line);box-shadow:none}
.btn-ghost-dark:hover{background:var(--cream)}
.btn-block{display:flex;width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}

/* Header */
.site-header{position:sticky;top:0;z-index:60;background:rgba(10,56,69,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-dark)}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#fff;font-family:var(--font-display);font-weight:600;font-size:1.45rem;letter-spacing:-.02em}
.brand .mark{width:30px;height:30px;background:var(--orange);clip-path:var(--house)}
.brand b{color:var(--orange)}
.logo-img{height:38px;width:auto;display:block}
.site-footer .logo-img{height:42px}
.nav{display:flex;gap:30px;align-items:center}
.nav a{text-decoration:none;font-size:.95rem;font-weight:500;color:#e9f1f3;opacity:.85;transition:opacity .2s}
.nav a:hover,.nav a.active{opacity:1}
.nav a.active{color:var(--orange)}

/* Hero */
.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden;padding-bottom:70px}
.hero::after{content:"";position:absolute;right:-160px;top:-160px;width:520px;height:520px;background:radial-gradient(circle,rgba(26,102,128,.30),transparent 65%);pointer-events:none}
.hero-marks{position:absolute;inset:0;z-index:1;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27320%27%20height%3D%27320%27%20viewBox%3D%270%200%20320%20320%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%272.4%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20opacity%3D%271%27%3E%3C%21--%20house%20top-left%20--%3E%3Cg%20transform%3D%27translate%2828%2C30%29%27%3E%3Cpath%20d%3D%27M0%2022%20L20%204%20L40%2022%27%2F%3E%3Cpath%20d%3D%27M5%2019%20L5%2042%20L35%2042%20L35%2019%27%2F%3E%3Cpath%20d%3D%27M16%2042%20L16%2030%20L24%2030%20L24%2042%27%2F%3E%3C%2Fg%3E%3C%21--%20bed%20top-right%20--%3E%3Cg%20transform%3D%27translate%28210%2C34%29%27%3E%3Cpath%20d%3D%27M2%2010%20L2%2040%27%2F%3E%3Cpath%20d%3D%27M2%2018%20L46%2018%20L46%2040%27%2F%3E%3Cpath%20d%3D%27M2%2030%20L46%2030%27%2F%3E%3Cpath%20d%3D%27M10%2018%20L10%2012%20L24%2012%20L24%2018%27%2F%3E%3C%2Fg%3E%3C%21--%20shower%20mid-left%20--%3E%3Cg%20transform%3D%27translate%2836%2C150%29%27%3E%3Cpath%20d%3D%27M20%204%20a10%2010%200%200%201%2010%2010%20L10%2014%20a10%2010%200%200%201%2010%20-10%20Z%27%2F%3E%3Cpath%20d%3D%27M20%204%20L20%20-2%27%2F%3E%3Cpath%20d%3D%27M14%2022%20l-2%208%20M22%2022%20l-2%208%20M30%2022%20l-2%208%27%2F%3E%3C%2Fg%3E%3C%21--%20car%20%28carpark%29%20center%20--%3E%3Cg%20transform%3D%27translate%28132%2C128%29%27%3E%3Cpath%20d%3D%27M4%2024%20L8%2012%20L40%2012%20L44%2024%27%2F%3E%3Cpath%20d%3D%27M2%2024%20L46%2024%20L46%2034%20L40%2034%20L40%2030%20L8%2030%20L8%2034%20L2%2034%20Z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2731%27%20r%3D%273%27%2F%3E%3Ccircle%20cx%3D%2736%27%20cy%3D%2731%27%20r%3D%273%27%2F%3E%3C%2Fg%3E%3C%21--%20jacuzzi%20%2F%20bath%20top-center%20--%3E%3Cg%20transform%3D%27translate%28120%2C40%29%27%3E%3Cpath%20d%3D%27M2%2016%20L42%2016%20L42%2028%20a8%208%200%200%201%20-8%208%20L10%2036%20a8%208%200%200%201%20-8%20-8%20Z%27%2F%3E%3Cpath%20d%3D%27M10%2016%20L10%208%20a4%204%200%200%201%208%200%27%2F%3E%3Cpath%20d%3D%27M8%2042%20l0%204%20M34%2042%20l0%204%27%2F%3E%3C%2Fg%3E%3C%21--%20tv%20%28netflix%29%20right-center%20--%3E%3Cg%20transform%3D%27translate%28214%2C140%29%27%3E%3Crect%20x%3D%272%27%20y%3D%274%27%20width%3D%2744%27%20height%3D%2728%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M16%2040%20L32%2040%20M24%2032%20L24%2040%27%2F%3E%3C%2Fg%3E%3C%21--%20kitchen%20%2F%20cooker%20bottom-left%20--%3E%3Cg%20transform%3D%27translate%2840%2C250%29%27%3E%3Crect%20x%3D%272%27%20y%3D%278%27%20width%3D%2740%27%20height%3D%2738%27%20rx%3D%273%27%2F%3E%3Cpath%20d%3D%27M2%2018%20L42%2018%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2713%27%20r%3D%271.6%27%2F%3E%3Ccircle%20cx%3D%2720%27%20cy%3D%2713%27%20r%3D%271.6%27%2F%3E%3Crect%20x%3D%2710%27%20y%3D%2726%27%20width%3D%2724%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3C%2Fg%3E%3C%21--%20sofa%20bottom-center%20--%3E%3Cg%20transform%3D%27translate%28126%2C250%29%27%3E%3Cpath%20d%3D%27M4%2024%20L4%2016%20a6%206%200%200%201%2012%200%20L16%2022%20L36%2022%20L36%2016%20a6%206%200%200%201%2012%200%20L48%2024%27%2F%3E%3Cpath%20d%3D%27M2%2024%20L50%2024%20L50%2038%20L44%2038%20L44%2034%20L8%2034%20L8%2038%20L2%2038%20Z%27%2F%3E%3C%2Fg%3E%3C%21--%20bed%20bottom-right%20--%3E%3Cg%20transform%3D%27translate%28218%2C250%29%27%3E%3Cpath%20d%3D%27M2%2010%20L2%2040%27%2F%3E%3Cpath%20d%3D%27M2%2018%20L46%2018%20L46%2040%27%2F%3E%3Cpath%20d%3D%27M2%2030%20L46%2030%27%2F%3E%3Cpath%20d%3D%27M10%2018%20L10%2012%20L24%2012%20L24%2018%27%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-size:320px 320px}
.hero-inner{position:relative;z-index:2;padding:90px 0 40px;max-width:880px}
.hero h1{color:#fff}
.hero h1 .spark{color:var(--orange)}
.hero p{font-size:1.3rem;color:var(--muted-d);max-width:50ch;margin:26px 0 0}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px}
.hero-strip{position:relative;z-index:2;display:flex;gap:40px;flex-wrap:wrap;padding:26px 0 70px;border-top:1px solid var(--line-dark);margin-top:54px}
.hero-strip .stat b{display:block;font-family:var(--font-display);font-size:2rem;color:#fff}
.hero-strip .stat span{font-size:.85rem;color:var(--muted-d);text-transform:uppercase;letter-spacing:.1em}

/* Search dock */
.searchdock{position:relative;z-index:3;background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr auto;gap:10px;margin-top:-40px}
.searchdock .sf{display:flex;flex-direction:column;justify-content:center;padding:6px 16px;border-right:1px solid var(--line);min-width:0}
.searchdock .sf:last-of-type{border-right:none}
.searchdock label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:5px;padding-left:1px}
.searchdock input,.searchdock select{border:none;font:inherit;font-size:1rem;outline:none;background:transparent;color:var(--ink-text);-webkit-text-fill-color:var(--ink-text);padding:0;margin:0;width:100%;box-sizing:border-box;-webkit-appearance:none;appearance:none}
.searchdock select{cursor:pointer;padding-right:18px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2358707a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right center}
.searchdock input[type=date]{min-width:0;margin-left:-1px}
.searchdock input[type=date]::-webkit-datetime-edit{padding:0;margin:0}
.searchdock input[type=date]::-webkit-date-and-time-value{margin:0;text-align:left}
.searchdock .btn{align-self:center;white-space:nowrap}

/* Sections */
.section{padding:88px 0}
.section.dark{background:var(--teal);color:#fff}
.section.ink{background:var(--ink);color:#fff}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:46px}
.section-head h2{font-size:clamp(2rem,4vw,3.1rem)}
.section.dark .section-head h2,.section.ink .section-head h2{color:#fff}
.lead{font-size:1.15rem;color:var(--muted);max-width:54ch}
.section.dark .lead{color:var(--muted-d)}

/* Property cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:30px;align-items:stretch}
.pcard{position:relative;display:flex;flex-direction:column;background:var(--paper);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:inherit;box-shadow:var(--shadow-card);transition:transform .2s ease,box-shadow .2s ease}
.pcard:hover{transform:translateY(-6px);box-shadow:0 30px 60px -24px rgba(7,40,50,.4)}
.pcard .ph-carousel{position:relative;width:100%;height:420px;background:var(--teal-2);overflow:hidden;flex:0 0 auto}
.pcard .ph-track{display:flex;width:100%;height:420px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none}
.pcard .ph-track::-webkit-scrollbar{display:none}
.pcard .ph-slide{flex:0 0 100%;width:100%;height:420px;scroll-snap-align:start;position:relative;display:block;text-decoration:none;background:var(--teal-2)}
.pcard .ph-img{width:100%;height:420px;object-fit:cover;display:block}
.pcard .ph-slide.noimg-wrap{display:grid;place-items:center;background:var(--teal-2)}
.pcard .noimg{color:var(--muted-d);font-size:.85rem;letter-spacing:.05em}
.pcard .ph-nav{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border:none;border-radius:50%;background:rgba(10,56,69,.55);color:#fff;font-size:1.4rem;line-height:1;display:grid;place-items:center;cursor:pointer;z-index:3;opacity:0;transition:opacity .2s ease}
.pcard .ph-nav.prev{left:10px}.pcard .ph-nav.next{right:10px}
.pcard:hover .ph-nav{opacity:1}
.pcard .ph-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:6px;z-index:3}
.pcard .ph-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.55);transition:background .2s ease,transform .2s ease;cursor:pointer}
.pcard .ph-dot.active{background:#fff;transform:scale(1.3)}
.pcard .ph-count{position:absolute;bottom:12px;right:12px;background:rgba(10,56,69,.7);color:#fff;font-size:.74rem;font-weight:600;padding:3px 10px;border-radius:999px;z-index:3;letter-spacing:.02em}
.pcard .tag{position:absolute;top:14px;left:14px;background:rgba(10,56,69,.92);color:#fff;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:6px 12px;border-radius:999px;z-index:2}
.pcard .tag.party{background:var(--orange);color:#1a1205}
.pcard .body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1 1 auto;text-decoration:none;color:inherit}
.pcard .loc{font-size:.74rem;color:var(--orange);text-transform:uppercase;letter-spacing:.12em;font-weight:700}
.pcard .name{font-size:1.45rem;margin:7px 0 4px}
.pcard .meta{font-size:.9rem;color:var(--muted)}
.pcard .pricerow{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.pcard .price{font-family:var(--font-display);font-size:1.3rem;font-weight:600;line-height:1.2}
.pcard .price .per{font-family:var(--font-body);font-size:.8rem;color:var(--muted);font-weight:400}
.pcard .usd{color:var(--muted);font-weight:400;font-size:.78em}
.pcard .arrow{width:38px;height:38px;border-radius:50%;background:var(--cream);display:grid;place-items:center;color:var(--teal);font-size:1.1rem;flex:0 0 auto;transition:background .2s,color .2s}
.pcard:hover .arrow{background:var(--orange);color:#1a1205}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.step{position:relative;padding:28px 22px;border-radius:var(--radius);background:var(--teal-2);border:1px solid var(--line-dark)}
.step .n{width:42px;height:42px;background:var(--orange);clip-path:var(--house);display:grid;place-items:center;color:#1a1205;font-family:var(--font-display);font-weight:600;font-size:1.1rem;margin-bottom:18px}
.step h3{font-size:1.2rem;color:#fff;margin-bottom:8px}
.step p{color:var(--muted-d);font-size:.95rem;margin:0}

/* Feature band */
.band{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-dark);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line-dark)}
.band .cell{background:var(--ink);padding:34px 28px}
.band .cell .ico{width:34px;height:34px;background:var(--orange);clip-path:var(--house);margin-bottom:16px}
.band .cell h3{color:#fff;font-size:1.15rem;margin-bottom:6px}
.band .cell p{color:var(--muted-d);font-size:.92rem;margin:0}

/* Apartment detail */
.detail-hero{background:var(--ink)}
/* Portrait carousel */
.carousel{position:relative;max-width:520px;margin:0 auto;border-radius:var(--radius);overflow:hidden;background:#06262f;box-shadow:var(--shadow);outline:none}
.carousel-track{display:flex;transition:transform .35s ease;will-change:transform}
.carousel-slide{flex:0 0 100%;width:100%}
.carousel-slide img,.carousel-slide video{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;background:#06262f}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:none;border-radius:50%;background:rgba(10,56,69,.62);color:#fff;font-size:1.8rem;line-height:1;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(4px);transition:background .2s;z-index:3}
.carousel-arrow:hover{background:var(--orange);color:#1a1205}
.carousel-arrow.prev{left:12px}
.carousel-arrow.next{right:12px}
.carousel-counter{position:absolute;top:12px;right:12px;background:rgba(10,56,69,.7);color:#fff;font-size:.78rem;font-weight:600;padding:5px 11px;border-radius:999px;backdrop-filter:blur(4px);z-index:3}
.carousel-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;gap:7px;justify-content:center;z-index:3}
.carousel-dots .cdot{width:8px;height:8px;border-radius:50%;border:none;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:background .2s,width .2s}
.carousel-dots .cdot.active{background:var(--orange);width:22px;border-radius:999px}
.carousel-thumbs{display:flex;gap:8px;max-width:520px;margin:10px auto 0;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.carousel-thumbs .cthumb{position:relative;flex:0 0 auto;width:62px;height:78px;border-radius:10px;overflow:hidden;border:2px solid transparent;background:#06262f;cursor:pointer;padding:0}
.carousel-thumbs .cthumb img,.carousel-thumbs .cthumb video{width:100%;height:100%;object-fit:cover;display:block}
.carousel-thumbs .cthumb.active{border-color:var(--orange)}
.carousel-thumbs .cthumb .play{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:.9rem;background:rgba(0,0,0,.3)}
.empty-g{height:520px;max-width:520px;margin:0 auto;display:grid;place-items:center;background:var(--teal-2);color:var(--muted-d);border-radius:var(--radius)}
.apt-layout{display:grid;grid-template-columns:1fr minmax(0,400px);grid-template-areas:"intro booking" "amenities booking" "map booking" "availability booking" "reviews booking";gap:0 56px;margin-top:48px;align-items:start}
.apt-intro{grid-area:intro}
.apt-amenities{grid-area:amenities;margin-top:34px}
.apt-map{grid-area:map;margin-top:34px}
.apt-availability{grid-area:availability;margin-top:34px}
.apt-reviews{grid-area:reviews}
.apt-booking{grid-area:booking}
.apt-title{font-size:clamp(2.2rem,4.5vw,3.4rem);margin-bottom:6px}
.apt-loc{color:var(--orange);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:.85rem;margin-bottom:28px}
.facts{display:flex;gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:28px 0}
.facts .fact{flex:1;padding:20px;text-align:center;border-right:1px solid var(--line)}
.facts .fact:last-child{border-right:none}
.facts .fact b{display:block;font-family:var(--font-display);font-size:1.5rem}
.facts .fact span{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.apt-desc{font-size:1.08rem;color:var(--ink-text);white-space:pre-line}
.amenities{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.amenities li{padding-left:28px;position:relative;color:var(--ink-text)}
.amenities li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;background:var(--orange);clip-path:var(--house)}

/* Booking box */
.booking-box{position:sticky;top:100px;background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px;border:1px solid var(--line)}
.staytype{display:flex;gap:6px;background:var(--cream);padding:5px;border-radius:999px;margin-bottom:20px;max-width:100%}
.staytype-btn{flex:1 1 0;min-width:0;border:none;background:transparent;font:inherit;font-weight:600;font-size:.9rem;padding:10px;border-radius:999px;cursor:pointer;color:var(--muted);transition:all .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.staytype-btn.active{background:var(--teal);color:#fff;box-shadow:0 4px 12px -4px rgba(13,70,87,.5)}
.price-lead{font-family:var(--font-display);font-size:1.9rem;font-weight:600;margin-bottom:18px}
.price-lead .usd{font-family:var(--font-body);font-size:.9rem;color:var(--muted);font-weight:400}
.price-lead small{font-family:var(--font-body);font-size:.85rem;color:var(--muted);font-weight:400}
.field{margin-bottom:13px}
.field label{display:block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:6px}
.field input,.field select{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font:inherit;background:var(--paper);color:var(--ink-text);transition:border-color .15s;box-sizing:border-box}
.field select,.filterbar select{-webkit-appearance:none;appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2358707a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.field input:focus,.field select:focus{outline:none;border-color:var(--orange)}
.row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.quote{background:var(--cream);border-radius:var(--radius-sm);padding:16px;margin:16px 0}
.quote .line{display:flex;justify-content:space-between;margin-bottom:7px;font-size:.93rem}
.quote .total{font-family:var(--font-display);font-weight:600;border-top:1px solid var(--line);padding-top:10px;margin-top:4px;font-size:1.05rem}
.terms-check{display:flex;gap:11px;align-items:flex-start;font-size:.85rem;color:var(--muted);margin:16px 0;line-height:1.45}
.terms-check input{margin-top:2px;width:19px;height:19px;flex:0 0 auto;accent-color:var(--orange)}
.terms-check span{min-width:0;flex:1 1 auto;overflow-wrap:anywhere;word-break:break-word}
.terms-check a{color:var(--teal);font-weight:700;overflow-wrap:anywhere}
.note{font-size:.78rem;color:var(--muted);margin-top:12px;text-align:center}

/* Map */
.map-embed{margin-top:14px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-card)}

/* Filter bar */
.filterbar{display:flex;gap:10px;flex-wrap:wrap;background:var(--paper);padding:14px;border-radius:var(--radius);box-shadow:var(--shadow-card);margin-top:24px}
.filterbar input,.filterbar select{padding:13px 14px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font:inherit;font-size:1rem;color:var(--ink-text);background:var(--paper);flex:1;min-width:130px;-webkit-text-fill-color:var(--ink-text)}
.filterbar select{cursor:pointer;font-weight:500;font-family:var(--font-body)}
.filterbar input[type=date]{text-align:center;color:var(--ink-text);-webkit-text-fill-color:var(--ink-text)}
.filterbar input:focus,.filterbar select:focus{outline:none;border-color:var(--orange)}
.filterbar .btn{flex:0 0 auto}

/* Generic cards on light */
.lcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:30px}

/* Badges */
.badge{display:inline-block;padding:5px 13px;border-radius:999px;font-size:.75rem;font-weight:700;letter-spacing:.02em}
.badge.green{background:#e1efe5;color:#13624a}
.badge.coral{background:#ffe7d8;color:#b8521f}
.badge.grey{background:var(--line);color:var(--muted)}

/* Footer */
.site-footer{background:var(--ink);color:var(--muted-d);padding:72px 0 36px;position:relative;overflow:hidden}
.site-footer::before{content:"";position:absolute;left:-100px;bottom:-180px;width:400px;height:400px;background:radial-gradient(circle,rgba(254,127,56,.12),transparent 65%)}
.footer-grid{position:relative;display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap;margin-bottom:40px}
.footer-grid a{color:#fff;text-decoration:none;opacity:.85}
.footer-grid a:hover{opacity:1;color:var(--orange)}
.footer-grid .brand{margin-bottom:14px}
.footer-grid strong{color:#fff;display:block;margin-bottom:12px;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em}
.footer-bottom{position:relative;border-top:1px solid var(--line-dark);padding-top:24px;font-size:.85rem}

/* Compatibility aliases for secondary pages (account, booking, terms) */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
.btn-coral{background:var(--orange);color:#1a1205}
.btn-coral:hover{background:var(--orange-2)}
.section-head .eyebrow{margin-bottom:6px}
.section-head{align-items:flex-start}
.grid .card .body{padding:22px}
.loc{font-size:.74rem;color:var(--orange);text-transform:uppercase;letter-spacing:.12em;font-weight:700}
.name{font-family:var(--font-display);font-size:1.4rem;font-weight:600;margin:6px 0 4px}
.meta{font-size:.9rem;color:var(--muted)}
.price{font-family:var(--font-display);font-weight:600}
.price .usd{color:var(--muted);font-weight:400;font-size:.8em}

/* Availability calendar */
.apt-availability{margin-top:34px}
.avail-cal{max-width:360px;margin-top:14px}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:10px}
.cal-arrow{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer;flex:0 0 auto;display:grid;place-items:center}
.cal-arrow:hover:not(:disabled){background:var(--sand);border-color:var(--orange);color:var(--orange)}
.cal-arrow:disabled{opacity:.35;cursor:not-allowed}
.cal-nav .cal-title{margin:0;font-weight:700;font-family:var(--font-display);font-size:1.1rem;text-align:center;flex:1}
.cal-month .cal-title{font-weight:700;margin-bottom:8px;font-family:var(--font-display)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-dow{text-align:center;font-size:.7rem;color:var(--muted);font-weight:700;padding:2px 0}
.cal-day{text-align:center;font-size:.82rem;padding:7px 0;border-radius:7px}
.cal-day.free{background:#e7f3ec;color:#15623f}
.cal-day.busy{background:var(--line);color:var(--muted);text-decoration:line-through}
.cal-day.past{color:#c9d3d6}

/* Reviews */
.apt-reviews{margin-top:34px}
.review-list{display:grid;gap:14px;margin-top:14px}
.review{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px}
.review-head{display:flex;gap:10px;align-items:center}
.review-head .rstars{color:var(--orange);font-size:.9rem}
.review p{margin:8px 0 0;color:var(--ink-text)}

/* Discounts, ratings, promo */
.price .was,.price-lead .was{text-decoration:line-through;color:var(--muted);font-weight:400;font-size:.78em;margin-right:6px}
.pcard .disc-badge{position:absolute;top:14px;right:14px;background:#157a4a;color:#fff;font-size:.7rem;font-weight:700;padding:5px 10px;border-radius:999px;z-index:2}
.rating-row{display:flex;align-items:center;gap:6px;margin-bottom:14px;font-size:.95rem}
.rating-row .stars{color:var(--orange)}
.pcard .card-rating{font-size:.82rem;color:var(--muted);margin-top:4px}
.pcard .card-rating .s{color:var(--orange)}
.promo-badge{display:inline-block;background:#fff1e8;color:#b8521f;font-weight:700;font-size:.78rem;padding:5px 12px;border-radius:999px;margin-bottom:12px}

/* WhatsApp floating button */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:80;width:56px;height:56px;border-radius:50%;background:#0f8a43;color:#fff;display:grid;place-items:center;box-shadow:0 10px 26px -8px rgba(0,0,0,.45);transition:transform .15s ease;text-decoration:none}
.wa-float:hover{transform:scale(1.08)}
@media(max-width:680px){.wa-float{width:50px;height:50px;right:14px;bottom:14px}}

/* Misc */
.center{text-align:center}
.muted{color:var(--muted)}
.empty{text-align:center;padding:70px 20px;color:var(--muted)}
.section.dark .empty,.section.ink .empty{color:var(--muted-d)}

/* Responsive */
@media(max-width:980px){
  .apt-layout{display:flex;flex-direction:column;gap:0;min-width:0}
  .apt-layout > *{min-width:0;max-width:100%}
  .apt-intro{order:1}
  .apt-booking{order:2;margin-top:28px;min-width:0;max-width:100%}
  .apt-amenities{order:3;margin-top:34px}
  .apt-map{order:4;margin-top:34px}
  .booking-box{position:static;width:100%;max-width:100%;box-sizing:border-box}
  .steps{grid-template-columns:1fr 1fr}
  .band{grid-template-columns:1fr}
  .searchdock{grid-template-columns:1fr 1fr;gap:6px}
  .searchdock .sf{border-right:none;border-bottom:1px solid var(--line)}
  .searchdock .btn{grid-column:1/-1}
}
@media(max-width:720px){
  .container{padding:0 18px}
  /* tighter type scale on phones */
  .display{font-size:2.15rem;line-height:1.05}
  .hero-inner{padding:54px 0 40px}
  .hero p{font-size:1.05rem;margin-top:18px}
  .hero-actions{margin-top:26px}
  .hero-actions .btn{flex:1 1 auto}
  .hero-strip{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px;margin-top:34px;padding:22px 0 48px}
  .hero-strip .stat{min-width:0}
  .hero-strip .stat b{font-size:1.5rem}
  .section{padding:48px 0}
  .section-head{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:30px}
  .section-head h2{font-size:1.7rem}
  .lead{font-size:1rem}
  .searchdock{margin-top:-26px;padding:10px}
  /* header collapses to logo + hamburger menu */
  .site-header .bar{height:64px}
  .logo-img{height:32px}
  .nav{display:none}
  .nav-toggle{display:flex!important}
  /* gallery + cards */
  .carousel,.carousel-thumbs,.empty-g{max-width:100%}
  .carousel-arrow{width:38px;height:38px;font-size:1.5rem}
  .grid{grid-template-columns:1fr;gap:18px}
  .pcard .ph-carousel,.pcard .ph-track,.pcard .ph-slide,.pcard .ph-img{height:440px}
  .pcard .body{padding:18px}
  .pcard .name{font-size:1.3rem}
  .apt-title{font-size:1.8rem}
  .facts{flex-wrap:wrap}
  .facts .fact{padding:12px 6px;flex:1 1 33%;border-bottom:1px solid var(--line)}
  .facts .fact b{font-size:1.2rem}
  .facts .fact span{font-size:.68rem}
  .amenities{grid-template-columns:1fr}
  .booking-box{padding:20px;width:100%}
  .booking-box .row2{grid-template-columns:1fr;gap:0}
  .booking-box input:not([type=checkbox]):not([type=radio]),.booking-box select{min-width:0;max-width:100%;width:100%;box-sizing:border-box}
  .booking-box .terms-check input[type=checkbox]{width:19px;max-width:19px;flex:0 0 auto}
  .price-lead{font-size:1.6rem}
  .steps{grid-template-columns:1fr;gap:14px}
  .step{padding:22px 20px}
  .band .cell{padding:26px 22px}
  .filterbar{padding:12px}
  .filterbar input,.filterbar select,.filterbar .btn{flex:1 1 100%}
  .footer-grid{gap:32px}
}
@media(max-width:420px){
  .searchdock{grid-template-columns:1fr}
  .hero-strip{gap:16px 22px}
  .hero-strip .stat b{font-size:1.3rem}
  .hero-strip .stat span{font-size:.72rem}
  /* Make sure the booking fields and their date inputs are clipped to the box. */
  .booking-box .field{overflow:hidden;min-width:0}
  .booking-box input[type=date]{font-size:.95rem;width:100%;max-width:100%;min-width:0;box-sizing:border-box;-webkit-appearance:none;appearance:none}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}

/* Booking pre-payment notice */
.book-notice{background:#fdf6ef;border:1px solid #f0e3d4;border-radius:10px;padding:12px 14px;margin:0 0 14px;}
.book-notice ul li{margin-bottom:4px;}
.book-notice a{color:var(--orange);font-weight:600;text-decoration:none;}
.book-notice a:hover{text-decoration:underline;}

/* ---- Overflow hardening (mobile/tablet/pc) ---- */
html, body { max-width: 100%; overflow-x: hidden; }
img, video { max-width: 100%; height: auto; }
input, select, textarea { max-width: 100%; }

/* Variant capacity display */
.capacity-line{background:#f3f8f6;border:1px solid #dcebe4;border-radius:10px;padding:12px 14px;margin:12px 0;font-size:.95rem;color:var(--ink);}
.capacity-line strong{color:var(--teal, #0d4657);}
.capacity-line.flash{animation:capFlash .6s ease;}
@keyframes capFlash{0%{background:#fde9dd;}100%{background:#f3f8f6;}}
.variant-compare{margin:10px 0;max-width:100%;}
.variant-compare summary{cursor:pointer;font-size:.88rem;color:var(--orange,#fe7f38);font-weight:600;padding:6px 0;list-style:none;}
.variant-compare summary::-webkit-details-marker{display:none;}
.variant-compare summary::before{content:'▸ ';}
.variant-compare[open] summary::before{content:'▾ ';}
.variant-table{width:100%;max-width:100%;border-collapse:collapse;margin-top:8px;font-size:.82rem;table-layout:fixed;}
.variant-table th,.variant-table td{text-align:left;padding:7px 6px;border-bottom:1px solid #eee;overflow-wrap:anywhere;word-break:break-word;}
.variant-table th{font-weight:600;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.02em;}
.variant-table tbody tr:last-child td{border-bottom:none;}

/* Extra guests / early check-in note */
.extra-note{background:#f0f9f3;border:1px solid #cfe9d9;border-radius:10px;padding:12px 14px;margin:0 0 12px;}
.extra-note a{text-decoration:none;}
.extra-note a:hover{text-decoration:underline;}

/* Booking closed (public apartment page) */
.booking-closed{background:#fff;border:1px solid #e7ddcf;border-radius:12px;padding:18px;text-align:center;}

/* Guest account area */
.acct-nav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:24px;border-bottom:1px solid #e7ddcf;}
.acct-nav a{padding:10px 16px;color:#6a6253;text-decoration:none;font-weight:600;font-size:.92rem;border-bottom:2px solid transparent;margin-bottom:-1px;}
.acct-nav a.active{color:#0a3845;border-bottom-color:#fe7f38;}
.acct-nav a:hover{color:#0a3845;}
.acct-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:32px;}
@media(max-width:600px){.acct-stats{grid-template-columns:repeat(2,1fr);}}
.acct-stat{background:#fff;border:1px solid #e7ddcf;border-radius:12px;padding:16px;text-align:center;}
.acct-stat b{display:block;font-size:1.5rem;color:#0a3845;font-family:var(--font-display);}
.acct-stat span{font-size:.8rem;color:#8a8474;}

/* Mobile hamburger + dropdown nav */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;background:transparent;border:0;cursor:pointer;padding:8px;}
.nav-toggle span{display:block;height:2px;width:100%;background:#e9f1f3;border-radius:2px;transition:transform .25s,opacity .2s;}
.nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.active span:nth-child(2){opacity:0;}
.nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-nav{display:none;flex-direction:column;background:rgba(10,56,69,.97);backdrop-filter:blur(14px);border-top:1px solid var(--line-dark);padding:10px 18px 20px;}
.mobile-nav.open{display:flex;}
.mobile-nav a,.mobile-link-btn{display:block;width:100%;text-align:left;padding:14px 4px;color:#e9f1f3;text-decoration:none;font-size:1.05rem;font-weight:500;border:0;background:none;border-bottom:1px solid rgba(255,255,255,.08);cursor:pointer;}
.mobile-nav a.active{color:var(--orange);}
.mobile-nav .mobile-cta{margin-top:14px;text-align:center;border:0;color:#fff;background:var(--orange);border-radius:10px;padding:14px;font-weight:700;}
@media(min-width:721px){.mobile-nav{display:none!important;}.nav-toggle{display:none!important;}}


/* Booking hold notice */
.hold-note{background:#fff6ef;border:1px solid #f3d9c2;border-radius:9px;padding:9px 12px;color:#8a5a33;font-size:.82rem;margin-top:10px;}
.hold-note strong{color:#c2571f;}

/* Compact install pill — sits bottom-left, above content, clear of the WhatsApp float */
.install-pill{position:fixed;left:14px;bottom:16px;z-index:8000;display:flex;align-items:center;gap:8px;
  background:#0f8a43;color:#fff;border-radius:16px;padding:9px 12px;max-width:min(300px,calc(100vw - 90px));
  box-shadow:0 6px 18px rgba(10,40,55,.28);font-size:.8rem;}
.install-pill-ico{width:26px;height:26px;border-radius:7px;flex:0 0 auto;}
.install-pill-txt{white-space:normal;color:#fff;line-height:1.25;}
.install-pill-txt b{font-size:.9rem;}

.install-pill-btn{background:#0a3845;color:#fff;border:0;border-radius:999px;padding:6px 14px;font-weight:700;font-size:.8rem;cursor:pointer;flex:0 0 auto;}
.install-pill-x{background:transparent;border:0;color:#d6f3e2;font-size:.95rem;cursor:pointer;flex:0 0 auto;padding:2px 4px;line-height:1;}
@media(max-width:380px){.install-pill{font-size:.74rem;left:10px;bottom:12px;}}

/* "Book now" jump bar under the apartment photos */
.booknow-bar{background:var(--ink);padding:0 0 22px;}
.booknow-btn{background:var(--orange);color:#fff;border:0;font-weight:700;font-size:1.05rem;box-shadow:0 8px 22px -8px rgba(254,127,56,.7);}
.booknow-btn:hover{filter:brightness(1.05);}
@media(min-width:721px){
  /* on desktop, keep it tidy width, centered */
  .booknow-bar .container{display:flex;justify-content:center;}
  .booknow-btn{max-width:380px;}
}

/* Tap-to-unmute pill on apartment videos */
.carousel-slide{position:relative}
.unmute-pill{position:absolute;left:12px;bottom:56px;z-index:4;background:rgba(10,56,69,.82);color:#fff;border:0;border-radius:999px;padding:8px 14px;font-size:.85rem;font-weight:600;cursor:pointer;backdrop-filter:blur(4px)}
.unmute-pill.on{background:var(--orange);color:#1a1205}

/* Trust band (home) */
.trust-band .trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-dark);border:1px solid var(--line-dark);border-radius:var(--radius);overflow:hidden;}
.trust-item{background:var(--ink);padding:30px 26px;}
.trust-ico{width:48px;height:48px;border-radius:13px;background:var(--teal-2);display:grid;place-items:center;font-size:1.5rem;margin-bottom:16px;}
.trust-item h3{color:#fff;font-size:1.12rem;margin-bottom:8px;}
.trust-item p{color:var(--muted-d);font-size:.92rem;margin:0;line-height:1.55;}
@media(max-width:900px){.trust-band .trust-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.trust-band .trust-grid{grid-template-columns:1fr;}}

/* Error page mark */
.err-mark{display:inline-grid;place-items:center;}

/* Guest account: next-stay countdown banner */
.next-stay-banner{display:flex;justify-content:space-between;align-items:center;gap:18px;background:var(--ink);color:#fff;border-radius:var(--radius);padding:22px 26px;margin-bottom:18px;flex-wrap:wrap;position:relative;overflow:hidden;}
.next-stay-banner::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;background:radial-gradient(circle,rgba(254,127,56,.22),transparent 65%);pointer-events:none;}
.next-stay-banner .ns-eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:var(--orange);font-weight:700;}
.next-stay-banner h3{color:#fff;font-size:1.5rem;margin:6px 0 4px;}
.next-stay-banner p{color:var(--muted-d);margin:0;font-size:.92rem;}
.next-stay-banner .ns-count{text-align:center;position:relative;z-index:1;}
.next-stay-banner .ns-count b{display:block;font-family:var(--font-display);font-size:2.6rem;color:var(--orange);line-height:1;}
.next-stay-banner .ns-count span{font-size:.78rem;color:var(--muted-d);text-transform:uppercase;letter-spacing:.08em;}

/* iOS Safari renders <input type=date> wider than its container (the native
   control + long "Jun 14, 2026" value ignore width:100%). Force it to behave. */
.booking-box input[type=date],
.field input[type=date]{
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
.booking-box input[type=date]::-webkit-date-and-time-value{
  text-align:left;
  margin:0;
  min-width:0;
}
.booking-box input[type=date]::-webkit-datetime-edit{
  padding:0;
  min-width:0;
  overflow:hidden;
}
.booking-box input[type=date]::-webkit-calendar-picker-indicator{
  margin-left:auto;
  flex:0 0 auto;
}

/* Stay-type note (shoots = party rate) */
.staytype-note{font-size:.82rem;color:var(--muted);background:#f3f8f6;border:1px solid #dcebe4;border-radius:9px;padding:9px 12px;margin:-6px 0 14px;line-height:1.45}
.staytype-note strong{color:var(--teal,#0d4657)}

/* Installed-app back button in the header (standalone only; toggled via JS) */
.app-back{
  display:none; align-items:center; justify-content:center;
  width:38px; height:38px; margin-right:6px; flex:0 0 auto;
  background:transparent; border:1.5px solid var(--line); border-radius:10px;
  color:var(--ink-text); font-size:1.6rem; line-height:1; cursor:pointer;
  -webkit-text-fill-color:var(--ink-text);
}
.app-back:active{ background:rgba(0,0,0,.04); }