/*form*/
 select[required],
 textarea[required], 
 input[required] {
	 border: 2px solid #ccc;
	 border-radius: 10px;
	 padding: 12px 15px;
	 font-size: 16px;
	 width: 100%;
	 transition: all 0.3s ease;
	 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
	 background-color: #fff;
	 color: #333;
 }

 select[required]:focus,
 textarea[required]:focus, 
 input[required]:focus {
	 outline: none;
	 border-color: #3085d6;
	 box-shadow: 0 0 0 4px rgba(48, 133, 214, 0.2);
 }

 textarea[required]::placeholder,
 input[required]::placeholder {
	 color: #aaa;
	 font-style: italic;
 }


.asunto-select:invalid {
	color: #aaa;
	font-style: italic;
}

.asunto-select:valid {
	color: #333;
	font-style: normal;
}

 select[required]:invalid,
 textarea[required]:invalid,
 input[required]:invalid {
	 border-color: #a9a6a6;
 }

 select[required]:valid,
 textarea[required]:valid,
 input[required]:valid {
	 border-color: #2ecc71;
 }

 .error-msg {
	display: none;
	color: #e74c3c;
	font-size: 0.85em;
}

.input-error {
	border-color: #e74c3c !important;
	box-shadow: 0 0 5px rgba(231, 76, 60, 0.5);
	
}

/*custom rules*/
.custom-hover:hover {
	background-color: white;
	color: #000 !important;
  }

.first {
	color: #f87171;
}

.secondary {
	color: rgb(6, 144, 152);
}

.bg-first {
	background-color: #f84b4bc2;
}
 
.bg-secondary {
	background: rgb(6, 144, 152);
}

.card-img-top {
    width: 100%;
    height: 250px;
    object-fit: cover;
    object-position: center;
}
.slider-text-box {
  margin-top: 26rem; 
}

.text-justify {
	text-align: justify;
}

/*acordeon*/
.custom-accordion .accordion-button {
	color: #000000;
}

.custom-accordion .accordion-button:not(.collapsed) {
	background-color:rgb(6, 144, 152) ;
}

.custom-accordion .accordion-button:focus {
	box-shadow: none;
	outline: none;
}

.primary-menu .menu-link{
	color: #ffffff;
}

.social-icon .bg-transparent{
	color: #ffffff;
}


/*inspirate*/
.portfolio-desc {
	background-color: #067C83 !important;
	color: #fff !important;
	
}

.portfolio-desc {
	display: block !important;
	position: absolute !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.portfolio-desc a {
	color: #fff !important;
	text-decoration: none;
}

.portfolio-image {
	position: relative;
	width: 100%;
	aspect-ratio: 30/40;
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}

.portfolio-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}



/* --- ARREGLO: Estilos solo para la sección "Nuestros Tours" --- */
#related-portfolio .portfolio-item {
	position: relative;
	overflow: hidden;
}

#related-portfolio .portfolio-image img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

/* SOLO para el texto de los tours */
#related-portfolio .portfolio-desc {
	position: relative !important;
	background: transparent !important;
	color: #222 !important;
	padding: 0.5rem 0 !important;
	font-size: 1rem !important;
	text-align: center !important;
	z-index: 1 !important;
}

/* Título dentro de la descripción */
#related-portfolio .portfolio-desc h3 {
	font-size: 1.1rem;
	margin-bottom: 0.2rem;
}

/* Texto inferior */
#related-portfolio .portfolio-desc span {
	font-size: 0.9rem;
	color: #555;
}

#related-portfolio .portfolio-desc a {
	color: inherit !important;
	text-decoration: none !important;
}

#slider {
    background-size: cover !important;; 
    background-position: center !important;;
    background-repeat: no-repeat !important;;
}

/* --- Media Query 768px */
@media (max-width: 768px) {
    #slider {
        min-height: 55vh !important; /* Puede que quieras reducirlo más */
        background-attachment: fixed;
    }
    #slider .slider-text-box h1 {
        font-size: 2em !important; /* Un poco más pequeño */
    }

    /* Ajustes de Sección Quién Soy */
    #quiensoy .col-md-5 {
        min-height: 80vh !important; /* Podrías ajustar este valor si la imagen se corta mucho */
    }

    #quiensoy .col-md-7 .heading-block h1 {
    font-size: 2.1em !important; /* Más pequeño para 480px */
    }

    #quiensoy .col-md-7 p {
        font-size: 1em !important; /* Más pequeño para 480px */
    }

    /* Ajustes de Asesorías - Cards */
    #asesorias .card-body h2 {
        font-size: 1.5em !important;
    }
    #asesorias .card-body h4 {
        font-size: 1em !important;
    }
    #asesorias .card-body p {
        font-size: 1.1em !important;
    }

    /* Sección Asesorías FAQs */
    #asesorias .toggle .toggle-header .toggle-title {
        font-size: 1em !important;
    }
    #asesorias .toggle .toggle-header {
        padding: 0.3rem !important;
    }
    #asesorias .toggle-content {
        font-size: 1em !important;
        padding: 0.5rem 0.7rem !important;
    }

    /* Sección Asesorías - Botón Contratar */
    #asesorias .card-body .button {
        font-size: 1.2em !important; /* Ajustado para 375px */
        padding: 7px 14px !important;
    }

    /* Ajustes para el span del slider */
    #slider .slider-text-box span {
        font-size: 1.4em !important; /* Reducido */
    }

    /* Ajuste para el span en la sección Quién Soy */
    #quiensoy .col-md-7 .heading-block span {
        font-size: 1.75em !important; /* Reducido */
    }

    /* Ajustes específicos para Tips de Viaje en 425px */
    #tipsdeviaje .accordion-button {
        font-size: 0.75em !important;
        padding: 0.6rem 0.6rem !important;
    }
    #tipsdeviaje .accordion-body p {
        font-size: 1em !important;
    }
    
    /* Ajustes del Footer */
    #footer h3 {
        font-size: 1.3em !important;
    }
    #footer p {
        font-size: 0.9em !important;
    }

    /* AJUSTES GENERALES PARA 480PX Y MENOS */
    body {font-size: 16px !important; }
    h1 { font-size: 2em !important; }
    h2 { font-size: 1.5em !important; }
    h3 { font-size: 1.3em !important; }
    h4 { font-size: 1.0em !important; }
    .heading-block > span {font-size: 1.4em !important;}

	/* INICIO DE AJUSTES ESPECÍFICOS PARA INSPIRATE EN MÓVIL (425px) */
    #inspirate .portfolio-item .bg-overlay-content {
        padding: 8px !important; /* Un poco menos de padding */
    }
    #inspirate .portfolio-item h3 {
        font-size: 1em !important;
    }
    #inspirate .portfolio-item span {
        font-size: 0.8em !important;
    }
    /* Asegurar visibilidad para 425px */
    #inspirate .portfolio-item .bg-overlay-content,
    #inspirate .portfolio-item .portfolio-desc {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        position: absolute !important; /* Mantiene la posición absoluta para bg-overlay-content */
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    #inspirate .portfolio-item .bg-overlay,
    #inspirate .portfolio-item .bg-overlay-bg,
    #inspirate .portfolio-item .overlay-trigger-icon {
        display: none !important;
        pointer-events: none !important;
    }
}

/* --- Media Query  480px */
@media (max-width: 480px) {
    #slider {
        min-height: 50vh !important; /* Puede que quieras reducirlo más */
    }
    #slider .slider-text-box h1 {
        font-size: 2em !important; /* Un poco más pequeño */
    }

    /* Ajustes de Sección Quién Soy */
    #quiensoy .col-md-5 {
        min-height: 80vh !important; /* Podrías ajustar este valor si la imagen se corta mucho */
    }

    #quiensoy .col-md-7 .heading-block h1 {
    font-size: 2.1em !important; /* Más pequeño para 480px */
    }

    #quiensoy .col-md-7 p {
        font-size: 1em !important; /* Más pequeño para 480px */
    }

    /* Ajustes de Asesorías - Cards */
    #asesorias .card-body h2 {
        font-size: 1.5em !important;
    }
    #asesorias .card-body h4 {
        font-size: 1em !important;
    }
    #asesorias .card-body p {
        font-size: 1.1em !important;
    }

    /* Sección Asesorías FAQs */
    #asesorias .toggle .toggle-header .toggle-title {
        font-size: 1em !important;
    }
    #asesorias .toggle .toggle-header {
        padding: 0.3rem !important;
    }
    #asesorias .toggle-content {
        font-size: 1em !important;
        padding: 0.5rem 0.7rem !important;
    }

    /* Sección Asesorías - Botón Contratar */
    #asesorias .card-body .button {
        font-size: 1.2em !important; /* Ajustado para 375px */
        padding: 7px 14px !important;
    }

    /* Ajustes para el span del slider */
    #slider .slider-text-box span {
        font-size: 1.4em !important; /* Reducido */
    }

    /* Ajuste para el span en la sección Quién Soy */
    #quiensoy .col-md-7 .heading-block span {
        font-size: 1.75em !important; /* Reducido */
    }

    /* Ajustes específicos para Tips de Viaje en 425px */
    #tipsdeviaje .accordion-button {
        font-size: 0.75em !important;
        padding: 0.6rem 0.6rem !important;
    }
    #tipsdeviaje .accordion-body p {
        font-size: 1em !important;
    }
    
    /* Ajustes del Footer */
    #footer h3 {
        font-size: 1.3em !important;
    }
    #footer p {
        font-size: 0.9em !important;
    }

    /* AJUSTES GENERALES PARA 480PX Y MENOS */
    body {font-size: 16px !important; }
    h1 { font-size: 2em !important; }
    h2 { font-size: 1.5em !important; }
    h3 { font-size: 1.3em !important; }
    h4 { font-size: 1.0em !important; }
    .heading-block > span {font-size: 1.4em !important;}

	/* INICIO DE AJUSTES ESPECÍFICOS PARA INSPIRATE EN MÓVIL (425px) */
    #inspirate .portfolio-item .bg-overlay-content {
        padding: 8px !important; /* Un poco menos de padding */
    }
    #inspirate .portfolio-item h3 {
        font-size: 1em !important;
    }
    #inspirate .portfolio-item span {
        font-size: 0.8em !important;
    }
    /* Asegurar visibilidad para 425px */
    #inspirate .portfolio-item .bg-overlay-content,
    #inspirate .portfolio-item .portfolio-desc {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        position: absolute !important; /* Mantiene la posición absoluta para bg-overlay-content */
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    #inspirate .portfolio-item .bg-overlay,
    #inspirate .portfolio-item .bg-overlay-bg,
    #inspirate .portfolio-item .overlay-trigger-icon {
        display: none !important;
        pointer-events: none !important;
    }
}

/* --- Media Query para 425px */
@media (max-width: 425px) {
    /* Ajustes del Slider */
    #slider {
        min-height: 45vh !important;
    }
    #slider .slider-text-box h1 {
        font-size: 2em !important;
    }

    /* Ajustes de Sección Quién Soy */
    #quiensoy .col-md-5 {
        min-height: 70vh !important; /* Podrías ajustar este valor si la imagen se corta mucho */
    }

    #quiensoy .col-md-7 .heading-block h1 {
    font-size: 2.1em !important; /* Más pequeño para 480px */
    }

    #quiensoy .col-md-7 p {
        font-size: 1em !important; /* Más pequeño para 480px */
    }
    
    /* Ajustes de Asesorías - Cards */
    #asesorias .card-body h2 {
        font-size: 1.6em !important;
    }
    #asesorias .card-body h4 {
        font-size: 1em !important;
    }
    #asesorias .card-body p {
        font-size: 1.1em !important;
    }

    /* Sección Asesorías FAQs */
    #asesorias .toggle .toggle-header .toggle-title {
        font-size: 1em !important;
    }
    #asesorias .toggle .toggle-header {
        padding: 0.3rem !important;
    }
    #asesorias .toggle-content {
        font-size: 1em !important;
        padding: 0.5rem 0.7rem !important;
    }

    /* Sección Asesorías - Botón Contratar */
    #asesorias .card-body .button {
        font-size: 1.2em !important; /* Ajustado para 375px */
        padding: 7px 14px !important;
    }

    /* Ajustes específicos para Tips de Viaje en 425px */
    #tipsdeviaje .accordion-button {
        font-size: 0.75em !important;
        padding: 0.6rem 0.6rem !important;
    }
    #tipsdeviaje .accordion-body p {
        font-size: 1em !important;
    }

    /* Ajustes del Footer */
    #footer h3 {
        font-size: 1.3em !important;
    }
    #footer p {
        font-size: 0.9em !important;
    }

    /* Ajustes para el span del slider */
    #slider .slider-text-box span {
        font-size: 1.4em !important; /* Reducido */
    }

    /* Ajuste para el span en la sección Quién Soy */
    #quiensoy .col-md-7 .heading-block span {
        font-size: 1.75em !important; /* Reducido */
    }

    /* Ajustes generales de texto para 425px */
    body { font-size: 15px !important; }
    h1 { font-size: 2.1em !important; }
    h2 { font-size: 1.4em !important; }
    h3 { font-size: 1.2em !important; }
    h4 { font-size: 1em !important; }
    p { font-size: 1em !important; }
    .heading-block > span {font-size: 1.5em !important;}

	/* INICIO DE AJUSTES ESPECÍFICOS PARA INSPIRATE EN MÓVIL (425px) */
    #inspirate .portfolio-item .bg-overlay-content {
        padding: 8px !important; /* Un poco menos de padding */
    }
    #inspirate .portfolio-item h3 {
        font-size: 1em !important;
    }
    #inspirate .portfolio-item span {
        font-size: 0.8em !important;
    }
    /* Asegurar visibilidad para 425px */
    #inspirate .portfolio-item .bg-overlay-content,
    #inspirate .portfolio-item .portfolio-desc {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        position: absolute !important; /* Mantiene la posición absoluta para bg-overlay-content */
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    #inspirate .portfolio-item .bg-overlay,
    #inspirate .portfolio-item .bg-overlay-bg,
    #inspirate .portfolio-item .overlay-trigger-icon {
        display: none !important;
        pointer-events: none !important;
    }
}

/* --- Media Query para 375px */
@media (max-width: 375px) {
    /* Ajustes del Slider */
    #slider {
        min-height: 40vh !important;
    }
    #slider .slider-text-box h1 {
        font-size: 2em !important;
    }
    
    /* Ajustes de Sección Quién Soy */
    #quiensoy .col-md-5 {
        min-height: 65vh !important;
    }

    #quiensoy .col-md-7 .heading-block h1 {
    font-size: 2.3em !important; /* Más pequeño para 480px */
    }

    #quiensoy .col-md-7 p {
        font-size: 1em !important; /* Más pequeño para 480px */
    }

    /* Ajustes de Asesorías - Cards */
    #asesorias .card-body h2 {
        font-size: 1.5em !important;
    }
    #asesorias .card-body h4 {
        font-size: 1em !important;
    }
    #asesorias .card-body p {
        font-size: 1em !important;
    }

      /* Sección Asesorías FAQs */
    #asesorias .toggle .toggle-header .toggle-title {
        font-size: 0.85em !important;
    }
    #asesorias .toggle .toggle-header {
        padding: 0.3rem !important;
    }
    #asesorias .toggle-content {
        font-size: 1em !important;
        padding: 0.5rem 0.7rem !important;
    }

      /* Sección Asesorías - Botón Contratar */
    #asesorias .card-body .button {
        font-size: 1.1em !important; /* Ajustado para 375px */
        padding: 7px 14px !important;
    }

    /* Ajustes del Footer */
    #footer h3 {
        font-size: 1.2em !important;
    }
    #footer p {
        font-size: 0.85em !important;
    }

    /* Ajustes para el span del slider */
    #slider .slider-text-box span {
        font-size: 1.4em !important; /* Reducido */
    }

    /* Ajuste para el span en la sección Quién Soy */
    #quiensoy .col-md-7 .heading-block span {
        font-size: 1.75em !important; /* Reducido */
    }

    /* Ajustes generales de texto para 375px */
    body { font-size: 13px !important; }
    h1 { font-size: 2.3em !important; }
    h2 { font-size: 1.3em !important; }
    h3 { font-size: 1.1em !important; }
    h4 { font-size: 1em !important; }
    p { font-size: 1em !important; }
    .heading-block > span {font-size: 1.5em !important;}

	/* INICIO DE AJUSTES ESPECÍFICOS PARA INSPIRATE EN MÓVIL (375px) */
    #inspirate .portfolio-item .bg-overlay-content {
        padding: 6px !important; /* Un poco menos de padding */
    }
    #inspirate .portfolio-item h3 {
        font-size: 1.0em !important;
    }
    #inspirate .portfolio-item span {
        font-size: 0.75em !important;
    }
    /* Asegurar visibilidad para 375px */
    #inspirate .portfolio-item .bg-overlay-content,
    #inspirate .portfolio-item .portfolio-desc {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    #inspirate .portfolio-item .bg-overlay,
    #inspirate .portfolio-item .bg-overlay-bg,
    #inspirate .portfolio-item .overlay-trigger-icon {
        display: none !important;
        pointer-events: none !important;
    }
}

/* --- Media Query para 320px */
@media (max-width: 320px) {
    /* Ajustes del Slider */
    #slider {
        min-height: 35vh !important;
    }
    #slider .slider-text-box h1 {
        font-size: 1.8em !important;
    }

    /* Ajustes de Sección Quién Soy */
    #quiensoy .col-md-5 {
        min-height: 55vh !important;
    }

     #quiensoy .col-md-7 .heading-block h1 {
    font-size: 2.1em !important; /* Más pequeño para 480px */
    }

    #quiensoy .col-md-7 p {
        font-size: 1em !important; /* Más pequeño para 480px */
    }

    /* Ajustes de Asesorías - Cards */
    #asesorias .card-body h2 {
        font-size: 1.4em !important;
    }
    #asesorias .card-body h4 {
        font-size: 0.9em !important;
    }
    #asesorias .card-body p {
        font-size: 1.1em !important;
    }

    /* Sección Asesorías FAQs */
    #asesorias .toggle .toggle-header .toggle-title {
        font-size: 0.8em !important;
    }
    #asesorias .toggle .toggle-header {
        padding: 0.1rem !important;
    }
    #asesorias .toggle-content {
        font-size: 1em !important;
        padding: 0.5rem 0.7rem !important;
    }

    /* Sección Asesorías - Botón Contratar */
    #asesorias .card-body .button {
        font-size: 1.1em !important; /* Ajustado para 375px */
        padding: 7px 14px !important;
    }

    /* Ajustes del Footer */
    #footer h3 {
        font-size: 1.1em !important;
    }
    #footer p {
        font-size: 0.8em !important;
    }

    /* Ajustes para el span del slider */
    #slider .slider-text-box span {
        font-size: 1.4em !important; /* Reducido */
    }

    /* Ajuste para el span en la sección Quién Soy */
    #quiensoy .col-md-7 .heading-block span {
        font-size: 1.75em !important; /* Reducido */
    }

    /* Ajustes generales de texto para 325px */
    body { font-size: 12px !important; }
    h1 { font-size: 2.2em !important; }
    h2 { font-size: 1.2em !important; }
    h3 { font-size: 1.0em !important; }
    h4 { font-size: 0.85em !important; }
    p { font-size: 1em !important; }
    .heading-block > span {font-size: 1.4em !important;}

	/* INICIO DE AJUSTES ESPECÍFICOS PARA INSPIRATE EN MÓVIL (325px) */
    #inspirate .portfolio-item .bg-overlay-content {
        padding: 5px !important; /* Un poco menos de padding */
    }
    #inspirate .portfolio-item h3 {
        font-size: 1em !important;
    }
    #inspirate .portfolio-item span {
        font-size: 0.8em !important;
    }
    /* Asegurar visibilidad para 325px */
    #inspirate .portfolio-item .bg-overlay-content,
    #inspirate .portfolio-item .portfolio-desc {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    #inspirate .portfolio-item .bg-overlay,
    #inspirate .portfolio-item .bg-overlay-bg,
    #inspirate .portfolio-item .overlay-trigger-icon {
        display: none !important;
        pointer-events: none !important;
    }
    /* FIN DE AJUSTES ESPECÍFICOS PARA INSPIRATE EN MÓVIL (325px) */
}