*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#f5f5f7;--surface:#fff;--soft:#fbfbfd;--text:#1d1d1f;--muted:#6e6e73;--line:rgba(0,0,0,.08);--blue:#0071e3}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
.site-header{position:sticky;top:0;z-index:100;background:rgba(245,245,247,.86);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(0,0,0,.06)}
.utility-bar{text-align:center;font-size:12px;color:#515154;padding:7px 16px;border-bottom:1px solid rgba(0,0,0,.05)}
.nav-shell{max-width:1180px;margin:auto;padding:0 24px}
.nav-main{min-height:68px;display:grid;grid-template-columns:auto minmax(220px,420px) auto;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-size:14px;font-weight:700;letter-spacing:.08em}
.logo-img{width:36px;height:36px;object-fit:cover;
  image-rendering:auto;border-radius:11px;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.search-wrap{position:relative}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-53%);color:#8e8e93;font-size:20px}
.search{width:100%;height:42px;padding:0 16px 0 40px;border:1px solid rgba(0,0,0,.08);border-radius:13px;background:rgba(255,255,255,.74);font-size:14px;outline:none}
.search:focus{background:#fff;border-color:rgba(0,113,227,.35);box-shadow:0 0 0 4px rgba(0,113,227,.08)}
.whatsapp-header{background:#1d1d1f;color:#fff;text-decoration:none;padding:10px 16px;border-radius:999px;font-size:13px;font-weight:600}
.categories{display:flex;gap:8px;overflow-x:auto;padding:0 0 12px;scrollbar-width:none}.categories::-webkit-scrollbar{display:none}
.cat-btn{border:0;background:rgba(255,255,255,.75);color:#515154;padding:8px 14px;border-radius:999px;cursor:pointer;font-size:13px;white-space:nowrap}
.cat-btn.active{background:#1d1d1f;color:#fff}
.hero{max-width:1240px;margin:auto;padding:30px 24px 0}
.hero-media{min-height:525px;position:relative;overflow:hidden;border-radius:30px;background:#111;box-shadow:0 8px 30px rgba(0,0,0,.06)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.74),rgba(0,0,0,.38) 45%,rgba(0,0,0,.06) 75%)}
.hero-content{position:relative;z-index:2;max-width:650px;padding:88px 70px;color:#fff}
.eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.8;margin-bottom:15px}.eyebrow.dark{color:var(--blue);opacity:1}
.hero h1{font-size:clamp(42px,6vw,68px);line-height:.98;letter-spacing:-.045em}.hero p{margin-top:22px;max-width:560px;font-size:clamp(16px,2vw,20px);line-height:1.45;color:rgba(255,255,255,.84)}
.hero-cta{display:inline-flex;margin-top:28px;background:#fff;color:#111;text-decoration:none;padding:12px 18px;border-radius:999px;font-size:14px;font-weight:600}
.section-shell{max-width:1180px;margin:auto;padding:88px 24px}.section-heading{max-width:720px;margin-bottom:34px}
.section-heading h2{font-size:clamp(34px,5vw,52px);line-height:1.03;letter-spacing:-.035em}.section-heading p{margin-top:12px;color:var(--muted);font-size:17px;line-height:1.5}
.collections{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.collection-card{min-height:250px;display:flex;flex-direction:column;text-decoration:none;color:var(--text);background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:0 2px 8px rgba(0,0,0,.03);transition:.25s}
.collection-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,0,0,.1)}
.collection-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:#f0f0f2;font-size:20px;margin-bottom:auto}
.collection-card h3{margin-top:34px;font-size:22px}.collection-card p{margin-top:8px;color:var(--muted);line-height:1.45}.collection-card span:last-child{margin-top:18px;color:var(--blue);font-size:14px;font-weight:600}
.catalog-section{background:#fff}.catalog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding-top:18px}
.card{background:linear-gradient(180deg,#fff 0%,#f8f8fa 100%);border:1px solid rgba(0,0,0,.055);border-radius:22px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.03);transition:.25s}

.card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,0,0,.1)}
.card img{width:100%;aspect-ratio:1.45/1;height:auto;object-fit:cover;
  image-rendering:auto;background:#eee;display:block}
.card-body{padding:18px;background:linear-gradient(180deg,#ffffff 0%,#f7f7f9 100%)}
.card-body h3{display:flex;align-items:center;gap:10px;min-height:48px;font-size:17px;line-height:1.25}
.brand-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:9px;font-weight:800;font-size:16px;flex-shrink:0;background:#111;color:#e50914;box-shadow:0 1px 3px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.05)}
.category-tag{display:inline-block;margin-top:4px;margin-bottom:14px;padding:5px 9px;border-radius:999px;background:#ececf0;color:#6e6e73;font-size:11px;font-weight:600}
.prices{display:flex;align-items:baseline;margin-bottom:14px}.new-price{font-size:22px;font-weight:700}
.btn-buy,.btn-soldout{display:block;width:100%;text-align:center;padding:11px 14px;border-radius:999px;text-decoration:none;font-size:13px;font-weight:600}
.btn-buy{background:var(--blue);color:#fff}.btn-buy:hover{background:#0077ed}.btn-soldout{background:#ececf0;color:#8e8e93}.empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:60px 20px}

.netflix-card{
  box-shadow:
    0 16px 34px rgba(229,9,20,.10),
    0 1px 4px rgba(0,0,0,.04);
}
.netflix-card .card-body{
  background: linear-gradient(145deg,#171717 0%, #2a0507 65%, #111111 100%);
  color: #ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -18px 30px rgba(0,0,0,.14);
}
.netflix-card .card-body h3{
  color:#ffffff;
}
.netflix-card .category-tag{
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.82);
}
.netflix-card .new-price{
  color:#ffffff;
}
.netflix-card .btn-buy{
  background:#1a73e8;
  color:#ffffff;
}
.netflix-card .btn-buy:hover{
  background:#2b7de9;
}
.netflix-card:hover{
  box-shadow:
    0 20px 44px rgba(229,9,20,.15),
    0 8px 18px rgba(0,0,0,.07);
}


.brand-disney{display:none}

.brand-disney-wordmark{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  height: 28px;
  padding: 7px 10px 0;
  border-radius: 999px;
  background: linear-gradient(145deg, #08111f 0%, #0d1b34 55%, #05090f 100%);
  color: #eaf9ff;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .01em;
  box-shadow:
    0 1px 3px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 14px rgba(25,216,255,.10);
  overflow: hidden;
}
.brand-disney-wordmark::before{
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  top: 4px;
  height: 11px;
  border-top: 1.7px solid rgba(108, 228, 255, .95);
  border-radius: 50%;
  transform: translateY(-2px);
  opacity: .95;
}

.disney-card{
  box-shadow:
    0 14px 34px rgba(10,47,94,.11),
    0 1px 4px rgba(0,0,0,.04);
}
.disney-card .card-body{
  background:
    radial-gradient(circle at 82% 8%, rgba(25,216,255,.22) 0%, rgba(25,216,255,.10) 22%, transparent 48%),
    radial-gradient(circle at 10% 100%, rgba(13,27,52,.42) 0%, transparent 40%),
    linear-gradient(145deg, #08111f 0%, #0d1b34 55%, #05090f 100%);
  color: #ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -18px 30px rgba(0,0,0,.14);
}
.disney-card .card-body h3{
  color:#ffffff;
}
.disney-card .category-tag{
  background: rgba(158,233,255,.12);
  color: rgba(220,246,255,.94);
  border: 1px solid rgba(158,233,255,.14);
}
.disney-card .prices{
  display: flex;
  align-items: baseline;
  margin-bottom: 14px;
}
.disney-card .new-price{
  color:#ffffff;
}
.disney-card .btn-buy{
  background: linear-gradient(90deg, #0a74ff 0%, #19b8ff 100%);
  color:#ffffff;
}
.disney-card .btn-buy:hover{
  background: linear-gradient(90deg, #0b6ae8 0%, #16a9e8 100%);
}
.disney-card:hover{
  box-shadow:
    0 20px 44px rgba(10,47,94,.16),
    0 8px 18px rgba(0,0,0,.08);
}


.brand-hbo-wordmark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  height:28px;
  padding:0 10px;
  border-radius:999px;
  background:linear-gradient(145deg,#0e0f12 0%, #23262d 55%, #090a0c 100%);
  color:#eef2f7;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  box-shadow:
    0 1px 3px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 14px rgba(255,255,255,.08);
}
.hbo-card{
  box-shadow:
    0 14px 34px rgba(18,22,28,.12),
    0 1px 4px rgba(0,0,0,.04);
}
.hbo-card .card-body{
  background:
    radial-gradient(circle at 84% 10%, rgba(255,255,255,.16) 0%, rgba(255,255,255,.05) 20%, transparent 44%),
    radial-gradient(circle at 10% 100%, rgba(96,103,117,.16) 0%, transparent 40%),
    linear-gradient(145deg, #0d0e11 0%, #2a2e36 56%, #08090b 100%);
  color:#ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -18px 30px rgba(0,0,0,.16);
}
.hbo-card .card-body h3{
  color:#ffffff;
}
.hbo-card .category-tag{
  background:rgba(255,255,255,.10);
  color:rgba(243,247,250,.9);
  border:1px solid rgba(255,255,255,.08);
}
.hbo-card .new-price{
  color:#ffffff;
}
.hbo-card .btn-buy{
  background:linear-gradient(90deg,#0a84ff 0%, #0066cc 100%);
  color:#ffffff;
}
.hbo-card .btn-buy:hover{
  background:linear-gradient(90deg,#2997ff 0%, #0a84ff 100%);
}
.hbo-card:hover{
  box-shadow:
    0 20px 44px rgba(18,22,28,.16),
    0 8px 18px rgba(0,0,0,.08);
}


.brand-crunchy-wordmark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:48px;
  height:28px;
  padding:0 10px;
  border-radius:999px;
  background:linear-gradient(145deg,#ff8d1a 0%, #ff6a00 60%, #cf4f00 100%);
  color:#ffffff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  box-shadow:
    0 1px 3px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 16px rgba(255,122,0,.18);
}
.crunchy-swirl{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  font-size:11px;
  line-height:1;
}
.crunchy-card{
  box-shadow:
    0 14px 34px rgba(39,21,8,.12),
    0 1px 4px rgba(0,0,0,.04);
}
.crunchy-card .card-body{
  background:
    radial-gradient(circle at 84% 12%, rgba(255,200,140,.18) 0%, rgba(255,200,140,.05) 20%, transparent 42%),
    radial-gradient(circle at 10% 100%, rgba(255,111,0,.20) 0%, transparent 40%),
    linear-gradient(145deg, #130a05 0%, #311408 46%, #ff6a00 100%);
  color:#ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -18px 30px rgba(0,0,0,.16);
}
.crunchy-card .card-body h3{
  color:#ffffff;
}
.crunchy-card .category-tag{
  background:rgba(255,255,255,.12);
  color:rgba(255,245,235,.94);
  border:1px solid rgba(255,255,255,.08);
}
.crunchy-card .new-price{
  color:#ffffff;
}
.crunchy-card .btn-buy{
  background:linear-gradient(90deg,#0a84ff 0%, #0066cc 100%);
  color:#ffffff;
}
.crunchy-card .btn-buy:hover{
  background:linear-gradient(90deg,#2997ff 0%, #0a84ff 100%);
}
.crunchy-card:hover{
  box-shadow:
    0 20px 44px rgba(39,21,8,.16),
    0 8px 18px rgba(0,0,0,.08);
}


.brand-paramount-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  min-width:18px;
  padding:0;
  margin:0;
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
  border-radius:0 !important;
  overflow:visible;
}

.brand-paramount-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
  filter:none;
}

.paramount-card{
  box-shadow:
    0 14px 34px rgba(18,30,52,.12),
    0 1px 4px rgba(0,0,0,.04);
}
.paramount-card .card-body{
  background:
    radial-gradient(circle at 84% 14%, rgba(112,192,255,.18) 0%, rgba(112,192,255,.05) 22%, transparent 42%),
    radial-gradient(circle at 12% 100%, rgba(0,112,255,.16) 0%, transparent 40%),
    linear-gradient(145deg, #07111f 0%, #11224a 42%, #1e6eff 100%);
  color:#ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 30px rgba(0,0,0,.14);
}
.paramount-card .card-body h3{color:#ffffff}
.paramount-card .category-tag{
  background:rgba(255,255,255,.12);
  color:rgba(240,248,255,.95);
  border:1px solid rgba(255,255,255,.08);
}
.paramount-card .new-price{color:#ffffff}
.paramount-card .btn-buy{
  background:linear-gradient(90deg,#0a84ff 0%, #0066cc 100%);
  color:#ffffff;
}
.paramount-card .btn-buy:hover{
  background:linear-gradient(90deg,#2997ff 0%, #0a84ff 100%);
}
.paramount-card:hover{
  box-shadow:
    0 20px 44px rgba(18,30,52,.16),
    0 8px 18px rgba(0,0,0,.08);
}



.brand-prime-inline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:28px;
  flex:none;
  padding:0;
  margin:0;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  overflow:visible;
}
.brand-prime-inline svg{
  display:block;
  width:64px;
  height:28px;
  overflow:visible;
}
.brand-prime-inline .prime-word{
  font-family:Arial,Helvetica,sans-serif;
  font-size:13px;
  font-weight:700;
  fill:#19c8ff;
}
.brand-prime-inline .video-word{
  font-family:Arial,Helvetica,sans-serif;
  font-size:13px;
  font-weight:700;
  fill:#ffffff;
}
.brand-prime-inline .prime-smile-path,
.brand-prime-inline .prime-arrow-path{
  fill:none;
  stroke:#19c8ff;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.prime-card{
  box-shadow:
    0 14px 34px rgba(8,31,61,.12),
    0 1px 4px rgba(0,0,0,.04);
}
.prime-card .card-body{
  background:
    radial-gradient(circle at 84% 12%, rgba(31,180,255,.18) 0%, rgba(31,180,255,.05) 22%, transparent 42%),
    radial-gradient(circle at 12% 100%, rgba(4,95,174,.16) 0%, transparent 40%),
    linear-gradient(145deg, #06111b 0%, #0b2234 45%, #0c3f69 100%);
  color:#ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    inset 0 -18px 30px rgba(0,0,0,.14);
}
.prime-card .card-body h3{color:#ffffff}
.prime-card .category-tag{
  background:rgba(255,255,255,.12);
  color:rgba(240,248,255,.95);
  border:1px solid rgba(255,255,255,.08);
}
.prime-card .new-price{color:#ffffff}
.prime-card .btn-buy{
  background:linear-gradient(90deg,#0a84ff 0%, #12bfff 100%);
  color:#ffffff;
}
.prime-card .btn-buy:hover{
  background:linear-gradient(90deg,#2997ff 0%, #2ad5ff 100%);
}
.prime-card:hover{
  box-shadow:
    0 20px 44px rgba(8,31,61,.16),
    0 8px 18px rgba(0,0,0,.08);
}

.brand-viki-wordmark{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:42px;height:34px;padding:4px 5px 3px;border-radius:9px;background:linear-gradient(145deg,#47d8ff 0%,#169fe3 58%,#0a6fc7 100%);color:#fff;line-height:1;box-shadow:0 1px 3px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.22),0 0 14px rgba(35,190,255,.14);flex:none}.brand-viki-wordmark .viki-main{font-size:13px;font-weight:800}.brand-viki-wordmark .viki-rakuten{font-size:7px;font-weight:700;margin-top:2px}.viki-card{box-shadow:0 14px 34px rgba(0,77,156,.12),0 1px 4px rgba(0,0,0,.04)}.viki-card .card-body{background:radial-gradient(circle at 84% 12%,rgba(58,220,255,.22) 0%,rgba(58,220,255,.06) 22%,transparent 42%),radial-gradient(circle at 12% 100%,rgba(0,91,255,.18) 0%,transparent 40%),linear-gradient(145deg,#06112a 0%,#0b2370 48%,#10a8d6 100%);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 -18px 30px rgba(0,0,0,.14)}.viki-card .card-body h3{color:#fff}.viki-card .category-tag{background:rgba(255,255,255,.12);color:rgba(240,250,255,.95);border:1px solid rgba(255,255,255,.10)}.viki-card .new-price{color:#fff}.viki-card .btn-buy{background:linear-gradient(90deg,#0a84ff 0%,#12c8f0 100%);color:#fff}.viki-card .btn-buy:hover{background:linear-gradient(90deg,#2997ff 0%,#2dd7ff 100%)}.viki-card:hover{box-shadow:0 20px 44px rgba(0,77,156,.16),0 8px 18px rgba(0,0,0,.08)}


/* YouTube Premium */
.brand-youtube{
  width:34px;
  height:24px;
  min-width:34px;
  padding:0;
  border-radius:8px;
  background:#ff0000 !important;
  border:none !important;
  box-shadow:0 1px 3px rgba(0,0,0,.18),0 0 14px rgba(255,0,0,.16) !important;
  position:relative;
}
.brand-youtube .yt-play{
  width:0;height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:8px solid #fff;
  margin-left:2px;
}
.youtube-card{
  box-shadow:0 14px 34px rgba(110,0,0,.12),0 1px 4px rgba(0,0,0,.04);
}
.youtube-card .card-body{
  background:
    radial-gradient(circle at 88% 10%, rgba(255,52,52,.22) 0%, rgba(255,52,52,.07) 24%, transparent 48%),
    radial-gradient(circle at 10% 100%, rgba(180,0,0,.22) 0%, transparent 42%),
    linear-gradient(145deg,#0a0a0a 0%,#1a0b0b 52%,#520808 100%);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),inset 0 -18px 30px rgba(0,0,0,.16);
}
.youtube-card .card-body h3{color:#fff}
.youtube-card .category-tag{background:rgba(255,255,255,.10);color:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.08)}
.youtube-card .new-price{color:#fff}
.youtube-card .btn-buy{background:linear-gradient(90deg,#0a84ff 0%,#0066cc 100%);color:#fff}
.youtube-card .btn-buy:hover{background:linear-gradient(90deg,#2997ff 0%,#0a84ff 100%)}
.youtube-card:hover{box-shadow:0 20px 44px rgba(110,0,0,.17),0 8px 18px rgba(0,0,0,.08)}

.footer{background:var(--bg);padding:52px 24px 28px}.footer-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;gap:30px;padding-bottom:32px;border-bottom:1px solid var(--line)}
.footer strong{font-size:14px;letter-spacing:.08em}.footer p{color:var(--muted);margin-top:8px;font-size:13px}.footer-links{display:flex;gap:18px}.footer a{color:var(--blue);text-decoration:none;font-size:13px;font-weight:600}.copyright{max-width:1180px;margin:22px auto 0}
@media(max-width:980px){.catalog{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.nav-shell{padding:0 16px}.nav-main{grid-template-columns:1fr auto;gap:12px;padding:12px 0 10px}.search-wrap{grid-column:1/-1;grid-row:2}.brand span{font-size:12px}.hero{padding:16px 12px 0}.hero-media{min-height:500px;border-radius:24px}.hero-overlay{background:linear-gradient(0deg,rgba(0,0,0,.76),rgba(0,0,0,.28) 65%,rgba(0,0,0,.05))}.hero-content{position:absolute;left:0;right:0;bottom:0;padding:34px 24px}.hero h1{font-size:43px}.section-shell{padding:64px 16px}.collections{grid-template-columns:1fr}.catalog{grid-template-columns:repeat(2,1fr);gap:12px}.footer-inner{flex-direction:column}}
@media(max-width:440px){.catalog{grid-template-columns:1fr}.hero-media{min-height:440px}.hero h1{font-size:38px}}




/* =========================================================
   FONDO ATMOSFÉRICO MEBIUS — 3 halos premium
   Menos luces, más grandes, más lentas y mejor integradas.
   ========================================================= */
body{
  position:relative;
  min-height:100vh;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 50% -12%, #f9fafc 0%, #f1f4f8 28%, #e8edf3 62%, #e2e7ee 100%);
}

.ambient-lights{
  position:fixed;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 8%, rgba(255,255,255,.62), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(210,218,229,.10));
}

.ambient-halo{
  position:absolute;
  display:block;
  width:clamp(440px,58vw,860px);
  aspect-ratio:1;
  border-radius:50%;
  filter:blur(105px);
  opacity:.24;
  will-change:transform,opacity;
  transform:translate3d(0,0,0) scale(1);
}

/* Azul frío: identidad digital / Paramount / Prime / Disney */
.halo-blue{
  left:-18%;
  top:4%;
  background:
    radial-gradient(circle at 45% 45%,
      rgba(38,125,255,.78) 0%,
      rgba(51,152,255,.34) 34%,
      rgba(76,188,255,.12) 55%,
      rgba(76,188,255,0) 74%);
  animation:haloBlue 28s ease-in-out infinite alternate;
}

/* Rojo vino: Netflix / YouTube, mucho más sobrio que un rojo puro */
.halo-wine{
  right:-22%;
  top:34%;
  background:
    radial-gradient(circle at 50% 50%,
      rgba(126,0,30,.68) 0%,
      rgba(183,19,50,.30) 36%,
      rgba(227,62,86,.10) 56%,
      rgba(227,62,86,0) 76%);
  animation:haloWine 34s ease-in-out infinite alternate;
}

/* Violeta-cian: Viki / HBO / balance visual en la parte baja */
.halo-violet{
  left:8%;
  bottom:-28%;
  background:
    radial-gradient(circle at 52% 46%,
      rgba(151,92,210,.52) 0%,
      rgba(77,139,220,.24) 38%,
      rgba(75,211,232,.10) 58%,
      rgba(75,211,232,0) 76%);
  animation:haloViolet 38s ease-in-out infinite alternate;
}

/* Movimiento de respiración: poco desplazamiento, más escala y opacidad */
@keyframes haloBlue{
  0%{transform:translate3d(0,0,0) scale(.94);opacity:.20}
  50%{transform:translate3d(5vw,4vh,0) scale(1.06);opacity:.27}
  100%{transform:translate3d(2vw,8vh,0) scale(.99);opacity:.22}
}
@keyframes haloWine{
  0%{transform:translate3d(0,0,0) scale(1.02);opacity:.18}
  50%{transform:translate3d(-5vw,5vh,0) scale(.95);opacity:.25}
  100%{transform:translate3d(-2vw,10vh,0) scale(1.05);opacity:.20}
}
@keyframes haloViolet{
  0%{transform:translate3d(0,0,0) scale(.96);opacity:.18}
  50%{transform:translate3d(7vw,-5vh,0) scale(1.08);opacity:.24}
  100%{transform:translate3d(3vw,-10vh,0) scale(1);opacity:.20}
}

.site-header,
main,
.footer{
  position:relative;
  z-index:2;
}

/* Vidrio muy ligero para que la luz se perciba dentro del ambiente,
   sin convertir la web en glassmorphism exagerado. */
.catalog-section{
  background:rgba(236,240,246,.44);
  border-top:1px solid rgba(255,255,255,.66);
  border-bottom:1px solid rgba(255,255,255,.52);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.collection-card{
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(250,251,253,.72));
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-color:rgba(255,255,255,.72);
  box-shadow:
    0 18px 42px rgba(34,45,62,.065),
    inset 0 1px 0 rgba(255,255,255,.72);
}

/* Más separación visual de las tarjetas sobre el fondo */
.card{
  box-shadow:
    0 16px 36px rgba(30,39,53,.075),
    0 2px 8px rgba(30,39,53,.035);
}

.hero-media{
  box-shadow:0 24px 64px rgba(30,39,53,.12);
}

.footer{
  background:rgba(226,232,240,.70);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-top:1px solid rgba(255,255,255,.68);
}

@media(max-width:760px){
  .ambient-halo{
    width:560px;
    filter:blur(112px);
    opacity:.17;
  }
  .halo-blue{left:-62%;top:8%}
  .halo-wine{right:-66%;top:40%}
  .halo-violet{left:-48%;bottom:-20%}
}

@media(prefers-reduced-motion:reduce){
  .ambient-halo{animation:none !important}
}


/* =========================================================
   HERO PREMIUM — jerarquía, confianza y microinteracciones
   ========================================================= */
.hero{
  padding-top:34px;
}

.hero-media{
  min-height:570px;
  border-radius:32px;
  isolation:isolate;
  box-shadow:
    0 30px 70px rgba(28,37,52,.16),
    0 2px 10px rgba(28,37,52,.06);
}

.hero-img{
  transform:scale(1.015);
  transition:transform 8s ease;
}

.hero-media:hover .hero-img{
  transform:scale(1.045);
}

.hero-overlay{
  background:
    linear-gradient(90deg,rgba(5,8,15,.82) 0%,rgba(7,12,22,.66) 35%,rgba(7,12,22,.24) 66%,rgba(7,12,22,.08) 100%),
    linear-gradient(0deg,rgba(0,0,0,.28),transparent 50%);
}

.hero-noise{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.08;
  background-image:
    radial-gradient(circle at 20% 30%,rgba(255,255,255,.45) 0 1px,transparent 1.2px),
    radial-gradient(circle at 80% 70%,rgba(255,255,255,.32) 0 1px,transparent 1.2px);
  background-size:34px 34px,46px 46px;
  mix-blend-mode:soft-light;
}

.hero-content{
  max-width:700px;
  padding:72px 70px 58px;
}

.hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:20px;
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.hero-badge.subtle{
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.86);
}

.hero h1{
  max-width:680px;
  font-size:clamp(46px,6.4vw,76px);
  line-height:.94;
  letter-spacing:-.058em;
  text-wrap:balance;
}

.hero p{
  max-width:610px;
  margin-top:22px;
  font-size:clamp(17px,2vw,20px);
  line-height:1.55;
  color:rgba(255,255,255,.83);
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.hero-cta{
  margin-top:0;
  min-height:46px;
  padding:0 20px;
  align-items:center;
  justify-content:center;
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

.hero-cta.primary{
  background:#fff;
  color:#111;
  box-shadow:0 10px 26px rgba(0,0,0,.12);
}

.hero-cta.primary:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(0,0,0,.18);
}

.hero-cta.secondary{
  background:rgba(255,255,255,.10);
  color:#fff;
  border:1px solid rgba(255,255,255,.20);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.hero-cta.secondary:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.16);
}

.hero-proof{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:34px;
}

.proof-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 13px;
  border-radius:15px;
  background:rgba(8,13,23,.34);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.proof-icon{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(255,255,255,.13);
  color:#fff;
  font-size:14px;
  font-weight:900;
}

.proof-item strong,
.proof-item small{
  display:block;
}

.proof-item strong{
  font-size:12px;
  color:#fff;
  line-height:1.2;
}

.proof-item small{
  margin-top:2px;
  font-size:10px;
  color:rgba(255,255,255,.62);
}

.hero-float-card{
  position:absolute;
  z-index:3;
  right:34px;
  bottom:30px;
  width:260px;
  padding:20px;
  border-radius:22px;
  background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 20px 40px rgba(0,0,0,.16);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  color:#fff;
  animation:heroFloat 7s ease-in-out infinite;
}

.hero-float-card .float-kicker{
  display:block;
  margin-bottom:8px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
  opacity:.68;
}

.hero-float-card strong{
  display:block;
  font-size:19px;
  line-height:1.2;
  letter-spacing:-.02em;
}

.hero-float-card small{
  display:block;
  margin-top:7px;
  font-size:11px;
  color:rgba(255,255,255,.68);
}

@keyframes heroFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

/* Microinteracciones generales */
.collection-card,
.card,
.btn-buy,
.whatsapp-header,
.cat-btn{
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    background .22s ease,
    border-color .22s ease;
}

.card:hover{
  transform:translateY(-7px);
}

.card:hover .btn-buy{
  transform:translateY(-1px);
}

.btn-buy:active,
.hero-cta:active,
.whatsapp-header:active{
  transform:translateY(0) scale(.985);
}

.whatsapp-header:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(29,29,31,.14);
}

@media(max-width:900px){
  .hero-float-card{display:none}
  .hero-content{max-width:760px}
}

@media(max-width:760px){
  .hero{padding:22px 14px 0}
  .hero-media{min-height:610px;border-radius:26px}
  .hero-content{padding:44px 24px 34px}
  .hero h1{font-size:clamp(42px,12vw,58px)}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-cta{width:100%}
  .hero-proof{display:grid;grid-template-columns:1fr;gap:8px}
  .proof-item{width:100%}
}

@media(prefers-reduced-motion:reduce){
  .hero-float-card{animation:none}
  .hero-img{transition:none}
}




/* Tarjetas IA y Herramientas con gris humo + negro suave + azul oscuro */
.ia-collection,
.tools-collection{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 14%, rgba(58,104,196,.22) 0%, rgba(58,104,196,.08) 24%, transparent 46%),
    radial-gradient(circle at 14% 100%, rgba(255,255,255,.04) 0%, transparent 24%),
    linear-gradient(180deg,#4a5058 0%, #2c333c 34%, #171d25 72%, #11161d 100%);
  border:1px solid rgba(16,24,36,.14);
  box-shadow:
    0 20px 40px rgba(7,10,16,.10),
    0 8px 18px rgba(11,18,29,.08),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(255,255,255,.02);
}
.ia-collection::before,
.tools-collection::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 22%),
    linear-gradient(135deg, transparent 0%, transparent 58%, rgba(84,132,214,.07) 100%);
  pointer-events:none;
}
.ia-collection::after,
.tools-collection::after{
  content:'';
  position:absolute;
  left:22px; right:22px; bottom:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(120,160,255,.34), transparent);
  opacity:.65;
}
.ia-collection .collection-icon,
.tools-collection .collection-icon{
  position:relative;
  z-index:1;
  background:rgba(9,14,24,.68);
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 18px rgba(88,138,255,.14);
}
.ia-collection h3,
.tools-collection h3{
  color:#f7f9fc;
  text-shadow:0 0 12px rgba(85,132,255,.08);
}
.ia-collection p,
.tools-collection p{
  color:rgba(227,234,244,.86);
}
.ia-collection span:last-child,
.tools-collection span:last-child{
  color:#86b9ff;
  text-shadow:0 0 16px rgba(68,130,255,.22);
}

/* Tarjeta de categoría Streaming con imagen editorial */
.streaming-collection{
  padding:0;
  overflow:hidden;
  min-height:250px;
  background:linear-gradient(180deg,#0f141b 0%,#171d26 55%,#1d2632 100%);
  border:1px solid rgba(16,24,36,.14);
  box-shadow:
    0 20px 40px rgba(7,10,16,.10),
    0 8px 18px rgba(11,18,29,.08),
    0 0 0 1px rgba(255,255,255,.02);
}
.streaming-collection .collection-media{
  position:relative;
  height:118px;
  overflow:hidden;
  background:#0f141b;
}
.streaming-collection .collection-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  image-rendering:auto;
  object-position:center center;
  transform:scale(1.018);
  transition:transform .45s ease,filter .45s ease;
}
.streaming-collection:hover .collection-media img{
  transform:scale(1.055);
  filter:saturate(1.04) contrast(1.03);
}
.streaming-collection .collection-media-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(4,10,18,.08) 0%,rgba(5,10,18,.14) 40%,rgba(4,9,17,.28) 100%),
    radial-gradient(circle at 28% 18%, rgba(83,140,255,.12), transparent 28%),
    radial-gradient(circle at 78% 82%, rgba(0,0,0,.14), transparent 30%);
  box-shadow:inset 0 -32px 42px rgba(5,10,18,.22);
  pointer-events:none;
}
.streaming-collection .streaming-icon{
  position:absolute;
  left:18px;
  bottom:14px;
  margin:0;
  width:42px;
  height:42px;
  border-radius:13px;
  color:#fff;
  background:rgba(9,14,24,.68);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 18px rgba(88,138,255,.14);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.streaming-collection .collection-copy{
  padding:20px 28px 24px;
  display:flex;
  flex-direction:column;
  min-height:132px;
  position:relative;
  background:
    radial-gradient(circle at 88% 12%, rgba(47,96,187,.24) 0%, rgba(47,96,187,.10) 22%, transparent 42%),
    radial-gradient(circle at 12% 100%, rgba(255,255,255,.05) 0%, transparent 24%),
    linear-gradient(180deg,#474c53 0%, #2a313a 34%, #171c23 72%, #12171d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -18px 26px rgba(0,0,0,.12),
    0 -1px 0 rgba(255,255,255,.03);
}
.streaming-collection .collection-copy::after{
  content:'';
  position:absolute;
  inset:auto 18px 0 18px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(120,160,255,.34), transparent);
  opacity:.65;
}
.streaming-collection h3{
  margin-top:0;
  color:#f7f9fc;
  letter-spacing:-.02em;
  text-shadow:0 0 12px rgba(85,132,255,.08);
}
.streaming-collection p{
  margin-top:8px;
  line-height:1.45;
  color:rgba(227,234,244,.86);
}
.streaming-collection .collection-copy > span:last-child{
  margin-top:auto;
  padding-top:14px;
  color:#86b9ff;
  text-shadow:0 0 16px rgba(68,130,255,.22);
  font-size:14px;
  font-weight:600;
}

@media(max-width:760px){
  .streaming-collection .collection-media{height:132px}
  .streaming-collection .collection-copy{padding:20px 22px 24px}
}


/* Tarjeta IA con imagen editorial, en el mismo lenguaje visual que Streaming */
.ia-collection{
  padding:0;
  overflow:hidden;
  min-height:250px;
  background:linear-gradient(180deg,#0f141b 0%,#171d26 55%,#1d2632 100%);
  border:1px solid rgba(16,24,36,.14);
  box-shadow:
    0 20px 40px rgba(7,10,16,.10),
    0 8px 18px rgba(11,18,29,.08),
    0 0 0 1px rgba(255,255,255,.02);
}
.ia-collection .collection-media{
  position:relative;
  height:118px;
  overflow:hidden;
  background:#0f141b;
}
.ia-collection .collection-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  image-rendering:auto;
  object-position:center center;
  transform:scale(1.018);
  transition:transform .45s ease,filter .45s ease;
}
.ia-collection:hover .collection-media img{
  transform:scale(1.055);
  filter:saturate(1.04) contrast(1.03);
}
.ia-collection .collection-media-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(4,10,18,.10) 0%,rgba(5,10,18,.18) 42%,rgba(4,9,17,.32) 100%),
    radial-gradient(circle at 26% 20%, rgba(83,140,255,.16), transparent 30%),
    radial-gradient(circle at 74% 78%, rgba(0,0,0,.16), transparent 34%);
  box-shadow:inset 0 -32px 42px rgba(5,10,18,.22);
  pointer-events:none;
}
.ia-collection .ia-icon{
  position:absolute;
  left:18px;
  bottom:14px;
  margin:0;
  width:42px;
  height:42px;
  border-radius:13px;
  color:#fff;
  background:rgba(9,14,24,.68);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 18px rgba(88,138,255,.14);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.ia-collection .collection-copy{
  padding:20px 28px 24px;
  display:flex;
  flex-direction:column;
  min-height:132px;
  position:relative;
  background:
    radial-gradient(circle at 88% 12%, rgba(47,96,187,.24) 0%, rgba(47,96,187,.10) 22%, transparent 42%),
    radial-gradient(circle at 12% 100%, rgba(255,255,255,.05) 0%, transparent 24%),
    linear-gradient(180deg,#474c53 0%, #2a313a 34%, #171c23 72%, #12171d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -18px 26px rgba(0,0,0,.12),
    0 -1px 0 rgba(255,255,255,.03);
}
.ia-collection .collection-copy::after{
  content:'';
  position:absolute;
  inset:auto 18px 0 18px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(120,160,255,.34), transparent);
  opacity:.65;
}
.ia-collection h3{
  margin-top:0;
  color:#f7f9fc;
  letter-spacing:-.02em;
  text-shadow:0 0 12px rgba(85,132,255,.08);
}
.ia-collection p{
  margin-top:8px;
  line-height:1.45;
  color:rgba(227,234,244,.86);
}
.ia-collection .collection-copy > span:last-child{
  margin-top:auto;
  padding-top:14px;
  color:#86b9ff;
  text-shadow:0 0 16px rgba(68,130,255,.22);
  font-size:14px;
  font-weight:600;
}
@media(max-width:760px){
  .ia-collection .collection-media{height:132px}
  .ia-collection .collection-copy{padding:20px 22px 24px}
}


/* Tarjeta Herramientas con imagen editorial, en el mismo lenguaje visual */
.tools-collection{
  padding:0;
  overflow:hidden;
  min-height:250px;
  background:linear-gradient(180deg,#0f141b 0%,#171d26 55%,#1d2632 100%);
  border:1px solid rgba(16,24,36,.14);
  box-shadow:
    0 20px 40px rgba(7,10,16,.10),
    0 8px 18px rgba(11,18,29,.08),
    0 0 0 1px rgba(255,255,255,.02);
}
.tools-collection .collection-media{
  position:relative;
  height:118px;
  overflow:hidden;
  background:#0f141b;
}
.tools-collection .collection-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  image-rendering:auto;
  object-position:center center;
  transform:scale(1.018);
  transition:transform .45s ease,filter .45s ease;
}
.tools-collection:hover .collection-media img{
  transform:scale(1.055);
  filter:saturate(1.04) contrast(1.03);
}
.tools-collection .collection-media-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(4,10,18,.08) 0%,rgba(5,10,18,.16) 42%,rgba(4,9,17,.30) 100%),
    radial-gradient(circle at 24% 18%, rgba(95,151,255,.14), transparent 28%),
    radial-gradient(circle at 76% 80%, rgba(0,0,0,.18), transparent 34%);
  box-shadow:inset 0 -32px 42px rgba(5,10,18,.22);
  pointer-events:none;
}
.tools-collection .tools-icon{
  position:absolute;
  left:18px;
  bottom:14px;
  margin:0;
  width:42px;
  height:42px;
  border-radius:13px;
  color:#fff;
  background:rgba(9,14,24,.68);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 18px rgba(88,138,255,.14);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.tools-collection .collection-copy{
  padding:20px 28px 24px;
  display:flex;
  flex-direction:column;
  min-height:132px;
  position:relative;
  background:
    radial-gradient(circle at 88% 12%, rgba(47,96,187,.24) 0%, rgba(47,96,187,.10) 22%, transparent 42%),
    radial-gradient(circle at 12% 100%, rgba(255,255,255,.05) 0%, transparent 24%),
    linear-gradient(180deg,#474c53 0%, #2a313a 34%, #171c23 72%, #12171d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -18px 26px rgba(0,0,0,.12),
    0 -1px 0 rgba(255,255,255,.03);
}
.tools-collection .collection-copy::after{
  content:'';
  position:absolute;
  inset:auto 18px 0 18px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(120,160,255,.34), transparent);
  opacity:.65;
}
.tools-collection h3{
  margin-top:0;
  color:#f7f9fc;
  letter-spacing:-.02em;
  text-shadow:0 0 12px rgba(85,132,255,.08);
}
.tools-collection p{
  margin-top:8px;
  line-height:1.45;
  color:rgba(227,234,244,.86);
}
.tools-collection .collection-copy > span:last-child{
  margin-top:auto;
  padding-top:14px;
  color:#86b9ff;
  text-shadow:0 0 16px rgba(68,130,255,.22);
  font-size:14px;
  font-weight:600;
}
@media(max-width:760px){
  .tools-collection .collection-media{height:132px}
  .tools-collection .collection-copy{padding:20px 22px 24px}
}


/* Apple TV+ — negro + plomo, fiel al lenguaje visual de la plataforma */
.brand-apple-tv{
  width:62px;
  height:30px;
  padding:0 9px;
  gap:5px;
  border-radius:10px;
  background:linear-gradient(145deg,#050505 0%,#26272a 60%,#0b0b0c 100%);
  color:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.10),0 0 14px rgba(255,255,255,.05);
}
.brand-apple-tv .apple-mark{width:15px;height:20px;fill:#fff;display:block;flex:none}
.brand-apple-tv .apple-tv-word{font-size:14px;font-weight:700;letter-spacing:-.03em;color:#fff;line-height:1}
.apple-card{
  box-shadow:0 14px 34px rgba(11,12,14,.15),0 1px 4px rgba(0,0,0,.05);
}
.apple-card .card-body{
  background:
    radial-gradient(circle at 84% 10%,rgba(255,255,255,.14) 0%,rgba(255,255,255,.04) 22%,transparent 44%),
    radial-gradient(circle at 12% 100%,rgba(95,101,111,.15) 0%,transparent 40%),
    linear-gradient(145deg,#08090a 0%,#2a2c30 54%,#101113 100%);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 -18px 30px rgba(0,0,0,.18);
}
.apple-card .card-body h3{color:#fff}
.apple-card .category-tag{
  background:rgba(255,255,255,.10);
  color:rgba(245,247,250,.92);
  border:1px solid rgba(255,255,255,.08);
}
.apple-card .new-price{color:#fff}
.apple-card .btn-buy{background:linear-gradient(90deg,#0a84ff 0%,#0066cc 100%);color:#fff}
.apple-card .btn-buy:hover{background:linear-gradient(90deg,#2997ff 0%,#0a84ff 100%)}
.apple-card:hover{box-shadow:0 20px 44px rgba(10,11,13,.20),0 8px 18px rgba(0,0,0,.09)}




/* Small original platform icons, beside the product title only. */
.card .card-body h3 { display:flex; align-items:center; gap:9px; }
.card .card-body h3 > .brand-logo-wrap {
 position:relative; display:inline-block; width:32px; height:32px; min-width:32px;
 flex:0 0 32px; padding:0; overflow:hidden; border-radius:8px;
 background:transparent; box-shadow:none;
}
.card .card-body h3 > .brand-logo-wrap > img.brand-logo-img {
 display:block; position:absolute; inset:0; width:100%; height:100%; min-width:0;
 max-width:none; margin:0; padding:0; border:0; border-radius:0;
 object-fit:cover; object-position:center; background:transparent; box-shadow:none;
}
/* Crop only the outer canvas; retain white details belonging to each logo.
   Disney source: 768x403, icon bounds x256 y75 w255 h256.
   Crunchyroll source: 516x537, icon bounds x35 y55 w428 h427. */
.card .card-body h3 > .title-disney { border-radius:24%; }
.card .card-body h3 > .title-disney > img.brand-logo-img {
 width:301.177%; height:157.422%; left:-100.392%; top:-29.297%; object-fit:fill;
}
.card .card-body h3 > .title-crunchyroll { border-radius:24%; }
.card .card-body h3 > .title-crunchyroll > img.brand-logo-img {
 width:120.561%; height:125.761%; left:-8.178%; top:-12.881%; object-fit:fill;
}

/* Larger platform icons and uppercase catalog headings. */
.card .card-body h3 {
 text-transform:uppercase; font-size:19px; font-weight:800;
 line-height:1.2; letter-spacing:-.02em; gap:12px;
}
.card .card-body h3 > .brand-logo-wrap,
.card .card-body h3 > .brand-youtube {
 width:48px; height:48px; min-width:48px; flex:0 0 48px;
}
.card .card-body h3 > .brand-logo-wrap { border-radius:11px; }
.card .card-body h3 > .title-disney,
.card .card-body h3 > .title-crunchyroll { border-radius:24%; }
@media(max-width:600px) {
 .card .card-body h3 {font-size:16px;gap:8px;overflow-wrap:anywhere;}
 .card .card-body h3 > .brand-logo-wrap,
 .card .card-body h3 > .brand-youtube {
  width:40px;height:40px;min-width:40px;flex-basis:40px;
 }
}

/* Reference-inspired hover: gentle icon zoom, border highlight, diagonal arrows. */
.card:has(.brand-icon) { position:relative; }
.card:has(.brand-icon)::after {
 content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
 border:1px solid rgba(129,140,248,.6);opacity:0;transition:opacity .2s ease;
}
.card .card-body h3 > .brand-icon {
 transition:transform .3s ease;transform-origin:center;will-change:transform;
}
.platform-title {flex:1;min-width:0;}
.platform-hover-arrows {
 width:14px;height:14px;flex:0 0 14px;align-self:flex-start;margin-top:3px;
 color:#a5b4fc;opacity:0;transform:scale(.85);transition:opacity .2s ease,transform .2s ease;
}
@media(hover:hover) and (pointer:fine) {
 .card:hover .card-body h3 > .brand-icon {transform:scale(1.05);}
 .card:hover .platform-hover-arrows {opacity:1;transform:scale(1);}
 .card:has(.brand-icon):hover::after {opacity:1;}
}
.card:focus-within .card-body h3 > .brand-icon {transform:scale(1.05);}
.card:focus-within .platform-hover-arrows {opacity:1;transform:scale(1);}
.card:has(.brand-icon):focus-within::after {opacity:1;}
@media(prefers-reduced-motion:reduce) {
 .card .card-body h3 > .brand-icon,.platform-hover-arrows {transition:none;transform:none!important;}
}

/* Render the full-resolution originals with a precise native SVG viewport.
   Crop once in source coordinates instead of stretching oversized CSS images. */
.card .card-body h3 > .title-disney > img.brand-logo-img,
.card .card-body h3 > .title-crunchyroll > img.brand-logo-img {
 inset:0;width:100%;height:100%;object-fit:fill;
}
.card .card-body h3 > .brand-icon {will-change:auto;}
.card .card-body h3 > .brand-logo-wrap > img.brand-logo-img {image-rendering:auto;}
@media(hover:hover) and (pointer:fine) {
 .card:hover .card-body h3 > .brand-icon {transform:scale(1.0833333333);}
}
.card:focus-within .card-body h3 > .brand-icon {transform:scale(1.0833333333);}
@media(max-width:600px) {
 .card:focus-within .card-body h3 > .brand-icon {transform:scale(1.1);}
}
@media(prefers-reduced-motion:reduce) {
 .card:hover .card-body h3 > .brand-icon,
 .card:focus-within .card-body h3 > .brand-icon {transform:none;}
}

/* Elegant charcoal theme. Layout, artwork and interactions are preserved. */
:root {
 color-scheme:dark;--bg:#09090b;--surface:#151518;--soft:#1c1c20;
 --text:#f5f5f7;--muted:#a1a1aa;--line:rgba(255,255,255,.10);
}
body {background:#09090b;color:var(--text);}
.ambient-lights {background:transparent;opacity:.23;}
.site-header {
 background:rgba(9,9,11,.93);border-bottom:1px solid var(--line);
}
.utility-bar {color:#b8b8c1;border-bottom-color:var(--line);}
.search {background:#19191e;color:#f5f5f7;border-color:#33333b;}
.search::placeholder {color:#aaaab5;opacity:1;}
.search:focus {background:#202027;border-color:#398bdf;}
.whatsapp-header {background:#25252d;border:1px solid #3a3a43;color:#fff;}
.cat-btn {background:#1c1c22;color:#bfbfc9;border:1px solid #303038;}
.cat-btn.active {background:#0071e3;color:#fff;border-color:#0071e3;}
.catalog-section {background:rgba(9,9,11,.85);border-color:var(--line);}
.collection-card {background:#151518;border-color:var(--line);box-shadow:0 12px 36px rgba(0,0,0,.22);}
.collection-card:hover {border-color:#444451;}
.catalog .card {background:#151518;border-color:#2b2b32;box-shadow:0 12px 32px rgba(0,0,0,.24);}
.catalog .card .card-body {background:linear-gradient(155deg,#19191d,#121215);color:#f5f5f7;box-shadow:none;}
.catalog .card .card-body h3,.catalog .card .new-price {color:#fff;}
.catalog .card .category-tag {background:#25252d;color:#c9c9d3;border:1px solid #383840;}
.catalog .card .btn-soldout {background:#26262e;color:#b0b0bd;}
.catalog .card .btn-buy {background:#0071e3;color:#fff;}
.catalog .card .btn-buy:hover {background:#1685f4;}
.footer {background:#0e0e11;border-top-color:var(--line);}
.footer strong {color:#f5f5f7;}
.footer p,.copyright {color:#a1a1aa;}
.section-heading h2 {color:#f5f5f7;}
.section-heading p {color:#a1a1aa;}
.eyebrow.dark,.footer a {color:#69adff;}

/* Subtle platform colors within the charcoal catalog. */
.catalog .netflix-card { --platform-glow:117,12,27; --platform-depth:#30080f; }
.catalog .disney-card { --platform-glow:0,113,163; --platform-depth:#062c40; }
.catalog .hbo-card { --platform-glow:83,48,148; --platform-depth:#211335; }
.catalog .crunchy-card { --platform-glow:192,76,10; --platform-depth:#44200b; }
.catalog .paramount-card { --platform-glow:15,74,185; --platform-depth:#0c234c; }
.catalog .prime-card { --platform-glow:0,115,190; --platform-depth:#072b45; }
.catalog .viki-card { --platform-glow:0,139,174; --platform-depth:#073443; }
.catalog .youtube-card { --platform-glow:165,16,32; --platform-depth:#360a13; }
.catalog .apple-card { --platform-glow:111,115,133; --platform-depth:#24252e; }

.catalog .card[style], .catalog .card { isolation:isolate; }
.catalog .card:has(.brand-icon) .card-body {
 background:
  radial-gradient(ellipse at 90% 5%,rgba(var(--platform-glow),.25),transparent 65%),
  linear-gradient(140deg,#151518 0%,var(--platform-depth) 62%,#0e0e11 100%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.catalog .card:has(.brand-icon)::after {
 border-color:rgba(var(--platform-glow),.8);
}
.catalog .card:has(.brand-icon):hover {
 box-shadow:0 16px 38px rgba(0,0,0,.32),0 0 24px rgba(var(--platform-glow),.12);
}

/* Richer brand gradients, with matching accents instead of leftover blue. */
.catalog .netflix-card {--platform-glow:175,13,35;--platform-depth:#510b1a;--platform-accent:#ee344e;}
.catalog .disney-card {--platform-glow:0,139,180;--platform-depth:#06425b;--platform-accent:#45c5e9;}
.catalog .hbo-card {--platform-glow:128,132,143;--platform-depth:#363940;--platform-accent:#b6bbc6;}
.catalog .crunchy-card {--platform-glow:223,88,13;--platform-depth:#632908;--platform-accent:#fb923c;}
.catalog .paramount-card {--platform-glow:30,90,220;--platform-depth:#102e70;--platform-accent:#669cff;}
.catalog .prime-card {--platform-glow:0,134,213;--platform-depth:#074268;--platform-accent:#46bdff;}
.catalog .viki-card {--platform-glow:0,160,192;--platform-depth:#064b5c;--platform-accent:#37d4e9;}
.catalog .youtube-card {--platform-glow:194,18,34;--platform-depth:#500b14;--platform-accent:#ff4556;}
.catalog .apple-card {--platform-glow:130,133,145;--platform-depth:#35363e;--platform-accent:#c1c4ce;}
.catalog .card:has(.brand-icon) .card-body {
 background:
  radial-gradient(ellipse at 90% 4%,rgba(var(--platform-glow),.42),transparent 72%),
  linear-gradient(140deg,#18181b 0%,var(--platform-depth) 56%,#111114 100%);
}
.catalog .card:has(.brand-icon) .category-tag {
 background:rgba(var(--platform-glow),.15);border-color:rgba(var(--platform-glow),.32);color:#e8e8ed;
}
.catalog .card:has(.brand-icon) .platform-hover-arrows {color:var(--platform-accent);}
.catalog .card:has(.brand-icon) .btn-buy {
 background:linear-gradient(110deg,rgba(var(--platform-glow),.92),var(--platform-depth));
 border:1px solid rgba(var(--platform-glow),.6);color:#fff;
}
.catalog .card:has(.brand-icon) .btn-buy:hover {
 background:linear-gradient(110deg,rgba(var(--platform-glow),1),var(--platform-depth));
 box-shadow:0 0 16px rgba(var(--platform-glow),.28);filter:brightness(1.13);
}

/* Netflix: deep burgundy with warm red accents, without pink highlights. */
.catalog .netflix-card {
 --platform-glow:128,12,22;
 --platform-depth:#45080e;
 --platform-accent:#b91c26;
}
.catalog .netflix-card .card-body {
 background:
  radial-gradient(ellipse at 90% 4%,rgba(120,9,17,.48),transparent 72%),
  linear-gradient(140deg,#171315 0%,#45080e 56%,#130b0d 100%);
}
.catalog .netflix-card .btn-buy {
 background:linear-gradient(110deg,#860e18,#45080e);
 border-color:#92121c;
}
.catalog .netflix-card .btn-buy:hover {
 background:linear-gradient(110deg,#99131d,#520a11);
 box-shadow:0 0 16px rgba(128,12,22,.28);
 filter:none;
}

/* DGO original cyan/orange palette, on a dark base. */
.catalog .dgo-card {--platform-glow:234,112,0;--platform-depth:#4b2509;--platform-accent:#ffa33e;}
.catalog .dgo-card .card-body {
 background:radial-gradient(ellipse at 5% 5%,rgba(0,170,223,.22),transparent 55%),
 radial-gradient(ellipse at 95% 10%,rgba(255,132,0,.36),transparent 70%),
 linear-gradient(140deg,#11161b,#45230c 62%,#111114);
}

.catalog .vix-card {--platform-glow:244,91,0;--platform-depth:#632407;--platform-accent:#ff9b42;}
.catalog .vix-card .card-body {
 background:radial-gradient(ellipse at 95% 4%,rgba(255,96,0,.42),transparent 72%),linear-gradient(140deg,#191514,#632407 56%,#130e0b);
}

/* Steel-blue ambient lighting, behind all page content. */
.ambient-lights.steel-lights {opacity:1;background:#09090b;contain:strict;}
.steel-orb {position:absolute;display:block;width:clamp(440px,55vw,820px);height:clamp(440px,55vw,820px);border-radius:50%;pointer-events:none;}
.steel-left {left:-28%;top:-15%;background:radial-gradient(circle,rgba(48,104,158,.26),rgba(26,67,109,.12) 38%,transparent 70%);animation:steelDriftLeft 30s ease-in-out infinite alternate;}
.steel-right {right:-28%;top:35%;background:radial-gradient(circle,rgba(49,96,142,.22),rgba(31,63,98,.1) 42%,transparent 70%);animation:steelDriftRight 37s ease-in-out infinite alternate;}
.steel-white {left:28%;bottom:-48%;background:radial-gradient(circle,rgba(182,205,224,.09),rgba(94,130,161,.04) 40%,transparent 70%);animation:steelDriftWhite 42s ease-in-out infinite alternate;}
.steel-particle {position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#bfd1e0;box-shadow:0 0 7px 1px rgba(146,190,224,.2);opacity:.18;animation:steelParticle var(--duration) ease-in-out var(--delay) infinite alternate;}
.catalog-section {background:rgba(9,9,11,.38);}
@keyframes steelDriftLeft {from{transform:translate(0,0) scale(.94)}to{transform:translate(12vw,18vh) scale(1.1)}}
@keyframes steelDriftRight {from{transform:translate(0,0) scale(1)}to{transform:translate(-12vw,-16vh) scale(1.12)}}
@keyframes steelDriftWhite {from{transform:translate(-5vw,0)}to{transform:translate(8vw,-18vh)}}
@keyframes steelParticle {0%{transform:translate3d(0,0,0);opacity:.1}50%{opacity:.36}100%{transform:translate3d(12px,-38px,0);opacity:.14}}
@media(max-width:760px){.steel-orb{width:540px;height:540px}.steel-left{left:-105%;top:0}.steel-right{right:-105%;top:45%}.steel-white{display:none}.steel-particle:nth-of-type(n+11){display:none}}
@media(prefers-reduced-motion:reduce){.steel-orb,.steel-particle{animation:none}.steel-particle{opacity:.16}}

/* Digital constellation: opaque black foundation and sparse cold light. */
.ambient-lights.constellation-bg{background:#08090c;opacity:1;contain:strict;}
#constellation-canvas{display:block;width:100%;height:100%;}
.cursor-light{position:absolute;left:var(--cursor-x,-1000px);top:var(--cursor-y,-1000px);width:480px;height:480px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(41,116,183,.11),rgba(30,69,108,.04) 40%,transparent 70%);opacity:0;transition:opacity .5s;}
.constellation-bg.cursor-active .cursor-light{opacity:1;}
@media(hover:none),(prefers-reduced-motion:reduce){.cursor-light{display:none}}

.catalog .movistar-card {--platform-glow:0,157,224;--platform-depth:#063d61;--platform-accent:#49c8ff;}
.catalog .movistar-card .card-body {background:radial-gradient(ellipse at 95% 4%,rgba(0,170,235,.42),transparent 72%),linear-gradient(140deg,#111a22,#063d61 56%,#0a1119);}

.catalog .universal-card {--platform-glow:185,142,0;--platform-depth:#42340a;--platform-accent:#ffcf19;}
.catalog .universal-card .card-body{background:radial-gradient(ellipse at 95% 4%,rgba(222,176,0,.38),transparent 72%),linear-gradient(140deg,#191813,#42340a 56%,#11100b);}

.catalog .digital-card{--platform-glow:26,88,202;--platform-depth:#0e255a;--platform-accent:#72aaff;}
.catalog .digital-card .card-body{background:radial-gradient(ellipse at 95% 4%,rgba(30,104,230,.40),transparent 72%),linear-gradient(140deg,#121724,#0e255a 56%,#0b101c);}

.catalog .flujo-card{--platform-glow:235,87,0;--platform-depth:#602407;--platform-accent:#ff9b42;}
.catalog .flujo-card .card-body{background:radial-gradient(ellipse at 95% 4%,rgba(255,105,0,.4),transparent 72%),linear-gradient(140deg,#1b1511,#602407 56%,#160e09);}
.card .card-body h3>.flujo-logo>img.brand-logo-img{object-fit:contain;background:#fff;}

/* Short platform description below the catalog heading. */
.card .card-body .platform-tagline{margin:8px 0 10px;color:rgba(255,255,255,.78);font-size:13px;line-height:1.45;font-weight:400;letter-spacing:0;}

/* Duración del plan junto al precio de Netflix */
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .prices{align-items:center;justify-content:space-between;gap:12px;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .plan-duration{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:6px 11px;border-radius:8px;background:#350b12;border:1px solid rgba(185,28,38,.45);color:#fff;font-size:11px;font-weight:700;letter-spacing:.8px;line-height:1.2;}

/* Características compactas del plan Netflix */
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-features{display:flex;flex-wrap:wrap;gap:5px;margin:4px 0 14px;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature{display:inline-flex;align-items:center;gap:4px;padding:5px 6px;border-radius:6px;border:1px solid rgba(255,255,255,.15);background:rgba(12,10,13,.5);color:#ece8ea;font-size:10px;font-weight:600;line-height:1.2;white-space:nowrap;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature svg{width:12px;height:12px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature:nth-child(1) svg{color:#b6adff;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature:nth-child(2) svg{color:#69d6df;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.youtube-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature:nth-child(3) svg{color:#e9c66b;}

.catalog .disney-card .plan-duration{background:#072d40;border-color:#167a9d;}

.catalog .hbo-card .plan-duration{background:#2a2b30;border-color:#656870;}

.catalog .crunchy-card .plan-duration{background:#47200d;border-color:#b95822;}

.catalog .paramount-card .plan-duration{background:#0b234e;border-color:#315fb1;}

.catalog .prime-card .plan-duration{background:#082c41;border-color:#217ca4;}

.catalog .viki-card .plan-duration{background:#08343e;border-color:#2292aa;}

.catalog .youtube-card .plan-duration{background:#400d14;border-color:#9d2332;}
.card .card-body h3>.youtube-logo-uploaded>img.brand-logo-img{object-fit:contain;background:transparent;border-radius:0;}

/* YouTube: beneficios arriba y garantía debajo. */
.catalog .youtube-card .netflix-features{display:grid;grid-template-columns:max-content max-content;gap:6px;}
.catalog .youtube-card .netflix-feature:last-child{grid-column:1 / -1;justify-self:start;}
.catalog .youtube-card .netflix-feature:last-child svg{color:#e9c66b;}

/* El degradado de YouTube cubre la tarjeta completa. */
.catalog .youtube-card{display:flex;flex-direction:column;background:#500b14;}
.catalog .youtube-card>img{flex:none;}
.catalog .youtube-card .card-body{flex:1;display:flex;flex-direction:column;background:radial-gradient(ellipse at 90% 4%,rgba(194,18,34,.42),transparent 72%),linear-gradient(140deg,#18181b 0%,#500b14 56%,#28090f 100%);}
.catalog .youtube-card .netflix-features{grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;margin-top:10px;gap:7px;}
.catalog .youtube-card .netflix-feature{justify-content:center;padding:7px 4px;background:rgba(104,12,25,.5);border-color:rgba(255,137,150,.25);}
.catalog .youtube-card .netflix-feature:last-child{justify-self:stretch;}
.catalog .youtube-card .btn-buy{margin-top:auto;}

/* Formato unificado de beneficios: Netflix hasta Viki. */
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card){display:flex;flex-direction:column;background:var(--platform-depth);}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card)>img{flex:none;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .card-body{flex:1;display:flex;flex-direction:column;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-features{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;margin-top:10px;gap:7px;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature{justify-content:center;padding:7px 4px;background:rgba(var(--platform-glow),.23);border-color:rgba(var(--platform-glow),.5);}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature:last-child{grid-column:1 / -1;justify-self:stretch;}
.catalog :is(.netflix-card,.disney-card,.hbo-card,.crunchy-card,.paramount-card,.prime-card,.viki-card,.apple-card,.dgo-card,.vix-card,.movistar-card,.universal-card,.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .btn-buy{margin-top:auto;}

.catalog .apple-card .plan-duration{background:#292a30;border-color:#646671;}

.catalog .dgo-card .plan-duration{background:#093145;border-color:#287ea4;}

.catalog .vix-card .plan-duration{background:#442309;border-color:#aa6221;}

.catalog .movistar-card .plan-duration{background:#08344f;border-color:#237eab;}

.catalog .universal-card .plan-duration{background:#373009;border-color:#998027;}

.catalog .digital-card .plan-duration{background:#10234a;border-color:#3264ae;}
.catalog .flujo-card .plan-duration{background:#48200e;border-color:#b35e24;}
.catalog :is(.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-features{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);}
.catalog :is(.digital-card,.flujo-card,.spotify-card,.chatgpt-card,.canva-card,.capcut-card,.office-card) .netflix-feature{white-space:normal;line-height:1.35;text-align:center;min-height:34px;}

.catalog .spotify-card{--platform-glow:20,164,76;--platform-depth:#073e20;--platform-accent:#1ed760;}
.catalog .spotify-card .card-body{background:radial-gradient(ellipse at 95% 4%,rgba(29,185,84,.42),transparent 72%),linear-gradient(140deg,#121b16,#073e20 56%,#0a1710);}
.catalog .spotify-card .plan-duration{background:#0c351d;border-color:#24894b;}
.card .card-body h3>.spotify-logo>img.brand-logo-img{object-fit:cover;}

/* Alinear precio y acción en la base de cada tarjeta de plataforma. */
.catalog .card:has(.netflix-features) .prices{margin-top:auto;padding-top:8px;}
.catalog .card:has(.netflix-features) .btn-buy{margin-top:0;}
.catalog .spotify-card .netflix-features{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}

/* ChatGPT: blanco y verde menta inspirado en el flyer. */
.catalog .chatgpt-card{--platform-glow:25,177,120;--platform-depth:#cceee0;--platform-accent:#111;border-color:#83bfa5;}
.catalog .chatgpt-card .card-body{background:radial-gradient(ellipse at 100% 0%,rgba(255,255,255,.95),transparent 72%),linear-gradient(140deg,#fff 0%,#e7f8ef 48%,#a5e6ca 100%);color:#111;}
.catalog .chatgpt-card .card-body h3,.catalog .chatgpt-card .new-price{color:#000;}
.catalog .chatgpt-card .card-body .platform-tagline{color:#303036;}
.catalog .chatgpt-card .netflix-feature{background:rgba(255,255,255,.85);border-color:#8abfa7;color:#111;white-space:normal;line-height:1.35;text-align:center;min-height:34px;}
.catalog .chatgpt-card .netflix-feature:nth-child(n) svg{color:#111;}
.catalog .chatgpt-card .netflix-features{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.catalog .chatgpt-card .plan-duration{background:#fff;border-color:#80b69d;color:#111;}
.catalog .chatgpt-card .btn-buy{background:linear-gradient(110deg,#29292e,#09090b);border-color:#111;color:#fff;}
.catalog .chatgpt-card:has(.brand-icon) .btn-buy:hover{background:linear-gradient(110deg,#44444a,#151518);box-shadow:0 0 16px #0002;}
.card .card-body h3>.chatgpt-logo>img.brand-logo-img{object-fit:contain;background:#fff;}


.catalog .canva-card{--platform-glow:60,171,233;--platform-depth:#1b1a55;--platform-accent:#8b39ff;border-color:#5d64c7;}
.catalog .canva-card .card-body{background:radial-gradient(circle at 100% 0%,rgba(34,215,229,.40),transparent 45%),radial-gradient(circle at 0% 100%,rgba(146,67,255,.30),transparent 38%),linear-gradient(145deg,#1f2348 0%,#178ec9 15%,#14bfd1 35%,#3f74f3 62%,#6a3cff 100%);color:#fff;}
.catalog .canva-card .card-body h3,.catalog .canva-card .new-price{color:#fff;}
.catalog .canva-card .platform-tagline{color:rgba(255,255,255,.93);}
.catalog .canva-card .netflix-feature{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28);color:#fff;}
.catalog .canva-card .plan-duration{background:#1e3e8b;border-color:#6f6cff;color:#fff;}
.catalog .canva-card .btn-buy{background:linear-gradient(110deg,#0d213f,#361a7d);border-color:#8c77ff;color:#fff;}
.catalog .canva-card .btn-buy:hover{background:linear-gradient(110deg,#14365f,#4a25a5);box-shadow:0 0 16px rgba(90,117,255,.22);}
.card .card-body h3>.canva-logo>img.brand-logo-img{object-fit:cover;background:#fff;}
.catalog .canva-card .card-stock{color:#f8fbff;}

/* Canva: mismos dos beneficios alineados que las tarjetas anteriores. */
.catalog .canva-card .netflix-features{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  width:100%;
  margin-top:10px;
}
.catalog .canva-card .netflix-feature{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:0;
  min-height:34px;
  padding:7px 5px;
  line-height:1.2;
  font-size:10px;
  white-space:nowrap;
  text-align:center;
}
.catalog .canva-card .netflix-feature:last-child{
  grid-column:1 / -1;
  justify-self:stretch;
}
.catalog .canva-card .netflix-feature svg{
  width:12px;
  height:12px;
  flex:none;
}

/* Catalogue-first storefront: compact heading, no promotional banner. */
#catalogo{scroll-margin-top:150px}
#catalogo>.section-shell{padding:28px 24px 52px}
.catalog-intro{padding:0 0 22px;margin:0 0 6px;border-bottom:1px solid #ffffff16}
.catalog-kicker{display:block;margin-bottom:8px;color:#8c9bb3;font-size:10px;font-weight:700;letter-spacing:.17em}
.catalog-intro h1{margin:0;font-size:clamp(24px,3vw,34px);line-height:1.18;letter-spacing:-.035em;color:#fff}
.catalog-intro h1 span{color:#b2b7c2;font-weight:500}
.catalog-intro p{margin-top:9px;color:#959cab;font-size:14px;line-height:1.5}
#catalogo .catalog{padding-top:16px}
@media(max-width:760px){#catalogo>.section-shell{padding:20px 14px 38px}.catalog-intro{padding-bottom:17px}.catalog-intro h1{font-size:24px}.catalog-intro h1 span{display:block;margin-top:3px}.catalog-intro p{font-size:12px;margin-top:7px}.catalog-kicker{font-size:9px;margin-bottom:7px}#catalogo .catalog{padding-top:12px}}

/* Availability above each flyer; retain the divider above price. */
.catalog .platform-heading{position:relative;display:block;width:100%}
.catalog .platform-heading h3{min-width:0;margin:0;width:100%}
.catalog .platform-heading .card-stock{position:absolute;right:0;top:-13px;white-space:nowrap;background:none;border:0;padding:0;text-transform:none;line-height:12px}
.catalog .chatgpt-card .card-stock{color:#173d2d}
.catalog .card-stock{display:inline-flex;align-items:center;gap:6px;font-size:10px;line-height:1.4;font-weight:600;color:#e9e9ee;letter-spacing:.01em}
.catalog .card-stock-dot{width:6px;height:6px;flex:none;border-radius:50%;background:#46d887}
.catalog .card-stock--soldout .card-stock-dot{background:#ff5b65}
.catalog .card-stock--unknown .card-stock-dot{background:#d3b369}
.catalog .plan-divider{height:1px;flex-shrink:0;background:#ffffff1c;margin:13px 0 10px;width:100%}
.catalog .chatgpt-card .plan-divider{background:#1d533529}

/* Canva: mismos dos beneficios alineados que las tarjetas anteriores. */
.catalog .capcut-card .netflix-features{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  width:100%;
  margin-top:10px;
}
.catalog .capcut-card .netflix-feature{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:0;
  min-height:34px;
  padding:7px 5px;
  line-height:1.2;
  font-size:10px;
  white-space:nowrap;
  text-align:center;
}
.catalog .capcut-card .netflix-feature:last-child{
  grid-column:1 / -1;
  justify-self:stretch;
}
.catalog .capcut-card .netflix-feature svg{
  width:12px;
  height:12px;
  flex:none;
}


.catalog .capcut-card{--platform-glow:157,133,190;--platform-depth:#251e31;--platform-accent:#c9b9dd;display:flex;flex-direction:column}
.catalog .capcut-card .card-body{flex:1;display:flex;flex-direction:column;background:radial-gradient(ellipse at 100% 0%,#9870c844,transparent 70%),linear-gradient(145deg,#202024,#33273e 60%,#131216);color:#fff}
.catalog .capcut-card .plan-duration{background:#27232e;border-color:#b49bc555;color:#fff}
.catalog .capcut-card .btn-buy{background:linear-gradient(110deg,#25232b,#483851);border:1px solid #ae98c066;color:#fff}
.catalog .capcut-card .btn-buy:hover{background:linear-gradient(110deg,#35303d,#5a4467)}
.card .card-body h3>.capcut-logo{background:#fff;overflow:hidden}
.card .card-body h3>.capcut-logo>img.brand-logo-img{position:absolute;inset:-24%;width:148%;height:148%;max-width:none;object-fit:contain}

/* Canva: mismos dos beneficios alineados que las tarjetas anteriores. */
.catalog .office-card .netflix-features{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  width:100%;
  margin-top:10px;
}
.catalog .office-card .netflix-feature{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:0;
  min-height:34px;
  padding:7px 5px;
  line-height:1.2;
  font-size:10px;
  white-space:nowrap;
  text-align:center;
}
.catalog .office-card .netflix-feature:last-child{
  grid-column:1 / -1;
  justify-self:stretch;
}
.catalog .office-card .netflix-feature svg{
  width:12px;
  height:12px;
  flex:none;
}


.catalog .office-card{--platform-glow:235,90,20;--platform-depth:#43200e;--platform-accent:#ffa05d}
.catalog .office-card .card-body{background:radial-gradient(ellipse at 100% 0%,#ed691e55,transparent 70%),linear-gradient(145deg,#201610,#53250f 60%,#1b120e);color:#fff}
.catalog .office-card .netflix-feature{white-space:normal;min-height:38px}.catalog .office-card .plan-duration{background:#3e210f;border-color:#ee863c70;color:#fff}.catalog .office-card .btn-buy{background:linear-gradient(110deg,#3e1d0e,#81350e);border-color:#ed8d4b;color:#fff}.card .card-body h3>.office-logo>img.brand-logo-img{object-fit:contain}
