/* ============================================================
   DataTrust Widgets · Hero SEO Ecommerce (capa de composición)
   Se apoya en hero.css (layout, copy, fondo) y seo-ecommerce.css
   (ventanas del caso DISET). Solo añade lo necesario para colocar
   la composición en la columna derecha del Hero y su responsive.
   ============================================================ */

/* Columna derecha: la composición define su altura (no hereda min-height
   de imagen). min-width:0 evita overflow del grid en Safari. */
.dtw-hero__visual--seoe{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

/* La composición, sin banda ni padding propios: ocupa toda la columna. */
.dtw-hero__visual--seoe .dtw-seoe--inhero{padding:0;width:100%;overflow:visible}
.dtw-hero__visual--seoe .dtw-seoe__stage{max-width:none;height:570px;margin:0}
.dtw-hero__visual--seoe .dtw-seoe__shop{width:70%;max-width:390px}
.dtw-hero__visual--seoe .dtw-seoe__serp{width:80%;max-width:440px}

/* Tipografía de UI del caso en Poppins (Inter/JetBrains rechazados). */
.dtw-hero__visual--seoe .dtw-seoe__url,
.dtw-hero__visual--seoe .dtw-seoe__p-badge,
.dtw-hero__visual--seoe .dtw-seoe__chip{font-family:'Poppins',sans-serif}

/* Etiqueta "Top 1 en Google Perú": verde mint sobre texto oscuro (mint
   solo como detalle del caso sobre fondo oscuro del hero). */
.dtw-hero__visual--seoe .dtw-seoe__pos--top1{
  background:#10FFCB;color:#053e31;
  box-shadow:0 8px 22px rgba(16,255,203,.28);
}
.dtw-hero__visual--seoe .dtw-seoe__pos--top1 i{font-size:14px}

/* Leyenda bajo la composición. */
.dtw-hero__visual--seoe .dtw-seoe__legend{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:18px;font-size:12.5px;letter-spacing:.02em;
  color:rgba(250,250,248,.62);
}
.dtw-hero__visual--seoe .dtw-seoe__legend i{color:#10FFCB;font-size:16px}

/* --- Responsive: apilar como el Hero SEO (copy arriba, caso abajo) --- */
@media(max-width:900px){
  .dtw-hero--seoe .dtw-hero__inner{grid-template-columns:1fr;gap:40px}
  .dtw-hero--seoe .dtw-hero__visual--seoe{display:flex}
  .dtw-hero__visual--seoe .dtw-seoe__stage{height:auto;display:flex;flex-direction:column;gap:18px}
  .dtw-hero__visual--seoe .dtw-seoe__win,
  .dtw-hero__visual--seoe .dtw-seoe__chips{position:static;width:100%;max-width:none}
  .dtw-hero__visual--seoe .dtw-seoe__chips{flex-direction:row;flex-wrap:wrap;align-items:flex-start;order:3}
  .dtw-hero__visual--seoe .dtw-seoe__serp{position:relative;box-shadow:none;margin-top:14px}
  .dtw-hero__visual--seoe .dtw-seoe__pos{top:-12px}
}
@media(max-width:520px){
  .dtw-hero__visual--seoe .dtw-seoe__shop-body{grid-template-columns:1fr}
  .dtw-hero__visual--seoe .dtw-seoe__shop-img{max-width:160px}
  .dtw-hero__visual--seoe .dtw-seoe__gtabs span:nth-child(n+5){display:none}
}