/* ============================================================
   DataTrust Widgets · FAQ
   2 layouts (dos columnas / centrado), claro u oscuro, acordeón.
   Namespaced .dtw-faq.
   ============================================================ */
.dtw-faq{
  --dtw-ink:#0D0C10;--dtw-purple:#413C58;--dtw-pink:#F54576;
  --dtw-paper:#FAFAF8;--dtw-lilac:#D4D0E4;
  --dtw-txt-dark:#211F26;--dtw-txt-dark-muted:#6B6775;--dtw-txt-light-muted:#A7A3B2;
  --dtw-ease:cubic-bezier(.22,.61,.36,1);
  padding:80px 0;font-family:'Poppins',sans-serif;
}
.dtw-faq--light{background:var(--dtw-paper)}
.dtw-faq--dark{background:var(--dtw-ink)}
/* Sin fondo de banda: transparente, respeta el contenedor de Elementor.
   Mantiene el padding vertical (solo quita el color). */
.dtw-faq--noband{background:transparent}
.dtw-faq__wrap{max-width:1200px;margin:0 auto;padding:0 32px}

/* Encabezado */
.dtw-faq__eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px}
.dtw-faq__eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--dtw-pink)}
.dtw-faq--light .dtw-faq__eyebrow{color:var(--dtw-txt-dark-muted)}
.dtw-faq--dark .dtw-faq__eyebrow{color:var(--dtw-txt-light-muted)}
.dtw-faq__title{font-family:'Playfair Display',serif;font-weight:700;font-size:33px;line-height:1.14;letter-spacing:-.01em}
.dtw-faq--light .dtw-faq__title{color:var(--dtw-txt-dark)}
.dtw-faq--dark .dtw-faq__title{color:var(--dtw-paper)}
.dtw-faq__lead{font-size:15px;line-height:1.6;font-weight:300;margin-top:10px;max-width:340px}
.dtw-faq--light .dtw-faq__lead{color:var(--dtw-txt-dark-muted)}
.dtw-faq--dark .dtw-faq__lead{color:var(--dtw-lilac)}

.dtw-faq__btn{display:inline-flex;align-items:center;gap:9px;background:var(--dtw-pink);color:#fff;font-weight:600;font-size:15px;padding:14px 26px;border-radius:100px;text-decoration:none;transition:transform .2s var(--dtw-ease),box-shadow .2s;margin-top:24px}
.dtw-faq__btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(245,69,118,.4)}

/* Layout dos columnas */
.dtw-faq__2col{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
@media(max-width:820px){.dtw-faq__2col{grid-template-columns:1fr;gap:32px}}

/* Layout centrado */
.dtw-faq--center .dtw-faq__center{max-width:780px;margin:0 auto;text-align:center}
.dtw-faq--center .dtw-faq__eyebrow{justify-content:center}
.dtw-faq--center .dtw-faq__lead{margin-left:auto;margin-right:auto;max-width:520px}
.dtw-faq--center .dtw-faq__list{margin-top:38px;text-align:left}

/* ============================================================
   Acordeón
   ============================================================ */
.dtw-faq__item{border-radius:14px;overflow:hidden;transition:background .25s,border-color .25s,box-shadow .25s}
.dtw-faq--light .dtw-faq__item{background:#fff;border:1px solid rgba(17,16,20,.08)}
.dtw-faq--dark .dtw-faq__item{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
.dtw-faq__item + .dtw-faq__item{margin-top:12px}
.dtw-faq__item.open{box-shadow:0 8px 26px rgba(245,69,118,.08)}
.dtw-faq--light .dtw-faq__item.open{border-color:rgba(245,69,118,.30)}
.dtw-faq--dark .dtw-faq__item.open{border-color:rgba(245,69,118,.35)}

.dtw-faq__q-h{margin:0;font-size:inherit}
.dtw-faq__q{width:100%;display:flex;align-items:center;gap:15px;padding:18px 22px;background:none;border:none;cursor:pointer;text-align:left;font-family:'Poppins',sans-serif}

/* Ícono al inicio */
.dtw-faq__ic{flex:0 0 42px;width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:rgba(245,69,118,.10);color:var(--dtw-pink);font-size:21px;transition:background .25s,color .25s}
.dtw-faq__ic svg{width:1em;height:1em;fill:currentColor}
.dtw-faq__item.open .dtw-faq__ic{background:var(--dtw-pink);color:#fff}

.dtw-faq__qt{flex:1;font-size:16px;font-weight:600;line-height:1.35}
.dtw-faq--light .dtw-faq__qt{color:var(--dtw-txt-dark)}
.dtw-faq--dark .dtw-faq__qt{color:var(--dtw-paper)}

/* Toggle + que gira a × (dibujado con CSS, sin dependencia de fuente de íconos) */
.dtw-faq__toggle{flex:0 0 auto;position:relative;width:22px;height:22px;transition:transform .35s var(--dtw-ease)}
.dtw-faq__toggle::before,.dtw-faq__toggle::after{content:"";position:absolute;top:50%;left:50%;background:var(--dtw-pink);border-radius:2px}
.dtw-faq__toggle::before{width:16px;height:2px;transform:translate(-50%,-50%)}
.dtw-faq__toggle::after{width:2px;height:16px;transform:translate(-50%,-50%)}
.dtw-faq__item.open .dtw-faq__toggle{transform:rotate(135deg)}

/* Respuesta */
.dtw-faq__a{max-height:0;overflow:hidden;opacity:0;transition:max-height .4s var(--dtw-ease),opacity .35s var(--dtw-ease)}
.dtw-faq__item.open .dtw-faq__a{max-height:360px;opacity:1}
.dtw-faq__a p{padding:0 22px 22px 79px;font-size:15.5px;line-height:1.6;font-weight:300}
.dtw-faq--light .dtw-faq__a p{color:#3a3742}
.dtw-faq--dark .dtw-faq__a p{color:var(--dtw-txt-light-muted)}

@media(max-width:600px){
  .dtw-faq__a p{padding-left:22px}
}
@media(prefers-reduced-motion:reduce){.dtw-faq *{transition:none!important}}

/* Padding lateral reducido en móvil (unificado a 20px) */
@media(max-width:600px){
  .dtw-faq__wrap{padding-left:20px;padding-right:20px}
}
