.tourism-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; margin: 34px 0; color: var(--ink-soft); font-size: 15px; line-height: 1.85; }
.tourism-intro p { margin: 0; }
.tourism-photo-dialog { width: min(1100px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 56px 16px 16px; border: 0; border-radius: 18px; background: #102a3e; color: #fff; }
.tourism-photo-dialog::backdrop { background: #081925dc; }
.tourism-photo-dialog img { display: block; width: 100%; height: auto; max-height: calc(100dvh - 160px); object-fit: contain; }
.tourism-photo-dialog p { margin: 14px 0 0; text-align: center; font-size: 14px; line-height: 1.5; }
.tourism-modal-close { position: absolute; top: 10px; right: 12px; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #ffffff55; border-radius: 50%; background: transparent; color: #fff; cursor: pointer; font-size: 28px; }
.tourism-modal-close:hover { background: #ffffff22; }
.tourism-modal-close:focus-visible { outline: 3px solid #f28b18; outline-offset: 3px; }
html:has(.tourism-photo-dialog[open]) { overflow: hidden; }
.tourism-carousel { --photo-height: clamp(320px, 44vw, 530px); position: relative; margin: 36px 0; padding: 12px; border: 1px solid #dce7ed; border-radius: 24px; background: #fff; box-shadow: 0 16px 40px #1029610a; }
.tourism-gallery { display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scroll-margin-top: 100px; border-radius: 16px; scrollbar-width: none; }
.tourism-gallery::-webkit-scrollbar { display: none; }
.tourism-gallery a { display: block; flex: 0 0 100%; height: var(--photo-height); overflow: hidden; scroll-snap-align: start; scroll-snap-stop: always; }
.tourism-carousel-controls { position: absolute; inset: 12px 12px auto; height: var(--photo-height); display: flex; align-items: center; justify-content: space-between; padding: 0 20px; pointer-events: none; color: #fff; font-size: 13px; font-weight: 700; }
.tourism-carousel-controls[hidden] { display: none; }
.tourism-carousel-controls button { pointer-events: auto; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ffffff88; border-radius: 50%; color: #102961; background: #fffffff0; box-shadow: 0 4px 18px #10296122; cursor: pointer; font-size: 24px; }
.tourism-carousel-controls [data-tourism-counter] { position: absolute; right: 20px; bottom: 18px; padding: 8px 14px; border: 1px solid #ffffff44; border-radius: 999px; background: #102961b8; backdrop-filter: blur(8px); letter-spacing: .1em; }
.tourism-photo-caption { padding: 18px 12px 4px; font-size: 14px; font-weight: 600; color: var(--ink); }
.tourism-thumbnails { display: flex; gap: 10px; overflow-x: auto; padding: 12px 8px 8px; }
.tourism-thumbnails button { flex: 1 0 64px; height: 74px; padding: 3px; border: 2px solid transparent; border-radius: 12px; background: transparent; cursor: pointer; opacity: .55; transition: opacity .2s, border-color .2s; }
.tourism-thumbnails button[aria-pressed="true"] { opacity: 1; border-color: #d90080; }
.tourism-thumbnails button:hover { opacity: 1; }
.tourism-thumbnails img { width: 100%; height: 100%; object-fit: cover; border-radius: 7px; }
.tourism-carousel-controls button:hover:not(:disabled) { color: #fff; background: #172982; }
.tourism-carousel-controls button:disabled { opacity: .35; cursor: default; }
.tourism-carousel button:focus-visible, .tourism-gallery:focus-visible { outline: 3px solid #f28b18; outline-offset: 3px; }
.tourism-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.tourism-gallery a:hover img { transform: scale(1.03); }
.tourism-contact { display: flex; align-items: center; flex-wrap: wrap; gap: 20px 32px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.tourism-contact h3 { margin: 6px 0 0; color: var(--ink); font-size: 20px; }
.tourism-contact > div { margin-right: auto; }
.tourism-contact > a:not(.tourism-button) { font-size: 13px; }
.tourism-contact { background: #edf4f6; border: 0; gap: 20px; padding: 28px; }
.tourism :is(a):focus-visible { outline: 3px solid #f28b18; outline-offset: 4px; }
#hoteles { scroll-margin-top: 72px; }
.tourism-contact a { color: var(--ink); font-weight: 700; overflow-wrap: anywhere; }
.tourism-contact .tourism-button { padding: 14px 22px; border-radius: 999px; background: #172982; color: #fff; }
.tourism-gallery a:focus-visible, .tourism-contact a:focus-visible, .water-voices a:focus-visible { outline: 3px solid #f28b18; outline-offset: 4px; }
.water-voices { background: #eaf5f8; border-radius: 24px; }
.water-voices > p { max-width: 900px; color: var(--ink-soft); line-height: 1.75; }
.voices-schedule { width: 100%; border-collapse: collapse; margin: 28px 0; background: #fff; }
.voices-schedule th, .voices-schedule td { padding: 18px; text-align: left; border-bottom: 1px solid var(--line); line-height: 1.6; }
.voices-schedule th { color: #fff; background: #172982; }
.voices-registration { padding: 24px; border-radius: 16px; background: #fff; }
.voices-registration h3 { margin-top: 0; }
.voices-registration li { margin: 10px 0; line-height: 1.6; }
@media (max-width: 850px) { .tourism-intro { gap: 24px; } }
@media (max-width: 600px) { .tourism-intro { grid-template-columns: 1fr; gap: 18px; margin: 26px 0; } .tourism-carousel { --photo-height: 300px; padding: 8px; border-radius: 20px; } .tourism-carousel-controls { inset: 8px 8px auto; padding: 0 10px; } .tourism-carousel-controls button { width: 38px; height: 38px; } .tourism-thumbnails button { flex: 0 0 64px; height: 54px; } .tourism-photo-caption { font-size: 12px; } }
@media (max-width: 480px) { .tourism-contact { align-items: flex-start; flex-direction: column; } .voices-schedule th, .voices-schedule td { padding: 12px; font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .tourism-gallery img { transition: none; } }