:root{--accent:#8a4d79;--soft:#fbf5f8;--env1:#ead6df;--env2:#f5e7ed;--ink:#302630}
*{box-sizing:border-box}html{background:var(--soft)}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--soft)}
.cover{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 25%,#ffffff 0,#ffffffaa 20%,transparent 55%),linear-gradient(145deg,var(--soft),#ece8ef)}
.cover.hide{opacity:0;visibility:hidden;pointer-events:none;transition:.7s}
.envelope{width:min(88vw,720px);aspect-ratio:1.55/1;position:relative;border-radius:24px;overflow:hidden;background:linear-gradient(145deg,var(--env2),var(--env1));box-shadow:0 30px 90px #2b1d2a44;cursor:pointer}
.envelope:before{content:"";position:absolute;inset:0;background:linear-gradient(150deg,#fff9,var(--env2));clip-path:polygon(0 0,50% 62%,100% 0);transform-origin:top;transition:1s}
.envelope:after{content:"";position:absolute;inset:0;background:#fff2;clip-path:polygon(0 100%,0 26%,50% 72%,100% 26%,100% 100%)}
.envelope.open:before{transform:rotateX(178deg);opacity:.14}.seal{position:absolute;z-index:4;left:50%;top:49%;transform:translate(-50%,-50%);width:145px;max-height:115px;object-fit:contain;border-radius:18px;filter:drop-shadow(0 10px 14px #0004)}
.open-label{position:absolute;z-index:5;left:50%;bottom:22px;transform:translateX(-50%);background:#fffdf4;padding:12px 20px;border-radius:14px;font-weight:900;box-shadow:0 8px 24px #0002;white-space:nowrap}.sound-note{text-align:center;margin-top:16px;font-weight:700;color:#504250}
.shell{max-width:760px;margin:auto;padding:18px}.invite{background:#fff;border-radius:32px;overflow:hidden;box-shadow:0 18px 70px #2b1c2b25}
.hero{height:min(76vh,710px);min-height:560px;background:url('assets/hero.jpg') center/cover no-repeat;position:relative}
.hero:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#000b)}
.heroText{position:absolute;z-index:2;left:28px;right:28px;bottom:28px;color:white;text-align:center}.kicker{letter-spacing:.22em;font-weight:900;font-size:13px}.heroText h1{font:italic 700 clamp(48px,10vw,82px) Georgia,serif;margin:8px 0}.heroText p{font:20px Georgia,serif;margin:8px auto;max-width:620px}
.content{padding:26px}.nav{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:18px}.nav button{border:0;background:var(--soft);padding:14px 6px;border-radius:15px;font-weight:900;font-size:11px;color:var(--ink)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.fact{background:#fff;border:1px solid #eee6ec;border-radius:18px;padding:16px;text-align:center}.fact small{display:block;opacity:.62;font-weight:800}.fact b{display:block;margin-top:6px;font-size:18px}
.count{margin:20px 0;border-radius:20px;background:linear-gradient(135deg,var(--accent),#44324e);padding:18px;color:white;text-align:center}.count b{display:block;font-size:27px;margin-top:4px}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.actions button{border:0;border-radius:15px;padding:14px;background:var(--accent);color:white;font-weight:900}.actions button:nth-child(even){background:#332b36}
.music{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:17px;background:var(--soft);margin:18px 0}.music button{border:0;background:var(--accent);color:#fff;padding:10px 14px;border-radius:12px;font-weight:900}
footer{text-align:center;padding:24px 14px 30px;font-weight:800}.small{font-size:12px;opacity:.62;margin-top:5px}
@media(max-width:650px){.shell{padding:0}.invite{border-radius:0}.hero{height:68vh}.nav{grid-template-columns:repeat(2,1fr)}.facts{grid-template-columns:1fr}.actions{grid-template-columns:1fr}.envelope{width:92vw}.seal{width:120px}}


/* ===== SOBRE V2: CSS PURO, SIN IMAGEN DE FONDO ===== */
.cover{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 22%,#fff 0,#ffffffb8 22%,transparent 56%),linear-gradient(145deg,var(--soft),#ece8ef);transition:opacity .16s ease}
.cover.hide{opacity:0;visibility:hidden;pointer-events:none}
.envelope{width:min(88vw,720px);aspect-ratio:1.55/1;position:relative;border-radius:26px;overflow:hidden;background:linear-gradient(145deg,var(--env2),var(--env1));box-shadow:0 30px 90px #2b1d2a44;cursor:pointer;border:1px solid #ffffff80}
.envelope:before{content:"";position:absolute;inset:0;background:linear-gradient(155deg,#ffffffb8,var(--env2));clip-path:polygon(0 0,50% 61%,100% 0);transform-origin:top;transition:transform .18s ease,opacity .18s ease}
.envelope:after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#ffffff25,#00000008);clip-path:polygon(0 100%,0 27%,50% 72%,100% 27%,100% 100%)}
.envelope.open:before{transform:rotateX(165deg);opacity:.18}
.seal-css{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#fff7 0 8%,transparent 9%),linear-gradient(145deg,var(--accent),#4c344d);border:5px double #fff8;box-shadow:0 12px 25px #0004,inset 0 0 0 5px #00000010;color:white;font:700 31px Georgia,serif;text-align:center;line-height:1}
.seal-css span{font-size:12px;letter-spacing:.12em;display:block;margin-top:2px}
.open-label{position:absolute;z-index:5;left:50%;bottom:22px;transform:translateX(-50%);background:#fffdf4;padding:12px 20px;border-radius:14px;font-weight:900;box-shadow:0 8px 24px #0002;white-space:nowrap}
.sound-note{text-align:center;margin-top:16px;font-weight:700;color:#504250}

/* PREMIUM COVER — only first screen changed */
.premium-cover{padding:0;background:#17131a;transition:opacity .08s ease}
.premium-card{height:100vh;width:min(100vw,760px);position:relative;cursor:pointer;overflow:hidden;background:#111;box-shadow:0 0 70px #0008}
.premium-card>img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.tap-zone{position:absolute;left:50%;bottom:5.5%;transform:translateX(-50%);padding:13px 23px;border:1px solid #ffffffaa;border-radius:999px;background:#251d26aa;backdrop-filter:blur(8px);color:#fff;font-weight:900;letter-spacing:.03em;box-shadow:0 8px 28px #0004;white-space:nowrap}
@media(max-width:650px){.premium-card{width:100vw}.premium-card>img{object-fit:cover}.tap-zone{font-size:13px;bottom:4.5%}}