/* ===== Escotel stays (week 3): cards, catalog toolbar, pager, empty state, lightbox ===== */
:root{--st-r:22px;--st-line:rgba(15,23,43,.09);--st-ink:#0F172B;--st-mute:#5b6475;--st-ease:cubic-bezier(.2,.7,.2,1)}

/* section heads */
.st-section{padding:96px 0 104px;position:relative}
.st-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px;flex-wrap:wrap}
.st-head .bx-h2{margin:10px 0 0}
.st-head p{color:var(--st-mute);margin:12px 0 0;max-width:520px;font-size:1.02rem}
.st-head-center{flex-direction:column;align-items:center;text-align:center}
.st-head-center .mx-kicker{justify-content:center}
.st-more{flex-shrink:0}

/* grid */
.st-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}

/* card */
.st-card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:var(--st-r);border:1px solid var(--st-line);box-shadow:0 1px 2px rgba(15,23,43,.04),0 10px 30px -18px rgba(15,23,43,.25);overflow:hidden;opacity:0;transform:translateY(28px);transition:opacity .7s var(--st-ease),transform .7s var(--st-ease),box-shadow .35s,border-color .35s;transition-delay:var(--d,0ms),var(--d,0ms),0s,0s}
.st-card.is-in{opacity:1;transform:none}
.st-card.is-in:hover{transform:translateY(-6px);box-shadow:0 2px 4px rgba(15,23,43,.05),0 28px 50px -24px rgba(15,23,43,.38);border-color:rgba(234,121,39,.35);transition-delay:0s}
.st-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#e9e4dc}
.st-open{all:unset;display:block;position:absolute;inset:0;cursor:zoom-in}
.st-open:focus-visible{outline:3px solid var(--primary);outline-offset:-3px}
.st-track{position:absolute;inset:0;display:block}
.st-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .55s ease,transform 1.2s var(--st-ease)}
.st-img.is-on{opacity:1;transform:scale(1)}
.st-card:hover .st-img.is-on{transform:scale(1.06)}
.st-media::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(0deg,rgba(15,23,43,.55),rgba(15,23,43,0));pointer-events:none}
.st-badge{position:absolute;top:14px;left:14px;z-index:2;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);color:var(--st-ink);font-size:12px;font-weight:700;letter-spacing:.4px;box-shadow:0 4px 14px rgba(15,23,43,.15);pointer-events:none}
.st-badge::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--primary);margin-right:7px;vertical-align:1px}
.st-tour{position:absolute;top:14px;right:14px;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;background:rgba(15,23,43,.62);backdrop-filter:blur(6px);color:#fff !important;font-size:12px;font-weight:600;text-decoration:none;transition:background .25s,transform .25s var(--st-ease)}
.st-tour:hover{background:var(--primary);transform:translateY(-1px)}
.st-nav{position:absolute;top:50%;z-index:3;width:38px;height:38px;margin-top:-19px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--st-ink);font-size:13px;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(15,23,43,.2);opacity:0;transition:opacity .25s,transform .25s var(--st-ease),background .2s,color .2s;cursor:pointer}
.st-prev{left:12px;transform:translateX(-6px)}.st-next{right:12px;transform:translateX(6px)}
.st-media:hover .st-nav,.st-nav:focus-visible{opacity:1;transform:none}
.st-nav:hover{background:var(--primary);color:#fff}
.st-nav:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.st-dots{position:absolute;left:0;right:0;bottom:14px;z-index:2;display:flex;justify-content:center;gap:6px;pointer-events:none}
.st-dots span{width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.55);transition:width .3s var(--st-ease),background .3s}
.st-dots span.on{width:20px;background:#fff}
.st-count{position:absolute;right:14px;bottom:11px;z-index:2;color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;gap:6px;pointer-events:none;opacity:.9}

.st-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.st-title{font-size:1.22rem !important;font-weight:700;line-height:1.25;color:var(--st-ink);margin:0 0 6px;letter-spacing:-.2px;transition:color .25s}
.st-card:hover .st-title{color:var(--primary)}
.st-loc{display:flex;gap:8px;align-items:flex-start;color:var(--st-mute);font-size:.9rem;line-height:1.45;margin:0 0 16px}
.st-loc i{color:var(--primary);margin-top:3px;font-size:13px}
.st-specs{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-wrap:wrap;gap:8px}
.st-specs li{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:var(--mx-cream,#f6efe6);color:var(--mx-brown,#3d2e1f);font-size:.8rem;font-weight:600}
.st-specs i{color:var(--primary);font-size:12px}
.st-book{margin-top:auto;padding-top:16px;border-top:1px dashed var(--st-line)}
.st-book-label{display:block;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--st-mute);margin-bottom:9px}
.st-otas{display:flex;flex-wrap:wrap;gap:8px}
.st-ota{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 10px;border-radius:12px;border:1px solid var(--st-line);background:#fff;color:var(--st-ink) !important;font-size:.8rem;font-weight:600;text-decoration:none;white-space:nowrap;transition:border-color .2s,transform .2s var(--st-ease),box-shadow .2s}
.st-ota img{width:18px;height:18px;object-fit:contain;flex-shrink:0}
.st-ota span{overflow:hidden;text-overflow:ellipsis}
.st-ota:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 8px 18px -10px rgba(234,121,39,.6)}
.st-wa{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 18px;border-radius:14px;background:var(--primary);color:#fff !important;font-weight:600;font-size:.95rem;text-decoration:none;box-shadow:0 10px 22px -10px rgba(234,121,39,.75);transition:transform .25s var(--st-ease),box-shadow .25s,background .25s}
.st-wa .fa-whatsapp{font-size:18px}
.st-wa-arrow{font-size:12px;transition:transform .25s var(--st-ease)}
.st-wa:hover{transform:translateY(-2px);background:#f0852f;box-shadow:0 14px 28px -10px rgba(234,121,39,.85)}
.st-wa:hover .st-wa-arrow{transform:translateX(4px)}
.st-book+.st-wa{margin-top:12px}
.st-body>.st-specs+.st-wa{margin-top:auto}

/* toolbar */
.st-toolbar{position:relative;z-index:5;margin:-62px auto 34px;max-width:1080px;background:#fff;border-radius:24px;box-shadow:0 24px 60px -28px rgba(15,23,43,.35),0 2px 6px rgba(15,23,43,.05);border:1px solid var(--st-line);padding:18px}
.st-row{display:flex;gap:12px;align-items:stretch}
.st-search{flex:1;position:relative;margin:0}
.st-search i{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--primary);pointer-events:none}
.st-search input{width:100%;height:54px;border-radius:16px;border:1px solid var(--st-line);background:#faf8f5;padding:0 18px 0 48px;font-size:1rem;color:var(--st-ink);transition:border-color .2s,box-shadow .2s,background .2s;-webkit-appearance:none;appearance:none}
.st-search input::placeholder{color:#8a91a0}
.st-search input:focus{outline:0;border-color:var(--primary);background:#fff;box-shadow:0 0 0 4px rgba(234,121,39,.15)}
.st-select{position:relative;flex:0 0 220px}
.st-select select{width:100%;height:54px;border-radius:16px;border:1px solid var(--st-line);background:#faf8f5;padding:0 42px 0 18px;font-size:.95rem;font-weight:600;color:var(--st-ink);-webkit-appearance:none;appearance:none;cursor:pointer}
.st-select::after{content:"\f078";font-family:"Font Awesome 5 Free";font-weight:900;font-size:11px;position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--primary);pointer-events:none}
.st-select select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 4px rgba(234,121,39,.15)}
.st-chips{display:flex;gap:8px;margin-top:14px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px}
.st-chips::-webkit-scrollbar{display:none}
.st-chip{flex-shrink:0;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid var(--st-line);background:#fff;color:var(--st-ink);font-size:.86rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s var(--st-ease)}
.st-chip span{font-size:11px;font-weight:700;min-width:22px;padding:2px 7px;border-radius:999px;background:var(--mx-cream,#f6efe6);color:var(--mx-brown,#3d2e1f);transition:inherit}
.st-chip:hover{border-color:var(--primary);transform:translateY(-1px)}
.st-chip.on{background:var(--st-ink);border-color:var(--st-ink);color:#fff}
.st-chip.on span{background:var(--primary);color:#fff}
.st-chip:focus-visible,.st-pg:focus-visible,.st-clear:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.st-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 auto 22px;max-width:100%;min-height:28px;color:var(--st-mute);font-size:.95rem}
.st-meta strong{color:var(--st-ink)}
.st-clear{border:0;background:none;color:var(--primary);font-weight:600;font-size:.9rem;padding:4px 0;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.st-clear:hover{text-decoration:underline}

/* pager */
.st-pager{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.st-pg{min-width:46px;height:46px;padding:0 12px;border-radius:14px;border:1px solid var(--st-line);background:#fff;color:var(--st-ink);font-weight:700;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s var(--st-ease)}
.st-pg:hover:not(:disabled){border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}
.st-pg.on{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 10px 22px -10px rgba(234,121,39,.8)}
.st-pg:disabled{opacity:.35;cursor:default}
#pagination-container{margin-top:48px !important}

/* empty / error */
.st-empty{grid-column:1/-1;text-align:center;padding:64px 24px;border-radius:var(--st-r);border:1px dashed rgba(234,121,39,.45);background:linear-gradient(180deg,#fffaf5,#fff)}
.st-empty-ic{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--mx-cream,#f6efe6);color:var(--primary);font-size:24px;animation:st-float 3s ease-in-out infinite}
.st-empty h3{font-size:1.4rem;color:var(--st-ink);margin-bottom:8px}
.st-empty p{color:var(--st-mute);max-width:440px;margin:0 auto 22px}
.st-empty-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.st-empty-btns .mx-btn{border:0;padding:13px 24px}
.st-wa-inline{margin-top:0;display:inline-flex;padding:13px 24px;border-radius:999px;background:var(--st-ink);box-shadow:none}
.st-wa-inline:hover{background:#1c2742}
.st-error{grid-column:1/-1;text-align:center;color:var(--st-mute);padding:40px 0}
@keyframes st-float{50%{transform:translateY(-6px)}}

/* lightbox */
.st-lb{position:fixed;inset:0;z-index:2000;background:rgba(10,14,26,.94);display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.st-lb.is-open{opacity:1;visibility:visible}
html.st-lock,html.st-lock body{overflow:hidden}
.st-lb-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 22px;color:#fff}
.st-lb-title{font-size:1.05rem;margin-right:12px}
.st-lb-count{font-size:.85rem;color:rgba(255,255,255,.65)}
.st-lb-close{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;font-size:16px;cursor:pointer;transition:background .2s}
.st-lb-close:hover{background:var(--primary);border-color:var(--primary)}
.st-lb-stage{flex:1;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;padding:0 72px}
.st-lb-img{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px;opacity:0;transform:scale(.97)}
.st-lb-img.is-in{animation:st-lbin .45s var(--st-ease) forwards}
@keyframes st-lbin{to{opacity:1;transform:none}}
.st-lb-nav{position:absolute;top:50%;margin-top:-26px;width:52px;height:52px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:16px;cursor:pointer;transition:background .2s}
.st-lb-nav:hover{background:var(--primary)}
.st-lb-prev{left:14px}.st-lb-next{right:14px}
.st-lb-thumbs{display:flex;justify-content:center;gap:8px;padding:16px 16px 22px;overflow-x:auto}
.st-lb-thumbs button{flex-shrink:0;width:74px;height:54px;padding:0;border-radius:10px;overflow:hidden;border:2px solid transparent;background:none;opacity:.5;cursor:pointer;transition:opacity .2s,border-color .2s}
.st-lb-thumbs button.on,.st-lb-thumbs button:hover{opacity:1;border-color:var(--primary)}
.st-lb-thumbs img{width:100%;height:100%;object-fit:cover}
.st-lb button:focus-visible{outline:3px solid var(--primary);outline-offset:2px}

/* catalog page: hide the old empty space */
.st-catalog{min-height:0 !important;margin-bottom:0 !important}

/* responsive */
@media (min-width:1800px){.st-grid{gap:34px}.st-section .container{max-width:1500px}}
@media (min-width:2200px){.st-section .container{max-width:1720px}.st-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1199.98px){.st-grid{gap:22px}.st-body{padding:18px 18px 20px}}
@media (max-width:991.98px){
  .st-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-section{padding:72px 0 80px}
  .st-nav{opacity:1;transform:none;width:34px;height:34px;margin-top:-17px}
  .st-toolbar{margin-top:-48px}
}
@media (max-width:767.98px){
  .st-head{margin-bottom:28px}
  .st-row{flex-direction:column;gap:10px}
  .st-select{flex:0 0 auto}
  .st-toolbar{padding:14px;border-radius:20px;margin:-40px 0 26px}
  .st-chips{margin:12px -14px 0;padding:2px 14px}
  .st-lb-stage{padding:0 8px}
  .st-lb-nav{width:42px;height:42px;margin-top:-21px;background:rgba(15,23,43,.55)}
  .st-lb-prev{left:10px}.st-lb-next{right:10px}
}
@media (max-width:639.98px){
  .st-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .st-section{padding:60px 0 68px}
  .st-more{width:100%}.st-more .mx-btn{width:100%}
  .st-search input,.st-select select{height:50px;font-size:16px}
  .st-meta{font-size:.88rem}
}
@media (max-width:359.98px){
  .st-body{padding:16px 15px 18px}
  .st-ota{padding:9px 6px;font-size:.74rem;gap:5px}
  .st-ota img{width:15px;height:15px}
  .st-specs li{padding:5px 9px;font-size:.76rem}
}
@media (hover:none){.st-nav{opacity:1;transform:none}.st-card:hover .st-img.is-on{transform:none}}
@media (prefers-reduced-motion:reduce){
  .st-card{opacity:1;transform:none;transition:none}
  .st-img,.st-lb-img{transition:none;animation:none;opacity:1}
  .st-img:not(.is-on){opacity:0}
  .st-empty-ic{animation:none}
}
.st-clear[hidden],.st-lb-nav[hidden]{display:none !important}
/* week-3 polish */
.st-tour i,.st-tour i.fa-instagram{color:#fff !important;background:none !important;font-size:13px;width:auto;height:auto;line-height:1;margin:0;padding:0;border:0;box-shadow:none;transform:none}
.st-tour:hover i{color:#fff !important}
.mx-page-header.st-has-toolbar .page-header-inner{padding-bottom:104px !important}
@media (min-width:768px){.st-chips{flex-wrap:wrap;overflow:visible}}
@media (max-width:767.98px){.mx-page-header.st-has-toolbar .page-header-inner{padding-bottom:76px !important}}
@media (max-width:639.98px){
  .st-ota{flex-direction:column;gap:5px;padding:9px 4px 8px;font-size:.72rem;border-radius:12px}
  .st-ota img{width:20px;height:20px}
}
[data-st-total]:empty{display:none}

/* Instagram official embed */
.ig-embed-wrap{position:relative;width:100%;min-height:520px;border-radius:12px;overflow:hidden;background:#faf5ef}
.ig-embed-wrap iframe{display:block;width:100%;min-height:520px;height:560px;border:0;border-radius:12px;background:#fff}
.ig-noscript{margin:0 0 12px;text-align:center;color:#6c757d;font-size:.95rem}
.ig-fallback{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ig-fallback a{display:block;aspect-ratio:1/1;border-radius:10px;overflow:hidden}
.ig-fallback img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:991.98px){
  .ig-embed-wrap{min-height:420px;border-radius:10px}
  .ig-embed-wrap iframe{min-height:420px;height:480px;border-radius:10px}
  .ig-fallback{grid-template-columns:repeat(2,minmax(0,1fr))}
}