/* =========================================
   PUBLICA TU LIBRO (autores.html) — REDISEÑO 2026
   Usa el héroe, el estante y el bloque de contacto de home.css; aquí van
   solo el proceso, las tarjetas de servicios y las preguntas.
   ========================================= */

/* EL PROCESO: cinco pasos numerados en mono, con líneas de 1 px */
.process { list-style: none; border-top: 1px solid var(--line); }
.process li {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 16px;
    padding-block: 24px;
    border-bottom: 1px solid var(--line);
}
.process__n { font: 500 1.125rem/1.4 var(--mono); color: var(--brand-text); }
.process h3 { margin-bottom: 6px; font-size: var(--fs-d3); line-height: var(--lh-d3); }
.process p { max-width: 60ch; color: var(--text-2); }
@media (min-width: 900px) {
    .process li { grid-template-columns: 120px minmax(0, 5fr) minmax(0, 6fr); align-items: baseline; gap: 24px; }
    .process li > div { display: contents; }
    .process h3 { margin-bottom: 0; }
}

/* SERVICIOS como hojas blancas sobre el papel */
.services--cards { margin-top: 0; }
.services--cards > div {
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--r-10);
    background: var(--bg-2);
}
.services--cards li { padding-block: 7px 8px; border-bottom: 1px solid var(--line); font-size: 1rem; }
.services--cards li:last-child { border-bottom: 0; }

/* PREGUNTAS: <details> nativo, sin JS */
.faq-wrap { max-width: calc(820px + 32px); }
.faq { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
    padding-block: 12px;
    font-size: 1.125rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
    content: "+";
    flex: none;
    font: 400 1.25rem/1 var(--mono);
    color: var(--brand-text);
}
.faq details[open] summary::after { content: "−"; }
.faq details p { max-width: 62ch; padding-bottom: 20px; color: var(--text-2); }
