/* Recorrido · «Saber más»: 4 bloques apilados en zigzag, estáticos.
   Tarjetas de papel sobre el fondo fijo (la calle), igual que la frase de la portada y el cierre.
   Usa los tokens de base.css. Un solo diseño responsive (sin versión móvil aparte). */
.recorrido{ position:relative; background:transparent; padding:40px 16px 24px; }
.rec-wrap{ max-width:1080px; margin:0 auto; display:flex; flex-direction:column; gap:28px; }

.rec-bloque{
  display:grid; grid-template-columns:1fr; gap:22px; align-items:center;
  background:rgba(250,250,247,0.97); border:1.5px solid var(--navy); border-radius:var(--radius);
  padding:22px 18px; box-shadow:var(--shadow);
}
.rec-fig{ margin:0; display:flex; gap:12px; align-items:center; justify-content:center; min-width:0; }
.rec-fig img{ flex:1 1 0; min-width:0; width:100%; height:auto; max-height:340px; object-fit:contain; border-radius:var(--radius-sm); }
.rec-texto{ min-width:0; }
.rec-eyebrow{ font:600 12.5px 'Space Grotesk',Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#0B7C69; }
.rec-texto h2{ margin:8px 0 12px; font-size:clamp(1.55rem,3.4vw,2.2rem); color:var(--navy); }
.rec-lead{ font-size:17px; line-height:1.55; color:var(--ink-muted); }
.rec-lista{ list-style:none; margin:16px 0 0; padding:0; display:grid; gap:10px; }
.rec-lista li{ position:relative; padding-left:26px; font-size:15.5px; line-height:1.5; color:var(--ink); }
.rec-lista li::before{ content:""; position:absolute; left:2px; top:.55em; width:10px; height:10px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 3px rgba(47,213,184,.25); }

@media (min-width:900px){
  .recorrido{ padding:56px 32px 32px; }
  .rec-wrap{ gap:36px; }
  .rec-bloque{ grid-template-columns:1fr 1fr; gap:44px; padding:36px 40px; }
  .rec-bloque:nth-of-type(even) .rec-fig{ order:2; }
  .rec-fig img{ max-height:380px; }
}

/* «Qué incluye»: discreto, cerrado por defecto */
.rec-detalle{ background:rgba(250,250,247,0.97); border:1.5px solid var(--navy); border-radius:var(--radius); box-shadow:var(--shadow); }
.rec-detalle summary{
  cursor:pointer; list-style:none; min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 20px; font:600 14.5px 'Space Grotesk',Arial,sans-serif; color:var(--navy); border-radius:var(--radius);
}
.rec-detalle summary::-webkit-details-marker{ display:none; }
.rec-detalle summary::after{ content:"+"; font-size:22px; line-height:1; color:#0B7C69; }
.rec-detalle[open] summary::after{ content:"–"; }
.rec-detalle summary:focus-visible{ outline:2px solid var(--teal-deep); outline-offset:3px; }
.rec-detalle-texto{ padding:0 20px 20px; display:grid; gap:12px; font-size:14.5px; line-height:1.6; color:var(--ink-muted); max-width:78ch; }

/* Aparición suave (solo si hay JS y el usuario no pidió menos movimiento) */
@media (prefers-reduced-motion:no-preference){
  .rec-anim .rec-bloque{ opacity:0; transform:translateY(18px); transition:opacity 520ms var(--ease-out), transform 520ms var(--ease-out); }
  .rec-anim .rec-bloque.rec-visto{ opacity:1; transform:none; }
}