:root {
	--color-fondo: #FDEFD8; /*papaya weap*/
	--color-boton-redes: #f4a212; /*gamboge*/
	--color-titulo: #403F4C; /*onix*/
	--color-servicios: #F9D08B; /*sunset*/
}
.div-ancho-completo {
	background: var(--color-fondo);
}
/***Cabecera****/
.div-contacto-img img {
	animation: zoom 7s 1;
}
.div-contacto-img h1 {
    color: var(--color-titulo)!important;
	text-align: center;
	font-size: 2.5rem!important;
	text-shadow: 1px 1px 2px var(--blanco);
	animation: sombra 2s ease-in-out 5;
}
/* Zoom imagen*/
@keyframes zoom {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
/* Sombra en el título*/
@keyframes sombra {
  from {
      text-shadow: 0px 0px 2px #fff, 
      0px 0px 4px #fff, 
      0px 0px 6px #fff,       
      0px 0px 8px #fff,
      0px 0px 10px #fff,
      0px 0px 12px #000,
      0px 0px 14px #000,
      0px 4px 16px #000,
      0px 4px 18px #000,
      0px 4px 20px #000;
  }
}

.div-contacto-img p {
    color: var(--negro);
	text-align: center;
	font-size: 1.5rem!important;
	font-weight: bold;
	margin: 0;
	padding: 0;
}

/* Botones Redes Sociales con animación*/
.contacto-redes {
    justify-content: center;
    margin: 0;
    padding: 2rem !important;
    text-align: center;
    align-items: center !important;
}
.contacto-redes .wp-social-link {
    margin: 0.5rem;
}
.contacto-redes .wp-block-social-link-anchor {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--color-boton-redes);
    color: var(--blanco) !important;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
}
/* Efecto de brillo deslizante */
.contacto-redes .wp-block-social-link-anchor::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.8s ease;
}
.contacto-redes .wp-block-social-link-anchor:hover::before {
    left: 100%;
}
.contacto-redes .wp-block-social-link-anchor:hover {
    transform: translateY(-6px) scale(1.12);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25);
}
/* Efecto de pulso al hover */
.contacto-redes .wp-block-social-link-anchor:hover::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    border: 2px solid currentColor;
    animation: pulse 1.5s infinite;
}
@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    70% {
        transform: scale(1.4);
        opacity: 0;
    }
    100% {
        transform: scale(1.4);
        opacity: 0;
    }
}
.contacto-redes .wp-block-social-link-anchor svg {
    width: 26px;
    height: 26px;
    fill: currentColor;
    transition: all 0.3s ease;
    z-index: 1;
}
.contacto-redes .wp-block-social-link-anchor:hover svg {
    transform: rotate(15deg) scale(1.2);
}
/* Colores específicos para cada red social */
.contacto-redes .wp-social-link-facebook .wp-block-social-link-anchor:hover {
    background: #1877f2 !important;
    color: white !important;
}
.contacto-redes .wp-social-link-instagram .wp-block-social-link-anchor:hover {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888) !important;
}
.contacto-redes .wp-social-link-twitter .wp-block-social-link-anchor:hover {
    background: #1da1f2 !important;
}
.contacto-redes .wp-social-link-linkedin .wp-block-social-link-anchor:hover {
    background: #0077b5 !important;
}
.contacto-redes .wp-social-link-youtube .wp-block-social-link-anchor:hover {
    background: #ff0000 !important;
}
.contacto-redes .wp-social-link-whatsapp .wp-block-social-link-anchor:hover {
    background: #25d366 !important;
}
.contacto-redes .wp-social-link-tiktok .wp-block-social-link-anchor:hover {
    background: #000000 !important;
    /* O con gradiente: background: linear-gradient(45deg, #25F4EE, #000000, #FE2C55) !important; */
}
.contacto-redes .wp-social-link-pinterest .wp-block-social-link-anchor:hover {
    background: #BD081C !important;
}
/*-----------------------*/


.div-contacto-detalle p {
	border: 1px solid #646168;
	border-radius: 5px;
	box-shadow: 0px 8px 8px -4px black;
	text-align: justify;
	padding: 0.8rem!important;
	line-height: 1rem;
	font-size: 0.9rem;
}
/* Servicios */
.div-contacto-servicios {
	padding: 1rem 5%;
}
.div-contacto-servicios details {
	margin: 5px; 
	padding: 3px; 
	border-radius: 5px 5px 5px 5px; 
	box-shadow: inset 1px 1px; 
	background: var(--color-servicios)!important;
}
.div-contacto-servicios details summary {
	list-style: none; 
	padding: 5px; 
	font-size: 1rem; 
	color: black;
}
.div-contacto-servicios details summary:before {
	content: "▼" "\0000a0 \0000a0"; 
}
.div-contacto-servicios details[open] summary:before {
	content: "▲" "\0000a0 \0000a0"; 
}
.div-contacto-servicios .div-detalle {
	background: var(--color-fondo)!important; 
	color: var(--negro)!important; 
	font-size: 0.9rem!important;
	padding: 0.5rem;
	text-align: center;
}
.div-detalle p {
	font-size: 1rem!important;
	font-weight: normal;
	color: var(--negro)!important;
	text-align: justify;
}
.div-detalle a {
	color: var(--color-boton-redes)!important;
}
.div-detalle a:hover {
	background: var(--color-servicios)!important;
}
.div-contacto-servicios .div-detalle img {
	width: 70%!important;
	border-radius: 16px;
}
.div-contacto-servicios details ul {
	margin: 0 10px 10px 10px!important; 
	padding: 5px 7px 5px 25px!important; 
	line-height: 1rem!important;
	text-align: left;
	border-radius: 5px 5px 5px 5px; 
}
/*Datos del video*/
.div-video {
	padding: 2rem!important;
	text-align: center;
}

/*Datos del Contacto*/
.div-contacto-datos {
	padding: 2rem!important;
}
.div-columna {
	    align-content: center;
	text-align: center;
}
.div-columna .wp-block-image img {
	width: 70%!important;
	border-radius: 16px;
}
.div-columna .columna-datos {
	text-align: left;
	line-height: 2!important;
}
.div-det-datos {
	background: rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	border: 1px solid rgba(0, 0, 0, 0.5);
	padding: 15% 5%;
}
.div-det-datos p {
	margin: 0;
	padding: 0;
}
.div-det-datos .contacto-redes {
	margin: 0;
	padding: 0.5rem 0 2rem 0!important;
}
.div-contacto-datos .div-columna h3 {
	text-align: center;
	font-size: 1rem!important;
	color: var(--negro);
	margin: 0;
	padding: 0.3rem;
}
.texto-solincomp, .texto-solincomp a {
	text-align: center;
	padding: 3rem;
	font-size: 0.8rem!important;
}

.copyright-text, .copyright-text a {
    color: var(--negro);
    font-size: 0.9rem;
    text-align: center;
	padding: 2rem 0;
}