/* KROTAR — /delivery/: enlace del hero, preguntas interactivas (#diagnostico), pie legal y sección #beneficios. Tokens --dlk-* de delivery.css. */
/* Hero: botón secundario junto a «Solicitar información» (misma altura que el primario) */
.dg-btn { color: var(--dlk-blue-deep); background: #ffffff; border-color: var(--dlk-blue); box-shadow: inset 0 0 0 1px var(--dlk-blue), 0 6px 16px -8px rgba(15, 60, 130, 0.25); }
.dg-btn:hover { color: var(--dlk-blue-deep); background: var(--dlk-bg-alt); transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--dlk-blue), 0 12px 24px -10px rgba(15, 60, 130, 0.35); }
.dg-btn:focus-visible { outline: 3px solid var(--dlk-blue); outline-offset: 3px; }
/* Hero: dos botones SIEMPRE de igual anchura y altura (rejilla; apila en columna estrecha) */
.dl-hero-copy { min-width: 0; }
.dl-hero-actions { display: grid; width: 100%; grid-template-columns: repeat(auto-fit, minmax(min(100%, 284px), 1fr)); gap: 12px; align-items: stretch; justify-items: stretch; }
.dl-hero-actions .btn { width: 100%; min-height: 50px; padding: 14px 12px; font-size: 0.86rem; letter-spacing: 0.02em; white-space: nowrap; text-align: center; line-height: 1.25; display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 900px) { .dl-hero-actions { max-width: 460px; margin-left: auto; margin-right: auto; } }

/* ==========================================================================
   Preguntas interactivas sobre el reparto (#diagnostico) — línea clara de Delivery
   ========================================================================== */
.dq-section { background: linear-gradient(180deg, #eef5fd 0%, #e6f0fb 100%); padding: var(--space-9, 72px) 0; }
.dq-head { max-width: 760px; margin: 0 auto var(--space-7, 40px); text-align: center; }
.dq-title { font-size: clamp(1.6rem, 3.2vw, 2.4rem); font-weight: 800; line-height: 1.15; letter-spacing: -0.02em; color: var(--dlk-text); margin: 0 0 var(--space-3, 12px); }
.dq-sub { font-size: clamp(1.02rem, 1.6vw, 1.2rem); line-height: 1.55; color: var(--dlk-text-body); margin: 0 0 var(--space-3, 12px); }
.dq-intro { font-size: 0.95rem; line-height: 1.6; color: var(--dlk-text-muted); margin: 0 0 var(--space-4, 16px); }
.dq-quota { display: inline-block; margin: 0; padding: 0.4rem 0.95rem; font-size: 0.86rem; font-weight: 600; color: var(--dlk-accent-text); background: #ffffff; border: 1px solid var(--dlk-border); border-radius: 999px; }
.dq-quota strong { font-size: 1rem; }
.dq-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6, 28px); align-items: start; }
.dq-cat { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 0 0 var(--space-4, 16px); text-align: left; }
.dq-pill { display: inline-block; padding: 0.3rem 0.85rem; font-family: var(--font-mono, monospace); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; border-radius: 999px; }
.dq-comercial .dq-pill { color: #0a3dff; background: rgba(37, 99, 235, 0.12); }
.dq-operativa .dq-pill { color: #0e7490; background: rgba(8, 145, 178, 0.14); }
.dq-catdesc { font-size: 0.9rem; color: var(--dlk-text-muted); font-weight: 500; }
.dq-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3, 12px); }
.dq-item { background: #ffffff; border: 1px solid rgba(37, 99, 235, 0.2); border-radius: 14px; box-shadow: 0 8px 22px rgba(15, 60, 130, 0.09); overflow: hidden; }
.dq-operativa .dq-item { border-color: rgba(8, 145, 178, 0.28); }
.dq-comercial .dq-item { box-shadow: inset 4px 0 0 0 #3b82f6, 0 8px 22px rgba(15, 60, 130, 0.09); }
.dq-operativa .dq-item { box-shadow: inset 4px 0 0 0 #0891b2, 0 8px 22px rgba(15, 60, 130, 0.09); }
.dq-qh { margin: 0; font-size: inherit; }
.dq-q { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 14px; min-height: 56px; padding: 14px 18px; text-align: left; font: 700 1rem/1.4 var(--font-heading, inherit); color: var(--dlk-text); background: transparent; border: 0; cursor: pointer; }
.dq-q:hover { background: rgba(37, 99, 235, 0.05); }
.dq-q:focus-visible { outline: 3px solid var(--dlk-blue); outline-offset: -3px; }
.dq-mark { flex: none; width: 28px; height: 28px; border-radius: 50%; background: rgba(37, 99, 235, 0.1); position: relative; }
.dq-mark::before, .dq-mark::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; background: var(--dlk-blue-deep); transform: translate(-50%, -50%); transition: transform 0.2s ease; }
.dq-mark::after { transform: translate(-50%, -50%) rotate(90deg); }
.dq-item.is-open .dq-mark::after { transform: translate(-50%, -50%) rotate(0deg); }
.dq-item.is-consulted .dq-mark { background: rgba(21, 128, 61, 0.14); }
.dq-item.is-locked { opacity: 0.62; }
.dq-item.is-locked .dq-q { cursor: pointer; }
.dq-item.is-locked .dq-mark { background: rgba(91, 107, 133, 0.16); }
.dq-item.is-locked .dq-mark::before, .dq-item.is-locked .dq-mark::after { background: #5b6b85; }
.dq-panel { padding: 4px 18px 18px; border-top: 1px solid var(--dlk-border); text-align: left; }
.dq-block { margin-top: 14px; }
.dq-block h5 { margin: 0 0 4px; font-size: 0.74rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; color: var(--dlk-accent-text); }
.dq-block p { margin: 0; font-size: 0.93rem; line-height: 1.6; color: var(--dlk-text-body); }
.dq-limit { margin: var(--space-6, 28px) auto 0; max-width: 720px; padding: 2rem 1.75rem 2.25rem; text-align: center; background: #ffffff; border: 1px solid rgba(37, 99, 235, 0.3); border-radius: 16px; box-shadow: 0 14px 34px rgba(15, 60, 130, 0.14); }
.dq-limit:focus-visible { outline: 3px solid var(--dlk-blue); outline-offset: 3px; }
.dq-limit h3 { margin: 0 0 0.75rem; font-size: clamp(1.15rem, 2vw, 1.4rem); font-weight: 800; color: var(--dlk-text); }
.dq-limit p { margin: 0 0 2rem; color: var(--dlk-text-body); line-height: 1.6; }
.dq-note { margin: var(--space-5, 24px) auto 0; max-width: 720px; text-align: center; font-size: 0.82rem; color: var(--dlk-text-muted); }
/* Composición: filas de ambas columnas a la misma altura y titulares sin palabras huérfanas */
.dq-title, .dq-sub, .dq-intro, .dq-limit h3, .dq-limit p { text-wrap: balance; }
@media (min-width: 861px) { .dq-q { min-height: 76px; } }
@media (max-width: 860px) { .dq-groups { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .dq-mark::before, .dq-mark::after { transition: none; } }

/* Pie legal discreto en una sola línea (solo /delivery/): Aviso legal · Privacidad · Cookies */
.footer-legal-links { gap: 0; flex-wrap: wrap; align-items: center; }
.footer-legal-links li + li::before { content: "·"; margin: 0 0.6em; color: var(--color-text-dim); }

/* ==========================================================================
   /delivery/ — primera sección de beneficios (#beneficios): más contraste y presencia.
   Solo esta sección (el resto de .dl-reasons no cambia). Línea clara de Delivery.
   ========================================================================== */
#beneficios.dl-reasons {
    background:
        radial-gradient(880px 320px at 50% 0%, rgba(56, 189, 248, 0.22), transparent 70%),
        linear-gradient(180deg, #e7f1fe 0%, #f3f8ff 60%, #fbfdff 100%);
    padding: var(--space-8) 0 var(--space-9);
}

#beneficios .section-heading {
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--space-7);
}

#beneficios .section-title {
    font-size: clamp(1.55rem, 3.8vw, 3rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--dlk-text);
}

#beneficios .dl-hook-accent {
    color: var(--dlk-blue-deep);
}

#beneficios .section-subtitle {
    max-width: 640px;
    margin: var(--space-4) auto 0;
    font-size: clamp(1.05rem, 1.7vw, 1.22rem);
    line-height: 1.6;
    color: var(--dlk-text-body);
}

#beneficios .dl-reasons-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

/* Ficha horizontal: icono-tile con el degradado azul de los botones de Delivery + texto alineado a la izquierda */
#beneficios .dl-reason {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "ico label" "ico cap";
    column-gap: 18px;
    row-gap: 3px;
    align-items: center;
    padding: 22px 24px;
    text-align: left;
    background: #ffffff;
    border: 1px solid rgba(37, 99, 235, 0.18);
    border-radius: 18px;
    box-shadow:
        0 1px 2px rgba(15, 60, 130, 0.06),
        0 16px 34px -10px rgba(15, 60, 130, 0.2);
}

#beneficios .dl-reason svg {
    grid-area: ico;
    box-sizing: border-box;
    width: 56px;
    height: 56px;
    padding: 15px;
    margin: 0;
    border-radius: 16px;
    color: #ffffff;
    background: linear-gradient(180deg, #0091ff 0%, #003d96 100%);
    box-shadow:
        inset 0 1px 0 0 rgba(255, 255, 255, 0.28),
        0 10px 20px -6px rgba(10, 61, 255, 0.45);
}

#beneficios .dl-reason-label {
    grid-area: label;
    align-self: end;
    font-weight: 800;
    font-size: 1.14rem;
    line-height: 1.25;
    letter-spacing: -0.01em;
    color: var(--dlk-text);
}

#beneficios .dl-reason-caption {
    grid-area: cap;
    align-self: start;
    font-size: 0.97rem;
    line-height: 1.4;
    color: var(--dlk-text-body);
}

@media (max-width: 900px) {
    #beneficios .dl-reasons-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    #beneficios .dl-reasons-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    /* deja libre el botón flotante del chat (58 px + 16 px de margen) */
    #beneficios .dl-reason { padding: 16px 70px 16px 16px; column-gap: 14px; }
    #beneficios .dl-reason svg { width: 46px; height: 46px; padding: 12px; }
}

/* Bloque «Cuéntanos el tipo…»: el botón deja de quedar pegado al párrafo */
.dl-reasons:not(#beneficios) .dl-reasons-cta { margin-top: var(--space-7, 40px); }