/* ================================================================
   CEYBREEZ CSS DEVELOPER NOTE
   FILE: stays-v4.css
   PURPOSE: Styles used by the CeyBreez public website.
   EDITING TIP: Search for "CSS SECTION:" to jump to major visual areas.
   IMPORTANT: V4 files are override layers and should load AFTER the base CSS.
   ================================================================ */


/* CeyBreez Stays V4 visual layer — load after base page CSS + ceybreez-public-v3.css */
:root{--v4-ink:#083f37;--v4-green:#07584d;--v4-green2:#0c6f61;--v4-cream:#f6f0e5;--v4-sand:#ebe1d0;--v4-line:rgba(8,63,55,.12);--v4-muted:#5c6a65}
body[data-page="villas"],body[data-page="apartments"],body[data-page="homestays"]{background:#f8f4ec;color:#173c35}

/* ----------------------------------------------------------------
   CSS SECTION: STAY HERO
   CONTROLS: Shared Villas/Apartments/Homestays hero.
   HTML: Search the matching page for "SECTION: STAY HERO" or the selector below.
   ---------------------------------------------------------------- */
.stay-v4-hero{--stay-hero:url('images/cover.jpg');min-height:92vh;padding:150px 6vw 78px;display:flex;align-items:flex-end;color:#fff;background:linear-gradient(90deg,rgba(4,34,30,.88) 0%,rgba(4,34,30,.58) 45%,rgba(4,34,30,.18) 75%),var(--stay-hero) center/cover no-repeat;position:relative;overflow:hidden}
.stay-v4-hero:after{content:"";position:absolute;right:-80px;bottom:-160px;width:420px;height:420px;border-radius:50%;border:1px solid rgba(255,255,255,.16)}
.stay-v4-hero-inner{width:min(1380px,100%);margin:auto;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.55fr);align-items:end;gap:70px;position:relative;z-index:2}
.stay-v4-copy{max-width:790px}.stay-v4-eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:'DM Sans',sans-serif;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#e8c777;margin-bottom:20px}.stay-v4-eyebrow:before{content:"";width:28px;height:1px;background:currentColor}.stay-v4-eyebrow.dark{color:#b27b20}
.stay-v4-copy h1{font-family:'Cormorant Garamond',serif;font-size:clamp(52px,6.4vw,96px);line-height:.94;letter-spacing:-.035em;font-weight:600;max-width:850px;margin:0 0 24px;color:#fff}.stay-v4-copy>p{font-family:'DM Sans',sans-serif;font-size:clamp(16px,1.5vw,20px);line-height:1.72;max-width:690px;color:rgba(255,255,255,.82);margin:0 0 32px}
.stay-v4-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}.stay-v4-actions a{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:50px;padding:0 22px;border-radius:999px;text-decoration:none;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:700}.stay-v4-primary{background:#fff;color:var(--v4-ink)}.stay-v4-primary:hover{transform:translateY(-2px)}.stay-v4-secondary{color:#fff;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.08);backdrop-filter:blur(8px)}
.stay-v4-tags{display:flex;flex-wrap:wrap;gap:18px}.stay-v4-tags span{display:inline-flex;align-items:center;gap:7px;font:600 12px 'DM Sans',sans-serif;color:rgba(255,255,255,.82)}.stay-v4-tags i{font-size:13px;color:#e8c777}
.stay-v4-note{border-left:1px solid rgba(255,255,255,.28);padding:10px 0 12px 30px;margin-bottom:6px}.stay-v4-note>span{display:block;font:700 10px 'DM Sans',sans-serif;letter-spacing:.18em;color:#e8c777;margin-bottom:14px}.stay-v4-note strong{display:block;font:600 37px/1.02 'Cormorant Garamond',serif;margin-bottom:14px}.stay-v4-note p{font:400 13px/1.65 'DM Sans',sans-serif;color:rgba(255,255,255,.72);max-width:280px}

/* ----------------------------------------------------------------
   CSS SECTION: STAY INTRO
   CONTROLS: Editorial intro and key points.
   HTML: Search the matching page for "SECTION: STAY INTRO" or the selector below.
   ---------------------------------------------------------------- */
.stay-v4-intro{width:min(1380px,calc(100% - 48px));margin:0 auto;padding:92px 0 72px;display:grid;grid-template-columns:1fr 1.25fr;gap:90px;align-items:start}.stay-v4-intro-copy h2,.stay-v4-section-head h2{font:600 clamp(40px,4vw,62px)/1.02 'Cormorant Garamond',serif;color:var(--v4-ink);letter-spacing:-.025em;margin:0 0 18px}.stay-v4-intro-copy>p{font:400 15px/1.8 'DM Sans',sans-serif;color:var(--v4-muted);max-width:560px}
.stay-v4-intro-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--v4-line)}.stay-v4-intro-grid>div{padding:24px 24px 0 0}.stay-v4-intro-grid strong{display:block;font:700 11px 'DM Sans',sans-serif;color:#b27b20;margin-bottom:24px}.stay-v4-intro-grid span{display:block;font:600 23px/1.05 'Cormorant Garamond',serif;color:var(--v4-ink);margin-bottom:10px}.stay-v4-intro-grid p{font:400 12.5px/1.65 'DM Sans',sans-serif;color:#69736f}

/* ----------------------------------------------------------------
   CSS SECTION: STAY PHOTO GALLERY
   CONTROLS: Shared editorial image grid.
   HTML: Search the matching page for "SECTION: STAY PHOTO GALLERY" or the selector below.
   ---------------------------------------------------------------- */
.editorial-gallery{width:min(1380px,calc(100% - 48px))!important;margin:0 auto!important;padding:0 0 74px!important;background:transparent!important}.editorial-gallery-head{margin-bottom:25px!important}.editorial-gallery-head h2{font-size:clamp(38px,4vw,58px)!important;color:var(--v4-ink)!important}.editorial-gallery-head p{color:#66736e!important}.editorial-gallery-grid{gap:14px!important}.editorial-gallery-grid figure{border-radius:22px!important;overflow:hidden!important;box-shadow:none!important}.editorial-gallery-grid img{min-height:250px!important;transition:transform .7s ease!important}.editorial-gallery-grid figure:hover img{transform:scale(1.035)}

/* ----------------------------------------------------------------
   CSS SECTION: STAY MOOD CARDS
   CONTROLS: Image-led stay style cards.
   HTML: Search the matching page for "SECTION: STAY MOOD CARDS" or the selector below.
   ---------------------------------------------------------------- */
.stay-v4-moods{width:min(1380px,calc(100% - 48px));margin:0 auto;padding:18px 0 92px}.stay-v4-section-head{max-width:760px;margin-bottom:32px}.stay-v4-section-head>p{font:400 15px/1.7 'DM Sans',sans-serif;color:var(--v4-muted);max-width:640px}.stay-v4-mood-grid{display:grid;grid-template-columns:1.12fr .94fr .94fr;gap:14px}.stay-v4-mood{min-height:460px;border-radius:24px;overflow:hidden;position:relative;background:#0b4e44}.stay-v4-mood img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s ease}.stay-v4-mood:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,35,31,.05) 28%,rgba(5,35,31,.86) 100%)}.stay-v4-mood>div{position:absolute;z-index:2;left:26px;right:26px;bottom:24px;color:#fff}.stay-v4-mood>div span{font:700 9px 'DM Sans',sans-serif;letter-spacing:.18em;color:#efd28b}.stay-v4-mood h3{font:600 32px/1.05 'Cormorant Garamond',serif;margin:7px 0 7px}.stay-v4-mood p{font:400 12.5px/1.55 'DM Sans',sans-serif;color:rgba(255,255,255,.78);max-width:360px}.stay-v4-mood:hover img{transform:scale(1.04)}

/* ----------------------------------------------------------------
   CSS SECTION: PROPERTY LISTING
   CONTROLS: CMS/API property filters and cards.
   HTML: Search the matching page for "SECTION: PROPERTY LISTING" or the selector below.
   ---------------------------------------------------------------- */
.properties-section{padding:86px 24px 96px!important;background:#efe7da!important;text-align:left!important}.stay-v4-property-head{width:min(1300px,100%);margin:0 auto 30px}.stay-v4-property-head h2{font:600 clamp(42px,4vw,62px)/1 'Cormorant Garamond',serif!important;color:var(--v4-ink)!important;margin:0 0 12px!important}.stay-v4-property-head p{margin:0!important;max-width:650px!important;font:400 14px/1.7 'DM Sans',sans-serif!important;color:#62706b!important}.property-filters{width:min(1300px,100%);margin:0 auto 30px!important;justify-content:flex-start!important;gap:10px!important}.property-filters input,.property-filters select{min-width:0!important;flex:1 1 190px;max-width:300px;padding:13px 15px!important;border:1px solid rgba(8,63,55,.13)!important;border-radius:12px!important;background:#fff!important;color:#27483f!important;font:500 13px 'DM Sans',sans-serif!important;box-shadow:none!important}.property-grid{width:min(1300px,100%);gap:18px!important}.property-card{background:#fff!important;border:1px solid rgba(8,63,55,.08)!important;border-radius:22px!important;box-shadow:0 10px 30px rgba(18,56,47,.06)!important}.property-card:hover{transform:translateY(-4px)!important;box-shadow:0 18px 38px rgba(18,56,47,.10)!important}.property-card img{height:270px!important}.property-content{padding:20px 20px 22px!important}.property-content h3{font-size:29px!important;color:var(--v4-ink)!important}.property-content p{font-family:'DM Sans',sans-serif!important;color:#65716d!important}.property-meta span{background:#f5f0e7!important;color:#31594e!important;font-size:11px!important}.price{color:#a27124!important}.property-card button{border-radius:999px!important;background:var(--v4-green)!important;font-family:'DM Sans',sans-serif!important;font-size:12px!important;padding:11px 17px!important}.quick-inquiry-btn{background:#e7d3a4!important;color:#173c35!important}

/* ----------------------------------------------------------------
   CSS SECTION: WHY BOOK
   CONTROLS: Benefit/trust cards.
   HTML: Search the matching page for "SECTION: WHY BOOK" or the selector below.
   ---------------------------------------------------------------- */
.stay-v4-why{padding:92px 24px;background:#073f37;color:#fff}.stay-v4-why .stay-v4-section-head{width:min(1300px,100%);margin:0 auto 34px}.stay-v4-section-head.light h2{color:#fff}.stay-v4-section-head.light>p{color:rgba(255,255,255,.68)}.stay-v4-why-grid{width:min(1300px,100%);margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.stay-v4-why-grid article{border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:28px;background:rgba(255,255,255,.045)}.stay-v4-why-grid i{font-size:20px;color:#e8c777;margin-bottom:32px}.stay-v4-why-grid h3{font:600 27px 'Cormorant Garamond',serif;margin-bottom:9px}.stay-v4-why-grid p{font:400 13px/1.7 'DM Sans',sans-serif;color:rgba(255,255,255,.68)}

/* ----------------------------------------------------------------
   CSS SECTION: PROPERTY INQUIRY FORM
   CONTROLS: Shared inquiry form styling.
   HTML: Search the matching page for "SECTION: PROPERTY INQUIRY FORM" or the selector below.
   ---------------------------------------------------------------- */
.villa-inquiry-section,.property-inquiry-section{padding:92px 24px!important;background:#f8f4ec!important;text-align:left!important}.villa-inquiry-section>h2,.property-inquiry-section>h2,.villa-inquiry-section>.section-intro,.property-inquiry-section>.section-intro,.stay-v4-inquiry-eye{display:block;width:min(1100px,100%);margin-left:auto!important;margin-right:auto!important}.stay-v4-inquiry-eye{margin-bottom:12px!important}.villa-inquiry-section>h2,.property-inquiry-section>h2{font:600 clamp(42px,4vw,60px)/1 'Cormorant Garamond',serif!important;color:var(--v4-ink)!important;margin-bottom:12px!important}.villa-inquiry-section>.section-intro,.property-inquiry-section>.section-intro{font:400 14px/1.7 'DM Sans',sans-serif!important;color:#66736e!important;margin-bottom:28px!important}.villa-inquiry-box,.property-inquiry-box{max-width:1100px!important;padding:30px!important;border:1px solid rgba(8,63,55,.09)!important;border-radius:22px!important;background:#fff!important;box-shadow:0 18px 50px rgba(25,57,50,.08)!important}.field-group label{font-family:'DM Sans',sans-serif!important;color:#31594e!important;font-size:11.5px!important}.villa-inquiry-box input,.villa-inquiry-box textarea,.villa-inquiry-box select,.property-inquiry-box input,.property-inquiry-box textarea,.property-inquiry-box select{min-height:47px!important;border:1px solid #dcd9d1!important;border-radius:11px!important;background:#faf8f4!important;color:#173c35!important;font-family:'DM Sans',sans-serif!important}.send-inquiry-btn{min-height:50px!important;border-radius:999px!important;background:var(--v4-green)!important;font:700 13px 'DM Sans',sans-serif!important}
.cta{padding:82px 24px!important;background:#e7d3a4!important}.cta h2{font-size:clamp(40px,4vw,58px)!important;color:var(--v4-ink)!important}.cta p{font-family:'DM Sans',sans-serif!important;color:#4f635d!important;font-size:14px!important}.cta a{background:var(--v4-ink)!important;font:700 12px 'DM Sans',sans-serif!important;padding:13px 21px!important}.cb-social-proof{background:#fff!important}
@media(max-width:900px){.stay-v4-hero{min-height:auto;padding:130px 24px 60px}.stay-v4-hero-inner{grid-template-columns:1fr;gap:42px}.stay-v4-note{max-width:420px}.stay-v4-intro{grid-template-columns:1fr;gap:42px;padding:65px 0 55px}.stay-v4-mood-grid{grid-template-columns:1fr 1fr}.stay-v4-mood:first-child{grid-column:1/-1}.stay-v4-why-grid{grid-template-columns:1fr}.property-card img{height:240px!important}}
@media(max-width:640px){.stay-v4-hero{padding:118px 18px 45px}.stay-v4-copy h1{font-size:50px}.stay-v4-note{padding-left:20px}.stay-v4-note strong{font-size:30px}.stay-v4-tags{gap:10px 14px}.stay-v4-intro,.editorial-gallery,.stay-v4-moods{width:calc(100% - 30px)!important}.stay-v4-intro-grid{grid-template-columns:1fr}.stay-v4-intro-grid>div{padding-top:18px}.stay-v4-mood-grid{grid-template-columns:1fr}.stay-v4-mood:first-child{grid-column:auto}.stay-v4-mood{min-height:390px}.properties-section,.stay-v4-why,.villa-inquiry-section,.property-inquiry-section{padding-left:15px!important;padding-right:15px!important}.property-filters input,.property-filters select{max-width:none!important}.villa-inquiry-box,.property-inquiry-box{padding:18px!important}.stay-v4-actions a{width:100%}}