/* ══════════════════════════════════════════════════════════════════════
   EEingresso — Camada de Design Premium (compartilhada por todas as telas)
   DNA da landing: moldura de galeria ✦, gradiente de marca, motion sutil,
   micro-interações. ADITIVO: só classes .ee-* + tokens — não conflita com
   o CSS de cada página. Princípio "Palco vs Bastidores": páginas de marca
   usam o visual expressivo; a ferramenta do dia a dia usa só o sutil.
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --ee-or:#E8631A; --ee-or-mid:#FF8A3D; --ee-or-lt:#FFB05C;
  --ee-brand:linear-gradient(120deg,#FFB05C 0%,#FF8A3D 52%,#E8631A 100%);
  --ee-line:rgba(26,26,26,.10);
}

/* ── Moldura de galeria (assinatura da landing) ── */
.ee-frame{position:fixed;inset:16px;border:1px solid var(--ee-line);pointer-events:none;z-index:1}
.ee-frame i{position:absolute;width:14px;height:14px;border:0 solid var(--ee-or)}
.ee-frame i:nth-child(1){top:-1px;left:-1px;border-width:1.5px 0 0 1.5px}
.ee-frame i:nth-child(2){top:-1px;right:-1px;border-width:1.5px 1.5px 0 0}
.ee-frame i:nth-child(3){bottom:-1px;left:-1px;border-width:0 0 1.5px 1.5px}
.ee-frame i:nth-child(4){bottom:-1px;right:-1px;border-width:0 1.5px 1.5px 0}
@media(max-width:760px){.ee-frame{inset:10px}}

/* ── Brilho de marca (atrás do conteúdo central) ── */
.ee-glow{position:fixed;left:50%;top:50%;width:540px;height:540px;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(232,99,26,.13),transparent 60%);pointer-events:none;z-index:0}

/* ── Kicker, gradiente de marca e assinatura ── */
.ee-kicker{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#9CA0A8;text-align:center;margin-bottom:16px}
.ee-grad{background:var(--ee-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:800}
.ee-foot{margin-top:22px;text-align:center;font-size:11px;color:#9CA0A8;letter-spacing:.02em}
.ee-foot .mk{color:var(--ee-or)}

/* ── Entrada suave (aplique no card principal) ── */
.ee-in{animation:eeIn .6s cubic-bezier(.2,.7,.3,1) both}
@keyframes eeIn{0%{opacity:0;transform:translateY(16px) scale(.985)}100%{opacity:1;transform:none}}

/* ── Micro-interação de toque (aplique .ee-press em botões) ── */
.ee-press{transition:transform .12s ease,box-shadow .22s ease,background .22s ease,border-color .2s ease}
.ee-press:active{transform:translateY(1px) scale(.99)}

/* ── Skeleton shimmer (loading premium) ── */
.ee-skeleton{position:relative;overflow:hidden;background:#EEEEF0;border-radius:8px}
.ee-skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:eeShine 1.3s infinite}
@keyframes eeShine{100%{transform:translateX(100%)}}

/* ── "Pop" de celebração (✓ sucesso) ── */
.ee-pop{animation:eePop .5s cubic-bezier(.2,1.5,.4,1) both}
@keyframes eePop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.12);opacity:1}100%{transform:scale(1)}}

@media(prefers-reduced-motion:reduce){
  .ee-in,.ee-pop{animation:none}
  .ee-skeleton::after{animation:none}
}