:root{color-scheme:dark;--ink:#fffaff;--muted:#d5cde9;--mint:#97e4da;--violet:#b49af5;font-family:system-ui,sans-serif}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at 50% 9%,#50447b,transparent 60%),radial-gradient(circle at 85% 90%,#252a54,transparent 48%),#171631;color:var(--ink)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.45;background-image:radial-gradient(circle,#fff 1px,transparent 1.7px),radial-gradient(circle,var(--mint) 1px,transparent 1.8px);background-size:87px 103px,133px 157px;background-position:11px 19px,59px 75px}
.portal{position:relative;isolation:isolate;overflow:hidden;width:min(100%,31rem);padding:clamp(1.15rem,5vw,2.8rem);text-align:center;border:1px solid #b49af569;border-radius:2rem;background:linear-gradient(160deg,#302650f5,#1c1b39f5 60%);box-shadow:0 25px 80px #0b082a91}
.orbit{position:absolute;z-index:-1;top:2.3rem;left:50%;width:80%;height:8rem;border:1px solid #b49af55c;border-radius:50%;transform:translateX(-50%) rotate(-15deg);box-shadow:0 0 20px #b49af529}
.isotipo{display:block;margin:0 auto 1rem;padding:13px;object-fit:contain;border-radius:50%;background:#fff;box-shadow:0 0 40px #b49af567}
.tag,.foot{font-size:.68rem;font-weight:800;letter-spacing:.23em;color:var(--mint);margin:1.2rem 0 .6rem}
h1{font-size:clamp(2rem,8.4vw,3.25rem);line-height:1.04;letter-spacing:-.055em;margin:.4rem 0 .65rem}
h1 span{color:#e4caff}
.intro{color:var(--muted);margin:0 0 1.65rem}
.destinos{display:grid;gap:.75rem}
.destino{display:grid;grid-template-columns:1.5rem minmax(0,1fr) 1rem;gap:.75rem;align-items:center;width:100%;min-height:4.5rem;text-align:left;border:1px solid #a99bd988;border-radius:1rem;padding:.75rem .95rem;background:#282142;color:var(--ink);text-decoration:none;transition:transform .18s,background .18s}
.destino svg{width:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.destino strong,.destino small{display:block}
.destino small{margin-top:.2rem;font-size:.76rem;opacity:.86}
.destino b{text-align:right}
.principal{background:linear-gradient(115deg,#b49af5,#b4c3ff 60%,#97e4da);color:#231b41;border-color:transparent}
.destino[aria-disabled=true]{border-style:dashed;opacity:.8}
.destino[aria-disabled=true] b{visibility:hidden}
.destino[href]:hover,button:not(:disabled):hover{transform:translateY(-2px)}
:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
.foot{margin:1.5rem 0 0;color:var(--muted)}
.foot span{color:var(--mint);padding:0 .3rem}
.editor{text-align:left}
.editor form{display:grid;gap:.7rem}
.editor label{display:grid;gap:.3rem;font-weight:700}
.editor input{width:100%;font:inherit;padding:.7rem;border:1px solid #a99bd988;border-radius:.55rem;background:#1a172f;color:inherit}
.editor button{display:block;text-align:center;font:inherit;font-weight:800;cursor:pointer;margin-top:.45rem}
.editor button:disabled{opacity:.55;cursor:wait}
.editor a,.editor small{color:var(--mint)}
#resultado{margin:0 0 .6rem;min-height:1.5rem}
@media(prefers-reduced-motion:reduce){.destino{transition:none}}
.qr-world{display:block;padding:0;background:#19073b url('/assets/tarjeta-ar/cosmos-vertical.webp') center top/100% auto no-repeat;color:#fff8ff}
.qr-world::before{display:none}
.qr-header,.qr-main,.qr-footer{width:min(calc(100% - 34px),1050px);margin-inline:auto}
.qr-header{margin-top:14px;display:flex;justify-content:space-between;align-items:center;border:1px solid #e493f478;border-radius:20px;padding:7px 14px;background:#2a1253a6}
.qr-header a{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;font-weight:800}
.qr-header img{object-fit:contain}
.qr-shortcut{font-size:.83rem;color:#f1d8ff!important}
.qr-hero{text-align:center;display:grid;justify-items:center;padding:22px 0 18px}
.qr-hero h1{font-size:clamp(2.1rem,8vw,4.1rem);font-weight:900;text-transform:uppercase;margin:0 0 6px;letter-spacing:-.045em;line-height:1.06;text-wrap:balance}
.qr-mascot{width:min(63vw,265px);height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 0 18px #ef83e98a);margin:-4px 0 10px}
.qr-actions{width:min(100%,420px);display:grid;gap:11px}
.qr-cta{display:grid;align-items:center;grid-template-columns:1.7rem minmax(0,1fr) 1rem;gap:10px;min-height:58px;padding:8px 18px;text-align:center;border-radius:999px;color:white;text-decoration:none;font-size:clamp(.94rem,3.8vw,1.16rem);font-weight:900;border:2px solid #ffb6e6;transition:transform .16s}
.qr-cta:hover,.qr-socials a:hover,.qr-item:hover{transform:translateY(-3px)}
.qr-cta svg{width:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.qr-cta b{font-size:1.7rem;line-height:1}
.qr-ar{background:linear-gradient(#ec4caf,#a91471);box-shadow:0 0 23px #ef51aa57}
.qr-ar[aria-disabled=true]{opacity:.62}
.qr-web{background:linear-gradient(#34e0eb,#6be5eb);color:#12203f;border-color:#91f8ff;box-shadow:0 0 20px #57e8ed40}
.qr-socials{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:15px}
.qr-socials a{display:block;border-radius:50%;transition:transform .16s}
.qr-socials img{display:block;border-radius:50%}
.qr-gallery{text-align:center;padding:9px 0 21px;scroll-margin-top:20px}
.qr-gallery h2{font-size:clamp(1.66rem,6vw,2.7rem);margin:8px 0 18px;line-height:1.06;letter-spacing:-.045em}
.qr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.qr-item{display:grid;text-align:left;color:inherit;text-decoration:none;border:1px solid #c790ed;background:#2d1456;border-radius:16px;overflow:hidden;transition:transform .16s}
.qr-item img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#331a55}
.qr-item span{padding:8px 9px;font-size:clamp(.76rem,3.1vw,.98rem);font-weight:800;display:flex;justify-content:space-between;gap:5px}
.qr-item b,.qr-footer span{color:#76e9f1}
.qr-outline,.qr-order{display:block;width:fit-content;margin:17px auto 0;color:inherit;font-weight:800}
.qr-outline{border:1px solid #e0b8ff;border-radius:999px;text-decoration:none;padding:10px 17px}
.qr-order{font-size:.9rem;text-underline-offset:4px}
.qr-footer{text-align:center;color:#e9cff8;font-size:.8rem;padding:0 0 25px}
@media(min-width:720px){
  .qr-world{background-image:url('/assets/tarjeta-ar/cosmos-horizontal.webp');background-size:cover}
  .qr-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;align-items:center;max-width:950px;margin:auto;padding:55px 22px 42px;text-align:left}
  .qr-hero h1,.qr-actions,.qr-socials{grid-column:1;justify-self:start}
  .qr-mascot{grid-column:2;grid-row:1/4;width:min(100%,350px);margin:0}
  .qr-actions{margin-top:12px}
  .qr-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.qr-cta,.qr-socials a,.qr-item{transition:none}}
