/* mapa de ubicación (ronda 12) · mismo componente en la web y en el paquete de ventas */
.om { margin: 0; }
.om__map { position: relative; width: 100%; overflow: hidden; background: #E4E5D4; border: 1px solid rgba(21, 20, 18, .22); }
.om__bg, .om__svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.om__svg { font-family: var(--sans, "Yaku Texto", Arial, sans-serif); }
.om__coast path { fill: none; stroke: #8FA3A4; stroke-width: 1.6; }
.om__rivers path { fill: none; stroke: #A9BEC2; stroke-width: 1.8; stroke-linecap: round; }
.om__roads path { fill: none; stroke: #FBF8F1; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
.om__ocean { font: 400 24px var(--cap, "Yaku Titulo", Georgia, serif); letter-spacing: .2em; fill: #5E7477; text-transform: uppercase; }
.om__route { fill: none; stroke: #8A6F4E; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; transition: stroke .25s, stroke-width .25s, opacity .25s; }
.om__dest { cursor: pointer; outline: none; }
.om__hit { fill: transparent; }
.om__ic path { fill: none; stroke: #000000; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.om__ic { paint-order: stroke; }
.om__dot, .om__town circle { fill: #000000; }
.om__lab { font-size: 30px; font-weight: 500; fill: #000000; paint-order: stroke; stroke: #FCFBF4; stroke-width: 7px; stroke-linejoin: round; }
.om__town text { font-size: 26px; fill: #2A1105; paint-order: stroke; stroke: #FCFBF4; stroke-width: 6px; }
.om__tip { opacity: 0; transition: opacity .2s; pointer-events: none; }
.om__tip rect { fill: #000000; }
.om__tip text { font-size: 34px; font-weight: 500; fill: #FCFBF4; }
.om__glow { fill: url(#om-glow); }
.om__halo { fill: #FCFBF4; stroke: #6E5444; stroke-width: 1.5; }
.om__disc { fill: none; stroke: #8A6F4E; stroke-width: 4.5; stroke-linecap: round; }
.om__ray { fill: none; stroke: #000000; stroke-width: 2.4; stroke-linecap: round; }
.om__plab { font: 400 32px var(--cap, "Yaku Titulo", Georgia, serif); letter-spacing: .08em; fill: #000000; paint-order: stroke; stroke: #FCFBF4; stroke-width: 8px; stroke-linejoin: round; }
/* destino activo: su ruta se resalta y aparece el tiempo */
.om[data-active] .om__route { opacity: .35; }
.om[data-active="lir"] .om__route[data-k="lir"], .om[data-active="huacas"] .om__route[data-k="huacas"], .om[data-active="flamingo"] .om__route[data-k="flamingo"],
.om[data-active="conchal"] .om__route[data-k="conchal"], .om[data-active="tamarindo"] .om__route[data-k="tamarindo"] { opacity: 1; stroke: #000000; stroke-width: 7; }
.om[data-active="lir"] .om__dest[data-k="lir"] .om__tip, .om[data-active="huacas"] .om__dest[data-k="huacas"] .om__tip, .om[data-active="flamingo"] .om__dest[data-k="flamingo"] .om__tip,
.om[data-active="conchal"] .om__dest[data-k="conchal"] .om__tip, .om[data-active="tamarindo"] .om__dest[data-k="tamarindo"] .om__tip { opacity: 1; }
.om__dest:focus-visible .om__hit { stroke: #000000; stroke-width: 3; }
.om__cap { font-size: 14px; line-height: 1.45; color: #52220B; margin-top: 10px; }
.om__cap span { display: block; font-size: 12.5px; margin-top: 2px; }
/* tarjetas debajo del mapa */
.om__cards { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
@media (max-width: 600px) { .om__cards { grid-template-columns: 1fr 1fr; } }
.om__cards li { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 8px; padding: 12px 14px; background: #FCFBF4; border: 1px solid rgba(21, 20, 18, .18); cursor: pointer; transition: border-color .2s, background .2s; }
.om__cards li:hover, .om__cards li:focus-visible, .om__cards li.is-on { border-color: #000000; background: #F8F6EA; outline: none; }
.om__cic { width: 26px; height: 22px; }
.om__cic path { fill: none; stroke: #000000; stroke-width: 2.4; stroke-linecap: round; }
.om__cic circle { fill: #000000; }
.om__cn { font-size: 15px; line-height: 1.25; }
.om__ct { grid-column: 1 / -1; font-size: 14px; color: #52220B; }
.om__ct b { white-space: nowrap; }
.om__ct b { font: 400 21px var(--cap, "Yaku Titulo", Georgia, serif); color: #000000; }
.om__go { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.om__go[hidden] { display: none; }
/* dibujo de rutas al llegar (solo con JS y movimiento permitido) */
@media (prefers-reduced-motion: no-preference) {
  .om--anim .om__route { stroke-dashoffset: 1; }
  .om--anim.is-in .om__route { stroke-dashoffset: 0; transition: stroke-dashoffset 1.6s cubic-bezier(.4, .1, .2, 1), stroke .25s, stroke-width .25s, opacity .25s; }
  .om--anim.is-in .om__route[data-k="huacas"] { transition-delay: .1s, 0s, 0s, 0s; }
  .om--anim.is-in .om__route[data-k="flamingo"] { transition-delay: .35s, 0s, 0s, 0s; }
  .om--anim.is-in .om__route[data-k="conchal"] { transition-delay: .5s, 0s, 0s, 0s; }
  .om--anim.is-in .om__route[data-k="tamarindo"] { transition-delay: .65s, 0s, 0s, 0s; }
  .om--anim .om__glow { animation: omGlow 3.2s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
}
@keyframes omGlow { 0%, 100% { opacity: .75; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.06); } }
@media print { .om__route { stroke-dashoffset: 0 !important; } .om__go { display: none; } }
@media (max-width: 600px) { .om__lab { font-size: 40px; stroke-width: 9px; } .om__town text { font-size: 36px; } .om__plab { font-size: 42px; } .om__ocean { font-size: 30px; } }
.om__ct small { font-size: 13px; }