/* ==========================================================================
   AM Vivencial Tours v2 - Experiencias (tienda + categorias)
   Prefijo .am-exp-  |  Mobile first (390px) hasta 1440px
   Blue Nova Consulting
   ========================================================================== */

/* ---------------------------------- HERO ---------------------------------- */
.am-exp-hero{ position:relative; display:flex; align-items:flex-end; min-height:clamp(560px,82svh,900px);
  padding:calc(var(--am-hd) + 48px) 0 clamp(64px,10vh,116px); background:var(--am-coffee); color:#fff;
  overflow:hidden; isolation:isolate; }
@media (min-width:900px){ .am-exp-hero{ min-height:clamp(600px,92svh,900px); } }
.am-exp-hero--cat{ min-height:clamp(540px,80svh,800px); }
.am-exp-hero .am-exp-hero__bg{ position:absolute; inset:0; z-index:-2; border-radius:0; }
.am-exp-hero__bg > picture{ position:absolute; inset:0; display:block; }
.am-exp-hero__veil{ position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg,rgba(37,30,24,.66) 0%,rgba(37,30,24,.14) 28%,rgba(37,30,24,.28) 56%,rgba(37,30,24,.92) 100%),
    linear-gradient(90deg,rgba(37,30,24,.6) 0%,rgba(37,30,24,0) 72%); }
/* categorias: cielos claros detras de las migas */
.am-exp-hero--cat .am-exp-hero__veil{
  background:
    linear-gradient(180deg,rgba(37,30,24,.7) 0%,rgba(37,30,24,.3) 34%,rgba(37,30,24,.36) 60%,rgba(37,30,24,.9) 100%),
    linear-gradient(90deg,rgba(37,30,24,.5) 0%,rgba(37,30,24,0) 70%); }
.am-exp-hero__inner{ position:relative; z-index:2; }
.am-page .am-exp-hero__title{ color:#fff; max-width:14ch; margin:0 0 22px; text-wrap:balance; }
.am-exp-hero .am-exp-hero__lead{ margin:0 0 32px; max-width:56ch; }

/* firma de dos pesos en el H1 de la tienda: lugar de partida fuerte, destino liviano */
.am-page h1.am-exp-hero__title--duo{ max-width:none; margin-bottom:26px; font-size:clamp(2.05rem,4.7vw,4.15rem) !important; line-height:1 !important; letter-spacing:-.01em !important; }
.am-exp-hero__title--duo .am-title-duo__strong{ letter-spacing:.005em; }
.am-exp-hero__title--duo .am-title-duo__light{ margin-top:.08em; color:var(--am-beige); }
@media (min-width:900px){ .am-exp-hero__title--duo .am-title-duo__light{ padding-left:1.35em; } }

/* modo marca: categorias sin foto propia */
.am-exp-hero--brand{ background:radial-gradient(120% 90% at 85% 20%,#4a1a0c 0%,#360500 42%,#251E18 100%); background-color:var(--am-wine);
  min-height:clamp(520px,74svh,760px); }
.am-exp-hero--brand.am-exp-hero--green{ background:radial-gradient(120% 100% at 80% 15%,#4d5f43 0%,#374631 45%,#1f271b 100%); background-color:var(--am-green); }
.am-exp-hero__brand{ position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.am-exp-hero__brand::before{ content:""; position:absolute; inset:0; background-color:var(--am-beige); opacity:.08;
  -webkit-mask:url(brand/patron-curvas-tile.svg) 0 0/640px 320px repeat; mask:url(brand/patron-curvas-tile.svg) 0 0/640px 320px repeat; }
.am-exp-hero .am-exp-hero__emblem{ right:-6%; top:54%; width:clamp(380px,54vw,820px); opacity:.14; z-index:0; }
.am-exp-hero--brand .am-exp-hero__title{ max-width:16ch; }
@media (max-width:760px){
  .am-exp-hero__brand::before{ -webkit-mask-size:420px 210px; mask-size:420px 210px; }
  .am-exp-hero .am-exp-hero__emblem{ right:-46%; top:30%; width:118vw; opacity:.11; }
}

/* migas */
.am-exp-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:0 10px; margin:0 0 16px;
  font-family:var(--am-font-display); font-size:.86rem; letter-spacing:.04em; color:rgba(255,255,255,.72); text-shadow:0 1px 14px rgba(0,0,0,.45); }
.am-exp-crumbs a{ display:inline-block; padding-block:10px; color:rgba(255,255,255,.92) !important; transition:color .3s; }
.am-exp-crumbs a:hover{ color:var(--am-beige) !important; }
.am-exp-crumbs [aria-current]{ color:var(--am-beige); }

.am-exp-hero .am-exp-hero__place{ display:none; }
@media (min-width:600px){
  .am-exp-hero .am-exp-hero__place{ position:absolute; right:var(--am-gutter); bottom:30px; z-index:2; display:inline-flex; align-items:center; gap:8px;
    margin:0; font-family:var(--am-font-display); font-size:.76rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.8); }
  .am-exp-hero__place .am-ico{ width:16px; height:16px; color:var(--am-beige); }
}

/* ------------------------- BARRA DE CATEGORIAS ---------------------------- */
.am-exp-bar{ position:sticky; top:calc(var(--am-hd) - 1px); z-index:40; background:rgba(251,248,243,.92);
  -webkit-backdrop-filter:saturate(1.3) blur(14px); backdrop-filter:saturate(1.3) blur(14px);
  border-bottom:1px solid var(--am-line); box-shadow:0 14px 30px -26px rgba(37,30,24,.55);
  transition:transform .5s var(--am-ease); }
.am-exp-bar.is-tucked{ transform:translateY(-100%); }
.am-exp-bar__inner{ display:flex; align-items:center; gap:18px; }
.am-exp-bar__label{ display:none; }
.am-page .am-exp-bar__chips{ --l:0px; --r:56px; position:relative; flex:1 1 auto; min-width:0; display:flex; gap:8px; list-style:none;
  margin:0 calc(var(--am-gutter) * -1); padding:12px var(--am-gutter); overflow-x:auto; overflow-y:hidden;
  overscroll-behavior-x:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--l),#000 calc(100% - var(--r)),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 var(--l),#000 calc(100% - var(--r)),transparent 100%); }
.am-exp-bar__chips::-webkit-scrollbar{ display:none; }
.am-exp-bar__chips.has-left{ --l:44px; }
.am-exp-bar__chips.no-right{ --r:0px; }
.am-page .am-exp-bar__chips li{ flex:0 0 auto; margin:0; padding:0; list-style:none; }
.am-exp-bar .am-chip{ padding:9px 17px; font-size:.88rem; min-height:40px; }
/* chips convertidos en <button> por el filtro (am.css los pinta con !important) */
.am-page .am-exp-bar button.am-chip{ padding:9px 17px !important; font-size:.88rem !important; min-height:40px !important; }
.am-exp-bar .am-chip:hover{ transform:none; }
@media (max-width:599px){
  .am-page .am-exp-bar__chips{ padding:8px var(--am-gutter); }
  .am-exp-bar .am-chip, .am-page .am-exp-bar button.am-chip{ padding:7px 14px !important; font-size:.84rem !important; min-height:38px !important; }
}
@media (min-width:1024px){
  .am-page .am-exp-bar__chips{ margin:0; padding:14px 0; }
  .am-exp-bar__chips.has-left{ --l:36px; }
  .am-exp-bar .am-chip, .am-page .am-exp-bar button.am-chip{ padding:8px 14px !important; font-size:.85rem !important; }
}
@media (min-width:1600px){
  .am-exp-bar__label{ display:inline-flex; align-items:center; gap:8px; flex:0 0 auto; font-family:var(--am-font-display); font-size:.76rem;
    font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--am-terracotta); }
}

/* ------------------------ INTRO DE CATEGORIA (datos) ----------------------- */
.am-section.am-exp-intro{ padding:var(--am-sec-y) 0 0; background:var(--am-cream); }
.am-exp-intro__grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:32px; }
.am-page .am-exp-intro__text{ margin:0; max-width:32ch; font-family:var(--am-font-display); font-weight:300; font-size:clamp(1.4rem,2.5vw,2.2rem);
  line-height:1.28; letter-spacing:-.01em; color:var(--am-green-800); }
.am-exp-intro__datos{ margin:0; border-top:1px solid var(--am-line); }
.am-exp-intro__datos > div{ padding:16px 0; border-bottom:1px solid var(--am-line); }
.am-exp-intro__datos dt{ font-family:var(--am-font-display); font-size:max(.76rem,12px); font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--am-terracotta); }
.am-exp-intro__datos dd{ margin:4px 0 0; font-family:var(--am-font-display); font-size:clamp(1.15rem,1.6vw,1.4rem); font-weight:500; color:var(--am-green-800); }
@media (min-width:960px){ .am-exp-intro__grid{ grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:clamp(56px,7vw,112px); align-items:end; } }
.am-section.am-exp-list.has-intro{ padding-top:clamp(48px,6vw,88px); }

/* --------------------- FONDO DE LA INTRO Y DEL LISTADO ---------------------- */
/* r22: fuera las curvas animadas (.am-contours: dos capas con mask-position animado sobre ~10.000 px de alto,
   el navegador repintaba toda la seccion en cada cuadro) y la textura de foto con filtro (.am-tex-off en la
   plantilla). El fondo lo pone el tono de cada categoria (--cat-bg, ver am_orden_tono en _orden.php). */
.am-section.am-exp-intro{ background:var(--cat-bg,var(--am-cream)); }

/* ---------------------------- LISTADO EDITORIAL ---------------------------- */
.am-exp-list{ position:relative; isolation:isolate; overflow-x:clip; background:var(--cat-bg,var(--am-cream)); }
.am-section.am-exp-list{ padding-top:var(--am-sec-y); padding-bottom:var(--am-sec-y); } /* r23: aire del sistema (antes 112/132) */
.am-section.am-exp-list--single{ padding-top:clamp(32px,4vw,64px); }
.am-section.am-exp-list:has(.am-exp-row--text:nth-last-child(1 of .am-exp-row)){ padding-bottom:clamp(48px,6vw,88px); }

.am-exp-list__head{ display:grid; grid-template-columns:minmax(0,1fr); gap:18px; margin-bottom:clamp(32px,5vw,72px); }
.am-page .am-exp-list__title{ max-width:none; }
.am-page .am-exp-count{ margin:14px 0 0; font-family:var(--am-font-display); font-size:1rem; font-weight:500; color:var(--am-muted); font-variant-numeric:tabular-nums; }
.am-page .am-exp-count__link{ display:inline-flex; align-items:center; gap:6px; min-height:40px; font-family:var(--am-font-display); font-size:.95rem; font-weight:500;
  color:var(--am-terracotta); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
.am-page .am-exp-count__link:hover{ color:var(--am-green-800); }
.am-exp-count__link[hidden]{ display:none; }
@media (min-width:900px){
  .am-exp-list__head{ grid-template-columns:minmax(0,1fr) auto; gap:40px; align-items:end; }
}
@media (min-width:1024px){
  .am-page .am-exp-list__title{ font-size:clamp(2rem,3.3vw,3.4rem) !important; }
}

.am-exp-rows{ display:flex; flex-direction:column; }
.am-exp-row{ display:grid; grid-template-columns:minmax(0,1fr); gap:28px; padding:var(--am-sec-y-tight) 0;
  background:linear-gradient(90deg,transparent,var(--am-line) 12%,var(--am-line) 88%,transparent) 0 0 / 100% 1px no-repeat; }
.am-exp-row:first-child, .am-exp-row:nth-child(1 of .am-exp-row:not(.is-out)){ padding-top:0; background:none; }
.am-exp-row:nth-last-child(1 of .am-exp-row:not(.is-out)){ padding-bottom:0; }
.am-exp-band:not(.is-out) + .am-exp-row{ background:none; }
.am-exp-row.is-out, .am-exp-band.is-out{ display:none; }
.am-page .am-exp-rows__empty{ margin:0; padding:24px 0; font-size:1.05rem; }
.am-exp-rows__empty a{ color:var(--am-terracotta); text-decoration:underline; }

.am-exp-row .am-exp-row__media{ display:block; aspect-ratio:4/3; box-shadow:var(--am-shadow); }

.am-exp-row__body{ min-width:0; max-width:580px; }
.am-page .am-exp-row .am-exp-row__cat{ display:inline-block; padding-block:11px; margin:-11px 0 4px; line-height:1.2; font-family:var(--am-font-display); font-size:max(.78rem,12px);
  font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--am-terracotta); transition:color .3s; }
.am-page .am-exp-row .am-exp-row__cat:hover{ color:var(--am-green); }
.am-page .am-exp-row__title{ margin:0 0 12px; font-size:clamp(1.6rem,1.1rem + 2.2vw,3.05rem); line-height:1.04; letter-spacing:-.022em;
  font-weight:600; color:var(--am-green-800); text-wrap:balance; }
.am-page .am-exp-row__title a{ padding-block:6px; color:inherit !important; background:linear-gradient(currentColor,currentColor) 0 100% / 0 2px no-repeat content-box;
  transition:background-size .7s var(--am-ease); }
.am-page .am-exp-row__title a:hover{ background-size:100% 2px; }
.am-page .am-exp-row__sub{ margin:0 0 14px; font-family:var(--am-font-display); font-style:italic; font-weight:500; font-size:1.06rem;
  line-height:1.45; color:var(--am-coffee); text-wrap:pretty; }
.am-page .am-exp-row__short{ margin:0; font-size:1.04rem; line-height:1.75; color:var(--am-muted); text-wrap:pretty; }

.am-page .am-exp-row__facts{ display:flex; flex-wrap:wrap; gap:16px 30px; list-style:none; margin:26px 0 0; padding:22px 0 0; border-top:1px solid var(--am-line); }
.am-page .am-exp-row__facts li{ display:flex; align-items:flex-start; min-width:0; margin:0; padding:0; list-style:none; }
.am-exp-row__facts li > span{ display:flex; flex-direction:column; min-width:0; font-family:var(--am-font-display); font-size:.98rem; font-weight:500;
  line-height:1.3; color:var(--am-ink); overflow-wrap:break-word; }
.am-page .am-exp-row__facts small{ margin-bottom:4px; font-size:max(.76rem,12px); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--am-muted); }
.am-exp-row__info > :first-child{ margin-top:0; }
.am-page .am-exp-row__info > .am-exp-row__facts:first-child{ padding-top:0; border-top:0; }

.am-exp-row__foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 24px; margin-top:26px; }
.am-exp-row__price{ min-width:0; }
.am-exp-row__price .am-price{ font-size:1.55rem; }
.am-exp-row__price .am-price--quote{ font-size:1.05rem; white-space:normal; }
.am-exp-row__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 20px; }
.am-page .am-exp-row__link{ display:inline-flex; align-items:center; gap:8px; min-height:44px; font-family:var(--am-font-display); font-size:.95rem; font-weight:500;
  color:var(--am-green-800); text-decoration:none; text-underline-offset:5px; text-decoration-thickness:1px; }
.am-page .am-exp-row__link:hover, .am-page .am-exp-row__link:focus-visible{ text-decoration:underline; color:var(--am-terracotta); }
.am-exp-row__link span{ transition:translate .4s var(--am-ease); }
.am-exp-row__link:hover span{ translate:4px 0; }

/* movil: filas compactas */
@media (max-width:599px){
  .am-exp-row{ padding:26px 0; gap:14px; }
  .am-page .am-exp-row .am-exp-row__cat{ margin-bottom:0; }
  .am-exp-row .am-exp-row__media{ aspect-ratio:16/10; }
  .am-page .am-exp-row__title{ margin-bottom:6px; font-size:1.58rem; }
  .am-page .am-exp-row__sub{ margin-bottom:6px; font-size:1rem; line-height:1.38; }
  .am-page .am-exp-row__short{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; font-size:1rem; line-height:1.52; }
  .am-page .am-exp-row__facts{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px 16px; margin-top:12px; padding-top:12px; }
  .am-page .am-exp-row__facts .am-exp-fact--place{ grid-column:1 / -1; order:3; }
  .am-exp-row__facts li > span{ font-size:.9rem; line-height:1.3; }
  .am-page .am-exp-row__facts small{ margin-bottom:2px; letter-spacing:.1em; }
  .am-exp-row__foot{ flex-wrap:nowrap; gap:12px; margin-top:14px; }
  .am-exp-row__price .am-price{ font-size:1.3rem; }
  .am-exp-row__price .am-price--quote{ font-size:.98rem; }
  .am-exp-row__actions{ flex:0 0 auto; }
  .am-exp-row__actions .am-exp-row__link{ display:none; }
  .am-exp-row__actions .am-exp-row__wa{ gap:8px; padding:0 14px; font-size:.84rem; }
}
@media (min-width:600px) and (max-width:699px){
  .am-exp-row .am-exp-row__media{ aspect-ratio:16/9; }
  .am-exp-row__body{ max-width:none; }
}
@media (min-width:700px) and (max-width:899px){
  .am-exp-row:not(.am-exp-row--text){ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:32px; align-items:center; }
  .am-exp-row.is-flip .am-exp-row__media{ order:2; }
  .am-exp-row .am-exp-row__media{ aspect-ratio:4/5; }
  .am-exp-row__body{ max-width:none; }
  .am-page .am-exp-row__short{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .am-page .am-exp-row__title{ font-size:clamp(1.6rem,3.6vw,2rem); }
  .am-page .am-exp-row__facts{ gap:12px 24px; margin-top:18px; padding-top:16px; }
}
@media (min-width:900px){
  .am-exp-row{ grid-template-columns:minmax(0,1.14fr) minmax(0,1fr); gap:clamp(44px,6vw,100px); align-items:center; }
  .am-exp-row.is-flip{ grid-template-columns:minmax(0,1fr) minmax(0,1.14fr); }
  .am-exp-row.is-flip .am-exp-row__media{ order:2; }
  .am-exp-row .am-exp-row__media{ aspect-ratio:5/4; }
}
@media (min-width:900px) and (max-width:1199px){
  .am-page .am-exp-row__facts{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px 28px; }
  .am-page .am-exp-row__facts .am-exp-fact--place{ grid-column:1 / -1; }
}

/* fila de texto: experiencias sin foto propia (indice editorial, no un hueco de foto) */
.am-exp-rows > .am-exp-row.am-exp-row--text,
.am-exp-rows > .am-exp-row.am-exp-row--text:first-child,
.am-exp-rows > .am-exp-row.am-exp-row--text:nth-child(1 of .am-exp-row:not(.is-out)),
.am-exp-rows > .am-exp-row.am-exp-row--text:nth-last-child(1 of .am-exp-row:not(.is-out)){
  grid-template-columns:minmax(0,1fr); gap:0; padding-block:clamp(28px,3.5vw,48px); background:none; border-top:1px solid rgba(55,70,49,.18); }
.am-exp-rows > .am-exp-row.am-exp-row--text:nth-last-child(1 of .am-exp-row:not(.is-out)){ border-bottom:1px solid rgba(55,70,49,.18); }
.am-exp-rows > .am-exp-band:not(.is-out) + .am-exp-row.am-exp-row--text{ border-top:0; padding-top:clamp(44px,6vw,88px); }
.am-exp-rows > .am-exp-row.am-exp-row--text:has(+ .am-exp-band:not(.is-out)){ margin-bottom:clamp(20px,4vw,52px); border-bottom:1px solid rgba(55,70,49,.18); }
.am-exp-rows > .am-exp-row--text + .am-exp-row:not(.am-exp-row--text){ background:none; }
.am-exp-rows > .am-exp-row.am-exp-row--text:has(+ .am-exp-row:not(.am-exp-row--text):not(.is-out)){ border-bottom:1px solid rgba(55,70,49,.18); }
.am-exp-row--text .am-exp-row__body{ max-width:none; }
.am-page .am-exp-row--text .am-exp-row__title{ font-size:clamp(1.58rem,1rem + 1.5vw,2.4rem); line-height:1.06; }
.am-page .am-exp-row--text .am-exp-row__sub{ margin-bottom:0; font-size:1rem; }
.am-page .am-exp-row--text .am-exp-row__info{ margin-top:14px; }
.am-page .am-exp-row--text .am-exp-row__facts{ margin-top:16px; padding-top:0; border-top:0; }
.am-page .am-exp-row--text .am-exp-row__info > .am-exp-row__facts:first-child{ margin-top:0; }
@media (max-width:599px){
  .am-page .am-exp-row--text .am-exp-row__info{ margin-top:10px; }
  .am-page .am-exp-row--text .am-exp-row__facts{ margin-top:12px; padding-top:12px; border-top:1px dashed var(--am-line); }
  .am-page .am-exp-row--text .am-exp-row__info > .am-exp-row__facts:first-child{ padding-top:0; border-top:0; }
}
@media (min-width:700px) and (max-width:899px){
  .am-exp-row--text .am-exp-row__body{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); column-gap:32px; align-items:start; }
  .am-exp-row--text .am-exp-row__lead{ grid-row:1 / span 2; }
  .am-page .am-exp-row--text .am-exp-row__info{ margin-top:0; }
  .am-exp-row--text .am-exp-row__foot{ grid-column:2; }
  .am-exp-row--text .am-exp-row__body:not(:has(.am-exp-row__info)) .am-exp-row__foot{ margin-top:0; }
}
@media (min-width:900px){
  .am-exp-row--text .am-exp-row__body{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto; column-gap:clamp(28px,4vw,64px); align-items:start; }
  .am-exp-row--text .am-exp-row__body:not(:has(.am-exp-row__info)){ grid-template-columns:minmax(0,1fr) auto; }
  .am-page .am-exp-row--text .am-exp-row__info{ margin-top:6px; }
  .am-exp-row--text .am-exp-row__foot{ flex-direction:column; flex-wrap:nowrap; align-items:flex-end; justify-content:flex-start; gap:14px; margin-top:0; text-align:right; }
  .am-exp-row--text .am-exp-row__actions{ flex-direction:column; align-items:flex-end; gap:2px; }
  .am-exp-row--text .am-exp-row__price .am-price:not(.am-price--quote){ font-size:clamp(1.8rem,2.6vw,2.5rem); line-height:1; }
  .am-exp-row--text .am-exp-row__price .am-price small:not(.am-price__note){ display:block; margin:0 0 6px; font-size:max(.76rem,12px); letter-spacing:.16em; }
  .am-exp-row--text .am-exp-row__price .am-price__note{ margin-top:6px; font-size:max(.8rem,12px); }
  .am-exp-row--text .am-exp-row__price .am-price--quote{ display:block; max-width:13ch; font-size:1.15rem; line-height:1.25; }
}

/* la foto sigue llevando a la ficha; el boton "Ver fotos" vive encima, por eso la cubierta es su propia capa */
.am-exp-row__cover{ position:absolute; inset:0; z-index:0; display:block; }
.am-exp-row__cover > img, .am-exp-row__cover > picture img{ width:100%; height:100%; object-fit:cover; display:block; }

/* vista previa de galeria (escritorio con puntero) */
.am-exp-row__cover > .am-exp-row__peek{ display:none; }
@media (hover:hover) and (pointer:fine) and (min-width:1024px){
  .am-exp-row__cover > .am-exp-row__peek{ display:block; position:absolute; inset:0; z-index:2; width:100%; height:100%; object-fit:cover;
    clip-path:inset(0 0 0 100%); pointer-events:none; }
  .am-exp-row__cover > .am-exp-row__peek.is-on{ clip-path:inset(0 0 0 0); transition:clip-path 1.5s var(--am-ease); }
  /* modo suave: fundido corto en lugar de la cortina */
  html.am-motion-suave .am-exp-row__cover > .am-exp-row__peek{ clip-path:none; opacity:0; }
  html.am-motion-suave .am-exp-row__cover > .am-exp-row__peek.is-on{ opacity:1; transition:opacity .4s ease; }
  .am-exp-row__media.is-leaving .am-exp-row__peek{ opacity:0; transition:opacity .45s var(--am-ease); }
}

/* ------------------------- BOTON "VER FOTOS" Y VISOR ----------------------- */
/* discreto sobre la esquina de la foto: no compite con el titulo ni con el precio */
/* el tema pinta todo <button> como CTA terracota en mayusculas: aqui manda la pastilla de vidrio */
.am-page .am-exp-row .am-exp-row__gal{ position:absolute; z-index:3; left:12px; bottom:12px; display:inline-flex; align-items:center; gap:9px;
  width:auto !important; min-width:0 !important; min-height:38px !important; height:auto !important; margin:0 !important;
  padding:9px 14px !important; border:0 !important; border-radius:999px !important; cursor:pointer;
  font-family:var(--am-font-display) !important; font-size:max(.82rem,12px) !important; font-weight:500 !important;
  letter-spacing:.012em !important; line-height:1 !important; text-transform:none !important; text-decoration:none !important;
  color:#FAEDE4 !important; background:rgba(37,30,24,.5) !important; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  box-shadow:inset 0 0 0 1px rgba(250,237,228,.3) !important; opacity:.94;
  transition:background .35s var(--am-ease), opacity .35s var(--am-ease); }
.am-page .am-exp-row .am-exp-row__gal .am-ico{ width:17px; height:17px; opacity:.88; }
.am-page .am-exp-row .am-exp-row__gal small{ padding:2px 8px; border-radius:999px; font-size:max(.76rem,12px); font-weight:600; line-height:1.35;
  font-variant-numeric:tabular-nums; color:#251E18; background:var(--am-beige); }
@media (hover:hover) and (pointer:fine){
  .am-page .am-exp-row .am-exp-row__media:hover .am-exp-row__gal{ background:rgba(37,30,24,.7) !important; opacity:1; }
}
.am-page .am-exp-row .am-exp-row__gal:hover,
.am-page .am-exp-row .am-exp-row__gal:focus-visible{ background:var(--am-green) !important; opacity:1; }
.am-page .am-exp-row .am-exp-row__gal:focus-visible{ outline:2px solid var(--am-beige); outline-offset:3px; }
.am-page .am-exp-row .am-exp-row__media--brand .am-exp-row__gal{ display:none; }
@media (min-width:700px){ .am-page .am-exp-row .am-exp-row__gal{ left:16px; bottom:16px; min-height:42px !important; padding:11px 17px !important; font-size:.88rem !important; } }
@media (prefers-reduced-motion:reduce){ .am-page .am-exp-row .am-exp-row__gal{ transition:none; } }
/* disparadores del visor: existen en el DOM (el visor solo lista lo que no esta en display:none) pero no ocupan,
   no se ven, no se tabulan y no cuentan como area tactil. El tema le mete padding a todo <button>: de ahi los !important. */
.am-exp-row__shots{ position:absolute; left:0; bottom:0; z-index:-1; display:block; width:0; height:0; overflow:hidden; opacity:0; pointer-events:none; }
.am-exp-row__shots .am-exp-shot{ display:block; width:0 !important; height:0 !important; min-width:0 !important; min-height:0 !important;
  margin:0 !important; padding:0 !important; border:0 !important; background:none !important; box-shadow:none !important; overflow:hidden; }

/* ------------------------------- ESTADO VACIO ------------------------------ */
.am-exp-empty{ display:grid; grid-template-columns:minmax(0,1fr); overflow:hidden; border-radius:var(--am-r-lg); background:var(--am-sand); box-shadow:var(--am-shadow); }
.am-exp-empty .am-exp-empty__media{ min-height:260px; border-radius:0; }
.am-exp-empty .am-exp-empty__media > img{ position:absolute; inset:0; }
.am-exp-empty__text{ padding:clamp(28px,5vw,68px); }
.am-page .am-exp-empty__kicker{ margin:0 0 12px; font-family:var(--am-font-display); font-size:max(.78rem,12px); font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--am-terracotta); }
.am-page .am-exp-empty__title{ margin:0 0 16px; max-width:20ch; font-size:clamp(1.75rem,3vw,2.7rem); line-height:1.06; }
.am-page .am-exp-empty__lead{ margin:0 0 28px; max-width:46ch; }
@media (min-width:900px){
  .am-exp-empty{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
  .am-exp-empty .am-exp-empty__media{ min-height:440px; }
}
/* bloque de marca (solo estado vacio) */
.am-exp-brand{ position:absolute; inset:0; z-index:0; display:block; overflow:hidden; isolation:isolate; color:var(--am-beige); }
.am-exp-brand::before{ content:""; position:absolute; inset:0; z-index:-1; background-color:var(--am-beige); opacity:.09;
  -webkit-mask:url(brand/patron-curvas-tile.svg) 0 0/520px 260px repeat; mask:url(brand/patron-curvas-tile.svg) 0 0/520px 260px repeat; }
.am-exp-brand--wine{ background:radial-gradient(120% 95% at 78% 18%,#4a1a0c 0%,#360500 46%,#251E18 100%); }
.am-exp-brand--green{ background:radial-gradient(120% 100% at 22% 12%,#4d5f43 0%,#374631 48%,#222b1e 100%); }
.am-exp-brand--coffee{ background:radial-gradient(120% 100% at 76% 86%,#3d3026 0%,#251E18 58%,#1a1511 100%); }
.am-exp-brand__art{ position:absolute; height:auto; }
.am-exp-brand--emblema-circular .am-exp-brand__art{ width:40%; left:30%; top:50%; translate:0 -50%; opacity:.3; }
.am-exp-brand--ave-flauta .am-exp-brand__art{ width:auto; height:96%; right:8%; bottom:-10%; opacity:.24; }
.am-exp-brand--emblema-cuadrado .am-exp-brand__art{ width:42%; left:5%; bottom:-20%; opacity:.24; rotate:-6deg; }
.am-exp-brand__waves{ position:absolute; left:7%; top:10%; width:auto; height:24px; color:var(--am-terracotta); opacity:.85; }
.am-exp-brand--green .am-exp-brand__waves{ color:var(--am-beige); opacity:.4; }
.am-exp-brand--emblema-cuadrado .am-exp-brand__waves{ left:auto; right:7%; top:auto; bottom:12%; }

/* ---------------------- BANDA DE TURISMO COMUNITARIO ----------------------- */
.am-exp-band{ padding:var(--am-sec-y) 0; }
.am-exp-rows > .am-exp-band{ margin-inline:calc(50% - 50vw); }
.am-exp-band__grid{ position:relative; display:grid; grid-template-columns:minmax(0,1fr); gap:32px; }
.am-exp-band .am-exp-band__waves{ margin-bottom:26px; }
.am-page .am-exp-band__title{ margin:0 0 28px; max-width:12ch; color:#FAEDE4; }
.am-exp-band__side{ position:relative; min-width:0; }
.am-exp-band__bird{ display:block; width:clamp(92px,13vw,190px); height:auto; margin:0 0 -6px auto; color:var(--am-beige); }
.am-page .am-exp-band__list{ list-style:none; margin:0; padding:0; border-top:1px solid rgba(225,197,175,.28); }
.am-page .am-exp-band__list li{ margin:0; padding:0; list-style:none; border-bottom:1px solid rgba(225,197,175,.28); }
.am-exp-band__list a, .am-exp-band__list--pillars li{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:18px; row-gap:4px; padding:clamp(14px,1.6vw,20px) 0; }
.am-exp-band__list a{ color:#FAEDE4 !important; }
.am-exp-band__meta{ grid-column:1; font-family:var(--am-font-body); font-size:.95rem; line-height:1.4; color:#e6d6c8; }
.am-exp-band__name{ grid-column:1; font-family:var(--am-font-display); font-size:clamp(1.3rem,2vw,1.7rem); font-weight:500; line-height:1.15; letter-spacing:-.005em; color:#FAEDE4; }
.am-exp-band__list a .am-exp-band__name{ background:linear-gradient(var(--am-terracotta),var(--am-terracotta)) 0 100% / 0 2px no-repeat; transition:background-size .7s var(--am-ease); justify-self:start; }
.am-exp-band__list a:hover .am-exp-band__name, .am-exp-band__list a:focus-visible .am-exp-band__name{ background-size:100% 2px; }
.am-exp-band__go{ grid-column:2; grid-row:1 / span 2; align-self:center; display:grid; place-items:center; width:46px; height:46px; border-radius:50%;
  border:1px solid rgba(225,197,175,.45); color:var(--am-beige); transition:background-color .35s, color .35s, border-color .35s; }
.am-exp-band__list a:hover .am-exp-band__go{ background:var(--am-beige); border-color:var(--am-beige); color:var(--am-coffee); }
.am-exp-band__photos{ position:relative; margin-bottom:28px; }
.am-exp-band .am-exp-band__photo--a{ width:78%; aspect-ratio:4/5; margin-left:auto; }
.am-exp-band .am-exp-band__photo--b{ position:absolute; left:0; bottom:-24px; width:44%; aspect-ratio:1; border:6px solid var(--am-wine); }
@media (max-width:959px){
  .am-exp-band__bird{ position:absolute; top:-6px; right:var(--am-gutter); margin:0; width:clamp(84px,22vw,140px); opacity:.95; }
  .am-exp-band.has-photos .am-exp-band__photos{ margin-bottom:48px; }
  .am-exp-band__side{ position:static; }
}
@media (min-width:960px){
  .am-exp-band__grid{ grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(56px,7vw,120px); align-items:end; }
  .am-exp-band__head{ padding-bottom:6px; }
}

/* ------------------------ AVITURISMO: GALERIA ------------------------------ */
.am-exp-birds{ overflow:hidden; }
.am-exp-birds > .am-container{ position:relative; z-index:2; }
.am-page .am-exp-birds__title{ margin:0 0 clamp(28px,4vw,52px); color:#fff; }
.am-exp-birds__row{ display:grid; grid-auto-flow:column; grid-auto-columns:78%; gap:14px;
  margin:0 calc(var(--am-gutter) * -1); padding:0 var(--am-gutter) 6px; overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-padding-inline:var(--am-gutter); scrollbar-width:none; }
.am-exp-birds__row::-webkit-scrollbar{ display:none; }
.am-exp-birds .am-exp-bird{ margin:0; scroll-snap-align:start; }
.am-exp-bird .am-exp-bird__media{ display:block; aspect-ratio:4/5; }
.am-page .am-exp-bird__name{ margin-top:12px; font-family:var(--am-font-display); font-size:.98rem; font-weight:500; line-height:1.5; color:#fff; }
.am-page .am-exp-bird__name.is-credit-only{ padding-top:calc(.98rem * 1.5); }
.am-page .am-exp-bird__name small{ display:block; margin-top:2px; font-family:var(--am-font-body); font-size:max(.78rem,12px); font-weight:400; color:#e0d5c7; }
@media (min-width:700px){
  .am-exp-birds__row{ grid-auto-flow:row; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-columns:auto; gap:clamp(16px,2vw,28px);
    margin:0; padding:0; overflow:visible; scroll-snap-type:none; }
}

/* -------------------------------- CTA FINAL -------------------------------- */
.am-exp-cta{ position:relative; display:flex; align-items:flex-end; min-height:clamp(520px,74svh,760px); padding:var(--am-sec-y) 0;
  overflow:hidden; isolation:isolate; background:var(--am-coffee); color:#fff; text-align:left; }
.am-exp-cta .am-exp-cta__bg{ position:absolute; inset:0; z-index:-2; border-radius:0; }
.am-exp-cta::before{ content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg,rgba(37,30,24,.2) 0%,rgba(37,30,24,.35) 45%,rgba(37,30,24,.88) 100%),
    linear-gradient(90deg,rgba(37,30,24,.72) 0%,rgba(37,30,24,.25) 70%,rgba(37,30,24,.1) 100%); }
.am-exp-cta__inner{ position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1fr); gap:28px; }
.am-page .am-exp-cta__title{ margin:0 0 20px; max-width:15ch; font-size:clamp(2.2rem,4.8vw,4.3rem); line-height:1; letter-spacing:-.024em; color:#fff; text-wrap:balance;
  text-shadow:0 2px 24px rgba(0,0,0,.3); }
.am-exp-cta .am-exp-cta__lead{ margin:0; max-width:46ch; text-shadow:0 1px 16px rgba(0,0,0,.45); }
.am-exp-cta__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 22px; }
.am-page .am-exp-cta__form{ display:inline-flex; align-items:center; min-height:44px; font-family:var(--am-font-display); font-size:1rem; font-weight:500;
  color:#fff !important; text-decoration:underline; text-decoration-color:var(--am-beige); text-decoration-thickness:1px; text-underline-offset:6px; transition:text-decoration-thickness .3s, color .3s; }
.am-page .am-exp-cta__form:hover{ color:var(--am-beige) !important; text-decoration-thickness:2px; }
@media (min-width:900px){
  .am-exp-cta__inner{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); column-gap:clamp(40px,6vw,96px); align-items:end; }
  .am-exp-cta__actions{ justify-content:flex-end; padding-bottom:6px; }
}
/* sin video: fondo cafe con el ave de marca (sin foto ajena al tema) */
.am-exp-cta.am-exp-cta--brand{ min-height:0; padding-block:var(--am-sec-y); background:#251E18; }
.am-exp-cta--brand::before{ content:none; }
.am-exp-cta__bird{ position:absolute; z-index:-1; right:max(var(--am-gutter), calc((100vw - var(--am-container)) / 2)); bottom:0; width:auto; height:70%;
  color:var(--am-beige); opacity:.25; pointer-events:none; }
@media (min-width:900px){
  .am-exp-cta--brand .am-exp-cta__actions{ grid-column:1; justify-content:flex-start; padding-bottom:0; }
  .am-exp-cta--brand .am-exp-cta__bird{ top:50%; bottom:auto; translate:0 -50%; height:78%; }
}
/* tras la banda comunitaria (misma base cafe): una linea en lugar de un segundo bloque y sin repetir el ave */
.am-exp-band + .am-exp-cta--brand{ padding-top:0; }
.am-exp-band + .am-exp-cta--brand .am-exp-cta__inner{ padding-top:clamp(56px,7vw,96px);
  background:linear-gradient(rgba(225,197,175,.22),rgba(225,197,175,.22)) var(--am-gutter) 0 / calc(100% - var(--am-gutter) * 2) 1px no-repeat; }
.am-exp-band + .am-exp-cta--brand .am-exp-cta__bird{ display:none; }
@media (max-width:599px){
  .am-exp-cta{ min-height:0; padding:72px 0 56px; }
  .am-exp-cta__bird{ right:-8%; height:52%; opacity:.14; }
  .am-exp-cta__actions{ flex-direction:column; align-items:flex-start; }
}

/* ------------------------------ MOVIMIENTO REDUCIDO ------------------------ */
@media (prefers-reduced-motion:reduce){
  .am-exp-bar{ transition:none; }
  .am-exp-row__link span{ transition:none; }
}

/* =======================================================================
   v5 (owner experiencias) - pedidos del cliente del 15-sep
   · el listado de la tienda se agrupa por categoria: se ve que estan todas
   · el nombre de la categoria manda en tamano y contraste ("Descubre Ecuador")
   · filas sin foto propia: composicion de marca mientras media sube las nuevas
   ======================================================================= */

/* ---- Encabezado de categoria: ver "r22 GRUPOS DE CATEGORIA" al final ---- */

/* ---- Composicion de marca en filas sin foto propia ---- */
.am-exp-row .am-exp-row__media--brand{ background:var(--am-coffee); }
.am-exp-row__media--brand .am-exp-brand{ transition:scale 1.2s var(--am-ease); }
@media (hover:hover) and (pointer:fine){
  .am-exp-row__media--brand:hover .am-exp-brand{ scale:1.05; }
}
@media (prefers-reduced-motion:reduce){
  .am-exp-row__media--brand .am-exp-brand{ transition:none; }
  .am-exp-row__media--brand:hover .am-exp-brand{ scale:1; }
}

/* ---- Barra de categorias: mas contraste (el cliente no distinguia el color) ---- */
.am-exp-bar .am-chip, .am-page .am-exp-bar button.am-chip{ font-weight:600 !important; border-color:rgba(55,70,49,.32) !important; }
.am-exp-bar .am-chip.is-active, .am-page .am-exp-bar button.am-chip.is-active{
  background:var(--chip-ac,var(--am-green)) !important; border-color:var(--chip-ac,var(--am-green)) !important; color:#fff !important; }
.am-page .am-exp-count{ color:var(--am-green-800); font-weight:600; }

/* ---- Telefono: la placa de marca es una banda, no un hueco de foto ---- */
@media (max-width:599px){
  .am-exp-row .am-exp-row__media--brand{ aspect-ratio:2.4/1; }
  /* el cliente pidio ver tambien el enlace a la ficha en cada fila */
  .am-exp-row__foot{ flex-wrap:wrap; row-gap:10px; }
  .am-exp-row__actions{ flex:1 1 100%; justify-content:space-between; gap:10px 14px; }
  .am-page .am-exp-row__actions .am-exp-row__link{ display:inline-flex; min-height:38px; font-size:.92rem; }
}

/* ==========================================================================
   VITRINA EN MOVIMIENTO  (.am-exp-stream)  - solo /product-category/san-miguel-de-los-bancos/
   Columna que sube sola, en bucle, con las experiencias de la categoria.
   Como funciona el bucle: la plantilla imprime el juego de tarjetas DOS veces (la copia va con
   aria-hidden y tabindex="-1") y la pista se desplaza -50%. Cada tarjeta lleva su separacion en
   margin-bottom (no en gap): asi la mitad de la pista es exactamente un juego y el salto no se ve,
   aunque las tarjetas midan distinto.
   Quieta si el visitante pide menos movimiento (prefers-reduced-motion / html.am-no-motion):
   se oculta la copia, se suelta la altura y queda una lista normal. html.am-motion-force la reactiva.
   ========================================================================== */
.am-exp-stream{ --am-stream-gap:20px; --am-stream-h:clamp(400px,62vh,540px); overflow:hidden; }
.am-exp-stream__grid{ position:relative; display:grid; grid-template-columns:minmax(0,1fr); gap:clamp(30px,5vw,48px); align-items:center; }
.am-page .am-exp-stream__title{ margin:0 0 18px; color:#fff; text-wrap:balance; }
.am-exp-stream__title .am-title-duo__light{ color:var(--am-beige); }
.am-exp-stream .am-exp-stream__lead{ margin:0 0 26px; max-width:46ch; color:#e4dacd; }
.am-exp-stream__head .am-eyebrow{ margin:0 0 14px; }
.am-exp-stream__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px; }
.am-exp-stream__btn{ align-self:start; }

/* ---- pausa sin JS: casilla oculta + :has() (am.css ya usa :has) ---- */
/* la regla que detiene la pista va al final del archivo: ver "PAUSA DEL RECORRIDO" */
.am-page .am-exp-stream__pause{ display:inline-flex; align-items:center; gap:9px; min-height:40px; padding:0 4px;
  font-family:var(--am-font-display); font-size:.88rem; font-weight:500; letter-spacing:.01em;
  color:rgba(250,237,228,.86); cursor:pointer; text-decoration:underline; text-decoration-color:rgba(225,197,175,.35);
  text-underline-offset:4px; transition:color .3s var(--am-ease); }
.am-page .am-exp-stream__pause:hover{ color:#fff; text-decoration-color:var(--am-beige); }
.am-exp-stream__toggle:focus-visible + .am-exp-stream__pause{ outline:2px solid var(--am-beige); outline-offset:3px; border-radius:6px; }
/* icono: dos barras (pausa) -> triangulo (reanudar) */
.am-exp-stream__pause-i{ position:relative; flex:none; width:18px; height:18px; }
.am-exp-stream__pause-i::before, .am-exp-stream__pause-i::after{ content:''; position:absolute; top:2px; width:4px; height:14px;
  background:currentColor; border-radius:1px; }
.am-exp-stream__pause-i::before{ left:3px; }
.am-exp-stream__pause-i::after{ right:3px; }
.am-exp-stream__toggle:checked + .am-exp-stream__pause .am-exp-stream__pause-i::before{ left:4px; top:1px; width:0; height:0;
  background:none; border-radius:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:12px solid currentColor; }
.am-exp-stream__toggle:checked + .am-exp-stream__pause .am-exp-stream__pause-i::after{ display:none; }
.am-exp-stream__pause-t--off{ display:none; }
.am-exp-stream__toggle:checked + .am-exp-stream__pause .am-exp-stream__pause-t--on{ display:none; }
.am-exp-stream__toggle:checked + .am-exp-stream__pause .am-exp-stream__pause-t--off{ display:inline; }

/* ---- la columna ---- */
.am-exp-stream__col{ position:relative; height:var(--am-stream-h); overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 89%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 89%,transparent 100%); }
/* flow-root (no block): sin contexto de formato propio, el margin-bottom de la ULTIMA tarjeta se
   colapsa fuera de la pista y su alto queda 24px corto. El -50% caia medio hueco antes y el bucle
   daba un saltito de 12px en cada vuelta. */
.am-exp-stream__track{ display:flow-root; will-change:transform; }
.am-exp-stream.is-loop .am-exp-stream__track{ animation:am-stream-up var(--am-stream-dur,40s) linear infinite; }
@keyframes am-stream-up{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(0,-50%,0); } }
/* las tres formas de pararla (cursor, teclado y boton) estan al final: ver "PAUSA DEL RECORRIDO" */

/* ---- tarjeta ---- */
.am-page .am-exp-stream__card{ display:block; margin:0 0 var(--am-stream-gap); padding:10px 10px 16px;
  border-radius:var(--am-r); border:1px solid rgba(225,197,175,.2); background:rgba(250,237,228,.06);
  color:#FAEDE4; text-decoration:none; transition:border-color .5s var(--am-ease), background-color .5s var(--am-ease), transform .5s var(--am-ease); }
@media (hover:hover) and (pointer:fine){
  .am-page .am-exp-stream__card:hover{ border-color:rgba(225,197,175,.5); background:rgba(250,237,228,.11); transform:translateY(-2px); }
  .am-page .am-exp-stream__card:hover .am-exp-stream__img{ transform:scale(1.05); }
}
.am-exp-stream__media{ display:block; aspect-ratio:3/2; border-radius:calc(var(--am-r) - 6px); background:var(--am-green-800); }
.am-exp-stream__media .am-exp-stream__img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s var(--am-ease); }
.am-exp-stream__noimg{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:var(--am-coffee); }
.am-exp-stream__leaf{ width:44%; max-width:120px; height:auto; color:var(--am-beige); opacity:.5; }
.am-exp-stream__body{ display:block; padding:14px 8px 0; }
.am-exp-stream__name{ display:block; font-family:var(--am-font-display); font-weight:500; font-size:1.18rem; line-height:1.18;
  letter-spacing:-.005em; color:#fff; }
.am-exp-stream__place{ display:block; margin-top:5px; font-size:.86rem; line-height:1.3; color:rgba(250,237,228,.72); }
.am-exp-stream__price{ display:block; margin-top:11px; }
/* .am-price esta pensado para fondo claro; aqui va sobre verde */
.am-exp-stream .am-price{ color:var(--am-beige); font-size:1.05rem; }
.am-exp-stream .am-price small, .am-exp-stream .am-price .am-price__note{ color:rgba(250,237,228,.82); }
.am-exp-stream .am-price--quote{ color:var(--am-beige); font-size:.98rem; }

/* ---- escritorio: texto a la izquierda, columna a la derecha ---- */
@media (min-width:860px){
  .am-exp-stream{ --am-stream-h:min(78vh,660px); --am-stream-gap:24px; }
  .am-exp-stream__grid{ grid-template-columns:minmax(0,1fr) minmax(300px,400px); gap:clamp(48px,6vw,104px); }
  /* leve desfase alternado: se ve colocado a mano, no una lista de plantilla.
     La clase la pone la plantilla por posicion DENTRO del juego (no :nth-child): asi la copia
     repite el mismo desfase y al cerrar el bucle las tarjetas no saltan de lado. */
  .am-page .am-exp-stream__card{ margin-right:26px; }
  .am-page .am-exp-stream__card--b{ margin-right:0; margin-left:26px; }
}
@media (min-width:1200px){
  .am-exp-stream__grid{ grid-template-columns:minmax(0,1fr) minmax(340px,420px); }
}

/* ---- sin movimiento: lista normal, sin copia ni recorte ----
   Ojo con la especificidad: quien enciende la animacion es .am-exp-stream.is-loop .am-exp-stream__track
   (0,3,0). Para apagarla hay que repetir ese par de clases, si no el "animation:none" pierde y la
   columna se va sola hacia arriba hasta desaparecer. */
@media (prefers-reduced-motion:reduce){
  html:not(.am-motion-force) .am-exp-stream.is-loop .am-exp-stream__track{ animation:none; }
  html:not(.am-motion-force) .am-exp-stream .am-exp-stream__col{ height:auto; -webkit-mask-image:none; mask-image:none; }
  html:not(.am-motion-force) .am-exp-stream .am-exp-stream__card--dup{ display:none; }
  html:not(.am-motion-force) .am-page .am-exp-stream__card,
  html:not(.am-motion-force) .am-exp-stream .am-exp-stream__img{ transition:none; }
  /* nada se mueve: el boton de pausa sobra */
  html:not(.am-motion-force) .am-exp-stream .am-exp-stream__pausewrap{ display:none; }
}
html.am-no-motion .am-exp-stream.is-loop .am-exp-stream__track{ animation:none; }
html.am-no-motion .am-exp-stream .am-exp-stream__col{ height:auto; -webkit-mask-image:none; mask-image:none; }
html.am-no-motion .am-exp-stream .am-exp-stream__card--dup{ display:none; }
html.am-no-motion .am-exp-stream .am-exp-stream__pausewrap{ display:none; }
html.am-motion-force .am-exp-stream.is-loop .am-exp-stream__track{ animation:am-stream-up var(--am-stream-dur,40s) linear infinite; }
html.am-motion-force .am-exp-stream .am-exp-stream__col{ height:var(--am-stream-h);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 89%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 89%,transparent 100%); }
html.am-motion-force .am-exp-stream .am-exp-stream__card--dup{ display:block; }
html.am-motion-force .am-exp-stream .am-exp-stream__pausewrap{ display:inline; }

/* --------------------------- PAUSA DEL RECORRIDO ---------------------------
   Va al final y con el prefijo html para ganarle a la forma corta "animation:..." de
   html.am-motion-force (0,4,1), que reinicia animation-play-state a running. Si estas reglas
   suben de sitio o pierden el html, con el modo suave forzado la columna deja de poder pararse.
   Tres formas, como pidio el cliente y como pide WCAG 2.2.2: cursor encima, foco de teclado
   dentro y el boton "Pausar el recorrido". */
@media (hover:hover) and (pointer:fine){
  html .am-exp-stream .am-exp-stream__col:hover .am-exp-stream__track{ animation-play-state:paused; }
}
html .am-exp-stream .am-exp-stream__col:focus-within .am-exp-stream__track{ animation-play-state:paused; }
html .am-exp-stream:has(.am-exp-stream__toggle:checked) .am-exp-stream__track{ animation-play-state:paused; }

/* ==========================================================================
   r22 (owner experiencias) - reunion con el cliente del 29-sep
   ========================================================================== */

/* ---------------------- HERO DE /experiencias/: CARRUSEL ---------------------- */
.am-exp-hero--slides{ padding-bottom:calc(clamp(64px,10vh,116px) + 56px); }
.am-exp-hero .am-exp-hero__slides{ position:absolute; inset:0; z-index:-2; border-radius:0; }
.am-exp-hero__slide{ position:absolute; inset:0; opacity:0; transition:opacity 1.4s var(--am-ease); }
.am-exp-hero__slide.is-active{ opacity:1; }
.am-exp-hero__slide > picture{ position:absolute; inset:0; display:block; }
.am-exp-hero__slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:var(--pos,50% 50%); display:block; }
html.am-motion-full .am-exp-hero__slide img{ transform:scale(1.04); transition:transform 9s linear; }
html.am-motion-full .am-exp-hero__slide.is-active img{ transform:scale(1); }
html.am-motion-suave .am-exp-hero__slide{ transition-duration:.35s; }
html.am-motion-ninguna .am-exp-hero__slide, html.am-no-motion .am-exp-hero__slide{ transition:none; }

.am-exp-hero__foot{ position:absolute; left:0; right:0; bottom:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:12px 24px;
  padding:14px max(var(--am-gutter), calc((100% - var(--am-container)) / 2)) 18px; border-top:1px solid rgba(255,255,255,.18); }
.am-exp-hero .am-exp-hero__foot .am-exp-hero__place{ position:static; display:flex; align-items:center; gap:8px; min-width:0; margin:0;
  font-family:var(--am-font-display); font-size:.9rem; font-weight:500; letter-spacing:.04em; text-transform:none; line-height:1.3; color:#efe6da; }
.am-exp-hero__foot .am-exp-hero__place .am-ico{ flex:none; width:16px; height:16px; color:var(--am-beige); }
.am-exp-hero__ctrl{ display:flex; align-items:center; gap:14px; flex:none; }
.am-exp-hero__bars{ display:flex; gap:8px; }
.am-page button.am-exp-hero__bar{ position:relative; width:54px !important; height:44px !important; min-width:0 !important; min-height:0 !important; margin:0 !important;
  padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; cursor:pointer; }
.am-exp-hero__bar::before, .am-exp-hero__bar span{ content:''; position:absolute; left:0; right:0; top:50%; height:3px; margin-top:-1.5px; border-radius:3px; }
.am-exp-hero__bar::before{ background:rgba(255,255,255,.3); transition:background .3s; }
.am-exp-hero__bar:hover::before{ background:rgba(255,255,255,.6); }
.am-exp-hero__bar span{ background:var(--am-beige); transform:scaleX(0); transform-origin:0 50%; }
.am-exp-hero__bar.is-active span{ animation:am-exp-bar var(--exp-slide-dur,7000ms) linear forwards; }
.am-exp-hero.is-paused .am-exp-hero__bar.is-active span{ animation-play-state:paused; }
html.am-motion-ninguna .am-exp-hero__bar.is-active span, html.am-no-motion .am-exp-hero__bar.is-active span{ animation:none; transform:scaleX(1); }
@keyframes am-exp-bar{ to{ transform:scaleX(1); } }
.am-page button.am-exp-hero__pause{ display:inline-flex; align-items:center; justify-content:center; flex:none; width:44px !important; height:44px !important;
  min-width:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; border-radius:50% !important;
  border:1px solid rgba(255,255,255,.45) !important; background:rgba(20,16,12,.25) !important; color:#fff !important; box-shadow:none !important; cursor:pointer;
  transition:background-color .3s, border-color .3s; }
.am-page button.am-exp-hero__pause:hover{ background:rgba(250,237,228,.18) !important; border-color:var(--am-beige) !important; }
.am-exp-hero__play-i, .am-exp-hero__pause[aria-pressed="true"] .am-exp-hero__pause-i{ display:none; }
.am-exp-hero__pause[aria-pressed="true"] .am-exp-hero__play-i{ display:block; }
@media (max-width:760px){
  /* el boton flotante de WhatsApp vive abajo a la derecha: controles a la izquierda y lugar encima */
  .am-exp-hero--slides{ padding-bottom:calc(clamp(64px,10vh,116px) + 92px); }
  .am-exp-hero__foot{ flex-direction:column; align-items:flex-start; gap:4px; padding:10px 96px 16px var(--am-gutter); }
  .am-exp-hero .am-exp-hero__foot .am-exp-hero__place{ font-size:.84rem; }
  .am-exp-hero__ctrl{ gap:10px; }
  .am-exp-hero__bars{ gap:6px; }
  .am-page button.am-exp-hero__bar{ width:28px !important; }
}
@media (prefers-reduced-motion:reduce){
  html:not(.am-motion-force) .am-exp-hero__slide img{ transform:none; transition:none; }
}

/* ------------------------- ENTRADAS (un solo IntersectionObserver) -------------------
   La clase html.am-exp-io-on la pone el script solo si hay movimiento: sin JavaScript o con "ninguna" todo se ve. */
.am-exp-io-on .am-exp-io{ transition:opacity .9s var(--am-ease), transform 1s var(--am-ease); }
.am-exp-io-on .am-exp-io:not(.is-in){ opacity:0; transform:translate3d(0,32px,0); }
.am-exp-io-on.am-exp-io-suave .am-exp-io{ transition:opacity .35s ease; }
.am-exp-io-on.am-exp-io-suave .am-exp-io:not(.is-in){ transform:none; }
/* filtro: fundido corto de lo que entra (solo modo completo) */
.am-exp-rows.is-swapping .am-exp-row:not(.is-out), .am-exp-rows.is-swapping .am-exp-cgroup:not(.is-out) > .am-exp-group{ animation:am-exp-in .42s var(--am-ease) both; }
@keyframes am-exp-in{ from{ opacity:0; transform:translate3d(0,14px,0); } to{ opacity:1; transform:none; } }
@media print{ .am-exp-io{ opacity:1 !important; transform:none !important; } }

/* ------------------------------ r22 GRUPOS DE CATEGORIA ------------------------------
   Cada categoria es una banda a sangre con su tono (--cat-bg) y su acento (--cat-ac), en el orden del menu.
   Dentro, el texto apagado y las lineas suben de tono para mantener el contraste AA sobre el color. */
.am-section.am-exp-list.has-groups{ padding-bottom:0; }
.am-exp-cgroup, .am-exp-list--cat{ --am-muted:#48514a; --am-line:rgba(37,30,24,.14); }
.am-exp-cgroup{ position:relative; isolation:isolate; padding:var(--am-sec-y) 0; }
.am-exp-cgroup::before{ content:""; position:absolute; z-index:-2; top:0; bottom:0; left:calc(50% - 50vw); right:calc(50% - 50vw); background:var(--cat-bg,var(--am-cream)); }
/* curvas de nivel quietas en el acento de la categoria (sin animacion: relieve, no movimiento) */
.am-exp-cgroup::after{ content:""; position:absolute; z-index:-1; top:0; bottom:0; left:calc(50% - 50vw); right:calc(50% - 50vw); pointer-events:none;
  background-color:var(--cat-ac,var(--am-olive)); opacity:.055;
  -webkit-mask:url(brand/patron-curvas-tile.svg) 50% 0/1180px 590px repeat; mask:url(brand/patron-curvas-tile.svg) 50% 0/1180px 590px repeat; }
@media (max-width:640px){ .am-exp-cgroup::after{ -webkit-mask-size:620px 310px; mask-size:620px 310px; } }
.am-exp-rows > .am-exp-cgroup.is-out{ display:none; }
.am-exp-list.has-groups .am-exp-list__head{ margin-bottom:clamp(40px,5vw,72px); }
/* el ultimo grupo antes de la banda comunitaria o del final: su foto no queda pegada a lo que sigue (Conoce el Mundo) */
.am-exp-rows > .am-exp-cgroup + .am-exp-band{ margin-top:0; }
.am-page .am-exp-rows__empty:not([hidden]){ padding:40px 0 64px; }

/* encabezado: la categoria manda (centrado, grande, en su color); la experiencia acompana */
.am-exp-cgroup > .am-exp-group{ display:flex; flex-direction:column; align-items:center; max-width:900px; margin:0 auto clamp(44px,5.5vw,84px);
  padding:0; border:0; text-align:center; scroll-margin-top:calc(var(--am-hd) + 78px); }
.am-exp-cgroup > .am-exp-group::before{ content:""; display:block; width:132px; height:22px; margin:0 0 20px; background-color:var(--cat-ac,var(--am-terracotta));
  -webkit-mask:url(brand/separador-olas.svg) 50% 50%/contain no-repeat; mask:url(brand/separador-olas.svg) 50% 50%/contain no-repeat; }
.am-page .am-exp-cgroup .am-exp-group__title{ margin:0; font-size:clamp(2.45rem,1.2rem + 4.7vw,5.4rem); line-height:.98; letter-spacing:-.035em;
  font-weight:600; color:var(--cat-ac,var(--am-green-800)); text-wrap:balance; }
.am-page .am-exp-cgroup .am-exp-group__title a{ color:inherit !important; background:linear-gradient(currentColor,currentColor) 0 100% / 0 3px no-repeat;
  transition:background-size .7s var(--am-ease); }
.am-page .am-exp-cgroup .am-exp-group__title a:hover{ background-size:100% 3px; }
.am-page .am-exp-cgroup .am-exp-group__desc{ margin:18px 0 0; max-width:56ch; font-size:clamp(1.04rem,.98rem + .3vw,1.2rem); line-height:1.6; color:var(--am-ink); text-wrap:pretty; }
.am-page .am-exp-cgroup .am-exp-group__link{ display:inline-flex; align-items:center; gap:8px; min-height:44px; margin-top:10px;
  font-family:var(--am-font-display); font-size:.98rem; font-weight:600; color:var(--am-green-800);
  text-decoration:underline; text-decoration-color:var(--cat-ac,var(--am-terracotta)); text-decoration-thickness:2px; text-underline-offset:6px; }
.am-page .am-exp-cgroup .am-exp-group__link:hover{ color:var(--cat-ac,var(--am-terracotta)); }
.am-exp-group__link span{ transition:translate .4s var(--am-ease); }
.am-exp-group__link:hover span{ translate:4px 0; }
@media (max-width:599px){
  .am-exp-cgroup{ padding:52px 0 60px; }
  .am-exp-cgroup > .am-exp-group{ margin-bottom:36px; }
  .am-exp-cgroup > .am-exp-group::before{ width:104px; height:18px; margin-bottom:14px; }
  .am-page .am-exp-cgroup .am-exp-group__title{ font-size:clamp(2.1rem,9.4vw,2.7rem); }
}

/* nombre de cada experiencia: mas liviano que el de la categoria (antes ambos 600 y casi del mismo tamano) */
.am-page .am-exp-row__title{ font-weight:500; font-size:clamp(1.55rem,1.05rem + 1.55vw,2.5rem); letter-spacing:-.018em; }
@media (max-width:599px){ .am-page .am-exp-row__title{ font-size:1.5rem; } }
/* las fotos de las filas sobre el color: sombra mas corta, se ven apoyadas y no flotando */
.am-exp-cgroup .am-exp-row .am-exp-row__media, .am-exp-list--cat .am-exp-row .am-exp-row__media{ box-shadow:0 22px 44px -26px rgba(37,30,24,.5); }

/* categoria (una sola pagina): la seccion toma el tono y la foto no queda pegada a lo que sigue */
.am-section.am-exp-list--cat{ padding-bottom:var(--am-sec-y); }
.am-section.am-exp-list--single{ padding-top:clamp(40px,5vw,72px); }

/* tactil: tocar la foto lleva a la ficha (ademas del enlace de la cubierta, el script navega en pointerup) */
.am-exp-row__media[data-exp-go]{ cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }

/* ------------------------- RECUADRO "COTIZA" (29-sep: en un recuadro y mas grande) ------------------------- */
.am-page .am-exp-howto{ display:grid; gap:8px; align-self:end; justify-self:stretch; max-width:470px; margin:0; padding:clamp(22px,2.4vw,30px) clamp(22px,2.4vw,32px);
  border-radius:var(--am-r); background:#fff; border:1px solid rgba(37,30,24,.1); border-top:3px solid var(--am-terracotta);
  box-shadow:0 18px 40px -30px rgba(37,30,24,.55); }
.am-page .am-exp-howto__t{ margin:0; font-family:var(--am-font-display); font-size:clamp(1.32rem,1.12rem + .7vw,1.62rem); font-weight:600; line-height:1.18;
  letter-spacing:-.01em; color:var(--am-green-800); text-wrap:balance; }
.am-page .am-exp-howto__s{ margin:0; font-size:1.06rem; line-height:1.5; color:#48514a; }
.am-exp-howto__btns{ display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.am-page .am-exp-howto .am-exp-howto__btn{ min-height:46px; padding:0 20px; font-size:.98rem; gap:9px; }
.am-exp-howto__btn .am-ico{ width:19px; height:19px; flex:none; }
@media (max-width:599px){
  .am-page .am-exp-howto{ max-width:none; }
  .am-exp-howto__btns .am-exp-howto__btn{ flex:1 1 140px; justify-content:center; }
}

/* ------------------------- BOTONES DE DURACION ------------------------- */
.am-exp-dur{ grid-column:1/-1; display:flex; align-items:center; flex-wrap:wrap; gap:10px 16px; padding-top:22px; border-top:1px solid var(--am-line); }
.am-exp-dur[hidden]{ display:none !important; }
.am-exp-dur__label{ display:inline-flex; align-items:center; gap:8px; flex:0 0 auto; font-family:var(--am-font-display);
  font-size:.8rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--am-terracotta-700); }
.am-exp-dur__label svg{ width:15px; height:15px; flex:0 0 auto; }
.am-exp-dur__chips{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; min-width:0; }
.am-page .am-exp-dur__chips li{ flex:0 0 auto; margin:0; padding:0; list-style:none; }
.am-page .am-exp-dur__chips li[hidden]{ display:none !important; }
.am-page .am-exp-dur .am-chip, .am-page .am-exp-dur button.am-chip{ padding:8px 16px !important; min-height:40px !important; background:#fff;
  font-size:.9rem !important; font-weight:600 !important; border-color:rgba(55,70,49,.3) !important; }
.am-page .am-exp-dur .am-chip b{ font-weight:600; font-size:1.06em; margin-right:1px; }
.am-page .am-exp-dur .am-chip.is-active, .am-page .am-exp-dur button.am-chip.is-active{
  background:var(--cat-ac,var(--am-green)) !important; border-color:var(--cat-ac,var(--am-green)) !important; color:#fff !important; }
.am-page .am-exp-dur--links .am-chip:hover{ background:var(--cat-ac,var(--am-green)); border-color:var(--cat-ac,var(--am-green)) !important; color:#fff !important; transform:none; }
.am-exp-dur .am-chip:hover{ transform:none; }
/* categoria con una sola experiencia: duracion a la izquierda, recuadro a la derecha */
.am-exp-list__head--single{ display:grid; grid-template-columns:minmax(0,1fr); gap:24px; margin-bottom:clamp(36px,4.5vw,64px); }
.am-exp-list__head--single .am-exp-dur{ grid-column:auto; padding-top:0; border-top:0; }
@media (min-width:900px){
  .am-exp-list__head--single{ grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:40px; }
  .am-exp-list__head--single.no-dur{ grid-template-columns:minmax(0,1fr); }
  .am-exp-list__head--single.no-dur .am-exp-howto{ justify-self:end; }
  .am-exp-list__head--single .am-exp-dur{ align-self:center; }
}
@media (max-width:599px){
  .am-exp-dur{ gap:8px; padding-top:18px; }
  .am-exp-dur__chips{ --f:22px; width:100%; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden;
    overscroll-behavior-x:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch;
    margin:0 calc(var(--am-gutter) * -1); padding:2px var(--am-gutter);
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - var(--f)),transparent 100%);
            mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - var(--f)),transparent 100%); }
  .am-exp-dur__chips::-webkit-scrollbar{ display:none; }
  .am-exp-dur__chips:focus-within{ -webkit-mask-image:none; mask-image:none; }
  .am-page .am-exp-dur .am-chip, .am-page .am-exp-dur button.am-chip{ padding:7px 14px !important; min-height:38px !important; font-size:.86rem !important; }
}

/* ------------------------- "CON QUIENES VIAJAS": ISOTIPO ------------------------- */
/* El isotipo (emblema circular) es el ::after de .am-community-band en am.css, el mismo de la portada.
   Aqui solo se ubica detras del titulo en escritorio; en celular queda como en am.css. */
@media (min-width:960px){
  .am-community-band.am-exp-band::after{ right:auto; left:-10%; width:clamp(420px,46vw,700px); opacity:.09; }
}

/* r22b: la pastilla de Nomadas digitales es un enlace a una pagina (no filtra) y no heredaba el margen,
   la altura de linea ni la alineacion de las pastillas de categoria: quedaba 10 px mas arriba.
   r24: solo en /experiencias/ (barra con data-exp-filter), donde las demas pastillas son <button> y heredan ese
   margen. En las 7 categorias las demas son <a> sin margen y la regla la bajaba 10 px. */
.am-exp-bar[data-exp-filter] .am-chip--link{ display:inline-block; margin-top:10px; line-height:1.2; text-align:center; }

/* r23 · Hero de Experiencias y de las categorias en tablet vertical (reunion del 29-sep: fotos "expandidas").
   Medido antes a 820x1180: 820x900, Las Grietas al 51 %. El contenido sigue mandando si necesita mas alto. */
@media (min-width:600px) and (max-width:1023px) and (orientation:portrait){
  .am-exp-hero, .am-exp-hero--cat{ min-height:clamp(540px,60svh,720px); }
}
@media (max-width:599px) and (orientation:portrait){
  .am-exp-hero--cat{ min-height:clamp(480px,68svh,640px); }
}

/* r23b: la misma vista previa de fotos en tablet y celular (am.js/experiencias.php pone html.am-peek-touch cuando
   corresponde: no en modo liviano ni en "ninguna"). La tarjeta que esta a la vista rota sola; el toque pasa a la ficha. */
html.am-peek-touch .am-exp-row__cover > .am-exp-row__peek{ display:block; position:absolute; inset:0; z-index:2; width:100%; height:100%; object-fit:cover;
  clip-path:inset(0 0 0 100%); pointer-events:none; }
html.am-peek-touch .am-exp-row__cover > .am-exp-row__peek.is-on{ clip-path:inset(0 0 0 0); transition:clip-path 1.5s var(--am-ease); }
html.am-peek-touch.am-motion-suave .am-exp-row__cover > .am-exp-row__peek{ clip-path:none; opacity:0; }
html.am-peek-touch.am-motion-suave .am-exp-row__cover > .am-exp-row__peek.is-on{ opacity:1; transition:opacity .4s ease; }
html.am-peek-touch .am-exp-row__media.is-leaving .am-exp-row__peek{ opacity:0; transition:opacity .45s var(--am-ease); }

/* =========================================================================
   r24 · Menos aire entre la barra y el primer tour (bitacora del cliente del 28-sep: "mucho espacio entre menu o
   todas las experiencias y el primer tour Nido de Vida"). Medido antes en /experiencias/: 921 px a 1440 y 818 a 390
   (relleno de la seccion 108 + cabecera + 72 + relleno del grupo 108 + margen del encabezado 79-84); en las
   categorias, 546-566 px. Se recorta el relleno, no el contenido: los grupos siguen con su banda de color.
   ========================================================================= */
.am-page .am-section.am-exp-list{ padding-top:var(--am-sec-y-tight); }
.am-exp-list__head, .am-exp-list.has-groups .am-exp-list__head{ margin-bottom:clamp(28px,3.2vw,48px); }
.am-exp-rows > .am-exp-cgroup:first-child{ padding-top:clamp(36px,3.6vw,56px); }
.am-exp-cgroup > .am-exp-group{ margin-bottom:clamp(32px,3.6vw,56px); }
@media (max-width:599px){
  .am-exp-rows > .am-exp-cgroup:first-child{ padding-top:36px; }
  .am-exp-cgroup > .am-exp-group{ margin-bottom:28px; }
}

/* =========================================================================
   r26 (2-oct) · Titulo "Elige tu experiencia en ..." tambien en categorias de una sola experiencia
   (Aviturismo, Fotografia, Tours Educativos, Conoce el Mundo) y botones de subcategoria (Conoce el Mundo:
   Comunidades / Tradicional). Bitacora del cliente del 30-sep y 1-oct.
   ========================================================================= */
.am-exp-list__head--single.has-title{ row-gap:18px; }
.am-exp-list__head--single .am-exp-list__titles{ min-width:0; }
@media (min-width:900px){
  .am-exp-list__head--single.has-title,
  .am-exp-list__head--single.has-title.no-dur{ grid-template-columns:minmax(0,1fr) auto; column-gap:40px; align-items:end; }
  .am-exp-list__head--single.has-title > .am-exp-list__titles{ grid-column:1; grid-row:1; align-self:end; }
  .am-exp-list__head--single.has-title > .am-exp-dur{ grid-column:1; grid-row:2; align-self:start; }
  .am-exp-list__head--single.has-title > .am-exp-howto{ grid-column:2; grid-row:1 / span 2; align-self:end; justify-self:stretch; }
  .am-exp-list__head--single.has-title > .am-exp-sub{ grid-column:1; grid-row:2; align-self:start; }
  .am-exp-list__head--single.has-title.has-sub:not(.no-dur) > .am-exp-sub{ grid-row:3; }
  .am-exp-list__head--single.has-title.no-dur:not(.has-sub) > .am-exp-howto{ grid-row:1; }
}

/* Botones de subcategoria: botones de verdad (no pastillas pequenas), con sombra suave "flotante". */
.am-exp-list__head > .am-exp-sub{ grid-column:1 / -1; }
.am-exp-sub__chips{ display:flex; flex-wrap:wrap; gap:10px 12px; list-style:none; margin:0; padding:0; }
.am-page .am-exp-sub__chips li{ margin:0; padding:0; list-style:none; }
.am-page .am-exp-sub__chips li::before{ content:none; }
.am-page .am-exp-sub__btn{ display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:0 28px; border-radius:999px;
  border:1.5px solid rgba(55,70,49,.28); background:#fff; color:var(--am-green-800) !important; text-decoration:none !important;
  font-family:var(--am-font-display); font-size:1.02rem; font-weight:600; letter-spacing:.005em; line-height:1.1;
  box-shadow:0 10px 24px -16px rgba(30,40,26,.55); transition:background-color .3s ease, border-color .3s ease, color .3s ease, box-shadow .3s ease, transform .3s ease; }
.am-page .am-exp-sub__btn:hover{ border-color:var(--cat-ac,var(--am-green)); transform:translateY(-2px); box-shadow:0 14px 28px -16px rgba(30,40,26,.6); }
.am-page .am-exp-sub__btn:focus-visible{ outline:2px solid var(--am-terracotta); outline-offset:3px; }
.am-page .am-exp-sub__btn.is-active{ background:var(--cat-ac,var(--am-green)); border-color:var(--cat-ac,var(--am-green)); color:#fff !important; }
@media (prefers-reduced-motion: reduce){ .am-page .am-exp-sub__btn, .am-page .am-exp-sub__btn:hover{ transition:none; transform:none; } }
html.am-motion-ninguna .am-page .am-exp-sub__btn, html.am-motion-ninguna .am-page .am-exp-sub__btn:hover{ transition:none; transform:none; }
@media (max-width:899px){
  /* en una columna los botones van antes del recuadro de cotizar: filtran la lista que sigue */
  .am-exp-list__head > .am-exp-sub{ order:1; }
  .am-exp-list__head > .am-exp-howto{ order:2; }
}
@media (max-width:599px){
  .am-exp-sub__chips{ gap:8px; flex-wrap:nowrap; }
  .am-page .am-exp-sub__btn{ min-height:46px; padding:0 16px; font-size:.92rem; white-space:nowrap; }
}
.am-exp-row.is-subout{ display:none; }
.am-exp-rows > .am-exp-row:nth-child(1 of .am-exp-row:not(.is-out):not(.is-subout)){ padding-top:0; background:none; }
.am-exp-rows > .am-exp-row:nth-last-child(1 of .am-exp-row:not(.is-out):not(.is-subout)){ padding-bottom:0; }

/* Subcategoria sin experiencias todavia: aviso breve y CTA para cotizar. */
.am-exp-sub__empty{ display:grid; gap:16px; justify-items:start; margin:0 0 clamp(28px,3.2vw,48px); padding:clamp(20px,2.4vw,30px);
  border-radius:var(--am-r-lg,22px); background:#fff; border:1.5px solid rgba(55,70,49,.14); box-shadow:0 12px 30px -22px rgba(30,40,26,.5); }
.am-exp-sub__empty[hidden]{ display:none; }
.am-page .am-exp-sub__empty-t{ margin:0 !important; max-width:56ch; font-family:var(--am-font-display); font-size:clamp(1.05rem,1.3vw,1.2rem); line-height:1.5; color:var(--am-green-800) !important; }
.am-exp-sub__empty .am-btns{ margin:0; }
@media (max-width:599px){ .am-exp-sub__empty .am-btn{ width:100%; justify-content:center; } }

/* r28: barra de categorias SIEMPRE en una sola linea (pedido de David el 2-oct). Medidas en px para que no crezcan con el
   tamano de letra de pantallas grandes. Si en una pantalla chica no caben, se arrastra con el mouse o se mueve con la rueda
   (script en experiencias.php) y el degradado de la derecha avisa que hay mas. */
@media (min-width:1024px){
  .am-page .am-exp-bar__chips{ flex-wrap:nowrap; gap:6px; cursor:grab; }
  .am-page .am-exp-bar__chips.is-drag{ cursor:grabbing; user-select:none; }
  .am-page .am-exp-bar__chips.is-drag .am-chip{ pointer-events:none; }
  .am-exp-bar .am-chip, .am-page .am-exp-bar button.am-chip{ padding:8px 12px !important; font-size:13.5px !important; white-space:nowrap; }
}
@media (min-width:1024px) and (max-width:1439px){
  .am-exp-bar .am-chip, .am-page .am-exp-bar button.am-chip{ padding:7px 10px !important; font-size:12.5px !important; }
}
/* el rotulo de la izquierda (pantallas grandes) le quitaba espacio a las pastillas: fuera */
@media (min-width:1024px){ .am-exp-bar__label{ display:none !important; } }
