/* =========================
   FUENTES / TOKENS GLOBALES
   ========================= */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600&family=Amaranth:wght@700;800&display=swap');

:root{
  /* Marca */
  --brand: #9a9662;

  /* Paleta unificada */
  --oliva-base:#94905E;
  --oliva-prof:#6B705C;
  --crema:#F5F5EB;
  --arena:#C2B280;
  --carbon:#4A4A4A;
  --blanco-roto:#FAFAFA;
  --bosque:#556B5C;

  /* Fuentes del sitio (compatibles con SS) */
  --heading-font: var(--ss-heading-font,'Amaranth','Montserrat',system-ui,sans-serif);
  --body-font:    var(--ss-body-font,'Montserrat',system-ui,sans-serif);
}

/* ===============================
   Botones "EXPLORAR MÁS" (cards)
   =============================== */

/* Base .svc-btn (centralizada y reutilizable) */
.svc-btn{
  display:inline-block;
  padding:10px 18px;
  border:1.5px solid rgba(255,255,255,.95);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:.95rem;
  border-radius:8px;
  backdrop-filter:blur(2px);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition:
    transform .2s ease,
    box-shadow .25s ease,
    background .25s ease,
    border-color .25s ease,
    letter-spacing .2s ease,
    color .25s ease;
}

/* Brillo diagonal sutil solo cuando el botón está dentro de .svc-card */
.svc-card .svc-btn::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.35) 45%, transparent 70%);
  transform: translateX(-120%) skewX(-18deg);
  transition: transform .6s ease;
  pointer-events: none;
}

/* Hover + Focus (usa color de marca) */
.svc-card .svc-btn:hover,
.svc-card .svc-btn:focus-visible{
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.35), 0 0 0 2px rgba(255,255,255,.18) inset;
  transform: translateY(-2px);
  letter-spacing: .02em;
  outline: none;
}
.svc-card .svc-btn:hover::after,
.svc-card .svc-btn:focus-visible::after{
  transform: translateX(120%) skewX(-18deg);
}

/* Click */
.svc-card .svc-btn:active{
  transform: translateY(0);
  box-shadow: 0 4px 10px rgba(0,0,0,.25) inset;
}

/* =========================
   MENÚ TOP con subrayado
   ========================= */
@media (min-width: 992px) {
  .menu-item {
    position: relative;
    display: inline-block;
    padding: 0 10px;
    font-family: "Oswald", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: inherit;
    text-decoration: none;
    transition: color .25s ease;
  }
  .menu-item::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 0%;
    height: 2px;
    background-color: var(--carbon);
    transition: width .45s cubic-bezier(.25,.8,.25,1);
  }
  .menu-item:hover::after,
  .menu-item.is-active::after { width: 100%; }
}

/* =========================
   FOOTER (asegurar visibilidad)
   ========================= */
footer { display: block; visibility: visible; opacity: 1; }
.footer-top, .footer-contacts, .contact-row, .datos-contacto { display: block; }
@media (min-width: 768px){ .contact-row { display: flex; } }

/* =========================
   DROPDOWN con fondo/overlay
   ========================= */
a.dropdown-item{
  position: relative;
  overflow: hidden;
  z-index: 0;
  transition: color .3s ease;
  border-radius: 0;
}
a.dropdown-item::before{
  content: "";
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 1s ease;
  z-index: -2;
  pointer-events: none;
}
a.dropdown-item::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.35) 40%, rgba(0,0,0,.65));
  opacity: 0;
  transition: opacity 1s ease;
  z-index: -1;
  pointer-events: none;
}
a.dropdown-item:hover{ color: #F5F5EB; }
a.dropdown-item:hover::before, a.dropdown-item:hover::after{ opacity: 1; }

/* Imágenes por ítem */
a.dropdown-item[href="/destinos-en-peru"]::before{
  background-image: url('https://ss-static-001.esmsv.com/r/content/host2/0f9a703e0154affc2f31e633c768a5b2//editor/bandera-peru-1.webp');
}
a.dropdown-item[href="/destinos-en-argentina"]::before{
  background-image: url('https://ss-static-001.esmsv.com/r/content/host2/0f9a703e0154affc2f31e633c768a5b2//editor/bandera-argentina-1.webp');
}
a.dropdown-item[href="/otros-servicios"]::before{
  background-image: url('https://ss-static-001.esmsv.com/r/content/host2/0f9a703e0154affc2f31e633c768a5b2//editor/otros-servicios-1.webp');
}

/* =====================================
   Botón con “serpiente” conic-gradient
   ===================================== */
@property --p { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

a.btn.btn-primary{
  position: relative;
  z-index: 0;
  overflow: visible;
  --snake-color: var(--oliva-base);
  --b: 2px;
  --dur: 1.5s;
  --start: 0deg;
  color: var(--crema);
  text-decoration: none;
}
a.btn.btn-primary::before{
  content: "";
  position: absolute;
  inset: calc(-1 * var(--b));
  border-radius: inherit;
  padding: var(--b);
  pointer-events: none;
  z-index: 0;
  --p: 0deg;
  background:
    conic-gradient(from var(--start),
      var(--snake-color) 0deg var(--p),
      transparent var(--p) 360deg);
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  transition: --p var(--dur) linear, filter .25s ease;
}
a.btn.btn-primary:hover::before{
  --p: 360deg;
  filter: drop-shadow(0 0 6px rgba(148,144,94,.55));
}

/* =========================
   BLOQUES “QUIÉNES SOMOS”
   ========================= */
[data-ss-rich-paragraph="true"] .qs-wrap{max-width:1200px;margin:0 auto;padding:0 20px}
[data-ss-rich-paragraph="true"] .qs-hero{
  position:relative; isolation:isolate;
  padding:clamp(48px,6vw,72px) 0;
  color:var(--crema);
  background:var(--carbon);
}
[data-ss-rich-paragraph="true"] .qs-hero::before{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background-image:
    linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.35) 40%, rgba(0,0,0,.65)),
    var(--hero-bg);
  background-size:cover,cover;
  background-position:center,center;
}
[data-ss-rich-paragraph="true"] .qs-header h2{
  font-family:var(--heading-font); font-weight:700; letter-spacing:.5px;
  margin:0 0 10px; font-size:clamp(28px,4vw,40px)
}
[data-ss-rich-paragraph="true"] .qs-lead{ font:600 16px/1.6 var(--body-font); color:var(--crema); margin:0 0 8px }
[data-ss-rich-paragraph="true"] .qs-sub{ font:500 15px/1.6 var(--body-font); color:rgba(245,245,235,.85); margin:0 0 26px }

/* TEAM */
[data-ss-rich-paragraph="true"] .qs-team{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.2vw,28px)
}
[data-ss-rich-paragraph="true"] .qs-card{
  background:#1f2220; border:1px solid rgba(148,144,94,.6);
  border-radius:18px; overflow:hidden;
  box-shadow:0 10px 26px rgba(0,0,0,.25);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease
}
[data-ss-rich-paragraph="true"] .qs-card:hover{
  transform:translateY(-4px); border-color:var(--oliva-base);
  box-shadow:0 16px 34px rgba(0,0,0,.35)
}
[data-ss-rich-paragraph="true"] .qs-photo{aspect-ratio:1/1;background:#222}
[data-ss-rich-paragraph="true"] .qs-photo img{width:100%;height:100%;object-fit:cover;display:block}
[data-ss-rich-paragraph="true"] .qs-body{padding:18px 18px 20px;color:var(--crema)}
[data-ss-rich-paragraph="true"] .qs-body h3{
  font-family:var(--heading-font); font-weight:700; margin:0 0 8px;
  font-size:clamp(18px,2.4vw,22px); color:var(--crema); text-shadow:0 1px 0 rgba(0,0,0,.35)
}
[data-ss-rich-paragraph="true"] .qs-body p{margin:0;font:400 14.5px/1.75 var(--body-font);color:rgba(245,245,235,.92)}
[data-ss-rich-paragraph="true"] .qs-body em{font-style:normal;color:var(--arena)}

/* DIFERENCIA */
[data-ss-rich-paragraph="true"] .qs-diff{background:var(--crema);padding:clamp(40px,6vw,64px) 0}
[data-ss-rich-paragraph="true"] .qs-diff-title{
  font-family:var(--heading-font); color:var(--carbon); text-align:center;
  font-weight:800; letter-spacing:2px; margin:0 0 28px
}
[data-ss-rich-paragraph="true"] .qs-diff-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px
}
[data-ss-rich-paragraph="true"] .qs-diff-card{
  background:var(--blanco-roto);
  border:1px solid rgba(148,144,94,.45);
  border-radius:10px; padding:26px 22px;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease
}
[data-ss-rich-paragraph="true"] .qs-diff-card:hover{
  transform:translateY(-3px); border-color:var(--oliva-base);
  box-shadow:0 12px 26px rgba(0,0,0,.10)
}
[data-ss-rich-paragraph="true"] .qs-icon{height:64px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
[data-ss-rich-paragraph="true"] .qs-icon img{max-height:64px}
[data-ss-rich-paragraph="true"] .qs-diff-card h3{
  font-family:var(--heading-font); color:var(--oliva-prof); font-size:20px; margin:6px 0 10px
}
[data-ss-rich-paragraph="true"] .qs-diff-card p{color:var(--carbon); font:400 14.5px/1.8 var(--body-font); margin:0}

/* Responsive de QS */
@media (max-width:1024px){
  [data-ss-rich-paragraph="true"] .qs-team{grid-template-columns:1fr 1fr}
  [data-ss-rich-paragraph="true"] .qs-diff-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  [data-ss-rich-paragraph="true"] .qs-team,
  [data-ss-rich-paragraph="true"] .qs-diff-grid{grid-template-columns:1fr}
  [data-ss-rich-paragraph="true"] .qs-body{padding:16px}
}

/* Mobile fine-tuning (≤600px) */
@media (max-width: 600px){
  [data-ss-rich-paragraph="true"] .qs-wrap{ padding-inline:16px }
  [data-ss-rich-paragraph="true"] .qs-header h2{ font-size:26px; line-height:1.15; margin-bottom:10px }
  [data-ss-rich-paragraph="true"] .qs-lead{ font-weight:600; font-size:15.5px; line-height:1.55 }
  [data-ss-rich-paragraph="true"] .qs-sub{ font-size:14.5px; line-height:1.55; margin-bottom:20px }
  [data-ss-rich-paragraph="true"] .qs-team{ gap:16px }
  [data-ss-rich-paragraph="true"] .qs-photo{ aspect-ratio:auto; max-height:360px; overflow:hidden }
  [data-ss-rich-paragraph="true"] .qs-photo img{ width:100%; height:100%; object-fit:cover; object-position:center top; display:block }
  [data-ss-rich-paragraph="true"] .qs-body{ padding:14px 14px 16px }
  [data-ss-rich-paragraph="true"] .qs-body h3{ font-size:19px; margin-bottom:6px }
  [data-ss-rich-paragraph="true"] .qs-body p{ font-size:14px; line-height:1.6 }
  [data-ss-rich-paragraph="true"] .qs-diff{ padding-top:28px; padding-bottom:40px }
  [data-ss-rich-paragraph="true"] .qs-diff-title{ font-size:20px; letter-spacing:1.2px; margin-bottom:16px }
  [data-ss-rich-paragraph="true"] .qs-diff-grid{ gap:14px }
  [data-ss-rich-paragraph="true"] .qs-diff-card{ padding:18px 16px }
  [data-ss-rich-paragraph="true"] .qs-diff-card h3{ font-size:18px; margin:4px 0 6px }
  [data-ss-rich-paragraph="true"] .qs-diff-card p{ font-size:14px; line-height:1.6 }
  [data-ss-rich-paragraph="true"] .qs-hero{ padding-block:36px }
}

/* =========================
   SECCIÓN DESTINOS (grid)
   ========================= */
.svc-section{
  position: relative;
  padding: clamp(36px, 4vw, 56px) 0;
  background:
    radial-gradient(150% 100% at 0% 0%, rgba(0,0,0,.16) 0%, rgba(0,0,0,0) 70%),
    linear-gradient(180deg, #94905E 0%, #556B5C 100%);
}
.svc-section::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.25;
  background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.18)), var(--bg);
  background-size: cover; background-position: center;
  mix-blend-mode: multiply;
}
.svc-wrap{
  max-width: 1200px; margin: 0 auto; padding: 0 20px; position:relative; z-index:1;
  display: grid; grid-template-columns: auto 1fr; align-items: center; gap: clamp(32px, 4vw, 64px);
}
.svc-title{
  color:#F5F5EB; text-align:left; align-self:center; max-width:360px;
}
.svc-title h2{
  font-family: var(--heading-font);
  font-weight: 800; line-height: 1.05; letter-spacing: .5px;
  font-size: clamp(34px, 4.2vw, 52px);
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
  margin: 0;
}
.svc-grid{ display:grid; grid-template-columns: repeat(3, minmax(320px, 1fr)); gap: clamp(16px, 2vw, 28px) }
.svc-card{
  position:relative; height: 620px; border-radius:16px; overflow:hidden;
  border:1px solid rgba(250,250,250,.22);
  box-shadow:0 16px 36px rgba(0,0,0,.30);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.svc-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 22px 48px rgba(0,0,0,.36);
  border-color: rgba(250,250,250,.35);
}
.svc-card > img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; filter: contrast(.95) brightness(.88);
  transform: scale(1); transition: transform .8s ease;
}
.svc-card:hover > img{ transform: scale(1.04); }
.svc-grad{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.78) 100%);
}
.svc-badge{
  position:absolute; top:16px; right:16px;
  font-size:.8rem; color:#fff; letter-spacing:.08em; opacity:.95;
  padding:6px 10px; border-radius:999px; background:rgba(0,0,0,.35);
  border:1px solid rgba(148,144,94,.65); font-weight:700;
}
.svc-body{ position:absolute; left:18px; right:18px; bottom:18px; color:#fff; }
.svc-body p{ margin:0 0 4px; font-size:.9rem; opacity:.95; letter-spacing:.08em; color:#F5F5EB; }
.svc-body h3{
  margin:0 0 12px; font-size:1.45rem; font-weight:800; color:#F5F5EB;
  font-family: var(--heading-font);
}
@media (max-width: 1199.98px){ .svc-card{ height:560px } }
@media (max-width: 991.98px){
  .svc-wrap{ grid-template-columns: 1fr; align-items: start; gap: 24px }
  .svc-title{ max-width: none; text-align: center; margin-bottom: 4px }
  .svc-grid{ grid-template-columns: repeat(2, minmax(280px,1fr)) }
  .svc-card{ height:520px }
}
@media (max-width: 575.98px){
  .svc-grid{ grid-template-columns: 1fr }
  .svc-card{ height:440px }
  .svc-title h2{ font-size: 34px }
}

/* Títulos “pd-title” (usa Amaranth) */
h1.pd-title,
#peru-destinos .pd-title,
#argentina-destinos .pd-title,
#otros-servicios .pd-title{
  font-family:'Amaranth', var(--heading-font);
  font-weight:800; letter-spacing:.5px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  font-size: clamp(28px, 4.6vw, 48px);
  margin: 0 0 18px;
}

/* =========================================
   DESTINOS EN PERÚ (panel + carrusel limpio)
   ========================================= */
#peru-destinos{
  --oliva-elegante: var(--oliva-base);
  --oliva-profundo: var(--oliva-prof);
  --crema-suave: var(--crema);
  --arena-dorada: var(--arena);
  --gris-carbon: var(--carbon);
  --blanco-roto: var(--blanco-roto);
  --verde-bosque: var(--bosque);

  --radius-xl: 22px;
  --radius-lg: 18px;
  --shadow-elev: 0 14px 30px rgba(0,0,0,.18), 0 3px 6px rgba(0,0,0,.12);
  --overlay: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.55) 100%);
  --overlay-strong: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.5) 60%, rgba(0,0,0,.8) 100%);
}
.peru-destinos{
  background: var(--gris-carbon);
  padding: 48px 18px 80px;
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color: #fff;
}
.peru-destinos .pd-container{ max-width: 1200px; margin: 0 auto; }
.peru-destinos .pd-title{ text-align:center; font-size:clamp(28px,4.6vw,48px); font-weight:800; margin:0 0 18px; color:#fff }
.peru-destinos .pd-sub{ text-align:center; max-width:760px; margin:0 auto 28px; color:#e8e8e8; font-size:clamp(14px,2vw,18px) }

/* Panel (details transparente) */
.peru-destinos .city-panel{ background: transparent; border: 0; box-shadow: none; overflow: visible; margin: 22px 0 30px }
.peru-destinos .city-panel[open] .btn-toggle svg{ transform: rotate(180deg) }

/* Header */
.peru-destinos .city-header{
  list-style:none; cursor:pointer;
  position:relative; min-height:96px; padding:22px;
  display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center;
  color:#fff; background-position:center; background-size:cover; border-radius:22px;
  border:1px solid rgba(255,255,255,.12); box-shadow:0 10px 28px rgba(0,0,0,.24);
  isolation:isolate; overflow:hidden;
}
.peru-destinos .city-header::-webkit-details-marker{ display:none }
.peru-destinos .city-header::marker{ content:"" }
.peru-destinos .city-header::after{
  content:""; position:absolute; inset:0; background: var(--overlay-strong);
  pointer-events:none; z-index:0; border-radius: inherit;
}
.peru-destinos .city-name{
  position:relative; z-index:1;
  font-size:clamp(20px,3.2vw,28px); font-weight:800; text-shadow:0 2px 14px rgba(0,0,0,.45);
  display:flex; align-items:center; gap:10px;
}
.peru-destinos .city-name .badge{
  display:inline-block; font-size:12px; letter-spacing:.8px; padding:6px 10px; border-radius:999px;
  background: rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.3); backdrop-filter: blur(3px);
}
.peru-destinos .city-actions{ position:relative; z-index:1; display:inline-flex; align-items:center; gap:10px }
.peru-destinos .btn{
  appearance:none; border:none; border-radius:999px; padding:10px 16px;
  font-weight:700; font-size:14px; white-space:nowrap; line-height:1; user-select:none;
}
.peru-destinos .btn-about{ background: rgba(250,250,250,.9); color: var(--gris-carbon); border:1px solid rgba(255,255,255,.6) }
.peru-destinos .btn-about:hover{ background:#fff }
.peru-destinos .btn-toggle{ display:inline-flex; align-items:center; gap:8px; background: var(--oliva-elegante); color:#fff; box-shadow: 0 6px 18px rgba(148,144,94,.32) }
.peru-destinos .btn-toggle svg{ width:18px; height:18px; transition: transform .25s ease }

/* Body */
.peru-destinos .city-body{ display:none; margin-top:14px; padding:0; background:transparent; border:0 }
.peru-destinos .city-panel[open] .city-body{ display:block }

/* Carrusel */
.peru-destinos .excursions-wrap{ padding:0 }
.peru-destinos .excursions-carousel{ position: relative }
.peru-destinos .exc-viewport{
  position:relative; overflow:hidden;
  padding: 8px 0 12px; margin: -8px 0 -12px;
  transform: translateZ(0);
}
.peru-destinos .exc-track{
  --gap:16px; --cols:4;
  display:flex; gap:var(--gap);
  will-change:transform; transition: transform .45s ease;
  padding:0;
}
.peru-destinos .exc-card{
  flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols) - .1px);
  position: relative; height: 360px;
  border-radius: 18px; overflow: hidden;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  box-shadow: var(--shadow-elev); display:flex; align-items:flex-end; color:#fff; isolation:isolate;
}
.peru-destinos .exc-card::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.78) 100%);
  z-index: 0; pointer-events: none; border-radius: inherit;
}
.peru-destinos .exc-content{ width:100%; padding:16px; display:grid; gap:10px; position:relative; z-index:1 }
.peru-destinos .exc-title{
  font-size:1.25rem; font-weight:800; color:#F5F5EB;
  font-family: var(--heading-font); margin:0 0 8px; text-shadow:0 1px 0 rgba(0,0,0,.35);
}

/* Reusa botón global */
#peru-destinos .svc-card .svc-btn{ /* (hereda de .svc-btn) */ }

/* Paginación */
.peru-destinos .exc-dots{
  display:flex; justify-content:center; align-items:center; gap:10px;
  padding: 12px 0 0; z-index:2;
}
.peru-destinos .exc-dot{
  width:10px; height:10px; border-radius:50%;
  background: rgba(0,0,0,.30);
  border:1px solid rgba(255,255,255,.7);
  cursor:pointer; transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.peru-destinos .exc-dot[aria-current="true"]{
  background:var(--oliva-base); box-shadow:0 0 0 2px rgba(255,255,255,.35);
  transform: scale(1.12);
}

/* Flechas */
.peru-destinos .exc-nav-btn{
  position:absolute; top:50%; transform: translateY(-50%);
  width:40px; height:40px; border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  background: var(--oliva-base); color:#fff; border:1px solid rgba(255,255,255,.5);
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
  cursor:pointer; transition: filter .2s ease, transform .2s ease; z-index:3;
}
.peru-destinos .exc-nav-btn:hover{ filter:brightness(1.06); transform:translateY(-50%) scale(1.05) }
.peru-destinos .exc-nav-prev{ left:-6px }
.peru-destinos .exc-nav-next{ right:-6px }
.peru-destinos .exc-nav-btn[disabled]{ opacity:.45; cursor:default; filter:grayscale(40%) }

@media (max-width: 959.98px){ .peru-destinos .exc-track{ --cols:2 } }
@media (max-width: 639.98px){ .peru-destinos .exc-track{ --cols:1 } }

/* =========================================
   DESTINOS EN ARGENTINA (alineado a Perú)
   ========================================= */
#argentina-destinos{
  --oliva-elegante: var(--oliva-base);
  --oliva-profundo: var(--oliva-prof);
  --crema-suave: var(--crema);
  --arena-dorada: var(--arena);
  --gris-carbon: var(--carbon);
  --blanco-roto: var(--blanco-roto);
  --verde-bosque: var(--bosque);

  --radius-xl: 22px;
  --radius-lg: 18px;
  --shadow-elev: 0 14px 30px rgba(0,0,0,.18), 0 3px 6px rgba(0,0,0,.12);
  --overlay-strong: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.5) 60%, rgba(0,0,0,.75) 100%);
}
.arg-destinos{
  background: var(--gris-carbon);
  padding: 48px 18px 80px;
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color: #fff;
}
.arg-destinos .pd-container{ max-width:1200px; margin:0 auto }
.arg-destinos .pd-title{ text-align:center; font-size:clamp(28px,4.6vw,48px); font-weight:800; margin:0 0 18px; color:#fff }
.arg-destinos .pd-sub{ text-align:center; max-width:760px; margin:0 auto 28px; color:#e8e8e8; font-size:clamp(14px,2vw,18px) }

.arg-destinos .city-panel{ background: transparent; border:0; box-shadow:none; overflow:visible; margin:18px 0 28px }
.arg-destinos .city-panel[open] .btn-toggle svg{ transform: rotate(180deg) }
.arg-destinos .city-header{
  list-style:none; cursor:pointer; position:relative; min-height:96px; padding:22px;
  display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center;
  color:#fff; background-position:center; background-size:cover; border-radius:22px;
  border:1px solid rgba(255,255,255,.12); box-shadow:0 10px 28px rgba(0,0,0,.24);
  isolation:isolate; overflow:hidden;
}
.arg-destinos .city-header::-webkit-details-marker{ display:none }
.arg-destinos .city-header::marker{ content:"" }
.arg-destinos .city-header::after{
  content:""; position:absolute; inset:0; background: var(--overlay-strong);
  pointer-events:none; z-index:0; border-radius:inherit;
}
.arg-destinos .city-name{
  position:relative; z-index:1; font-size:clamp(20px,3.2vw,28px); font-weight:800;
  text-shadow:0 2px 14px rgba(0,0,0,.45); display:flex; align-items:center; gap:10px;
}
.arg-destinos .city-name .badge{
  display:inline-block; font-size:12px; letter-spacing:.8px; padding:6px 10px; border-radius:999px;
  background: rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.3); backdrop-filter: blur(3px);
}
.arg-destinos .city-actions{ position:relative; z-index:1; display:inline-flex; align-items:center; gap:10px }
.arg-destinos .btn{
  appearance:none; border:none; border-radius:999px; padding:10px 16px;
  font-weight:700; font-size:14px; white-space:nowrap; line-height:1; user-select:none;
}
.arg-destinos .btn-about{ background: rgba(250,250,250,.9); color: var(--gris-carbon); border:1px solid rgba(255,255,255,.6) }
.arg-destinos .btn-about:hover{ background:#fff }
.arg-destinos .btn-toggle{ display:inline-flex; align-items:center; gap:8px; background: var(--oliva-elegante); color:#fff; box-shadow: 0 6px 18px rgba(148,144,94,.32) }
.arg-destinos .btn-toggle svg{ width:18px; height:18px; transition: transform .25s ease }

.arg-destinos .city-body{ overflow:hidden; background: linear-gradient(180deg, #FAFAFA 0%, #F5F5EB 100%); border-top:1px solid rgba(0,0,0,.06); max-height:0; transition:max-height .45s ease }
.arg-destinos .city-panel[open] .city-body{ max-height:1200px }

.arg-destinos .excursions-wrap{ padding:18px }
.arg-destinos .excursions-grid{ display:grid; gap:16px; grid-template-columns: repeat(1, minmax(0,1fr)) }
@media (min-width: 640px){ .arg-destinos .excursions-grid{ grid-template-columns: repeat(2, minmax(0,1fr)) } }
@media (min-width: 960px){ .arg-destinos .excursions-grid{ grid-template-columns: repeat(4, minmax(0,1fr)) } }

.arg-destinos .exc-card{
  position:relative; height:230px; border-radius: 18px; overflow:hidden;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  box-shadow: var(--shadow-elev); display:flex; align-items:flex-end; color:#fff; isolation:isolate; text-decoration:none;
}
.arg-destinos .exc-card::before{ content:""; position:absolute; inset:0; background: var(--overlay); pointer-events:none; z-index:0; }
.arg-destinos .exc-content{ width:100%; padding:16px; display:grid; gap:10px; position:relative; z-index:1; }
.arg-destinos .exc-title{
  font-family: var(--heading-font); font-weight:800; font-size:1.25rem; color:#F5F5EB; margin:0 0 8px; text-shadow:0 1px 0 rgba(0,0,0,.35)
}

/* Match visual de .svc-card */
#argentina-destinos .exc-card.svc-card{
  border:1px solid rgba(250,250,250,.22);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  height:360px;
}
#argentina-destinos .exc-card.svc-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 22px 48px rgba(0,0,0,.36);
  border-color: rgba(250,250,250,.35);
}
@media (max-width: 991.98px){ #argentina-destinos .exc-card.svc-card{ height:320px } }
@media (max-width: 575.98px){ #argentina-destinos .exc-card.svc-card{ height:280px } }

/* =========================================
   OTROS SERVICIOS (alineado a Destinos)
   ========================================= */
#otros-servicios{
  --oliva-base:var(--oliva-base);
  --oliva-prof:var(--oliva-prof);
  --crema:var(--crema);
  --carbon:var(--carbon);
  --radius:16px;
  --shadow: 0 16px 36px rgba(0,0,0,.30);
}
.otros-servicios{
  background:
    linear-gradient(180deg, rgba(148,144,94,.55) 0%, rgba(148,144,94,.15) 100%),
    #6B705C;
  color:#fff; padding:48px 18px 80px;
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}
.otros-servicios .os-container{ max-width:1200px; margin:0 auto }
.otros-servicios .pd-title{ text-align:center; font-weight:800; color:#fff; font-size:clamp(28px,4.6vw,48px); margin:0 0 18px }
.otros-servicios .pd-sub{ text-align:center; max-width:760px; margin:0 auto 28px; color:rgba(245,245,235,.9); font-size:clamp(14px,2vw,18px) }
.otros-servicios .os-grid{ display:grid; grid-template-columns: repeat(3, minmax(280px,1fr)); gap: clamp(16px, 2vw, 28px) }

.otros-servicios .svc-card.os-card{
  position:relative; height:520px; border-radius:var(--radius);
  overflow:hidden; border:1px solid rgba(250,250,250,.22);
  box-shadow: var(--shadow);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  text-decoration:none;
}
.otros-servicios .svc-card.os-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 22px 48px rgba(0,0,0,.36);
  border-color: rgba(250,250,250,.35);
}
.otros-servicios .svc-card.os-card > img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; filter: contrast(.95) brightness(.88);
  transform: scale(1); transition: transform .8s ease;
}
.otros-servicios .svc-card.os-card:hover > img{ transform: scale(1.04) }
.otros-servicios .svc-grad{
  position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.78) 100%);
}
.otros-servicios .svc-badge{
  position:absolute; top:16px; right:16px;
  font-size:.8rem; color:#fff; letter-spacing:.08em;
  padding:6px 10px; border-radius:999px; background:rgba(0,0,0,.35);
  border:1px solid rgba(148,144,94,.65); font-weight:700;
}
.otros-servicios .svc-body{ position:absolute; left:18px; right:18px; bottom:18px; color:#fff }
.otros-servicios .svc-body p{ margin:0 0 4px; font-size:.9rem; opacity:.95; letter-spacing:.08em; color:var(--crema) }
.otros-servicios .svc-body h3{
  margin:0 0 12px; font-size:1.45rem; font-weight:800; color:var(--crema);
  font-family: var(--heading-font);
}
@media (max-width: 991.98px){
  .otros-servicios .os-grid{ grid-template-columns: repeat(2, minmax(0,1fr)) }
  .otros-servicios .svc-card.os-card{ height:480px }
}
@media (max-width: 575.98px){
  .otros-servicios .os-grid{ grid-template-columns: 1fr }
  .otros-servicios .svc-card.os-card{ height:420px }
}

/* =========================================
   COMPONENTE “Detalle de Excursión” (ssx-)
   ========================================= */
.ssx-excursion{
  --brand-oliva: var(--oliva-base);
  --brand-oliva-profundo: var(--oliva-prof);
  --brand-crema: var(--crema);
  --brand-arena: var(--arena);
  --brand-carbon: var(--carbon);
  --brand-blanco: var(--blanco-roto);
  --brand-bosque: var(--bosque);

  --color-bg: var(--brand-crema);
  --color-surface: var(--brand-blanco);
  --color-text: var(--brand-carbon);
  --color-primary: var(--brand-oliva);
  --color-accent: var(--brand-oliva-profundo);
  --color-muted: #E6E6DC;
  --color-success: var(--brand-bosque);
  --color-danger: #B24E4E;

  --font-base: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --fs-1: clamp(1.10rem, 1.2vw + .55rem, 1.45rem);
  --fs-2: clamp(1.35rem, 1.6vw + .65rem, 1.90rem);
  --fs-3: clamp(.94rem, .4vw + .8rem, 1.05rem);

  --maxw: 1140px;
  --radii: 14px;
  --radii-lg: 18px;
  --shadow-sm: 0 6px 16px rgba(0,0,0,.08);
  --shadow:    0 10px 26px rgba(0,0,0,.10);
  --space-1:.5rem; --space-2:1rem; --space-3:1.5rem; --space-4:2rem; --space-5:3rem;

  font-family: var(--font-base);
  color: var(--color-text);
  line-height: 1.55;
  background: transparent;
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: clamp(16px, 2.5vw, 24px);
  overflow-x: clip; /* evita barras por sombras internas */
}
.ssx-excursion, .ssx-excursion *{ box-sizing:border-box }
.ssx-excursion img{ display:block; max-width:100%; height:auto }

.ssx-excursion__title{ font-size: var(--fs-2); margin:0 0 var(--space-2); color:var(--brand-carbon) }
.ssx-excursion__subtitle{ font-size: var(--fs-1); margin:0 0 var(--space-2); color:var(--brand-carbon) }
.ssx-excursion__text{ font-size: var(--fs-3); color: var(--brand-carbon) }
.ssx-excursion__section {
    margin-block-start: 0;
    margin-block-end: var(--space-4);
}
.ssx-excursion__hero{ margin: 0 0 var(--space-4) }
.ssx-excursion__hero-img{
  width:100%; aspect-ratio: 28/4 !important; object-fit: cover;
  border-radius: 0; box-shadow: var(--shadow)
}
@media (min-width: 768px){ .ssx-excursion__hero-img{ aspect-ratio: 16/6 } }

.ssx-excursion__grid{ display:grid; gap: var(--space-4) }
@media (min-width:768px){ .ssx-excursion__grid{ grid-template-columns: 1fr .33fr; align-items:start } }
@media (min-width:1024px){ .ssx-excursion__grid{ grid-template-columns: minmax(0,1fr) 360px } }
@media (min-width:1440px){ .ssx-excursion__grid{ grid-template-columns: minmax(0,1fr) 400px } }

.ssx-excursion__section--intro{
  background: var(--color-surface);
  border: 1px solid var(--color-muted);
  border-radius: var(--radii-lg);
  padding: clamp(14px, 2vw, 22px);
  box-shadow: var(--shadow-sm);
}

.ssx-excursion__card{
  background: color-mix(in srgb, var(--brand-blanco) 85%, var(--brand-crema) 15%);
  border: 1px solid var(--color-muted);
  border-radius: var(--radii-lg);
  padding: var(--space-3);
  box-shadow: var(--shadow);
}
.ssx-excursion__card-title{ margin:0 0 var(--space-2); color: var(--brand-carbon) }

.ssx-excursion__form{ display:grid; gap: var(--space-2) }
.ssx-excursion__label{ font-weight:600; font-size:.95rem; color:var(--brand-carbon) }
.ssx-excursion__input, .ssx-excursion__textarea{
  width:100%; padding:.85rem 1rem; font-size:.98rem;
  border-radius: 12px; border:1px solid var(--color-muted); background:#fff;
}
.ssx-excursion__input:focus, .ssx-excursion__textarea:focus{
  outline: 2px solid color-mix(in srgb, var(--color-primary) 55%, transparent);
  border-color: var(--color-primary);
}
.ssx-excursion__btn{ border:0; padding:.9rem 1.1rem; border-radius:12px; cursor:pointer; font-weight:800; text-transform:uppercase; letter-spacing:.02em }
.ssx-excursion__btn--primary{ background: var(--color-accent); color:#fff; box-shadow: var(--shadow-sm) }
.ssx-excursion__btn--primary:hover{ filter: brightness(1.05) }

.ssx-excursion__carousel{
  display:grid; grid-auto-flow: column; grid-auto-columns: 88%;
  gap: var(--space-2); overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  padding-bottom: var(--space-1);
}
@media (min-width:768px){ .ssx-excursion__carousel{ grid-auto-columns: 50% } }
@media (min-width:1200px){ .ssx-excursion__carousel{ grid-auto-columns: 33.333% } }
.ssx-excursion__carousel::-webkit-scrollbar{ height:8px }
.ssx-excursion__carousel::-webkit-scrollbar-thumb{ background:#c7cabb; border-radius:8px }
.ssx-excursion__carousel-item{ scroll-snap-align:start; border-radius: var(--radii-lg); overflow:hidden; box-shadow: var(--shadow) }
.ssx-excursion__carousel-item img{ width:100%; height:100%; aspect-ratio:16/9; object-fit:cover }
.ssx-excursion__carousel-nav{ display:flex; gap: var(--space-2); justify-content:flex-end; margin-top: var(--space-2) }
.ssx-excursion__arrow{ display:inline-grid; place-items:center; width:40px; height:40px; border-radius:999px; background: var(--brand-carbon); color:#fff; text-decoration:none; font-size:1.4rem; box-shadow: var(--shadow-sm) }

.ssx-excursion__itinerary{ display:grid; gap: var(--space-3) }
.ssx-excursion__day{
  display:grid; grid-template-columns: 64px 1fr; gap: var(--space-2);
  background: var(--color-primary); color:#fff; border-radius: var(--radii-lg); box-shadow: var(--shadow); overflow:hidden;
}
.ssx-excursion__day-badge{
  background: color-mix(in srgb, var(--color-primary) 82%, black);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.15rem; font-weight:800;
}
.ssx-excursion__day-badge span{ font-size:.82rem; opacity:.9; letter-spacing:.06em; text-transform:uppercase }
.ssx-excursion__day-badge strong{ font-size:1.35rem; line-height:1 }
.ssx-excursion__day-content{ padding: var(--space-3) }
.ssx-excursion__day-title{ margin:0 0 .35rem }

.ssx-excursion__features{ display:grid; gap: var(--space-3) }
@media (min-width:768px){ .ssx-excursion__features{ grid-template-columns: 1fr 1fr } }
.ssx-excursion__features-col{
  background: var(--color-surface); border:1px solid var(--color-muted); border-radius: var(--radii-lg);
  padding: var(--space-3); box-shadow: var(--shadow-sm);
}
.ssx-excursion__list{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem }
.ssx-excursion__list-item{ display:flex; align-items:center; gap:.6rem }
.ssx-excursion__icon{ width:18px; height:18px; fill: var(--color-success); flex:0 0 auto }
.ssx-excursion__list-item--no .ssx-excursion__icon{ fill: var(--color-danger) }

.ssx-excursion__related{ margin-top: var(--space-5) }
.ssx-excursion__related-track{
  display:grid; grid-auto-flow: column; grid-auto-columns: 88%;
  gap: var(--space-3); overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  padding: var(--space-2) .25rem var(--space-1);
}
@media (min-width:768px){  .ssx-excursion__related-track{ grid-auto-columns: 50% } }
@media (min-width:1024px){ .ssx-excursion__related-track{ grid-auto-columns: 33% } }
.ssx-excursion__related-card{
  position:relative; height: clamp(340px, 42vw, 480px);
  border-radius: 20px; overflow:hidden; box-shadow: var(--shadow);
  background: linear-gradient(to bottom, rgba(0,0,0,.15) 8%, rgba(0,0,0,.55) 65%, rgba(0,0,0,.85) 100%), var(--bg) center/cover no-repeat;
  scroll-snap-align: start;
}
.ssx-excursion__badge{
  position:absolute; top:14px; right:14px;
  background: rgba(74,74,74,.85); color:#fff; font-weight:800; letter-spacing:.04em; text-transform:uppercase; font-size:.78rem;
  padding:.4rem .7rem; border-radius:999px; border:1px solid rgba(255,255,255,.2);
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.ssx-excursion__related-content{
  position:absolute; inset:auto 0 0 0; padding: 1.1rem 1.2rem 1.25rem; display:grid; gap:.55rem;
}
.ssx-excursion__kicker{ color: rgba(255,255,255,.88); text-transform: uppercase; letter-spacing:.12em; font-weight:700; font-size:.8rem }
.ssx-excursion__related-title{
  margin:0; color:#fff; font-weight:800; font-size: clamp(1.05rem, 1.2vw + .7rem, 1.55rem);
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
}
.ssx-excursion__cta{
  margin-top:.4rem; display:inline-block; text-decoration:none; color:#fff; font-weight:800;
  text-transform:uppercase; letter-spacing:.04em; padding:.65rem .9rem;
  border-radius:12px; border:2px solid rgba(255,255,255,.9);
  background: rgba(255,255,255,.05); box-shadow: 0 6px 20px rgba(0,0,0,.35);
}
.ssx-excursion__cta:hover{ background: rgba(255,255,255,.12) }
.ssx-excursion__related-nav{ display:flex; gap: var(--space-2); justify-content:flex-end; margin-top: var(--space-2) }
.ssx-excursion__related-nav .ssx-excursion__arrow{ background: var(--brand-carbon); color:#fff }

/* Full-bleed opcional */
@media (min-width: 1024px){
  .ssx-excursion{
    --edge-padding: clamp(16px, 3vw, 40px);
    width: 100vw; max-width: 100vw;
    margin-left: 50%; transform: translateX(-50%);
    padding-inline: var(--edge-padding);
  }
  .ssx-excursion[data-boxed="true"]{
    width:auto; max-width: var(--maxw);
    transform:none; margin-inline:auto;
    padding-inline: clamp(16px, 2.5vw, 24px);
  }
}
/* ====== DESTINOS (Perú + Argentina) — carrusel horizontal unificado ====== */

/* 0) Fondo oscuro coherente y body sin “cajas” */
#peru-destinos .peru-destinos,
#argentina-destinos .arg-destinos{ background:#4A4A4A; color:#fff; }
#peru-destinos .city-panel,
#argentina-destinos .city-panel{ background:transparent; border:0; box-shadow:none; overflow:visible; margin:22px 0 30px; }
#peru-destinos .city-body,
#argentina-destinos .city-body{ display:none; margin-top:14px; padding:0; background:transparent; border:0; }
#peru-destinos .city-panel[open] .city-body,
#argentina-destinos .city-panel[open] .city-body{ display:block; }

/* 1) Cabecera igual en ambos */
#peru-destinos .city-header,
#argentina-destinos .city-header{
  position:relative; min-height:96px; padding:22px;
  display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center;
  color:#fff; background-position:center; background-size:cover; border-radius:22px;
  border:1px solid rgba(255,255,255,.12); box-shadow:0 10px 28px rgba(0,0,0,.24);
  overflow:hidden; isolation:isolate;
}
#peru-destinos .city-header::after,
#argentina-destinos .city-header::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.5) 60%, rgba(0,0,0,.8) 100%);
  pointer-events:none; border-radius:inherit;
}

/* 2) CONTENEDOR SCROLLER — usa SIEMPRE .excursions-grid o .exc-track */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{ padding:0; }

#peru-destinos :is(.excursions-grid, .exc-track),
#argentina-destinos :is(.excursions-grid, .exc-track){
  --gap:16px;
  --cols:4;                                /* 4 por vista (desktop) */
  display:grid;
  grid-auto-flow: column;                   /* UNA sola fila */
  grid-auto-columns: calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  gap: var(--gap);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;            /* snap opcional */
  padding: 8px 0 12px;                      /* colchón p/ sombras */
  margin: -8px 0 -12px;
  /* Cancelá cualquier grid-template-columns viejo */
  grid-template-columns: none;
}
@media (max-width: 959.98px){
  #peru-destinos :is(.excursions-grid, .exc-track),
  #argentina-destinos :is(.excursions-grid, .exc-track){ --cols:2; }
}
@media (max-width: 639.98px){
  #peru-destinos :is(.excursions-grid, .exc-track),
  #argentina-destinos :is(.excursions-grid, .exc-track){ --cols:1; }
}

/* 3) TARJETA — misma proporción/look que tus cards grandes */
#peru-destinos .exc-card,
#argentina-destinos .exc-card{
  position:relative;
  aspect-ratio: 3 / 4;                      /* NO alargadas */
  border-radius:16px; overflow:hidden;
  border:1px solid rgba(250,250,250,.22);
  box-shadow:0 16px 36px rgba(0,0,0,.30);
  background:#222 center/cover no-repeat;   /* fallback si no hay img */
  color:#fff; display:flex; align-items:flex-end; text-decoration:none; isolation:isolate;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  scroll-snap-align: start;
  min-width: 0;                              /* evita saltos en iOS */
}
#peru-destinos .exc-card::before,
#argentina-destinos .exc-card::before{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.78) 100%);
  pointer-events:none; z-index:0;
}
#peru-destinos .exc-card:hover,
#argentina-destinos .exc-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 22px 48px rgba(0,0,0,.36);
  border-color: rgba(250,250,250,.35);
}
#peru-destinos .exc-content,
#argentina-destinos .exc-content{ position:relative; z-index:1; width:100%; padding:16px; display:grid; gap:10px; }
#peru-destinos .exc-title,
#argentina-destinos .exc-title{
  font-family: var(--ss-heading-font,'Amaranth','Montserrat',system-ui,sans-serif);
  font-weight:800; font-size:1.25rem; color:#F5F5EB; margin:0 0 8px; text-shadow:0 1px 0 rgba(0,0,0,.35);
}

/* 4) Ocultar restos del slider viejo (si existieran) */
#peru-destinos .exc-dots, #peru-destinos .exc-nav-btn,
#argentina-destinos .exc-dots, #argentina-destinos .exc-nav-btn{ display:none; }
/* ===== Carrusel (Perú + Argentina): sin scrollbar + flechas ===== */

/* El contenedor que scrollea */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{ position: relative; }

#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track),
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track){
  /* ocultar scrollbar en todos los navegadores */
  scrollbar-width: none;           /* Firefox */
  -ms-overflow-style: none;        /* IE/Edge legacy */
  overscroll-behavior-x: contain;
}
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::-webkit-scrollbar,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::-webkit-scrollbar{
  display:none; height:0;
}

/* Flechas (mismo estilo para ambos) */
.exc-nav-btn{
  position:absolute; top:50%; transform: translateY(-50%);
  width:40px; height:40px; border-radius:999px;
  display:flex !important; align-items:center; justify-content:center;
  background: var(--oliva-base); color:#fff;
  border:1px solid rgba(255,255,255,.5);
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
  cursor:pointer; transition: filter .2s ease, transform .2s ease;
  z-index: 5;
}
.exc-nav-btn:hover{ filter: brightness(1.06); transform: translateY(-50%) scale(1.05); }
.exc-nav-btn[disabled]{ opacity:.45; cursor: default; filter: grayscale(40%); }
.exc-nav-btn svg{ width:18px; height:18px; display:block; }

/* Posición: pegadas al carrusel (ligeramente “afuera”) */
.exc-nav-prev{ left:-6px; }
.exc-nav-next{ right:-6px; }

/* Fades laterales sutiles para sugerir continuidad */
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track),
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track){ position: relative; }
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::before,
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::after,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::before,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::after{
  content:""; position:absolute; top:0; bottom:0; width:36px; pointer-events:none; z-index:4;
}
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::before,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::before{
  left:0;  background: linear-gradient(to right, rgba(74,74,74,.85), rgba(74,74,74,0));
}
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::after,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::after{
  right:0; background: linear-gradient(to left,  rgba(74,74,74,.85), rgba(74,74,74,0));
}

/* Por si quedó alguna regla vieja ocultando flechas, la pisamos: */
#peru-destinos .exc-nav-btn,
#argentina-destinos .exc-nav-btn{ display:flex !important; }
/* === FIX: quitar difuminados laterales y asegurar flechas visibles === */

/* nada de fades a los lados */
#peru-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::before,
#peru-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::after,
#argentina-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::before,
#argentina-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::after{
  content: none !important;
  background: none !important;
  width: 0 !important;
}

/* no escondas las flechas, sólo los dots */
#peru-destinos .exc-dots,
#argentina-destinos .exc-dots{ display:none !important; }

#peru-destinos .exc-nav-btn,
#argentina-destinos .exc-nav-btn{
  display:flex !important;
}

/* aseguro que el contenedor de flechas no recorte nada */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{ position:relative; overflow:visible; }

/* por si algún ancestor tiene overflow oculto */
#peru-destinos .city-body,
#argentina-destinos .city-body{ overflow:visible !important; }
/* Quitar fades laterales */
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::before,
#peru-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::after,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::before,
#argentina-destinos :is(.exc-viewport, .excursions-grid, .exc-track)::after{
  content: none !important; background: none !important;
}

/* Nunca ocultar flechas (solo ocultamos los dots) */
#peru-destinos .exc-dots, #argentina-destinos .exc-dots{ display:none !important; }
#peru-destinos .exc-nav-btn, #argentina-destinos .exc-nav-btn{ display:flex !important; }
/* que el wrap no recorte nada */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{
  position: relative;
  overflow: visible;
}

/* flechas fuera del carrusel */
#peru-destinos .exc-nav-prev,
#argentina-destinos .exc-nav-prev{ left: -24px; }   /* antes: -6px */
#peru-destinos .exc-nav-next,
#argentina-destinos .exc-nav-next{ right: -24px; }  /* antes: -6px */

/* tamaño/posición un poco más contenida en mobile */
@media (max-width: 680px){
  .exc-nav-btn{ width: 36px; height: 36px; }
  #peru-destinos .exc-nav-prev,
  #argentina-destinos .exc-nav-prev{ left: -18px; }
  #peru-destinos .exc-nav-next,
  #argentina-destinos .exc-nav-next{ right: -18px; }
}
/* === PARCHE CARRUSEL: flechas afuera + sin fades + sombras visibles === */

/* 1) Canaletas laterales para que las flechas NO pisen las tarjetas */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{
  position: relative;
  padding-inline: 40px !important;   /* espacio para las flechas */
  overflow: visible !important;       /* que nada se recorte */
}

/* 2) Flechas dentro de la canaleta */
#peru-destinos .excursions-wrap .exc-nav-btn,
#argentina-destinos .excursions-wrap .exc-nav-btn{
  z-index: 10 !important;             /* por encima de cualquier overlay */
  width: 40px; height: 40px; border-radius: 999px;
}

/* posición precisa (no pisan las cards) */
#peru-destinos .excursions-wrap .exc-nav-prev,
#argentina-destinos .excursions-wrap .exc-nav-prev{ left: -20px !important; }
#peru-destinos .excursions-wrap .exc-nav-next,
#argentina-destinos .excursions-wrap .exc-nav-next{ right: -20px !important; }

@media (max-width: 680px){
  #peru-destinos .excursions-wrap,
  #argentina-destinos .excursions-wrap{ padding-inline: 28px !important; }

  #peru-destinos .excursions-wrap .exc-nav-prev,
  #argentina-destinos .excursions-wrap .exc-nav-prev{ left: 6px !important; }
  #peru-destinos .excursions-wrap .exc-nav-next,
  #argentina-destinos .excursions-wrap .exc-nav-next{ right: 6px !important; }
}

/* 3) Quitar definitivamente los fades laterales (causaban el “detalle negro”) */
#peru-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::before,
#peru-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::after,
#argentina-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::before,
#argentina-destinos :is(.exc-viewport,.excursions-grid,.exc-track)::after{
  content: none !important;
  display: none !important;
}

/* 4) Dejar que las sombras respiren (no recortar vertical) */
#peru-destinos :is(.excursions-grid,.exc-track),
#argentina-destinos :is(.excursions-grid,.exc-track){
  overflow-y: visible !important;        /* antes estaba hidden */
  padding-block: 14px !important;        /* colchón para sombras */
  margin-block: -14px !important;        /* mantiene el alto visual */
}

/* (opcional) Suavizar un toque la sombra de cada tarjeta para que se funda mejor */
#peru-destinos .exc-card,
#argentina-destinos .exc-card{
  box-shadow: 0 18px 36px rgba(0,0,0,.28), 0 2px 6px rgba(0,0,0,.12) !important;
}
.exc-nav-btn svg,
.exc-nav-btn svg * { fill: none; }
#peru-destinos .exc-card,
#argentina-destinos .exc-card{
  box-shadow: 0 18px 42px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
/* === Limpieza del intento anterior (por si quedó cacheado) === */
#peru-destinos .excursions-wrap::after,
#argentina-destinos .excursions-wrap::after{
  content: none !important;
}

/* === Desvanecido real: se aplica como máscara al contenedor === */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{
  position: relative;
  overflow: visible;              /* no recorta flechas/sombras laterales */
  /* Ajustá estos cortes si querés más o menos fade al final */
  --fade-hard: 82%;               /* hasta acá se ve 100% */
  --fade-soft: 92%;               /* desde acá empieza a suavizar */
  /* Safari/WebKit */
  -webkit-mask-image: linear-gradient(
      to bottom,
      #000 0%,
      #000 var(--fade-hard),
      rgba(0,0,0,.75) var(--fade-soft),
      rgba(0,0,0,0) 100%
  );
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  /* Estándar (Firefox/Chromium) */
  mask-image: linear-gradient(
      to bottom,
      #000 0%,
      #000 var(--fade-hard),
      rgba(0,0,0,.75) var(--fade-soft),
      rgba(0,0,0,0) 100%
  );
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
}

/* Por si alguna regla vieja le mete fondo a la “city-body” */
#peru-destinos .city-body,
#argentina-destinos .city-body{
  background: transparent !important;
  border: 0 !important;
}
/* Quitar cualquier máscara previa en el wrap (para no cortar flechas) */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{
  -webkit-mask: none !important;
  mask: none !important;
  position: relative;
  overflow: visible; /* que no recorte las flechas */
}

/* Suavizado del “corte” sólo sobre el área que scrollea (no afecta flechas) */
#peru-destinos :is(.excursions-grid, .exc-track),
#argentina-destinos :is(.excursions-grid, .exc-track){
  /* podés ajustar estos dos valores para más/menos fade */
  --fade-hard: 86%;  /* hasta acá se ve 100% */
  --fade-soft: 96%;  /* desde acá se desvanece */

  /* un pelín más de colchón abajo ayuda al fade */
  padding-bottom: 18px;

  /* máscara: visible arriba, se desvanece al final */
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 var(--fade-hard),
    rgba(0,0,0,.75) var(--fade-soft),
    rgba(0,0,0,0) 100%
  );
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;

  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 var(--fade-hard),
    rgba(0,0,0,.75) var(--fade-soft),
    rgba(0,0,0,0) 100%
  );
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
}

/* Asegurar flechas por encima del scroller en el apilado */
.exc-nav-btn{ z-index: 5; }
/* Anti-borde para el fade del scroller */
#peru-destinos :is(.excursions-grid, .exc-track),
#argentina-destinos :is(.excursions-grid, .exc-track){
  /* tus valores de fade */
  --fade-hard: 88%;
  --fade-soft: 96%;

  /* pequeño colchón */
  padding-bottom: 18px;

  /* máscara: la agrandamos y la bajamos 3px para evitar el “cuadrito” */
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 var(--fade-hard),
    rgba(0,0,0,.72) var(--fade-soft),
    rgba(0,0,0,0) 100%
  );
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% calc(100% + 6px); /* <- más alta que el contenedor */
  -webkit-mask-position: 0 -3px;            /* <- desplazada 3px hacia abajo */

  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 var(--fade-hard),
    rgba(0,0,0,.72) var(--fade-soft),
    rgba(0,0,0,0) 100%
  );
  mask-repeat: no-repeat;
  mask-size: 100% calc(100% + 6px);
  mask-position: 0 -3px;
}
#peru-destinos .excursions-wrap::after,
#argentina-destinos .excursions-wrap::after{
  content:"";
  position:absolute;
  left:20px; right:20px; bottom:-4px; height:22px;
  pointer-events:none; z-index:4;
  background:
    radial-gradient(60px 18px at right bottom, rgba(0,0,0,.18), transparent 70%),
    radial-gradient(60px 18px at  left bottom, rgba(0,0,0,.18), transparent 70%);
}
/* PARCHE: enterrar un poco más la máscara y dar 1px de “bleed” */
#peru-destinos :is(.excursions-grid,.exc-track),
#argentina-destinos :is(.excursions-grid,.exc-track){
  /* la máscara se hace 8px más alta y se desplaza 8px hacia arriba */
  -webkit-mask-size: 100% calc(100% + 8px);
          mask-size: 100% calc(100% + 8px);
  -webkit-mask-position: 0 -8px;
          mask-position: 0 -8px;

  /* bleed para evitar cualquier borde por redondeo */
  padding-bottom: 1px;
  margin-bottom: -1px;
}

/* remate suave: un fade de 12px al color de fondo, dentro del wrap */
#peru-destinos .excursions-wrap::after,
#argentina-destinos .excursions-wrap::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:12px;
  pointer-events:none;
  background: linear-gradient(to bottom,
              rgba(74,74,74,0) 0%,
              rgba(74,74,74,1) 100%);
  z-index:2;  /* por encima de las cards; las flechas quedan fuera del wrap */
}
/* ========== RESET: sin máscaras ni overlays en el carrusel ========== */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap,
#peru-destinos :is(.excursions-grid,.exc-track),
#argentina-destinos :is(.excursions-grid,.exc-track){
  -webkit-mask: none !important;
  mask: none !important;
  background: transparent !important;
}

#peru-destinos .excursions-wrap::before,
#peru-destinos .excursions-wrap::after,
#argentina-destinos .excursions-wrap::before,
#argentina-destinos .excursions-wrap::after{
  content: none !important;
}

/* ========== Sombra de las tarjetas más suave (evita “mancha” plana) ========== */
#peru-destinos .exc-card,
#argentina-destinos .exc-card{
  box-shadow: 0 16px 32px rgba(0,0,0,.24), 0 2px 8px rgba(0,0,0,.14) !important;
}

/* ========== Colchón inferior para que las sombras respiren ========== */
#peru-destinos .city-body,
#argentina-destinos .city-body{
  position: relative;
  overflow: visible !important;
  padding-bottom: 18px;           /* crea “piso” para la sombra */
}

#peru-destinos :is(.excursions-grid,.exc-track),
#argentina-destinos :is(.excursions-grid,.exc-track){
  overflow: visible !important;
  padding-bottom: 18px !important;  /* mismo colchón en el scroller */
  margin-bottom: 0 !important;      /* sin márgenes negativos */
}

/* ========== Desvanecido MUY sutil bajo las cards (no afecta cerrado) ========== */
#peru-destinos .city-panel[open] .city-body::after,
#argentina-destinos .city-panel[open] .city-body::after{
  content: "";
  position: absolute;
  left: 24px; right: 24px;      /* no pega contra los bordes redondeados */
  bottom: -10px;
  height: 22px;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(0,0,0,.20), rgba(74,74,74,0));
  border-radius: 18px;
  filter: blur(2px);
  z-index: 0;                   /* flechas y cards quedan arriba */
}
/* 0) Limpieza total de overlays/máscaras que rompieron el layout */
#peru-destinos .city-body::after,
#argentina-destinos .city-body::after,
#peru-destinos .excursions-wrap::before,
#peru-destinos .excursions-wrap::after,
#argentina-destinos .excursions-wrap::before,
#argentina-destinos .excursions-wrap::after{
  content: none !important;
  display: none !important;
}

/* 1) Sin máscaras en el scroller */
#peru-destinos :is(.excursions-grid,.exc-track),
#argentina-destinos :is(.excursions-grid,.exc-track){
  -webkit-mask: none !important;
  mask: none !important;
}

/* 2) Dejá respirar las sombras (evita la línea dura abajo) */
#peru-destinos .city-panel[open] .city-body,
#argentina-destinos .city-panel[open] .city-body{
  padding-bottom: 18px;         /* podés subir a 22px si querés más aire */
  overflow: visible !important;
}
#peru-destinos :is(.excursions-grid,.exc-track),
#argentina-destinos :is(.excursions-grid,.exc-track){
  overflow: visible !important;
  padding-bottom: 18px !important;
  margin-bottom: 0 !important;
}

/* 3) Gradiente del card un poco más claro abajo (menos “mancha”) */
#peru-destinos .exc-card::before,
#argentina-destinos .exc-card::before{
  background: linear-gradient(
    180deg,
    rgba(0,0,0,.14) 0%,
    rgba(0,0,0,.38) 58%,
    rgba(0,0,0,.62) 100%
  ) !important;
}

/* 4) Flechas fuera y sin recortes (como lo tenías bien) */
#peru-destinos .excursions-wrap,
#argentina-destinos .excursions-wrap{
  padding-inline: 40px;
  overflow: visible !important;
}
#peru-destinos .exc-nav-prev, #argentina-destinos .exc-nav-prev{ left:-20px; }
#peru-destinos .exc-nav-next, #argentina-destinos .exc-nav-next{ right:-20px; }
/* Carrusel: recortar en X (vuelve el efecto de “ventana”) 
   y dejar visible en Y (sombras intactas) */
#peru-destinos :is(.excursions-grid, .exc-track),
#argentina-destinos :is(.excursions-grid, .exc-track){
  overflow-x: auto !important;   /* <- oculta la 5ª tarjeta hasta scrollear */
  overflow-y: visible !important; /* <- no corta sombras */
  scrollbar-width: none;          /* oculta scrollbar (Firefox) */
  -ms-overflow-style: none;       /* IE/Edge legacy */
}
#peru-destinos :is(.excursions-grid, .exc-track)::-webkit-scrollbar,
#argentina-destinos :is(.excursions-grid, .exc-track)::-webkit-scrollbar{
  display: none; height: 0;
}
/* =========================================================
   🌎 CSS PERSONALIZADO – PLANTILLA EXCURSIÓN / DETALLE TOUR
   (identificador: ssx-*)
   ========================================================= */

:root{
  --ssx-max: 1200px;
  --ssx-gap: 28px;
  --ssx-radius: 16px;
  --ssx-shadow: 0 10px 24px rgba(0,0,0,.08);
  --c-text: #1f2937;
  --c-muted: #6b7280;
  --c-bg: #ffffff;
  --c-soft: #f5f7fb;
  --c-brand: #0ea5e9;        /* primario */
  --c-brand-600:#0284c7;
}

*{box-sizing:border-box}
img{max-width:100%;display:block}
.ssx-page{color:var(--c-text);background:#fff;line-height:1.55}

/* ---------- HERO ---------- */
.ssx-hero__media{margin:0;max-height:480px;overflow:hidden}
.ssx-hero__media img{width:100%;height:300px;object-fit:cover}

/* ---------- CONTENEDOR ---------- */
.ssx-container{
  max-width:var(--ssx-max);
  margin: clamp(20px,4vw,40px) auto;
  padding-inline:16px;
  display:grid;
  grid-template-columns: 1.7fr minmax(280px, 0.9fr);
  gap: var(--ssx-gap);
}
@media (max-width: 980px){
  .ssx-container{grid-template-columns:1fr}
}

/* ---------- MAIN ---------- */
.ssx-main .ssx-block{
  background:var(--c-bg);
  border-radius:var(--ssx-radius);
  padding:24px;
  box-shadow:var(--ssx-shadow);
}
.ssx-block + .ssx-block{margin-top: var(--ssx-gap)}
.ssx-title{font-size:clamp(26px,3vw,36px);margin:0 0 10px}
.ssx-subtitle{font-size:clamp(20px,2.4vw,24px);margin:0 0 12px}
.ssx-text{color:var(--c-muted);margin:0}

/* ---------- GALERÍA ---------- */
.ssx-gallery{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns: minmax(260px, 1fr);
  gap:14px;
  overflow-x:auto;
  padding-bottom:6px;
  scroll-snap-type:x mandatory;
}
.ssx-gallery__item{
  border-radius:12px;
  overflow:hidden;
  scroll-snap-align:start;
  box-shadow: var(--ssx-shadow);
}
.ssx-gallery__item img{height:260px;object-fit:cover;width:100%}
@media (min-width:900px){
  .ssx-gallery__item img{height:320px}
}

/* ---------- ITINERARIO ---------- */
.ssx-itinerary .ssx-day{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:flex-start;padding:16px;border-radius:12px;background:var(--c-soft)}
.ssx-itinerary .ssx-day + .ssx-day{margin-top:12px}
.ssx-day__badge{display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;border-radius:14px;background:#fff;box-shadow:var(--ssx-shadow);font-weight:700}
.ssx-day__badge span{font-size:12px;color:var(--c-muted)}
.ssx-day__badge strong{font-size:20px}
.ssx-day__title{margin:.1rem 0 .4rem}

/* ---------- INCLUYE / NO INCLUYE ---------- */
.ssx-features{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:700px){.ssx-features{grid-template-columns:1fr}}
.ssx-list{list-style:none;margin:0;padding:0}
.ssx-list__item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fff;box-shadow:var(--ssx-shadow)}
.ssx-list__item + .ssx-list__item{margin-top:8px}
.ssx-list__item--no{background:#fff3f3}
.ssx-icon{width:16px;height:16px;flex:0 0 16px;fill:#10b981}
.ssx-list__item--no .ssx-icon{fill:#ef4444}

/* ---------- SIDEBAR ---------- */
.ssx-sidebar{position:relative}
@media (min-width:981px){
  .ssx-sidebar{position:sticky;top:24px;height:max-content}
}
.ssx-card{background:var(--c-bg);border-radius:var(--ssx-radius);box-shadow:var(--ssx-shadow);padding:20px}
.ssx-card__title{margin:0 0 12px;font-size:20px}
.ssx-excursion__form-group{display:grid;gap:6px;margin-bottom:12px}
.ssx-excursion__label{font-size:.9rem;color:var(--c-muted)}
.ssx-excursion__input,.ssx-excursion__textarea{width:100%;border:1px solid #e5e7eb;border-radius:12px;padding:12px 14px;font:inherit;background:#fff}
.ssx-excursion__input[readonly]{background:#f9fafb;color:#6b7280}
.ssx-btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;padding:12px 16px;cursor:pointer;font-weight:600}
.ssx-btn--primary{background:var(--c-brand);color:#fff}
.ssx-btn--primary:hover{background:var(--c-brand-600)}

/* ---------- RELACIONADAS ---------- */
.ssx-related{max-width:var(--ssx-max);margin:40px auto 60px;padding-inline:16px}
.ssx-related__track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,1fr);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
.ssx-related__card{position:relative;min-height:240px;border-radius:16px;overflow:hidden;color:#fff;scroll-snap-align:start;background:#111 center/cover no-repeat;box-shadow:var(--ssx-shadow);background-image:var(--bg)}
.ssx-badge{position:absolute;top:12px;left:12px;background:rgba(0,0,0,.55);backdrop-filter:saturate(1.2) blur(4px);padding:6px 10px;border-radius:999px;font-size:.75rem}
.ssx-related__content{position:absolute;inset:auto 0 0 0;padding:18px;background:linear-gradient(transparent,rgba(0,0,0,.55))}
.ssx-kicker{opacity:.85}
.ssx-cta{display:inline-block;padding:8px 12px;border-radius:10px;background:#ffffff;color:#111;font-weight:600}
.ssx-cta:hover{filter:brightness(.95)}

/* =========================================================
   🔚 FIN CSS PERSONALIZADO – PLANTILLA EXCURSIÓN / DETALLE
   ========================================================= */
/* =========================================================
   🔧 OVERRIDES – PLANTILLA EXCURSIÓN (ajustes puntuales)
   ========================================================= */

/* 1) Reducir espacio entre el HERO y el primer bloque */
.ssx-page .ssx-container{
  margin-top: 12px !important;                 /* antes: clamp(20px,4vw,40px) */
}

/* Si hay márgenes heredados en <main> del theme, anularlos aquí */
.ssx-page main,
.ssx-page .ssx-main{
  margin: 0 !important;
  padding: 0 !important;
}
/* Asegurar que el primer bloque no agregue margen extra */
.ssx-page .ssx-main .ssx-block:first-child,
.ssx-page .ssx-intro,
.ssx-page .ssx-title{
  margin-top: 0 !important;
}

/* 2) Quitar “doble gutter” lateral bajo el HERO (full-bleed limpio) */
@media (min-width: 981px){
  .ssx-page .ssx-container{
    padding-inline: 0 !important;              /* elimina el padding lateral */
  }
}
/* mantener un pequeño padding en móviles para que no “pegue” a los bordes */
@media (max-width: 980px){
  .ssx-page .ssx-container{
    padding-inline: 12px !important;
  }
}

/* 3) Sidebar/formulario un poco más ancho en desktop */
@media (min-width: 981px){
  .ssx-page .ssx-container{
    /* antes: 1.7fr / minmax(280px, 0.9fr) */
    grid-template-columns: 1.55fr minmax(330px, 1fr) !important;
  }
  /* un pelín más de confort interno */
  .ssx-page .ssx-card{
    padding: 22px 22px 20px !important;
  }
}

/* =========================================================
   🔚 FIN OVERRIDES – PLANTILLA EXCURSIÓN
   ========================================================= */
   /* =========================================================
   FIX DEFINITIVO – eliminar gutter del container Bootstrap
   SOLO para esta plantilla (.ssx-edge-fix)
   ========================================================= */

/* A) cuando la plantilla está dentro de un .container / *container* */
@media (min-width: 981px){
  .container > .ssx-edge-fix,
  .container-fluid > .ssx-edge-fix,
  .container-xl > .ssx-edge-fix,
  .container-lg > .ssx-edge-fix,
  .container-md > .ssx-edge-fix,
  .container-sm > .ssx-edge-fix,
  [class*="container"] > .ssx-edge-fix {
    /* compensa el padding del container solo a la izquierda */
    margin-left: calc(-0.5 * var(--bs-gutter-x, 1.5rem)) !important;  /* ≈ -12px por defecto */
    /* no tocamos el lado derecho para no desalinear el sidebar */
  }
}

/* B) cuando SitioSimple envuelve con wrappers propios (por atributo) */
@media (min-width: 981px){
  [data-ss-rich-paragraph] > .ssx-edge-fix,
  [data-ss-padding] > .ssx-edge-fix {
    margin-left: calc(-0.5 * var(--bs-gutter-x, 1.5rem)) !important;
  }
}

/* C) por si el wrapper añade padding “duro” en px (plan B) */
@media (min-width: 981px){
  .ssx-edge-fix { 
    /* si aún ves 2-4px, subí este fallback:  -14px, -16px, -18px */
    margin-left: max(calc(-0.5 * var(--bs-gutter-x, 1.5rem)), -16px) !important;
  }
}

/* mantener nuestro grid sin padding lateral adicional */
@media (min-width: 981px){
  .ssx-edge-fix .ssx-container { padding-left: 0 !important; }
}