/* fonts */
/* Outfit (variable, 100–900) — self-hosted from Google Fonts */
@font-face{font-family:"Outfit";font-style:normal;font-weight:100 900;font-display:swap;src:url("../assets/fonts/Outfit-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Outfit";font-style:normal;font-weight:100 900;font-display:swap;src:url("../assets/fonts/Outfit-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* colors */
:root{
/* Base palette — exact values from lading-page.fig */
--hg-night:#0B0912;          /* rgb(11,9,18)  page background, dark button */
--hg-night-2:#14111F;        /* rgb(20,17,31) cards, field shells */
--hg-violet:#7B2FE0;         /* rgb(123,47,224) hero band, search submit */
--hg-violet-bright:#8B3DFF;  /* rgb(139,61,255) category chip */
--hg-violet-deep:#4A1A9A;    /* rgb(74,26,154) category chip, wave */
--hg-blue:#1A6BEA;           /* rgb(26,107,234) primary CTA */
--hg-navy:#0F3A8C;           /* rgb(15,58,140) CTA banner, wave, shadow tint */
--hg-sky:#7CC8FF;            /* rgb(124,200,255) accent text, dots, rings */
--hg-yellow:#FFD21F;         /* rgb(255,210,31) icon accent, chip */
--hg-pink:#FF4FD8;           /* rgb(255,79,216) "Nuevo" badge, chip */
--hg-cyan:#22D3EE;           /* rgb(34,211,238) chip, status dot */
--hg-orange:#FF5A36;         /* rgb(255,90,54) "Oferta" badge */
--hg-amber:#F5A50B;          /* rgb(245,165,11) "Últimas unidades" dot */
--hg-white:#FFFFFF;
--hg-lilac-gray:#B9B2CF;     /* rgb(185,178,207) card description */
--hg-gray-400:#9CA3AF;       /* rgb(156,163,175) placeholder */

/* Alpha whites */
--hg-white-90:rgba(255,255,255,0.9);
--hg-white-85:rgba(255,255,255,0.85);
--hg-white-80:rgba(255,255,255,0.8);
--hg-white-30:rgba(255,255,255,0.3);
--hg-white-15:rgba(255,255,255,0.15);
--hg-white-10:rgba(255,255,255,0.1);
--hg-white-06:rgba(255,255,255,0.06);
--hg-night-25:rgba(11,9,18,0.25);

/* Semantic aliases */
--surface-page:var(--hg-night);
--surface-card:var(--hg-night-2);
--surface-field:var(--hg-night-2);
--surface-hero:var(--hg-violet);
--surface-banner:var(--hg-navy);
--surface-glass:var(--hg-night-25);
--text-strong:var(--hg-white);
--text-body:var(--hg-white-90);
--text-soft:var(--hg-white-85);
--text-muted:var(--hg-white-80);
--text-card-body:var(--hg-lilac-gray);
--text-placeholder:var(--hg-gray-400);
--text-accent:var(--hg-sky);
--text-on-light:var(--hg-night);
--text-on-white-cta:var(--hg-navy);
--action-primary:var(--hg-blue);
--action-dark:var(--hg-night);
--action-light:var(--hg-white);
--action-submit:var(--hg-violet);
--border-hairline:var(--hg-white-15);
--border-card:var(--hg-white-10);
--focus-ring:var(--hg-sky);
--energy-fire:#FF5A36;       /* TCG energy accents (fuego/agua/planta/rayo) */
--energy-water:#7CC8FF;
--energy-grass:#3FCB73;
--energy-lightning:#FFD21F;
--status-available:#3FCB73;   /* Disponible */
--status-preorder:#FFD21F;    /* Por encargo */
--status-soldout:#8C8799;     /* Agotado */
--whatsapp-green:#25D366;    /* intentional addition: floating WhatsApp button only */
}
/* typography */
:root{
--font-sans:"Outfit",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */
/* Type scale — exact sizes/line-heights from the Figma frames */
--fs-display:72px;--lh-display:72px;--ls-display:-1.8px;   /* hero H1, Bold */
--fs-h2:30px;--lh-h2:36px;                                /* CTA banner title, Bold */
--fs-h3:24px;--lh-h3:32px;                                /* product card title, SemiBold */
--fs-figure:20px;--lh-figure:28px;                        /* emphasised figure, Bold */
--fs-lead:17px;--lh-lead:27.625px;                        /* hero paragraph, Regular */
--fs-body-lg:16px;--lh-body-lg:24px;
--fs-ui:15px;--lh-ui:22.5px;                              /* buttons, nav, labels */
--fs-body:14px;--lh-body:19.25px;                         /* card description */
--fs-meta:14px;--lh-meta:20px;
--fs-badge:12px;--lh-badge:16px;--ls-badge:0.3px;         /* badge, Bold */
--fs-legal:12px;--lh-legal:16px;
}
.hg-display{font:var(--fw-bold) var(--fs-display)/var(--lh-display) var(--font-sans);letter-spacing:var(--ls-display)}
.hg-h2{font:var(--fw-bold) var(--fs-h2)/var(--lh-h2) var(--font-sans)}
.hg-h3{font:var(--fw-semibold) var(--fs-h3)/var(--lh-h3) var(--font-sans)}
.hg-lead{font:var(--fw-regular) var(--fs-lead)/var(--lh-lead) var(--font-sans)}
.hg-ui{font:var(--fw-semibold) var(--fs-ui)/var(--lh-ui) var(--font-sans)}
.hg-label{font:var(--fw-medium) var(--fs-ui)/var(--lh-ui) var(--font-sans)}
.hg-body{font:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-sans)}
.hg-badge{font:var(--fw-bold) var(--fs-badge)/var(--lh-badge) var(--font-sans);letter-spacing:var(--ls-badge)}
.hg-legal{font:var(--fw-regular) var(--fs-legal)/var(--lh-legal) var(--font-sans)}
/* spacing */
:root{
/* Spacing observed in the Figma layout */
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:28px;--space-8:32px;--space-10:40px;--space-12:48px;
--gutter:24px;                 /* page side padding */
--container-max:1066.67px;     /* content width inside 1114.67 frame */
--chip-gap:10px;               /* category chips (46px pitch − 36px) */
/* Radii */
--radius-badge:6px;--radius-link:8px;--radius-control:12px;--radius-logo:16px;--radius-card:28px;--radius-hero:50px;--radius-pill:9999px;
/* Sizes */
--size-control-lg:48px;--size-control-md:44px;--size-chip:36px;--size-field:56px;--size-logo:96px;
}
/* effects */
:root{
--shadow-cta-blue:0px 8px 24px 0px rgba(15,58,140,0.45);
--shadow-cta-blue-sm:0px 6px 18px 0px rgba(15,58,140,0.45);
--shadow-cta-dark:0px 8px 24px 0px rgba(11,9,18,0.35);
--shadow-logo:0px 10px 30px 0px rgba(11,9,18,0.45),0px 0px 0px 2px rgba(124,200,255,0.5);
--ring-chip:0px 0px 0px 2px rgba(255,255,255,0.3);
--ring-chip-active:0px 0px 0px 2px #14111F,0px 0px 0px 4px #FFFFFF;
--hairline-field:inset 0 0 0 0.667px rgba(255,255,255,0.15); /* @kind shadow */
--hairline-card:inset 0 0 0 0.667px rgba(255,255,255,0.1); /* @kind shadow */
--motif-stroke:rgba(255,255,255,0.06);
--ease-out:cubic-bezier(.2,.7,.2,1); /* @kind other */
--dur-fast:150ms; /* @kind other */
--dur-base:220ms; /* @kind other */
}
/* base */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-strong);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}
a{color:var(--hg-sky);text-decoration:none}
a:hover{color:var(--hg-white)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:0ms!important;animation-duration:0ms!important}}
/* HGPLAYZSTORE — landing (static). Tokens come from styles.css */
html{scroll-behavior:smooth;scroll-padding-top:20px}
body{overflow-x:hidden;background-color:var(--hg-night);background-image:var(--sparkle),radial-gradient(900px 600px at 85% 40%,rgba(139,61,255,.08),transparent 70%),radial-gradient(700px 500px at 5% 75%,rgba(124,200,255,.06),transparent 70%);background-size:260px 260px,100% 100%,100% 100%;background-attachment:scroll}
:root{--sparkle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='18' cy='26' r='.9' opacity='.35'/%3E%3Ccircle cx='92' cy='64' r='.6' opacity='.25'/%3E%3Ccircle cx='170' cy='18' r='1.1' opacity='.3'/%3E%3Ccircle cx='236' cy='92' r='.7' opacity='.22'/%3E%3Ccircle cx='54' cy='150' r='.8' opacity='.28'/%3E%3Ccircle cx='132' cy='188' r='1.2' opacity='.2'/%3E%3Ccircle cx='210' cy='226' r='.6' opacity='.3'/%3E%3Ccircle cx='12' cy='238' r='.7' opacity='.18'/%3E%3Ccircle cx='190' cy='132' r='.5' opacity='.3'/%3E%3C/g%3E%3Cpath d='M120 108l1.2 3.6 3.6 1.2-3.6 1.2-1.2 3.6-1.2-3.6-3.6-1.2 3.6-1.2z' fill='%237CC8FF' opacity='.28'/%3E%3C/svg%3E")}
[data-energy=fire]{--e:var(--energy-fire);--e2:#FFC2B0;--ed:#9C2C14}
[data-energy=water]{--e:var(--energy-water);--e2:#E0F2FF;--ed:#1A6BEA}
[data-energy=grass]{--e:var(--energy-grass);--e2:#C4F3D5;--ed:#1B7040}
[data-energy=lightning]{--e:var(--energy-lightning);--e2:#FFF4BF;--ed:#A67C00}
[data-energy=all]{--e:#FFFFFF;--e2:#FFFFFF;--ed:#B9B2CF}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;z-index:100;padding:10px 16px;border-radius:12px;background:#fff;color:var(--hg-night);font:600 15px/22px var(--font-sans)}.skip:focus{top:16px}
.wrap{max-width:1114.67px;margin:0 auto;padding:0 24px}
.ico{width:20px;height:20px;flex-shrink:0;display:block}
/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 24px;border:0;border-radius:12px;font:600 15px/22.5px var(--font-sans);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}
.btn:active{transform:translateY(1px) scale(.98)}
.btn-primary{background:var(--hg-blue);color:#fff;box-shadow:var(--shadow-cta-blue)}.btn-primary:hover{background:#2B79F0;color:#fff}
.btn-dark{background:var(--hg-night);color:#fff;box-shadow:var(--shadow-cta-dark)}.btn-dark:hover{background:#1A1626;color:#fff}
.btn-light{background:#fff;color:var(--hg-navy)}.btn-light:hover{background:#EAF4FF;color:var(--hg-navy)}
.btn-ghost{background:rgba(255,255,255,.06);color:#fff;box-shadow:var(--hairline-field)}.btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.btn-sm{height:44px;padding:0 18px}
.btn-block{display:flex;width:100%}
/* Status */
.status{display:inline-flex;align-items:center;gap:6px;font:600 12px/16px var(--font-sans);letter-spacing:.2px;color:var(--status-available);white-space:nowrap}
.status::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 22%,transparent)}
.status[data-s=encargo]{color:var(--status-preorder)}.status[data-s=agotado]{color:var(--status-soldout)}
/* Hero */
.hero{position:relative;overflow:hidden;background:var(--hg-violet);border-radius:0 0 50px 50px;padding:0 24px 104px}
.hero::before{content:"";position:absolute;inset:0;background-image:var(--sparkle),conic-gradient(from 200deg at 78% 30%,rgba(255,210,31,.0),rgba(255,210,31,.10),rgba(124,200,255,.12),rgba(255,79,216,.08),rgba(255,210,31,0) 60%);background-size:260px 260px,100% 100%;mix-blend-mode:screen;opacity:.9;pointer-events:none}
.hero>*{position:relative}
.hero-notch{position:absolute!important;left:calc(50% - 10px);bottom:-10px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--hg-violet)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;max-width:1066.67px;margin:0 auto;padding-top:20px;z-index:5}
.nav-links{display:flex;gap:6px;flex-wrap:wrap}
.nav-links a{display:inline-flex;align-items:center;height:40px;padding:0 12px;border-radius:8px;font:500 15px/22.5px var(--font-sans);color:var(--hg-white-90)}
.nav-links a:hover{background:rgba(255,255,255,.1);color:#fff}
.nav-links .btn{display:none}
.nav-logo{display:block;line-height:0;border-radius:50%}
.nav-logo img{width:124px;height:124px;display:block;filter:drop-shadow(0 10px 22px rgba(11,9,18,.45))}
.nav-end{display:flex;justify-content:flex-end}
.nav-menu{display:none;width:44px;height:44px;border:0;border-radius:12px;background:var(--hg-night-25);color:#fff;align-items:center;justify-content:center;cursor:pointer}
.nav-menu .x{display:none}.nav.open .nav-menu .x{display:block}.nav.open .nav-menu .m{display:none}
.nav-wa-ico{display:none}
.hero-body{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:48px;align-items:center;max-width:1066.67px;margin:28px auto 0}
.hero h1{margin:0;font:700 64px/66px var(--font-sans);letter-spacing:-1.6px;color:#fff;text-wrap:balance}
.hero h1 span{color:var(--hg-sky)}
.hero-cats{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.hero-cats a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 12px;border-radius:9999px;background:var(--hg-night-25);box-shadow:var(--ring-chip);font:600 14px/20px var(--font-sans);color:#fff}
.hero-cats a::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--e)}
.hero-cats a:hover{background:rgba(11,9,18,.4);color:#fff}
.hero-lead{margin:20px 0 0;font:400 17px/27.625px var(--font-sans);color:var(--hg-white-90);max-width:500px;text-wrap:pretty}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
/* Fanned product photos */
.fan{position:relative;width:100%;max-width:470px;aspect-ratio:1/1;margin:0 auto}
.fan-c{position:absolute;width:54%;aspect-ratio:63/88}
.fan-c.l{left:0;top:13%;transform:rotate(-10deg)}.fan-c.r{right:0;top:13%;transform:rotate(10deg)}.fan-c.m{left:23%;top:0;z-index:2;transform:rotate(-1.5deg)}
.foil{position:relative;border-radius:16px;padding:5px;background:linear-gradient(135deg,var(--ed) 0%,var(--e) 20%,var(--e2) 34%,var(--e) 48%,var(--ed) 62%,var(--e) 80%,var(--e2) 100%);background-size:220% 220%;background-position:var(--mx,30%) var(--my,30%);box-shadow:0 22px 48px rgba(11,9,18,.45)}
.foil img{display:block;width:100%;height:100%;object-fit:cover;border-radius:11px;background:#000}
.fan-c .foil{width:100%;height:100%}
/* Holo / tilt shared */
[data-holo]{--mx:50%;--my:50%;--rx:0deg;--ry:0deg;--holo:0;transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s var(--ease-out),box-shadow .3s var(--ease-out);touch-action:pan-y;will-change:transform}
[data-holo].is-on{transition:transform .08s linear,box-shadow .3s var(--ease-out)}
[data-holo] img{pointer-events:none;-webkit-user-drag:none}
.foil,.tcg-art{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.holo,.glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;transition:opacity .35s var(--ease-out)}
.holo{opacity:calc(var(--holo) * .34);mix-blend-mode:color-dodge;background:repeating-linear-gradient(110deg,#FF5A36 0%,#FFD21F 7%,#3FCB73 14%,#7CC8FF 21%,#8B3DFF 28%,#FF4FD8 35%,#FF5A36 42%);background-size:320% 320%;background-position:var(--mx) var(--my)}
.glare{opacity:var(--holo);mix-blend-mode:overlay;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.55),rgba(255,255,255,0) 48%)}
/* Section heads */
.eyebrow{display:inline-flex;align-items:center;gap:8px;margin:0;font:700 12px/16px var(--font-sans);letter-spacing:1.2px;text-transform:uppercase;color:var(--hg-sky)}
.h2{margin:8px 0 0;font:700 38px/44px var(--font-sans);letter-spacing:-.6px;color:#fff;text-wrap:balance}
.lead{margin:12px 0 0;font:400 16px/25px var(--font-sans);color:var(--hg-white-85);max-width:640px;text-wrap:pretty}
/* Novedades */
.nov-sec{padding-top:88px}
.nov{position:relative;display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:56px;align-items:center;padding:44px;border-radius:28px;border:2px solid transparent;background:radial-gradient(520px 380px at 0% 0%,rgba(255,210,31,.14),transparent 70%) padding-box,linear-gradient(var(--hg-night-2),var(--hg-night-2)) padding-box,linear-gradient(120deg,#FFD21F,#7CC8FF 35%,#8B3DFF 65%,#FFD21F) border-box}
.nov .eyebrow{height:28px;padding:0 12px;border-radius:6px;background:var(--energy-lightning);color:var(--hg-night);letter-spacing:.6px}
.nov-card{width:100%;max-width:380px;aspect-ratio:63/88;margin:0 auto;border-radius:20px}
.nov-card .foil{height:100%;border-radius:20px;padding:6px}.nov-card .foil img{border-radius:15px}
.nov-incl{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.nov-incl li{display:flex;gap:10px;align-items:baseline;font:400 15px/21px var(--font-sans);color:var(--hg-white-90)}
.nov-incl li::before{content:"";flex-shrink:0;width:7px;height:7px;transform:translateY(-1px) rotate(45deg);background:var(--energy-lightning)}
.nov-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:28px}
.nov-price{display:flex;align-items:baseline;gap:8px;margin:24px 0 0;font:700 34px/40px var(--font-sans);letter-spacing:-.5px;color:#fff}
.nov-price+.nov-foot{margin-top:16px}
/* Catalog */
.cat-sec{padding-top:96px}
.filters{display:flex;gap:8px;margin-top:24px;padding:8px;border-radius:16px;background:var(--hg-night-2);box-shadow:var(--hairline-field);overflow-x:auto;scrollbar-width:none;width:max-content;max-width:100%}
.filters::-webkit-scrollbar{display:none}
.filter{flex-shrink:0;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border:0;border-radius:9999px;background:transparent;color:var(--hg-white-90);font:600 14px/20px var(--font-sans);cursor:pointer;transition:background var(--dur-fast) var(--ease-out)}
.filter::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--e)}
.filter span{font-weight:500;opacity:.7}
.filter:hover{background:rgba(255,255,255,.08)}
.filter[aria-pressed=true]{background:var(--e);color:var(--hg-night)}.filter[aria-pressed=true]::before{background:var(--hg-night)}
.cat{margin-top:56px}.cat[hidden]{display:none}
.cat-head{display:flex;align-items:center;gap:12px}
.orb{flex-shrink:0;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--e2),var(--e) 55%,var(--ed));box-shadow:0 0 0 2px rgba(255,255,255,.12),0 0 16px color-mix(in srgb,var(--e) 45%,transparent)}
.cat h2{margin:0;font:700 30px/36px var(--font-sans);color:#fff}
.cat .lead{margin-top:8px;font-size:15px;line-height:22.5px}
.grid{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.grid>li{display:flex;min-width:0}
/* TCG product card */
.tcg{position:relative;flex:1;display:flex;border-radius:20px;padding:5px;background:linear-gradient(135deg,var(--ed) 0%,var(--e) 20%,var(--e2) 34%,var(--e) 48%,var(--ed) 62%,var(--e) 80%,var(--e2) 100%);background-size:220% 220%;background-position:var(--mx) var(--my);box-shadow:0 14px 34px rgba(11,9,18,.5)}
.tcg:hover{box-shadow:0 22px 48px rgba(11,9,18,.55),0 0 36px color-mix(in srgb,var(--e) 28%,transparent)}
.tcg-in{flex:1;display:flex;flex-direction:column;gap:12px;padding:14px 14px 16px;border-radius:15px;background-color:var(--hg-night-2);background-image:var(--sparkle);background-size:260px 260px;min-width:0}
.tcg-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tcg-name{margin:0;font:600 19px/24px var(--font-sans);color:#fff;text-wrap:balance}
.tcg-art{position:relative;aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:#000;box-shadow:0 0 0 2px color-mix(in srgb,var(--e) 55%,transparent)}
.tcg-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.tcg:hover .tcg-art img{transform:scale(1.03)}
.tcg[data-status=agotado] .tcg-art img{filter:grayscale(.65) brightness(.8)}
.tcg-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;font:500 12px/16px var(--font-sans);color:var(--hg-white-80)}
.tcg-incl{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.tcg-incl li{padding:4px 9px;border-radius:6px;background:rgba(255,255,255,.06);box-shadow:var(--hairline-card);font:500 12px/16px var(--font-sans);color:var(--hg-white-90)}
.tcg-desc{margin:0;font:400 14px/20px var(--font-sans);color:var(--hg-lilac-gray);text-wrap:pretty}
.tcg .btn{margin-top:auto}
.tcg-price{display:flex;align-items:baseline;gap:6px;margin:auto 0 0;font:700 24px/28px var(--font-sans);letter-spacing:-.3px;color:#fff}
.tcg-price span,.nov-price span{font:600 12px/16px var(--font-sans);letter-spacing:.6px;color:var(--hg-lilac-gray)}
.tcg-price+.btn{margin-top:0}
/* FAQ */
.faq-sec{padding-top:104px}
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:start}
.faq-list{display:grid;gap:12px}
.faq{border-radius:16px;background:var(--hg-night-2);box-shadow:var(--hairline-card)}
.faq summary{list-style:none;position:relative;cursor:pointer;padding:20px 56px 20px 22px;font:600 17px/24px var(--font-sans);color:#fff;border-radius:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:24px;top:50%;width:9px;height:9px;border-right:2px solid var(--hg-sky);border-bottom:2px solid var(--hg-sky);transform:translateY(-70%) rotate(45deg);transition:transform var(--dur-base) var(--ease-out)}
.faq[open] summary::after{transform:translateY(-25%) rotate(-135deg)}
.faq summary:hover{background:rgba(255,255,255,.03)}
.faq p{margin:0;padding:0 22px 20px;font:400 15px/23px var(--font-sans);color:var(--hg-white-85);text-wrap:pretty}
/* CTA */
.cta-sec{padding-top:96px}
.cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:36px 40px;border-radius:28px;background-color:var(--hg-navy);background-image:var(--sparkle);background-size:260px 260px}
.cta h2{margin:0;font:700 30px/36px var(--font-sans);color:#fff;text-wrap:balance}
.cta p{margin:8px 0 0;font:400 15px/22.5px var(--font-sans);color:var(--hg-white-90)}
.cta>div{flex:1 1 360px;min-width:0}
/* Footer */
.foot{position:relative;overflow:hidden;margin-top:72px;padding:150px 24px 36px;text-align:center}
.foot svg.wave{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.foot{isolation:isolate}
.foot-links{display:flex;gap:8px 20px;justify-content:center;flex-wrap:wrap;margin:0 0 14px;padding:0;list-style:none}
.foot-links a{display:inline-flex;align-items:center;gap:6px;min-height:32px;font:500 14px/20px var(--font-sans);color:#fff}
.foot-links a:hover{color:var(--hg-yellow)}
.foot p{margin:4px 0 0;font:400 12px/17px var(--font-sans);color:var(--hg-white-90)}
/* Floating WhatsApp */
.fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:60;width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--whatsapp-green);color:#fff;box-shadow:0 10px 30px rgba(11,9,18,.45),0 0 0 3px rgba(255,255,255,.15);transition:transform var(--dur-base) var(--ease-out)}
.fab:hover{transform:translateY(-2px) scale(1.04);color:#fff}
.fab .ico{width:30px;height:30px}
@media (max-width:960px){
.hero-body{grid-template-columns:1fr;gap:40px}
.hero h1{font-size:52px;line-height:56px}
.fan{max-width:420px}
.nov{grid-template-columns:1fr;gap:32px;padding:28px}
.nov-card{max-width:340px}
.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.faq-grid{grid-template-columns:1fr;gap:24px}
}
@media (max-width:1024px){
.nav{grid-template-columns:44px 1fr 44px;padding-top:14px;gap:8px}
.nav-logo{justify-self:center;grid-column:2;grid-row:1}
.nav-menu{display:inline-flex;grid-column:1;grid-row:1}
.nav-end{grid-column:3;grid-row:1}
.nav-end .btn{display:none}
.nav-wa-ico{display:inline-flex;width:44px;height:44px;border-radius:12px;align-items:center;justify-content:center;background:var(--hg-night-25);color:#fff}
.nav-links{display:none;grid-column:1/-1;grid-row:2;flex-direction:column;gap:4px;padding:10px;border-radius:16px;background:rgba(11,9,18,.55)}
.nav.open .nav-links{display:flex}
.nav-links a{height:48px;font-size:16px}
.nav-links .btn{display:flex;margin-top:6px;color:#fff}
.nav-links a.btn:hover{background:#2B79F0}
}
@media (max-width:720px){
.wrap{padding:0 16px}
.nav-logo img{width:92px;height:92px}
.hero{padding:0 16px 72px;border-radius:0 0 32px 32px}
.hero-body{margin-top:16px}
.hero h1{font-size:40px;line-height:44px;letter-spacing:-1px}
.hero-lead{font-size:16px;line-height:25px}
.hero-ctas .btn{flex:1 1 100%}
.fan{max-width:330px}
.h2{font-size:30px;line-height:36px}
.nov-sec{padding-top:64px}
.nov{padding:20px;border-radius:24px}
.nov-incl{grid-template-columns:1fr}
.nov-foot .btn{flex:1 1 100%}
.cat-sec{padding-top:72px}
.cat h2{font-size:26px;line-height:32px}
.grid{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}
.faq-sec,.cta-sec{padding-top:72px}
.faq summary{font-size:16px;padding:18px 52px 18px 18px}.faq p{padding:0 18px 18px}
.cta{padding:28px 22px}.cta .btn{flex:1 1 100%}
.foot{padding:130px 16px 100px}
.fab{width:56px;height:56px}
}
@media (prefers-reduced-motion:reduce){[data-holo]{transform:none!important}html{scroll-behavior:auto}}
/* Cómo comprar */
.buy-sec{padding-top:104px}
.steps{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:step}
.steps li{padding:20px 20px 22px;border-radius:16px;background:var(--hg-night-2);box-shadow:var(--hairline-card);counter-increment:step}
.steps li::before{content:counter(step);display:flex;align-items:center;justify-content:center;width:36px;height:36px;margin-bottom:14px;border-radius:50%;background:var(--hg-violet);box-shadow:0 0 0 2px rgba(124,200,255,.5);font:700 16px/1 var(--font-sans);color:#fff}
.steps h3,.facts h3{margin:0;font:600 17px/24px var(--font-sans);color:#fff}
.steps p,.facts p{margin:6px 0 0;font:400 14px/20px var(--font-sans);color:var(--hg-lilac-gray);text-wrap:pretty}
.facts{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.facts li{display:grid;grid-template-columns:18px minmax(0,1fr);align-content:start;column-gap:14px;padding:20px;border-radius:16px;background:rgba(255,255,255,.03);box-shadow:var(--hairline-card)}
.facts .orb{grid-column:1;grid-row:1/3;margin-top:3px}
.facts h3,.facts p{grid-column:2}
.buy-more{display:flex;margin-top:24px}
/* Footer: datos legales */
.foot-legal{max-width:820px;margin:0 auto 12px;padding-top:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.foot .foot-legal p{margin:0 0 6px;font:400 13px/20px var(--font-sans);color:#fff}
.foot-legal strong{font-weight:600}
.foot-legal a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.45);text-underline-offset:3px}
.foot-legal a:hover{color:var(--hg-yellow)}
/* Términos y condiciones */
.hero-legal{padding-bottom:72px}
.legal-hero{max-width:1066.67px;margin:36px auto 0}
.legal-hero .eyebrow{height:28px;padding:0 12px;border-radius:6px;background:var(--energy-lightning);color:var(--hg-night);letter-spacing:.6px}
.hero-legal h1{margin-top:16px;font-size:56px;line-height:60px;max-width:760px}
.legal-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:24px 0 0;font:500 14px/20px var(--font-sans);color:var(--hg-white-90)}
.legal{display:grid;grid-template-columns:240px minmax(0,1fr);gap:40px;align-items:start;padding-top:72px}
.toc{position:sticky;top:24px;padding:16px;border-radius:16px;background:var(--hg-night-2);box-shadow:var(--hairline-card)}
.toc>p{margin:0 0 8px;padding:4px 10px 0;font:700 12px/16px var(--font-sans);letter-spacing:1.2px;text-transform:uppercase;color:var(--hg-sky)}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;counter-reset:toc}
.toc a{display:flex;gap:10px;padding:8px 10px;border-radius:8px;font:500 14px/20px var(--font-sans);color:var(--hg-white-90);counter-increment:toc}
.toc a::before{content:counter(toc);min-width:16px;font-weight:700;color:var(--hg-sky)}
.toc a:hover{background:rgba(255,255,255,.08);color:#fff}
.legal-body{display:grid;gap:16px;min-width:0}
.lsec{scroll-margin-top:24px;padding:32px;border-radius:20px;background:var(--hg-night-2);box-shadow:var(--hairline-card)}
.lsec h2{display:flex;align-items:center;gap:14px;margin:0;font:700 26px/32px var(--font-sans);color:#fff;text-wrap:balance}
.lsec-n{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--hg-violet);box-shadow:0 0 0 2px rgba(124,200,255,.5);font:700 16px/1 var(--font-sans);color:#fff}
.lsec h3{margin:24px 0 0;font:600 17px/24px var(--font-sans);color:#fff}
.lsec p,.lsec li{font:400 15px/24px var(--font-sans);color:var(--hg-white-85);text-wrap:pretty}
.lsec>p{margin:14px 0 0;max-width:720px}
.lsec strong{font-weight:600;color:#fff}
.dots,.num{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;max-width:720px}
.dots li{display:flex;gap:12px;align-items:baseline}
.dots li::before{content:"";flex-shrink:0;width:7px;height:7px;transform:translateY(-2px) rotate(45deg);background:var(--hg-sky)}
.num{counter-reset:n}
.num li{display:flex;gap:12px;align-items:flex-start;counter-increment:n}
.num li::before{content:counter(n);flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:rgba(124,200,255,.14);font:700 13px/1 var(--font-sans);color:var(--hg-sky)}
.biz{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0 0}
.biz div{padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.04);box-shadow:var(--hairline-card)}
.biz dt{font:700 12px/16px var(--font-sans);letter-spacing:.6px;text-transform:uppercase;color:var(--hg-sky)}
.biz dd{margin:4px 0 0;font:600 16px/24px var(--font-sans);color:#fff;overflow-wrap:anywhere}
.biz dd span{display:block;font-weight:400;font-size:14px;line-height:20px;color:var(--hg-lilac-gray)}
.biz a{color:#fff}.biz a:hover{color:var(--hg-sky)}
.pay{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.lsec .pay li{display:inline-flex;align-items:center;height:36px;padding:0 14px;border-radius:9999px;background:rgba(255,255,255,.06);box-shadow:var(--hairline-field);font:600 14px/20px var(--font-sans);color:#fff}
.cover{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0 0}
.cover>div{padding:18px 20px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:var(--hairline-card)}
.cover h3{display:flex;align-items:center;gap:8px;margin:0}
.cover h3::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--status-available);box-shadow:0 0 0 3px rgba(63,203,115,.22)}
.cover .no h3::before{background:var(--status-soldout);box-shadow:0 0 0 3px rgba(140,135,153,.25)}
.lsec .cover p{margin:8px 0 0;font-size:14px;line-height:21px;color:var(--hg-lilac-gray)}
.callout{margin:20px 0 0;padding:16px 18px;border-radius:14px;background:rgba(255,210,31,.08);box-shadow:inset 0 0 0 .667px rgba(255,210,31,.4);max-width:720px}
.lsec .callout p{margin:0;font-weight:500;color:#fff}
.legal-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
@media (max-width:960px){
.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.legal{grid-template-columns:1fr;gap:24px}
.toc{position:static}
.toc ol{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
.buy-sec{padding-top:72px}
.steps,.facts{grid-template-columns:1fr}
.buy-more .btn{flex:1 1 100%}
.hero-legal{padding-bottom:56px}
.hero-legal h1{font-size:38px;line-height:42px}
.legal{padding-top:48px}
.toc ol{grid-template-columns:1fr}
.lsec{padding:22px 18px;border-radius:18px}
.lsec h2{font-size:22px;line-height:28px}
.biz,.cover{grid-template-columns:1fr}
.legal-actions .btn{flex:1 1 100%}
}
@media print{
body{background:#fff!important}
.nav,.fab,.toc,.skip,.hero-notch,.legal-meta .btn,.legal-actions,.foot svg.wave{display:none!important}
.hero{background:none;padding:0;border-radius:0}.hero::before{display:none}
.hero-legal h1{color:#000;font-size:26pt;line-height:1.15}
.legal-meta{color:#333}
.legal{display:block;padding:12px 0 0}
.lsec{padding:14px 0;border-radius:0;background:none;box-shadow:none}
.lsec h2,.lsec h3,.lsec strong,.biz dd,.biz a,.lsec .pay li,.lsec .callout p{color:#000}
.lsec p,.lsec li,.lsec .cover p,.biz dd span{color:#222}
.biz div,.cover>div,.callout,.lsec .pay li{background:none;box-shadow:inset 0 0 0 1px #bbb}
.biz dt,.dots li::before,.num li::before{color:#444}
.lsec-n{background:none;box-shadow:inset 0 0 0 1px #000;color:#000}
.foot{margin-top:16px;padding:12px 0}.foot *{color:#000!important}
}
/* Respaldo: oculta el aviso "Powered by Netlify" si sigue activo en el panel */
#nl-badge-frame{display:none!important}
.biz-mini{margin:10px 0 0;max-width:680px;font:400 13px/20px var(--font-sans);color:var(--hg-lilac-gray);text-wrap:pretty}
/* Redes sociales (colores de marca de Instagram y TikTok: adición intencional) */
.social{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:24px}
.social>span{font:500 14px/20px var(--font-sans);color:var(--hg-white-90)}
.social>span strong{font-weight:700;color:#fff}
.soc{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;color:#fff;box-shadow:0 8px 20px rgba(11,9,18,.4),0 0 0 2px rgba(255,255,255,.4);transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.soc:hover{color:#fff;transform:translateY(-2px) scale(1.06);box-shadow:0 12px 26px rgba(11,9,18,.5),0 0 0 2px #fff}
.soc .ico{width:24px;height:24px}
.soc-ig{background:radial-gradient(circle at 30% 107%,#FDF497 0%,#FDF497 5%,#FD5949 45%,#D6249F 60%,#285AEB 90%)}
.soc-tt{background:#000}
.soc-tt .ico{width:22px;height:22px;filter:drop-shadow(-1.5px -1.5px 0 #25F4EE) drop-shadow(1.5px 1.5px 0 #FE2C55)}
.social-foot{justify-content:center;margin:0 0 18px}
.social-foot .soc{width:52px;height:52px}
@media print{.social{display:none!important}}