:root{
  --bg:#0d0d0f;
  --card:#151518;
  --ink:#f2f0ea;
  --muted:#9a968e;
  --line:rgba(242,240,234,.10);
  --red:#e01b24;
  --red-strong:#ff2e38;
  --radius:18px;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Archivo',system-ui,sans-serif;
  background:radial-gradient(900px 500px at 50% -80px,#1a1416 0%,var(--bg) 62%) fixed,var(--bg);
  color:var(--ink);min-height:100vh;
  display:flex;flex-direction:column;align-items:center;
  padding:0 0 48px;
}
/* HERO em vídeo no topo */
.hero{
  position:relative;
  width:100%;
  height:31vh;min-height:240px;max-height:400px;
  margin:0;overflow:hidden;
  background:#0b0b0c url("poster.jpg") center 50% / cover no-repeat;
}
.hero video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center 50%;
  display:block;
}
.hero-shade{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(8,8,9,.42) 0%, rgba(8,8,9,.08) 30%, rgba(13,13,15,.16) 60%, var(--bg) 100%);
}
/* marca d'água girada — desce pro lado dos botões pra não cruzar a logo */
.bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.bg-tag{
  position:absolute;top:62%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);
  font-weight:900;font-size:22vh;letter-spacing:.02em;white-space:nowrap;
  color:transparent;-webkit-text-stroke:1px rgba(224,27,36,.09);
}
.wrap{width:100%;max-width:480px;position:relative;z-index:1;display:flex;flex-direction:column;gap:18px;padding:0 16px}
.profile{position:relative;z-index:2;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:-124px;padding-top:0}
/* logo solta, sem bordas/margens — giro automático a cada 5s */
.logo-float{
  background:none;border:0;padding:0;box-shadow:none;
  perspective:700px;transform-style:preserve-3d;
}
.logo-float img{
  width:min(230px,64vw);height:auto;max-height:230px;object-fit:contain;display:block;
  background:none!important;border:none!important;border-radius:0!important;box-shadow:none!important;
  filter:drop-shadow(0 16px 28px rgba(0,0,0,.6)) drop-shadow(0 0 34px rgba(224,27,36,.35));
  animation:float 4.5s ease-in-out infinite;
}
.logo-float{
  transform-style:preserve-3d;
  animation:giroAuto 5s cubic-bezier(.45,.05,.35,.95) infinite;
  will-change:transform;
}
@keyframes giroAuto{
  0%{transform:rotateY(0deg)}
  38%{transform:rotateY(360deg)}
  100%{transform:rotateY(360deg)}
}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -9px}}
.handle{color:var(--ink);font-weight:700;text-decoration:none;font-size:15px;opacity:.9}
.handle:hover{color:var(--red-strong);text-decoration:underline}
.bio{color:var(--muted);font-size:14px;font-weight:500}
.titulo-canal{font-size:1rem;font-weight:800;letter-spacing:.01em;margin-top:10px;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.titulo-canal b{color:var(--red-strong);font-weight:800}
/* botões — cartões escuros, chip vermelho */
.links{display:flex;flex-direction:column;gap:12px}
.btn{
  display:flex;align-items:center;gap:13px;background:var(--card);color:var(--ink);
  border-radius:var(--radius);padding:13px 15px;text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease;
  box-shadow:0 10px 26px rgba(0,0,0,.35);
  border:1px solid var(--line);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(0,0,0,.5),0 0 22px rgba(224,27,36,.14)}
.btn .ico{
  width:46px;height:46px;flex:0 0 46px;border-radius:14px;
  background:#1e1e22;color:var(--ink);
  display:flex;align-items:center;justify-content:center;font-size:20px;
  transition:transform .18s ease,box-shadow .18s ease;
}
.btn:hover .ico{transform:translateY(-1px) scale(1.05)}
.btn .ico-red{background:var(--red);color:#fff;box-shadow:0 6px 16px rgba(224,27,36,.35)}
.btn .txt{flex:1;display:flex;flex-direction:column;gap:2px;text-align:left;min-width:0}
.btn .txt strong{font-size:15.5px;font-weight:800}
.btn .txt small{font-size:12.5px;color:var(--muted);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.btn .arrow{color:var(--ink);opacity:.3;font-size:14px;transition:opacity .18s,transform .18s}
.btn:hover .arrow{opacity:.9;transform:translateX(3px);color:var(--red-strong)}
/* destaque Grupo: borda vermelha */
.btn-star{border:2px solid var(--red);box-shadow:0 10px 26px rgba(0,0,0,.35),0 0 26px rgba(224,27,36,.22)}
.btn-star:hover{box-shadow:0 16px 32px rgba(0,0,0,.5),0 0 34px rgba(224,27,36,.3)}
/* card do site com miniatura embutida */
.btn-site{flex-direction:column;padding:0;overflow:hidden;align-items:stretch}
.btn-site .thumb{display:block;width:100%;position:relative}
.btn-site .thumb img{display:block;width:100%;height:auto}
.btn-site .row-part{
  width:100%;display:flex;align-items:center;gap:13px;
  padding:13px 15px;border-top:1px solid var(--line);
}
.btn-site:hover{border-color:rgba(224,27,36,.55);box-shadow:0 16px 32px rgba(0,0,0,.5),0 0 26px rgba(224,27,36,.2)}
.dots{display:flex;gap:8px;justify-content:center;padding:4px 0}
.dots span{width:6px;height:6px;border-radius:50%;background:#3a3a3e}
.dots span:nth-child(2){background:var(--red)}
/* seção da loja */
.store{
  border:1px solid var(--line);border-radius:22px;padding:18px;background:var(--card);
  box-shadow:0 10px 26px rgba(0,0,0,.3);
}
.kicker{display:block;font-size:.66rem;font-weight:900;letter-spacing:.24em;color:var(--red-strong);margin-bottom:6px}
.store h2{font-size:16px;font-weight:800;margin-bottom:4px;display:flex;align-items:center;gap:8px}
.store-logo{height:26px;width:auto;object-fit:contain;display:inline-block;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.store p{color:var(--muted);font-size:13.5px;margin-bottom:12px;line-height:1.5}
.map{border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.map iframe{width:100%;height:220px;border:0;display:block;filter:grayscale(1) contrast(1.08) brightness(.85)}
.btn-visit{margin-top:12px}
/* sociais rodadas */
.social{display:flex;gap:12px;justify-content:center}
.social a{
  width:48px;height:48px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink);font-size:20px;
  background:var(--card);text-decoration:none;transition:transform .18s,background .18s,color .18s;
}
.social a:hover{transform:translateY(-2px);background:var(--red);color:#fff}
footer{text-align:center;color:var(--muted);font-size:12px;padding-top:4px}
.reveal{opacity:0;transform:translateY(16px);animation:up .6s ease forwards}
.links .btn:nth-child(1){animation-delay:.05s}.links .btn:nth-child(2){animation-delay:.12s}
.links .btn:nth-child(3){animation-delay:.19s}.links .btn:nth-child(4){animation-delay:.26s}
.links .btn:nth-child(5){animation-delay:.33s}.links .btn:nth-child(6){animation-delay:.40s}
@keyframes up{to{opacity:1;transform:none}}
@media(max-width:380px){.logo-float img{width:min(200px,62vw)}.hero{min-height:220px}}
@media (prefers-reduced-motion:reduce){
  .logo-float,.logo-float img,.reveal{animation:none}
  .logo-float{transform:none}
  .reveal{opacity:1;transform:none}
}
