/* Marble Stays · Entregable 2 — Luxury Property Experience
   Carruseles de colecciones, tarjetas, modal inmersivo, galería y contacto. */

/* ---------- Colecciones: carruseles ---------- */
.col-block{margin-top:74px}
.col-block:first-child{margin-top:58px}
.col-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;border-top:1px solid var(--line);padding-top:26px;margin-bottom:28px}
.col-eyebrow{font-size:9px;letter-spacing:.3em;color:var(--brass);text-transform:uppercase}
.col-title{font:400 clamp(30px,3.1vw,44px)/1.05 var(--serif);color:var(--ivory);margin:10px 0 8px}
.col-text{font-size:13px;line-height:1.8;color:#a79f93;font-weight:300;margin:0;max-width:520px}
.col-nav{display:flex;align-items:center;gap:10px;flex:none}
.col-count{font-size:9px;letter-spacing:.22em;color:#8c7c67;text-transform:uppercase;margin-right:10px;white-space:nowrap}
.car-btn{width:46px;height:46px;border-radius:50%;border:1px solid rgba(217,204,179,.38);background:transparent;color:var(--ivory);font-size:17px;display:grid;place-items:center;cursor:pointer;transition:background .25s,color .25s,border-color .25s,opacity .25s}
.car-btn:hover:not(:disabled){background:var(--brass);border-color:var(--brass);color:#12110e}
.car-btn:disabled{opacity:.28;cursor:default}
.col-nav.no-overflow .car-btn{display:none}
.car-track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px;overscroll-behavior-x:contain}
.car-track::-webkit-scrollbar{display:none}
.car-track:focus-visible{outline:1px solid var(--brass);outline-offset:6px}
.res-card{flex:0 0 clamp(300px,38.5%,620px);scroll-snap-align:start;min-width:0}
.res-photo{display:block;position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#211d19;border:0;padding:0;cursor:pointer;color:#fff}
.res-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.1,1)}
.res-photo:hover img,.res-photo:focus-visible img{transform:scale(1.045)}
.res-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.42),transparent 48%);pointer-events:none}
.res-photo:focus-visible,.portfolio-picture:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.res-explore{position:absolute;right:17px;bottom:17px;z-index:3;font-size:9px;letter-spacing:.2em;border:1px solid rgba(255,255,255,.7);padding:10px 13px;background:rgba(12,10,8,.35);backdrop-filter:blur(4px);transition:background .25s,color .25s,border-color .25s}
.res-photo:hover .res-explore,.portfolio-picture:hover .res-explore{background:var(--brass);border-color:var(--brass);color:#12110e}
.res-wa{display:inline-flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#cdbb9d;padding:14px 0 4px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.res-wa svg{width:13px;height:13px;flex:none}
.res-wa:hover{color:#ecd3a9;border-bottom-color:#6b5b45}
.res-card .portfolio-meta,.portfolio-card .portfolio-meta{margin-top:12px}
.res-name{all:unset;cursor:pointer;font:inherit;color:inherit}
.res-name:hover{color:#e6cfa8}
.res-name:focus-visible{outline:1px solid var(--brass);outline-offset:4px}
button.portfolio-picture{width:100%;border:0;padding:0;cursor:pointer;color:#fff;text-align:left}
.portfolio-open{background:none;border:0;border-bottom:1px solid #6b5b45;cursor:pointer;font-family:inherit}
.portfolio-empty{font:300 30px var(--serif);color:#bfb4a4;padding:40px 0}
@media(max-width:1100px){.res-card{flex-basis:46%}}
@media(max-width:760px){
  .col-block{margin-top:56px}.col-block:first-child{margin-top:40px}
  .col-head{display:block;margin-bottom:22px}
  .col-nav{margin-top:18px;justify-content:space-between}
  .col-count{margin-right:auto}
  .car-track{gap:14px;margin-right:-25px;padding-right:25px;scroll-padding-left:0}
  .res-card{flex-basis:84%}
  .car-btn{width:42px;height:42px}
}

/* ---------- Modal inmersivo ---------- */
.rm{position:fixed;inset:0;z-index:200;display:grid;place-items:center}
.rm[hidden]{display:none}
.rm-backdrop{position:absolute;inset:0;background:rgba(8,7,6,.82);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);opacity:0;transition:opacity .38s ease}
.rm-dialog{position:relative;width:min(94vw,1500px);height:min(92vh,980px);background:#12110f;border:1px solid rgba(217,204,179,.2);box-shadow:0 40px 120px rgba(0,0,0,.65);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(360px,1fr);overflow:hidden;opacity:0;transform:translateY(26px) scale(.985);transition:opacity .42s ease,transform .5s cubic-bezier(.2,.75,.15,1);outline:none}
.rm.is-open .rm-backdrop{opacity:1}
.rm.is-open .rm-dialog{opacity:1;transform:none}
.rm-close{position:absolute;top:16px;right:16px;z-index:12;width:44px;height:44px;border-radius:50%;border:1px solid rgba(217,204,179,.4);background:rgba(13,12,11,.72);backdrop-filter:blur(6px);color:var(--ivory);font:300 24px/1 var(--sans);display:grid;place-items:center;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.rm-close:hover{background:var(--brass);color:#12110e;border-color:var(--brass)}
.rm button:focus-visible,.rm a:focus-visible{outline:2px solid var(--brass);outline-offset:2px}

/* Galería */
.rm-gallery{display:flex;flex-direction:column;min-width:0;min-height:0;background:#0b0a09;border-right:1px solid rgba(217,204,179,.14)}
.rm-tabs{display:flex;flex-wrap:wrap;gap:0 22px;overflow-x:auto;scrollbar-width:none;padding:18px 26px 0;flex:none}
.rm-tabs::-webkit-scrollbar{display:none}
.rm-tab{flex:none;border:0;background:none;color:#857d71;font:400 9.5px var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:10px 0 12px;position:relative;cursor:pointer;white-space:nowrap;transition:color .2s}
.rm-tab small{font-size:8.5px;color:#655d52;margin-left:5px;letter-spacing:.08em}
.rm-tab:after{content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--brass);transition:right .28s}
.rm-tab:hover{color:#d9cdb9}
.rm-tab[aria-selected="true"]{color:#f3eadd}
.rm-tab[aria-selected="true"]:after{right:0}
.rm-stage{position:relative;flex:1;min-height:0;margin:14px 26px 0;overflow:hidden;background:#070605;touch-action:pan-y}
.rm-stage-bg{position:absolute;inset:-40px;background-size:cover;background-position:center;filter:blur(34px) brightness(.5);opacity:.75;transition:background-image .3s}
.rm-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .42s ease;cursor:zoom-in;user-select:none;-webkit-user-drag:none}
.rm-img.is-on{opacity:1}
.rm-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(12,10,8,.5);backdrop-filter:blur(5px);color:#fff;font-size:18px;display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.rm-arrow:hover{background:var(--brass);border-color:var(--brass);color:#12110e}
.rm-arrow.prev{left:16px}.rm-arrow.next{right:16px}
.rm-counter{position:absolute;left:18px;bottom:16px;z-index:4;font-size:10px;letter-spacing:.24em;color:#f4ecdf;background:rgba(12,10,8,.62);padding:8px 11px;backdrop-filter:blur(5px)}
.rm-caption{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:4;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#e9dcc5;background:rgba(12,10,8,.62);padding:8px 12px;backdrop-filter:blur(5px);white-space:nowrap;max-width:60%;overflow:hidden;text-overflow:ellipsis}
.rm-caption:empty{display:none}
.rm-zoom{position:absolute;right:16px;bottom:14px;z-index:4;height:36px;padding:0 13px;border:1px solid rgba(255,255,255,.5);background:rgba(12,10,8,.55);backdrop-filter:blur(5px);color:#fff;font:400 9px var(--sans);letter-spacing:.2em;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .2s,color .2s,border-color .2s}
.rm-zoom:hover{background:var(--brass);border-color:var(--brass);color:#12110e}
.rm-zoom svg{width:12px;height:12px}
.rm-thumbs{display:flex;gap:8px;overflow-x:auto;padding:14px 26px 20px;flex:none;scrollbar-width:thin;scrollbar-color:#3a332b transparent}
.rm-thumbs::-webkit-scrollbar{height:4px}.rm-thumbs::-webkit-scrollbar-thumb{background:#3a332b}
.rm-thumb{flex:none;width:92px;height:64px;padding:0;border:1px solid transparent;background:#1a1714;cursor:pointer;opacity:.5;transition:opacity .2s,border-color .2s;overflow:hidden}
.rm-thumb span{display:block;width:100%;height:100%;background-repeat:no-repeat}
.rm-thumb:hover{opacity:.85}
.rm-thumb[aria-current="true"]{opacity:1;border-color:var(--brass)}

/* Información */
.rm-info{display:flex;flex-direction:column;min-width:0;min-height:0}
.rm-scroll{flex:1;min-height:0;overflow-y:auto;padding:54px clamp(26px,3vw,46px) 30px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#3a332b transparent}
.rm-eyebrow{font-size:9px;letter-spacing:.28em;color:var(--brass);text-transform:uppercase;padding-right:50px;line-height:1.8}
.rm-title{font:300 clamp(36px,3.5vw,54px)/1.02 var(--serif);letter-spacing:-.015em;color:var(--ivory);margin:14px 0 10px}
.rm-sub{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#a89c8a;margin:0}
.rm-rating{margin:16px 0 0;font-size:12.5px;color:#c8a97b}
.rm-rating small{font-size:11px;color:#a49a89;margin-left:6px}
.rm-rating.is-new{color:#a49a89;font-size:11px;letter-spacing:.08em}
.rm-desc{font-size:14px;line-height:1.95;color:#bdb5a8;font-weight:300;margin:22px 0 0}
.rm-specs{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:28px 0 0}
.rm-spec{background:#12110f;padding:16px 10px;text-align:center}
.rm-spec b{display:block;font:300 30px/1 var(--serif);color:var(--ivory)}
.rm-spec span{display:block;font-size:8.5px;letter-spacing:.2em;color:#948a7c;text-transform:uppercase;margin-top:8px}
.rm-section{margin-top:36px;padding-top:26px;border-top:1px solid var(--line)}
.rm-h{font:400 23px/1.15 var(--serif);color:var(--ivory);margin:0 0 4px}
.rm-h-note{font-size:9px;letter-spacing:.2em;color:#8c7c67;text-transform:uppercase;margin:0 0 16px}
.rm-amen{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.rm-amen li{display:flex;align-items:center;gap:11px;font-size:12.5px;color:#cfc7ba;font-weight:300;line-height:1.4}
.rm-amen svg{width:19px;height:19px;flex:none;color:var(--brass)}
.rm-list{list-style:none;margin:14px 0 0;padding:0}
.rm-list li{font-size:12.5px;color:#cfc7ba;font-weight:300;padding:9px 0;border-bottom:1px solid rgba(217,204,179,.09);line-height:1.5}
.rm-list li:last-child{border-bottom:0}
.rm-list li b{font-weight:400;color:#e8dfd0}
.rm-small{font-size:11.5px;line-height:1.8;color:#8f8679;font-weight:300;margin:14px 0 0}
.rm-address{font-size:14px;color:#e8dfd0;margin:14px 0 4px;line-height:1.6}
.rm-foot{font-size:10.5px;line-height:1.8;color:#7c7468;margin:32px 0 0}
.rm-cta{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px clamp(26px,3vw,46px) 20px;border-top:1px solid var(--line);background:#12110f}
.rm-btn{display:flex;align-items:center;justify-content:center;gap:10px;text-align:center;font-size:9.5px;font-weight:500;letter-spacing:.19em;text-transform:uppercase;padding:17px 12px;border:1px solid var(--brass);transition:background .25s,color .25s,border-color .25s;line-height:1.3}
.rm-btn svg{width:15px;height:15px;flex:none}
.rm-btn.primary{background:var(--brass);color:#12110e}
.rm-btn.primary:hover{background:#d8ba8e;border-color:#d8ba8e}
.rm-btn.ghost{color:#ecdcc1;background:transparent}
.rm-btn.ghost:hover{background:rgba(184,156,114,.16)}

/* Ampliación (lightbox) */
.rm-lightbox{position:fixed;inset:0;z-index:30;background:#060505;display:grid;place-items:center}
.rm-lightbox[hidden]{display:none}
.rm-lightbox img{max-width:92vw;max-height:90vh;touch-action:pinch-zoom;object-fit:contain;user-select:none;-webkit-user-drag:none}
.rm-lb-close{position:absolute;top:18px;right:18px;z-index:2}
.rm-lb-counter{position:absolute;top:28px;left:26px;font-size:10px;letter-spacing:.24em;color:#e9dcc5}
.rm-lightbox .rm-arrow.prev{left:20px}.rm-lightbox .rm-arrow.next{right:20px}

/* Estado de página con modal abierto */
body.rm-open{position:fixed;left:0;right:0;width:100%;overflow:hidden}
body.rm-open .whatsapp-float{opacity:0;visibility:hidden;pointer-events:none}
.whatsapp-float{transition:background .2s,transform .2s,opacity .25s,visibility .25s}

@media(max-width:1180px){.rm-dialog{grid-template-columns:minmax(0,1.25fr) minmax(340px,1fr)}.rm-amen{grid-template-columns:1fr}}
@media(max-width:900px){
  .rm{place-items:stretch}
  .rm-dialog{width:100%;height:100%;max-height:none;border:0;display:block;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;transform:translateY(40px)}
  .rm-close{position:fixed;top:12px;right:12px}
  .rm-gallery{border-right:0;display:block}
  .rm-tabs{flex-wrap:nowrap;padding:16px 18px 0;margin-right:62px;gap:0 20px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .rm-stage{margin:10px 0 0;height:auto;aspect-ratio:4/3;flex:none}
  .rm-arrow{width:42px;height:42px}.rm-arrow.prev{left:10px}.rm-arrow.next{right:10px}
  .rm-counter{left:12px;bottom:12px}.rm-zoom{right:12px;bottom:10px}
  .rm-caption{bottom:auto;top:12px;max-width:80%}
  .rm-thumbs{padding:10px 18px 14px}
  .rm-thumb{width:74px;height:54px}
  .rm-info{display:block}
  .rm-scroll{overflow:visible;padding:26px 22px 30px}
  .rm-eyebrow{padding-right:0}
  .rm-amen{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rm-cta{position:sticky;bottom:0;z-index:8;padding:12px 14px calc(12px + env(safe-area-inset-bottom));gap:8px;box-shadow:0 -14px 30px rgba(0,0,0,.45)}
  .rm-btn{padding:15px 8px;font-size:9px;letter-spacing:.14em}
  .rm-spec{padding:14px 4px}.rm-spec b{font-size:26px}.rm-spec span{font-size:8px;letter-spacing:.1em}
  .rm-specs[data-n="5"]{grid-template-columns:repeat(6,minmax(0,1fr))}
  .rm-specs[data-n="5"] .rm-spec{grid-column:span 2}
  .rm-specs[data-n="5"] .rm-spec:nth-child(n+4){grid-column:span 3}
  .rm-lightbox img{max-width:100vw;max-height:80vh}
}
@media(max-width:420px){.rm-amen{grid-template-columns:1fr}.rm-btn svg{display:none}}
@media(prefers-reduced-motion:reduce){
  .rm-backdrop,.rm-dialog,.rm-img,.res-photo img,.rm-stage-bg{transition:none!important}
  .rm-dialog{transform:none}
  .car-track{scroll-behavior:auto}
}

/* ---------- Ajustes: flecha propia (no depende del emoji del sistema), WhatsApp más claro ---------- */
.arr{display:inline-block;width:.95em;height:.95em;margin-left:.5em;vertical-align:-.12em;flex:none;background:var(--brass);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 18.5 18.5 5.5M8 5.5h10.5V16'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 18.5 18.5 5.5M8 5.5h10.5V16'/%3E%3C/svg%3E") center/contain no-repeat}
.btn-gold .arr,.book-link .arr,.experience-item .arr{margin-left:0}
.btn-gold .arr,.book-link .arr,.res-photo:hover .res-explore .arr,.portfolio-picture:hover .res-explore .arr{background:#12110e}
.destination .btn-gold .arr,.concierge-btn .arr{background:#d8bd90}
.experience-item .arr{width:15px;height:15px}
a.host-mark{width:fit-content;margin-left:auto;transition:border-color .2s,color .2s,background .2s}
a.host-mark:hover,a.host-mark:focus-visible{border-color:var(--brass);color:#f0dab4;background:rgba(184,156,114,.1)}
.wa-ico{width:1em;height:1em;flex:none;display:block;--cut:#12110f}
.wa-b{fill:currentColor}
.wa-h,.wa-e{fill:none;stroke:var(--cut);stroke-linecap:round}
.wa-h{stroke-width:1.7}.wa-e{stroke-width:3.3}
.whatsapp-float{gap:11px;padding:12px 18px 12px 14px;font-size:10px;font-weight:600;letter-spacing:.16em}
.whatsapp-float .wa-ico{font-size:27px;--cut:#b89c72}
.whatsapp-float:hover .wa-ico{--cut:#dac09a}
.res-wa .wa-ico{font-size:17px;width:17px;height:17px;color:var(--brass)}
.rm-btn .wa-ico{font-size:19px;width:19px;height:19px}
@media(max-width:1100px){.reviews-stat a.host-mark{margin-left:0}}
@media(max-width:760px){.whatsapp-float{padding:13px;width:56px;height:56px}.whatsapp-float .wa-ico{font-size:30px}}
/* Portada: póster vertical en móvil (el video vertical se asigna en el script de la portada) */
@media(max-width:500px){.hero-photo{background-image:url("../media/hero-poster-mobile.jpg")!important;background-position:center!important}}