/* Estilos Sección Llave en Mano (Turnkey) */
.turnkey {
    /* padding: 80px 0; */ /* Heredado */
    background-color: #fff; /* Fondo */
}

/* Pasos del Proceso */
.process-steps {
    display: grid;
    grid-template-columns: 1fr; /* Una columna */
    gap: 30px; /* Espacio reducido entre pasos */
    margin: 50px 0;
    position: relative;
    padding-left: 50px; /* Espacio para la línea y números */
}

/* Línea vertical conectora */
.process-steps::before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 20px; /* Posición de la línea */
    width: 3px;
    background: linear-gradient(to bottom, var(--primary-color), var(--accent-color));
    border-radius: 1.5px;
    z-index: 1;
}

.process-step { /* Cada paso */
    position: relative;
    background: #fff;
    border-radius: 15px;
    padding: 30px 35px; /* Padding */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06); /* Sombra */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    z-index: 2;
    border-left: 5px solid var(--primary-color);
}

.process-step:hover {
    transform: translateY(-5px) translateX(5px);
    box-shadow: 0 15px 40px rgba(0, 86, 179, 0.1);
    border-left-color: var(--accent-color);
}

/* Número del paso (círculo) */
.step-number { /* Reutilizando clase, asegurar consistencia */
    position: absolute;
    left: -22px; /* Superponer sobre la línea */
    top: 25px; /* Alinear con el padding */
    width: 45px; /* Tamaño ajustado */
    height: 45px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.3rem; /* Ajustado */
    box-shadow: 0 5px 15px rgba(var(--primary-rgb), 0.2);
    z-index: 3; /* Encima de la línea y la tarjeta */
    border: 2px solid white; /* Borde blanco */
}

.process-step h4 { /* Título del paso */
    color: var(--primary-dark);
    font-size: 1.4rem; /* Ajustado */
    margin-bottom: 15px;
    font-weight: 600;
    /* padding-left: 30px; */ /* Quitado, el padding está en .process-step */
}

.process-step p {
    color: var(--grey-color);
    line-height: 1.7;
    margin-bottom: 15px;
}

.process-step p:last-child {
    margin-bottom: 0;
}

/* Caja de Cita (Quote) */
/* Estilos .quote-box y .quote-icon definidos en nutricosmetics.css */
/* Si hay variaciones para Turnkey, añadirlas aquí */
.turnkey .quote-box {
    margin: 50px 0; /* Ajustar margen */
}

/* Showcase de Servicios (si aplica a Turnkey) */
/* Estilos .service-showcase, .showcase-item, etc. definidos en marketing.css */
/* Si hay variaciones para Turnkey, añadirlas aquí */
.turnkey .service-showcase {
    margin: 60px 0;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* Ajustar minmax */
    gap: 35px;
}

.turnkey .showcase-item {
    border: 1px solid rgba(0,0,0,0.05);
}

.turnkey .showcase-item::before { /* Línea superior */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(to right, var(--primary-color), var(--accent-color));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
}

.turnkey .showcase-item:hover::before {
    transform: scaleX(1);
}

.turnkey .showcase-icon {
    width: 70px; /* Ajustado */
    height: 70px;
    font-size: 1.8rem;
}

/* Texto de Conclusión */
.conclusion-text { /* Reutilizando clase de style15 */
    background: linear-gradient(135deg, rgba(var(--primary-rgb), 0.03), rgba(var(--accent-rgb), 0.03));
    border-radius: 15px;
    padding: 35px 40px; /* Padding */
    margin: 40px 0;
    border-left: 5px solid var(--primary-color);
    border: 1px solid rgba(0,0,0,0.04);
}

.conclusion-text h4 { /* Título opcional */
    color: var(--primary-dark);
    margin-bottom: 15px;
    font-size: 1.3rem;
}

.conclusion-text p {
    color: var(--dark-color); /* Color más oscuro */
    line-height: 1.7;
    margin-bottom: 15px;
    font-size: 1.05rem;
}

.conclusion-text p:last-child {
    margin-bottom: 0;
}

/* Sección CTA */
/* Estilos .cta-section, .cta-content, etc. definidos en nutricosmetics.css o similar */
/* Si hay variaciones para Turnkey, añadirlas aquí */
.turnkey .cta-section {
    margin: 60px 0 50px;
}

/* Estilos para .two-columns (si aplica aquí) */
/* .two-columns definido en style16, puede ir en layout o responsive */
.turnkey .two-columns {
    margin: 60px 0;
}

/* Estilos para .service-box (si aplica aquí) */
/* .service-box definido en style16, puede ser genérico o específico */
.turnkey .service-box {
    margin: 50px 0;
}

/* Nota: Estilos responsivos irán en responsive.css */