/* --- ESTILOS DIRECCIÓN DE MARCA (PREMIUM/CORPORATE) --- */
:root {
    --dm-dark: #0F172A; /* Azul noche muy oscuro */
    --dm-accent: #E91E63; /* Tu rosa, pero usado como detalle fino */
    --dm-gray: #F1F5F9;
}

/* HERO SECTION: ELEGANCIA */
.dm-hero {
    background-color: var(--dm-dark);
    color: white;
    padding: 180px 5% 100px 5%;
    position: relative;
    overflow: hidden;
}

.dm-hero-content {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.2fr 0.8fr; /* Más espacio al texto */
    gap: 60px;
    align-items: center;
}

.dm-label {
    font-size: 0.85rem; letter-spacing: 3px; text-transform: uppercase;
    color: var(--dm-accent); font-weight: 700; margin-bottom: 20px; display: block;
}

.dm-title {
    font-size: 3.5rem; font-weight: 300; /* Light para elegancia */
    line-height: 1.1; margin-bottom: 30px;
}
.dm-title strong { font-weight: 900; } /* Bold para impacto */

.dm-desc {
    font-size: 1.1rem; color: #94A3B8; line-height: 1.8; margin-bottom: 40px; max-width: 90%;
}

/* Imagen Abstracta/Corporativa */
.dm-hero-img {
    width: 100%; height: 500px; object-fit: cover;
    border-radius: 4px; /* Bordes menos redondeados, más serios */
    filter: sepia(20%) contrast(110%);
}


/* SECCIÓN DE FILOSOFÍA (TEXTO CENTRADO) */
.dm-philosophy {
    padding: 100px 5%; background: white; text-align: center;
}
.dm-philo-text {
    font-size: 2rem; font-weight: 400; color: #111; max-width: 900px; margin: 0 auto; line-height: 1.5;
}
.dm-philo-text span { background: linear-gradient(to right, #E91E63, #FF80AB); -webkit-background-clip: text; color: transparent; font-weight: 800; }


/* GRID DE SERVICIOS CONSULTIVOS */
.dm-services {
    padding: 0 5% 100px 5%; background: white;
}
.dm-grid {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 60px;
    max-width: 1200px; margin: 0 auto;
}

.dm-service-card {
    border-top: 1px solid #ddd;
    padding-top: 30px;
    transition: 0.4s;
}
.dm-service-card:hover { border-color: var(--dm-accent); }

.dm-icon-box {
    font-size: 2rem; color: #111; margin-bottom: 20px; transition: 0.3s;
}
.dm-service-card:hover .dm-icon-box { color: var(--dm-accent); transform: translateX(10px); }

.dm-srv-title { font-size: 1.8rem; font-weight: 800; margin-bottom: 15px; color: #0F172A; }
.dm-srv-desc { font-size: 1rem; color: #555; line-height: 1.7; margin-bottom: 25px; }

/* Lista de detalles dentro de la tarjeta */
.dm-list { list-style: none; padding: 0; }
.dm-list li {
    margin-bottom: 10px; font-size: 0.9rem; color: #444; display: flex; align-items: center; gap: 10px;
}
.dm-list li::before {
    content: ''; width: 6px; height: 6px; background: var(--dm-accent); border-radius: 50%;
}

/* CALL TO ACTION (CTA) SOBRIO */
.dm-cta-section {
    background: #F8FAFC; padding: 80px 5%; text-align: center;
}
.btn-consult {
    background: var(--dm-dark); color: white; padding: 18px 50px;
    font-size: 1rem; text-transform: uppercase; letter-spacing: 1px; font-weight: 600;
    text-decoration: none; display: inline-block; transition: 0.3s;
}
.btn-consult:hover { background: var(--dm-accent); color: white; }

/* RESPONSIVE */
@media (max-width: 900px) {
    .dm-hero-content { grid-template-columns: 1fr; }
    .dm-hero-img { height: 300px; margin-top: 30px; }
    .dm-grid { grid-template-columns: 1fr; gap: 40px; }
    .dm-philo-text { font-size: 1.5rem; }
    .dm-title { font-size: 2.5rem; }
}








/* --- SECCIÓN PROCESO (THE ROADMAP) --- */
.dm-process-sec {
    padding: 100px 5%;
    background-color: #0F172A; /* Fondo Oscuro para resaltar el proceso */
    color: white;
}

.process-header { text-align: center; margin-bottom: 70px; }
.process-title { font-size: 2.5rem; font-weight: 300; margin-bottom: 10px; }
.process-title b { font-weight: 900; color: #E91E63; }

.timeline-box {
    display: flex; justify-content: space-between; position: relative;
    max-width: 1100px; margin: 0 auto;
}

/* Línea conectora */
.timeline-box::before {
    content: ''; position: absolute; top: 40px; left: 0; width: 100%; height: 2px;
    background: rgba(255,255,255,0.1); z-index: 0;
}

.step-item {
    position: relative; z-index: 1; width: 22%; text-align: center;
}

.step-num {
    width: 80px; height: 80px; background: #1E293B; border: 2px solid #334155;
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; font-weight: 700; margin: 0 auto 30px auto;
    transition: 0.3s; color: #94A3B8;
}

.step-item:hover .step-num {
    border-color: #E91E63; color: white; background: #E91E63; box-shadow: 0 0 20px rgba(233, 30, 99, 0.4);
}

.step-content h4 { font-size: 1.2rem; margin-bottom: 10px; color: white; }
.step-content p { font-size: 0.9rem; color: #94A3B8; line-height: 1.6; }


/* --- SECCIÓN AUDITORÍA (LEAD MAGNET) --- */
.audit-section {
    background: #fff; padding: 100px 5%; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
    max-width: 1200px; margin: 0 auto;
}

.audit-visual {
    background: #F8FAFC; padding: 40px; border-radius: 20px; border: 1px dashed #cbd5e1;
    text-align: center;
}

.audit-list { margin-top: 30px; text-align: left; }
.audit-item { display: flex; gap: 10px; margin-bottom: 15px; font-size: 0.95rem; color: #555; }
.audit-item i { color: #E91E63; margin-top: 4px; }


/* RESPONSIVE */
@media (max-width: 900px) {
    .timeline-box { flex-direction: column; gap: 40px; }
    .timeline-box::before { width: 2px; height: 100%; left: 50%; top: 0; } /* Línea vertical en móvil */
    .step-item { width: 100%; }
    
    .audit-section { grid-template-columns: 1fr; }
}