@layer molecules {
  /* Lista con viñeta de acento: señales de alerta, credenciales */
  .check-list {
    display: grid;
    gap: var(--space-2xs);
    padding: 0;
    list-style: none;

    & li {
      padding-inline-start: 1.5rem;
      background: linear-gradient(var(--accent), var(--accent)) 0 0.6em / 7px 7px no-repeat;
      color: var(--text-muted);
    }
  }

  /* Preguntas frecuentes con <details>: abren y cierran sin JavaScript */
  .faq { margin-block-start: var(--space-l); border-block-end: 1px solid var(--border-strong); }

  .faq__item {
    border-block-start: 1px solid var(--border-strong);

    & summary {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--space-s);
      min-height: var(--tap-min);
      padding-block: var(--space-s);
      font-family: var(--font-display);
      font-size: 1.25rem;
      cursor: pointer;
      list-style: none;
    }

    & summary::-webkit-details-marker { display: none; }

    & summary::after {
      content: "+";
      flex: none;
      font-family: var(--font-body);
      font-size: 1.5rem;
      color: var(--accent);
      transition: rotate 0.2s;
    }

    &[open] summary::after { rotate: 45deg; }

    & p { padding-block-end: var(--space-m); color: var(--text-muted); max-width: 65ch; }
  }

  .breadcrumb {
    font-size: var(--text-small);
    color: var(--text-muted);

    & a { color: inherit; }
  }

  .card--plain { background: var(--bg); }
}