/* AVYLOCK — Acceso inteligente */
@font-face{font-family:Montserrat;src:url(/assets/fonts/montserrat.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{
  --black:#09090a;--ink:#0d0d0f;--graphite:#151518;--graphite-2:#1c1c20;--graphite-3:#26262b;
  --line:rgba(255,255,255,.09);--line-2:rgba(255,255,255,.16);
  --white:#f6f4ef;--text:#e9e6df;--muted:#9c978d;
  --champ:#d6b98c;--champ-2:#ead7b2;--champ-3:#b8955f;
  --stone:#ecE8e1;--stone-2:#e2ddd4;--ink-on-stone:#141416;
  --wood:#5b3b26;
  --r:18px;--r-lg:28px;
  --wrap:1240px;--gut:clamp(16px,4vw,40px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --hdr:72px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--black);color:var(--text);font-family:Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,picture{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,dl,dd,ol,ul,figure{margin:0}
ul,ol{padding:0;list-style:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--champ);outline-offset:3px;border-radius:6px}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:-999px;top:8px;z-index:200;background:var(--champ);color:#000;padding:10px 14px;border-radius:8px}
.skip:focus{left:8px}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.ic{width:22px;height:22px;flex:none}
.muted{color:var(--muted)}
.small{font-size:.85rem}
em{font-style:normal;color:var(--champ)}

/* Tipografía */
.eyebrow{font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--champ);font-weight:600}
.h2{font-size:clamp(1.65rem,4.2vw,2.6rem);line-height:1.05;font-weight:600;text-transform:uppercase;letter-spacing:.01em;color:var(--white)}
.h2-xl{font-size:clamp(2rem,5.4vw,3.6rem);line-height:1}
.h2 em{font-weight:700}
.kicker{margin-top:12px;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:500}
.lead{font-size:clamp(1rem,1.6vw,1.18rem);color:var(--text);opacity:.86;margin-top:18px;max-width:34ch}
.sec{position:relative;padding:clamp(72px,10vw,128px) 0}
.sec-head{margin-bottom:clamp(28px,4vw,48px)}
.sec-head.center{text-align:center}

/* Botones */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 28px;border-radius:999px;font-weight:700;font-size:.86rem;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-color .3s,color .3s;overflow:hidden;isolation:isolate}
.btn .ic{width:20px;height:20px;transition:transform .35s var(--ease)}
.btn:hover .ic:last-child{transform:translateX(4px)}
.btn:active{transform:scale(.97)}
.btn-gold{background:linear-gradient(135deg,var(--champ-2),var(--champ) 55%,var(--champ-3));color:#141210;box-shadow:0 10px 30px -12px rgba(214,185,140,.55)}
.btn-gold::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease);z-index:-1}
.btn-gold:hover{box-shadow:0 16px 40px -14px rgba(214,185,140,.75);transform:translateY(-1px)}
.btn-gold:hover::after{transform:translateX(120%)}
.btn-dark{background:var(--ink-on-stone);color:var(--white)}
.btn-dark:hover{background:#000;transform:translateY(-1px)}
.btn-line{border:1px solid var(--line-2);color:var(--white)}
.btn-line:hover{border-color:var(--champ);color:var(--champ)}
.btn-sm{min-height:40px;padding:0 20px;font-size:.74rem}
.btn-wide{width:100%}
.icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);color:var(--white);transition:border-color .3s,background .3s,transform .3s var(--ease)}
.icon-btn:hover{border-color:var(--champ);color:var(--champ)}
.icon-btn .ic{width:18px;height:18px}
.link{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:.9rem;text-decoration:underline;text-underline-offset:4px}
.link .ic{width:16px;height:16px}
.link:hover{color:var(--white)}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--line-2);border-radius:999px;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--champ);margin-bottom:22px}
.chip .ic{width:16px;height:16px}

/* Logo */
.logo{display:inline-flex;align-items:center;gap:12px;color:var(--white)}
.logo-mark{width:30px;height:auto;color:var(--champ)}
.logo-word{font-weight:500;letter-spacing:.34em;font-size:1.02rem;margin-right:-.34em}

/* Header */
.hdr{position:fixed;inset:0 0 auto;z-index:50;height:var(--hdr);transition:background-color .4s,backdrop-filter .4s,border-color .4s,transform .4s var(--ease);border-bottom:1px solid transparent}
.hdr.solid,.hdr.scrolled{background:rgba(14,14,16,.78);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom-color:var(--line)}
.hdr-in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav{display:none}
.nav ul{display:flex;gap:32px}
.nav a{font-size:.8rem;font-weight:500;letter-spacing:.06em;color:rgba(246,244,239,.82);position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--champ);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover{color:var(--white)}.nav a:hover::after{transform:scaleX(1)}
.hdr-act{display:flex;align-items:center;gap:6px}
.hdr-buy{display:none}
.cart-btn,.burger{position:relative;display:grid;place-items:center;width:44px;height:44px;color:var(--white)}
.cart-btn b{position:absolute;top:4px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--champ);color:#000;font-size:.68rem;display:grid;place-items:center}
.mnav{position:fixed;inset:0;z-index:45;background:rgba(9,9,10,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:calc(var(--hdr) + 24px) var(--gut) 32px;display:flex;flex-direction:column;justify-content:space-between;opacity:0;transition:opacity .35s}
.mnav.open{opacity:1}
.mnav li{opacity:0;transform:translateY(12px);transition:opacity .45s var(--ease),transform .45s var(--ease);transition-delay:calc(var(--i)*45ms)}
.mnav.open li{opacity:1;transform:none}
.mnav nav a{display:block;padding:12px 0;font-size:1.6rem;font-weight:500;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--line)}
.mnav-buy{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:24px}
.menu-open{overflow:hidden}

/* Precio */
.price{display:flex;flex-direction:column;line-height:1}
.price strong{font-size:clamp(1.7rem,3.4vw,2.3rem);font-weight:700;color:var(--white);letter-spacing:-.01em}
.price span{margin-top:8px;font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}

/* HERO — mobile first */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:#070708;isolation:isolate}
.hero-bg{position:absolute;inset:0;background:radial-gradient(70% 50% at 70% 30%,rgba(214,160,90,.16),transparent 70%),linear-gradient(180deg,#0b0a09,#070708);z-index:-2}
.hero-media{position:absolute;top:0;right:0;width:100%;height:68svh;z-index:-1}
.hero-pic,.hero-pic img{width:100%;height:100%;object-fit:cover;object-position:88% 30%}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,8,.55) 0%,transparent 22%,transparent 50%,#070708 98%),linear-gradient(90deg,rgba(7,7,8,.82) 0%,rgba(7,7,8,.35) 45%,transparent 70%)}
.hero-in{padding-top:calc(var(--hdr) + 20px);padding-bottom:28px}
.hero-copy{max-width:600px}
.hero .eyebrow{margin-bottom:14px}
.hero-h{font-size:clamp(2.7rem,12.5vw,6.4rem);line-height:.93;font-weight:500;text-transform:uppercase;letter-spacing:-.015em;color:var(--white)}
.hero-h em{font-weight:800;color:var(--champ);background:linear-gradient(180deg,var(--champ-2),var(--champ) 60%,var(--champ-3));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-sub{margin-top:18px;font-size:clamp(1rem,1.7vw,1.22rem);max-width:30ch;color:rgba(246,244,239,.88)}
.hero-buy{display:flex;align-items:center;gap:22px;margin-top:24px;flex-wrap:wrap}
.hero-ship{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:.8rem;color:var(--muted);letter-spacing:.04em}
.hero-ship .ic{width:18px;height:18px;color:var(--champ)}
.feat-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.feat-strip li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;font-size:.62rem;line-height:1.2;color:rgba(246,244,239,.82)}
.fs-ic{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line-2);border-radius:50%;transition:border-color .3s,color .3s,transform .3s var(--ease)}
.fs-ic .ic{width:18px;height:18px}
.feat-strip li:hover .fs-ic{border-color:var(--champ);color:var(--champ);transform:translateY(-2px)}
.hero-scroll{display:none}

/* Reveal */
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* ¿CÓMO QUERÉS ENTRAR? */
.sec-access{background:linear-gradient(180deg,#070708,var(--graphite) 40%,var(--graphite))}
.tabs{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:6px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.02);max-width:720px;margin:0 auto 22px}
.tab{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 2px;border-radius:14px;font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(246,244,239,.7);transition:color .35s}
.tab .ic{width:24px;height:24px}
.tab[aria-selected=true]{color:#16130f}
.tab:not([aria-selected=true]):hover{color:var(--white)}
.tab-ind{position:absolute;z-index:0;top:6px;bottom:6px;left:6px;width:calc((100% - 12px - 24px)/5);border-radius:14px;background:linear-gradient(135deg,var(--champ-2),var(--champ));box-shadow:0 8px 24px -10px rgba(214,185,140,.6);transition:transform .5s var(--ease)}
.access-body{display:grid;gap:20px}
.access-copy{order:2;text-align:center;min-height:170px;display:flex;flex-direction:column;align-items:center}
.ac{animation:acIn .55s var(--ease)}
@keyframes acIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ac-n{font-size:.7rem;letter-spacing:.24em;color:var(--champ)}
.ac h3{margin-top:8px;font-size:clamp(1.6rem,4vw,2.6rem);font-weight:700;text-transform:uppercase;line-height:1;color:var(--white)}
.ac-line{margin-top:10px;font-size:1.1rem;color:var(--white)}
.ac-sub{margin-top:4px;color:var(--muted)}
.ac-nav{margin-top:20px;display:flex;align-items:center;gap:16px}
.dots{display:flex;gap:8px}
.dots i{width:6px;height:6px;border-radius:3px;background:var(--line-2);transition:width .4s var(--ease),background .4s}
.dots i.on{width:22px;background:var(--champ)}
.access-foot{text-align:center;margin-top:34px;color:var(--muted);font-size:1.05rem}
.access-foot strong{color:var(--white)}

/* Escenario */
.stage{position:relative;order:1;height:clamp(420px,62vh,620px);border-radius:var(--r-lg);overflow:hidden;background:#120c08;touch-action:pan-y;isolation:isolate}
.stage-door{position:absolute;inset:0;background:
  radial-gradient(60% 45% at 45% 30%,rgba(255,190,120,.22),transparent 70%),
  linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.05) 35%,rgba(0,0,0,.1) 65%,rgba(0,0,0,.65)),
  linear-gradient(0deg,rgba(0,0,0,.55),transparent 35%),
  url(/assets/img/wood-door.webp) center/cover #3a2516}
.stage-lock{position:absolute;left:46%;top:52%;height:90%;aspect-ratio:688/1118;transform:translate(-26%,-50%);transition:transform .9s var(--ease)}
.stage-pic,.stage-pic img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(14px 22px 22px rgba(0,0,0,.65))}
.ov{position:absolute;pointer-events:none;opacity:0;transition:opacity .5s var(--ease),transform .9s var(--ease)}
/* Huella: lector en la manija (40%, 53.5%) */
.ov-glow-fp{left:40%;top:53.5%;width:22%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(200,225,255,.55),rgba(120,170,255,.18) 45%,transparent 70%)}
.ov-touch{left:40%;top:53.5%;width:13%;aspect-ratio:1;transform:translate(-50%,-50%)}
.ov-touch span{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(220,232,255,.85);opacity:0}
[data-state=huella] .ov-glow-fp{opacity:1;transition-delay:.3s}
[data-state=huella] .ov-touch{opacity:1}
[data-state=huella] .ov-touch span{animation:ripple 2.2s .4s var(--ease) infinite}
[data-state=huella] .ov-touch span:nth-child(2){animation-delay:.9s}
[data-state=huella] .ov-touch span:nth-child(3){animation-delay:1.4s}
@keyframes ripple{0%{transform:scale(.7);opacity:.9}100%{transform:scale(2.6);opacity:0}}
/* Código: teclas reales iluminadas */
.ov-keys{inset:0}
.ov-keys i{position:absolute;width:6.5%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95) 0 18%,rgba(190,215,255,.5) 40%,transparent 70%);opacity:0;transition:opacity .2s}
.ov-keys i.on{opacity:1}
[data-state=codigo] .ov-keys{opacity:1}
.ov-pin{left:26%;top:-5%;transform:translate(-50%,0);display:flex;gap:9px;padding:7px 12px;border-radius:999px;background:rgba(9,9,10,.8);border:1px solid var(--line-2)}
.ov-pin i{width:8px;height:8px;border-radius:50%;background:var(--line-2);transition:background .2s}
.ov-pin i.on{background:var(--champ)}
[data-state=codigo] .ov-pin{opacity:1}
/* Tarjeta: se acerca al área del teclado */
.ov-card{left:26%;top:25%;width:56%;aspect-ratio:1.586;border-radius:10px;background:linear-gradient(135deg,#1d1d21,#0a0a0b 60%,#18181b);border:1px solid rgba(214,185,140,.45);box-shadow:0 30px 50px -20px rgba(0,0,0,.85);display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:8%;gap:5px;transform:translate(90%,-50%) rotate(14deg)}
.ov-card .logo-mark{width:22%;color:var(--champ)}
.ov-card b{font-size:clamp(.45rem,1.1vw,.66rem);letter-spacing:.3em;color:var(--champ-2);font-weight:500}
.ov-waves{left:26%;top:25%;width:46%;aspect-ratio:1;transform:translate(-50%,-50%)}
.ov-waves span{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(214,185,140,.7);opacity:0}
[data-state=tarjeta] .ov-card{opacity:1;transform:translate(-22%,-50%) rotate(-8deg)}
[data-state=tarjeta] .ov-waves{opacity:1}
[data-state=tarjeta] .ov-waves span{animation:ripple 1.8s 1s var(--ease) infinite}
[data-state=tarjeta] .ov-waves span:nth-child(2){animation-delay:1.5s}
[data-state=tarjeta] .ov-waves span:nth-child(3){animation-delay:2s}
/* Celular */
.ov-phone{left:88%;top:50%;width:62%;aspect-ratio:9/18.5;border-radius:20px;padding:5px;background:#050506;border:1px solid #33333a;box-shadow:0 30px 60px -20px rgba(0,0,0,.9);transform:translate(30%,-40%) rotate(10deg)}
.op-screen{height:100%;border-radius:15px;background:linear-gradient(180deg,#1b1b1f,#0e0e10);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12%;text-align:center;padding:10px}
.op-screen small{font-size:clamp(.45rem,1.1vw,.62rem);color:var(--muted);letter-spacing:.06em}
.op-btn{position:relative;width:52%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--champ-2),var(--champ-3));color:#16130f;box-shadow:0 0 0 6px rgba(214,185,140,.15)}
.op-btn .ic{position:absolute;width:44%;height:44%;transition:opacity .3s}
.op-u,.op-o{opacity:0}
.op-st{position:relative;font-style:normal;font-size:clamp(.5rem,1.2vw,.7rem);font-weight:700;letter-spacing:.12em;text-transform:uppercase;height:1.2em;width:100%}
.op-st b{position:absolute;inset:0;transition:opacity .3s}
.op-o{color:var(--champ)}
[data-state=celular] .stage-lock{transform:translate(-62%,-50%)}
[data-state=celular] .ov-phone{opacity:1;transform:translate(-10%,-50%) rotate(-4deg)}
.unlocked .op-l,.unlocked .op-c{opacity:0}
.unlocked .op-u,.unlocked .op-o{opacity:1}
/* Llave: entra desde abajo (base del frente) */
.ov-key{left:26%;top:100%;width:15%;transform:translate(-50%,60%)}
[data-state=llave] .ov-key{opacity:1;transform:translate(-50%,-4%)}
.turned .ov-key{transform:translate(-50%,-4%) scaleX(.3)!important;transition:transform .5s var(--ease)}
.ov-inset{right:5%;top:6%;width:clamp(96px,22%,150px);margin:0;transform:translateY(10px)}
.ov-inset picture,.ov-inset img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;border:2px solid rgba(214,185,140,.6);box-shadow:0 20px 40px -10px rgba(0,0,0,.8)}
.ov-inset figcaption{margin-top:8px;text-align:center;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--champ-2)}
[data-state=llave] .ov-inset{opacity:1;transform:none;transition-delay:.4s}
/* Abierta */
.ov-ok{left:26%;top:-7.5%;transform:translate(-50%,-10px);display:flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:999px;background:rgba(9,9,10,.85);border:1px solid rgba(214,185,140,.45);color:var(--champ-2);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.ov-ok .ic{width:16px;height:16px}
.unlocked .ov-ok{opacity:1;transform:translate(-50%,0)}
.unlocked[data-state=codigo] .ov-pin{opacity:0}

/* VIDEO */
.sec-video{background:var(--black)}
.video-grid{display:grid;gap:26px}
.video-copy .lead{max-width:30ch}
.video-cta{display:none}
.video-cta-m{margin-top:18px}
.video{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:#0a0908;box-shadow:0 40px 80px -40px rgba(0,0,0,.9);border:1px solid var(--line)}
.vp-img,.vp-img img{width:100%;height:100%;object-fit:cover;object-position:60% 40%;transition:transform 1.2s var(--ease)}
.video:hover .vp-img img{transform:scale(1.035)}
.vp-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.1) 60%),linear-gradient(0deg,rgba(0,0,0,.6),transparent 40%)}
.play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--white)}
.play-ring{display:grid;place-items:center;width:clamp(68px,10vw,96px);aspect-ratio:1;border-radius:50%;border:1.5px solid rgba(255,255,255,.85);background:rgba(10,10,12,.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .45s var(--ease),background .4s,border-color .4s}
.play-ring .ic{width:40%;height:40%;margin-left:6%}
.play-l{font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.play:hover .play-ring{transform:scale(1.08);background:var(--champ);border-color:var(--champ);color:#141210}
.vp-bar{position:absolute;left:16px;right:16px;bottom:14px;display:flex;align-items:center;gap:12px;font-size:.7rem;color:rgba(255,255,255,.8);pointer-events:none}
.vp-bar .ic{width:14px;height:14px}
.vp-bar i{flex:1;height:2px;background:rgba(255,255,255,.25);border-radius:2px}
.video video{position:absolute;inset:0;width:100%;height:100%;background:#000}
.video-demo{position:absolute;inset:0;background:#0b0806}
.video-demo .stage{height:100%;border-radius:0}
.vd-cap{position:absolute;left:5%;bottom:16%;z-index:3;color:var(--white);text-shadow:0 2px 10px rgba(0,0,0,.6)}
.vd-cap b{display:block;font-size:clamp(1rem,2.6vw,1.8rem);text-transform:uppercase;font-weight:700}
.vd-cap span{font-size:clamp(.75rem,1.4vw,.95rem);opacity:.85}
.vd-prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.15);z-index:3}
.vd-prog i{display:block;height:100%;width:0;background:var(--champ)}
.vd-close{position:absolute;top:12px;right:12px;z-index:4;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff}
.vd-close .ic{width:18px;height:18px}
.video-methods{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:14px}
.video-methods a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 4px;border:1px solid var(--line);border-radius:14px;font-size:.62rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(246,244,239,.8);transition:border-color .3s,color .3s,transform .3s var(--ease),background .3s}
.video-methods a:hover{border-color:var(--champ);color:var(--champ);transform:translateY(-2px);background:rgba(214,185,140,.05)}
.video-alt{margin-top:12px;font-size:.8rem;color:var(--muted)}
.video-alt button{color:var(--champ);text-decoration:underline;text-underline-offset:3px}

/* CÁMARA */
.sec-cam{min-height:clamp(640px,96vh,900px);overflow:hidden;background:radial-gradient(55% 60% at 72% 30%,#26252a,#0c0c0e 70%)}
.cam-lock{position:absolute;left:calc(60% - 140px);top:330px;height:880px;aspect-ratio:688/1118;transform:scale(var(--z,1));transform-origin:26% 8.5%;will-change:transform}
.cam-pic,.cam-pic img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 30px 40px rgba(0,0,0,.7)) brightness(1.08)}
.cam-focus{position:absolute;left:26%;top:8.5%;width:12%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1.5px solid var(--champ);box-shadow:0 0 0 8px rgba(214,185,140,.12),0 0 40px rgba(214,185,140,.35);animation:focus 2.8s var(--ease) infinite}
@keyframes focus{0%,100%{opacity:.4;transform:translate(-50%,-50%) scale(1.25)}50%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.cam-in{position:relative;z-index:1}
.cam-copy{max-width:520px}
.sec-cam .h2 em{display:block}
.cam-detail{display:none}
.cam-detail img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:16px}
.cam-detail figcaption{margin-top:10px;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* APP */
.sec-app{overflow:hidden;background:#0c0b0a}
.app-bg{position:absolute;inset:0;background:url(/assets/img/real/inst-puerta.webp) 30% 40%/cover no-repeat;filter:blur(14px) brightness(.35) saturate(.8);transform:scale(1.15)}
.app-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,9,10,.9),rgba(9,9,10,.4))}
.app-grid{position:relative;display:grid;gap:44px;align-items:center}
.ticks{margin-top:26px;display:grid;gap:14px}
.ticks li{display:flex;align-items:center;gap:12px;font-weight:500}
.ticks .ic{color:var(--champ)}
.stores{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.stores a{display:flex;flex-direction:column;padding:9px 18px;border:1px solid var(--line-2);border-radius:12px;font-weight:600;font-size:.95rem;line-height:1.15;transition:border-color .3s}
.stores small{font-size:.6rem;font-weight:500;letter-spacing:.08em;color:var(--muted)}
.stores a:hover{border-color:var(--champ)}
.app-phone{display:flex;flex-direction:column;align-items:center}
.phone{position:relative;width:min(270px,72vw);aspect-ratio:9/19;border-radius:44px;padding:11px;background:linear-gradient(145deg,#2c2c31,#0b0b0c 40%,#1d1d21);box-shadow:0 0 0 1px #3a3a40,0 50px 90px -30px rgba(0,0,0,.95),0 0 120px -40px rgba(214,185,140,.4);transform:rotate(-4deg);transition:transform .8s var(--ease)}
.phone:hover{transform:rotate(-2deg) translateY(-6px)}
.ph-notch{position:absolute;top:20px;left:50%;width:30%;height:22px;border-radius:12px;background:#000;transform:translateX(-50%);z-index:2}
.ph-screen{height:100%;border-radius:34px;background:linear-gradient(180deg,#19191c,#0d0d0f);display:flex;flex-direction:column;align-items:center;padding:20px 20px 26px;text-align:center}
.ph-top{width:100%;display:flex;justify-content:space-between;font-size:.72rem;font-weight:600;padding:0 8px}
.ph-ic .ic{width:14px;height:14px}
.ph-dev{margin-top:48px;font-size:1.05rem;font-weight:600;color:var(--white)}
.ph-model{font-size:.7rem;color:var(--muted);margin-top:4px}
.ph-btn{position:relative;margin-top:auto;width:58%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--champ-2),var(--champ) 50%,var(--champ-3));color:#16130f;box-shadow:0 0 0 12px rgba(214,185,140,.1),0 0 0 26px rgba(214,185,140,.05),0 20px 40px -10px rgba(214,185,140,.5);transition:transform .3s var(--ease)}
.ph-btn:active{transform:scale(.94)}
.ph-btn .ic{position:absolute;width:38%;height:38%;transition:opacity .3s,transform .4s var(--ease)}
.ph-u,.ph-o{opacity:0}
.ph-st{position:relative;margin-top:30px;height:1.3em;width:100%;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.ph-st span{position:absolute;inset:0;transition:opacity .3s}
.ph-o{color:var(--champ)}
.phone.unlocked .ph-l,.phone.unlocked .ph-c{opacity:0}
.phone.unlocked .ph-u,.phone.unlocked .ph-o{opacity:1}
.ph-wifi{margin-top:auto;display:flex;align-items:center;gap:6px;font-size:.66rem;color:var(--muted)}
.ph-wifi .ic{width:13px;height:13px;color:var(--champ)}
.ph-note{margin-top:22px;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* DETALLES — producto real con puntos */
.sec-details{background:radial-gradient(50% 60% at 50% 45%,#232227,var(--graphite) 70%)}
.spots{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:center}
.spot-product{position:relative;order:-1;justify-self:start;width:min(300px,76vw);aspect-ratio:688/1118;margin:0 0 18px calc(50% - min(78px,19.8vw))}
.spot-pic,.spot-pic img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(16px 26px 26px rgba(0,0,0,.65))}
.spot{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;border:2px solid var(--champ);background:transparent;box-shadow:0 0 0 0 rgba(214,185,140,.55);animation:spot 2.4s var(--ease) infinite;transition:transform .3s var(--ease),border-color .3s}
.spot span{position:absolute;left:calc(100% + 4px);top:-10px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--champ);color:#141210;font-size:.66rem;font-weight:700;display:grid;place-items:center}
.spot:nth-of-type(2){animation-delay:.4s}.spot:nth-of-type(3){animation-delay:.8s}.spot:nth-of-type(4){animation-delay:1.2s}.spot:nth-of-type(5){animation-delay:1.6s}
.spot.on{transform:translate(-50%,-50%) scale(1.2);border-color:#fff}
@keyframes spot{0%{box-shadow:0 0 0 0 rgba(214,185,140,.55)}70%{box-shadow:0 0 0 14px rgba(214,185,140,0)}100%{box-shadow:0 0 0 0 rgba(214,185,140,0)}}
.spot-list{display:grid;gap:10px}
.spot-card{display:grid;grid-template-columns:auto 76px 1fr;gap:14px;align-items:center;padding:12px 16px 12px 12px;border-radius:var(--r);border:1px solid var(--line);background:rgba(10,10,12,.6);transition:border-color .35s,transform .35s var(--ease),background .35s;cursor:default}
.spot-card.on,.spot-card:hover{border-color:rgba(214,185,140,.5);background:rgba(214,185,140,.06);transform:translateY(-2px)}
.sc-n{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid var(--champ);color:var(--champ);font-size:.7rem;font-weight:700}
.sc-pic,.sc-pic img{width:76px;height:76px;border-radius:50%;object-fit:cover}
.spot-card h3{font-size:.84rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--white)}
.spot-card p{font-size:.8rem;color:var(--muted);margin-top:3px}

/* USOS */
.sec-uses{background:linear-gradient(180deg,var(--graphite),#0e0e10)}
.uses{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gut) 8px;scrollbar-width:none;max-width:calc(var(--wrap));margin:0 auto}
.uses::-webkit-scrollbar{display:none}
.use{position:relative;flex:0 0 78%;scroll-snap-align:center;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:#111;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.use picture,.use img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.use::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(5,5,6,.92))}
.use:hover{transform:translateY(-4px);box-shadow:0 30px 50px -30px rgba(0,0,0,.9)}
.use:hover img{transform:scale(1.05)}
.use-copy{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:22px}
.use-copy .ic{color:var(--champ);width:26px;height:26px;margin-bottom:12px}
.use h3{font-size:1.02rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--white)}
.use p{font-size:.88rem;color:rgba(246,244,239,.82);margin-top:6px;max-width:26ch}

/* COMPARACIÓN */
.sec-cmp{background:#0e0e10}
.cmp{display:grid;gap:14px;align-items:stretch;max-width:980px;margin:0 auto}
.cmp-card{border-radius:var(--r-lg);padding:26px 22px;display:grid;grid-template-columns:96px 1fr;grid-template-areas:"h h" "v l" "b b";gap:18px 22px;align-items:center}
.cmp-card header{grid-area:h;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.cmp-card h3{font-size:.86rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.cmp-score{font-size:.78rem;color:var(--muted)}
.cmp-score b{font-size:1.6rem}
.cmp-vis{grid-area:v;display:grid;place-items:center}
.cmp-vis .old-lock{width:84px}
.cmp-vis .cmp-pic img{height:210px;width:auto;object-fit:contain;filter:drop-shadow(10px 16px 16px rgba(0,0,0,.25))}
.cmp-card ul{grid-area:l;display:grid;gap:2px}
.cmp-card li{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.cmp-card li .ic{width:20px;height:20px}
.cmp-bar{grid-area:b;height:4px;border-radius:2px;background:var(--line)}
.cmp-bar i{display:block;height:100%;width:0;border-radius:2px;transition:width 1.4s var(--ease) .3s}
.cmp.in .cmp-bar i{width:var(--w)}
.cmp-old{background:#151518;border:1px solid var(--line);color:var(--muted)}
.cmp-old h3{color:var(--text)}
.cmp-old li.y .ic{color:#8fbf8a}
.cmp-old li.n .ic{color:#b8675c}
.cmp-old li.n span{opacity:.6}
.cmp-old .cmp-bar i{background:var(--muted)}
.cmp-new{background:linear-gradient(160deg,#fbfaf7,var(--stone));color:var(--ink-on-stone);box-shadow:0 40px 80px -40px rgba(214,185,140,.35)}
.cmp-new .cmp-score{color:#6b665c}
.cmp-new li{border-color:rgba(0,0,0,.08);font-weight:500}
.cmp-new li .ic{color:#a4813f}
.js .cmp-new li .ic{opacity:0;transform:scale(.4);transition:opacity .4s,transform .5s var(--ease);transition-delay:calc(var(--i)*120ms + .4s)}
.cmp.in .cmp-new li .ic{opacity:1;transform:none}
.cmp-new .cmp-bar{background:rgba(0,0,0,.08)}
.cmp-new .cmp-bar i{background:linear-gradient(90deg,var(--champ),var(--champ-3))}
.cmp-vs{display:none}

/* COMPATIBILIDAD */
.sec-compat{overflow:hidden;background:#1a110b}
.wood-bg{position:absolute;inset:0;opacity:.55;background:
  linear-gradient(180deg,#0e0e10,rgba(14,14,16,.6) 18%,rgba(14,14,16,.75) 80%,#0e0e10),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .8' numOctaves='3' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .11 0 0 0 0 .05 0 0 0 .7 0'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)'/%3E%3C/svg%3E"),
  linear-gradient(180deg,#5d3c27,#4a2f1e)}
.compat-grid{position:relative;display:grid;gap:40px;align-items:center}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
.specs div{padding:18px;border:1px solid var(--line-2);border-radius:var(--r);background:rgba(9,9,10,.45)}
.specs dt{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.specs dd{margin-top:6px;font-size:clamp(1.6rem,3.4vw,2.2rem);font-weight:700;color:var(--white);line-height:1}
.specs small{font-size:.5em;font-weight:500;color:var(--champ)}
.steps{margin-top:24px;display:grid;gap:12px}
.steps li{display:flex;gap:14px;align-items:flex-start;font-size:.95rem}
.steps b{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--champ);color:var(--champ);font-size:.8rem}
.meter{margin-top:28px;padding:20px;border-radius:var(--r);background:rgba(9,9,10,.6);border:1px solid var(--line)}
.meter label{font-weight:600;font-size:.9rem}
.meter-row{display:flex;align-items:center;gap:16px;margin-top:12px}
.meter input[type=range]{flex:1;accent-color:var(--champ);height:30px}
.meter output{min-width:68px;text-align:right;font-weight:700;font-size:1.2rem;color:var(--white)}
.meter-res{margin-top:10px;font-size:.88rem;min-height:2.6em}
.meter-res.ok{color:#b9d7a8}.meter-res.no{color:#e3a99d}
.compat-vis{background:rgba(9,9,10,.55);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px}
.measure-svg{width:100%;height:auto}
.measure-svg .ms-cap{font:600 11px Montserrat,sans-serif;letter-spacing:2.5px;fill:#9c978d}
.measure-svg .ms-num{font:700 20px Montserrat,sans-serif;fill:#f6f4ef}
.measure-svg .ms-tag{font:700 12px Montserrat,sans-serif;fill:#333;letter-spacing:1px}
.measure-svg .ms-lbl{font:500 14px Montserrat,sans-serif;fill:#9c978d}
.measure-svg .ms-lbl-b{font-weight:700;fill:#f6f4ef}
.measure-svg .ms-tapet{font:700 11px Montserrat,sans-serif;letter-spacing:2px;fill:#3a2a14}
.measure-svg .ms-tape{animation:tape 3.6s var(--ease) infinite alternate}
@keyframes tape{from{transform:translateX(-14px)}to{transform:translateX(18px)}}
.doubt{position:relative;margin-top:44px;display:flex;flex-direction:column;gap:20px;padding:28px;border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(214,185,140,.14),rgba(214,185,140,.04));border:1px solid rgba(214,185,140,.3)}
.doubt h3{font-size:1.3rem;font-weight:700;text-transform:uppercase;color:var(--white)}
.doubt p{margin-top:8px;color:rgba(246,244,239,.85);max-width:46ch}

/* PRODUCTO (claro) */
.sec-product{background:linear-gradient(180deg,#f3f0ea,var(--stone));color:var(--ink-on-stone)}
.prod-grid{display:grid;gap:36px;align-items:start}
.gal-main{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#e7e2d9;aspect-ratio:1;touch-action:pan-y}
.gal-track{display:flex;height:100%;transition:transform .6s var(--ease)}
.gal-slide{flex:0 0 100%;height:100%;position:relative;overflow:hidden;cursor:zoom-in;background:#111}
.gal-slide.fit{background:radial-gradient(70% 60% at 50% 40%,#fcfbf8,#ded8ce)}
.gal-pic,.gal-pic img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease-out}
.gal-slide.fit .gal-pic img{object-fit:contain}
.gal-slide.zooming .gal-pic img{transform:scale(1.6)}
.gal-slide figcaption{position:absolute;left:16px;bottom:16px;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:#3d3a34;background:rgba(255,255,255,.82);padding:6px 10px;border-radius:999px;pointer-events:none}
.gal-main .icon-btn{position:absolute;color:var(--ink-on-stone);border-color:rgba(0,0,0,.12);background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:2}
.gal-zoom{top:14px;right:14px}
.gal-arrow{top:50%;transform:translateY(-50%)}
.gal-arrow.prev{left:12px}.gal-arrow.next{right:12px}
.gal-count{position:absolute;right:16px;bottom:18px;font-size:.72rem;color:#3d3a34;background:rgba(255,255,255,.82);padding:5px 10px;border-radius:999px;pointer-events:none}
.gal-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;scroll-snap-type:x proximity}
.gal-thumbs::-webkit-scrollbar{display:none}
.gal-th{flex:0 0 76px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:6px;padding:5px 5px 8px;border-radius:12px;border:1px solid rgba(0,0,0,.08);background:#fff;transition:border-color .3s,transform .3s var(--ease)}
.gal-th picture{width:100%;height:60px;border-radius:7px;overflow:hidden;background:#eee}
.gal-th picture img{width:100%;height:100%;object-fit:cover}
.gal-th span{font-size:.54rem;letter-spacing:.06em;text-transform:uppercase;color:#6b665c;text-align:center;line-height:1.2}
.gal-th[aria-selected=true]{border-color:var(--ink-on-stone)}
.gal-th:hover{transform:translateY(-2px)}
.buy-brand{display:flex;align-items:center;gap:10px;font-size:.78rem;letter-spacing:.34em;font-weight:500;color:#5d584f}
.buy-brand .logo-mark{width:22px;color:var(--champ-3)}
.buy-name{margin-top:10px;font-size:clamp(2.4rem,5vw,3.8rem);line-height:.95;font-weight:700;text-transform:uppercase;letter-spacing:-.01em;color:var(--ink-on-stone)}
.buy-type{margin-top:8px;color:#6b665c}
.buy-price{margin-top:24px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.buy-price strong{font-size:clamp(2rem,4vw,2.6rem);font-weight:700}
.buy-price span{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:#7d776c;padding:6px 10px;border:1px solid rgba(0,0,0,.14);border-radius:999px}
.buy-ways{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.buy-ways li{display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:#fff;border:1px solid rgba(0,0,0,.07);font-size:.78rem;font-weight:500}
.buy-ways .ic{width:16px;height:16px;color:var(--champ-3)}
.buy-row{display:flex;gap:10px;margin-top:26px}
.sec-product .btn-line{margin-top:10px;color:var(--ink-on-stone);border-color:rgba(0,0,0,.18)}
.sec-product .btn-line:hover{border-color:var(--ink-on-stone);color:var(--ink-on-stone);background:rgba(0,0,0,.03)}
.qty{display:flex;align-items:center;border:1px solid rgba(0,0,0,.18);border-radius:999px;height:54px;flex:none}
.qty button{width:42px;height:100%;display:grid;place-items:center}
.qty .ic{width:16px;height:16px}
.qty input{width:34px;text-align:center;border:0;background:none;font-weight:700;-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.buy-notes{margin-top:24px;display:grid;gap:12px;font-size:.88rem;color:#4b473f}
.buy-notes li{display:flex;align-items:center;gap:10px}
.buy-notes .ic{width:18px;height:18px;color:var(--champ-3)}
.buy-notes a{text-decoration:underline;text-underline-offset:3px}
.crumbs{font-size:.78rem;color:#7d776c;margin-bottom:22px}
.crumbs a:hover{color:#000}

/* CARACTERÍSTICAS */
.sec-feats{background:var(--black)}
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.feats li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:30px 12px;text-align:center;background:var(--black);font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.3;transition:background .4s}
.feats .ic{width:34px;height:34px;color:var(--champ);stroke-width:1.2;transition:transform .5s var(--ease)}
.feats li:hover{background:#111113}
.feats li:hover .ic{transform:translateY(-4px)}

/* FAQ */
.sec-faq{background:var(--graphite)}
.sec-faq.flat{padding-top:20px}
.faq-grid{display:grid;gap:30px}
.faq-grid .sec-head .btn{margin-top:18px}
.faq-grid .sec-head .muted{margin-top:14px}
.faq{border-top:1px solid var(--line)}
.qa{border-bottom:1px solid var(--line)}
.qa summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;cursor:pointer;list-style:none;font-weight:600;font-size:1rem;color:var(--white)}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);transition:transform .4s var(--ease),border-color .3s,background .3s}
.qa summary i .ic{width:16px;height:16px}
.qa[open] summary i{transform:rotate(45deg);border-color:var(--champ);color:var(--champ)}
.qa summary:hover{color:var(--champ-2)}
.qa-a{overflow:hidden}
.qa-a p{padding:0 50px 22px 0;color:rgba(246,244,239,.78)}

/* CIERRE */
.sec-close{min-height:80vh;display:flex;align-items:center;overflow:hidden;background:#070708}
.close-bg{position:absolute;inset:0}
.close-bg picture,.close-bg img{width:100%;height:100%;object-fit:cover;object-position:70% 40%;opacity:.55}
.close-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#070708 10%,rgba(7,7,8,.6) 55%,rgba(7,7,8,.2)),linear-gradient(0deg,#070708,transparent 30%)}
.close-in{position:relative}
.hero-h.small{font-size:clamp(2.4rem,8vw,5rem)}

/* Footer */
.ftr{background:#060607;border-top:1px solid var(--line);padding:64px 0 120px}
.ftr-in{display:grid;gap:36px;grid-template-columns:1fr 1fr}
.ftr-brand{grid-column:1/-1}
.ftr-desc{margin-top:12px;font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;color:var(--champ)}
.ftr-brand .muted{margin-top:10px}
.ftr h4{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;font-weight:600}
.ftr li{margin-bottom:10px}
.ftr a{font-size:.9rem;color:rgba(246,244,239,.82)}
.ftr a:hover{color:var(--champ)}
.ftr .muted .ic{display:inline;width:16px;height:16px;vertical-align:-3px;margin-right:4px}
.ftr-legal{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:.74rem;color:#6d6961}

/* Sticky mobile */
.sticky{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:40;display:flex;align-items:center;gap:10px;padding:8px 8px 8px 18px;border-radius:999px;background:rgba(18,18,20,.88);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);border:1px solid var(--line-2);box-shadow:0 20px 40px -10px rgba(0,0,0,.7);transform:translateY(140%);transition:transform .5s var(--ease)}
.sticky.show{transform:none}
.sticky-p{flex:1;display:flex;flex-direction:column;line-height:1.1}
.sticky-p strong{font-size:1.15rem;color:var(--white)}
.sticky-p span{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.sticky-wa{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);color:var(--champ)}
.sticky .btn{min-height:46px;padding:0 24px}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:100;background:rgba(6,6,7,.96);display:grid;place-items:center;opacity:0;transition:opacity .3s}
.lb.open{opacity:1}
.lb-stage{width:min(92vw,1100px);height:min(84vh,1100px);display:grid;place-items:center;overflow:hidden;touch-action:pan-y}
.lb-stage>*{max-width:100%;max-height:100%;transition:transform .3s var(--ease);cursor:zoom-in}
.lb-stage.zoomed>*{transform:scale(1.6);cursor:zoom-out}
.lb-stage img{max-height:84vh;width:auto;object-fit:contain;border-radius:12px}
.lb .icon-btn{position:absolute;background:rgba(255,255,255,.06)}
.lb-x{top:16px;right:16px}.lb-prev{left:12px;top:50%}.lb-next{right:12px;top:50%}
.toast{position:fixed;left:50%;bottom:90px;z-index:120;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:12px 18px;border-radius:999px;background:var(--white);color:#111;font-weight:600;font-size:.86rem;transition:opacity .3s,transform .4s var(--ease);white-space:nowrap}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* Páginas internas */
.spacer-hdr{height:var(--hdr)}
.phead{padding:calc(var(--hdr) + 56px) 0 36px;background:radial-gradient(60% 100% at 80% 0%,rgba(214,185,140,.1),transparent 60%),var(--graphite)}
.phead .eyebrow{margin-bottom:14px}
.pdp .sec-product.pdp-top{padding-top:calc(var(--hdr) + 28px)}
.sec-plist{background:var(--graphite);padding-top:20px}
.pcard{display:grid;gap:0;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:#0d0d0f;transition:transform .5s var(--ease),border-color .5s}
.pcard:hover{transform:translateY(-4px);border-color:rgba(214,185,140,.4)}
.pcard-media{display:grid;place-items:center;height:440px;background:radial-gradient(70% 60% at 50% 40%,#fcfbf8,#ded8ce)}
.pcard-media picture,.pcard-media img{height:100%;width:100%;object-fit:contain}
.pcard-copy{padding:28px}
.pcard-copy h2{margin-top:10px;font-size:2.2rem;font-weight:700;text-transform:uppercase;color:var(--white)}
.pcard-copy .muted{margin-top:8px}
.pcard-buy{margin-top:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sec-contact{background:var(--graphite);padding-top:20px}
.contact-grid{display:grid;gap:24px}
.contact-cards{display:grid;gap:12px}
.ccard{display:block;padding:26px;border-radius:var(--r-lg);border:1px solid var(--line);background:#0e0e10;transition:border-color .4s,transform .4s var(--ease)}
.ccard:hover{border-color:var(--champ);transform:translateY(-3px)}
.ccard>.ic{width:30px;height:30px;color:var(--champ)}
.ccard h2{margin-top:16px;font-size:1.2rem;text-transform:uppercase;color:var(--white)}
.ccard p{margin-top:6px;color:var(--muted)}
.ccard-go{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--champ)}
.ccard-go .ic{width:16px;height:16px}
.cform,.co-step{display:grid;gap:14px}
.cform{padding:26px;border-radius:var(--r-lg);background:#0e0e10;border:1px solid var(--line)}
.cform h2,.co-t{font-size:1.3rem;text-transform:uppercase;color:var(--white)}
label{display:grid;gap:8px;font-size:.82rem;font-weight:600;color:rgba(246,244,239,.85)}
label small{font-weight:400;color:var(--muted)}
input:not([type=range]):not([type=checkbox]),select,textarea{width:100%;min-height:50px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-2);background:#0a0a0b;font-size:16px;font-weight:500;transition:border-color .3s,box-shadow .3s}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--champ);box-shadow:0 0 0 3px rgba(214,185,140,.18)}
.invalid{border-color:#c46b5e!important}
.check{display:flex;align-items:flex-start;gap:12px;font-weight:500}
.check input{width:20px;height:20px;accent-color:var(--champ);margin-top:2px;flex:none}

/* Checkout */
.co{background:var(--graphite);min-height:80vh;padding-top:40px}
.co-head{display:grid;gap:22px;margin-bottom:28px}
.co-steps{display:flex;gap:4px;counter-reset:s}
.co-steps li{flex:1;display:flex;flex-direction:column;gap:8px;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.co-steps li::before{content:"";height:3px;border-radius:2px;background:var(--line-2);transition:background .4s}
.co-steps li.on::before,.co-steps li.done::before{background:var(--champ)}
.co-steps li.on{color:var(--white)}
.co-steps b{display:none}
.co-grid{display:grid;gap:22px;align-items:start}
.co-main{padding:22px;border-radius:var(--r-lg);background:#0e0e10;border:1px solid var(--line)}
.co-item{display:grid;grid-template-columns:76px 1fr;gap:16px;align-items:center}
.co-thumb{height:110px;border-radius:12px;display:grid;place-items:center;background:radial-gradient(70% 60% at 50% 40%,#fff,#e2ddd4);overflow:hidden;padding:8px 0}
.co-thumb picture,.co-thumb img{height:100%;width:100%;object-fit:contain}
.co-info h2{font-size:1rem;text-transform:uppercase;color:var(--white)}
.co-info .muted{font-size:.8rem;margin-top:2px}
.co-qrow{display:flex;align-items:center;gap:16px;margin-top:12px}
.co .qty{border-color:var(--line-2);height:44px}
.co-price{grid-column:2;font-weight:700;font-size:1.2rem;color:var(--white)}
.co-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line);flex-wrap:wrap}
.co-empty{text-align:center;padding:30px 0;display:grid;gap:18px;justify-items:center}
.fgrid{display:grid;gap:14px}
.ship-opt,.pay-box{display:flex;gap:14px;padding:18px;border-radius:14px;border:1px solid rgba(214,185,140,.4);background:rgba(214,185,140,.06)}
.ship-opt>.ic,.pay-box>.ic{color:var(--champ);margin-top:2px}
.ship-opt .muted,.pay-box .muted{font-size:.86rem;margin-top:4px}
.co-sum{padding:22px;border-radius:var(--r-lg);border:1px solid var(--line);background:#0b0b0c}
.co-sum h2{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.co-sum dl>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.co-sum .tot{border:0;font-weight:700;font-size:1.1rem;color:var(--white)}
.co-sum .small{margin-top:10px;display:flex;align-items:center;gap:8px}
.co-sum .small .ic{width:16px;height:16px}
.review{display:grid;gap:0}
.review>div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.review dt{color:var(--muted)}
.done{display:grid;gap:14px;justify-items:center;text-align:center;padding:20px 0}
.done-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--champ);color:#111}
.done-ic .ic{width:30px;height:30px}
.checkout-page .sticky{display:none}

/* ── Tablet ≥ 700 ── */
@media (min-width:700px){

  .feats{grid-template-columns:repeat(4,1fr)}
  .use{flex-basis:44%}
  .cmp{grid-template-columns:1fr auto 1fr}
  .cmp-card{grid-template-columns:1fr;grid-template-areas:"h" "v" "l" "b";padding:30px}
  .cmp-vis{height:220px}
  .cmp-vs{display:grid;place-items:center;align-self:center;width:52px;height:52px;border-radius:50%;border:1px solid var(--line-2);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
  .doubt{flex-direction:row;align-items:center;justify-content:space-between;padding:34px 40px}
  .fgrid{grid-template-columns:1fr 1fr}
  .fgrid .span2{grid-column:1/-1}
  .co-steps b{display:inline}
  .co-steps li{font-size:.68rem}
  .co-item{grid-template-columns:110px 1fr auto}
  .co-thumb{height:140px}
  .co-price{grid-column:auto}
  .contact-grid{grid-template-columns:1fr 1fr}
  .pcard{grid-template-columns:1fr 1fr}
  .ftr-in{grid-template-columns:2fr 1fr 1fr 1fr}
  .ftr-brand{grid-column:auto}
  .gal-th{flex-basis:90px}
}

/* ── Desktop ≥ 1000 ── */
@media (min-width:1000px){
  :root{--hdr:84px}
  .nav{display:block}
  .hdr-buy{display:inline-flex;margin-left:10px}
  .burger{display:none}
  .sticky{display:none}
  .hero{align-items:center}
  .hero-media{width:100%;height:100%}
  .hero-pic img{object-position:100% 45%}
  .hero-media::after{background:linear-gradient(90deg,rgba(7,7,8,.88) 0%,rgba(7,7,8,.62) 26%,rgba(7,7,8,.18) 44%,transparent 58%),linear-gradient(180deg,rgba(7,7,8,.55) 0%,transparent 16%,transparent 80%,#070708 100%)}
  .hero-bg{background:radial-gradient(50% 60% at 30% 40%,rgba(214,160,90,.08),transparent 70%),linear-gradient(90deg,#070708 40%,#0d0b09)}
  .hero-in{padding-top:var(--hdr);padding-bottom:40px}
  .hero-copy{max-width:640px}
  .feat-strip{max-width:560px;gap:8px}
  .feat-strip li{font-size:.68rem}
  .fs-ic{width:46px;height:46px}
  .hero-scroll{display:block;position:absolute;left:50%;bottom:22px;width:24px;height:38px;border:1px solid var(--line-2);border-radius:12px;transform:translateX(-50%)}
  .hero-scroll span{position:absolute;left:50%;top:8px;width:2px;height:8px;border-radius:1px;background:var(--champ);transform:translateX(-50%);animation:sc 2s var(--ease) infinite}
  @keyframes sc{0%{opacity:0;transform:translate(-50%,0)}40%{opacity:1}100%{opacity:0;transform:translate(-50%,12px)}}
  .tabs{margin-bottom:34px}
  .tab{flex-direction:row;justify-content:center;gap:10px;padding:16px 8px;font-size:.74rem}
  .access-body{grid-template-columns:5fr 7fr;align-items:center;gap:40px}
  .access-copy{order:0;text-align:left;align-items:flex-start;min-height:300px;justify-content:center}
  .ac h3{font-size:3.2rem}
  .ac-line{font-size:1.3rem}
  .stage{height:620px}
  .video-grid{grid-template-columns:4fr 8fr;align-items:center;gap:56px}
  .video-cta{display:block;margin-top:32px}
  .video-cta-m{display:none}
  .sec-cam{align-items:center;padding-bottom:clamp(72px,10vw,128px)}
  .cam-lock{left:auto;right:-17%;top:10%;height:140%}
  .cam-detail{display:block;width:180px;margin-top:36px}
  .app-grid{grid-template-columns:1fr 1fr}
  .use{flex:1 1 0;aspect-ratio:3/4.2}
  .uses{overflow:visible}
  .compat-grid{grid-template-columns:1fr 1fr;gap:64px}
  .prod-grid{grid-template-columns:7fr 5fr;gap:56px}
  .buy{position:sticky;top:calc(var(--hdr) + 24px)}
  .gal-main{aspect-ratio:5/4.6}
  .gal-arrow{opacity:0;transition:opacity .3s}
  .gal-main:hover .gal-arrow{opacity:1}
  .faq-grid{grid-template-columns:4fr 8fr;gap:64px}
  .feats{grid-template-columns:repeat(8,1fr)}
  .co-grid{grid-template-columns:8fr 4fr}
  .co-main{padding:34px}
  .co-sum{position:sticky;top:calc(var(--hdr) + 24px)}
  .ftr{padding-bottom:64px}
}
@media (min-width:1000px) and (max-height:760px){
  .hero-h{font-size:clamp(2.6rem,9vh,5rem)}
  .feat-strip{margin-top:18px;padding-top:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
}
/* fixes */
.qty input[type=number][aria-label]{width:36px;min-height:0;height:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-align:center;font-weight:700;color:inherit}
.prod-grid>*,.co-grid>*,.video-grid>*,.app-grid>*,.compat-grid>*{min-width:0}
.co .qty{color:var(--white)}
.gal-th.fit picture{background:#ece8e1}.gal-th.fit picture img{object-fit:contain}
/* Hero móvil: producto arriba, mensaje + precio + CTA debajo (primer pantallazo) */
@media (max-width:999px){
  .hero{display:block;min-height:0}
  .hero-media{height:60svh;max-height:560px}
  .hero-pic img{object-position:92% 10%}
  .hero-media::after{background:linear-gradient(180deg,rgba(7,7,8,.5) 0%,transparent 16%,transparent 62%,#070708 99%),linear-gradient(90deg,rgba(7,7,8,.55) 0%,transparent 45%)}
  .hero-in{padding-top:min(calc(60svh - 70px),490px);padding-bottom:36px}
  .hero .eyebrow{display:none}
  .hero-h{font-size:clamp(2.5rem,11.6vw,4.4rem)}
  .hero-sub{margin-top:12px;font-size:.98rem}
  .hero-buy{gap:16px;margin-top:18px;flex-wrap:nowrap}
  .hero-buy .btn{padding:0 20px;font-size:.76rem;min-height:52px;flex:none}
  .hero-buy .price strong{font-size:1.6rem}
  .hero-buy .price span{font-size:.56rem;letter-spacing:.2em}
  .hero-ship{margin-top:12px}
}
@media (max-width:360px){.hero-buy .btn .ic{display:none}}
@media (min-width:1000px){.spots{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:40px}.spot-product{order:0;width:auto;height:620px;margin:0}.spot-list:first-child .spot-card{grid-template-columns:1fr 76px auto;text-align:right}.spot-list:first-child .spot-card .sc-n{order:3}.spot-list:first-child .spot-card .sc-pic{order:2}.spot-list:first-child .spot-card div{order:1}}
/* Video vertical real */
.video.vert{aspect-ratio:406/720;width:min(100%,400px);margin:0 auto;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 120px -40px rgba(214,185,140,.35)}
.video.vert .vp-img img{object-position:50% 50%}
.video.playing .play,.video.playing .vp-bar,.video.playing .vp-shade,.video.playing .vp-img{display:none}
.video video{object-fit:contain}
.video-col .video-methods{max-width:520px;margin-left:auto;margin-right:auto}
.video-col .video-alt{text-align:center}
@media (min-width:1000px){.video-grid{grid-template-columns:5fr 6fr}.video.vert{width:auto;height:min(78vh,700px)}}
