:root { --ink:#17221d; --cream:#f4f0e7; --paper:#fbfaf6; --coral:#ef6d4d; --sage:#80907d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; }
.nav { position:absolute; z-index:10; top:0; left:0; width:100%; height:88px; display:flex; align-items:center; justify-content:space-between; padding:0 5vw; color:white; border-bottom:1px solid rgba(255,255,255,.28); }
.brand { font-size:25px; font-weight:800; letter-spacing:-1.3px; }
.brand span { font-weight:300; }
.navLinks { display:flex; align-items:center; gap:34px; font-size:14px; }
.navLinks>a:not(.navCta):hover { opacity:.68; }
.navCta { border:1px solid rgba(255,255,255,.7); border-radius:99px; padding:11px 20px; transition:.2s; }
.navCta:hover { background:white; color:var(--ink); }
.hero { position:relative; min-height:92vh; display:flex; align-items:flex-end; color:white; overflow:hidden; }
.hero>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform:scale(1.015); }
.heroShade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,20,15,.75),rgba(9,20,15,.25) 56%,rgba(9,20,15,.12)),linear-gradient(0deg,rgba(9,20,15,.62),transparent 54%); }
.heroContent { position:relative; z-index:2; width:min(760px,90%); margin:0 0 13vh 8vw; }
.eyebrow,.sectionTag { font-size:12px; font-weight:700; letter-spacing:.2em; }
h1 { margin:18px 0; max-width:720px; font-family:Georgia,'Times New Roman',serif; font-size:clamp(48px,6.2vw,86px); line-height:.94; font-weight:400; letter-spacing:-.045em; }
.lead { max-width:550px; font-size:19px; line-height:1.55; color:rgba(255,255,255,.88); }
.heroActions { display:flex; align-items:center; gap:28px; margin-top:34px; }
.primaryButton { display:inline-flex; align-items:center; gap:28px; padding:16px 22px; border-radius:4px; background:var(--coral); color:white; font-size:14px; font-weight:700; transition:transform .2s,background .2s; }
.primaryButton:hover { transform:translateY(-2px); background:#df5d3d; }
.primaryButton span { font-size:18px; }
.textLink { font-size:14px; border-bottom:1px solid rgba(255,255,255,.55); padding:10px 0; }
.quickFacts { position:absolute; z-index:2; right:5vw; bottom:40px; display:flex; gap:28px; font-size:12px; }
.quickFacts span { display:flex; flex-direction:column; padding-left:18px; border-left:1px solid rgba(255,255,255,.45); }
.quickFacts b { font-family:Georgia,serif; font-size:23px; font-weight:400; }
.intro { padding:125px 8vw; display:grid; grid-template-columns:.8fr 2fr 1.1fr; gap:5vw; align-items:start; }
.sectionTag { color:var(--coral); margin-top:16px; }
h2 { margin:0; max-width:720px; font:400 clamp(42px,5.2vw,74px)/1.03 Georgia,serif; letter-spacing:-.045em; }
.intro>p:last-child,.locationCopy>p,.hostGrid>div>p { margin:12px 0 0; color:#59645d; line-height:1.8; }
.gallery { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:260px; grid-auto-flow:dense; gap:14px; padding:0 4vw 130px; }
.galleryItem { margin:0; overflow:hidden; position:relative; background:#ddd5c6; }
.galleryItem img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.galleryItem:hover img { transform:scale(1.025); }
.item1,.item2,.item5,.item8,.item16 { grid-row:span 2; }
.item3,.item4,.item7,.item10,.item13,.item14,.item15 { grid-column:span 2; }
.gallery figcaption { position:absolute; left:25px; bottom:22px; color:white; font:italic 22px Georgia,serif; text-shadow:0 2px 15px rgba(0,0,0,.55); }
.amenitiesSection { display:grid; grid-template-columns:1.05fr .95fr; align-items:stretch; background:var(--paper); }
.amenitiesPhoto { position:relative; min-height:560px; max-height:680px; overflow:hidden; }
.amenitiesPhoto img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.amenitiesContent { padding:70px 6vw; }
.amenitiesTitle .sectionTag { margin:0 0 24px; }
.amenitiesTitle h2 { font-size:clamp(38px,4.6vw,64px); margin-bottom:48px; }
.amenitiesGrid { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #d8d6cd; }
.amenity { display:grid; grid-template-columns:42px 1fr; gap:14px; padding:27px 18px 27px 0; border-bottom:1px solid #d8d6cd; }
.amenity:nth-child(odd) { border-right:1px solid #d8d6cd; margin-right:20px; }
.amenityIcon { font:24px Georgia,serif; color:var(--coral); }
.amenity h3 { margin:0 0 7px; font:400 19px Georgia,serif; }
.amenity p { margin:0; color:#717a74; font-size:13px; line-height:1.5; }
.superhostBand { background:#768875; color:white; padding:82px 8vw; display:grid; grid-template-columns:auto 1fr; gap:45px; align-items:center; }
.superhostMedal { display:grid; place-items:center; width:112px; height:112px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(255,255,255,.1); font-size:54px; }
.superhostBand .eyebrow { color:#f5cf87; margin:0 0 15px; }
.superhostBand h2 { max-width:850px; font-size:clamp(38px,4.6vw,65px); }
.location { display:grid; grid-template-columns:1.05fr .95fr; align-items:stretch; background:#e8e4d9; }
.locationPhoto { position:relative; min-height:560px; max-height:680px; overflow:hidden; }
.locationPhoto img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.locationCopy { padding:75px 7vw; }
.locationCopy .sectionTag { margin:0 0 28px; }
.locationCopy ul { padding:20px 0; list-style:none; margin:28px 0; border-top:1px solid #c9c6bb; }
.locationCopy li { display:flex; align-items:baseline; gap:30px; padding:16px 0; border-bottom:1px solid #c9c6bb; }
.locationCopy li b { width:70px; font:400 22px Georgia,serif; }
.locationCopy li span { color:#626c66; font-size:14px; }
.darkLink { display:inline-block; font-size:14px; font-weight:700; border-bottom:1px solid; padding:8px 0; }
.host { padding:130px 8vw; background:var(--paper); }
.host>.sectionTag { margin:0 0 34px; }
.hostGrid { display:grid; grid-template-columns:1fr 1fr; gap:9vw; }
.hostFacts { display:flex; gap:38px; margin-top:42px; }
.hostFacts span { display:flex; flex-direction:column; color:#6c766f; font-size:12px; }
.hostFacts b { color:var(--ink); font:400 30px Georgia,serif; margin-bottom:5px; }
.booking { min-height:610px; display:grid; place-items:center; text-align:center; color:white; background:linear-gradient(rgba(16,33,25,.6),rgba(16,33,25,.72)),url('images/ventana.jpeg') center/cover; padding:80px 20px; }
.booking>div { max-width:700px; }
.booking h2 { font-size:clamp(64px,9vw,120px); margin:12px auto; }
.booking p:not(.eyebrow) { color:rgba(255,255,255,.78); margin:20px 0 32px; }
.booking .primaryButton { margin:auto; }
footer { display:grid; grid-template-columns:1fr 1fr 1fr; gap:30px; align-items:center; padding:60px 5vw 30px; background:var(--ink); color:white; }
.footerBrand { font-size:27px; }
footer p { color:rgba(255,255,255,.55); font-size:13px; }
footer>div { display:flex; justify-content:flex-end; gap:25px; font-size:13px; }
footer small { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.15); padding-top:25px; color:rgba(255,255,255,.4); }
@media (max-width:900px) {
  .nav{height:74px}.navLinks>a:not(.navCta){display:none}.hero{min-height:88svh}.heroContent{margin:0 6vw 16vh}h1{font-size:clamp(54px,17vw,82px)}.lead{font-size:17px}
  .quickFacts{left:6vw;right:auto;bottom:24px;gap:15px}.quickFacts span:nth-child(4){display:none}h1{font-size:clamp(46px,12vw,68px)}
  .intro{grid-template-columns:1fr;padding:85px 6vw;gap:24px}.sectionTag{margin:0}.heroActions{align-items:flex-start;flex-direction:column;gap:12px}
  .gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:260px;padding:0 4vw 80px}.item1,.item2,.item5,.item8,.item16{grid-row:span 1}.item3,.item4,.item7,.item10,.item13,.item14,.item15{grid-column:span 2}
  .amenitiesSection{grid-template-columns:1fr}.amenitiesPhoto{min-height:0;height:min(58vw,440px)}.amenitiesContent{padding:70px 7vw}.superhostBand{padding:65px 7vw;gap:28px}.superhostMedal{width:88px;height:88px;font-size:42px}
  .location{grid-template-columns:1fr}.locationPhoto{min-height:0;height:min(58vw,440px)}.locationCopy{padding:70px 7vw}.host{padding:85px 7vw}.hostGrid{grid-template-columns:1fr;gap:35px}
}
@media (max-width:600px) {
  .amenitiesPhoto,.locationPhoto{min-height:0;height:56vw;max-height:260px}.amenitiesPhoto img,.locationPhoto img{object-position:center center}.amenitiesContent,.locationCopy{padding:52px 7vw}.amenitiesTitle h2{margin-bottom:30px}
  .gallery{display:flex;overflow-x:auto;gap:10px;padding:0 6vw 75px;scroll-snap-type:x mandatory}.galleryItem{display:block;min-width:85vw;height:420px;scroll-snap-align:center}.gallery figcaption{font-size:17px}
  .amenitiesGrid{grid-template-columns:1fr}.amenity:nth-child(odd){border-right:0;margin-right:0}.superhostBand{grid-template-columns:1fr;text-align:center}.superhostMedal{margin:auto}
  .hostFacts{gap:20px;flex-wrap:wrap}.booking{min-height:540px}footer{grid-template-columns:1fr;text-align:center}footer>div{justify-content:center}footer small{grid-column:1}
}
