# FAQ / Preguntas frecuentes > Two-column questions on the native accordion. Page: https://componentes-lovat.vercel.app/c/faq/ License: MIT · Design: Tailark mist (MIT) · faqs/two Requires: tokens.css, accordion Context: landing · Density: media · Tone: editorial ## Files - Tokens (once): https://componentes-lovat.vercel.app/tokens.css - Dependency `accordion`: https://componentes-lovat.vercel.app/r/accordion.json - HTML: https://componentes-lovat.vercel.app/raw/faq/faq.html - CSS: https://componentes-lovat.vercel.app/raw/faq/faq.css - Everything in one file: https://componentes-lovat.vercel.app/r/faq.html Dark theme: add class `dark` to ``. ## When to use - To answer questions before buying or writing in. ## When not to use - For content everyone must read. ## Accessibility Roles: region - Uses

: works without JavaScript and opens one at a time. ## Code ```html

Preguntas frecuentes

Lo que más nos preguntan.

¿No encuentras tu respuesta? Escríbele a nuestro equipo.

¿Cuánto tarda el envío?

Entre 3 y 5 días hábiles según tu ciudad. El envío express llega en 24 horas.

¿Qué medios de pago aceptan?

Tarjetas de crédito y débito, transferencia y Yape. Para empresas, también factura.

¿Puedo cambiar o cancelar mi pedido?

Sí, dentro de la primera hora. Después, escríbenos y lo resolvemos.

¿Hacen envíos internacionales?

Enviamos a más de 50 países. Tarda entre 7 y 14 días hábiles.

``` ```css /* faq · Componentes (MIRÓ Labs). Diseño de coss ui (MIT, © coss.com, antes Origin UI). Generado por tools/build_css.py desde faq.tw.json. No editar a mano. Necesita tokens.css. */ .s-faq__inner{margin-inline:auto} .s-faq__lead{margin-top:calc(var(--spacing)*4)} .s-faq__contact{margin-top:calc(var(--spacing)*6)} .s-faq__grid{display:grid} .s-faq__inner{max-width:var(--container-5xl)} .s-faq__grid{gap:calc(var(--spacing)*8)} .s-faq__inner{padding-inline:calc(var(--spacing)*6)} .s-faq{padding-block:calc(var(--spacing)*16)} .s-faq__title{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))} .s-faq__lead{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))} .s-faq__link{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)} .s-faq__title{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)} .s-faq__lead{text-wrap:balance} .s-faq__title{color:var(--color-foreground)} .s-faq__lead{color:var(--color-muted-foreground)} .s-faq__contact{color:var(--color-muted-foreground)} .s-faq__link{color:var(--color-primary)} @media (hover:hover){ .s-faq__link:hover{text-decoration-line:underline} } @media (min-width:48rem){ .s-faq__intro{grid-column:span 2/span 2} .s-faq__list{grid-column:span 3/span 3} .s-faq__grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:calc(var(--spacing)*12)} .s-faq{padding-block:calc(var(--spacing)*24)} } /* propio */ .s-faq .c-accordion{max-width:none} .s-faq .c-accordion__trigger{font-size:1rem} .s-faq .c-accordion__content{font-size:1rem} ``` ## Credits - Tailark mist (MIT) · faqs/two: https://github.com/tailark/blocks