:root {
    --azul-emaus: #002b5c;
    --rojo-emaus: #e60000;
    --gris-fondo: #f1f5f9;
    --texto: #334155;
}

body { font-family: 'Segoe UI', sans-serif; background: var(--gris-fondo); margin: 0; }


.parroquia-header {
    background: var(--azul-emaus);
    color: white;
    text-align: center;
    padding: 35px 20px 30px; /* antes era mucho más alto */
}


.parroquia-header h1 {
    margin: 0;
    font-size: 2.1rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}


.parroquia-header p {
    margin: 6px 0 18px; /* reduce espacio vertical */
    font-size: 0.9rem;
    opacity: 0.9;
}


.search-box {
    max-width: 460px;
    margin: 0 auto;
}

.search-box input {
    padding: 12px 20px; /* menos alto */
    border-radius: 25px;
    font-size: 0.9rem;
}



.main-container { max-width: 1100px; margin: 30px auto; padding: 0 20px; }

.parroquia-ficha {
    background: white;
    border-radius: 12px;
    margin-bottom: 20px;
    display: flex;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    border-left: 8px solid var(--rojo-emaus);
    overflow: hidden;
}

.foto-contenedor { width: 220px; flex-shrink: 0; position: relative; }
.parroquia-foto { width: 100%; height: 100%; object-fit: cover; }

.info-contenedor { flex: 1; padding: 20px; display: flex; flex-direction: column; }
.info-header h2 { margin: 0; color: var(--azul-emaus); font-size: 1.3rem; }

.info-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 15px; margin-top: 15px; }

.info-col h4 { margin: 0 0 5px; font-size: 0.75rem; color: var(--azul-emaus); text-transform: uppercase; border-bottom: 1px solid #eee; }
.info-col p { font-size: 0.85rem; margin: 3px 0; color: var(--texto); }

.highlight-emaus { background: #f0f4f8; padding: 10px; border-radius: 8px; }

.btn-contacto { 
    display: inline-flex; align-items: center; gap: 5px;
    background: #25d366; color: white; padding: 5px 10px; 
    border-radius: 4px; text-decoration: none; font-size: 0.8rem; font-weight: bold; margin-top: 5px;
}

.map-link { color: #dc2626; text-decoration: none; font-weight: bold; font-size: 0.8rem; }
.social-links { margin-top: 8px; }
.social-links a { color: var(--azul-emaus); margin-right: 10px; font-size: 1rem; }

@media (max-width: 900px) {
    .parroquia-ficha { flex-direction: column; }
    .foto-contenedor { width: 100%; height: 150px; }
    .info-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .parroquia-header h1 {
        font-size: 1.9rem;
    }

    .parroquia-header p {
        font-size: 0.85rem;
    }
}
@media (max-width: 600px) {
    .parroquia-header {
        padding: 30px 15px 25px;
    }

    .parroquia-header h1 {
        font-size: 1.8rem;
    }

    .parroquia-header p {
        margin-bottom: 14px;
        font-size: 0.85rem;
    }
}
/* Ajuste para que el header no tape el contenido */
.parroquia-header {
    margin-top: 80px; /* Ajusta este valor según el alto de tu navbar */
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
    background-color: #002b5c; /* El color azul que se ve en tu imagen */
    color: white;
}

/* Si el navbar es muy alto en móviles, podrías necesitar más espacio */
@media (max-width: 768px) {
    .parroquia-header {
        margin-top: 70px; 
    }
}
/* ====================================================
   NUEVO ESTILO CÁLIDO: DIRECTORIO DE PARROQUIAS
   (Inspirado en el diseño de Emaús)
   ==================================================== */

.parroquia-header {
    margin-top: 80px; /* Ajuste para el navbar fixed */
    padding: 60px 20px; /* Más aire arriba y abajo para elegancia */
    text-align: center;
    
    /* FONDO MARFIL SUAVE (Como el fondo de tu imagen de referencia) */
    background-color: #fcfaf5 !important; 
    color: #ffffff; /* El texto lo cambiaremos a un tono oscuro */
    border-bottom: 1px solid rgba(123, 31, 31, 0.1);
}

.parroquia-header h1 {
    /* TEXTO ROJO VINO/GARNET (El color de Emaús) */
    color: #7b1f1f !important;
    font-family: 'Playfair Display', serif; /* Manteniendo la tipografía elegante */
    font-size: 2.5rem;
    margin-bottom: 10px;
}

.parroquia-header p {
    /* TEXTO GRIS OSCURO SUAVE (No negro puro) */
    color: #555555 !important; 
    font-size: 1.1rem;
    margin-top: 0;
    opacity: 0.9;
}

/* ====================================================
   ESTILO PARA LA CAJA DE BÚSQUEDA
   ==================================================== */

.search-box {
    position: relative;
    max-width: 500px;
    margin: 30px auto 0;
    /* Sombra suave para que flote sobre el fondo marfil */
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    border-radius: 25px;
}

.search-box input {
    width: 100%;
    padding: 15px 45px 15px 25px;
    border-radius: 25px;
    
    /* FONDO BLANCO PURO PARA EL INPUT */
    background-color: #ffffff !important; 
    color: #645757;
    
    /* Borde muy sutil para definición */
    border: 1px solid #eeeeee; 
    outline: none;
    font-size: 1rem;
}

.search-box i {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    
    /* ICONO ROJO VINO (Combina con el título) */
    color: #7b1f1f !important; 
    font-size: 1.1rem;
}/* ====================================================
   NUEVO ESTILO SOBRIO Y PROFUNDO: DIRECTORIO
   (Inspirado en el tono de caja de tu imagen)
   ==================================================== */

.parroquia-header {
    margin-top: 80px; /* Ajuste para el navbar fixed */
    padding: 70px 20px; /* Un poco más de aire para solemnidad */
    text-align: center;
    
    /* FONDO BEIGE ARENA SUAVE Y MÁS OSCURO (Inspirado en tu imagen) */
    background-color: #e9e0d9 !important; 
    
    /* El texto lo cambiaremos a tonos oscuros */
    color: #ffffff; 
    border-bottom: 1px solid rgba(123, 31, 31, 0.1);
    box-shadow: inset 0 -10px 30px rgba(0,0,0,0.02); /* Sombra interna muy sutil */
}

.parroquia-header h1 {
    /* TEXTO ROJO VINO/GARNET (El color de Emaús) */
    color: #7b1f1f !important;
    font-family: 'Playfair Display', serif; /* Tipografía elegante y humana */
    font-size: 2.8rem; /* Un poco más grande para impacto */
    margin-bottom: 15px;
    font-weight: 700;
}

.parroquia-header p {
    /* TEXTO GRIS OSCURO MÁS PROFUNDO (No negro puro) */
    color: #4a4a4a !important; 
    font-size: 1.2rem;
    margin-top: 0;
    opacity: 0.95;
    font-family: 'Marcellus', serif; /* Consistencia tipográfica */
}

/* ====================================================
   ESTILO PARA LA CAJA DE BÚSQUEDA
   ==================================================== */

.search-box {
    position: relative;
    max-width: 550px; /* Un poco más ancha para elegancia */
    margin: 40px auto 0;
    
    /* Sombra suave y más profunda para que flote sobre el fondo */
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
    border-radius: 30px;
}

.search-box input {
    width: 100%;
    padding: 18px 50px 18px 30px; /* Más padding para comodidad */
    border-radius: 30px;
    
    /* FONDO BLANCO PURO PARA EL INPUT */
    background-color: #ffffff !important; 
    
    /* Texto de búsqueda en gris oscuro */
    color: #333333;
    
    /* Borde muy sutil para definición */
    border: 1px solid #dcdcdc; 
    outline: none;
    font-size: 1.1rem;
    font-family: Arial, sans-serif;
}

.search-box input::placeholder {
    color: #2c1616; /* Color del texto de ayuda */
    opacity: 0.8;
}

.search-box i {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    
    /* ICONO ROJO VINO (Combina con el título) */
    color: #272121 !important; 
    font-size: 1.2rem;
}
/* ====================================================
   ESTILO COMPACTO: DIRECTORIO DE PARROQUIAS
   ==================================================== */

.parroquia-header {
    margin-top: 60px; /* Reducido para que suba más */
    padding: 30px 20px; /* Reducido drásticamente el espacio arriba/abajo */
    text-align: center;
    background-color: #e9e0d9 !important; /* Mantenemos el tono sobrio profundo */
    border-bottom: 1px solid rgba(123, 31, 31, 0.1);
}

.parroquia-header h1 {
    color: #7b1f1f !important; /* Rojo Emaús */
    font-family: 'Playfair Display', serif;
    font-size: 2.2rem; /* Un poco más pequeño para ahorrar espacio */
    margin-bottom: 5px; /* Espacio mínimo con el subtítulo */
    font-weight: 700;
}

.parroquia-header p {
    color: #4a4a4a !important; 
    font-size: 1rem;
    margin-top: 0;
    margin-bottom: 20px; /* Espacio justo antes de la búsqueda */
}

/* ====================================================
   CAJA DE BÚSQUEDA COMPACTA
   ==================================================== */

.search-box {
    position: relative;
    max-width: 480px; /* Más estrecha lateralmente */
    margin: 0 auto; /* Centrada sin margen extra arriba */
}

.search-box input {
    width: 100%;
    padding: 10px 45px 10px 20px; /* Más delgada verticalmente */
    border-radius: 20px;
    background-color: #ffffff !important; 
    color: #333333;
    border: 1px solid #dcdcdc; 
    outline: none;
    font-size: 0.95rem;
}

.search-box i {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #7b1f1f !important; 
    font-size: 1rem;
}