/* ============================================================
   COMPONENTES REUTILIZABLES — se cargan UNA vez y sirven a todas las landings.
   Scoped por la clase del componente (rle-comp-* / rle-faq / rle-tcar) para no
   chocar con los diseños bespoke. Cada landing puede sobreescribir con su CSS.
   ============================================================ */

:root{
  --rlc-ink:#0b2b2c; --rlc-ink-soft:#3a4a44; --rlc-mute:#6b7a74;
  --rlc-accent:#e7546a; --rlc-line:rgba(11,43,44,.12); --rlc-paper:#fff; --rlc-paper-2:#faf6ee;
  --rlc-radius:18px; --rlc-shadow:0 14px 32px -12px rgba(11,43,44,.18);
  --rlc-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --rlc-serif:'Fraunces','Playfair Display',Georgia,serif;
}

/* ---------- section-heading ---------- */
.rle-comp-head{ display:flex; flex-direction:column; gap:12px; max-width:760px; margin:0 0 clamp(20px,3vw,40px); font-family:var(--rlc-font); }
.rle-comp-head--center{ text-align:center; align-items:center; margin-inline:auto; }
.rle-comp-eyebrow{ display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--rlc-accent); }
.rle-comp-eyebrow::before{ content:""; width:26px; height:1px; background:currentColor; opacity:.6; }
.rle-comp-head--center .rle-comp-eyebrow::after{ content:""; width:26px; height:1px; background:currentColor; opacity:.6; }
.rle-comp-title{ margin:0; font-family:var(--rlc-serif); font-weight:500; line-height:1.12; letter-spacing:-.02em; color:var(--rlc-ink); font-size:clamp(26px,4vw,46px); }
.rle-comp-title em{ font-style:italic; color:var(--rlc-accent); }
.rle-comp-lead{ margin:0; font-size:clamp(15px,1.3vw,18px); line-height:1.65; color:var(--rlc-ink-soft); }

/* ---------- faq ---------- */
.rle-faq{ max-width:860px; margin:0 auto; font-family:var(--rlc-font); }
.rle-faq__item{ border-bottom:1px solid var(--rlc-line); }
.rle-faq__q{ display:flex; justify-content:space-between; align-items:center; gap:24px; width:100%; cursor:pointer; list-style:none; padding:22px 0; font-family:var(--rlc-serif); font-weight:500; font-size:clamp(17px,1.7vw,21px); color:var(--rlc-ink); }
.rle-faq__q::-webkit-details-marker{ display:none; }
.rle-faq__plus{ flex:0 0 32px; width:32px; height:32px; border-radius:50%; border:1px solid var(--rlc-line); display:grid; place-items:center; color:var(--rlc-ink); transition:transform .3s ease, background .3s ease, color .3s ease; }
.rle-faq__item[open] .rle-faq__plus{ background:var(--rlc-accent); border-color:var(--rlc-accent); color:#fff; transform:rotate(45deg); }
.rle-faq__a{ padding:0 56px 22px 0; color:var(--rlc-ink-soft); line-height:1.7; font-size:15.5px; }
.rle-faq__a p{ margin:0 0 .8em; } .rle-faq__a p:last-child{ margin-bottom:0; }
@media (max-width:640px){ .rle-faq__a{ padding-right:8px; } }

/* ---------- tours-carousel ("otras experiencias") ---------- */
.rle-tcar{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; font-family:var(--rlc-font); }
@media (max-width:640px){ .rle-tcar{ grid-auto-flow:column; grid-auto-columns:80%; grid-template-columns:none; overflow-x:auto; scroll-snap-type:x proximity; padding-bottom:12px; } .rle-tcar__card{ scroll-snap-align:start; } }
.rle-tcar__card{ background:var(--rlc-paper-2); border:1px solid var(--rlc-line); border-radius:var(--rlc-radius); overflow:hidden; display:flex; flex-direction:column; transition:transform .35s ease, box-shadow .35s ease; }
.rle-tcar__card:hover{ transform:translateY(-5px); box-shadow:var(--rlc-shadow); }
.rle-tcar__media{ position:relative; aspect-ratio:4/3; background:#e6dccb; overflow:hidden; display:block; }
.rle-tcar__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s ease; }
.rle-tcar__card:hover .rle-tcar__media img{ transform:scale(1.06); }
.rle-tcar__cat{ position:absolute; top:12px; left:12px; background:rgba(255,255,255,.94); color:var(--rlc-ink); font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:5px 10px; border-radius:999px; }
.rle-tcar__body{ display:flex; flex-direction:column; gap:8px; padding:18px 20px 20px; flex:1; }
.rle-tcar__title{ margin:0; font-family:var(--rlc-serif); font-weight:500; font-size:19px; line-height:1.2; color:var(--rlc-ink); }
.rle-tcar__desc{ margin:0; font-size:14px; color:var(--rlc-mute); line-height:1.5; flex:1; }
.rle-tcar__foot{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:10px; padding-top:12px; border-top:1px solid var(--rlc-line); }
.rle-tcar__from{ font-size:11px; color:var(--rlc-mute); letter-spacing:.03em; } .rle-tcar__from b{ display:block; font-family:var(--rlc-serif); font-size:16px; font-weight:500; color:var(--rlc-ink); }
.rle-tcar__link{ font-size:13px; font-weight:700; color:var(--rlc-accent); white-space:nowrap; text-decoration:none; }
.rle-tcar__link:hover{ color:var(--rlc-ink); }

@media (prefers-reduced-motion: reduce){
  .rle-tcar__card, .rle-tcar__media img, .rle-faq__plus{ transition:none !important; }
}
