/* Salvador — Tema Pelourinho (claro, colonial) */
/* Re-usa classes rio-* de Riodejaneiro.css */

.main-container.rio-page {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 0 !important;
    position: relative !important;
}

/* Garante full-bleed do topo (header + painel) sem recuo lateral.
   Usa 100vw (não 100%) porque .main-container.rio-page tem overflow-y:auto
   e gera sua própria barra de rolagem interna, que "rouba" espaço de um
   width:100% do lado direito. 100vw ignora essa barra e cola nas bordas reais. */
.rio-page > header,
.rio-page > .rio-hero {
  width: 100vw;
  margin-left: 0;
  margin-right: 0;
}

/* Fundo fixo próprio de Salvador (substitui o fundo do Rio de Janeiro) */
.rio-page::before {
    background-color: var(--city-fundo-cor, #3d2b1f);
    background-image: var(--city-fundo-img, none);
    background-size: cover;
    background-position: center;
}

/* Fundo claro com tom quente de areia, remetendo às fachadas coloridas */
.rio-page {
    background:
        radial-gradient(ellipse at 30% 0%, rgba(210,140,60,0.06) 0%, transparent 70%),
        radial-gradient(ellipse at 80% 100%, rgba(194,120,50,0.05) 0%, transparent 60%),
        #faf6f0;
    color: #3d2b1f;
}

.rio-hero::before {
    background: var(--city-painel-bg, transparent);
}

/* Remove padrão Copacabana — exclusivo do Rio; base escura padronizada
   (mesmo tom azul-marinho do degradê principal) em vez de clarear.
   A máscara de recorte na onda (definida em Riodejaneiro.css, carregado
   antes deste arquivo como base) continua valendo — só a cor/imagem muda. */
.rio-hero::after {
    background: linear-gradient(to bottom, transparent 0%, rgba(12, 35, 64, 0.9) 100%);
}

.rio-hero-overlay {
    /* Degradê padronizado com base no Rio de Janeiro, base mais escura/sólida */
    background: linear-gradient(
        180deg,
        rgba(12, 35, 64, 0.60) 0%,
        rgba(26, 82, 118, 0.38) 60%,
        rgba(12, 35, 64, 0.88) 100%
    );
}

.rio-section-title { color: #0b3c6d; }
.rio-section-subtitle { color: #f1d7b1; }
.rio-tour-card { background: #ffffff; border-color: rgba(161,101,32,0.1); }
.rio-tour-name { color: #5c3a10; }
.rio-tour-details i { color: #c88930; }
.rio-footer-text { color: rgba(61,43,31,0.45); }