/* ============================================================
   V+ BRAND — camada oficial de marca (tokens + primitivos + cartão)
   Fonte da verdade da ID visual do Seja V+ (Valparaíso Adventure Park).
   Extraída das peças oficiais: cartão V+ 20 ANOS + aplicação corporativa V+.
   Estratégia: HÍBRIDO POR CONTEXTO — marketing usa a vibração oficial;
   painéis B2B herdam os tokens mas com aplicação sóbria.
   ============================================================ */
:root{
  /* ---- Gradientes oficiais (das peças) ---- */
  --grad-vplus:linear-gradient(168deg,#1ea0c4 0%,#56b94a 46%,#2f9e3f 80%,#0e7a3a 122%); /* teal→lima→verde — assinatura V+ */
  --grad-park:linear-gradient(150deg,#ffb43a 0%,#ff7a2f 52%,#f4541f 112%);              /* laranja→âmbar — parque */
  --grad-vplus-soft:linear-gradient(168deg,#e8f7f3 0%,#eef8e6 100%);                     /* versão clara p/ fundos B2B */

  /* ---- O "+" device (azul-royal com contorno branco) ---- */
  --plus-blue:#1e3fa0;
  --plus-blue-2:#2b50bd;
  --plus-stroke:#ffffff;

  /* ---- Halftone (textura de meio-tom das peças) ---- */
  --halftone:radial-gradient(circle, rgba(0,0,0,.17) 1.1px, transparent 1.6px);
  --halftone-size:9px 9px;
}

/* ============================================================
   PRIMITIVOS GRÁFICOS reutilizáveis
   ============================================================ */
.bg-halftone{background-image:var(--halftone);background-size:var(--halftone-size)}
.grad-vplus{background:var(--grad-vplus)}
.grad-park{background:var(--grad-park)}
/* Blob orgânico (contêiner de texto das peças) */
.vp-blob{border-radius:42% 58% 56% 44% / 56% 44% 56% 44%}

/* ============================================================
   CARTÃO V+ 3D — ARTE REAL (frente única), por nível
   Usa a arte oficial renderizada do PDF (assets/card-*.png) como face,
   com inclinação 3D ao mouse. Sem verso/flip — fidelidade total.
   Estrutura: .vplus-stage > .vplus-card[.is-verde|is-ouro|is-black] (> .vplus-card__glare)
              [ + .vplus-card-cap opcional com dados do membro ]
   ============================================================ */
.vplus-stage{perspective:1150px;perspective-origin:50% 36%;display:flex;flex-direction:column;gap:13px;align-items:flex-start}
.vplus-card{
  position:relative;width:min(392px,86vw);aspect-ratio:1000/631;
  border-radius:6.2% / 9.8%;                 /* cantos do cartão físico (die-cut) */
  transform-style:preserve-3d;cursor:pointer;
  transform:rotateX(6deg) rotateY(-12deg);
  transition:transform .55s cubic-bezier(.22,.72,.16,1);
  will-change:transform;
  background-size:cover;background-position:center;background-repeat:no-repeat;background-color:#0b3;
  box-shadow:0 34px 58px -26px rgba(6,30,18,.6),0 12px 24px -14px rgba(6,30,18,.5);
}
.vplus-card.is-live{transition:transform .08s ease-out}
/* background-color = cor EXATA da borda da arte → preenche o canto arredondado (sem branco) */
.vplus-card.is-verde{background-image:url("assets/card-verde.png?v=4");background-color:#80cd3f}
.vplus-card.is-ouro{background-image:url("assets/card-ouro.png?v=4");background-color:#f25333}
.vplus-card.is-black{background-image:url("assets/card-black.png?v=4");background-color:#131012}

/* brilho/realce que segue o mouse no tilt */
.vplus-card__glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s;
  background:radial-gradient(circle 160px at var(--gx,50%) var(--gy,36%),rgba(255,255,255,.32),rgba(255,255,255,.06) 46%,transparent 64%)}
.vplus-card.is-live .vplus-card__glare{opacity:1}
/* (borda interna branca removida — os cantos do PNG agora são transparentes) */

/* legenda opcional com dados do membro (abaixo do cartão; não toca a arte) */
.vplus-card-cap{font-family:"BloggerSans","Inter",sans-serif;line-height:1.18;padding-left:2px}
.vplus-card-cap b{display:block;font-weight:700;font-size:16px;color:var(--ink,#0e2a1a)}
.vplus-card-cap span{font-size:12.5px;color:var(--slate,#5b6b85);font-variant-numeric:tabular-nums}

@media (hover:none){.vplus-card{transform:rotateX(5deg) rotateY(-9deg)}}
@media (prefers-reduced-motion:reduce){.vplus-card{transition:none}.vplus-card__glare{display:none}}
