/* ===== Contemplación · tema In Flow (salvia + oro + crema) ===== */
:root{
  --teal:#57634a; --teal-deep:#434b37; --sage:#a9b79a; --sage-soft:#d3dbc7;
  --sand:#efe7d3; --cream:#f6f1e4; --offwhite:#fdfbf5;
  --gold:#d8b24a; --gold-soft:#e8d171; --ink:#2b2721; --white:#fff;
  --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif; --script:'Ephesis',cursive;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--offwhite);font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;letter-spacing:-.01em}
em{font-style:italic}
.script{font-family:var(--script);font-style:normal;font-weight:400}
.eyebrow{font-family:var(--sans);font-weight:500;letter-spacing:.28em;text-transform:uppercase;font-size:.72rem}
.wrap{max-width:1200px;margin:0 auto;padding:0 6vw}
.btn{display:inline-block;font-family:var(--sans);font-weight:400;letter-spacing:.16em;text-transform:uppercase;font-size:.72rem;padding:1.05em 2.4em;transition:.25s;cursor:pointer;border:none}
.btn-solid{background:var(--sage-soft);color:var(--teal-deep)}
.btn-solid:hover{background:var(--white)}
.btn-gold{background:var(--gold);color:var(--white)}
.btn-gold:hover{background:var(--teal-deep)}
.btn-outline{border:1px solid rgba(255,255,255,.7);color:#fff}
.btn-outline:hover{background:rgba(255,255,255,.14)}
.btn-dark{background:var(--teal);color:#fff}
.btn-dark:hover{background:var(--teal-deep)}

/* wordmark */
.wordmark{text-align:center;line-height:1;color:inherit}
.wm-name{font-family:var(--serif);font-weight:400;letter-spacing:.24em;font-size:1.4rem;display:block}
.wm-sub{font-family:var(--sans);font-weight:400;letter-spacing:.32em;text-transform:uppercase;font-size:.55rem;display:block;margin-top:.55rem;opacity:.85}

/* ===== TOP NAV (interior + sticky) ===== */
.topnav{position:sticky;top:0;z-index:60;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;gap:2.2rem;padding:1.1rem 6vw;font-family:var(--serif);font-style:italic;font-size:1.02rem}
.topnav a{opacity:.9;transition:.2s;white-space:nowrap}
.topnav a:hover{opacity:1;color:var(--gold-soft)}
.topnav .brand{font-style:normal;font-family:var(--serif);letter-spacing:.2em;font-size:1.1rem;font-weight:400}
.topnav .nav-r,.topnav .nav-l{display:flex;gap:2.2rem;align-items:center;flex:1}
.topnav .nav-r{justify-content:flex-start}.topnav .nav-l{justify-content:flex-end}
.topnav .book{font-style:normal;font-family:var(--sans);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;border:1px solid rgba(255,255,255,.6);padding:.55em 1.3em}
.topnav .book:hover{background:rgba(255,255,255,.14)}
.navtoggle{display:none}

/* ===== INTERIOR PAGE HERO ===== */
.phero{position:relative;min-height:62vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;
  background-size:cover;background-position:center}
.phero::before{content:'';position:absolute;inset:0;background:linear-gradient(rgba(38,42,32,.24),rgba(38,42,32,.44))}
.phero .inner{position:relative;z-index:2;max-width:760px;padding:0 6vw}
.phero .eyebrow{color:var(--gold-soft)}
.phero h1{font-size:clamp(2.6rem,6vw,4.6rem);font-weight:300;margin:1rem 0 1rem}
.phero p{opacity:.95;max-width:46ch;margin:0 auto}

/* generic section */
.section{padding:6rem 0}
.section.cream{background:var(--cream)}
.section.sand{background:var(--sand)}
.section.sage{background:var(--sage-soft)}
.center-head{max-width:640px;margin:0 auto 3rem;text-align:center}
.center-head .eyebrow{color:var(--gold)}
.center-head h2{font-size:clamp(2rem,4.2vw,3.2rem);font-weight:300;margin:1rem 0 1rem}
.center-head p{color:#5b564d}
.lead{color:#5b564d}

/* HERO (home) */
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(rgba(38,42,32,.14),rgba(38,42,32,.34)),url('https://contemplacion.antetodomarketing.com/img/atardecer-hero.jpg') center/cover no-repeat;color:#fff}
.hero-top{position:absolute;top:2.4rem;left:0;right:0;display:flex;justify-content:center}
.hero-nav{position:absolute;top:50%;right:6vw;transform:translateY(-50%);display:flex;flex-direction:column;gap:1.15rem;text-align:right;font-family:var(--serif);font-style:italic;font-size:1.15rem}
.hero-nav a{opacity:.9;transition:.2s}.hero-nav a:hover{opacity:1;color:var(--gold-soft)}
.hero-nav .pill{font-style:normal;font-family:var(--sans);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;border:1px solid rgba(255,255,255,.6);padding:.55em 1.4em;margin-top:.4rem;align-self:flex-end}
.hero-inner{max-width:1200px;margin:0 auto;padding:0 6vw;width:100%}
.hero h1{font-size:clamp(2.9rem,7vw,5.6rem);font-weight:300;max-width:14ch;text-shadow:0 2px 30px rgba(0,0,0,.25)}
.hero .kicker{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2vw,1.7rem);opacity:.92;margin-bottom:.6rem}
.hero p.sub{font-size:.95rem;letter-spacing:.02em;max-width:34ch;margin:1.6rem 0 2.2rem;opacity:.94}
.hero-cta{display:flex;gap:1rem;flex-wrap:wrap}
.scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);font-family:var(--serif);font-style:italic;font-size:1rem;opacity:.85;display:flex;align-items:center;gap:.5rem}

/* intro/trust */
.intro{background:var(--cream);text-align:center;padding:7rem 0 5rem}
.intro .eyebrow{color:var(--gold)}
.intro h2{font-size:clamp(2rem,4.2vw,3.3rem);font-weight:300;max-width:20ch;margin:1.2rem auto 1.4rem}
.intro p{max-width:56ch;margin:0 auto;color:#5b564d}
.awards{display:flex;justify-content:center;flex-wrap:wrap;gap:2.5rem 4rem;margin-top:3.5rem;align-items:center}
.award{text-align:center}
.award b{font-family:var(--serif);font-size:1.9rem;display:block;color:var(--teal)}
.award span{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:#8a8477}

/* split */
.split{background:var(--offwhite);padding:6.5rem 0}
.split .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:5rem;align-items:center}
.split.reverse .txt{order:2}
.split .eyebrow{color:var(--gold)}
.split h2{font-size:clamp(2rem,3.6vw,3rem);font-weight:300;margin:1rem 0 1.3rem}
.split h2 em{color:var(--teal)}
.split p{color:#5b564d;margin-bottom:1.3rem}
.polaroids{position:relative;min-height:440px}
.pol{position:absolute;background:#fff;padding:12px 12px 46px;box-shadow:0 18px 45px rgba(0,0,0,.16)}
.pol img{width:100%;height:100%;object-fit:cover}
.pol.one{width:62%;top:0;left:0;transform:rotate(-4deg)}
.pol.one img{height:300px}
.pol.two{width:52%;bottom:0;right:0;transform:rotate(3deg)}
.pol.two img{height:250px}
.pol .cap{font-family:var(--script);font-size:1.7rem;text-align:center;position:absolute;bottom:2px;left:0;right:0;color:var(--teal)}

/* rooms */
.rooms{background:var(--sand);padding:6.5rem 0}
.rooms-head{max-width:640px;margin-bottom:3rem}
.rooms-head .eyebrow{color:var(--gold)}
.rooms-head h2{font-size:clamp(2.2rem,4.5vw,3.4rem);font-weight:300;margin:1rem 0 1rem}
.rooms-head p{color:#5b564d;max-width:52ch}
.room-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}
.room-grid.three{grid-template-columns:repeat(3,1fr)}
.room{background:var(--offwhite)}
.room img{height:260px;width:100%;object-fit:cover}
.room .rb{padding:1.5rem 1.4rem 1.8rem}
.room h3{font-size:1.4rem;font-weight:400;margin-bottom:.3rem}
.room .meta{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#8a8477;margin-bottom:.9rem}
.room p{color:#5b564d;font-size:.92rem;margin-bottom:1rem}
.room a.more{font-family:var(--serif);font-style:italic;color:var(--teal);font-size:1rem}

/* feature */
.feature{background:var(--teal);color:#fff}
.feature .wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;padding:0}
.feature .media{min-height:520px;background-size:cover;background-position:center}
.feature .body{padding:5.5rem 5vw}
.feature .eyebrow{color:var(--gold-soft)}
.feature h2{font-size:clamp(2rem,3.6vw,3rem);font-weight:300;margin:1rem 0 1.3rem}
.feature p{opacity:.9;margin-bottom:1.6rem;max-width:44ch}
.feature.alt{background:var(--cream);color:var(--ink)}
.feature.alt .eyebrow{color:var(--gold)}
.feature.alt p{color:#5b564d}

/* trusted */
.trusted{background:var(--offwhite);text-align:center;padding:5rem 0 4rem}
.trusted .t{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--teal);margin-bottom:2.2rem}
.logos{display:flex;justify-content:center;flex-wrap:wrap;gap:2rem 3.5rem;align-items:center;font-family:var(--serif);font-size:1.2rem;letter-spacing:.05em}
.logos span{color:#8a8477;opacity:.75}

/* faq */
.faq{background:var(--sage-soft);padding:6.5rem 0}
.faq h2{text-align:center;font-size:clamp(2.2rem,4.5vw,3.4rem);font-weight:300;margin-bottom:.6rem}
.faq .sub{text-align:center;color:#4f6b6b;max-width:48ch;margin:0 auto 3rem}
.faq-list{max-width:820px;margin:0 auto}
.faq-item{border-top:1px solid rgba(51,102,107,.25)}
.faq-item:last-child{border-bottom:1px solid rgba(51,102,107,.25)}
.faq-q{width:100%;text-align:left;background:none;border:none;cursor:pointer;font-family:var(--serif);font-size:1.5rem;font-weight:400;color:var(--teal-deep);padding:1.5rem 3rem 1.5rem 0;position:relative}
.faq-q::after{content:'+';position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:var(--sans);font-weight:300;color:var(--gold);font-size:1.6rem;transition:.3s}
.faq-item.open .faq-q::after{transform:translateY(-50%) rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-a p{padding:0 0 1.6rem;color:#3f5a5a;max-width:64ch}

/* cta */
.cta{position:relative;text-align:center;color:#fff;padding:8rem 6vw;
  background:linear-gradient(rgba(38,42,32,.30),rgba(38,42,32,.46)),url('https://contemplacion.antetodomarketing.com/img/fogatero-pareja.jpg') center/cover no-repeat}
.cta h2{font-size:clamp(2.4rem,5vw,4rem);font-weight:300;max-width:18ch;margin:0 auto 1.4rem}
.cta p{max-width:40ch;margin:0 auto 2.4rem;opacity:.93}
.cta .g{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* footer */
footer{background:var(--teal-deep);color:#fff;text-align:center;padding:5rem 6vw 3rem}
.fcols{display:flex;justify-content:center;gap:4rem;flex-wrap:wrap;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:2.5rem}
.fcols a{opacity:.82;transition:.2s}.fcols a:hover{opacity:1;color:var(--gold-soft)}
.fbot{font-size:.7rem;letter-spacing:.12em;opacity:.6;border-top:1px solid rgba(255,255,255,.15);padding-top:2rem}

/* two-col prose (contacto etc.) */
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.info-row{margin-bottom:1.6rem}
.info-row b{font-family:var(--serif);font-size:1.15rem;font-weight:400;color:var(--teal);display:block;margin-bottom:.2rem}
.info-row span{color:#5b564d;font-size:.95rem}
.card{background:var(--offwhite);padding:2.5rem}

@media(max-width:860px){
  .hero-nav{display:none}
  .topnav{gap:1rem;font-size:.95rem;flex-wrap:wrap}
  .topnav .nav-l,.topnav .nav-r{display:none}
  .topnav.open .nav-l,.topnav.open .nav-r{display:flex;flex-direction:column;flex-basis:100%;gap:.9rem;margin-top:1rem;text-align:center;justify-content:center}
  .navtoggle{display:block;position:absolute;right:6vw;background:none;border:none;color:#fff;font-size:1.4rem;cursor:pointer}
  .split .wrap,.feature .wrap,.room-grid,.room-grid.three,.cols2{grid-template-columns:1fr;gap:2.5rem}
  .split.reverse .txt{order:0}
  .feature .media{min-height:320px}
  .feature .body{padding:3.5rem 8vw}
  .room-grid{grid-template-columns:1fr 1fr}
  .polaroids{min-height:auto;display:flex;flex-direction:column;gap:1.6rem}
  .pol{position:static;width:100%!important;transform:none!important}
  .pol.one img,.pol.two img{height:260px}
}
@media(max-width:520px){.room-grid{grid-template-columns:1fr}}