/* ==========================================================================
   Casa Milagros — piezas de la plataforma vestidas con el diseño original.
   Usa solo los tokens de site.css (arena, piedra, laguna, selva, cedro…).
   ========================================================================== */

/* Chat de la plataforma con los tokens de la casa */
:root{
  --annwn-chat-font:var(--sans);
  --annwn-chat-surface:var(--arena);
  --annwn-chat-incoming:var(--blanco);
  --annwn-chat-text:var(--selva);
  --annwn-chat-muted:var(--laguna-p);
  --annwn-chat-border:var(--piedra);
  --annwn-chat-accent:var(--selva);
  --annwn-chat-on-accent:var(--blanco);
  --annwn-chat-radius:20px;
  --annwn-chat-shadow:0 18px 50px -22px rgba(30,51,40,.45);
}

/* ===== Nav: idioma como enlaces + acceso a la reserva ===== */
.nav .lang a,.nav .lang span{display:inline-flex;align-items:center;padding:6px 7px;border-radius:6px;opacity:.55;min-height:32px;text-decoration:none;color:inherit}
.nav .lang a:hover{opacity:1}
.nav .lang [aria-current="true"]{opacity:1;font-weight:600;text-decoration:underline;text-underline-offset:4px}
.nav .cartl{display:inline-flex;align-items:center;gap:8px;font:500 calc(var(--u)*15)/1.3 var(--sans);text-decoration:none;white-space:nowrap}
.nav .cartl:hover{text-decoration:underline;text-underline-offset:4px}
.nav .cartl .badge{background:var(--cedro);color:var(--blanco)}
.nav[data-tone="light"] .cartl .badge{background:var(--blanco);color:var(--cedro)}
.btn .badge{margin-left:2px}
.badge-slot:empty{display:none}

/* ===== Buscador del hero: campos que abren nuestros selectores ===== */
.bk{position:relative}
.bk button.field{border:0;text-align:left;font:inherit;color:inherit;cursor:pointer;width:100%}
.bk button.field[aria-expanded="true"]{box-shadow:inset 0 0 0 1.5px var(--selva)}
.bk .flab{font:500 11px var(--sans);color:var(--laguna-p);text-transform:uppercase;letter-spacing:.08em}
.bk .fval{font:500 15px var(--sans);color:var(--selva);min-height:28px;padding:2px 0;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk select{appearance:none;-webkit-appearance:none;cursor:pointer}
/* the same cues the original native controls showed: a calendar icon on the dates, a chevron on guests */
.bk button.field .fval{justify-content:space-between;gap:8px}
.bk button.field[data-pop="dates"] .fval::after{content:"";flex:none;width:14px;height:14px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231E3328' stroke-width='1.6'%3E%3Crect x='2' y='3' width='12' height='11' rx='1.5'/%3E%3Cpath d='M2 6.5h12M5.5 1.5v3M10.5 1.5v3'/%3E%3C/svg%3E")}
.bk button.field[data-pop="guests"] .fval::after{content:"";flex:none;width:12px;height:12px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%231E3328' stroke-width='1.6'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E")}
.bk-pop{position:absolute;z-index:20;left:0;right:0;bottom:calc(100% + 10px);margin:0 auto;width:min(380px,100%);background:var(--blanco);border-radius:20px;padding:16px;box-shadow:0 22px 60px -20px rgba(30,51,40,.45);text-align:left}
.bk-pop .mcal{background:var(--arena)}
.bk-pop .step:first-child{border-top:0}
@media (min-width:1024px){
  .bk-pop[data-pop-panel="dates"]{left:18%;right:auto}
  .bk-pop[data-pop-panel="guests"]{left:auto;right:12%}
}

/* ===== Calendario (date picker de la plataforma) con el look de .mcal =====
   Solo aspecto (colores, tipo, tamaños, radios); la disposición es la de vanilla-calendar-pro.
   Los selectores llevan .mcal .mc para ganar a los estilos por atributo del calendario. */
.mcal .mc{font:500 max(13px,calc(var(--u)*13)) var(--sans);color:var(--selva);background:transparent;border:0;border-radius:0;padding:0;min-width:0;width:100%;box-shadow:none}
.mcal .mc .mc-head{margin:0 calc(var(--u)*6) calc(var(--u)*10)}
.mcal .mc .mc-month,.mcal .mc .mc-year{border:0;background:none;padding:0 2px;font:600 max(15px,calc(var(--u)*15)) var(--sans);text-transform:capitalize;color:var(--selva);cursor:pointer}
.mcal .mc .mc-month:hover,.mcal .mc .mc-year:hover{color:var(--laguna-p)}
.mcal .mc .mc-prev,.mcal .mc .mc-next{width:max(30px,calc(var(--u)*30));height:max(30px,calc(var(--u)*30));border-radius:50%;border:0;background:var(--blanco);color:var(--selva);cursor:pointer;padding:0}
.mcal.mcal-in .mc .mc-prev,.mcal.mcal-in .mc .mc-next{background:var(--blanco)}
.bk-pop .mcal .mc .mc-prev,.bk-pop .mcal .mc .mc-next,.xform .mcal .mc .mc-prev,.xform .mcal .mc .mc-next{background:var(--blanco)}
.mcal .mc .mc-prev::before,.mcal .mc .mc-next::before{content:"‹";position:absolute;inset:0;transform:none;background:none;display:grid;place-items:center;font:400 18px/1 var(--sans);color:var(--selva)}
.mcal .mc .mc-next::before{content:"›"}
.mcal .mc .mc-prev:disabled,.mcal .mc .mc-next:disabled,.mcal .mc [data-vc-arrow][data-vc-arrow-disabled]{opacity:.3;cursor:default}
.mcal .mc .mc-wd{font:500 max(12px,calc(var(--u)*12)) var(--sans);color:var(--laguna-p);text-align:center;padding-bottom:calc(var(--u)*6);text-transform:capitalize}
.mcal .mc .mc-d{padding:1px 0}
.mcal .mc .mc-d .mc-btn{width:max(32px,calc(var(--u)*34));height:max(32px,calc(var(--u)*34));min-width:0;min-height:0;margin:0 auto;border:0;border-radius:50%;background:none;padding:0;font:500 max(13px,calc(var(--u)*13))/1 var(--sans);color:var(--selva);cursor:pointer;transition:background-color .2s,color .2s}
.mcal .mc .mc-d .mc-btn:hover{background:var(--piedra)}
.mcal .mc .mc-num{line-height:1}
.mcal .mc .mc-price{display:block;font:500 9px/1 var(--sans);color:var(--laguna-p);margin-top:1px}
/* estados: clases de la plataforma (en la celda o en el botón) y atributos de vanilla-calendar */
.mcal .mc .mc-d.is-in .mc-btn,.mcal .mc .mc-d .mc-btn.is-in,.mcal .mc .mc-d[data-vc-date-selected="middle"] .mc-btn,.mcal .mc .mc-d[data-vc-date-hover] .mc-btn{background:var(--piedra);color:var(--selva)}
.mcal .mc .mc-d.is-start .mc-btn,.mcal .mc .mc-d .mc-btn.is-start,.mcal .mc .mc-d.is-end .mc-btn,.mcal .mc .mc-d .mc-btn.is-end,
.mcal .mc .mc-d[data-vc-date-selected="first"] .mc-btn,.mcal .mc .mc-d[data-vc-date-selected="last"] .mc-btn,.mcal .mc .mc-d[data-vc-date-selected="first-and-last"] .mc-btn,
.mcal .mc .mc-d[data-vc-date-hover="first"] .mc-btn,.mcal .mc .mc-d[data-vc-date-hover="last"] .mc-btn{background:var(--cedro);color:#fff}
.mcal .mc .mc-d.is-start .mc-price,.mcal .mc .mc-d.is-end .mc-price,.mcal .mc .mc-btn.is-start .mc-price,.mcal .mc .mc-btn.is-end .mc-price{color:#fff}
.mcal .mc .mc-d.is-today .mc-btn,.mcal .mc .mc-d .mc-btn.is-today,.mcal .mc .mc-d[data-vc-date-today] .mc-btn{text-decoration:underline;text-underline-offset:3px;font-weight:600}
.mcal .mc .mc-d.is-no .mc-btn,.mcal .mc .mc-d .mc-btn.is-no,.mcal .mc .mc-d .mc-btn[data-annwn-day="unavailable"],.mcal .mc .mc-d[data-vc-date-disabled] .mc-btn{opacity:.3;cursor:not-allowed;background:none;color:var(--selva)}
.mcal .mc .mc-d.is-sold .mc-btn,.mcal .mc .mc-d .mc-btn.is-sold,.mcal .mc .mc-d .mc-btn[data-annwn-day="sold-out"]{color:var(--tapete);text-decoration:line-through;opacity:.7;cursor:not-allowed;background:none}
.mcal .mc .mc-d[data-vc-date-month="prev"] .mc-btn,.mcal .mc .mc-d[data-vc-date-month="next"] .mc-btn{visibility:hidden}
.mcal .mc .mc-mm,.mcal .mc .mc-yy{border:0;background:none;border-radius:999px;padding:8px 4px;font:500 13px var(--sans);color:var(--selva);text-transform:capitalize;cursor:pointer}
.mcal .mc .mc-mm:hover,.mcal .mc .mc-yy:hover{background:var(--piedra)}
.mcal .mc .mc-mm[data-vc-months-month-selected],.mcal .mc .mc-yy[data-vc-years-year-selected]{background:var(--selva);color:var(--blanco)}
/* días de la estancia en el calendario de una experiencia */
.mcal .mc .mc-d.is-stay .mc-btn,.mcal .mc .mc-d .mc-btn.is-stay,.mcal .mc .mc-d .mc-btn[data-annwn-stay],.mcal .mc .mc-d[data-annwn-stay] .mc-btn{box-shadow:inset 0 0 0 1.5px var(--laguna-p)}
.is-warn{color:var(--tapete)!important}
.mcal .mc-hint{margin-top:8px}
/* el calendario de una experiencia vive en una tarjeta blanca: fondo arena como en la hoja original */
.xform .mcal{background:var(--arena);padding:16px 14px 12px;border-radius:16px}

/* ===== Selector de huéspedes (pasos de la hoja original) ===== */
.ctl output,.ctl .num{min-width:22px;text-align:center;font:600 16px var(--sans);color:var(--selva)}
.ctl .num{width:44px;border:0;background:transparent;-moz-appearance:textfield;appearance:textfield;padding:0}
.ctl .num::-webkit-outer-spin-button,.ctl .num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ctl button.is-off{opacity:.25;cursor:not-allowed}
.cap.is-warn{color:var(--tapete)}
.step b{font:500 16px var(--sans)}
/* versión compacta dentro de la tarjeta de reserva */
.cg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 calc(var(--u)*20)}
.cg .step{padding:calc(var(--u)*10) 0}
.cg .step b{font-size:max(14px,calc(var(--u)*15))}
.cg .step small{font-size:max(12px,calc(var(--u)*12))}
.cg .ctl{gap:10px}.cg .ctl button{width:34px;height:34px;font-size:16px}
.cg .cap{grid-column:1/-1;margin-top:2px}
.card form{display:flex;flex-direction:column;gap:calc(var(--u)*14);position:relative}
.cgbtn{width:100%;border:0;background:none;padding:calc(var(--u)*4) 0;cursor:pointer;font-family:var(--sans);color:var(--selva);text-align:left}
.cgbtn i{font-style:normal;font-size:.8em;color:var(--laguna-p)}
.cgbtn[aria-expanded="true"] i{display:inline-block;transform:rotate(180deg)}
.bk-pop.cg-pop{top:calc(100% + 6px);bottom:auto;left:auto;right:0;width:min(360px,100%)}
.card .q{display:flex;flex-direction:column;gap:calc(var(--u)*14)}
.card .btn[disabled]{opacity:.45;cursor:not-allowed}
.prow{gap:12px}.prow span:last-child{white-space:nowrap;text-align:right}
.q-link{align-self:flex-start;font:500 max(14px,calc(var(--u)*14)) var(--sans);color:var(--selva);text-underline-offset:4px}.q-link i{font-style:normal}
.q-note{font-size:max(12px,calc(var(--u)*13));color:var(--laguna-p)}
.q-note.warn{color:var(--tapete)}
.q-results{display:flex;flex-direction:column;gap:8px}
.q-results a{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:12px;background:var(--arena);text-decoration:none;font-size:15px}

/* ===== Hoja "Tu reserva": contenido del fragmento ===== */
.sheet turbo-frame{display:contents}
.sh-body{display:flex;flex-direction:column;gap:12px}
.sh-note{font-size:14px;line-height:1.45;color:var(--laguna-p)}
.sh-note.warn{color:var(--tapete)}
.sh-link{border:0;background:none;padding:0;font:inherit;color:var(--selva);text-decoration:underline;text-underline-offset:3px}
.sh-wait{padding:24px 0;text-align:center;font:italic 22px var(--serif);color:var(--laguna-p)}
.up-item{display:flex;flex-direction:column;gap:8px}
.up.open{box-shadow:inset 0 0 0 1.5px var(--selva)}
.up .photo img{width:100%;height:100%;object-fit:cover}
.up-form{background:var(--blanco);border-radius:14px;padding:14px 16px}
.up-wait{font:italic 16px var(--serif);color:var(--laguna-p);padding:6px 0}
.rate{cursor:default}
.rate .t span{display:block}
.desg-item form{display:inline}
.rm{border:0;background:none;padding:0 0 0 8px;font-size:12px;color:var(--laguna-p);cursor:pointer}
.rm:hover{color:var(--tapete)}
.sh-foot form{margin:0}
.sh-foot a{color:inherit}
.sh-foot .btn{color:var(--blanco)}
.sh-block{color:var(--tapete)}

/* ===== Formularios de experiencias y productos ===== */
.xform{display:flex;flex-direction:column;gap:12px}
.xform .step{border-top:0;padding:4px 0}
.xf-group{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.xf-group legend{font:500 11px var(--sans);color:var(--laguna-p);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;padding:0}
.opt{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:12px;background:var(--arena);cursor:pointer;box-shadow:inset 0 0 0 1.5px transparent}
.opt:has(input:checked){box-shadow:inset 0 0 0 1.5px var(--cedro)}
.opt.off{opacity:.45;cursor:not-allowed}
.opt input{accent-color:var(--cedro);margin:0}
.opt .t{flex:1;min-width:0}.opt .t b{display:block;font:500 15px var(--sans)}.opt .t small{font-size:12px;color:var(--laguna-p)}
.opt .pr{font:600 14px var(--sans);white-space:nowrap}
.slots{display:flex;flex-wrap:wrap;gap:8px}
.slot{display:inline-flex}
.slots-scroll{flex-wrap:nowrap;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:thin}
.slots-scroll .slot span{white-space:nowrap}
.slot input{position:absolute;opacity:0;pointer-events:none}
.slot span{display:inline-flex;align-items:center;padding:10px 16px;border-radius:999px;font:500 14px/1.3 var(--sans);box-shadow:inset 0 0 0 1px var(--piedra);cursor:pointer}
.slot input:checked+span{background:var(--selva);color:var(--blanco);box-shadow:none}
.slot input:focus-visible+span{outline:2px solid var(--cedro);outline-offset:3px}
.xf-att summary{cursor:pointer;font:500 14px var(--sans);padding:6px 0}
.xf-row{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 0;border-top:1px solid var(--piedra)}
.xf-row small{grid-column:1/-1;font-size:12px;color:var(--laguna-p)}
.xf-row .chk{grid-column:1/-1}
.xfield{display:flex;flex-direction:column;gap:2px;background:var(--arena);border-radius:12px;padding:8px 12px;min-width:0}
.xfield label{font:500 11px var(--sans);color:var(--laguna-p);text-transform:uppercase;letter-spacing:.08em}
.xfield input,.xfield select,.xf-row input{border:0;background:transparent;font:500 15px var(--sans);color:var(--selva);min-height:28px;width:100%;min-width:0;padding:2px 0}
.xf-row input{background:var(--arena);border-radius:10px;padding:8px 12px}
.chk{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.chk input{accent-color:var(--cedro);width:18px;height:18px;margin:0}
.chk span{margin-left:auto;color:var(--laguna-p);font-size:13px}
.xf-total{display:flex;justify-content:space-between;font:600 16px var(--sans);padding-top:4px}
.xform .btn{width:100%}
.pf+.pf{border-top:1px solid var(--piedra);padding-top:14px}
.pf-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.pf-head b{font:500 16px var(--sans)}.pf-head span{font:600 15px var(--sans);white-space:nowrap}

/* ===== S6: el primer recuadro visible manda en móvil (las fotos extra van ocultas antes) ===== */
@media (max-width:1023px){.s6 .bento .photo:first-of-type{grid-column:1/3;aspect-ratio:4/3!important}}
/* ===== S8: la tarjeta puede crecer (huéspedes, extras) sobre el margen vacío de S8b, sin cambiar la geometría original ===== */
@media (min-width:1024px){.s8{overflow:visible;z-index:2}}
/* ===== S8b: la rejilla crece con las experiencias reales ===== */
@media (min-width:1024px){.xgrid{grid-template-rows:repeat(var(--rows,2),calc(var(--u)*390))}}
a.add{display:inline-block;text-decoration:none}
.xcard>a.photo{display:block}
.xcard .t-lp.done{color:var(--cedro)}

/* ===== Lightbox de la plataforma con el diseño .lb ===== */
.lb-track{position:absolute;inset:0}
.lb-track>*{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .35s}
.lb-track>.lb-on{opacity:1;pointer-events:auto}
.lb-track img{width:100%;height:100%;object-fit:contain;display:block}
dialog.lb{border:0;padding:0;margin:0;width:100%;height:100%;max-width:none;max-height:none}

/* ===== Burbuja de chat: un círculo selva pequeño en la esquina, fuera de las columnas del contenido ===== */
.chatb{position:fixed;z-index:56;right:12px;bottom:calc(24px + env(safe-area-inset-bottom,0px));display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--selva);color:var(--blanco);box-shadow:0 10px 30px rgba(18,31,26,.28);cursor:pointer}
.chatb svg{width:20px;height:20px}
.chatb .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.chatb .dot{position:absolute;top:2px;right:2px;width:10px;height:10px;border-radius:50%;background:var(--cedro);box-shadow:0 0 0 2px var(--selva)}
.chatb[aria-expanded="true"]{background:var(--laguna-p)}
@media (max-width:1023px){.chatb{right:10px;bottom:calc(84px + env(safe-area-inset-bottom,0px))}}

/* ===== Páginas propias (casa, carrito, experiencias, productos) ===== */
.pg{padding:calc(var(--u)*150) 0 calc(var(--u)*110)}
.pg .wrap{width:calc(var(--u)*1268);margin:0 auto}
.pg-h1{font:calc(var(--u)*96)/.95 var(--serif)}
.pg-sub{font:calc(var(--u)*30)/1.15 var(--serif);margin-top:calc(var(--u)*18);max-width:calc(var(--u)*820)}
.pg-lead{font-size:calc(var(--u)*17);line-height:1.6;white-space:pre-line}
.pg .lab{display:block;margin-bottom:calc(var(--u)*18)}
.back{display:inline-block;font:500 calc(var(--u)*14) var(--sans);text-decoration:none;margin-bottom:calc(var(--u)*28);color:var(--laguna-p)}
.back:hover{text-decoration:underline;text-underline-offset:4px}

/* casa: galería */
.rp-gal{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,calc(var(--u)*270));gap:calc(var(--u)*14);margin-top:calc(var(--u)*48)}
.rp-gal .photo{cursor:zoom-in}
.rp-gal .photo:first-of-type{grid-row:1/3}
.rp-gal .photo img{transition:transform .4s}.rp-gal .photo:hover img{transform:scale(1.04)}
.rp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.rp-head .btn{flex:none}
.rp-about{background:var(--selva);color:var(--blanco);padding:calc(var(--u)*110) 0}
.rp-cols{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:calc(var(--u)*80);align-items:start}
.rp-about .facts{margin-bottom:calc(var(--u)*40);flex-wrap:wrap}
.rp-about .amen{grid-template-columns:repeat(2,1fr)}
.rp-book{background:var(--arena);padding:calc(var(--u)*100) 0}
.rp-book .wrap{display:grid;grid-template-columns:calc(var(--u)*640) calc(var(--u)*560);justify-content:space-between;align-items:start}
.rp-book .photo{height:calc(var(--u)*820);position:sticky;top:calc(var(--u)*110)}

/* carrito */
.cp-grid{display:grid;grid-template-columns:minmax(0,1fr) calc(var(--u)*460);gap:calc(var(--u)*48);align-items:start;margin-top:calc(var(--u)*48)}
.cp-list{display:flex;flex-direction:column;gap:12px}
.cp-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;background:var(--blanco);border-radius:18px;padding:12px 18px 12px 12px}
.cp-line .photo{width:120px;height:90px;border-radius:12px}
.cp-line .photo.none{width:0;margin-left:-16px}
.cp-line small{display:block;font:italic 15px var(--serif);color:var(--laguna-p)}
.cp-line h3{font:30px/1 var(--serif);margin:2px 0 6px}
.cp-line p{font-size:14px;color:var(--laguna-p)}
.cp-r{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.cp-r b{font:600 18px var(--sans);white-space:nowrap}
.cp-qty{display:flex;align-items:center;gap:10px;margin-top:8px}
.cp-qty .ctl{gap:8px}.cp-qty .ctl button{width:34px;height:34px;font-size:16px}
.cp-sum{position:sticky;top:calc(var(--u)*110)}
.cp-sum .prow span:first-child{color:var(--laguna-p)}
.cp-sum .prow.b span:first-child{color:var(--selva)}
.cp-empty{background:var(--blanco);border-radius:24px;padding:calc(var(--u)*56);display:flex;flex-direction:column;gap:18px;align-items:flex-start;margin-top:calc(var(--u)*48)}
.cp-empty p{font-size:17px;line-height:1.5;max-width:520px}
.cp-more{margin-top:calc(var(--u)*90)}
.cp-more .xgrid{position:static;margin-top:calc(var(--u)*36);grid-template-rows:none;grid-auto-rows:auto;row-gap:calc(var(--u)*28)}
.cp-more .xcard{min-height:calc(var(--u)*360)}

/* experiencia / producto */
.op-grid{display:grid;grid-template-columns:calc(var(--u)*640) calc(var(--u)*560);justify-content:space-between;align-items:start}
.op-gal{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*14)}
.op-gal .photo{aspect-ratio:4/3;cursor:zoom-in}
.op-gal .photo:first-of-type{grid-column:1/3;aspect-ratio:640/560}
.op-gal .photo img{transition:transform .4s}.op-gal .photo:hover img{transform:scale(1.04)}
.op-meta{display:flex;gap:10px;flex-wrap:wrap}
.op-desc{font-size:max(15px,calc(var(--u)*16));line-height:1.55;white-space:pre-line}

/* pie corto de las páginas propias */
.foot{background:var(--selva);color:var(--blanco);padding:calc(var(--u)*56) 0 calc(var(--u)*120)}
.foot .wrap{width:calc(var(--u)*1268);margin:0 auto;border-top:1px solid var(--palapa);padding-top:calc(var(--u)*30);display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.foot .nm{font:calc(var(--u)*28) var(--serif)}
.foot p{font-size:calc(var(--u)*14)}
.lnk{border:0;background:none;padding:0;font:inherit;color:inherit;cursor:pointer}
.lnk:hover,.foot a:hover{text-decoration:underline;text-underline-offset:4px}

@media (max-width:1023px){
  .pg{padding:96px 20px 64px}
  .pg .wrap,.foot .wrap{width:auto;max-width:720px}
  .pg-h1{font-size:56px}.pg-sub{font-size:24px}.pg-lead{font-size:16px}
  .back{font-size:14px;margin-bottom:20px}
  .rp-head{flex-direction:column;align-items:flex-start}
  .rp-gal{grid-template-columns:1fr 1fr;grid-template-rows:none;gap:10px;margin-top:28px}
  .rp-gal .photo{aspect-ratio:1;border-radius:14px}
  .rp-gal .photo:first-of-type{grid-column:1/3;grid-row:auto;aspect-ratio:4/3}
  .rp-about,.rp-book{padding:64px 20px}
  .rp-cols,.rp-book .wrap,.op-grid,.cp-grid{grid-template-columns:1fr;gap:28px}
  .rp-book .photo{height:auto;aspect-ratio:4/3;position:static;border-radius:16px}
  .op-gal .photo{border-radius:14px}
  .cp-grid{margin-top:28px}
  .cp-sum{position:static}
  .cp-line{grid-template-columns:auto minmax(0,1fr);padding:12px}
  .cp-line .photo{width:84px;height:72px}
  .cp-line h3{font-size:24px}
  .cp-r{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center}
  .cp-empty{padding:28px;margin-top:28px}
  .cp-more{margin-top:56px}
  .cp-more .xgrid{margin-top:20px}
  .cp-more .xcard{min-height:0}
  .foot{padding:40px 20px 120px}
  .foot .nm{font-size:24px}.foot p{font-size:14px}
  .bk-pop{width:auto;left:0;right:0}
  .nav .cartl{font-size:13px;gap:6px}
  .cg{grid-template-columns:1fr}
  .cg .step{padding:12px 0}
  .cg .cap{margin-top:6px}
}
@media (max-width:480px){.nav .cartl .t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}