/* ==========================================================
   Hoteles.Guru · diseño premium de las páginas de cada hotel (v230)
   Va en: public_html/hotel-skin.css  — una sola hoja para TODAS.
   ========================================================== */
body{background:radial-gradient(1000px 480px at 100% 0%,#E9F1FF 0%,rgba(233,241,255,0) 60%),radial-gradient(800px 420px at 0% 30%,#F3ECFF 0%,rgba(243,236,255,0) 55%),#F4F7FC!important}
#hsProg{position:fixed;left:0;top:0;height:3px;width:0;z-index:100001;background:linear-gradient(90deg,#1668E3,#7C3AED,#E11D48,#F59E0B,#10B981);pointer-events:none}
.top{background:linear-gradient(90deg,#0B1B3F,#111A38 60%,#1B2350)!important;box-shadow:0 6px 18px rgba(11,27,63,.25);position:relative}
.top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#1668E3,#7C3AED,#E11D48,#F59E0B,#10B981)}
.crumb a{text-decoration:none;font-weight:600}
h1{position:relative;padding-bottom:10px;font-size:34px!important}
h1::after{content:"";position:absolute;left:0;bottom:0;width:min(220px,60%);height:4px;border-radius:4px;background:linear-gradient(90deg,#1668E3,#7C3AED,#E11D48)}
.stars{color:#F5A524!important;letter-spacing:2px;margin-top:6px}
.rate{position:relative;background:linear-gradient(135deg,#0B3D91,#1668E3)!important;border-radius:12px!important;padding:8px 13px!important;box-shadow:0 8px 18px rgba(22,104,227,.3)}
.rate.hs-top{background:linear-gradient(135deg,#047857,#10B981)!important;box-shadow:0 8px 18px rgba(16,185,129,.3)}
.rate::after{content:"";position:absolute;inset:-4px;border-radius:15px;border:2px solid rgba(22,104,227,.35);animation:hsRing 2.4s ease-out infinite}
.rate.hs-top::after{border-color:rgba(16,185,129,.4)}
@keyframes hsRing{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.2)}}
/* insignia y "Nuevo" junto al nombre */
.hs-cert{position:relative;display:inline-block;vertical-align:middle;margin:-12px 0 -12px 12px;cursor:pointer}
.hs-cert img{display:block;width:84px;height:auto;filter:drop-shadow(0 3px 6px rgba(120,80,0,.38));animation:hsGlow 2.8s ease-in-out infinite}
.hs-cert::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.95) 46%,rgba(255,250,220,.9) 50%,transparent 64%) 0 0/260% 100% no-repeat;
  -webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;animation:hsShineB 3.2s ease-in-out infinite;mix-blend-mode:screen}
@keyframes hsShineB{0%,55%{background-position:140% 0}100%{background-position:-60% 0}}
@keyframes hsGlow{0%,100%{filter:drop-shadow(0 3px 6px rgba(120,80,0,.38))}50%{filter:drop-shadow(0 0 10px rgba(255,196,0,.75)) drop-shadow(0 3px 6px rgba(120,80,0,.38))}}
.hs-new{display:inline-flex;align-items:center;gap:6px;margin:8px 0 0;padding:6px 12px;border-radius:999px;font:800 11.5px/1 'Public Sans',system-ui;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:linear-gradient(90deg,#6D28D9,#7C3AED 45%,#E11D48);box-shadow:0 6px 16px rgba(124,58,237,.4);position:relative;overflow:hidden}
.hs-new::after,.cta::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:hsShine 3.8s ease-in-out infinite}
@keyframes hsShine{0%,70%{left:-60%}100%{left:130%}}
/* fotos */
.shots{position:relative;border-radius:20px;overflow:hidden;gap:6px!important;grid-template-columns:2fr 1fr 1fr!important;grid-template-rows:190px 190px}
.shots img{height:100%!important;min-height:0}
.shots img:first-child{grid-column:1!important;grid-row:1/3;height:100%!important}
.shots img:nth-child(n+6){display:none!important}
@media(max-width:800px){.shots{grid-template-columns:1fr 1fr!important;grid-template-rows:230px 120px}
  .shots img:first-child{grid-column:1/-1!important;grid-row:1}.shots img:nth-child(n+4){display:none!important}}
.shots img{border-radius:0!important;cursor:zoom-in;transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .3s}
.shots img:hover{transform:scale(1.035);filter:saturate(1.15)}
.hs-all{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:10px 0 0;padding:12px;border:1.5px solid #16233B;border-radius:999px;background:#fff;font:800 15px 'Public Sans',system-ui;color:#16233B;cursor:pointer;transition:transform .15s,box-shadow .15s}
.hs-all:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(17,40,90,.14)}
.hs-trust{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;margin:12px 0 0;padding:10px 14px;border-radius:14px;background:linear-gradient(180deg,#FBFCFE,#F4F7FC);border:1px solid #E6ECF5}
.hs-trust span{display:inline-flex;align-items:center;gap:7px;font:600 12.5px 'Public Sans',system-ui;color:#3B4C6B;padding:0 12px;border-right:1px solid #DCE4F0}
.hs-trust span:first-child{padding-left:0}.hs-trust span:last-child{border-right:0}
.hs-trust svg{width:15px;height:15px;stroke:#1668E3;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:520px){.hs-trust span{border-right:0;padding:2px 14px 2px 0}}
/* títulos y servicios */
h2{background:linear-gradient(90deg,#0B3D91,#1668E3 55%,#7C3AED);-webkit-background-clip:text;background-clip:text;color:transparent!important;display:inline-block}
.chips span{background:#F3F6FB!important;border:1px solid #E1E8F3;color:#26415F;font-weight:600}
/* habitaciones */
.room{background:#fff;border:1px solid #E3E9F2!important;border-radius:16px!important;position:relative;overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s;box-shadow:0 4px 14px rgba(17,40,90,.05)}
.room::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#1668E3,#7C3AED,#E11D48);opacity:0;transition:opacity .2s}
.room:hover,.room.hs-lit{transform:translateY(-2px);box-shadow:0 14px 30px rgba(17,40,90,.12);border-color:#BFD3F5!important}
.room:hover::before,.room.hs-lit::before{opacity:1}
.rp{font-weight:800;letter-spacing:-.02em}
.cta{position:relative;overflow:hidden;background:linear-gradient(90deg,#B3122A,#E11D48 55%,#FF3D5A)!important;box-shadow:0 10px 22px rgba(225,29,72,.32);border-radius:12px!important}
.cta:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(225,29,72,.42)}
.room-pay,.paylater{display:inline-flex;align-items:center;gap:5px;background:#EAF7EF;border-radius:999px;padding:3px 10px}
/* columna de precio */
aside .box{position:sticky;top:16px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #DCE6F5!important;border-radius:20px!important;box-shadow:0 16px 36px rgba(17,40,90,.1);overflow:hidden}
aside .box::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#1668E3,#7C3AED,#E11D48,#F59E0B,#10B981)}
aside .box .price{font-size:30px}
.hs-boxcta{display:block;margin-top:12px;text-align:center;text-decoration:none;color:#fff;font-weight:800;padding:13px;border-radius:12px;background:linear-gradient(90deg,#B3122A,#E11D48 55%,#FF3D5A);box-shadow:0 10px 22px rgba(225,29,72,.32);position:relative;overflow:hidden}
#mapBox{border-radius:18px!important;box-shadow:0 10px 24px rgba(17,40,90,.08)}
.info-grid{background:#fff;border:1px solid #E3E9F2;border-radius:16px;padding:16px 18px}
/* barra fija en celular */
#hsBar{display:none}
@media(max-width:800px){#hsBar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:9000;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid #E3E9F2;box-shadow:0 -10px 24px rgba(17,40,90,.1)}
  #hsBar .p{font:800 19px 'Public Sans',system-ui;color:#0B1B3F}#hsBar small{display:block;font:600 11px system-ui;color:#5A6876}
  #hsBar a{border-radius:12px;padding:12px 20px;font:800 15px system-ui;color:#fff;text-decoration:none;background:linear-gradient(90deg,#B3122A,#E11D48 55%,#FF3D5A);box-shadow:0 8px 18px rgba(225,29,72,.32)}
  footer{padding-bottom:90px!important}}
/* visor de fotos */
#hsLb{position:fixed;inset:0;z-index:100002;background:rgba(5,10,25,.94);display:none;align-items:center;justify-content:center;flex-direction:column}
#hsLb.on{display:flex}#hsLb img{max-width:94vw;max-height:80vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
#hsLb .c{color:#fff;font:700 14px system-ui;margin-top:12px;opacity:.85}
#hsLb button{position:absolute;border:0;border-radius:50%;width:48px;height:48px;background:rgba(255,255,255,.14);color:#fff;font-size:24px;cursor:pointer}
#hsLb .x{top:16px;right:16px}#hsLb .pv{left:14px;top:50%}#hsLb .nx{right:14px;top:50%}
/* entrada suave */
.hs-pre{opacity:0;transform:translateY(16px)}.hs-in{opacity:1;transform:none;transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){.hs-pre{opacity:1;transform:none}.rate::after,.cta::after,.hs-new::after,.hs-cert img,.hs-cert::after{animation:none}}
/* ===== v232 · ruta de navegación (Inicio › Destino › Hotel) con vida ===== */
.crumb{display:flex!important;align-items:center;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:16px 0 10px!important;padding:4px 0 6px}
.crumb::-webkit-scrollbar{display:none}
.crumb .hs-c{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;padding:7px 13px;border-radius:999px;background:#fff;border:1px solid #DCE6F5;
  box-shadow:0 4px 12px rgba(17,40,90,.06);font:700 13px 'Public Sans',system-ui;color:#1D4E9B;text-decoration:none;white-space:nowrap;transition:transform .15s,box-shadow .15s,border-color .15s,background .15s}
.crumb a.hs-c:hover{transform:translateY(-1px);border-color:#1668E3;box-shadow:0 8px 18px rgba(22,104,227,.18);background:linear-gradient(180deg,#fff,#F2F7FF)}
.crumb .hs-c svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.crumb .hs-sep{flex:0 0 auto;display:inline-grid;place-items:center;color:#9AA9C0}
.crumb .hs-sep svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.4}
.crumb .hs-cur{position:relative;overflow:hidden;color:#fff;border:0;background:linear-gradient(90deg,#0B3D91,#1668E3 55%,#7C3AED);box-shadow:0 8px 18px rgba(22,104,227,.3)}
.crumb .hs-cur::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:hsShine 4.2s ease-in-out infinite}
.crumb .hs-c{animation:hsPop .45s cubic-bezier(.2,.7,.2,1) both}
.crumb .hs-c:nth-of-type(2){animation-delay:.08s}.crumb .hs-c:nth-of-type(3){animation-delay:.16s}
@keyframes hsPop{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:none}}
/* foto principal: zoom lento tipo película */
.shots img:first-child,.hs-hero{animation:hsKen 18s ease-in-out infinite alternate;transform-origin:60% 40%}
@keyframes hsKen{from{transform:scale(1)}to{transform:scale(1.07)}}
/* contador de fotos y "copiar enlace" con más presencia */
.hs-shine{position:relative;overflow:hidden}
.hs-shine::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);animation:hsShine 4.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.crumb .hs-c,.crumb .hs-cur::after,.shots img:first-child,.hs-hero,.hs-shine::after{animation:none}}

.crumb.hs-more{-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
/* ===== v233 · botón "Ver todas las fotos" de lujo ===== */
.hs-all{position:relative;overflow:hidden;display:flex!important;align-items:center;justify-content:space-between!important;gap:12px;width:100%;margin:12px 0 0!important;padding:10px 12px 10px 10px!important;
  border:0!important;border-radius:18px!important;color:#fff!important;text-align:left;
  background:linear-gradient(120deg,#0B1B3F,#0B3D91 45%,#1668E3 75%,#7C3AED)!important;box-shadow:0 14px 30px rgba(11,61,145,.32)!important}
.hs-all::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:hsShine 4s ease-in-out infinite}
.hs-all:hover{transform:translateY(-2px)!important;box-shadow:0 18px 36px rgba(11,61,145,.42)!important}
.hs-all:active{transform:scale(.985)!important}
.hs-all .hs-stack{display:flex;flex:0 0 auto}
.hs-all .hs-stack img{width:46px;height:46px;border-radius:12px;object-fit:cover;border:2px solid rgba(255,255,255,.9);box-shadow:0 4px 10px rgba(0,0,0,.25);margin-left:-14px;background:#2B4A86}
.hs-all .hs-stack img:first-child{margin-left:0;transform:rotate(-6deg)}.hs-all .hs-stack img:nth-child(2){transform:translateY(-2px)}.hs-all .hs-stack img:nth-child(3){transform:rotate(6deg)}
.hs-all .hs-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hs-all .hs-txt b{font:800 16px 'Public Sans',system-ui;color:#fff}
.hs-all .hs-txt small{font:600 12.5px 'Public Sans',system-ui;color:rgba(255,255,255,.8)}
.hs-all .hs-go{flex:0 0 auto;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);transition:transform .2s}
.hs-all:hover .hs-go{transform:translateX(3px)}
.hs-all .hs-go svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
/* enlace del hotel y copiar */
.hs-linkpill{border-radius:999px!important;background:#fff!important;border:1px solid #DCE6F5!important;box-shadow:0 4px 12px rgba(17,40,90,.06)}
@media (prefers-reduced-motion:reduce){.hs-all::after{animation:none}}

/* ===== v234 ===== */
/* ruta: en celular se acomoda en renglones, sin esconder el hotel */
/* v237 · en celular: todo en UNA línea, como en la computadora */
.crumb .hs-short{display:none}
@media(max-width:800px){.crumb{flex-wrap:nowrap!important;overflow:hidden!important;gap:4px}.crumb.hs-more{-webkit-mask-image:none!important;mask-image:none!important}
  .crumb .hs-long{display:none}.crumb .hs-short{display:inline}
  .crumb .hs-c{flex:0 0 auto}.crumb .hs-cur{flex:0 1 auto;min-width:0}
  .crumb .hs-cur span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}}
/* insignia a la derecha del nombre */
/* v240 · computadora: la insignia JUNTO al nombre · celular: a la derecha (como ya te gusta) */
h1.hs-hascert .hs-cert{position:relative;margin:-14px 0 -14px 14px;vertical-align:middle}
@media(max-width:800px){
  h1.hs-hascert{padding-right:74px;min-height:0}
  h1.hs-hascert .hs-cert{position:absolute;right:0;top:50%;margin:0;transform:translateY(-58%)}
  h1.hs-hascert .hs-cert img{width:64px}
}
/* v240 · en celular el nombre se ve IGUAL que en la tarjeta del buscador (mismo tamaño y cortes) */
@media(max-width:800px){h1{font-size:26px!important;line-height:1.15!important;font-weight:700!important;letter-spacing:-.01em;padding-bottom:9px}
  h1::after{width:min(160px,55%)}}
/* caja de fechas de la estancia */
.hs-dates{position:relative;border:0!important;border-radius:20px!important;background:#fff!important;box-shadow:0 14px 32px rgba(17,40,90,.10)!important;overflow:hidden;transition:transform .18s,box-shadow .18s}
.hs-dates::before{content:"";position:absolute;inset:0;border-radius:20px;padding:2px;background:linear-gradient(120deg,#1668E3,#7C3AED,#E11D48,#F59E0B);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.hs-dates:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(17,40,90,.14)!important}
.hs-dates .hs-dico{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:10px;margin-right:8px;vertical-align:middle;color:#fff;background:linear-gradient(135deg,#0B3D91,#1668E3)}
.hs-dates .hs-dico.out{background:linear-gradient(135deg,#6D28D9,#E11D48)}
.hs-dates .hs-dico svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hs-dlabel{background:linear-gradient(90deg,#0B3D91,#1668E3 55%,#7C3AED);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.hs-nights{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:#EEF4FF;color:#0B3D91!important;font-weight:700}
@media(max-width:800px){.crumb .hs-c{padding:6px 11px;font-size:12.5px}.crumb a.hs-c:first-child span{display:none}.crumb a.hs-c:first-child{padding:7px 9px}.crumb .hs-sep{margin:0 -2px}}
/* v235 · galería de la página (computadora): zoom suave y brillo al pasar */
.hs-gwrap{overflow:hidden;border-radius:14px}
.hs-gimg{transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .3s;cursor:zoom-in}
.hs-gimg:hover{transform:scale(1.05);filter:saturate(1.15) brightness(1.03)}

/* v238 · nombre de la habitación en la barra de abajo */
#hsBar small .hs-rn{color:#0B3D91;font-weight:800}
#hsBar .p small{max-width:58vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* v241 · nombre grande en celular, ajustado al ancho (deja lugar a la insignia) */
@media(max-width:800px){h1 .hs-h1t{display:inline-block;max-width:100%}}

/* v242 · en celular el título ocupa todo el ancho; la insignia queda a la derecha sin taparlo */
@media(max-width:800px){h1{display:block!important;width:auto!important;max-width:100%!important;box-sizing:border-box;padding-left:0!important;margin-left:0!important;text-indent:0!important}
  h1.hs-hascert{padding-right:78px!important}h1.hs-hascert .hs-cert{right:0!important}}