/* CSS de la guia de Cancun a Holbox, versionado (PT-09B). Origen: el bloque express-travel-blog-inline-css que sirve la entrada en vivo (_etb_css). */

/* PT-10: estilos locales de la guía. Único corte responsive: 600 px.
   display:none retira la versión oculta también del árbol de accesibilidad.
   No se oculta el texto dentro de la versión visible. */
#eth-guide .eth-cards { display: none !important; }
#eth-guide .eth-tabla-escritorio { display: block !important; }
#eth-guide .eth-card { box-sizing: border-box; min-width: 0; padding: 1rem; border: 1px solid currentColor; border-radius: .5rem; }
#eth-guide .eth-card h3 { margin: 0 0 .75rem; }
#eth-guide .eth-card h4 { margin: 1rem 0 .25rem; font-size: 1em; }
#eth-guide .eth-card ul { margin: 0; padding-inline-start: 1.25rem; }
#eth-guide .eth-card li { overflow-wrap: anywhere; }
#eth-guide .eth-table { width: 100%; table-layout: fixed; }
#eth-guide .eth-table th, #eth-guide .eth-table td { overflow-wrap: anywhere; }
/* Las horas de salida van EN LÍNEA, como texto: sin viñetas, sin borde y sin apariencia de botón
   (siguen sin enlace; el enlace con hora llega con PT-03). */
#eth-guide .eth-times { display: flex !important; flex-wrap: wrap; gap: 8px 12px; list-style: none !important; padding: 0 !important; margin: .5rem 0 1rem !important; }
#eth-guide .eth-times li { display: inline-flex !important; width: auto !important; min-width: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; cursor: auto !important; }
#eth-guide .eth-times time { font-variant-numeric: tabular-nums; font-weight: 600; }
#eth-guide a.eth-btn { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; min-height: 44px !important; max-width: 100%; white-space: normal; text-align: center; }
/* Botón principal (compra): relleno del azul marino de la marca (--ihb-marino de tokens.css). */
#eth-guide a.eth-btn { background: var(--ihb-marino, #011c40); color: var(--ihb-crema, #fffaf0); border: 1.5px solid var(--ihb-marino, #011c40); border-radius: 999px; padding: .5rem 1.25rem; font-weight: 700; text-decoration: none; }
/* Botón secundario («Pedir cotización»): contorno del mismo azul, para que «Comprar» siga siendo lo primero. */
#eth-guide a.eth-btn.eth-btn-secundario { background: transparent !important; color: var(--ihb-marino, #011c40) !important; border: 1.5px solid var(--ihb-marino, #011c40) !important; box-shadow: none !important; }
#eth-guide a.eth-btn.eth-btn-secundario:hover { background: color-mix(in srgb, var(--ihb-marino, #011c40) 8%, transparent) !important; }
#eth-guide a.eth-btn:focus-visible { outline: 2px solid var(--ihb-mar, #08668d); outline-offset: 2px; }
#eth-guide a.eth-btn.eth-btn-secundario:focus-visible { outline: 2px solid var(--ihb-marino, #011c40); outline-offset: 2px; }

/* Los botones y enlaces de acción, centrados entre sí, con 24 px de aire debajo. */
#eth-guide .eth-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-block: 0 24px; }
#eth-guide .eth-actions > a:not(.eth-btn) { display: inline-flex; align-items: center; min-height: 44px; }
/* Un botón suelto (hijo directo de una sección, aside o div) también lleva 24 px debajo. */
#eth-guide :is(section, aside, div):not(.eth-actions) > a.eth-btn { display: inline-flex; margin-block-end: 24px; }
/* 32 px antes de cada título de sección; las tarjetas de opciones y del aside se quedan como están. */
#eth-guide h2:not(:first-child), #eth-guide h3:not(.eth-card h3, .eth-side h3) { margin-block-start: 32px; }
@media (max-width: 600px) {
  #eth-guide .eth-cards { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  #eth-guide .eth-tabla-escritorio { display: none !important; }
}
/*# sourceURL=express-travel-blog-inline-css */


/* PT-09B: base legible de la guía, sin depender del CSS del meta. */
#eth-guide img { max-width: 100%; height: auto; }
#eth-guide .eth-brand { display: flex; align-items: center; gap: 8px; }
#eth-guide .eth-brand img { width: 32px; height: 32px; flex: 0 0 32px; }

/* PT-09B: el índice como chips de 44 px; en escritorio el resumen se oculta y el índice siempre se ve. */
#eth-guide .eth-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 1rem 0; }
#eth-guide .eth-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .9rem; border: 1px solid currentColor; border-radius: 999px; text-decoration: none; }
#eth-guide .eth-nav a:focus-visible, #eth-guide .eth-nav-plegado > summary:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }
#eth-guide .eth-nav-plegado > summary { display: none; min-height: 44px; align-items: center; cursor: pointer; font-weight: 700; }

/* PT-09B: los pasos de la ruta, el lugar y su texto en líneas distintas. */
#eth-guide .eth-route > div { display: block; }
#eth-guide .eth-route strong { display: block; margin-bottom: .15rem; }
#eth-guide .eth-route span { display: block; }

/* PT-09B: medida de línea y foto principal. */
#eth-guide :is(p, li) { max-width: 68ch; }
#eth-guide .eth-hero figure img { display: block; width: 100%; height: auto; max-height: 420px; aspect-ratio: 16 / 9; object-fit: cover; }

@media (max-width: 599px) {
  /* Sin marco de tarjeta: un solo gutter de 16 px; las tarjetas internas (precio, salidas) se quedan. */
  .etb.etb-post--custom { width: 100%; }
  .etb.etb-post--custom .etb-post-body, #eth-guide { border: 0; border-radius: 0; box-shadow: none; background: transparent; }
  #eth-guide { padding-inline: 16px; margin-inline: 0; }
  #eth-guide .eth-pad { padding-inline: 0; }
  #eth-guide .eth-nav-plegado > summary { display: flex; justify-content: space-between; gap: 8px; }
  #eth-guide .eth-nav-plegado > summary::after { content: "\25BE"; transition: transform .2s ease; }
  #eth-guide .eth-nav-plegado[open] > summary::after { transform: rotate(180deg); }
  #eth-guide .eth-nav-plegado:not([open]) > .eth-nav { display: none; }
}
/* PT-09B: la figura sin el margen de 40 px del navegador. */
#eth-guide figure { margin-block: 0 1rem; margin-inline: 0; }