/* =====================================================================
   Borda de l'Isard | Prediseño de home para casa rural
   Refugio de montaña: piedra, madera, bosque y nieve.
   Fraunces (con eje SOFT) para titulares, Karla para lectura.
   Momento memorable: el valle que aparece en vídeo al cargar.
   Lenguaje gráfico propio: curvas de nivel (mapa y reserva).
   ===================================================================== */
:root{
  --forest:#1F3A2E; --forest-d:#14261E; --forest-2:#2B4A3B;
  --stone:#8A8178; --muted:#5F5850;
  --wood:#A0663A; --wood-d:#87522B; --wood-l:#CF9A66;
  --snow:#F6F4EF; --snow-2:#ECE8DF; --card:#FCFBF8;
  --moss:#6E7F5B; --ink:#1E211E;
  --line:rgba(30,33,30,.13); --line-l:rgba(246,244,239,.16);
  --serif:'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:'Karla', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --max:1440px; --pad:clamp(16px,3vw,44px);
  --ease:cubic-bezier(.22,.7,.18,1);
  --r-lg:22px; --r:16px; --r-sm:10px;
  --sec:clamp(84px,10vw,144px);
  --sr-accent:#CF9A66; --sr-font:'Karla', system-ui, sans-serif;
  --sr-bg:rgba(20,38,30,.97); --sr-radius:18px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--snow); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden}
img,svg,video{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{margin:0; font-family:var(--serif); font-weight:400; font-variation-settings:"SOFT" 50; letter-spacing:-.012em; text-wrap:balance}
p,figure,blockquote{margin:0}
ul,ol{margin:0; padding:0; list-style:none}
button,input,select,textarea{font:inherit}
.wrap{width:100%; max-width:var(--max); margin:0 auto; padding:0 var(--pad)}
.title{font-size:clamp(34px,4.3vw,60px); line-height:1.04; color:var(--forest)}
.nw{white-space:nowrap}

/* ---------- Botones ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; white-space:nowrap; font:700 15px/1 var(--sans); letter-spacing:.005em; padding:17px 28px; border-radius:999px; border:0; cursor:pointer; transition:background .3s, color .3s, box-shadow .3s, transform .3s var(--ease)}
.btn svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:0 0 auto}
.btn-wood{background:var(--wood); color:#fff}
.btn-wood:hover{background:var(--wood-d)}
.btn-forest{background:var(--forest); color:var(--snow)}
.btn-forest:hover{background:var(--forest-d)}
.btn-line-dark{color:var(--forest); box-shadow:inset 0 0 0 1.5px rgba(31,58,46,.35)}
.btn-line-dark:hover{box-shadow:inset 0 0 0 1.5px var(--forest); background:rgba(31,58,46,.05)}
.btn-full{width:100%}
.btn:active{transform:translateY(1px)}

/* ---------- Marca ---------- */
.brand{display:flex; align-items:center; gap:12px; flex:0 0 auto; color:var(--snow)}
.brand-ico{width:44px; height:44px; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:0 0 auto}
.brand-ico .bi-m{stroke:currentColor}
.brand-ico .bi-h{stroke:var(--wood-l)}
.brand-txt b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 70; font-weight:500; font-size:22px; line-height:1; letter-spacing:-.01em; white-space:nowrap}
.brand-txt small{display:block; font-size:12.5px; letter-spacing:.015em; opacity:.72; margin-top:5px; white-space:nowrap}

/* ---------- Cabecera ---------- */
.hd{position:fixed; top:0; left:0; right:0; z-index:90; color:var(--snow); background:linear-gradient(180deg, rgba(20,38,30,.5), rgba(20,38,30,.16)); -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px); border-bottom:1px solid rgba(246,244,239,.14); transition:background .45s, border-color .45s, box-shadow .45s}
.hd.is-scrolled,.menu-open .hd{background:rgba(20,38,30,.97); border-bottom-color:rgba(246,244,239,.06); box-shadow:0 14px 34px -22px rgba(0,0,0,.6)}
.hd-in{max-width:var(--max); margin:0 auto; padding:0 var(--pad); height:86px; display:flex; align-items:center; gap:22px; transition:height .4s var(--ease)}
.hd.is-scrolled .hd-in{height:72px}

.nav{margin-left:auto; align-self:stretch}
.nav > ul{display:flex; align-items:stretch; height:100%; gap:2px}
.nav > ul > li{position:relative; display:flex; align-items:center; flex:0 0 auto}
.nav > ul > li > a{display:flex; align-items:center; gap:6px; white-space:nowrap; padding:9px 14px; border-radius:999px; font-size:15.5px; font-weight:500; transition:background .25s}
.nav > ul > li:hover > a,.nav > ul > li:focus-within > a{background:rgba(246,244,239,.13)}
.chev{flex:0 0 auto; width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; transition:transform .3s var(--ease)}
.has-drop:hover .chev,.has-drop:focus-within .chev{transform:rotate(180deg)}

.drop{position:absolute; top:100%; left:0; padding-top:2px; min-width:340px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .22s, transform .32s var(--ease), visibility 0s .32s}
.has-drop:hover > .drop,.has-drop:focus-within > .drop{opacity:1; visibility:visible; transform:none; transition:opacity .22s, transform .32s var(--ease), visibility 0s}
.drop-in{background:var(--snow); color:var(--ink); border-radius:18px; padding:10px; box-shadow:0 34px 70px -26px rgba(8,18,13,.6), 0 0 0 1px rgba(20,38,30,.06)}
.drop-in > a{display:block; padding:12px 16px; border-radius:12px; transition:background .2s}
.drop-in a b{display:block; font-weight:700; font-size:15.5px; color:var(--forest); line-height:1.3}
.drop-in a span{display:block; font-size:13.5px; color:var(--muted); line-height:1.4; margin-top:2px}
.drop-in a:hover,.drop-in a:focus-visible{background:var(--snow-2)}

.mega{left:50%; width:660px; transform:translate(-50%,8px)}
.has-mega:hover > .mega,.has-mega:focus-within > .mega{transform:translate(-50%,0)}
.mega-in{display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:12px}
.mega-col{display:flex; flex-direction:column}
.mega-col > a{display:block; padding:11px 12px; border-radius:12px; transition:background .2s}
.mega-col > a:hover,.mega-col > a:focus-visible{background:var(--snow-2)}
.mega-head{position:relative; height:112px; border-radius:12px; overflow:hidden; margin-bottom:6px; background:var(--forest)}
.mega-head img{width:100%; height:100%; object-fit:cover}
.mega-head::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,38,30,.82), rgba(20,38,30,.05) 75%)}
.mega-head p{position:absolute; left:16px; bottom:12px; z-index:1; color:var(--snow); line-height:1.15}
.mega-head p b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:450; font-size:24px}
.mega-head p span{font-size:13px; opacity:.85}

.hd-actions{display:flex; align-items:center; gap:12px; flex:0 0 auto}
.lang{position:relative; padding:10px 0}
.lang-list{display:flex; gap:2px}
.lang-list a{display:block; font-size:13px; font-weight:700; letter-spacing:.02em; padding:6px 7px; border-radius:7px; opacity:.72; transition:opacity .2s, background .2s}
.lang-list a:hover{opacity:1}
.lang-list a.on{opacity:1; background:rgba(246,244,239,.15)}
.lang-cur{display:none; align-items:center; gap:4px; background:none; border:0; color:inherit; font-size:13.5px; font-weight:700; padding:8px 6px; cursor:pointer}
.lang-cur svg{width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2}
.hd-sr .sr-trigger{font-size:14px; font-weight:600; color:var(--snow); --sr-dot-ring:var(--forest-d); padding:.62em 1em .62em .85em}
.hd-btn{padding:14px 22px; font-size:14.5px}

.burger{display:none; width:46px; height:46px; border-radius:50%; border:1px solid rgba(246,244,239,.35); background:rgba(20,38,30,.25); cursor:pointer; align-items:center; justify-content:center; flex:0 0 auto}
.burger span{position:relative; width:18px; height:1.8px; background:var(--snow); transition:background .2s}
.burger span::before,.burger span::after{content:""; position:absolute; left:0; width:18px; height:1.8px; background:var(--snow); transition:transform .35s var(--ease)}
.burger span::before{top:-6px} .burger span::after{top:6px}
.menu-open .burger span{background:transparent}
.menu-open .burger span::before{transform:translateY(6px) rotate(45deg)}
.menu-open .burger span::after{transform:translateY(-6px) rotate(-45deg)}

/* Idiomas compactos y cabecera ajustada */
@media (max-width:1500px){
  .lang-cur{display:inline-flex}
  .lang-list{position:absolute; top:100%; right:-8px; flex-direction:column; gap:2px; background:var(--snow); color:var(--ink); padding:6px; border-radius:12px; min-width:64px; box-shadow:0 24px 50px -20px rgba(8,18,13,.55); opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .2s, transform .3s var(--ease), visibility 0s .3s}
  .lang-list a{opacity:1; text-align:center; padding:8px 10px}
  .lang-list a:hover{background:var(--snow-2)}
  .lang-list a.on{background:var(--forest); color:var(--snow)}
  .lang:hover .lang-list,.lang:focus-within .lang-list{opacity:1; visibility:visible; transform:none; transition:opacity .2s, transform .3s var(--ease), visibility 0s}
}
@media (max-width:1400px){
  .hd-in{gap:14px}
  .brand-txt small{display:none}
  .nav > ul{gap:0}
  .nav > ul > li > a{padding:9px 10px; font-size:14.5px; gap:5px}
  .hd-actions{gap:10px}
  .hd-btn{padding:13px 17px; font-size:14px}
  .hd-sr .sr-trigger{font-size:13.5px}
}
@media (max-width:1279px){
  .nav,.hd-sr,.lang{display:none}
  .burger{display:inline-flex}
  .hd-actions{margin-left:auto}
  .brand-txt small{display:block}
}
@media (max-width:620px){
  .hd-btn{display:none}
  .hd-in{height:70px}
  .hd.is-scrolled .hd-in{height:64px}
  .brand-ico{width:38px; height:38px}
  .brand-txt b{font-size:20px}
  .brand-txt small{font-size:11.5px; margin-top:4px}
}

/* ---------- Menú móvil ---------- */
.mmenu{position:fixed; inset:0; z-index:85; background:var(--forest-d); color:var(--snow); padding-top:86px; overflow-y:auto; opacity:0; visibility:hidden; transform:translateY(-14px); transition:opacity .35s, transform .5s var(--ease), visibility 0s .5s}
.menu-open .mmenu{opacity:1; visibility:visible; transform:none; transition:opacity .35s, transform .5s var(--ease), visibility 0s}
.menu-open body{overflow:hidden}
.mmenu-in{max-width:640px; margin:0 auto; padding:18px var(--pad) 48px}
.macc{border-bottom:1px solid var(--line-l)}
.macc > button{all:unset; box-sizing:border-box; width:100%; display:flex; justify-content:space-between; align-items:center; padding:17px 0; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-size:27px; cursor:pointer}
.macc > button:focus-visible{outline:2px solid var(--wood-l); outline-offset:4px}
.macc > button svg{width:20px; height:20px; fill:none; stroke:var(--wood-l); stroke-width:1.8; transition:transform .3s var(--ease)}
.macc.is-open > button svg{transform:rotate(180deg)}
.macc-panel{max-height:0; overflow:hidden; transition:max-height .45s var(--ease)}
.macc-panel a{display:block; padding:9px 0 9px 16px; font-size:16px; color:rgba(246,244,239,.78); border-left:1px solid rgba(207,154,102,.6)}
.macc-panel a:last-child{margin-bottom:18px}
.macc-group{font-size:13px; font-weight:700; color:var(--wood-l); padding:10px 0 4px}
.mlink{display:block; padding:17px 0; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-size:27px; border-bottom:1px solid var(--line-l)}
.mlangs{display:flex; flex-wrap:wrap; gap:8px; margin-top:26px}
.mlangs a{font-size:14px; font-weight:600; padding:8px 14px; border-radius:999px; border:1px solid var(--line-l); color:rgba(246,244,239,.8)}
.mlangs a.on{background:var(--snow); color:var(--forest-d); border-color:var(--snow)}
.mbtn{margin-top:26px; width:100%}
.mphone{margin-top:14px; text-align:center; font-size:15px; color:rgba(246,244,239,.72)}
.mphone a{color:var(--snow); font-weight:700}
.mmenu .srm{--srm-line:rgba(246,244,239,.14)}

/* ---------- Hero ---------- */
.hero{position:relative; isolation:isolate; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; color:var(--snow); background:var(--forest-d); overflow:hidden}
.hero-media{position:absolute; inset:0; z-index:-1; animation:mediaIn 2.2s ease-out both}
@keyframes mediaIn{from{opacity:0; transform:scale(1.04)}to{opacity:1; transform:none}}
.slide{position:absolute; inset:0; opacity:0; transition:opacity 1.4s ease}
.slide.is-active{opacity:1}
.slide video{width:100%; height:100%; object-fit:cover; transform:scale(1.07); transition:transform 9s linear}
.slide.is-active video{transform:scale(1)}
.hero-shade{position:absolute; inset:0; background:
  linear-gradient(180deg, rgba(20,38,30,.55) 0, rgba(20,38,30,0) 24%),
  linear-gradient(0deg, rgba(20,38,30,.92) 0, rgba(20,38,30,.6) 34%, rgba(20,38,30,.12) 68%),
  linear-gradient(90deg, rgba(20,38,30,.5) 0, rgba(20,38,30,0) 62%)}
.hero-in{width:100%; max-width:var(--max); margin:0 auto; padding:130px var(--pad) clamp(26px,4.2vh,46px)}
.hero h1{font-size:min(clamp(44px,7vw,104px), calc((100vw - 2 * var(--pad)) / 9.2)); line-height:.98; letter-spacing:-.025em; font-weight:360; font-variation-settings:"SOFT" 70; text-shadow:0 2px 30px rgba(10,20,15,.25)}
.hero h1 .ln{display:block}
.hero h1.is-split .swi{transition-duration:1.15s}
.hero-sub{margin-top:24px; max-width:610px; font-size:clamp(16.5px,1.3vw,19.5px); line-height:1.6; color:rgba(246,244,239,.88); animation:fadeUp 1s var(--ease) .95s both}
.hero-proof{display:flex; align-items:flex-start; gap:9px; margin-top:18px; font-size:15px; color:rgba(246,244,239,.8); animation:fadeUp 1s var(--ease) 1.1s both}
.hero-proof svg{width:17px; height:17px; margin-top:2px; fill:var(--wood-l); flex:0 0 auto}
.hero-proof b{color:var(--snow); font-weight:700}
@keyframes fadeUp{from{opacity:0; transform:translateY(16px)}to{opacity:1; transform:none}}
.hero-bottom{display:flex; align-items:flex-end; justify-content:space-between; gap:36px; margin-top:clamp(28px,5vh,54px)}
.hero-top{display:flex; align-items:flex-end; justify-content:space-between; gap:40px}
.hero-copy{min-width:0}
.avail{animation:availIn 1.15s var(--ease) 1.5s both}
.hero-tabs{animation:fadeUp 1s var(--ease) 1.95s both}
@keyframes availIn{from{opacity:0; transform:translateY(34px) scale(.97)}to{opacity:1; transform:none}}
.hero-fx{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:0; transition:opacity .9s ease}
.hero-fx.is-on{opacity:1}

/* Postal flotante: aparece a los 2,7 s y alterna fotos del interior */
.postcard-wrap{flex:0 0 auto; width:300px; opacity:0; transform:translateY(22px); clip-path:inset(0 0 100% 0 round 18px); transition:opacity .8s ease, transform 1.2s var(--ease), clip-path 1.2s cubic-bezier(.77,0,.18,1)}
.postcard-wrap.is-in{opacity:1; transform:none; clip-path:inset(0 0 0 0 round 18px)}
.postcard{all:unset; box-sizing:border-box; position:relative; display:block; width:100%; padding:10px 10px 14px; border-radius:18px; background:var(--snow); color:var(--ink); cursor:pointer; box-shadow:0 34px 60px -30px rgba(0,0,0,.75); transition:transform .5s var(--ease)}
.postcard:focus-visible{outline:2px solid var(--wood-l); outline-offset:4px}
.pc-photo{position:relative; display:block; aspect-ratio:3/2; border-radius:11px; overflow:hidden; background:var(--forest)}
.pc-photo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.08); transition:opacity 1.4s ease, transform 6s linear}
.pc-photo img.is-active{opacity:1; transform:scale(1)}
.pc-bar{position:absolute; left:10px; right:10px; bottom:10px; height:2px; border-radius:2px; background:rgba(246,244,239,.35); overflow:hidden}
.pc-bar i{position:absolute; inset:0; background:var(--snow); transform:scaleX(0); transform-origin:left center}
.pc-bar i.run{animation:barFill 5s linear both}
.pc-cap{display:block; padding:12px 40px 0 6px; line-height:1.3}
.pc-cap b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 70; font-weight:500; font-size:18px; color:var(--forest)}
.pc-txt{display:grid; margin-top:3px; font-size:14px; color:var(--muted)}
.pc-txt > span{grid-area:1 / 1; opacity:0; transform:translateY(6px); transition:opacity .6s ease, transform .6s var(--ease)}
.pc-txt > span.is-active{opacity:1; transform:none; transition-delay:.25s}
.pc-go{position:absolute; right:14px; bottom:16px; width:30px; height:30px; padding:7px; border-radius:50%; background:var(--forest); fill:none; stroke:var(--snow); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:transform .4s var(--ease), background .3s}
.postcard:hover .pc-go{background:var(--wood); transform:translateY(3px)}

.avail{flex:0 1 790px; min-width:0}
.avail-card{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.3fr) auto; align-items:center; background:var(--snow); color:var(--ink); border-radius:20px; padding:8px; box-shadow:0 34px 70px -34px rgba(0,0,0,.7)}
.af{display:flex; flex-direction:column; gap:1px; padding:8px 18px; border-right:1px solid var(--line); min-width:0}
.af:nth-child(3){border-right:0}
.af label{font-size:12.5px; font-weight:700; color:var(--forest); letter-spacing:.01em}
.af input,.af select{appearance:none; -webkit-appearance:none; border:0; background:transparent; color:var(--ink); font-size:16px; padding:3px 0; width:100%; min-width:0; min-height:28px; cursor:pointer; outline:none}
.af select{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2387522B' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right center/14px no-repeat; padding-right:20px}
.af input::-webkit-calendar-picker-indicator{opacity:.55; cursor:pointer}
.af input::placeholder{color:var(--ink); opacity:.5}
.af:focus-within{background:rgba(31,58,46,.05); border-radius:12px}
.avail-btn{height:60px; padding:0 24px; border-radius:14px}
.avail-note{display:flex; align-items:center; gap:9px; margin-top:13px; font-size:15px; color:rgba(246,244,239,.85)}
.avail-note svg{width:17px; height:17px; fill:none; stroke:var(--wood-l); stroke-width:2.2; flex:0 0 auto}

.hero-tabs{display:flex; align-items:flex-start; gap:20px; flex:0 0 auto; padding-bottom:36px}
.htab{all:unset; box-sizing:border-box; position:relative; width:138px; padding-top:16px; cursor:pointer; color:rgba(246,244,239,.66); transition:color .3s}
.htab b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 70; font-weight:450; font-size:19px; line-height:1.2}
.htab small{display:block; font-size:13.5px; margin-top:2px; opacity:.85}
.htab .bar{position:absolute; top:0; left:0; right:0; height:2px; border-radius:2px; background:rgba(246,244,239,.26); overflow:hidden}
.htab .bar i{position:absolute; inset:0; background:var(--snow); transform:scaleX(0); transform-origin:left center}
.htab:hover,.htab.is-active{color:var(--snow)}
.htab.is-active .bar i{animation:barFill var(--slider-interval,8000ms) linear both}
.htab:focus-visible{outline:2px solid var(--wood-l); outline-offset:6px; border-radius:4px}
@keyframes barFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}

@media (max-width:1180px){
  .postcard-wrap{display:none}
  .hero-bottom{flex-direction:column-reverse; align-items:stretch; gap:26px}
  .hero-tabs{padding-bottom:0}
  .avail{flex:1 1 auto; max-width:820px}
}
@media (max-width:700px){
  .avail-card{grid-template-columns:1fr 1fr; padding:6px; border-radius:18px}
  .af{padding:9px 14px}
  .af:nth-child(1){border-bottom:1px solid var(--line)}
  .af:nth-child(2){border-right:0; border-bottom:1px solid var(--line)}
  .af:nth-child(3){grid-column:1 / -1; border-bottom:1px solid var(--line)}
  .avail-btn{grid-column:1 / -1; margin-top:6px; height:54px}
}
@media (max-width:760px){
  .hero-in{padding-top:110px}
  .hero-tabs{gap:14px}
  .htab{flex:1; width:auto; padding-top:12px}
  .htab b{font-size:16.5px}
  .htab small{display:none}
  .avail-note{align-items:flex-start; font-size:13.5px}
  .avail-note svg{margin-top:2px}
}

/* ---------- Puntos destacados ---------- */
.feats{background:var(--snow); border-bottom:1px solid var(--line)}
.feats-in{display:grid; grid-template-columns:repeat(4,1fr); padding-top:clamp(36px,4vw,52px); padding-bottom:clamp(36px,4vw,52px); row-gap:8px}
.feat{display:flex; align-items:flex-start; gap:16px; padding:18px 22px 18px 24px; border-left:1px solid var(--line)}
.feat:nth-child(4n+1){border-left:0; padding-left:0}
.feat svg{width:36px; height:36px; flex:0 0 auto; fill:none; stroke:var(--wood); stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round}
html.fx .feats-in.draw-ready:not(.drawn) svg :is(path,circle,ellipse),html.fx .book-topo.draw-ready:not(.drawn) path,html.fx .map-card.draw-ready:not(.drawn) .m-topo path{stroke-dasharray:1; stroke-dashoffset:1}
html.fx .feats-in.draw-ready.is-on svg :is(path,circle,ellipse){stroke-dashoffset:0; transition:stroke-dashoffset 1.5s cubic-bezier(.6,0,.2,1); transition-delay:calc(var(--i,0) * 110ms + 150ms)}
html.fx .feats-in.draw-ready .feat div{opacity:0; transform:translateY(10px)}
html.fx .feats-in.draw-ready.is-on .feat div{opacity:1; transform:none; transition:opacity .8s ease, transform .8s var(--ease); transition-delay:calc(var(--i,0) * 110ms + 350ms)}
.feat b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:450; font-size:20px; line-height:1.2; color:var(--forest)}
.feat div > span{display:block; margin-top:3px; font-size:15px; line-height:1.45; color:var(--muted)}
@media (max-width:1100px){
  .feats-in{grid-template-columns:repeat(2,1fr)}
  .feat:nth-child(4n+1){border-left:1px solid var(--line); padding-left:24px}
  .feat:nth-child(2n+1){border-left:0; padding-left:0}
}
@media (max-width:480px){
  .feats-in{grid-template-columns:1fr 1fr; column-gap:14px}
  .feat,.feat:nth-child(4n+1){flex-direction:column; gap:10px; border-left:0; padding:14px 0}
  .feat b{font-size:18px}
  .feat div > span{font-size:13.5px}
}

/* ---------- La borda: historia ---------- */
.story{padding:var(--sec) 0}
.story-in{display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); align-items:stretch}
.story-media{display:grid; grid-template-rows:1fr 1fr; gap:14px; min-height:600px}
.story-media figure{position:relative; min-height:0; overflow:hidden; border-radius:var(--r-lg); background:var(--snow-2)}
.story-media .px{position:absolute; left:0; right:0; top:-18%; bottom:-18%; display:block}
.story-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.sm-1 img{object-position:center 45%}
.story-copy .title{max-width:13ch}
.story-copy{align-self:center}
.story-copy p{margin-top:20px; color:#47413B; max-width:58ch}
.story-copy .lead{margin-top:28px}
.hosts{display:flex; align-items:center; gap:14px; margin-top:32px}
.hosts-av{display:flex; flex:0 0 auto}
.hosts-av i{display:grid; place-items:center; width:46px; height:46px; border-radius:50%; font-style:normal; font-family:var(--serif); font-variation-settings:"SOFT" 100; font-size:19px; color:var(--snow); background:var(--forest); box-shadow:0 0 0 3px var(--snow)}
.hosts-av i + i{margin-left:-10px; background:var(--wood)}
.hosts p{margin:0; line-height:1.3}
.hosts p b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:500; font-size:20px; color:var(--forest)}
.hosts p span{font-size:15px; color:var(--muted)}
.tl{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px; padding-top:0; border-top:1px solid var(--line)}
.tl::after{content:""; position:absolute; left:0; right:0; top:-1px; height:1px; background:var(--wood); transform:scaleX(0); transform-origin:left center; transition:transform 1.8s cubic-bezier(.6,0,.2,1) .2s; opacity:.55}
.tl.is-on::after{transform:scaleX(1)}
html.fx .tl[data-anim] li::before{transform:scale(0)}
html.fx .tl[data-anim] li > *{opacity:0; transform:translateY(8px)}
html.fx .tl[data-anim].is-on li::before{transform:none; transition:transform .5s cubic-bezier(.3,1.6,.5,1); transition-delay:calc(var(--i,0) * 380ms + .3s)}
html.fx .tl[data-anim].is-on li > *{opacity:1; transform:none; transition:opacity .7s ease, transform .7s var(--ease); transition-delay:calc(var(--i,0) * 380ms + .45s)}
.tl li{position:relative; padding-top:22px}
.tl li::before{content:""; position:absolute; top:-5px; left:0; width:9px; height:9px; border-radius:50%; background:var(--snow); border:1.5px solid var(--wood)}
.tl li:last-child::before{background:var(--wood)}
.tl b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 50; font-weight:400; font-size:25px; line-height:1; color:var(--wood-d)}
.tl span{display:block; margin-top:8px; font-size:15px; line-height:1.45; color:var(--muted)}
@media (max-width:980px){
  .story-in{grid-template-columns:1fr}
  .story-media{grid-template-rows:none; grid-template-columns:1fr 1fr; min-height:0; gap:12px}
  .story-media figure{aspect-ratio:4/5}
}
@media (max-width:520px){
  .tl{grid-template-columns:1fr; gap:16px; margin-left:4px; padding-left:24px; border-top:0; border-left:1px solid var(--line)}
  .tl li{display:grid; grid-template-columns:62px 1fr; align-items:baseline; gap:12px; padding-top:0}
  .tl li::before{top:9px; left:-29px}
  .tl::after{left:-1px; right:auto; top:0; bottom:0; width:1px; height:auto; transform:scaleY(0); transform-origin:center top}
  .tl.is-on::after{transform:scaleY(1)}
  .tl b{font-size:23px}
  .tl span{margin-top:0}
}

/* ---------- Espacios ---------- */
.spaces{background:var(--snow-2); padding:var(--sec) 0}
.head{display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:end; margin-bottom:clamp(40px,5vw,64px)}
.head .title{max-width:17ch}
.head p{color:var(--muted); max-width:46ch}
.mosaic{display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(2,minmax(220px,16vw)) minmax(280px,24vw); gap:14px}
.tile{position:relative; overflow:hidden; border-radius:var(--r); background:var(--forest)}
.tile img{width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease)}
.tile:hover img{transform:scale(1.045)}
html.js .tile[data-reveal].is-in:hover img{transform:scale(1.045)}
.tile.swap img{position:absolute; inset:0; opacity:0}
.tile.swap img.is-active{opacity:1}
html.js .tile.swap img{transition:opacity 1.8s ease, transform 1.8s cubic-bezier(.2,.75,.15,1)}
.tile figcaption{display:grid}
.tile .cap{grid-area:1 / 1; opacity:0; transform:translateY(8px); transition:opacity .9s ease, transform .9s var(--ease)}
.tile .cap.is-active{opacity:1; transform:none; transition-delay:.5s}
.tile-open{all:unset; position:absolute; inset:0; z-index:2; cursor:zoom-in; border-radius:inherit}
.tile-open:focus-visible{outline:3px solid var(--wood-l); outline-offset:-3px}
html.js .tile[data-reveal] figcaption{opacity:0; transform:translateY(12px); transition:opacity .8s ease, transform .9s var(--ease); transition-delay:calc(var(--reveal-delay,0ms) + .7s)}
html.js .tile[data-reveal].is-in figcaption{opacity:1; transform:none}
.tile figcaption{position:absolute; z-index:1; pointer-events:none; left:0; right:0; bottom:0; padding:70px 24px 20px; color:var(--snow); background:linear-gradient(0deg, rgba(20,38,30,.86), rgba(20,38,30,0))}
.tile figcaption b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:450; font-size:23px; line-height:1.2}
.tile figcaption span{display:block; font-size:15px; color:rgba(246,244,239,.85); margin-top:2px}
.t1{grid-column:1 / 8; grid-row:1 / 3}
.t2{grid-column:8 / 13; grid-row:1 / 2}
.t3{grid-column:8 / 13; grid-row:2 / 3}
.t4{grid-column:1 / 8; grid-row:3 / 4}
.t5{grid-column:8 / 13; grid-row:3 / 4}

.rooms{display:grid; grid-template-columns:1fr; gap:26px; margin-top:clamp(48px,6vw,80px); padding-top:clamp(32px,4vw,44px); border-top:1px solid var(--line)}
.rooms-head h3{font-size:clamp(26px,2.4vw,32px); line-height:1.1; color:var(--forest)}
.rooms-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px 40px; flex-wrap:wrap}
.rooms-head p{font-size:16px; color:var(--muted); max-width:62ch}
.rooms-list{display:grid; grid-template-columns:repeat(5,1fr); gap:14px}
.rooms-list li{display:flex; flex-direction:column; padding:18px 18px 20px; background:var(--card); border-radius:14px; border:1px solid rgba(30,33,30,.06)}
.rooms-list b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:450; font-size:21px; color:var(--forest); line-height:1.2}
.rooms-list span{display:block; margin-top:6px; font-size:15px; line-height:1.45; color:var(--muted)}
.rooms-list li{transition:transform .5s var(--ease), box-shadow .5s, border-color .3s}
.rooms-list li:hover{transform:translateY(-3px); box-shadow:0 20px 40px -26px rgba(20,38,30,.45); border-color:rgba(160,102,58,.25)}
.pax{display:inline-flex; align-items:center; gap:7px; align-self:flex-start; margin-top:auto; padding-top:14px; font-style:normal; font-size:14px; font-weight:700; color:var(--wood-d)}
.pax svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round}
@media (max-width:1100px){
  .rooms-list{gap:10px}
}
@media (max-width:860px){
  .head{grid-template-columns:1fr; gap:16px}
  .mosaic{grid-template-columns:1fr 1fr; grid-template-rows:none; grid-auto-rows:auto; gap:10px}
  .tile,.t2,.t3,.t4,.t5{grid-column:auto; grid-row:auto; aspect-ratio:1/1}
  .t1{grid-column:1 / -1; grid-row:auto; aspect-ratio:16/11}
  .tile figcaption{padding:50px 14px 14px}
  .tile figcaption b{font-size:clamp(15px,4.3vw,19px); white-space:nowrap}
  .tile figcaption span{font-size:14px}
}
@media (max-width:860px){
  .rooms-list{grid-template-columns:1fr 1fr}
  .rooms-list li:last-child{grid-column:1 / -1}
}
@media (max-width:560px){
  .rooms-list{gap:10px}
  .rooms-list li{padding:14px 14px 16px}
  .rooms-list b{font-size:19px}
  .tile figcaption span{display:none}
  .t1 figcaption span{display:block}
}

/* ---------- Dos temporadas ---------- */
.seasons-head{display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:end; padding-top:var(--sec); padding-bottom:clamp(40px,5vw,60px)}
.seasons-head .title{max-width:15ch}
.seasons-head p{color:var(--muted); max-width:46ch}
.seasons{container-type:inline-size; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr auto auto auto; min-height:min(90vh,780px); background:var(--forest-d)}
.season{position:relative; grid-row:1 / -1; min-width:0; display:grid; grid-template-rows:subgrid; overflow:hidden; color:var(--snow)}
.season > img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform-origin:var(--kb-o,30% 40%); animation:kenburns 28s ease-in-out infinite alternate; animation-play-state:paused}
.season:nth-child(2) > img{--kb-o:70% 35%; animation-delay:-9s}
.seasons.is-live .season > img{animation-play-state:running}
@keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.16)}}
.season::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,38,30,.94) 0, rgba(20,38,30,.62) 40%, rgba(20,38,30,.08) 78%)}
.season-in{position:relative; z-index:1; grid-row:2 / 5; display:grid; grid-template-rows:subgrid; align-content:end; padding:0 var(--pad) clamp(40px,4.5vw,64px)}
.season:first-child .season-in{padding-left:max(var(--pad), calc((100vw - var(--max)) / 2 + var(--pad))); padding-left:max(var(--pad), calc((100cqw - var(--max)) / 2 + var(--pad)))}
.season-in > *{max-width:520px}
.season h3{font-size:clamp(46px,5vw,76px); line-height:1; font-weight:360; font-variation-settings:"SOFT" 80; letter-spacing:-.02em}
.season-in > p{margin-top:14px; max-width:44ch; color:rgba(246,244,239,.86)}
.season ul{margin-top:26px; border-top:1px solid var(--line-l)}
.season li{display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding:13px 0; border-bottom:1px solid var(--line-l); font-size:16.5px; font-weight:500}
.season li span{white-space:nowrap; font-size:15px; font-weight:600; color:var(--wood-l)}
@media (hover:hover) and (min-width:981px){
}
@media (max-width:980px){
  .seasons-head{grid-template-columns:1fr; gap:16px}
  .seasons{display:flex; flex-direction:column; min-height:0}
  .season{display:flex; align-items:flex-end; min-height:600px}
  .season-in{display:block; width:100%}
}
@media (max-width:980px){
  .season:first-child .season-in{padding-left:var(--pad)}
  .season-in{padding:48px var(--pad) 40px}
  .season-in > p{margin-top:14px}
  .season ul{margin-top:26px}
}
@media (max-width:520px){
  .season{min-height:620px}
  .season li{font-size:15.5px}
}

/* ---------- Opiniones ---------- */
.reviews{padding:var(--sec) 0}
.rv-top{display:grid; grid-template-columns:1fr auto; gap:40px; align-items:end; padding-bottom:clamp(30px,4vw,44px); border-bottom:1px solid var(--line)}
.rv-top .title{max-width:14ch}
.rv-score{display:flex; align-items:center; gap:22px}
.rv-num{font-family:var(--serif); font-variation-settings:"SOFT" 50; font-weight:400; font-size:clamp(68px,7vw,100px); line-height:.85; letter-spacing:-.03em; color:var(--forest)}
.rv-meta p{font-size:15px; color:var(--muted); margin-top:6px}
.stars{display:inline-block; color:var(--wood)}
.stars svg{width:96px; height:18px; fill:currentColor}
html.fx .rv-score[data-anim] .stars svg{clip-path:inset(0 100% 0 0)}
html.fx .rv-score[data-anim].is-on .stars svg{clip-path:inset(0 0 0 0); transition:clip-path 1.3s cubic-bezier(.6,0,.2,1) .5s}
.super{display:flex; align-items:center; gap:12px; margin-left:12px; padding:10px 20px 10px 10px; border-radius:999px; background:var(--card); border:1px solid var(--line)}
.super-ico{display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:var(--forest)}
.super-ico svg{width:24px; height:24px; fill:none; stroke:var(--wood-l); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.super p{line-height:1.25}
.super b{display:block; font-weight:700; font-size:15.5px; color:var(--forest)}
.super span{font-size:14px; color:var(--muted)}
.rv-cats{display:grid; grid-template-columns:repeat(6,1fr); padding:clamp(26px,3vw,36px) 0 clamp(36px,4vw,52px)}
.rv-cats li{display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:12px; align-items:center; padding:4px 20px; border-left:1px solid var(--line)}
.rv-cats li:first-child{border-left:0; padding-left:0}
.rv-cats svg{grid-row:1 / 3; width:26px; height:26px; fill:none; stroke:var(--moss); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.rv-cats span{font-size:14.5px; color:var(--muted); line-height:1.3}
.rv-cats b{font-family:var(--serif); font-variation-settings:"SOFT" 50; font-weight:450; font-size:24px; line-height:1.1; color:var(--forest)}
.rv-grid{display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:auto auto 1fr auto; gap:0 20px}
.rv{display:grid; grid-row:span 4; grid-template-rows:subgrid; row-gap:0; align-content:start; background:var(--card); border:1px solid rgba(30,33,30,.08); border-radius:var(--r); padding:clamp(24px,2.4vw,32px)}
.rv header{display:flex; align-items:center; gap:14px}
.rv-av{display:grid; place-items:center; width:48px; height:48px; border-radius:50%; font-family:var(--serif); font-variation-settings:"SOFT" 100; font-size:20px; color:var(--snow); flex:0 0 auto}
.rv-av.a1{background:var(--moss)} .rv-av.a2{background:var(--wood)} .rv-av.a3{background:var(--forest-2)}
.rv header p{line-height:1.3; min-width:0}
.rv header b{display:block; font-weight:700; font-size:16px}
.rv header p span{display:block; font-size:14.5px; color:var(--muted)}
.rv-stay{display:flex; flex-direction:column; align-items:flex-start; gap:4px; margin-top:18px; font-size:14px; font-weight:600; color:var(--muted)}
.rv-stay .stars svg{width:80px; height:15px}
.rv blockquote{margin-top:14px; font-size:16.5px; line-height:1.65; color:var(--ink)}
.rv-tr{align-self:end; padding-top:16px; font-size:13.5px; color:var(--muted)}
.rv-more{display:flex; justify-content:center; margin-top:clamp(32px,4vw,48px)}
@media (max-width:1100px){
  .rv-top{grid-template-columns:1fr; gap:26px}
  .rv-cats{grid-template-columns:repeat(3,1fr); row-gap:22px}
  .rv-cats li:nth-child(4){border-left:0; padding-left:0}
}
@media (max-width:900px){
  .rv-grid{grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:min(78%, 420px); overflow-x:auto; scroll-snap-type:x mandatory; margin:0 calc(var(--pad) * -1); padding:4px var(--pad) 10px; scroll-padding:0 var(--pad); scrollbar-width:none}
  .rv-grid::-webkit-scrollbar{display:none}
  .rv{scroll-snap-align:start}
}
@media (max-width:520px){
  .rv-grid{grid-auto-columns:86%; gap:12px}
}
@media (max-width:620px){
  .rv-score{flex-wrap:wrap; gap:16px 18px}
  .super{margin-left:0}
  .rv-cats{grid-template-columns:1fr 1fr}
  .rv-cats li,.rv-cats li:nth-child(4){border-left:0; padding-left:0}
}

/* ---------- Precios ---------- */
.prices{background:var(--forest); color:var(--snow); padding:var(--sec) 0}
.prices-in{display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); align-items:stretch}
.price-copy{display:flex; flex-direction:column}
.price-h{line-height:1}
.price-h span{display:block}
.ph-a{font-size:clamp(22px,2vw,28px); font-variation-settings:"SOFT" 70; color:var(--wood-l)}
.ph-b{font-size:clamp(84px,10vw,150px); font-weight:340; font-variation-settings:"SOFT" 80; letter-spacing:-.04em; line-height:.92; margin:6px 0 10px}
.ph-c{font-size:clamp(26px,2.6vw,38px); font-variation-settings:"SOFT" 60; line-height:1.15}
.price-sub{margin-top:22px; margin-bottom:34px; max-width:46ch; font-size:18px; color:rgba(246,244,239,.82)}
.months{margin-bottom:34px}
.months-t{font-size:15px; font-weight:700; color:var(--snow); margin-bottom:12px}
.m-cells{display:grid; grid-template-columns:repeat(12,1fr); gap:5px}
.m-cells li{display:grid; place-items:center; height:44px; border-radius:9px; font-size:13.5px; font-weight:700; transform-origin:center bottom}
.m-cells .hi{background:var(--snow); color:var(--forest)}
.m-cells .mid{background:var(--wood-l); color:var(--forest-d)}
.m-cells .lo{background:rgba(246,244,239,.13); color:var(--snow); box-shadow:inset 0 0 0 1px rgba(246,244,239,.16)}
html.fx .months[data-anim] .m-cells li{transform:scaleY(.2); opacity:0}
html.fx .months[data-anim].is-on .m-cells li{transform:none; opacity:1; transition:transform .7s cubic-bezier(.3,1.4,.5,1), opacity .4s ease; transition-delay:calc(var(--i) * 55ms + .2s)}
.m-legend{display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:12px; font-size:14px; color:rgba(246,244,239,.78)}
.m-legend li{display:flex; align-items:center; gap:8px}
.m-legend li::before{content:""; width:12px; height:12px; border-radius:4px}
.m-legend .hi::before{background:var(--snow)}
.m-legend .mid::before{background:var(--wood-l)}
.m-legend .lo::before{background:rgba(246,244,239,.13); box-shadow:inset 0 0 0 1px rgba(246,244,239,.3)}
.incl{display:grid; grid-template-columns:1fr 1fr; gap:12px 28px; margin-top:auto; padding-top:30px; border-top:1px solid var(--line-l)}
.incl li{display:flex; align-items:center; gap:12px; font-size:15.5px}
.incl li::before{content:""; flex:0 0 auto; width:22px; height:22px; border-radius:50%; background:rgba(207,154,102,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CF9A66' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.price-card{background:var(--snow); color:var(--ink); border-radius:var(--r-lg); padding:clamp(22px,2.6vw,36px); box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.ptable{width:100%; border-collapse:collapse}
.ptable caption{text-align:left; font-size:15px; color:var(--muted); padding-bottom:16px}
.ptable thead th{white-space:nowrap; text-align:left; font-size:13px; font-weight:700; color:var(--forest); padding:0 0 10px; border-bottom:1px solid var(--line)}
.ptable thead th:last-child{text-align:right}
.ptable tbody th{text-align:left; font-weight:400; padding:20px 0}
.pt-season{display:flex; align-items:center; gap:16px}
.ptable tbody tr{border-bottom:1px solid var(--line)}
.ptable tbody th svg{width:40px; height:40px; padding:9px; border-radius:50%; background:var(--snow-2); fill:none; stroke:var(--wood-d); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex:0 0 auto}
.ptable tbody th b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:450; font-size:21px; color:var(--forest); line-height:1.2}
.ptable tbody th small{display:block; font-size:15px; color:var(--muted)}
.ptable td{text-align:right; vertical-align:middle; white-space:nowrap}
.ptable td b{font-family:var(--serif); font-variation-settings:"SOFT" 50; font-weight:400; font-size:clamp(30px,2.8vw,40px); color:var(--forest); letter-spacing:-.02em}
.pc-foot{margin-top:22px}
.pc-foot p{display:flex; align-items:flex-start; gap:10px; font-size:15px; color:var(--muted); margin-top:8px}
.pc-foot p svg{width:18px; height:18px; margin-top:3px; fill:none; stroke:var(--wood-d); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:0 0 auto}
.pc-foot .btn{margin-top:22px; width:100%}
@media (max-width:1100px){
  .prices-in{grid-template-columns:1fr; gap:48px}
  .incl{margin-top:0}
}
@media (max-width:480px){
  .incl{grid-template-columns:1fr}
  .pt-season{gap:12px}
  .ptable tbody th svg{width:36px; height:36px; padding:8px}
  .ptable tbody th b{font-size:19px}
}
@media (max-width:420px){
  .ptable tbody th svg{display:none}
}

/* ---------- Cómo llegar ---------- */
.arrive{background:var(--snow-2); padding:var(--sec) 0}
.arrive-in{display:grid; grid-template-columns:1.12fr .88fr; gap:clamp(40px,6vw,96px); align-items:stretch}
.map-card{position:relative; min-height:600px; border-radius:var(--r-lg); overflow:hidden; background:var(--forest-d); box-shadow:0 40px 80px -46px rgba(20,38,30,.7)}
.map{position:absolute; inset:0; width:100%; height:100%; max-width:none}
.m-topo path{fill:none; stroke:rgba(246,244,239,.11); stroke-width:1}
.m-river{fill:none; stroke:#8FB0B4; stroke-opacity:.55; stroke-width:3.2; stroke-linecap:round}
.m-road{fill:none; stroke:var(--wood-l); stroke-width:3; stroke-linecap:round; stroke-linejoin:round}
.m-road-2{stroke-opacity:.55; stroke-width:2.4}
.m-path{fill:none; stroke:var(--snow); stroke-width:2; stroke-dasharray:2 6; stroke-linecap:round}
.map{--mt:14px; --ms:12px; --mr:13px}
.map text{font-family:var(--sans); font-size:var(--mt); fill:rgba(246,244,239,.82)}
.map .m-river-t{font-family:var(--serif); font-style:italic; font-size:var(--mr); fill:#9DBDC0; letter-spacing:.04em}
.m-peak path{fill:rgba(246,244,239,.55)}
.map .m-peak text{font-family:var(--serif); font-style:italic; font-size:var(--mt)}
.map .m-peak .m-alt,.map .m-town .m-sub{font-family:var(--sans); font-style:normal; font-size:var(--ms); fill:rgba(246,244,239,.55)}
.m-town circle{fill:var(--snow)}
.m-town text{font-weight:600}
.m-exit path{fill:none; stroke:rgba(246,244,239,.6); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.map .m-exit text{font-size:var(--ms); fill:rgba(246,244,239,.62)}
.m-north circle{fill:none; stroke:rgba(246,244,239,.35)}
.m-north path{fill:var(--wood-l)}
.map .m-north text{font-size:11px; font-weight:700; fill:rgba(246,244,239,.7)}
.m-scale path{fill:none; stroke:rgba(246,244,239,.55); stroke-width:1.4}
.map .m-scale text{font-size:var(--ms); fill:rgba(246,244,239,.6)}
.m-dot{fill:var(--wood); stroke:var(--snow); stroke-width:3}
.m-route{fill:none; stroke:#FFE6C7; stroke-width:4.5; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 6px rgba(255,190,120,.55))}
html.fx .map-card.draw-ready.is-on .m-topo path{stroke-dashoffset:0; transition:stroke-dashoffset 2.6s cubic-bezier(.4,0,.2,1); transition-delay:calc(var(--i,0) * 9ms)}
html.fx .map-card.draw-ready:not(.drawn) .m-route{stroke-dasharray:1; stroke-dashoffset:1}
html.fx .map-card.draw-ready.is-on .m-route{stroke-dashoffset:0; transition:stroke-dashoffset 2.4s cubic-bezier(.65,0,.25,1) .9s}
html.fx .map-card.draw-ready .m-pin{transform:translateY(-90px); opacity:0}
html.fx .map-card.draw-ready.is-on .m-pin{transform:none; opacity:1; transition:transform .9s cubic-bezier(.3,1.45,.5,1) 3.1s, opacity .3s ease 3.1s}
html.fx .map-card.draw-ready .m-label,html.fx .map-card.draw-ready .map-tag{opacity:0}
html.fx .map-card.draw-ready .m-label{transform:translateY(10px)}
html.fx .map-card.draw-ready.is-on .m-label,html.fx .map-card.draw-ready.is-on .map-tag{opacity:1; transition:opacity .6s ease 3.7s, transform .7s var(--ease) 3.7s}
html.fx .map-card.draw-ready.is-on .m-label{transform:none}
html.fx .map-card.draw-ready :is(.m-river,.m-road){opacity:0}
html.fx .map-card.draw-ready.is-on :is(.m-river,.m-road){opacity:1; transition:opacity 1.2s ease .5s}
html.fx .map-card.draw-ready :is(.m-town,.m-peak,.m-exit,.m-river-t,.m-north,.m-scale,.m-path){opacity:0}
html.fx .map-card.draw-ready.is-on :is(.m-town,.m-peak,.m-exit,.m-river-t,.m-north,.m-scale){opacity:1; transition:opacity .9s ease 1.2s}
html.fx .map-card.draw-ready.is-on .m-path{opacity:1; transition:opacity .6s ease 2.6s}
.m-pulse{fill:var(--wood-l); transform-box:fill-box; transform-origin:center; animation:pinPulse 2.6s ease-out infinite}
@keyframes pinPulse{0%{transform:scale(1); opacity:.55}80%,100%{transform:scale(3.2); opacity:0}}
.m-label rect,.m-label path{fill:var(--snow)}
.map .m-label .m-l1{font-family:var(--serif); font-variation-settings:"SOFT" 70; font-weight:500; font-size:17px; fill:var(--forest)}
.map .m-label .m-l2{font-size:12.5px; fill:var(--muted)}
.map-tag{display:none; position:absolute; left:calc(61.875% + 16px); top:calc(36.2% - 64px); padding:10px 14px 11px; border-radius:12px; background:var(--snow); color:var(--forest); line-height:1.25; box-shadow:0 14px 30px -14px rgba(0,0,0,.6); white-space:nowrap}
.map-tag b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 70; font-weight:500; font-size:17px}
.map-tag span{display:block; font-size:12.5px; color:var(--muted)}
.arrive-copy .title{margin-bottom:18px}
.arrive-addr{color:var(--muted); max-width:46ch}
.dist{margin-top:28px; border-bottom:1px solid var(--line)}
.dist li{display:grid; grid-template-columns:96px 1fr; align-items:baseline; gap:16px; padding:14px 0; border-top:1px solid var(--line)}
.dist b{font-family:var(--serif); font-variation-settings:"SOFT" 50; font-weight:400; font-size:27px; line-height:1; color:var(--wood-d); white-space:nowrap}
.dist span{font-weight:700; font-size:16.5px; color:var(--forest); line-height:1.3}
.dist small{display:block; font-weight:400; font-size:15px; color:var(--muted)}
.winter-note{display:flex; align-items:flex-start; gap:12px; margin-top:24px; padding:14px 18px; border-radius:14px; background:var(--card); font-size:15px; color:var(--ink); border:1px solid rgba(30,33,30,.07)}
.winter-note svg{width:20px; height:20px; margin-top:2px; flex:0 0 auto; fill:none; stroke:var(--moss); stroke-width:1.6; stroke-linecap:round}
.arrive-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px}
@media (max-width:1100px){
  .arrive-in{grid-template-columns:1fr}
  .map-card{min-height:0; aspect-ratio:3/2}
}
@media (max-width:760px){
  .map{--mt:20px; --ms:16px; --mr:16px}
  .map .m-label{display:none}
  .map-tag{display:block; left:calc(57.2% + 12px); top:calc(30.2% - 6px); transform:translateY(-100%)}
}
@media (max-width:620px){
  .map-card{aspect-ratio:3/4}
  .map{--mt:25px; --ms:19px; --mr:19px}
  .map .m-north,.map .m-sub{display:none}
  .map-tag{left:auto; right:12px; top:calc(35.33% - 14px); padding:7px 11px 8px; border-radius:10px}
  .map-tag b{font-size:15px}
  .map-tag span{font-size:11.5px}
}
@media (max-width:520px){
  .dist li{grid-template-columns:78px 1fr; gap:12px}
  .dist b{font-size:24px}
  .arrive-cta .btn{flex:1 1 100%}
}

/* ---------- Galería tipo Instagram ---------- */
.insta{padding:var(--sec) 0 clamp(56px,6vw,84px)}
.insta-head{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:clamp(28px,3vw,40px)}
.insta-handle{display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:16px; color:var(--forest); padding-bottom:4px; border-bottom:1.5px solid var(--wood); transition:color .2s, border-color .2s}
.insta-handle:hover{color:var(--wood-d)}
.insta-handle svg,.ft-social svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7}
.insta-handle .fill,.ft-social .fill{fill:currentColor; stroke:none}
.insta-strip{display:grid; grid-template-columns:repeat(6,1fr); gap:14px}
.insta-strip a{position:relative; display:block; aspect-ratio:1/1; border-radius:14px; overflow:hidden; background:var(--snow-2)}
.insta-strip img{width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease), filter .5s}
.insta-strip a::after{content:""; position:absolute; inset:0; background:rgba(20,38,30,.35) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F6F4EF' stroke-width='1.6'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3C/svg%3E") center/34px no-repeat; opacity:0; transition:opacity .35s}
.insta-strip a:hover img{transform:scale(1.06)}
.insta-strip a:hover::after,.insta-strip a:focus-visible::after{opacity:1}
@media (max-width:860px){
  .insta-strip{grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:40%; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:var(--pad); margin:0 calc(var(--pad) * -1); padding:0 var(--pad) 6px; scrollbar-width:none}
  .insta-strip::-webkit-scrollbar{display:none}
  .insta-strip li{scroll-snap-align:start}
}
@media (max-width:520px){
  .insta-head{flex-direction:column; align-items:flex-start; gap:14px}
  .insta-strip{grid-auto-columns:64%}
}

/* ---------- Reserva final ---------- */
.book{position:relative; isolation:isolate; overflow:hidden; background:var(--forest-d); color:var(--snow); padding:var(--sec) 0}
.book-topo{position:absolute; inset:0; z-index:-1; width:100%; height:100%}
.book-topo path{fill:none; stroke:rgba(246,244,239,.075); stroke-width:1}
html.fx .book-topo.draw-ready.is-on path{stroke-dashoffset:0; transition:stroke-dashoffset 3.4s cubic-bezier(.4,0,.2,1); transition-delay:calc(var(--i,0) * 14ms)}
.book::after{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:radial-gradient(520px circle at var(--sx,78%) var(--sy,30%), rgba(207,154,102,.13), transparent 70%); transition:background .2s}
.book-in{display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(40px,6vw,96px); align-items:stretch}
.book-copy{display:flex; flex-direction:column}
.book-copy h2{font-size:clamp(46px,6vw,92px); line-height:.98; font-weight:360; font-variation-settings:"SOFT" 80; letter-spacing:-.025em; max-width:9ch}
.book-copy > p{margin-top:24px; max-width:46ch; font-size:18px; color:rgba(246,244,239,.82)}
.book-contact{margin-top:34px; display:grid; gap:14px}
.book-contact li{display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-items:center}
.book-contact svg{grid-row:1 / 3; width:44px; height:44px; padding:11px; border-radius:50%; border:1px solid var(--line-l); fill:none; stroke:var(--wood-l); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.book-contact a{font-weight:700; font-size:17px; line-height:1.3}
.book-contact a:hover{color:var(--wood-l)}
.book-contact span{font-size:14.5px; color:rgba(246,244,239,.6)}
.free{margin-bottom:36px}
.free-t{font-size:15px; font-weight:700; color:var(--snow); margin-bottom:12px}
.free-list{display:flex; flex-wrap:wrap; gap:10px}
.free-chip{all:unset; box-sizing:border-box; display:inline-flex; align-items:center; gap:8px; padding:11px 16px; border-radius:999px; border:1px solid rgba(246,244,239,.24); font-size:15px; font-weight:600; color:var(--snow); cursor:pointer; transition:background .25s, border-color .25s, color .25s, transform .3s var(--ease)}
.free-chip::before{content:""; width:8px; height:8px; border-radius:50%; background:#8FCB8F; box-shadow:0 0 0 3px rgba(143,203,143,.18)}
.free-chip:hover{border-color:rgba(246,244,239,.55); background:rgba(246,244,239,.06)}
.free-chip.is-sel{background:var(--snow); color:var(--forest); border-color:var(--snow)}
.free-chip:focus-visible{outline:2px solid var(--wood-l); outline-offset:3px}
.free-note{margin-top:10px; font-size:14px; color:rgba(246,244,239,.6)}
.field.flash input{animation:flash 1.2s ease}
@keyframes flash{0%{box-shadow:0 0 0 0 rgba(160,102,58,0)}25%{box-shadow:0 0 0 4px rgba(160,102,58,.35); border-color:var(--wood)}100%{box-shadow:0 0 0 0 rgba(160,102,58,0)}}
.hosts-light{margin-top:auto; padding-top:28px; border-top:1px solid var(--line-l)}
.book-contact{margin-bottom:36px}
.hosts-light .hosts-av i{box-shadow:0 0 0 3px var(--forest-d); background:var(--moss)}
.hosts-light .hosts-av i + i{background:var(--wood)}
.hosts-light p b{color:var(--snow)}
.hosts-light p span{color:rgba(246,244,239,.65)}

.book-form{background:var(--snow); color:var(--ink); border-radius:var(--r-lg); padding:clamp(24px,3vw,40px); box-shadow:0 50px 90px -40px rgba(0,0,0,.7)}
.book-form h3{font-size:clamp(26px,2.4vw,32px); line-height:1.1; color:var(--forest); margin-bottom:22px}
.field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px; min-width:0}
.field label{font-size:13px; font-weight:700; color:var(--forest)}
.field input,.field select,.field textarea{width:100%; min-width:0; font-size:15.5px; color:var(--ink); background:#fff; border:1px solid rgba(30,33,30,.14); border-radius:12px; padding:12px 14px; min-height:48px; transition:border-color .2s, box-shadow .2s; outline:none}
.field select{appearance:none; -webkit-appearance:none; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2387522B' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 14px center/14px no-repeat; padding-right:36px; cursor:pointer}
.field textarea{resize:vertical; min-height:76px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--wood); box-shadow:0 0 0 3px rgba(160,102,58,.16)}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.row3{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.check{display:flex; align-items:flex-start; gap:10px; margin:4px 0 18px; font-size:14px; color:var(--muted); cursor:pointer; line-height:1.45}
.check input{margin-top:2px; accent-color:var(--forest)}
.check a{text-decoration:underline; text-underline-offset:2px}
.form-note{margin-top:12px; text-align:center; font-size:14px; color:var(--muted)}
@media (max-width:1020px){
  .book-in{grid-template-columns:1fr}
}
@media (max-width:520px){
  .row2{grid-template-columns:1fr; gap:0}
  .row2.keep{grid-template-columns:1fr 1fr; gap:10px}
  .field input,.field select,.field textarea{font-size:16px}
  .row3{gap:8px}
  .book-copy > p{font-size:17px}
}

/* ---------- Visor de fotos ---------- */
.lb{position:fixed; inset:0; z-index:200; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:16px; padding:clamp(16px,4vw,56px); background:rgba(12,22,17,.94); color:var(--snow); opacity:0; transition:opacity .4s ease}
.lb[hidden]{display:none}
.lb.is-open{opacity:1}
.lb-fig{margin:0; display:flex; flex-direction:column; align-items:center; gap:14px; min-width:0; height:100%; justify-content:center}
.lb-fig img{max-width:100%; max-height:calc(100vh - 170px); max-height:calc(100svh - 170px); border-radius:14px; object-fit:contain; transform:scale(.97); opacity:0; transition:transform .6s var(--ease), opacity .45s ease}
.lb.is-open .lb-fig img.is-loaded{transform:none; opacity:1}
.lb-fig figcaption{text-align:center; line-height:1.35}
.lb-fig b{display:block; font-family:var(--serif); font-variation-settings:"SOFT" 60; font-weight:450; font-size:24px}
.lb-fig span{font-size:15px; color:rgba(246,244,239,.75)}
.lb-close,.lb-nav{all:unset; box-sizing:border-box; display:grid; place-items:center; width:52px; height:52px; border-radius:50%; border:1px solid rgba(246,244,239,.28); cursor:pointer; transition:background .25s, border-color .25s}
.lb-close:hover,.lb-nav:hover{background:rgba(246,244,239,.1); border-color:rgba(246,244,239,.55)}
.lb-close:focus-visible,.lb-nav:focus-visible{outline:2px solid var(--wood-l); outline-offset:3px}
.lb-close{position:absolute; top:clamp(14px,2.4vw,28px); right:clamp(14px,2.4vw,28px)}
.lb svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
html.lb-open,html.lb-open body{overflow:hidden}
@media (max-width:620px){
  .lb{grid-template-columns:1fr 1fr; grid-template-rows:1fr auto; gap:14px}
  .lb-fig{grid-column:1 / -1; grid-row:1}
  .lb-prev{grid-row:2; justify-self:end}
  .lb-next{grid-row:2; justify-self:start}
}

/* ---------- Cursor "lumbre": brasa cálida con halo ---------- */
html.cursor-lumbre{--cur-dot:7px; --cur-dot-bg:#E7AE73; --cur-ring:46px; --cur-ring-border:1px solid rgba(231,174,115,.5); --cur-ring-bg:radial-gradient(circle, rgba(231,174,115,.2) 0%, rgba(231,174,115,.06) 46%, transparent 70%); --cur-link-scale:1.5; --cur-link-bg:radial-gradient(circle, rgba(231,174,115,.34) 0%, rgba(231,174,115,.1) 52%, transparent 72%); --cur-link-dot:.6; --cur-label-size:80px; --cur-label-bg:#F6F4EF; --cur-label-fg:#1F3A2E; --cur-label-font:'Karla', system-ui, sans-serif; --cur-lerp:.16; --cur-dark-dot:#A0663A; --cur-dark-ring:1px solid rgba(160,102,58,.5); --cur-light-dot:#E7AE73; --cur-light-ring:1px solid rgba(231,174,115,.5)}
.cursor-lumbre .cur-dot::after{content:""; position:absolute; left:0; top:0; width:26px; height:26px; margin:-13px 0 0 -13px; border-radius:50%; background:radial-gradient(circle, rgba(255,186,112,.5), rgba(255,186,112,0) 68%); animation:ember 2.4s ease-in-out infinite; transition:opacity .3s}
html.cursor-lumbre.cur-dark{--cur-ring-bg:radial-gradient(circle, rgba(160,102,58,.14) 0%, rgba(160,102,58,.04) 46%, transparent 70%); --cur-link-bg:radial-gradient(circle, rgba(160,102,58,.22) 0%, rgba(160,102,58,.06) 52%, transparent 72%)}
html.cursor-lumbre.cur-dark .cur-dot::after{background:radial-gradient(circle, rgba(160,102,58,.35), rgba(160,102,58,0) 68%)}
html.cursor-lumbre.cur-text .cur-dot::after{opacity:0}
html.cursor-lumbre.cur-link .cur-dot::after{animation-duration:1.2s}
.cursor-lumbre .cur-label{font-size:14px; font-weight:700; box-shadow:0 16px 34px -14px rgba(0,0,0,.55), inset 0 0 0 1px rgba(160,102,58,.25)}
@keyframes ember{0%,100%{transform:scale(.85); opacity:.75}50%{transform:scale(1.15); opacity:1}}

/* ---------- Pie ---------- */
.ft{background:var(--forest); color:rgba(246,244,239,.72); padding:clamp(60px,7vw,90px) 0 28px; font-size:15px; border-top:1px solid rgba(246,244,239,.06)}
.ft-top{display:grid; grid-template-columns:1.5fr 1fr 1.1fr 1.1fr; gap:40px; padding-bottom:48px; border-bottom:1px solid var(--line-l)}
.ft-brand > p{margin-top:20px; max-width:36ch; font-size:15px}
.ft-brand .ft-reg{margin-top:12px; font-size:13.5px; color:rgba(246,244,239,.62)}
.ft-social{display:flex; gap:10px; margin-top:22px}
.ft-social a{display:grid; place-items:center; width:42px; height:42px; border-radius:50%; border:1px solid var(--line-l); color:var(--snow); transition:background .25s, border-color .25s}
.ft-social a:hover{background:rgba(246,244,239,.1); border-color:rgba(246,244,239,.35)}
.ft-social svg{width:19px; height:19px}
.ft h4{font-size:20px; font-variation-settings:"SOFT" 60; color:var(--snow); margin-bottom:16px}
.ft ul:not(.ft-social){display:grid; gap:9px}
.ft a{transition:color .2s}
.ft a:hover{color:var(--snow)}
.ft-contact p{margin-bottom:14px; line-height:1.6}
.ft-langs{display:flex; gap:6px; margin-top:6px}
.ft-langs a{font-size:13px; font-weight:700; padding:6px 10px; border-radius:8px; border:1px solid var(--line-l)}
.ft-langs a.on{background:var(--snow); color:var(--forest); border-color:var(--snow)}
.ft-bot{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 28px; padding-top:24px; font-size:13px; color:rgba(246,244,239,.62)}
.ft-bot nav{display:flex; flex-wrap:wrap; gap:6px 20px}
@media (max-width:980px){ .ft-top{grid-template-columns:1fr 1fr} }
@media (max-width:560px){ .ft-top{grid-template-columns:1fr; gap:32px} }

/* ---------- Accesibilidad ---------- */
:focus-visible{outline:2px solid var(--wood); outline-offset:3px}
.hd :focus-visible,.hero :focus-visible,.prices :focus-visible,.book-copy :focus-visible,.ft :focus-visible,.mmenu :focus-visible{outline-color:var(--wood-l)}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .hero-media,.hero h1 .ln > span,.hero-sub,.hero-proof,.hero-bottom{animation:none}
  .slide,.slide video{transition:none}
  .slide video{transform:none}
  .htab.is-active .bar i{animation:none; transform:scaleX(1)}
  .m-pulse{animation:none; opacity:0}
  .season,.season > img,.tile img,.insta-strip img{transition:none}
  .season > img{animation:none}
  .avail,.hero-tabs{animation:none}
  .postcard-wrap{opacity:1; transform:none; clip-path:none; transition:none}
  .pc-photo img{transition:none}
  .hero-fx{display:none}
}