:root{
  --bg1:#f6eefd; --bg2:#e8dbf8; --plum:#3f3560; --plum2:#5b4a7d;
  --lilac:#a58bcf; --pill:#bba8dc; --line:#c9b6e6;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;color:var(--plum);line-height:1.5;
  font-family:"Jost","Avenir Next","Segoe UI",system-ui,sans-serif;font-weight:400;
  background:linear-gradient(160deg,var(--bg1),var(--bg2) 60%,#f1e6fb)}
a{color:inherit}
.marco{max-width:1000px;margin:1.1rem auto;padding:clamp(1.2rem,4vw,2.5rem);
  border:1px solid var(--line);border-radius:6px;
  box-shadow:0 0 0 6px var(--bg1),0 0 0 7px var(--line);
  width:calc(100% - 2.2rem)}
.hero{text-align:center;padding:1rem 0 .5rem}
.frasco{color:var(--plum2)}
h1{margin:.4rem 0 0;font-family:"Bodoni Moda",Georgia,"Times New Roman",serif;font-weight:700;line-height:0}
h1 span{display:block}
.logo{display:block;width:min(100%,360px);height:auto;margin:0 auto}
.secret{color:var(--plum);font-size:clamp(3.2rem,15vw,6.6rem);letter-spacing:.02em}
.poison{color:var(--lilac);font-size:clamp(2.2rem,10vw,4.4rem);letter-spacing:.03em}
.sub-hero{margin:1rem 0 .2rem;font-size:clamp(1.6rem,6vw,2.3rem);font-weight:300}
.sub-hero small{display:block;font-size:.5em}
.redes{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.4rem;
  margin:.8rem 0 0;padding:.45rem 1.6rem;background:var(--pill);border-radius:12px}
.redes a{text-decoration:none}
.redes a:hover,.pie a:hover{text-decoration:underline}
.grid{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}
.card{padding:1rem;background:rgba(255,255,255,.55);border:1px solid var(--line);border-radius:16px}
.foto{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,#efe3fb,#dcc9f3);color:var(--lilac);font-size:2.2rem}
.foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.titulo{display:inline-block;margin:.9rem 0 .5rem;padding:.3rem 1.1rem;background:var(--plum2);color:#fff;
  font-size:1.25rem;font-weight:400;border-radius:10px}
.sublabel{display:inline-block;margin:.8rem 0 .2rem;padding:.15rem .8rem;background:var(--pill);
  font-size:.85rem;border-radius:8px}
.fila{display:flex;align-items:baseline;gap:.5rem;padding:.25rem .5rem;border-radius:8px;
  font-size:1.1rem;text-decoration:none}
.fila .puntos{flex:1;border-bottom:2px dotted var(--line);transform:translateY(-.25em)}
.fila .precio{font-weight:500}
.fila:hover{background:rgba(91,74,125,.1)}
.fila:focus-visible,.redes a:focus-visible,.pie a:focus-visible{outline:2px solid var(--plum2);outline-offset:2px}
.sub .fila{font-size:1rem}
.pie{margin-top:2rem;text-align:center;font-size:.95rem}
.aviso{margin:1.6rem 0 1.4rem;text-align:center;font-size:.95rem}
.nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin:1rem 0 0}
.nav a{padding:.35rem 1.2rem;border-radius:10px;background:rgba(187,168,220,.45);text-decoration:none;font-size:1.05rem}
.nav a:hover{background:var(--pill)}
.nav a[aria-current="page"],.nav a[aria-current="page"]:hover{background:var(--plum2);color:#fff}
.nav a:focus-visible{outline:2px solid var(--plum2);outline-offset:2px}
