/* ================================================
   TURISMO BLOQUES — estilos visuales v1.2
   ================================================ */
:root {
    --tb-verde:        #2D6A4F;
    --tb-verde-claro:  #52B788;
    --tb-verde-palido: #D8F3DC;
    --tb-gris:         #3D3D3D;
    --tb-gris-sec:     #666;
    --tb-borde:        #E0D9CE;
    --tb-blanco:       #ffffff;
}

/* ---- ÉPOCAS ---- */
.tb-epoca-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
/* elimina cualquier br residual que quede dentro del grid */
.tb-epoca-grid br { display: none !important; }

@media (max-width: 700px) { .tb-epoca-grid { grid-template-columns: 1fr 1fr !important; } }
@media (max-width: 400px) { .tb-epoca-grid { grid-template-columns: 1fr !important; } }

.tb-epoca-card {
    background: var(--tb-blanco);
    border-radius: 10px;
    border: 1px solid var(--tb-borde);
    padding: 20px 16px;
    text-align: center;
    transition: transform .2s, box-shadow .2s;
    margin: 0 !important;
}
.tb-epoca-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(45,106,79,.10);
}
.tb-epoca-icon {
    font-size: 28px;
    margin-bottom: 10px;
    display: block;
    line-height: 1;
}
.tb-epoca-icon img.emoji {
    width: 28px !important;
    height: 28px !important;
    vertical-align: middle !important;
}
.tb-epoca-nombre {
    font-size: 15px !important;
    color: var(--tb-verde) !important;
    margin: 0 0 6px 0 !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}
.tb-epoca-texto {
    font-size: 13px !important;
    color: var(--tb-gris-sec) !important;
    line-height: 1.55 !important;
    margin: 0 !important;
}

/* ---- LUGARES CERCANOS ---- */
.tb-cercanos-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* elimina br residuales entre los tags */
.tb-cercanos-wrap br { display: none !important; }

.tb-cercano-tag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: var(--tb-blanco) !important;
    border: 1px solid var(--tb-borde) !important;
    border-radius: 8px !important;
    padding: 9px 16px !important;
    font-size: 14px !important;
    color: var(--tb-gris) !important;
    text-decoration: none !important;
    transition: border-color .2s, background .2s !important;
    margin: 0 !important;
}
a.tb-cercano-tag:hover {
    border-color: var(--tb-verde-claro) !important;
    background: var(--tb-verde-palido) !important;
    color: var(--tb-verde) !important;
}
.tb-cercano-dist {
    color: var(--tb-verde-claro) !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}

/* ---- CONSEJOS ---- */
.tb-consejos-list {
    list-style: none !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
}
.tb-consejos-list br { display: none !important; }

@media (max-width: 600px) { .tb-consejos-list { grid-template-columns: 1fr !important; } }

.tb-consejo-item {
    font-size: 14px !important;
    color: var(--tb-gris-sec) !important;
    padding: 12px 16px !important;
    background: var(--tb-blanco) !important;
    border-radius: 8px !important;
    border: 1px solid var(--tb-borde) !important;
    display: flex !important;
    gap: 10px !important;
    align-items: flex-start !important;
    line-height: 1.55 !important;
    transition: border-color .2s !important;
    margin: 0 !important;
}
.tb-consejo-item:hover { border-color: var(--tb-verde-claro) !important; }
.tb-check {
    color: var(--tb-verde-claro) !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    flex-shrink: 0 !important;
    margin-top: 1px !important;
}