/* Thunderland Website — Launcher: On-Demand, tienda de ThunderCoins y noticias.
   Todo acotado a .tlw-scope (con #tlw-sc para ganarle a Divi). */

/* ---------- Contenedor del shortcode (va dentro de una sección de Divi) ---------- */
:is(.tlw-scope,#tlw-sc).tlw-lx-sc{background:transparent;padding:6px 0;margin:0 0 1.5em}
:is(.tlw-scope,#tlw-sc).tlw-lx-sc .content-head{margin-bottom:26px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-sec .content-head{margin-bottom:34px}

/* ---------- On-Demand: pósters 2:3 ---------- */
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(168px,100%),1fr));gap:26px 18px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-poster{margin:0;min-width:0}
:is(.tlw-scope,#tlw-sc) .tlw-lx-art{
  position:relative;aspect-ratio:2/3;overflow:hidden;border-radius:20px;isolation:isolate;
  background:linear-gradient(160deg,#2b1a59,#0f0c1a);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 18px 44px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.08);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .3s ease;
}
:is(.tlw-scope,#tlw-sc) .tlw-lx-art img,:is(.tlw-scope,#tlw-sc) .tlw-lx-art video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,7,14,.35),transparent 30%,transparent 55%,rgba(8,7,14,.75));pointer-events:none}
:is(.tlw-scope,#tlw-sc) .tlw-lx-badge{
  position:absolute;left:10px;top:10px;z-index:2;max-width:calc(100% - 20px);
  padding:5px 10px;border-radius:999px;background:var(--yellow);color:#151015;
  font-size:10.5px;font-weight:900;letter-spacing:.9px;text-transform:uppercase;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 6px 18px rgba(255,217,47,.25);
}
:is(.tlw-scope,#tlw-sc) .tlw-lx-play{
  position:absolute;left:50%;top:50%;z-index:2;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;
  display:grid;place-items:center;color:#fff;background:rgba(10,8,18,.55);border:1px solid rgba(255,255,255,.3);
  backdrop-filter:blur(8px);opacity:0;transform:scale(.85);transition:opacity .25s ease,transform .25s ease;
}
:is(.tlw-scope,#tlw-sc) .tlw-lx-play svg{width:22px;height:22px;margin-left:3px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-poster:hover .tlw-lx-art{transform:translateY(-6px);border-color:color-mix(in srgb,var(--page-accent,#7a36ff) 60%,transparent);box-shadow:0 26px 60px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.04),0 0 40px color-mix(in srgb,var(--page-accent,#7a36ff) 28%,transparent)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-poster:hover .tlw-lx-art img,:is(.tlw-scope,#tlw-sc) .tlw-lx-poster:hover .tlw-lx-art video{transform:scale(1.05)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-poster:hover .tlw-lx-play{opacity:1;transform:none}
:is(.tlw-scope,#tlw-sc) .tlw-lx-title{margin:14px 0 4px;font-size:16px;font-weight:800;line-height:1.25;color:var(--text);letter-spacing:-.01em}
:is(.tlw-scope,#tlw-sc) .tlw-lx-meta{margin:0;font-size:11px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:var(--purple-2)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-desc{margin:8px 0 0;font-size:13.5px;line-height:1.55;color:var(--muted)}

/* ---------- Tienda: paquetes de ThunderCoins ---------- */
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs>.tlw-lx-pack{flex:1 1 170px;max-width:240px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack{
  position:relative;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;margin:0;
  aspect-ratio:3/4.6;border-radius:24px;color:#fff;text-align:center;
  background:radial-gradient(80% 60% at 50% 42%,rgba(255,217,47,.3),transparent 72%),linear-gradient(170deg,#2a2210,#110e0b 72%);
  border:1px solid rgba(255,217,47,.22);
  box-shadow:0 22px 55px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.1);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .3s ease;
}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.72),rgba(0,0,0,.25) 28%,transparent 46%),linear-gradient(to top,rgba(0,0,0,.78),transparent 34%)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack::after{content:"";position:absolute;inset:-40% -60%;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.14) 50%,transparent 58%);transform:translateX(-60%);transition:transform .9s ease}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack:hover{transform:translateY(-6px);border-color:rgba(255,217,47,.55);box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 46px rgba(255,217,47,.18)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack:hover::after{transform:translateX(60%)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack-bg{position:absolute;inset:0;z-index:0;display:grid;place-items:center}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack-bg img{width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack .tlw-lx-bolt{width:34%;margin-top:30%;color:var(--yellow);filter:drop-shadow(0 8px 26px rgba(255,217,47,.5))}
:is(.tlw-scope,#tlw-sc) .tlw-lx-bolt svg{display:block;width:100%;height:auto}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack-body{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:10px;padding:20px 14px 18px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack-name{margin:0;color:#fff;font-size:15px;font-weight:900;line-height:1.2;letter-spacing:.8px;text-transform:uppercase;text-shadow:0 2px 10px rgba(0,0,0,.5)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-pack-desc{margin:6px 0 0;font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.82)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-price{
  display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 14px;border-radius:14px;
  background:rgba(10,8,18,.62);border:1px solid rgba(255,217,47,.35);backdrop-filter:blur(8px);
  font-size:18px;font-weight:900;color:var(--yellow);line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.5);white-space:nowrap;max-width:100%;
}
:is(.tlw-scope,#tlw-sc) .tlw-lx-price small{font-size:11px;letter-spacing:.8px;opacity:.8;font-weight:800}
:is(.tlw-scope,#tlw-sc) .tlw-lx-coin{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--yellow);color:#2a2105}
:is(.tlw-scope,#tlw-sc) .tlw-lx-coin svg{width:13px;height:13px}

/* ---------- Noticias ---------- */
:is(.tlw-scope,#tlw-sc) .tlw-lx-news{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:20px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured{grid-template-columns:repeat(3,minmax(0,1fr))}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child{grid-column:span 2;grid-row:span 2}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post.glass-card{padding:0;display:flex;flex-direction:column;border-radius:24px;margin:0;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,box-shadow .3s ease}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--page-accent,#7a36ff) 55%,transparent)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post-img{position:relative;display:grid;place-items:center;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(160deg,#2b1a59,#0f0c1a)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;margin:0;max-width:none;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post-img .tlw-lx-bolt{width:44px;color:var(--yellow);opacity:.8}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post:hover .tlw-lx-post-img img{transform:scale(1.04)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child .tlw-lx-post-img{flex:1;aspect-ratio:auto;min-height:260px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post-body{display:flex;flex-direction:column;gap:10px;padding:20px 22px 22px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-chip{padding:4px 10px;border-radius:999px;background:rgba(255,217,47,.12);border:1px solid rgba(255,217,47,.3);color:var(--yellow);font-size:10.5px;font-weight:900;letter-spacing:.9px;text-transform:uppercase}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post h3{margin:0;font-size:19px;line-height:1.25;font-weight:800;letter-spacing:-.01em}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child h3{font-size:clamp(22px,2.2vw,30px)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post h3 a{color:var(--text);text-decoration:none}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post h3 a:hover{color:var(--yellow)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-post p{margin:0;font-size:14px;line-height:1.6;color:var(--muted)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-more{margin-top:auto;align-self:flex-start;font-size:12px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;color:var(--purple-2);text-decoration:none}
:is(.tlw-scope,#tlw-sc) .tlw-lx-more:hover{color:var(--yellow)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-more span{display:inline-block;transition:transform .2s ease}
:is(.tlw-scope,#tlw-sc) .tlw-lx-more:hover span{transform:translateX(4px)}

/* ---------- Variantes elegidas en «Diseño de las tarjetas» ---------- */
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters{--lx-min:168px;grid-template-columns:repeat(auto-fill,minmax(min(var(--lx-min),100%),1fr))}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-sm{--lx-min:132px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-lg{--lx-min:220px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-landscape{--lx-min:260px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-landscape.is-sm{--lx-min:210px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-landscape.is-lg{--lx-min:340px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-square{--lx-min:180px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-landscape .tlw-lx-art{aspect-ratio:16/9}
:is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-square .tlw-lx-art{aspect-ratio:1}

:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-sm>.tlw-lx-pack{flex-basis:150px;max-width:190px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-lg>.tlw-lx-pack{flex-basis:220px;max-width:300px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-purple .tlw-lx-pack{background:radial-gradient(80% 60% at 50% 42%,rgba(176,108,255,.38),transparent 72%),linear-gradient(170deg,#2a1656,#0e0b1a 72%);border-color:rgba(176,108,255,.3)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-purple .tlw-lx-pack:hover{border-color:rgba(176,108,255,.7);box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 46px rgba(122,54,255,.28)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-purple .tlw-lx-bolt{color:#d9c2ff;filter:drop-shadow(0 8px 26px rgba(176,108,255,.55))}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-dark .tlw-lx-pack{background:linear-gradient(170deg,#1a1726,#0b0a12 72%);border-color:rgba(255,255,255,.1)}
:is(.tlw-scope,#tlw-sc) .tlw-lx-packs.is-dark .tlw-lx-bolt{opacity:.9}

:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-grid{grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr))}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-list{grid-template-columns:1fr;gap:14px}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-list .tlw-lx-post.glass-card{flex-direction:row;align-items:stretch}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-list .tlw-lx-post-img{flex:0 0 min(320px,36%);aspect-ratio:16/10}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-list .tlw-lx-post-body{flex:1;justify-content:center}
:is(.tlw-scope,#tlw-sc) .tlw-lx-news.no-image.is-featured .tlw-lx-post:first-child{grid-row:auto}

/* ---------- Pie con botón ---------- */
:is(.tlw-scope,#tlw-sc) .tlw-lx-foot{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:34px;text-align:center}
:is(.tlw-scope,#tlw-sc) .tlw-lx-note{margin:0;max-width:560px;font-size:13.5px;line-height:1.55;color:var(--muted)}

/* ---------- Responsive (también por ancho del contenedor, para columnas angostas de Divi) ---------- */
@media (max-width:900px){
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  :is(.tlw-scope,#tlw-sc) .tlw-lx-posters.is-landscape{grid-template-columns:1fr}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-list .tlw-lx-post.glass-card{flex-direction:column}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-list .tlw-lx-post-img{flex-basis:auto;aspect-ratio:16/9}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-posters{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured{grid-template-columns:1fr}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child{grid-column:auto;grid-row:auto}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child .tlw-lx-post-img{aspect-ratio:16/9;min-height:0}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-packs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-packs>.tlw-lx-pack{max-width:none;aspect-ratio:3/4.4;border-radius:20px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack-body{padding:14px 10px 12px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack-name{font-size:13px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack-desc{font-size:11.5px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-price{font-size:14px;padding:6px 9px;gap:6px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-coin{width:16px;height:16px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-coin svg{width:10px;height:10px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-price small{font-size:9.5px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack .tlw-lx-bolt{width:26%;margin-top:30%}
}
@container tlwm (max-width:900px){
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container tlwm (max-width:600px){
  :is(.tlw-scope,#tlw-sc) .tlw-lx-posters{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured{grid-template-columns:1fr}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child{grid-column:auto;grid-row:auto}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-news.is-featured .tlw-lx-post:first-child .tlw-lx-post-img{aspect-ratio:16/9;min-height:0}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-packs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-packs>.tlw-lx-pack{max-width:none;aspect-ratio:3/4.4;border-radius:20px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack-body{padding:14px 10px 12px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack-name{font-size:13px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack-desc{font-size:11.5px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-price{font-size:15px;padding:7px 10px}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack .tlw-lx-bolt{width:26%;margin-top:30%}
}
@media (prefers-reduced-motion:reduce){
  :is(.tlw-scope,#tlw-sc) .tlw-lx-art,:is(.tlw-scope,#tlw-sc) .tlw-lx-pack,:is(.tlw-scope,#tlw-sc) .tlw-lx-post{transition:none}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-poster:hover .tlw-lx-art,:is(.tlw-scope,#tlw-sc) .tlw-lx-pack:hover,:is(.tlw-scope,#tlw-sc) .tlw-lx-post:hover{transform:none}
  :is(.tlw-scope,#tlw-sc) .tlw-lx-pack::after{display:none}
}

/* ---------- Botones al final de las entradas que vienen del launcher ----------
   Van como HTML con las clases de WordPress; acá toman el estilo del V5 (amarillo / contorno). */
.thunderland-botones{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 8px}
body .thunderland-botones .wp-block-button__link{
  display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:16px;
  background:linear-gradient(180deg,#ffe56a,#ffd92f 55%,#f2c400);color:#151015;border:1px solid rgba(255,217,47,.6);
  font:900 13px/1 Inter,system-ui,sans-serif;letter-spacing:.3px;text-transform:uppercase;text-decoration:none;
  box-shadow:0 12px 30px rgba(255,217,47,.22),inset 0 1px rgba(255,255,255,.5);transition:transform .2s ease,box-shadow .2s ease;
}
body .thunderland-botones .wp-block-button__link:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(255,217,47,.32);color:#151015}
/* El contorno toma el color del texto de la entrada: se ve bien sobre fondo claro u oscuro. */
body .thunderland-botones .is-style-outline>.wp-block-button__link{background:transparent;color:inherit;border:2px solid currentColor;box-shadow:none}
body .thunderland-botones .is-style-outline>.wp-block-button__link:hover{color:inherit;box-shadow:0 10px 26px rgba(122,54,255,.25)}
