/* Tina Show: rosa chiclete do cabelo da boneca como cor principal */
:root{
  --rosa:#F2559A;          /* rosa chiclete */
  --rosa-forte:#D92C7A;
  --rosa-claro:#FFD3E6;
  --rosa-bebe:#FFF0F7;
  --lilas:#B7A3F0;
  --lilas-claro:#EEE8FF;
  --roxo:#8E3FB0;
  --amarelo:#FFD23F;
  --verde:#4CB648;
  --azul:#3E7FD8;
  --vermelho:#E53935;
  --tinta:#3A1236;          /* texto */
  --tinta-suave:#6E4A6A;
  --raio:28px;
  --sombra:0 14px 34px rgba(170,30,100,.18);
  --fonte-titulo:"Fredoka",system-ui,sans-serif;
  --fonte-texto:"Nunito",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:var(--fonte-texto);color:var(--tinta);background:var(--rosa-bebe);line-height:1.6;font-size:17px;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--fonte-titulo);line-height:1.12;font-weight:700}
h2{font-size:clamp(2rem,4.4vw,3.1rem);margin-bottom:.6rem}
h3{font-size:1.35rem}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-family:var(--fonte-titulo);font-weight:600;font-size:1.05rem;
  text-decoration:none;padding:.85rem 1.6rem;border-radius:999px;border:3px solid transparent;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 6px 0 rgba(0,0,0,.12)}
.btn:hover{transform:translateY(-3px) rotate(-1deg);box-shadow:0 10px 0 rgba(0,0,0,.12)}
.btn--amarelo{background:var(--amarelo);color:var(--tinta)}
.btn--branco{background:#fff;color:var(--rosa-forte)}
.btn--rosa{background:var(--rosa);color:#fff}
.btn--contorno{background:transparent;border-color:#fff;color:#fff;box-shadow:none}

/* ---------- topo ---------- */
.topo{position:sticky;top:0;z-index:50;background:var(--rosa);box-shadow:0 4px 18px rgba(160,20,90,.25)}
.topo__in{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:.55rem 20px}
.topo__logo img{height:56px;width:auto;filter:drop-shadow(0 3px 0 rgba(0,0,0,.12))}
.menu{display:flex;align-items:center;gap:1.4rem}
.menu a{font-family:var(--fonte-titulo);font-weight:600;color:#fff;text-decoration:none;font-size:1.05rem}
.menu a:not(.btn):hover{text-decoration:underline wavy var(--amarelo) 2px;text-underline-offset:6px}
.menu a.menu__cta{padding:.55rem 1.2rem;font-size:1rem;color:var(--rosa-forte)}
.menu__abrir{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;flex-direction:column;justify-content:center;gap:6px;padding:8px}
.menu__abrir span{display:block;height:4px;border-radius:4px;background:#fff;transition:.3s}

/* ---------- hero ---------- */
.hero{position:relative;background:radial-gradient(circle at 15% 20%,#FF8CC0 0,transparent 40%),radial-gradient(circle at 90% 80%,#C9A8FF 0,transparent 45%),var(--rosa);color:#fff;padding:56px 20px 120px;overflow:hidden}
.confete{position:absolute;inset:0;background-image:
  radial-gradient(circle,var(--amarelo) 0 7px,transparent 8px),
  radial-gradient(circle,#fff 0 5px,transparent 6px),
  radial-gradient(circle,var(--lilas) 0 9px,transparent 10px),
  radial-gradient(circle,#7FD6FF 0 6px,transparent 7px);
  background-size:260px 230px,190px 210px,330px 300px,280px 250px;
  background-position:20px 40px,120px 10px,60px 160px,200px 90px;opacity:.55;animation:flutua 18s linear infinite}
@keyframes flutua{to{background-position:20px 270px,120px 220px,60px 460px,200px 340px}}
.hero__in{position:relative;max-width:1240px;margin:auto;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.selo{display:inline-block;background:rgba(255,255,255,.22);border:2px dashed rgba(255,255,255,.7);padding:.35rem 1rem;border-radius:999px;font-weight:800;font-size:.9rem;margin-bottom:1.1rem}
.hero h1{font-size:clamp(2.5rem,5.6vw,4.4rem);text-shadow:0 4px 0 rgba(150,20,90,.35);margin-bottom:1rem}
.hero h1 em{font-style:normal;color:var(--amarelo);display:block}
.hero p{font-size:1.18rem;max-width:34ch;margin-bottom:1.8rem;font-weight:600}
.hero__btns{display:flex;flex-wrap:wrap;gap:14px}
.hero__fotos{position:relative;aspect-ratio:1/1.02;max-width:540px;justify-self:center;width:100%}
.slides{position:absolute;inset:0;border-radius:46% 54% 42% 58%/52% 44% 56% 48%;overflow:hidden;border:10px solid #fff;box-shadow:0 22px 50px rgba(120,10,70,.35);animation:blob 12s ease-in-out infinite alternate}
@keyframes blob{to{border-radius:58% 42% 55% 45%/44% 58% 42% 56%}}
.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s}
.slides img.ativo{opacity:1}
.hero__boneca{position:absolute;width:38%;aspect-ratio:1;object-fit:cover;object-position:34% 28%;border-radius:50%;border:7px solid var(--amarelo);left:-8%;bottom:-6%;box-shadow:var(--sombra);animation:pula 3.5s ease-in-out infinite}
@keyframes pula{50%{transform:translateY(-12px) rotate(-4deg)}}
.balao{position:absolute;background:#fff;color:var(--rosa-forte);font-family:var(--fonte-titulo);font-weight:700;padding:.5rem 1rem;border-radius:18px;box-shadow:var(--sombra);font-size:1rem;white-space:nowrap}
.balao--1{top:6%;right:-4%;transform:rotate(5deg)}
.balao--2{bottom:12%;right:-2%;background:var(--amarelo);color:var(--tinta);transform:rotate(-6deg)}
.onda{position:absolute;bottom:-1px;left:0;width:100%;height:90px;fill:var(--amarelo)}

/* ---------- faixa ---------- */
.faixa{background:var(--amarelo);overflow:hidden;padding:.75rem 0;border-bottom:4px solid var(--rosa-forte)}
.faixa__trilho{display:flex;gap:2.4rem;width:max-content;animation:corre 28s linear infinite}
.faixa span{font-family:var(--fonte-titulo);font-weight:700;font-size:1.3rem;color:var(--tinta);white-space:nowrap}
.faixa span::after{content:"✦";margin-left:2.4rem;color:var(--rosa-forte)}
@keyframes corre{to{transform:translateX(-50%)}}

/* ---------- seções ---------- */
.sec{padding:90px 20px}
.sec__in{max-width:1240px;margin:auto}
.kicker{display:inline-block;font-family:var(--fonte-titulo);font-weight:600;color:var(--rosa-forte);background:var(--rosa-claro);padding:.3rem .95rem;border-radius:999px;margin-bottom:.9rem;font-size:.95rem}
.kicker--claro{background:rgba(255,255,255,.25);color:#fff}
.sec__lead{font-size:1.15rem;max-width:62ch;color:var(--tinta-suave);margin-bottom:2.2rem}

/* sobre */
.sobre__in{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}
.sobre__foto{position:relative}
.sobre__foto img{border-radius:var(--raio);transform:rotate(-3deg);box-shadow:var(--sombra);border:8px solid #fff;aspect-ratio:4/5;object-fit:cover;width:100%}
.adesivo{position:absolute;right:-14px;bottom:30px;background:var(--rosa);color:#fff;font-family:var(--fonte-titulo);font-weight:700;padding:.7rem 1.1rem;border-radius:20px;transform:rotate(6deg);box-shadow:var(--sombra)}
.sobre__texto h2{color:var(--rosa-forte)}
.sobre__texto p{margin-bottom:1rem}
.destaque{font-family:var(--fonte-titulo);font-size:1.35rem;color:var(--roxo);font-weight:600}
.numeros{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:1.6rem}
.numeros li{background:#fff;border-radius:20px;padding:1rem .6rem;text-align:center;box-shadow:0 6px 0 var(--rosa-claro)}
.numeros b{display:block;font-family:var(--fonte-titulo);font-size:1.7rem;color:var(--rosa)}
.numeros span{font-size:.85rem;font-weight:700;color:var(--tinta-suave)}

/* propósito */
.proposito{background:linear-gradient(135deg,var(--roxo),#C04FA0 55%,var(--rosa));color:#fff;border-radius:60px 60px 0 0}
.proposito .sec__lead{color:#FFE6F2}
.cards-icone{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cards-icone div{background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.3);border-radius:22px;padding:1.2rem;font-family:var(--fonte-titulo);font-weight:600;font-size:1.12rem;display:flex;align-items:center;gap:.7rem;transition:transform .25s,background .25s}
.cards-icone div:hover{transform:translateY(-5px) rotate(-1.5deg);background:rgba(255,255,255,.24)}
.cards-icone i{font-style:normal;font-size:2rem}
.temas{margin:2.4rem 0 2rem;display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.temas p{font-weight:800}
.temas ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.temas li{background:#fff;color:var(--tinta);padding:.4rem 1rem;border-radius:999px;font-weight:700}
.ouvir{display:flex;flex-wrap:wrap;gap:14px}

/* shows */
.shows{background:var(--rosa-bebe)}
.shows h2{color:var(--rosa-forte)}
.filtros{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:2rem}
.filtros button{font-family:var(--fonte-titulo);font-weight:600;font-size:1rem;border:3px solid var(--rosa);background:#fff;color:var(--rosa-forte);padding:.5rem 1.1rem;border-radius:999px;cursor:pointer}
.filtros button.ativo{background:var(--rosa);color:#fff}
.grade-shows{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.show{background:#fff;border-radius:var(--raio);overflow:hidden;box-shadow:var(--sombra);display:flex;flex-direction:column;transition:transform .25s}
.show:hover{transform:translateY(-8px) rotate(-.6deg)}
.show img{aspect-ratio:4/3;object-fit:cover;width:100%;object-position:center 25%}
.show__txt{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.show__txt p{color:var(--tinta-suave);flex:1}
.show__txt a{font-family:var(--fonte-titulo);font-weight:700;color:var(--rosa-forte);text-decoration:none}
.show__txt a:hover{text-decoration:underline}
.show.oculto{display:none}
.tag{align-self:flex-start;font-size:.8rem;font-weight:800;padding:.2rem .7rem;border-radius:999px;color:#fff}
.tag--rosa{background:var(--rosa)}.tag--vermelho{background:var(--vermelho)}.tag--roxo{background:var(--roxo)}
.tag--amarelo{background:var(--amarelo);color:var(--tinta)}.tag--verde{background:var(--verde)}.tag--azul{background:var(--azul)}

/* palestra */
.palestra{background:var(--lilas-claro)}
.palestra__in{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.palestra h2{color:var(--roxo)}
.palestra p{margin-bottom:1rem}
.aviso{background:#fff;border-left:8px solid var(--amarelo);border-radius:16px;padding:1rem 1.2rem;margin:1.4rem 0 1.8rem;font-weight:600}
.palestra__foto img{border-radius:50% 50% var(--raio) var(--raio);border:8px solid #fff;box-shadow:var(--sombra);aspect-ratio:1;object-fit:cover;width:100%}

/* vídeos */
.videos{background:var(--rosa);color:#fff}
.grade-videos{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:1.6rem}
.grade-videos figure{background:#fff;border-radius:24px;padding:8px;box-shadow:0 12px 0 var(--rosa-forte)}
.grade-videos video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:18px;background:#000}
.grade-videos figcaption{color:var(--rosa-forte);font-family:var(--fonte-titulo);font-weight:600;text-align:center;padding:.6rem .3rem .3rem}

/* galeria */
.galeria h2{color:var(--rosa-forte)}
.mosaico{columns:4 220px;column-gap:16px;margin-top:1.6rem}
.mosaico img{width:100%;margin-bottom:16px;border-radius:22px;break-inside:avoid;box-shadow:0 8px 20px rgba(170,30,100,.15);transition:transform .25s}
.mosaico img:hover{transform:scale(1.03) rotate(1deg)}

/* redes */
.redes{background:var(--amarelo);text-align:center;padding:60px 20px}
.redes__links{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-top:1.2rem}
.rede{min-width:220px;text-decoration:none;color:#fff;padding:1.1rem 1.6rem;border-radius:24px;display:flex;flex-direction:column;box-shadow:0 8px 0 rgba(0,0,0,.15);transition:transform .2s}
.rede:hover{transform:translateY(-4px)}
.rede b{font-family:var(--fonte-titulo);font-size:1.4rem}
.rede--insta{background:linear-gradient(45deg,#F9A13A,#E1306C 50%,#8A3AB9)}
.rede--yt{background:#E62117}
.rede--spot{background:#1DB954}

/* contato */
.contato{background:linear-gradient(160deg,var(--rosa),var(--rosa-forte));color:#fff}
.contato__in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.contato__info p{margin-bottom:1.6rem;font-size:1.1rem}
.contato__item{display:flex;align-items:center;gap:14px;text-decoration:none;background:rgba(255,255,255,.16);padding:.9rem 1.1rem;border-radius:20px;margin-bottom:12px;font-family:var(--fonte-titulo);font-weight:600;font-size:1.15rem;transition:background .2s}
.contato__item:hover{background:rgba(255,255,255,.28)}
.contato__item small{display:block;font-family:var(--fonte-texto);font-size:.8rem;font-weight:700;opacity:.85}
.ic{font-size:1.6rem;background:#fff;border-radius:50%;width:48px;height:48px;display:grid;place-items:center;flex:none}
.form{background:#fff;color:var(--tinta);border-radius:var(--raio);padding:2rem;box-shadow:0 20px 40px rgba(90,0,50,.3);display:grid;gap:.9rem}
.form h3{color:var(--rosa-forte);font-size:1.6rem}
.form label{display:grid;gap:.3rem;font-weight:800;font-size:.95rem}
.form input,.form select,.form textarea{font:inherit;font-weight:600;border:3px solid var(--rosa-claro);border-radius:14px;padding:.7rem .9rem;background:var(--rosa-bebe);color:var(--tinta);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--rosa)}

/* rodapé */
.rodape{background:#7A1550;color:#F7D9E8;text-align:center;padding:50px 20px 90px}
.rodape__in{max-width:900px;margin:auto;display:grid;gap:1.2rem;justify-items:center}
.rodape__logo{height:70px;width:auto}
.rodape__menu{display:flex;flex-wrap:wrap;justify-content:center;gap:1.4rem}
.rodape__menu a{text-decoration:none;font-family:var(--fonte-titulo);font-weight:600}
.rodape__menu a:hover{color:var(--amarelo)}
.rodape__dados{font-size:.92rem;line-height:1.8}
.rodape__copy{font-size:.85rem;opacity:.7}

/* botão flutuante */
.zap{position:fixed;right:20px;bottom:20px;z-index:60;width:62px;height:62px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.25);animation:pula 3s ease-in-out infinite}
.zap svg{width:34px;height:34px}

/* animação de entrada */
.surge{opacity:0;transform:translateY(30px);transition:opacity .7s,transform .7s}
.surge.visivel{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.surge{opacity:1;transform:none}}

/* ---------- responsivo ---------- */
@media (max-width:1020px){
  .grade-shows{grid-template-columns:repeat(2,1fr)}
  .grade-videos{grid-template-columns:repeat(2,1fr)}
  .cards-icone{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .menu__abrir{display:flex}
  .menu{position:fixed;inset:72px 0 auto 0;flex-direction:column;background:var(--rosa);padding:1.4rem 20px 2rem;gap:1rem;transform:translateY(-130%);transition:transform .35s;box-shadow:0 20px 30px rgba(120,10,70,.3)}
  .menu.aberto{transform:none}
  .menu a{font-size:1.25rem}
  .menu__abrir[aria-expanded="true"] span:nth-child(1){transform:translateY(10px) rotate(45deg)}
  .menu__abrir[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu__abrir[aria-expanded="true"] span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}
  .hero__in,.sobre__in,.palestra__in,.contato__in{grid-template-columns:1fr}
  .hero{padding:36px 16px 110px;text-align:center}
  .hero p{margin-inline:auto}
  .hero__btns{justify-content:center}
  .hero__fotos{max-width:420px;margin-top:10px}
  .palestra__foto{order:-1;max-width:460px}
  .sobre__foto{max-width:440px;margin:auto}
}
@media (max-width:600px){
  body{font-size:16px}
  .sec{padding:64px 16px}
  .topo__in{padding:.5rem 16px}
  .topo__logo img{height:46px}
  .grade-shows{grid-template-columns:1fr}
  .numeros{grid-template-columns:repeat(2,1fr)}
  .cards-icone{grid-template-columns:1fr 1fr;gap:10px}
  .cards-icone div{flex-direction:column;text-align:center;font-size:1rem;padding:1rem .6rem}
  .grade-videos{gap:12px}
  .mosaico{columns:2;column-gap:10px}
  .mosaico img{margin-bottom:10px}
  .balao{font-size:.85rem}
  .balao--1{right:0}.balao--2{right:0}
  .hero__boneca{left:-2%}
  .proposito{border-radius:36px 36px 0 0}
  .form{padding:1.4rem}
  .rede{min-width:0;width:100%}
}
