:root{color-scheme:dark;font-family:Inter,system-ui,Arial,sans-serif;background:#080f20;color:#eaf1ff}*{box-sizing:border-box}body{margin:0}a{color:#8cb8ff;text-decoration:none}.wrap{max-width:1100px;margin:auto;padding:24px}header{background:#0e1c37;border-bottom:1px solid #263958}nav{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.logo{font-size:22px;font-weight:900;color:#fff}.logo span{color:#4d9fff}nav a{margin-left:16px}h1{font-size:clamp(30px,5vw,48px);margin:8px 0}h2{font-size:24px}.hero{padding:45px 25px;border-radius:20px;background:linear-gradient(115deg,#163b86,#0e1b37);margin:24px 0}.muted{color:#a8bbd8}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:15px}.card{background:#111e37;border:1px solid #263b60;border-radius:15px;padding:18px}.card h3{margin:8px 0}.tag{display:inline-block;border-radius:30px;background:#234b8d;padding:5px 10px;color:#cce1ff;font-size:12px}button,.btn{display:inline-block;background:#2976ed;color:white;padding:11px 16px;border:0;border-radius:10px;font-weight:700;cursor:pointer}button:hover,.btn:hover{background:#4392ff;color:#fff}input,select,textarea{width:100%;background:#0a1429;color:#fff;border:1px solid #43567c;border-radius:9px;padding:12px;margin:7px 0 14px}label{display:block;font-weight:600}.error{background:#4c1c2c;padding:14px;border-radius:10px}.ok{background:#163d36;padding:14px;border-radius:10px}.notice{background:#182a47;padding:14px;border-radius:10px}table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}td,th{padding:12px;text-align:left;border-bottom:1px solid #2d3e59;white-space:nowrap}.split{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:720px){.split{grid-template-columns:1fr}.wrap{padding:15px}nav a{margin-left:8px}}.small{font-size:13px}.price{font-size:24px;font-weight:800;color:#8ec1ff}

/* Tarjetas con imagen del proveedor y respaldo visual */
.product-card{overflow:hidden;padding:0 0 18px;display:flex;flex-direction:column}
.product-card h3,.product-card p,.product-card .btn{margin-left:16px;margin-right:16px}
.product-card .btn{align-self:flex-start;margin-top:auto}
.product-media{height:148px;background:linear-gradient(130deg,#1c438c,#132440 65%,#10192e);display:grid;place-items:center;position:relative;overflow:hidden}
.product-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:10px;background:#12213c}
.product-fallback{display:grid;place-items:center;width:76px;height:76px;border-radius:20px;background:#2b65d0;color:white;font-size:30px;font-weight:900;box-shadow:0 12px 30px #0005}

/* Identidad visual de respaldo por marca; no son logos oficiales */
.product-fallback{width:auto;max-width:92%;padding:0 14px;min-width:76px;font-size:clamp(14px,1.5vw,23px);text-align:center;letter-spacing:.4px;overflow-wrap:anywhere}
.brand-netflix{background:linear-gradient(130deg,#320000,#070707)}.brand-netflix .product-fallback{background:#e50914}
.brand-steam{background:linear-gradient(135deg,#1b2838,#0b4a73)}.brand-steam .product-fallback{background:#174d75}
.brand-amazon{background:linear-gradient(135deg,#202a38,#111827)}.brand-amazon .product-fallback{background:#ff9900;color:#17212e}
.brand-apple{background:linear-gradient(135deg,#252735,#0c0d12)}.brand-apple .product-fallback{background:#eeeeef;color:#171717}
.brand-psn{background:linear-gradient(135deg,#0045a9,#071b52)}.brand-psn .product-fallback{background:#1261d9}
.brand-pubg{background:linear-gradient(135deg,#574118,#171d26)}.brand-pubg .product-fallback{background:#e7a526;color:#161b21}
.brand-razer{background:linear-gradient(135deg,#102617,#080f0a)}.brand-razer .product-fallback{background:#37b24d;color:#061008}
.brand-roblox{background:linear-gradient(135deg,#333b48,#111827)}.brand-roblox .product-fallback{background:#e7e7e7;color:#151515}
.brand-freefire{background:linear-gradient(135deg,#5d2609,#161a23)}.brand-freefire .product-fallback{background:#e98b24;color:#1b1b1b}
.brand-xbox{background:linear-gradient(135deg,#124b20,#07190c)}.brand-xbox .product-fallback{background:#107c10}

/* Logotipos centrados y visibles en tarjetas */
.product-card .product-media{min-height:120px;border-radius:12px;margin-bottom:12px}
.product-card .product-media img{width:100%;height:100%;object-fit:contain;padding:24px;background:transparent}
.product-card .product-fallback{font-size:20px}

/* Catálogo por marca, imagen contenida y variantes desplegables */
#items{grid-template-columns:repeat(auto-fill,minmax(225px,1fr));align-items:stretch}#items .cf-brand{display:flex;flex-direction:column;min-height:270px;padding:17px;gap:8px;overflow:hidden}#items .cf-brand h3{font-size:18px;line-height:1.35;margin:2px 0;min-height:24px}#items .cf-brand p{margin:0 0 8px}.cf-media{height:106px;width:100%;display:flex;justify-content:center;align-items:center;background:#0a1730;border-radius:12px}.cf-media img{width:72px;height:72px;object-fit:contain;border-radius:12px}.cf-monogram{display:grid;place-items:center;width:72px;height:72px;border-radius:15px;background:#224b89;font-weight:900;font-size:26px;color:white}.cf-options{margin-top:auto}.cf-options summary{list-style:none;text-align:center}.cf-options summary::-webkit-details-marker{display:none}.cf-options[open]{margin-top:10px}.cf-option{display:block;padding:11px 8px;border-bottom:1px solid #334564;color:#dce9ff;font-size:13px}.cf-option:hover{background:#1b3458}.cf-options[open] summary{margin-bottom:8px}@media(max-width:600px){#items{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#items .cf-brand{padding:11px;min-height:240px}.cf-media{height:80px}.cf-media img,.cf-monogram{width:58px;height:58px}#items .cf-brand h3{font-size:15px}}

/* Corrección de catálogo: imágenes contenidas y tarjetas consistentes */
#items .cf-brand{min-height:250px;gap:10px}#items .cf-media{height:120px;flex:0 0 120px;background:linear-gradient(140deg,#15294b,#0b1830);overflow:hidden}#items .cf-media img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;padding:12px;border-radius:0;background:transparent}#items .cf-monogram{width:58px;height:58px;font-size:27px;background:#1e3760}#items .cf-brand h3{min-height:unset;margin:0;overflow-wrap:anywhere}#items .cf-brand .cf-options{margin-top:auto}#items .cf-option{overflow-wrap:anywhere}@media(max-width:600px){#items .cf-media{height:92px;flex-basis:92px}#items .cf-brand{min-height:230px}}

/* 2026-10-24 · Catálogo estilo G2Bulk: portada grande, nombre abajo, opciones desplegables */
.g2-head{margin:18px 0 6px}.g2-head h1{margin:4px 0}
.g2-tabs{display:flex;gap:8px;margin:14px 0 4px;flex-wrap:wrap}.g2-tabs a{padding:9px 14px;border-radius:999px;background:#111e37;border:1px solid #263b60;color:#cfe0ff;font-weight:800;font-size:14px}.g2-tabs a.on{background:linear-gradient(90deg,#2976ed,#6d4aff);border-color:transparent;color:#fff}
.g2-search{max-width:460px;margin-top:12px;border-radius:12px;padding:13px 14px}
.g2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin:10px 0 30px;align-items:start}
.g2-card{display:flex;flex-direction:column;background:#0f1b33;border:1px solid #22355a;border-radius:18px;overflow:hidden;color:#eaf1ff;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
a.g2-card:hover,.g2-group:hover{transform:translateY(-4px);border-color:#3f6fd1;box-shadow:0 16px 34px rgba(0,0,0,.45),0 0 0 1px rgba(77,159,255,.25)}
.g2-media{position:relative;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden}
.g2-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
a.g2-card:hover .g2-media img,.g2-group:hover .g2-media img{transform:scale(1.06)}
.g2-media:after{content:"";position:absolute;inset:auto 0 0 0;height:38%;background:linear-gradient(transparent,rgba(8,15,32,.55));pointer-events:none}
.g2-media:not(.has-img){box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.g2-mono{position:relative;z-index:1;font-size:44px;font-weight:900;color:#fff;letter-spacing:1px;text-shadow:0 6px 18px rgba(0,0,0,.35)}
.g2-body{padding:12px 13px 14px;display:flex;flex-direction:column;gap:3px}
.g2-name{font-size:15px;line-height:1.3;overflow-wrap:anywhere}.g2-sub{color:#93a9cc;font-size:12px}
.g2-opts{margin-top:8px}.g2-opts summary{list-style:none;cursor:pointer;text-align:center;padding:9px;border-radius:10px;background:#1c3a72;color:#fff;font-weight:800;font-size:13px}.g2-opts summary::-webkit-details-marker{display:none}.g2-opts[open] summary{background:#2976ed;margin-bottom:6px}
.g2-opt{display:flex;justify-content:space-between;gap:8px;padding:9px 6px;border-bottom:1px solid #22355a;color:#dce9ff;font-size:13px}.g2-opt b{color:#8ec1ff;white-space:nowrap}.g2-opt:hover{background:#16294b}
.g2-loading{grid-column:1/-1;display:flex;align-items:center;gap:10px;color:#a8bbd8}.g2-loading i{width:18px;height:18px;border-radius:50%;border:3px solid #263b60;border-top-color:#4d9fff;animation:g2spin .8s linear infinite}@keyframes g2spin{to{transform:rotate(360deg)}}
.g2-buyhead{display:flex;align-items:center;gap:16px;margin:18px 0}.g2-buyhead img{width:92px;height:92px;border-radius:18px;object-fit:cover;box-shadow:0 10px 26px rgba(0,0,0,.4)}.g2-buyhead h1{margin:6px 0 0;font-size:clamp(24px,4vw,36px)}
@media(max-width:600px){.g2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.g2-name{font-size:13px}.g2-mono{font-size:34px}.g2-body{padding:10px}}
.g2-brand{flex-direction:column;gap:10px;place-content:center}.g2-bname{position:relative;z-index:1;font-size:clamp(20px,2.4vw,28px);font-weight:900;letter-spacing:.3px;text-align:center;padding:0 10px;line-height:1.1}.g2-region{position:relative;z-index:1;font-size:12px;font-weight:800;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(4px)}
/* Imagen de marca de G2Bulk encima del respaldo; la región sigue visible como etiqueta */
.g2-brand.has-img .g2-bname{display:none}.g2-brand.has-img .g2-region{position:absolute;left:10px;bottom:10px;z-index:2;background:rgba(8,15,32,.72)}
/* 2026-10-24 · Una tarjeta por marca + ventana de país y monto (estilo G2Bulk) */
button.g2-card{font:inherit;text-align:left;padding:0;cursor:pointer}
.g2-cta{margin-top:8px;text-align:center;padding:9px;border-radius:10px;background:#1c3a72;color:#fff;font-weight:800;font-size:13px}.g2-group:hover .g2-cta{background:#2976ed}
.g2-modal{position:fixed;inset:0;z-index:50;display:none;align-items:flex-start;justify-content:center;padding:40px 14px;background:rgba(3,7,18,.78);backdrop-filter:blur(4px);overflow:auto}.g2-modal.show{display:flex}
.g2-modal-card{position:relative;width:min(760px,100%);background:#0c1630;border:1px solid #263b60;border-radius:20px;padding:20px;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.g2-x{position:absolute;right:12px;top:10px;width:36px;height:36px;padding:0;border-radius:50%;background:#16264a;font-size:22px;line-height:1}
.g2-mhead{display:flex;gap:14px;align-items:center;margin-bottom:14px;padding-right:40px}.g2-mhead img{width:72px;height:72px;border-radius:14px;object-fit:cover}.g2-mhead h2{margin:0;color:#ffcf33}
.g2-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.g2-chip{padding:7px 12px;border-radius:999px;background:#111e37;border:1px solid #2a4069;color:#d6e4ff;font-size:13px;font-weight:800}.g2-chip:hover{background:#1b2f55}.g2-chip.on{background:#ffcf33;border-color:#ffcf33;color:#1a1300}
.g2-msearch{max-width:360px;border-radius:12px}
.g2-rows{display:grid;gap:8px}.g2-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 14px;border-radius:12px;background:#0f1d3a;border:1px solid #22355a;color:#eaf1ff}.g2-row:hover{border-color:#4d9fff;background:#13264a}
.g2-rname{font-weight:700}.g2-rright{display:flex;align-items:center;gap:12px;white-space:nowrap}.g2-stock{color:#34d399;font-size:12px;font-weight:700}.g2-row b{color:#ffcf33;font-size:15px}
@media(max-width:600px){.g2-modal{padding:12px 8px}.g2-modal-card{padding:14px}.g2-row{flex-direction:column;align-items:flex-start}.g2-rright{width:100%;justify-content:space-between}}