Saltar al contenido
Cambiamos tu solar por Viviendas
Inicio Cambiamos tu solar por Viviendas
Construccion de casas a cambio del terreno.adquirimos solares a cambio de obra no dude encontactarnos y convertiremos su solar o parcelas en edificaciones de viviendas,pisos o chalets de lujo e independientes,consultenos y haremos un estudio gratuito de edificabilidad sobre su terreno ajustandonos a la normativa del sector urbanistico de su zona.nosotros nos hacemos cargo de todo el proyecto,ejecucion,viabilidad,construccion y llaves en mano
5/5 (6)
{
0.6);
}
.whatsapp-button svg {
width: 36px;
height: 36px;
}
.whatsapp-button .status-indicator {
position: absolute;
bottom: 4px;
right: 4px;
width: 16px;
height: 16px;
background: #4ade80;
border-radius: var(--radius-full);
border: 2px solid white;
display: none;
}
.whatsapp-button.online .status-indicator {
display: block;
}
/* Panel lateral */
.whatsapp-panel {
position: absolute;
bottom: 90px;
right: 15px;
width: 360px;
background: white;
border-radius: var(--radius-lg);
box-shadow: var(--shadow-lg);
overflow: hidden;
transform: translateX(30px) scale(0.95);
opacity: 0;
visibility: hidden;
transition: var(--transition);
z-index: 9;
}
.whatsapp-panel.open {
transform: translateX(0) scale(1);
opacity: 1;
visibility: visible;
}
.panel-header {
background: linear-gradient(135deg, var(--primary), var(--secondary));
color: white;
padding: 1.5rem;
position: relative;
}
.panel-close {
position: absolute;
top: 1rem;
right: 1rem;
background: rgba(255, 255, 255, 0.2);
border: none;
width: 32px;
height: 32px;
border-radius: var(--radius-full);
color: white;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: var(--transition);
}
.panel-close:hover {
background: rgba(255, 255, 255, 0.3);
transform: rotate(90deg);
}
.panel-title {
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 0.5rem;
display: flex;
align-items: center;
gap: 0.75rem;
}
.panel-title svg {
width: 28px;
height: 28px;
}
.panel-subtitle {
font-size: 0.95rem;
opacity: 0.9;
line-height: 1.5;
}
.panel-status {
display: inline-block;
background: rgba(255, 255, 255, 0.2);
padding: 0.25rem 0.75rem;
border-radius: var(--radius-full);
font-size: 0.85rem;
margin-top: 0.5rem;
}
.panel-status.online {
background: rgba(74, 222, 128, 0.3);
}
.panel-body {
padding: 1.5rem;
}
.quick-messages {
margin-bottom: 1.5rem;
}
.quick-messages-title {
font-size: 1.125rem;
font-weight: 600;
margin-bottom: 1rem;
color: var(--gray-800);
display: flex;
align-items: center;
gap: 0.5rem;
}
.message-options {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.75rem;
}
.message-btn {
background: var(--gray-100);
border: 2px solid var(--gray-200);
border-radius: var(--radius-lg);
padding: 1rem;
text-align: left;
cursor: pointer;
transition: var(--transition);
font-weight: 500;
color: var(--gray-800);
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.message-btn:hover,
.message-btn.active {
background: rgba(37, 99, 235, 0.08);
border-color: var(--secondary);
transform: translateY(-2px);
}
.message-btn.active {
background: rgba(37, 99, 235, 0.15);
border-width: 3px;
}
.message-title {
font-weight: 600;
font-size: 0.95rem;
}
.message-desc {
font-size: 0.8rem;
color: var(--gray-600);
}
.custom-message {
margin-bottom: 1.5rem;
}
.custom-message textarea {
width: 100%;
padding: 1rem;
border: 2px solid var(--gray-200);
border-radius: var(--radius-lg);
font-family: inherit;
font-size: 1rem;
resize: vertical;
min-height: 80px;
transition: var(--transition);
}
.custom-message textarea:focus {
outline: none;
border-color: var(--secondary);
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}
.panel-footer {
padding: 1.25rem 1.5rem;
background: var(--gray-50);
border-top: 1px solid var(--gray-200);
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 0.75rem;
}
.business-info {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.9rem;
}
.business-hours {
background: rgba(37, 211, 102, 0.15);
color: var(--accent-dark);
padding: 0.35rem 0.85rem;
border-radius: var(--radius-full);
font-weight: 600;
font-size: 0.85rem;
}
.business-hours.offline {
background: rgba(239, 68, 68, 0.15);
color: #b91c1c;
}
.send-btn {
background: var(--accent);
color: white;
border: none;
padding: 0.85rem 1.75rem;
border-radius: var(--radius-full);
font-weight: 600;
font-size: 1rem;
cursor: pointer;
transition: var(--transition);
display: flex;
align-items: center;
gap: 0.5rem;
box-shadow: 0 2px 8px rgba(37, 211, 102, 0.3);
}
.send-btn:hover {
background: #128c7e;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
}
.send-btn:disabled {
background: var(--gray-300);
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.contact-options {
display: flex;
gap: 0.5rem;
margin-top: 1rem;
justify-content: center;
}
.contact-option {
width: 40px;
height: 40px;
border-radius: var(--radius-full);
background: var(--gray-100);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.1rem;
cursor: pointer;
transition: var(--transition);
color: var(--gray-700);
}
.contact-option:hover {
background: var(--secondary);
color: white;
transform: translateY(-3px);
}
.contact-option.whatsapp {
background: var(--accent);
color: white;
}
/* Animaciones */
@keyframes pulse {
0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.6); }
70% { box-shadow: 0 0 0 12px rgba(37, 211, 102, 0); }
100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
.fade-in {
animation: fadeIn 0.4s ease forwards;
}
/* Responsive */
@media (max-width: 768px) {
.whatsapp-widget {
bottom: 1.5rem;
right: 1.5rem;
}
.whatsapp-button {
width: 60px;
height: 60px;
}
.whatsapp-panel {
width: 320px;
right: 10px;
}
.message-options {
grid-template-columns: 1fr;
}
.panel-footer {
flex-direction: column;
align-items: stretch;
}
.business-info {
justify-content: center;
}
.demo-container {
padding: 1.5rem;
}
.demo-title {
font-size: 2rem;
}
}
@media (max-width: 480px) {
.whatsapp-panel {
width: calc(100% - 40px);
right: 20px;
left: 20px;
bottom: 85px;
}
.panel-header {
padding: 1.25rem;
}
.panel-body {
padding: 1.25rem;
}
.message-btn {
padding: 0.85rem;
}
body {
padding: 1rem;
}
.demo-container {
padding: 1.5rem;
}
}
/* Badges de estado */
.status-badge {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-size: 0.9rem;
font-weight: 500;
padding: 0.25rem 0.75rem;
border-radius: var(--radius-full);
}
.status-online {
background: rgba(74, 222, 128, 0.15);
color: #16a34a;
}
.status-offline {
background: rgba(239, 68, 68, 0.15);
color: #b91c1c;
}
.status-dot {
width: 8px;
height: 8px;
border-radius: var(--radius-full);
}
.status-dot.online {
background: #4ade80;
box-shadow: 0 0 6px #4ade80;
}
.status-dot.offline {
background: #f87171;
}
/* Animación de entrada del widget */
.widget-init {
animation: widgetEntry 0.8s ease-out forwards;
}
@keyframes widgetEntry {
from {
transform: translateX(100px) scale(0.8);
opacity: 0;
}
to {
transform: translateX(0) scale(1);
opacity: 1;
}
}
/* Notificación de nuevos mensajes */
.notification-badge {
position: absolute;
top: -6px;
right: -6px;
background: var(--accent);
color: white;
font-size: 0.7rem;
font-weight: bold;
width: 20px;
height: 20px;
border-radius: var(--radius-full);
display: flex;
align-items: center;
justify-content: center;
border: 2px solid white;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
/* Toast de confirmación */
.toast {
position: fixed;
bottom: 95px;
right: 20px;
background: white;
color: var(--gray-800);
padding: 1rem 1.5rem;
border-radius: var(--radius-lg);
box-shadow: var(--shadow-lg);
display: flex;
align-items: center;
gap: 0.75rem;
transform: translateX(300px);
opacity: 0;
transition: var(--transition);
z-index: 9998;
}
.toast.show {
transform: translateX(0);
opacity: 1;
}
.toast.success {
border-left: 4px solid var(--accent);
}
.toast-content {
flex: 1;
}
.toast-title {
font-weight: 600;
margin-bottom: 0.25rem;
}
.toast-message {
font-size: 0.9rem;
color: var(--gray-600);
}
.toast-close {
background: none;
border: none;
font-size: 1.25rem;
cursor: pointer;
color: var(--gray-400);
transition: var(--transition);
}
.toast-close:hover {
color: var(--gray-700);
}
/* Estilo para modo offline */
.panel-offline {
text-align: center;
padding: 2rem;
color: var(--gray-600);
}
.panel-offline svg {
width: 64px;
height: 64px;
color: #f87171;
margin-bottom: 1.5rem;
}
.panel-offline h3 {
font-size: 1.5rem;
margin-bottom: 0.75rem;
color: var(--gray-800);
}
.schedule-info {
background: var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.25rem;
margin-top: 1.5rem;
text-align: left;
}
.schedule-item {
display: flex;
justify-content: space-between;
padding: 0.5rem 0;
border-bottom: 1px solid var(--gray-200);
}
.schedule-item:last-child {
border-bottom: none;
}
.schedule-day {
font-weight: 500;
}
.schedule-hours {
color: var(--secondary);
font-weight: 600;
}
Widget WhatsApp Premium - Aurema Group LLC
Widget flotante profesional con múltiples opciones de mensaje predefinido, horario de atención inteligente y diseño corporativo alineado con la marca Aurema Group.
✨ Características incluidas:
✅
✅
✅
✅
✅
✅
✅
✅
✅
✅
Horario inteligente: Widget se oculta automáticamente fuera de horario laboral (9:00 - 18:00 GMT+1)
Mensajes predefinidos: 6 plantillas para diferentes servicios (desarrollo urbanístico, peritaje judicial, estructuración corporativa, etc.)
Personalización total: Editor de mensaje personalizado con placeholder dinámico
Indicador de estado: Muestra si el equipo está disponible en tiempo real
Multiplataforma: Redirección optimizada para móvil y desktop
Diseño premium: Animaciones suaves, efecto pulse en el botón y micro-interacciones
Notificaciones: Toast de confirmación al enviar mensaje
Responsive: Adaptable a móviles, tablets y desktop
Cookie compliance: Sistema de consentimiento integrado
Analytics: Callback para integración con Google Analytics o herramientas de tracking
rel= "stylesheet" href= "https://aurema-group.com/widget-whatsapp.css" /> src= "https://aurema-group.com/widget-whatsapp.js" >
Widget activo en esta página de demostración ↓
¡Mensaje enviado!
Serás redirigido a WhatsApp para continuar la conversación con Aurema Group.
×
Cerrar los ajustes de cookies RGPD
Resumen de privacidad
Esta web utiliza cookies para que podamos ofrecerte la mejor experiencia de usuario posible. La información de las cookies se almacena en tu navegador y realiza funciones tales como reconocerte cuando vuelves a nuestra web o ayudar a nuestro equipo a comprender qué secciones de la web encuentras más interesantes y útiles.
Cookies estrictamente necesarias
Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.
