/* =========================================================
   SITI — landing · 7. overlays: cartelera de eventos y trivia
   Entran como cortina desde abajo con clip-path.
   ========================================================= */
.sheet{
  position:fixed;inset:0;z-index:850;background:var(--bg);
  overflow-y:auto;overscroll-behavior:contain;
  clip-path:inset(100% 0 0 0);visibility:hidden;
  transition:clip-path .8s var(--ease),visibility 0s .8s;
}
.sheet.is-open{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .8s var(--ease)}
.sheet__in{position:relative;padding-block:clamp(90px,12vh,130px) 80px;min-height:100%}
.sheet__in > *{opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease),transform .8s var(--ease)}
.sheet.is-open .sheet__in > *{opacity:1;transform:none;transition-delay:.25s}

.sheet__head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:clamp(36px,5vw,60px)}
.sheet__close{
  display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:99px;
  border:1px solid var(--line-2);background:var(--card);
  transition:transform .5s var(--ease),border-color .4s,color .4s;
}
.sheet__close .lucide{width:22px;height:22px}
.sheet__close:hover{transform:rotate(90deg);border-color:var(--ink);color:var(--ink)}
.sheet__close--float{position:absolute;top:28px;right:var(--pad);z-index:3}

/* ---------- eventos ---------- */
.events{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.event{
  display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r);
  border:1px solid var(--line);background:var(--surface);
  transition:transform .6s var(--ease),box-shadow .5s,border-color .5s;
}
.event:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2)}
.event__media{position:relative;aspect-ratio:16/10;overflow:hidden}
.event__media img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.event:hover .event__media img{transform:scale(1.06)}
.event__shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent 60%)}
.event__meta{position:absolute;left:16px;right:16px;bottom:14px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;color:#fff}
.event__date{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:600;opacity:.92}
.event__body{display:flex;flex-direction:column;flex:1;padding:22px}
.event__body h3{font-family:var(--f-dis);font-size:1.25rem;font-weight:800;letter-spacing:-.02em;line-height:1.2;margin-bottom:10px;transition:color .3s}
.event:hover h3{color:var(--ink)}
.event__body p{
  color:var(--muted);font-size:.92rem;line-height:1.6;margin-bottom:20px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.event__body footer{margin-top:auto;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-top:16px;border-top:1px solid var(--line)}
.event__more{display:inline-flex;align-items:center;gap:6px;color:var(--ink);font-family:var(--f-dis);font-weight:700;font-size:.9rem}
.event__price{order:-1;font-family:var(--f-mono);font-size:.7rem;line-height:1.5;padding:5px 10px;border-radius:8px;background:var(--bg-2);color:var(--muted)}

.empty{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;
  padding:80px 24px;border:1px dashed var(--line-2);border-radius:28px;background:var(--card);
}
.empty > .lucide{width:54px;height:54px;color:var(--muted);margin-bottom:10px}
.empty h3{font-family:var(--f-dis);font-size:1.6rem;font-weight:800;letter-spacing:-.03em}
.empty p{color:var(--muted);max-width:44ch}

/* ---------- trivia ---------- */
.trivia{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:center;min-height:calc(100svh - 220px)}
.trivia .label > span{color:#8b5cf6;border-color:rgba(139,92,246,.35)}
.grad{background:linear-gradient(90deg,#8b5cf6,#ec4899);-webkit-background-clip:text;background-clip:text;color:transparent}
.trivia .muted{margin:22px 0 30px}
.trivia__list{display:grid;gap:12px;margin-bottom:34px}
.trivia__list li{
  display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;
  border:1px solid var(--line);background:var(--card);font-weight:700;
  transition:border-color .4s,transform .5s var(--ease);
}
.trivia__list li:hover{border-color:rgba(139,92,246,.45);transform:translateX(6px)}
.trivia__list li > span{display:grid;place-items:center;width:40px;height:40px;border-radius:99px;background:rgba(139,92,246,.12);color:#8b5cf6}

.trivia__stage{
  position:relative;aspect-ratio:4/5;border-radius:32px;overflow:hidden;isolation:isolate;
  display:grid;place-items:center;padding:28px;
  background:linear-gradient(135deg,#2e1065,#4c1d95 50%,#701a75);
}
.trivia__orb{position:absolute;z-index:-1;width:60%;aspect-ratio:1;border-radius:50%;filter:blur(90px);opacity:.5}
.trivia__orb--a{background:#ec4899;right:-15%;top:-15%}
.trivia__orb--b{background:#3b82f6;left:-15%;bottom:-15%}

.quiz{
  width:100%;max-width:380px;padding:24px;border-radius:26px;color:#fff;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.5);
  animation:float 7s ease-in-out infinite;
}
.quiz__head{text-align:center;margin-bottom:20px}
.quiz__head .tag{margin-bottom:12px}
.quiz__head h3{font-family:var(--f-dis);font-size:clamp(1.3rem,2.2vw,1.7rem);font-weight:800;line-height:1.2;letter-spacing:-.02em}
.quiz__opt{
  display:flex;justify-content:space-between;align-items:center;margin-top:10px;
  padding:14px 18px;border-radius:14px;font-weight:700;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.75);
}
.quiz__opt > i{width:18px;height:18px;border-radius:99px;border:1px solid rgba(255,255,255,.3)}
.quiz__opt.is-right{background:rgba(34,197,94,.22);border-color:rgba(34,197,94,.55);color:#fff;box-shadow:0 0 24px rgba(34,197,94,.25)}
.quiz__opt.is-right .lucide{color:#4ade80}
.quiz__foot{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-size:.78rem}
.quiz__prize{display:flex;align-items:center;gap:10px;font-weight:700}
.quiz__prize > .lucide{width:32px;height:32px;padding:7px;border-radius:99px;background:linear-gradient(135deg,#facc15,#f97316)}
.quiz__prize small{display:block;font-family:var(--f-mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.quiz__timer{display:inline-flex;align-items:center;gap:5px;opacity:.7;font-variant-numeric:tabular-nums}

@media (max-width:1080px){ .events{grid-template-columns:1fr 1fr} }
@media (max-width:860px){
  .trivia{grid-template-columns:1fr;min-height:0}
  .trivia__stage{aspect-ratio:1;order:-1}
}
@media (max-width:560px){
  .events{grid-template-columns:1fr}
  .sheet__close{width:48px;height:48px}
  .sheet__close--float{top:18px}
  .trivia__stage{aspect-ratio:4/5}
}