:root{
  --cream:#faf5ec; --paper:#fffdf8; --ink:#2b2118; --muted:#6b5d4f;
  --terra:#1f7fb8; --terra-d:#145c88; --olive:#0f7a8a; --sand:#efe3c9; --sun:#f6b92b; --sun-d:#e39a0b; --aqua:#7fd0e0; --navy:#10304a;
  --radius:18px; --shadow:0 10px 30px rgba(43,33,24,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--cream);line-height:1.65;font-size:17px}
img{max-width:100%;display:block}
a{color:var(--terra-d)}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;line-height:1.15;margin:0 0 .5em;font-weight:600;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,5.5vw,3.8rem)}
h2{font-size:clamp(1.6rem,3.4vw,2.3rem)}
h3{font-size:1.25rem}
p{margin:0 0 1em}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* language switch: show only the active language */
html[lang="es"] [data-l="en"], html[lang="en"] [data-l="es"]{display:none !important}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(250,245,236,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--sand)}
.bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px;padding-top:12px;padding-bottom:12px}
.brand{text-decoration:none;color:var(--ink);font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.15rem;line-height:1.2}
.brand small{display:block;font-family:'Inter',sans-serif;font-weight:500;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--olive)}
nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px 20px}
nav a{text-decoration:none;color:var(--ink);font-weight:500;font-size:.95rem;padding:4px 0;border-bottom:2px solid transparent}
nav a:hover,nav a[aria-current="page"]{border-bottom-color:var(--sun-d)}
.lang{display:flex;border:1px solid var(--sand);border-radius:999px;overflow:hidden}
.lang button{border:0;background:transparent;font:inherit;font-size:.8rem;font-weight:600;padding:5px 12px;cursor:pointer;color:var(--muted)}
.lang button[aria-pressed="true"]{background:var(--terra);color:#fff}

/* hero */
.hero{position:relative;overflow:hidden;padding:84px 0 96px;
  background:
    radial-gradient(circle at 84% 24%, #f6b92b 0 78px, rgba(246,185,43,.35) 79px 120px, transparent 121px),
    linear-gradient(170deg,#fbf0d4 0%,#fbe2a6 60%,#bfe6ee 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:34px;background:radial-gradient(circle at 20px 34px,#faf5ec 19px,transparent 20px) 0 0/40px 34px repeat-x;opacity:.9}
.hero .wrap{position:relative}
.hero p.lead{font-size:1.2rem;max-width:620px;color:#4a3b2d}
.hero.small{padding:56px 0 64px}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--olive);margin-bottom:14px}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btn{display:inline-block;box-shadow:0 4px 12px rgba(31,127,184,.25);text-decoration:none;font-weight:600;padding:13px 24px;border-radius:999px;border:2px solid var(--terra);background:var(--terra);color:#fff;cursor:pointer;font:inherit;font-weight:600}
.btn:hover{background:var(--terra-d);border-color:var(--terra-d)}
.btn.ghost{background:transparent;color:var(--terra-d)}
.btn.ghost:hover{background:rgba(31,127,184,.1)}

/* sections */
section{padding:64px 0}
section.alt{background:var(--sand)}
.grid{display:grid;gap:24px}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid.three{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}
.card .body{padding:24px;display:flex;flex-direction:column;flex:1}
.card .body .btns{margin-top:auto;padding-top:12px}
.feature{background:var(--paper);border-radius:var(--radius);padding:22px;border:1px solid var(--sand)}
.feature{border-top:4px solid var(--sun)}
.feature .big{font-family:'Fraunces',serif;font-size:2rem;color:var(--terra);line-height:1}
.ticks{list-style:none;padding:0;margin:0 0 1em}
.ticks li{padding-left:30px;position:relative;margin-bottom:.55em}
.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:14px;border-radius:50%;background:var(--sun-d);box-shadow:inset 0 0 0 4px var(--paper)}

/* photo placeholders: replace each .ph with an <img> */
.ph{min-height:200px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;
  background:linear-gradient(135deg,#f6b92b,#e39a0b 60%,#c98107)}
.ph.green{background:linear-gradient(135deg,#7fd0e0,#1f7fb8 60%,#145c88)}
.ph.tall{min-height:300px}
.gallery{display:grid;gap:14px;grid-template-columns:2fr 1fr;margin-bottom:40px}
.gallery .ph{border-radius:var(--radius)}
.gallery .stack{display:grid;gap:14px}
@media(max-width:640px){.gallery{grid-template-columns:1fr}}

.split{display:grid;gap:40px;grid-template-columns:1.4fr 1fr;align-items:start}
@media(max-width:820px){.split{grid-template-columns:1fr}}
.aside{background:var(--paper);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.note{font-size:.9rem;color:var(--muted)}
.cta{background:linear-gradient(135deg,#1f7fb8,#0f7a8a);color:#fff;text-align:center}
.cta h2{color:#fff}
.cta .btn{background:var(--sun);color:var(--navy);border-color:var(--sun)}
.cta .btn:hover{background:#ffd062;border-color:#ffd062}

/* distances */
.dist{list-style:none;padding:0;margin:0}
.dist li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(43,33,24,.15)}
.dist li strong{font-family:'Fraunces',serif;color:var(--terra-d);white-space:nowrap}

/* form */
form{display:grid;gap:16px}
label{font-weight:600;font-size:.9rem;display:grid;gap:6px}
input,textarea,select{font:inherit;padding:12px 14px;border-radius:12px;border:1px solid #cdbb99;background:#fff;width:100%}
input:focus,textarea:focus,select:focus{outline:3px solid rgba(31,127,184,.35);border-color:var(--terra)}
.row{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}

footer{background:var(--navy);color:#e9dcc3;padding:44px 0 30px;font-size:.92rem}
footer a{color:var(--sun)}
footer .cols{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-bottom:24px}
footer h3{color:#fff;font-size:1rem}
footer .legal{border-top:1px solid rgba(233,220,195,.2);padding-top:18px;color:#9fc3d6;font-size:.82rem}

/* booking form */
fieldset{border:1px solid var(--sand);border-radius:var(--radius);padding:22px;margin:0;display:grid;gap:16px;background:var(--paper)}
legend{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.1rem;padding:0 8px}
label.check{display:flex;gap:12px;align-items:flex-start;font-weight:500}
label.check input{width:auto;margin-top:5px}
.nights{margin:0;font-weight:600;color:var(--olive);min-height:1.2em}
.error{background:#fbe3dc;color:#7a2a14;border-radius:12px;padding:12px 16px;margin:0}
.steps{padding-left:20px;margin:0 0 1em}
.steps li{margin-bottom:.6em}

/* real photos */
.gallery img,.card>img{width:100%;height:100%;object-fit:cover;display:block}
.gallery>img{border-radius:var(--radius);min-height:300px}
.gallery .stack img{border-radius:var(--radius);min-height:140px}
.card>img{height:300px}
.photos3{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-bottom:40px}
.photos3 img{width:100%;height:220px;object-fit:cover;border-radius:var(--radius)}

.aside{border-top:4px solid var(--aqua)}
section.alt{background:linear-gradient(180deg,#e9f5f8,#faf5ec)}
.eyebrow{color:var(--olive)}
.hero h1{max-width:720px}
@media(max-width:700px){.hero{background-position:0 0}.hero h1{max-width:none}}

/* captions */
figure{margin:0;position:relative;overflow:hidden;border-radius:var(--radius);background:var(--sand)}
figure img{border-radius:0 !important;width:100%;height:100%;object-fit:cover;display:block}
figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 10px;color:#fff;font-size:.85rem;font-weight:600;background:linear-gradient(transparent,rgba(16,48,74,.75))}
.gallery>figure{min-height:300px}
.gallery .stack figure{min-height:140px}
.photos3 figure{height:220px}
.photos3 img{height:100%}

/* prices */
.prices{width:100%;max-width:520px;border-collapse:collapse;background:var(--paper);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin:18px 0}
.prices th,.prices td{padding:14px 20px;text-align:left;border-bottom:1px solid var(--sand)}
.prices td{text-align:right;font-family:'Fraunces',serif;font-size:1.3rem;color:var(--terra-d);font-weight:600;white-space:nowrap}
.prices tr:last-child th,.prices tr:last-child td{border-bottom:0}
.from{margin:0 0 12px;font-size:1.05rem}.from strong{font-family:'Fraunces',serif;font-size:1.5rem;color:var(--terra-d)}
.estimate{margin:0;background:#fff4d6;border-left:4px solid var(--sun);padding:10px 14px;border-radius:10px;font-weight:600}

/* ---- Spanish touches ---- */
:root{--clay:#c4593a}
.tiles{height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Crect width='40' height='40' fill='%23fdfaf2'/%3E%3Crect x='1.5' y='1.5' width='37' height='37' fill='none' stroke='%232a6db5' stroke-width='1.5'/%3E%3Cg fill='%232a6db5'%3E%3Cpath d='M20 6c3 5 3 9 0 14-3-5-3-9 0-14z'/%3E%3Cpath d='M34 20c-5 3-9 3-14 0 5-3 9-3 14 0z'/%3E%3Cpath d='M20 34c-3-5-3-9 0-14 3 5 3 9 0 14z'/%3E%3Cpath d='M6 20c5-3 9-3 14 0-5 3-9 3-14 0z'/%3E%3C/g%3E%3Ccircle cx='20' cy='20' r='3' fill='%23f6b92b'/%3E%3Cg fill='%23e39a0b'%3E%3Ccircle cx='5' cy='5' r='2'/%3E%3Ccircle cx='35' cy='5' r='2'/%3E%3Ccircle cx='5' cy='35' r='2'/%3E%3Ccircle cx='35' cy='35' r='2'/%3E%3C/g%3E%3C/svg%3E") 0 0/16px 16px repeat-x}
.site-header .tiles{border-bottom:1px solid var(--sand)}
footer{padding:0 0 30px}
footer .wrap{padding-top:40px}
footer .tiles{margin-bottom:0}
.eyebrow{color:var(--clay)}
.hola{display:block;font-family:'Caveat','Segoe Script',cursive;font-size:2.2rem;color:var(--clay);line-height:1;margin-bottom:6px;transform:rotate(-2deg);transform-origin:left}
section h2::after{content:"";display:block;width:72px;height:8px;margin-top:12px;background:repeating-linear-gradient(90deg,var(--clay) 0 10px,transparent 10px 16px);border-radius:4px}
.cta h2::after{margin-left:auto;margin-right:auto;background:repeating-linear-gradient(90deg,rgba(255,255,255,.75) 0 10px,transparent 10px 16px)}
.card>img,.card>.ph{border-radius:180px 180px 0 0}
.card{border:1px solid var(--sand)}
.from strong,.prices td{color:var(--clay)}
.feature{border-top-color:var(--clay)}
.aside{border-top-color:var(--clay)}
.hero{background:
    radial-gradient(circle at 84% 24%, #f6b92b 0 78px, rgba(246,185,43,.35) 79px 120px, transparent 121px),
    linear-gradient(170deg,#fff4dc 0%,#fbdf9d 55%,#c9e7ee 100%)}
.hero::after{height:38px;background:radial-gradient(circle at 20px 38px,#faf5ec 19px,#c4593a 20px 25px,transparent 26px) 0 0/40px 38px repeat-x}
@media(max-width:700px){.card>img,.card>.ph{border-radius:120px 120px 0 0}}
.sent{background:var(--paper);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow);border-top:4px solid var(--sun)}
.sent[hidden],form[hidden]{display:none}
.sent{background:var(--paper);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow);border-top:4px solid var(--sun)}
.sent[hidden],form[hidden]{display:none}
