/* Banner superior DJ TXHOUSE - responsive + efectos visuales */
.tx-dj-hero{
  position:relative; isolation:isolate; overflow:hidden;
  min-height:clamp(230px,34vw,430px); border-radius:0 0 34px 34px;
  background:#02070c; color:white; box-shadow:0 24px 90px rgba(0,0,0,.65);
  border-bottom:1px solid rgba(39,245,255,.28);
}
.tx-dj-hero::before{
  content:""; position:absolute; inset:0;
  background-image:var(--tx-banner-img); background-size:cover; background-position:center;
  transform:scale(1.02); filter:saturate(1.18) contrast(1.08) brightness(.86);
  z-index:-3;
}
.tx-dj-hero::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 50% 40%, rgba(0,229,255,.22), transparent 34%),
             linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,10,18,.18) 42%, rgba(0,0,0,.82)),
             linear-gradient(180deg, rgba(0,0,0,.55), transparent 38%, rgba(0,0,0,.86));
  z-index:-2;
}
.tx-dj-hero__scan{position:absolute; inset:0; pointer-events:none; opacity:.42; mix-blend-mode:screen;
  background:repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, transparent 1px 7px);
  animation:txScan 7s linear infinite; z-index:-1;}
.tx-dj-hero__light{position:absolute; width:36vw; height:36vw; border-radius:999px; filter:blur(42px); opacity:.35; pointer-events:none;}
.tx-dj-hero__light.a{left:-12vw; top:12%; background:#00e5ff; animation:txFloatA 8s ease-in-out infinite;}
.tx-dj-hero__light.b{right:-12vw; top:20%; background:#7c3cff; animation:txFloatB 9s ease-in-out infinite;}
.tx-dj-hero__content{min-height:inherit; display:grid; align-content:end; gap:14px; padding:clamp(22px,5vw,54px); max-width:1220px; margin:auto;}
.tx-dj-hero__badge{width:max-content; padding:8px 12px; border-radius:999px; border:1px solid rgba(69,232,255,.55); background:rgba(0,20,32,.58); color:#bfffff; font-weight:800; letter-spacing:.12em; font-size:12px; backdrop-filter:blur(10px);}
.tx-dj-hero h1{margin:0; max-width:720px; font-size:clamp(32px,6vw,78px); line-height:.92; letter-spacing:-.06em; text-shadow:0 0 22px rgba(0,229,255,.42),0 6px 34px #000;}
.tx-dj-hero p{margin:0; max-width:640px; color:#d7fbff; font-size:clamp(14px,2vw,20px); text-shadow:0 3px 14px #000;}
.tx-dj-hero__actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:4px;}
.tx-dj-hero__actions a,.tx-dj-hero__actions button{border:0; cursor:pointer; text-decoration:none; border-radius:16px; padding:13px 17px; font-weight:950; letter-spacing:.01em;}
.tx-dj-hero__primary{color:#001018; background:linear-gradient(135deg,#00e5ff,#ffffff 48%,#7c3cff); box-shadow:0 0 28px rgba(0,229,255,.35);}
.tx-dj-hero__secondary{color:#dffcff; background:rgba(0,15,25,.62); border:1px solid rgba(115,230,255,.42)!important; backdrop-filter:blur(10px);}
.tx-dj-eq{position:absolute; left:0; right:0; bottom:0; height:48px; opacity:.85; pointer-events:none; background:linear-gradient(90deg,transparent,rgba(0,229,255,.95),transparent); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 80'%3E%3Cpath fill='black' d='M0 45h35v-8h8v18h8V25h8v35h8V12h8v52h8V34h8v20h8v-6h55v-16h8v35h8V18h8v42h8V30h8v25h8v-9h80v-20h8v45h8V8h8v55h8V22h8v37h8v-14h150v-9h8v18h8V20h8v44h8V5h8v64h8V30h8v25h8v-9h90v-14h8v33h8V18h8v44h8V34h8v20h8v-7h145v-19h8v48h8V14h8v52h8V28h8v28h8v-10h88v-8h8v20h8V25h8v36h8V12h8v58h8V32h8v23h8v-8h53v-2h40z'/%3E%3C/svg%3E"); mask-size:100% 100%;}
@keyframes txScan{to{background-position-y:80px}}
@keyframes txFloatA{50%{transform:translate(8vw,4vw) scale(1.1)}}
@keyframes txFloatB{50%{transform:translate(-7vw,-2vw) scale(1.06)}}
@media(max-width:700px){.tx-dj-hero{border-radius:0 0 24px 24px; min-height:360px}.tx-dj-hero::before{background-position:center top}.tx-dj-hero__content{padding:22px}.tx-dj-hero h1{max-width:430px}.tx-dj-hero__actions a,.tx-dj-hero__actions button{width:100%; text-align:center}}
@media(prefers-reduced-motion:reduce){.tx-dj-hero__scan,.tx-dj-hero__light{animation:none}}


.tx-dj-hero__brand{
  position:absolute;
  right:clamp(14px,4vw,46px);
  top:clamp(12px,3vw,28px);
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(0,229,255,.08),rgba(124,60,255,.12));
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 0 28px rgba(0,229,255,.22),0 16px 50px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter:blur(12px);
  animation:txLogoFloat 4.2s ease-in-out infinite,txLogoGlow 2.8s ease-in-out infinite alternate;
}
.tx-dj-hero__brand:before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:24px;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.34),transparent);
  transform:translateX(-120%);
  animation:txLogoShine 3.4s ease-in-out infinite;
  pointer-events:none;
}
.tx-dj-hero__brand img{
  height:clamp(42px,6vw,78px);
  max-width:220px;
  object-fit:contain;
  filter:drop-shadow(0 0 18px rgba(255,255,255,.36)) drop-shadow(0 0 28px rgba(0,229,255,.26));
  transform-origin:center;
  animation:txLogoPulse 2.9s ease-in-out infinite;
}
.tx-dj-hero__primary:hover{box-shadow:0 0 38px rgba(0,229,255,.55),0 0 70px rgba(124,60,255,.22)}
.tx-dj-hero__secondary:hover{box-shadow:0 0 30px rgba(0,229,255,.22);border-color:rgba(39,245,255,.68)!important}


@keyframes txLogoFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-8px) rotate(1.2deg)}
}
@keyframes txLogoGlow{
  from{box-shadow:0 0 22px rgba(0,229,255,.18),0 16px 50px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.16)}
  to{box-shadow:0 0 38px rgba(0,229,255,.42),0 0 64px rgba(124,60,255,.26),0 16px 50px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.22)}
}
@keyframes txLogoPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.045)}
}
@keyframes txLogoShine{
  0%,38%{transform:translateX(-120%);opacity:0}
  48%{opacity:.9}
  64%,100%{transform:translateX(120%);opacity:0}
}
@media(max-width:640px){
  .tx-dj-hero__brand{right:12px;top:10px;padding:8px 9px;border-radius:18px}
  .tx-dj-hero__brand img{height:44px;max-width:150px}
}
@media(prefers-reduced-motion:reduce){
  .tx-dj-hero__brand,.tx-dj-hero__brand:before,.tx-dj-hero__brand img{animation:none!important}
}

.tx-dj-hero__app{
  color:#071017;
  background:linear-gradient(135deg,#ffe36b,#fff7bd 44%,#00e5ff);
  box-shadow:0 0 34px rgba(255,227,107,.42),0 0 24px rgba(0,229,255,.28);
  font-size:clamp(16px,2vw,22px);
  padding:16px 24px!important;
  border:2px solid rgba(255,255,255,.42)!important;
  text-transform:uppercase;
}
.tx-dj-hero__app:hover{transform:translateY(-2px) scale(1.02);}
.tx-app-install-help{
  position:fixed; inset:0; z-index:99999; display:grid; place-items:center;
  padding:18px; background:rgba(0,0,0,.72); backdrop-filter:blur(8px);
}
.tx-app-install-help>div{
  width:min(460px,94vw); border-radius:24px; padding:24px;
  background:linear-gradient(135deg,#071827,#211132);
  border:1px solid rgba(0,229,255,.45); color:#eaffff;
  box-shadow:0 24px 90px rgba(0,0,0,.55);
}
.tx-app-install-help b{font-size:22px}
.tx-app-install-help p{line-height:1.45;color:#d6fbff}
.tx-app-install-help button{
  border:0; border-radius:14px; padding:12px 18px; font-weight:900; cursor:pointer;
  background:#22e6ff; color:#001018;
}


/* Ajuste: banner principal sin textos comerciales viejos */
.tx-dj-hero--clean .tx-dj-hero__content{align-content:end; gap:10px;}
.tx-dj-hero--clean .tx-dj-hero__actions{margin-top:0;}
.tx-dj-hero--clean{min-height:clamp(180px,26vw,320px);}
@media(max-width:700px){.tx-dj-hero--clean{min-height:260px}}

/* img3-20260515 */

/* === TXHOUSE 2026-05-15: app como ícono y sin botón Ver productos === */
.tx-dj-hero__primary,
[data-tx-go-products]{
  display:none !important;
}
.tx-dj-hero__actions.tx-dj-hero__actions--app-only{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  gap:0 !important;
  margin-top:10px !important;
}
.tx-dj-hero__app.tx-dj-hero__app--icon{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  padding:0 !important;
  border-radius:999px !important;
  display:inline-grid !important;
  place-items:center !important;
  font-size:25px !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  text-indent:0 !important;
  color:#071017 !important;
  background:linear-gradient(135deg,#27f5ff,#ffe36b) !important;
  border:1px solid rgba(255,255,255,.38) !important;
  box-shadow:0 8px 22px rgba(0,0,0,.28) !important;
}
.tx-dj-hero__app.tx-dj-hero__app--icon span{
  display:block;
  transform:translateY(-2px);
  font-weight:1000;
}
.tx-dj-hero__app.tx-dj-hero__app--icon:hover{
  transform:translateY(-1px) scale(1.06) !important;
}
@media (max-width:680px){
  .tx-dj-hero__app.tx-dj-hero__app--icon{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    min-height:38px !important;
    font-size:22px !important;
  }
}
/* fix-home-app-icon-20260515 */