:root{
  --verde:#1F3A2C; --verde-2:#2B4A37; --verde-3:#3E6B4E; --linea-verde:#36574A;
  --tierra:#C08A4E; --tierra-clara:#E7CFA6; --tierra-texto:#8A5A2B;
  --salvia:#E4E8DA; --arena:#F5EFE3; --tinta:#16241B; --tinta-2:#2E3F33;
  --suave:#CBD6C6; --suave-2:#B9CBB9; --suave-3:#9FB3A0;
  --display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --mono:"Red Hat Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--arena);color:var(--tinta);font-family:var(--display);font-size:17px;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--tierra);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1312px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
.mono{font-family:var(--mono)}
.eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
h1,h2,h3{font-family:var(--display);font-stretch:125%;text-transform:uppercase;margin:0;text-wrap:balance}
h2{font-weight:800;font-size:clamp(32px,4vw,56px);line-height:.98}
section{scroll-margin-top:16px}

/* Portada */
.hero{position:relative;min-height:min(100svh,920px);display:flex;flex-direction:column;background:var(--verde);color:var(--arena);overflow:hidden}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%}
.hero::before,.hero::after{content:"";position:absolute;left:0;right:0;pointer-events:none}
.hero::before{top:0;height:180px;background:linear-gradient(rgba(22,36,27,.6),rgba(22,36,27,0))}
.hero::after{bottom:0;height:70%;background:linear-gradient(rgba(22,36,27,0),rgba(22,36,27,.78))}
.top{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 28px;padding-block:18px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none}
.marca img{width:48px;height:48px}
.marca span{font-stretch:125%;font-weight:700;font-size:14px;letter-spacing:.18em}
.menu{display:flex;flex-wrap:wrap;gap:0 28px;font-size:15px;font-weight:500}
.menu a,.idiomas a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.idiomas{display:flex;gap:2px;font-family:var(--mono);font-size:13px}
.idiomas a{min-width:44px;justify-content:center;color:var(--suave)}
.idiomas a[aria-current]{color:var(--arena);text-decoration:underline;text-underline-offset:5px}
.hero__cuerpo{position:relative;z-index:2;flex:1;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:36px;padding-block:24px 64px}
.hero__texto{flex:1 1 480px;min-width:0;max-width:780px;display:flex;flex-direction:column;gap:18px}
.etiqueta{align-self:flex-start;background:var(--tierra);color:var(--tinta);font-family:var(--mono);font-size:13px;letter-spacing:.12em;padding:6px 12px}
.hero h1{font-weight:800;font-size:clamp(40px,5.7vw,82px);line-height:.95;letter-spacing:-.01em}
.hero p{margin:0;font-size:19px;line-height:1.5;max-width:32em}

.reserva{flex:0 1 380px;align-self:flex-start;background:var(--verde);padding:26px;display:flex;flex-direction:column;gap:16px;box-shadow:0 20px 44px rgba(22,36,27,.35)}
.reserva h2{font-size:18px;letter-spacing:.14em;line-height:1.2}
.reserva__campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.campo{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--suave-2)}
.campo input{font:16px var(--display);letter-spacing:0;color:var(--arena);background:var(--verde-2);border:1px solid var(--verde-3);padding:12px;min-height:46px;width:100%}
.campo input:disabled{opacity:.75;cursor:not-allowed}
.btn-pronto{min-height:52px;border:none;background:var(--tierra);color:var(--tinta);font:800 15px var(--display);font-stretch:125%;letter-spacing:.12em;cursor:not-allowed}
.reserva__aviso{border-top:1px solid var(--linea-verde);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.reserva__aviso p{margin:0;font-size:14px;line-height:1.45;color:var(--suave)}

.aviso-form{display:flex;flex-wrap:wrap;gap:8px}
.aviso-form input[type=email]{flex:1 1 180px;min-width:0;min-height:46px;padding:0 12px;font:16px var(--display);color:var(--tinta);background:var(--arena);border:none}
.aviso-form button{min-height:46px;padding:0 18px;font:700 15px var(--display);cursor:pointer}
.aviso-form--claro button{border:1.5px solid var(--arena);background:transparent;color:var(--arena)}
.aviso-form button[disabled]{opacity:.6;cursor:wait}
.hp{position:absolute;left:-9999px}
.estado{flex-basis:100%;margin:0;font-size:14px;min-height:1.4em}
.estado.ok{font-weight:600}

/* Datos */
.datos{background:var(--tierra);color:var(--tinta)}
.datos dl{margin:0 auto;display:flex;flex-wrap:wrap;font-family:var(--mono)}
.datos dl>div{flex:1 1 150px;padding:20px 16px 20px 0}
.datos dt{font-size:11px;letter-spacing:.14em}
.datos dd{margin:4px 0 0;font-size:17px;font-weight:500}

/* Secciones */
.bloque{padding-block:clamp(64px,8vw,96px)}
.dos{display:flex;flex-wrap:wrap;gap:48px 56px;align-items:center}
.dos>*{flex:1 1 420px;min-width:0}
.pila{display:flex;flex-direction:column;gap:18px}
.pila p{margin:0;max-width:34em}
figure{margin:0;display:flex;flex-direction:column;gap:10px}
figcaption{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:#5A6B5E}
.foto-alta{width:100%;height:clamp(360px,42vw,540px);object-fit:cover}

.historia h2,.oasis h2,.llegar h2{color:var(--verde)}
.historia .eyebrow,.llegar .eyebrow{color:var(--tierra-texto)}
.oasis{background:var(--salvia)}
.oasis .eyebrow{color:var(--verde-3)}
.oasis__cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 48px;margin-bottom:40px}
.oasis__cab p{margin:0;flex:0 1 420px;color:var(--tinta-2)}
.grilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.grilla article{display:flex;flex-direction:column;gap:10px;min-width:0}
.grilla img,.ph{width:100%;height:320px;object-fit:cover}
.grilla h3{font-weight:700;font-size:17px;letter-spacing:.04em;color:var(--verde)}
.grilla p{margin:0;font-size:15px;color:var(--tinta-2)}
.ph{background:var(--verde);color:var(--suave-2);display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;font-family:var(--mono);font-size:13px}

.cabanas{background:var(--verde);color:var(--arena)}
.cabanas .dos{align-items:flex-start}
.cabanas .eyebrow{color:var(--tierra)}
.cabanas .pila>p{color:var(--suave)}
.ph--borde{height:440px;background:transparent;border:1.5px dashed var(--verde-3)}
.obra{flex-direction:row;align-items:center;gap:14px}
.obra img{width:112px;height:112px;object-fit:cover;flex:0 0 auto}
.obra figcaption{font-family:var(--display);font-size:14px;letter-spacing:0;color:var(--suave)}
.ficha{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
.ficha>div{border-top:1px solid var(--linea-verde);padding:12px 0}
.ficha dt{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--suave-3)}
.ficha dd{margin:2px 0 0}
.nota{background:var(--verde-2);padding:16px 18px;font-size:15px;display:flex;flex-direction:column;gap:4px}
.nota strong{font-weight:600;color:var(--tierra)}

.llegar{background:var(--tierra-clara)}
.btn{align-self:flex-start;display:inline-flex;align-items:center;min-height:48px;padding:0 22px;background:var(--verde);color:var(--arena);text-decoration:none;font-weight:700}
.ruta{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.ruta li.p{display:flex;gap:18px;align-items:flex-start}
.ruta li.p small{display:block;font-size:14px;color:#5B4A33}
.ruta .m{flex:0 0 auto;width:14px;height:14px;margin-top:6px;border:2px solid var(--verde);background:var(--tierra-clara)}
.ruta .m--aqui{width:18px;height:18px;margin:4px 0 0 -2px;background:var(--verde);border:none}
.ruta li.l{margin-left:7px;height:40px;border-left:2px dashed var(--tierra-texto)}

.aviso{background:var(--tierra);color:var(--tinta)}
.aviso .dos{align-items:flex-start}
.aviso-form--grande{max-width:540px;align-items:flex-end}
.aviso-form--grande label{flex:1 1 260px;display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:12px;letter-spacing:.12em}
.aviso-form--grande input[type=email]{min-height:50px;flex:none;width:100%}
.aviso-form--grande button{min-height:50px;padding:0 24px;border:none;background:var(--verde);color:var(--arena);font-weight:800;font-stretch:125%;font-size:14px;letter-spacing:.1em}
.legal{font-size:13px;color:#3D3020}
.contacto{display:flex;flex-direction:column;gap:4px}
.contacto p{margin:0 0 8px}
.contacto a,.contacto span{min-height:44px;display:flex;align-items:center;word-break:break-all}

footer{background:var(--tinta);color:var(--suave-3);font-size:14px}
footer .wrap{padding-block:28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px}

@media (max-width:720px){
  .menu{order:3;flex-basis:100%;gap:0 18px;font-size:14px}
  .hero__cuerpo{padding-block:16px 32px}
  .reserva{flex-basis:100%}
  .ficha{grid-template-columns:1fr}
  .ph--borde{height:280px}
}