/* Ilustraciones de flota en tarjetas de equipo */
.equip-card__pic {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 5.4;
  margin: calc(var(--sp-2) * -1) 0 var(--sp-2);
  background: radial-gradient(ellipse 70% 60% at 50% 105%, rgba(180, 21, 37, 0.28), transparent 72%);
  border-radius: calc(var(--radius) - 2px);
  overflow: hidden;
}

.equip-card__pic { position: relative; }

.equip-card__pic img {
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.45));
  transition: opacity 0.45s ease;
}

.equip-card__pic img.is-on { opacity: 1; }

.equip-card__dots {
  position: absolute;
  right: var(--sp-2);
  bottom: var(--sp-2);
  z-index: 5;
  display: flex;
  gap: 2px;
}

.equip-card__dots button {
  position: relative;
  width: 24px;
  height: 24px;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
}

.equip-card__dots button::before {
  content: '';
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: rgba(245, 243, 239, 0.28);
  border: 1px solid rgba(245, 243, 239, 0.5);
  transition: background 0.25s ease, transform 0.25s ease;
}

.equip-card__dots button.is-on::before { background: var(--rojo-senal); border-color: var(--rojo-senal); transform: scale(1.2); }

.equip-card--pic .equip-card__icon { display: none; }

.equip-grid--pics {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap: var(--sp-4);
}

.equip-grid--pics .equip-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
.equip-grid--pics .equip-card:last-child:nth-child(odd) .equip-card__pic { aspect-ratio: 16 / 4.2; }

@media (prefers-reduced-motion: no-preference) {
  .equip-card__pic img { transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
  .equip-card:hover .equip-card__pic img { transform: translateX(10px); }
}

/* ==========================================================================
   Ficha de equipo (nosotros/lowboy.html y futuras fichas)
   ========================================================================== */
.ficha-intro {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: var(--sp-7);
  align-items: center;
}
.ficha-fig {
  position: relative;
  margin: 0;
  padding: var(--sp-4);
  background: radial-gradient(ellipse 75% 65% at 50% 108%, rgba(180, 21, 37, 0.34), transparent 70%), var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.ficha-fig img { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.5)); }
.ficha-fig figcaption { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--text-muted); }
.ficha-intro__text > * + * { margin-top: var(--sp-4); }
.ficha-intro__text h2 { font-family: var(--font-heading); line-height: var(--lh-tight); }

.ficha-specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap: var(--sp-4);
  margin: 0;
  padding: 0;
  list-style: none;
}
.ficha-spec {
  padding: var(--sp-5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 4px solid var(--rojo-rahazo);
  border-radius: var(--radius);
}
.ficha-spec__label { display: block; font-size: var(--fs-sm); color: var(--text-muted); }
.ficha-spec__value { display: block; margin-top: var(--sp-1); font-family: var(--font-heading); font-size: var(--fs-xl); font-weight: var(--fw-bold); line-height: var(--lh-tight); }
.ficha-spec__note { display: block; margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--text-muted); }

.ficha-vs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-5);
}
.ficha-vs__col {
  padding: var(--sp-6);
  background: var(--surface);
  border: 1px solid var(--border);
  border-top: 4px solid var(--rojo-rahazo);
  border-radius: var(--radius);
}
.ficha-vs__col:nth-child(2) { border-top-color: var(--azul-senal); }
.ficha-vs__col h3 { font-family: var(--font-heading); font-size: var(--fs-xl); }
.ficha-vs__col p { margin-top: var(--sp-2); color: var(--text-muted); }
.ficha-vs__col .check-list { margin-top: var(--sp-4); }

.gal {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(18px, 2.4vw, 32px);
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 900px) { .gal { grid-template-columns: repeat(4, 1fr); } }
.gal__tile {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 0;
  overflow: hidden;
  cursor: zoom-in;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
}
.gal__tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s var(--ease-out); }
.gal__tile::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E") center / 44px no-repeat;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.gal__tile:hover img, .gal__tile:focus-visible img { transform: scale(1.08); }
.gal__tile:hover::after, .gal__tile:focus-visible::after { opacity: 1; }

.gal-dialog {
  width: min(94vw, 980px);
  max-height: 92vh;
  padding: var(--sp-4);
  color: var(--text);
  background: var(--bg-deep);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.gal-dialog::backdrop { background: rgba(0, 0, 0, 0.82); }
.gal-dialog[open] { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--sp-3); }
.gal-dialog__fig { margin: 0; min-width: 0; }
.gal-dialog__fig img { display: block; width: 100%; max-height: 74vh; object-fit: contain; border-radius: var(--radius); }
.gal-dialog__fig figcaption { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--text-muted); text-align: center; }
.gal-dialog button { cursor: pointer; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); font-size: 28px; line-height: 1; }
.gal-dialog__nav { width: 44px; height: 56px; }
.gal-dialog__x { position: absolute; top: var(--sp-2); right: var(--sp-2); z-index: 2; width: 44px; height: 44px; }
.gal-dialog button:hover { background: var(--surface-hover); }
@media (max-width: 640px) {
  .gal-dialog[open] { grid-template-columns: 1fr 1fr; }
  .gal-dialog__fig { grid-column: 1 / -1; grid-row: 1; }
  .gal-dialog__nav { width: 100%; }
}

/* Configuraciones y planos */
.plano__scroll { overflow-x: auto; background: var(--negro-asfalto); border-radius: var(--radius); }
.plano__svg { display: block; width: 100%; min-width: 760px; height: auto; }
.cfg-table { background: var(--surface); border: 1px solid var(--border); }
.cfg-table table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: var(--fs-sm); }
.cfg-table th, .cfg-table td { padding: var(--sp-3) var(--sp-4); text-align: left; border-bottom: 1px solid var(--border); }
.cfg-table thead th { color: var(--text-muted); font-weight: var(--fw-semibold); white-space: nowrap; }
.cfg-table tbody th { font-weight: var(--fw-semibold); }
.cfg-table tbody tr:hover { background: var(--surface-hover); }
.cfg__h { margin: var(--sp-7) 0 var(--sp-4); font-family: var(--font-heading); font-size: var(--fs-xl); }
.cfg-list { display: grid; gap: var(--sp-3); }
.cfg { background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--rojo-rahazo); border-radius: var(--radius); }
.cfg__sum { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--sp-2) var(--sp-4); padding: var(--sp-4) var(--sp-5); cursor: pointer; list-style: none; }
.cfg__sum::-webkit-details-marker { display: none; }
.cfg__sum::after { content: '+'; margin-left: auto; font-size: 24px; line-height: 1; color: var(--rojo-senal); }
.cfg[open] > .cfg__sum::after { content: '−'; }
.cfg__name { font-family: var(--font-heading); font-weight: var(--fw-bold); font-size: var(--fs-md); }
.cfg__meta { color: var(--text-muted); font-size: var(--fs-sm); align-self: center; }
.cfg__meta b { color: var(--text); }
.cfg__body { padding: 0 var(--sp-5) var(--sp-5); }
.cfg__note { margin-bottom: var(--sp-3); color: var(--text-muted); }
.cfg__foot { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--text-muted); }
.cfg__ext li { margin-bottom: var(--sp-2); }

@media (max-width: 900px) {
  .ficha-intro, .ficha-vs { grid-template-columns: 1fr; }
  .ficha-intro { gap: var(--sp-5); }
}
.cfg-table--narrow table { min-width: 0; max-width: 520px; }
.cfg-table--narrow { max-width: 520px; }

.ficha-dl { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-5); }
.cfg-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: var(--sp-4); align-items: start; }
.cfg-pair .cfg-table--narrow { max-width: none; }
.cfg__cap { padding: var(--sp-3) var(--sp-4); text-align: left; font-weight: var(--fw-bold); }

/* ===== Navegación por iconografía (cada icono = hipervínculo a su ficha) ===== */
.icon-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(14px,2vw,26px);margin-top:var(--s-6,28px)}
.icon-nav__item{position:relative;display:flex;flex-direction:column;gap:6px;padding:clamp(14px,2vw,22px);border:1px solid var(--line,rgba(255,255,255,.12));border-radius:var(--r-lg,16px);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0));text-decoration:none;color:inherit;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}
.icon-nav__img{width:100%;height:auto;aspect-ratio:1000/279;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45));transition:transform .35s ease}
.icon-nav__name{font-weight:700;font-size:1.15rem;margin-top:6px}
.icon-nav__text{color:var(--muted,#aab);font-size:.95rem}
.icon-nav__go{margin-top:4px;font-weight:600;color:var(--accent,#ff4a3d)}
.icon-nav__go::after{content:"";display:inline-block;width:.55em;height:.55em;margin-left:.45em;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg) translate(-2px,2px);transition:transform .25s}
.icon-nav__item:hover,.icon-nav__item:focus-visible{transform:translateY(-4px);border-color:var(--accent,#ff4a3d);box-shadow:0 18px 40px rgba(0,0,0,.35)}
.icon-nav__item:hover .icon-nav__img,.icon-nav__item:focus-visible .icon-nav__img{transform:scale(1.04)}
.icon-nav__item:hover .icon-nav__go::after{transform:rotate(45deg) translate(1px,-1px)}
.icon-nav__item:focus-visible{outline:3px solid var(--accent,#ff4a3d);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.icon-nav__item,.icon-nav__img{transition:none}.icon-nav__item:hover{transform:none}}

/* --- UNIDAD DE RESCATE (galeria) -----------------------------------------
   Bloque bajo la cuadricula de equipo de apoyo en nosotros/flota.html. */
.rescue { margin-top: var(--sp-8); }
.rescue__head { max-width: 62ch; margin-bottom: var(--sp-6); }
.rescue__title { margin-top: var(--sp-2); font-family: var(--font-heading); font-size: var(--fs-2xl); line-height: 1.1; }
.rescue__title span { color: var(--rojo-senal); }
.rescue__text { margin-top: var(--sp-3); color: var(--text-muted); }
.gal--rescue { grid-template-columns: 1fr; }
@media (min-width: 700px) {
  .gal--rescue { grid-template-columns: repeat(2, 1fr); }
  .gal--rescue > li:first-child { grid-column: 1 / -1; }
}
.gal__tile--wide { aspect-ratio: 1518 / 584; }
.gal__tile--rescue { aspect-ratio: 1518 / 704; }
.gal__tile--wide img { object-position: center top; }