@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&family=Playfair+Display:wght@400;500;600;700&display=swap');

/* Definindo as cores personalizadas */
:root {
  --color-gold: #D4AF37;
  --color-metalblue: #5D8AA8;
  --color-dark: #1a1a1a;
}

.hero-bg {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('https://images.unsplash.com/photo-1431274172761-fca41d930114?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80');
    background-size: cover;
    background-position: center;
    min-height: 90vh;
}

/* Classes de utilidade para as cores personalizadas */
.text-gold {
  color: var(--color-gold);
}

.bg-gold {
  background-color: var(--color-gold);
}

.border-gold {
  border-color: var(--color-gold);
}

.text-metalblue {
  color: var(--color-metalblue);
}

.bg-metalblue {
  background-color: var(--color-metalblue);
}

.bg-dark {
  background-color: var(--color-dark);
}

.text-dark {
  color: var(--color-dark);
}

.destination-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.btn-gold {
    background-color: var(--color-gold);
    color: white;
    transition: all 0.3s ease;
}

.btn-gold:hover {
    background-color: #b5942e;
    transform: scale(1.05);
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.5);
}

.feature-card:hover .feature-icon {
    transform: rotateY(180deg);
}

.feature-icon {
    transition: transform 0.5s ease;
}

.testimonial-card {
    transition: all 0.3s ease;
}

.testimonial-card:hover {
    transform: scale(1.03);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
    animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.floating-btn {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.7); }
    70% { box-shadow: 0 0 0 15px rgba(212, 175, 55, 0); }
    100% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0); }
}

html {
    scroll-behavior: smooth;
}

/* Estilos para o Flatpickr */
.flatpickr-calendar {
    font-family: 'Montserrat', sans-serif;
}

.flatpickr-day.selected {
    background: var(--color-gold);
    border-color: var(--color-gold);
}

/* Estilos para o menu mobile */
#mobile-menu {
  transition: all 0.3s ease;
}

/* Garantir que os botões de filtro tenham as cores corretas */
.filter-btn.bg-gold {
  background-color: var(--color-gold);
}

.filter-btn.bg-white {
  background-color: white;
}

.filter-btn.text-white {
  color: white;
}

.filter-btn.text-dark {
  color: var(--color-dark);
}

/* Efeitos de hover para os botões de filtro */
.filter-btn:not(.bg-gold):hover {
  background-color: #f1f1f1;
}
.logo-container {
    display: flex;
    align-items: center;
  }
  
  .logo-light {
    display: none;
    height: 80px;
  }
  
  .logo-dark {
    display: none;
    height: 40px;
  }
  
  /* Mostrar a logo dourada em fundos escuros */
  .bg-dark .logo-dark,
  .bg-metalblue .logo-dark {
    display: block;
  }
  
  /* Mostrar a logo preta em fundos claros */
  .bg-white .logo-light,
  .bg-gray-50 .logo-light,
  .bg-gray-100 .logo-light {
    display: block;
  }
  
  /* Favicon */
  .favicon {
    width: 64px;
    height: 64px;
  }

/* Adicionar ao seu CSS existente */

/* Melhorar a aparência das abas ativas */
.tab-btn.active {
    border-bottom-color: var(--color-gold) !important;
    color: var(--color-gold);
}

/* Estilo para o FAQ */
.faq-btn {
    transition: color 0.3s ease;
}

.faq-btn:hover {
    color: var(--color-gold);
}

.faq-answer {
    transition: all 0.3s ease;
}

/* Garantir que o modal seja responsivo */
@media (max-width: 768px) {
    #package-modal > div {
        width: 95%;
        margin: 1rem;
    }
    
    .tab-btn {
        font-size: 0.875rem;
        padding: 0.5rem 0.75rem;
    }
}

/* Melhorar a rolagem no modal */
#package-modal > div {
    max-height: 90vh;
    overflow-y: auto;
}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&family=Playfair+Display:wght@400;500;600;700&display=swap');

:root {
  --color-gold: #D4AF37;
  --color-metalblue: #5D8AA8;
  --color-dark: #1a1a1a;
}

.hero-bg {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('https://images.unsplash.com/photo-1431274172761-fca41d930114?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwa90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80');
    background-size: cover;
    background-position: center;
    min-height: 90vh;
}

.text-gold { color: var(--color-gold); }
.bg-gold { background-color: var(--color-gold); }
.border-gold { border-color: var(--color-gold); }
.text-metalblue { color: var(--color-metalblue); }
.bg-metalblue { background-color: var(--color-metalblue); }
.bg-dark { background-color: var(--color-dark); }
.text-dark { color: var(--color-dark); }

.destination-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.btn-gold {
    background-color: var(--color-gold);
    color: white;
    transition: all 0.3s ease;
}

.btn-gold:hover {
    background-color: #b5942e;
    transform: scale(1.05);
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.5);
}

.feature-card:hover .feature-icon {
    transform: rotateY(180deg);
}

.feature-icon {
    transition: transform 0.5s ease;
}

.testimonial-card {
    transition: all 0.3s ease;
}

.testimonial-card:hover {
    transform: scale(1.03);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
    animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.floating-btn {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.7); }
    70% { box-shadow: 0 0 0 15px rgba(212, 175, 55, 0); }
    100% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0); }
}

html {
    scroll-behavior: smooth;
}

.flatpickr-calendar {
    font-family: 'Montserrat', sans-serif;
}

.flatpickr-day.selected {
    background: var(--color-gold);
    border-color: var(--color-gold);
}

#mobile-menu {
  transition: all 0.3s ease;
}

.filter-btn.bg-gold {
  background-color: var(--color-gold);
}

.filter-btn.bg-white {
  background-color: white;
}

.filter-btn.text-white {
  color: white;
}

.filter-btn.text-dark {
  color: var(--color-dark);
}

.filter-btn:not(.bg-gold):hover {
  background-color: #f1f1f1;
}

.logo-container {
    display: flex;
    align-items: center;
}

.logo-light {
    display: none;
    height: 80px;
}

.logo-dark {
    display: none;
    height: 80px;
}

.bg-dark .logo-dark,
.bg-metalblue .logo-dark {
    display: block;
}

.bg-white .logo-light,
.bg-gray-50 .logo-light,
.bg-gray-100 .logo-light {
    display: block;
}

.tab-btn.active {
    border-bottom-color: var(--color-gold) !important;
    color: var(--color-gold);
}

.faq-btn {
    transition: color 0.3s ease;
}

.faq-btn:hover {
    color: var(--color-gold);
}

.faq-answer {
    transition: all 0.3s ease;
}

@media (max-width: 768px) {
    [id^="modal-"] > div {
        width: 95%;
        margin: 1rem;
    }
    
    .tab-btn {
        font-size: 0.875rem;
        padding: 0.5rem 0.75rem;
    }
}

[id^="modal-"] > div {
    max-height: 90vh;
    overflow-y: auto;
}
.section-anchor {
    position: relative;
    top: -20px; /* Ajuste fino para o posicionamento */
    visibility: hidden;
}
  /* CORREÇÕES PARA O LAYOUT TORTO */
    .container {
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }
    
    .grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 20px;
        margin: 20px 0;
    }
    
    .grid img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        border-radius: 8px;
    }
    
    .flex {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
    }
    
    /* Garantir que todos os elementos estejam contidos */
    .tab-content {
        width: 100%;
        overflow: hidden;
    }
    
    /* Correção para a galeria de fotos */
    #photos .grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    @media (max-width: 768px) {
        #photos .grid {
            grid-template-columns: repeat(2, 1fr);
        }
        
        .flex {
            flex-direction: column;
            align-items: flex-start;
        }
    }
    
    @media (max-width: 480px) {
        #photos .grid {
            grid-template-columns: 1fr;
        }
    }
    .clearfix::after {
        content: "";
        clear: both;
        display: table;
    }
    /* CORREÇÕES ESPECÍFICAS PARA SERVIÇOS INCLUSOS */
.grid.grid-cols-1.md\:grid-cols-2.gap-6 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    width: 100%;
}

@media (min-width: 768px) {
    .grid.grid-cols-1.md\:grid-cols-2.gap-6 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Correção para os itens da lista */
.space-y-2 {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.flex.items-start {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
}

.flex.items-start .mr-2 {
    margin-right: 0.5rem;
    flex-shrink: 0;
    margin-top: 0.25rem;
}

/* Garantir que os ícones e textos fiquem alinhados */
.flex.items-start i {
    min-width: 16px;
    text-align: center;
}

.flex.items-start span {
    flex: 1;
    line-height: 1.4;
}

/* Correção para os cabeçalhos */
.font-bold.mb-2 {
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--color-gold);
    width: 100%;
}

/* Garantir que as colunas tenham a mesma altura */
.grid.grid-cols-1.md\:grid-cols-2.gap-6 > div {
    display: flex;
    flex-direction: column;
}

/* Correção específica para o layout torto */
.tab-content#included {
    padding: 1rem 0;
}

.tab-content#included .grid {
    align-items: start;
}

/* Ajustes de responsividade */
@media (max-width: 640px) {
    .flex.items-start {
        flex-direction: row;
        align-items: flex-start;
    }
    
    .flex.items-start i {
        margin-top: 0.25rem;
    }
}
/* ===== CORREÇÃO EMERGENCIA DOS MODAIS ===== */
.modal-roteiro {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    z-index: 10000;
    overflow-y: auto;
}

.modal-roteiro:not(.hidden) {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.modal-roteiro.hidden {
    display: none !important;
}

.modal-roteiro > div {
    background: white;
    border-radius: 12px;
    max-width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    margin: 20px;
    position: relative;
}

/* Garantir que o body não scroll quando modal aberto */
body.modal-open {
    overflow: hidden;
}

/* Correção da logo no footer */
footer .logo-dark {
    height: 40px !important;
    width: auto !important;
}

@media (max-width: 768px) {
    footer .logo-dark {
        height: 30px !important;
    }
    
    .modal-roteiro > div {
        max-width: 95%;
        margin: 10px;
    }
}
/* Garantir alinhamento à esquerda em todas as seções de texto */
.container mx-auto px-4 p-8 rounded-lg shadow-md,
.bg-white p-8 rounded-lg shadow-md {
    text-align: left;
}

/* Forçar alinhamento à esquerda em todos os textos */
.text-left {
    text-align: left !important;
}

.flex-1 {
    flex: 1;
}

/* Correção específica para itens de lista */
.flex.items-start {
    align-items: flex-start;
}

.flex.items-start > div {
    width: 100%;
}