/* Trhoncal Travel discovery UX v3 — carrusel visible, móvil y FAQ */

/* Las fichas SSR usan fondo petróleo: el H1 debe contrastar en blanco. */
body.destination-route .detail-header h1,
body.destination-route .detail-header h2{color:#fff}

/* Carrusel de biblioteca secundaria */
.destination-carousel-shell{position:relative;margin-top:18px}
.destination-carousel-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:18px 0 14px}
.destination-carousel-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.carousel-control,.carousel-secondary{border:1px solid #d9cfbd;background:#fff;color:#315763;border-radius:999px;min-height:42px;padding:10px 14px;font-weight:900;font-size:12px;cursor:pointer;transition:.18s ease}
.carousel-control:hover,.carousel-secondary:hover{border-color:#b99a5d;color:#7b5b22;transform:translateY(-1px)}
.carousel-control:focus-visible,.carousel-secondary:focus-visible{outline:3px solid rgba(216,175,88,.35);outline-offset:2px}
.carousel-status{display:inline-flex;align-items:center;justify-content:center;min-width:72px;min-height:42px;padding:8px 11px;border-radius:999px;background:#f2ecdf;color:#725a2a;font-size:11px;font-weight:950}
.carousel-hint{margin:10px 0 0;color:#718287;font-size:12px;font-weight:750}
.carousel-hint strong{color:#8d6928}

.destination-more-section:not(.is-expanded) .destination-grid-more{
  display:flex;
  gap:18px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  padding:4px 2px 16px;
}
.destination-more-section:not(.is-expanded) .destination-grid-more .destination-card{
  flex:0 0 calc((100% - 36px)/3);
  min-width:0;
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
.destination-more-section.is-expanded .destination-carousel-toolbar{margin-bottom:20px}
.destination-more-section.is-expanded .destination-grid-more{display:grid}
.destination-more-section.is-expanded .carousel-control,
.destination-more-section.is-expanded .carousel-status,
.destination-more-section.is-expanded #destinationCarouselPause{display:none}
.destination-more-section.is-expanded .carousel-hint{display:none}

/* FAQ: nativo, rápido y accesible */
.faq-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:46px;align-items:start}
.faq-intro h2{font-family:Georgia,"Times New Roman",serif;color:var(--primary);font-size:clamp(34px,4vw,54px);line-height:1.02;margin:8px 0 16px}
.faq-intro p{color:var(--muted);line-height:1.65;font-size:17px;margin:0}
.faq-list{display:grid;gap:10px}
.faq-item{border:1px solid #ded5c5;border-radius:18px;background:#fff;overflow:hidden}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;list-style:none;padding:18px 20px;color:#123f4c;font-weight:900}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:'+';display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#f2ecdf;color:#7a5b22;font-size:20px;line-height:1}
.faq-item[open] summary:after{content:'–'}
.faq-item summary:focus-visible{outline:3px solid rgba(216,175,88,.35);outline-offset:-3px}
.faq-answer{padding:0 20px 19px;color:#63787e;line-height:1.65;font-size:14px}
.faq-answer p{margin:0}

@media(max-width:1050px){
  .destination-more-section:not(.is-expanded) .destination-grid-more .destination-card{flex-basis:calc((100% - 18px)/2)}
  .faq-layout{grid-template-columns:1fr;gap:24px}
}

@media(max-width:760px){
  .destination-carousel-toolbar{align-items:flex-start;flex-direction:column;margin-top:14px}
  .destination-carousel-actions{width:100%;display:grid;grid-template-columns:1fr auto 1fr;gap:7px}
  .carousel-control{width:100%;padding:10px 8px}
  #destinationCarouselPause{grid-column:1/2}
  #destinationCarouselViewAll{grid-column:2/4;width:100%}
  .destination-more-section:not(.is-expanded) .destination-grid-more{margin-right:-12px;padding-right:44px;gap:12px}
  .destination-more-section:not(.is-expanded) .destination-grid-more .destination-card{flex:0 0 min(82vw,330px)}
  .carousel-hint{font-size:12px;margin-top:8px}
  .faq-item summary{padding:16px;font-size:14px}
  .faq-answer{padding:0 16px 17px;font-size:13px}
}

@media(prefers-reduced-motion:reduce){
  .destination-more-section:not(.is-expanded) .destination-grid-more{scroll-behavior:auto}
  .carousel-control,.carousel-secondary{transition:none}
}