@font-face{font-family:'Playfair Display';src:url('/fonts/PlayfairDisplay-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:'Work Sans';src:url('/fonts/WorkSans-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Work Sans';src:url('/fonts/WorkSans-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Work Sans';src:url('/fonts/WorkSans-600.ttf') format('truetype');font-weight:600;font-display:swap}
:root{--night:#3a0c19;--burgundy:#6d1a2e;--gold:#e0b94a;--gold-deep:#c9a227;--cream:#f6efe2;--ink:#2a1512;--soft:#ecdccb;--muted:#8a7367}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Work Sans',system-ui,sans-serif;color:var(--cream);background:var(--night);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
.stars{background-color:var(--night);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800'%3E<circle cx='520' cy='724' r='0.8' fill='%23fff3cf' opacity='0.31'/><circle cx='183' cy='608' r='0.7' fill='%23fff3cf' opacity='0.43'/><circle cx='642' cy='271' r='1.2' fill='%23fff3cf' opacity='0.71'/><circle cx='762' cy='415' r='0.8' fill='%23fff3cf' opacity='0.50'/><circle cx='356' cy='467' r='0.8' fill='%23fff3cf' opacity='0.70'/><circle cx='94' cy='624' r='0.5' fill='%23fff3cf' opacity='0.42'/><circle cx='353' cy='433' r='1.2' fill='%23fff3cf' opacity='0.61'/><circle cx='588' cy='297' r='1.4' fill='%23fff3cf' opacity='0.27'/><circle cx='50' cy='326' r='1.5' fill='%23fff3cf' opacity='0.30'/><circle cx='624' cy='510' r='1.4' fill='%23fff3cf' opacity='0.46'/><circle cx='613' cy='631' r='1.2' fill='%23fff3cf' opacity='0.62'/><circle cx='243' cy='709' r='1.3' fill='%23fff3cf' opacity='0.70'/><circle cx='511' cy='379' r='1.3' fill='%23fff3cf' opacity='0.40'/><circle cx='164' cy='401' r='0.7' fill='%23fff3cf' opacity='0.46'/><circle cx='406' cy='707' r='1.0' fill='%23fff3cf' opacity='0.35'/><circle cx='546' cy='574' r='1.5' fill='%23fff3cf' opacity='0.27'/><circle cx='574' cy='142' r='0.9' fill='%23fff3cf' opacity='0.70'/><circle cx='273' cy='53' r='1.0' fill='%23fff3cf' opacity='0.71'/><circle cx='462' cy='29' r='0.6' fill='%23fff3cf' opacity='0.42'/><circle cx='777' cy='387' r='1.2' fill='%23fff3cf' opacity='0.62'/><circle cx='377' cy='80' r='1.1' fill='%23fff3cf' opacity='0.50'/><circle cx='794' cy='76' r='1.4' fill='%23fff3cf' opacity='0.67'/><circle cx='506' cy='69' r='1.4' fill='%23fff3cf' opacity='0.59'/><circle cx='451' cy='522' r='1.0' fill='%23fff3cf' opacity='0.64'/><circle cx='473' cy='449' r='1.5' fill='%23fff3cf' opacity='0.30'/><circle cx='294' cy='521' r='1.1' fill='%23fff3cf' opacity='0.40'/><circle cx='229' cy='313' r='1.3' fill='%23fff3cf' opacity='0.39'/><circle cx='34' cy='82' r='1.6' fill='%23fff3cf' opacity='0.75'/><circle cx='674' cy='677' r='1.0' fill='%23fff3cf' opacity='0.45'/><circle cx='245' cy='785' r='0.6' fill='%23fff3cf' opacity='0.67'/><circle cx='9' cy='307' r='1.2' fill='%23fff3cf' opacity='0.76'/><circle cx='581' cy='270' r='0.7' fill='%23fff3cf' opacity='0.53'/><circle cx='230' cy='71' r='0.7' fill='%23fff3cf' opacity='0.75'/><circle cx='133' cy='58' r='1.2' fill='%23fff3cf' opacity='0.69'/><circle cx='546' cy='633' r='0.9' fill='%23fff3cf' opacity='0.47'/><circle cx='719' cy='306' r='1.2' fill='%23fff3cf' opacity='0.44'/><circle cx='138' cy='668' r='1.1' fill='%23fff3cf' opacity='0.35'/><circle cx='305' cy='700' r='1.4' fill='%23fff3cf' opacity='0.64'/><circle cx='645' cy='423' r='0.7' fill='%23fff3cf' opacity='0.65'/><circle cx='558' cy='270' r='0.6' fill='%23fff3cf' opacity='0.66'/><circle cx='389' cy='204' r='0.6' fill='%23fff3cf' opacity='0.29'/><circle cx='542' cy='154' r='1.1' fill='%23fff3cf' opacity='0.67'/><circle cx='326' cy='199' r='1.5' fill='%23fff3cf' opacity='0.35'/><circle cx='532' cy='478' r='1.5' fill='%23fff3cf' opacity='0.35'/><circle cx='142' cy='33' r='0.8' fill='%23fff3cf' opacity='0.30'/><circle cx='776' cy='187' r='1.3' fill='%23fff3cf' opacity='0.32'/><circle cx='468' cy='456' r='1.5' fill='%23fff3cf' opacity='0.64'/><circle cx='780' cy='594' r='0.5' fill='%23fff3cf' opacity='0.46'/><circle cx='41' cy='768' r='0.7' fill='%23fff3cf' opacity='0.39'/><circle cx='730' cy='671' r='1.3' fill='%23fff3cf' opacity='0.42'/><circle cx='587' cy='769' r='1.1' fill='%23fff3cf' opacity='0.41'/><circle cx='253' cy='74' r='1.5' fill='%23fff3cf' opacity='0.37'/><circle cx='252' cy='57' r='0.6' fill='%23fff3cf' opacity='0.60'/><circle cx='99' cy='293' r='1.1' fill='%23fff3cf' opacity='0.53'/><circle cx='347' cy='240' r='1.2' fill='%23fff3cf' opacity='0.65'/><circle cx='366' cy='746' r='1.2' fill='%23fff3cf' opacity='0.46'/><circle cx='647' cy='498' r='1.1' fill='%23fff3cf' opacity='0.63'/><circle cx='56' cy='198' r='1.6' fill='%23fff3cf' opacity='0.47'/><circle cx='5' cy='72' r='0.5' fill='%23fff3cf' opacity='0.36'/><circle cx='366' cy='319' r='0.8' fill='%23fff3cf' opacity='0.52'/><circle cx='713' cy='482' r='1.2' fill='%23fff3cf' opacity='0.77'/><circle cx='504' cy='169' r='1.6' fill='%23fff3cf' opacity='0.67'/><circle cx='588' cy='287' r='1.0' fill='%23fff3cf' opacity='0.58'/><circle cx='452' cy='26' r='0.7' fill='%23fff3cf' opacity='0.80'/><circle cx='796' cy='769' r='0.6' fill='%23fff3cf' opacity='0.65'/><circle cx='248' cy='136' r='1.2' fill='%23fff3cf' opacity='0.61'/><circle cx='605' cy='162' r='1.0' fill='%23fff3cf' opacity='0.38'/><circle cx='614' cy='7' r='0.5' fill='%23fff3cf' opacity='0.68'/><circle cx='678' cy='401' r='1.2' fill='%23fff3cf' opacity='0.44'/><circle cx='107' cy='624' r='1.5' fill='%23fff3cf' opacity='0.43'/>%3C/svg%3E"),radial-gradient(ellipse at 50% 120%,#7a2036,#3a0c19 62%)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
header.top{position:relative;display:flex;align-items:center;justify-content:center;padding:22px 20px}
.brand{display:inline-block;white-space:nowrap;text-decoration:none;font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:clamp(26px,5vw,34px);line-height:1;letter-spacing:.05em}
.brand .word{background:linear-gradient(135deg,#f7e7b0,#e2bb52 45%,#c9a227 70%,#b48a1c);-webkit-background-clip:text;background-clip:text;color:transparent}
/* Medidas reales de la O de Playfair 700: 0,75em de alto, de 0,73em sobre la base a 0,02em bajo ella */
.brand .o{position:relative;display:inline-block;width:.75em;height:.75em;margin-left:.04em;vertical-align:-.02em;transform-style:preserve-3d;animation:oflip 4.5s ease-in-out infinite}
.brand .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.brand .face svg{display:block;width:100%;height:100%}
.brand .fb{transform:rotateY(180deg)}
@keyframes oflip{0%,38%{transform:rotateY(0)}50%,88%{transform:rotateY(180deg)}100%{transform:rotateY(360deg)}}
header.top nav{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:18px}
.lang{position:relative}
.lang summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--soft);padding:6px 4px}
.lang summary::-webkit-details-marker{display:none}
.lang .flag{display:inline-block;width:24px;height:16px;border-radius:3px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.28)}
.lang .flag svg{display:block;width:100%;height:100%}
.lang .chev{width:9px;height:6px}
.lang .menu{position:absolute;right:0;top:calc(100% + 8px);min-width:156px;background:#2a0812;border:1px solid rgba(224,185,74,.5);border-radius:12px;padding:6px;box-shadow:0 14px 30px rgba(0,0,0,.45);z-index:30}
.lang .menu a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--cream);text-decoration:none;font-size:14px;margin:0}
.lang .menu a:hover{background:rgba(224,185,74,.14);color:var(--gold)}
.lang .tick{margin-left:auto;color:var(--gold);font-style:normal}
.doc .lang .menu a{color:var(--cream)}
.doc .lang .menu a:hover{color:var(--gold)}
header.top nav a{color:var(--soft);text-decoration:none;font-size:14px;font-weight:500}
header.top nav a:hover{color:var(--gold)}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif;font-weight:700;line-height:1.15}
.gold{background:linear-gradient(135deg,#f7e7b0,#e2bb52 45%,#c9a227 70%,#b48a1c);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero{display:grid;gap:36px;align-items:center;padding:30px 20px 70px}
.hero h1{font-size:clamp(34px,6vw,54px);margin-bottom:16px}
.hero p.lead{font-size:clamp(17px,2.4vw,20px);color:var(--soft);max-width:520px}
.badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.badge{display:inline-flex;align-items:center;gap:8px;border:1.5px solid rgba(224,185,74,.6);border-radius:12px;padding:10px 16px;font-size:14px;font-weight:600;color:var(--gold);background:rgba(224,185,74,.07)}
.soon{margin-top:12px;font-size:13px;color:var(--soft);opacity:.85}
.phone{background:#1c0f12;border-radius:38px;padding:8px;box-shadow:0 22px 50px rgba(0,0,0,.5),0 0 0 1px rgba(224,185,74,.18);width:100%;max-width:270px}
.phone img{display:block;width:100%;height:auto;border-radius:30px}
.hero .phone{margin:0 auto;transform:rotate(3deg)}
section{padding:64px 0}
section h2{font-size:clamp(26px,4vw,36px);text-align:center;margin-bottom:12px}
section .sub{text-align:center;color:var(--soft);max-width:560px;margin:0 auto 36px}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.card{border:1.5px solid rgba(224,185,74,.4);border-radius:18px;padding:22px;background:linear-gradient(180deg,rgba(224,185,74,.1),rgba(224,185,74,.02))}
.card svg{width:34px;height:34px;stroke:var(--gold);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;margin-bottom:12px}
.card h3{font-size:20px;margin-bottom:6px;color:var(--gold)}
.card p{color:var(--soft);font-size:15px}
.screens{display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));justify-items:center}
.screens figure{text-align:center;max-width:260px}
.screens figcaption{margin-top:14px;color:var(--soft);font-size:14px}
.pro{border:1.5px solid rgba(224,185,74,.6);border-radius:24px;padding:40px 26px;text-align:center;background:linear-gradient(180deg,rgba(224,185,74,.14),rgba(224,185,74,.03))}
.pro ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:20px 0 6px}
.pro li{border:1px solid rgba(224,185,74,.45);border-radius:999px;padding:7px 15px;font-size:14px;color:var(--soft)}
footer{border-top:1px solid rgba(224,185,74,.25);padding:28px 0 40px;color:var(--soft);font-size:14px}
footer .row{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center}
footer a{text-decoration:none;margin-right:18px}
footer a:hover{color:var(--gold)}
/* páginas de texto */
.doc{background:var(--cream);color:var(--ink)}
.doc{display:flex;flex-direction:column;min-height:100vh}
.doc header.top{background:var(--burgundy);max-width:none;margin:0;padding:16px max(20px,calc((100% - 1080px)/2))}
.doc header.top nav a{color:#e0b94a}
.doc header.top nav{right:max(20px,calc((100% - 1080px)/2))}
.doc main{max-width:760px;width:100%;flex:1;margin:0 auto;padding:44px 20px 70px}
.doc .back{display:inline-flex;align-items:center;gap:7px;font-size:15px;font-weight:600;text-decoration:none;color:var(--burgundy);margin-bottom:18px;padding:4px 0}
.doc .back:hover{color:#8a2740;text-decoration:underline}
.doc h1{font-size:clamp(28px,5vw,40px);color:var(--burgundy);margin-bottom:6px}
.doc .updated{color:var(--muted);font-size:14px;margin-bottom:30px}
.doc h2{font-size:20px;color:var(--burgundy);margin:28px 0 8px;text-align:left}
.doc p,.doc li{font-size:16px;margin-bottom:10px}
.doc a{color:var(--burgundy);font-weight:500}
.doc main details{background:#fffdf8;border:1px solid rgba(109,26,46,.15);border-radius:14px;padding:14px 18px;margin-bottom:10px}
.doc main summary{font-weight:600;cursor:pointer;color:var(--burgundy)}
.doc main details p{margin:10px 0 2px}
.doc footer{background:var(--night);color:var(--soft)}
.doc footer a{color:var(--soft);font-weight:400}
.doc footer a:hover{color:var(--gold)}
.contact{display:inline-block;margin-top:6px;background:var(--burgundy);color:#e0b94a!important;text-decoration:none;border-radius:12px;padding:12px 22px;font-weight:600}
.dl{border:1.5px solid rgba(224,185,74,.5);border-radius:24px;padding:42px 24px;text-align:center;background:linear-gradient(180deg,rgba(224,185,74,.12),rgba(224,185,74,.02))}
.stores{display:flex;flex-wrap:wrap;gap:24px;justify-content:center;margin-top:22px}
.store{display:flex;flex-direction:column;align-items:center;gap:12px}
.store .btn{display:inline-flex;align-items:center;gap:10px;border-radius:14px;padding:12px 22px;font-weight:600;font-size:15px;text-decoration:none;border:1.5px solid rgba(224,185,74,.6);color:var(--gold);background:rgba(224,185,74,.07)}
.store .btn.live{background:var(--gold-deep);color:#3d2c00;border-color:var(--gold-deep)}
.store .qr{width:168px;height:168px;border-radius:14px;overflow:hidden;background:var(--cream);padding:6px}
.store .qr svg{width:100%;height:100%;display:block}
.store small{color:var(--soft);font-size:13px}
.twinkle{position:fixed;inset:0;z-index:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620'%3E<circle cx='49' cy='491' r='1.6' fill='%23fff3cf'/><circle cx='370' cy='375' r='1.0' fill='%23fff3cf'/><circle cx='431' cy='293' r='1.8' fill='%23fff3cf'/><circle cx='490' cy='501' r='0.9' fill='%23fff3cf'/><circle cx='187' cy='19' r='1.3' fill='%23fff3cf'/><circle cx='399' cy='345' r='1.0' fill='%23fff3cf'/><circle cx='144' cy='498' r='1.8' fill='%23fff3cf'/><circle cx='301' cy='115' r='1.7' fill='%23fff3cf'/><circle cx='509' cy='75' r='1.1' fill='%23fff3cf'/><circle cx='405' cy='16' r='0.7' fill='%23fff3cf'/><circle cx='247' cy='197' r='1.0' fill='%23fff3cf'/><circle cx='296' cy='256' r='1.2' fill='%23fff3cf'/><circle cx='187' cy='452' r='1.9' fill='%23fff3cf'/><circle cx='181' cy='422' r='1.0' fill='%23fff3cf'/><circle cx='535' cy='425' r='1.6' fill='%23fff3cf'/><circle cx='267' cy='100' r='1.7' fill='%23fff3cf'/><circle cx='256' cy='324' r='1.9' fill='%23fff3cf'/><circle cx='141' cy='116' r='1.3' fill='%23fff3cf'/><circle cx='179' cy='355' r='1.9' fill='%23fff3cf'/><circle cx='9' cy='58' r='1.5' fill='%23fff3cf'/><circle cx='509' cy='104' r='2.0' fill='%23fff3cf'/><circle cx='78' cy='132' r='1.3' fill='%23fff3cf'/><circle cx='214' cy='399' r='1.4' fill='%23fff3cf'/><circle cx='555' cy='544' r='1.3' fill='%23fff3cf'/><circle cx='119' cy='206' r='1.7' fill='%23fff3cf'/><circle cx='405' cy='262' r='1.9' fill='%23fff3cf'/><circle cx='432' cy='351' r='0.9' fill='%23fff3cf'/><circle cx='457' cy='112' r='0.8' fill='%23fff3cf'/><circle cx='119' cy='422' r='0.7' fill='%23fff3cf'/><circle cx='297' cy='301' r='1.2' fill='%23fff3cf'/><circle cx='7' cy='5' r='1.5' fill='%23fff3cf'/><circle cx='130' cy='414' r='0.8' fill='%23fff3cf'/><circle cx='303' cy='547' r='1.1' fill='%23fff3cf'/><circle cx='165' cy='40' r='1.5' fill='%23fff3cf'/><circle cx='593' cy='394' r='1.3' fill='%23fff3cf'/><circle cx='607' cy='5' r='1.0' fill='%23fff3cf'/><circle cx='464' cy='373' r='1.1' fill='%23fff3cf'/><circle cx='423' cy='515' r='1.0' fill='%23fff3cf'/>%3C/svg%3E");background-size:620px 620px;opacity:.55;animation:twinkle 6s ease-in-out infinite alternate}
main,header.top,footer{position:relative;z-index:1}
header.top{z-index:40}
@keyframes twinkle{0%{opacity:.15}100%{opacity:.75}}
.shimmer{background:linear-gradient(110deg,#c9a227 18%,#fff3c4 38%,#e2bb52 50%,#c9a227 68%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 8s ease-in-out infinite}
@keyframes shimmer{0%,35%{background-position:115% 0}100%{background-position:-60% 0}}
.hero-art{position:relative;display:grid;place-items:center;padding:30px 0 56px}
.halo{position:absolute;width:min(440px,100%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(224,185,74,.30),rgba(224,185,74,0) 66%);animation:halo 5.5s ease-in-out infinite}
@keyframes halo{0%,100%{transform:scale(.92);opacity:.7}50%{transform:scale(1.08);opacity:1}}
.hero .phone.float{position:relative;animation:levitate 6.5s ease-in-out infinite}
@keyframes levitate{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-18px) rotate(1.2deg)}}
.ground{position:absolute;bottom:14px;width:46%;max-width:150px;height:18px;border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.5),transparent 70%);animation:ground 6.5s ease-in-out infinite}
@keyframes ground{0%,100%{transform:scale(1);opacity:.65}50%{transform:scale(.72);opacity:.3}}
.phone .ring{position:absolute;left:38%;top:40%;width:42px;height:42px;margin:-21px 0 0 -21px;border:2px solid #fff3cf;border-radius:50%;pointer-events:none;opacity:0;animation:tap 3.2s ease-out infinite 1s}
.phone .dot{position:absolute;left:38%;top:40%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff3cf;pointer-events:none;box-shadow:0 0 8px rgba(255,243,207,.9);animation:tapdot 3.2s ease-out infinite 1s;opacity:0}
@keyframes tap{0%{transform:scale(.3);opacity:.95}70%{opacity:.25}100%{transform:scale(1.9);opacity:0}}
@keyframes tapdot{0%,8%{opacity:0}15%,60%{opacity:1}100%{opacity:0}}
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.js .reveal.in{opacity:1;transform:none}
.card{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.card:hover{transform:translateY(-5px);border-color:rgba(224,185,74,.85);box-shadow:0 12px 30px rgba(0,0,0,.35),0 0 22px rgba(224,185,74,.18)}
.js .card.reveal.in:hover{transform:translateY(-5px)}
.screens .phone{transition:transform .4s ease}
.screens .phone:hover{transform:translateY(-8px) rotate(-1deg)}
.badge{transition:background .25s ease,transform .25s ease}
a.badge:hover{background:rgba(224,185,74,.18);transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}.twinkle{opacity:.4}}
@media(min-width:880px){.hero{grid-template-columns:1.15fr .85fr}}
@media(max-width:520px){header.top nav{right:14px}header.top nav .sup{display:none}}
