/* Plataforma TSN — base compartilhada entre as páginas do hub (exceto /aula-para-criancas/, que tem identidade própria) */
:root{
  --bg:#f4ede8; --paper:#f9f4f0; --cream:#fdf8f5; --ink:#3a1420;
  --wine:#5c162b; --rose:#db3f6e; --olive:#8f8830; --teal:#44889c;
  --salmon:#f2a0a0; --green:#8da658; --offwhite:#f2f2f2;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}

/* scrollbar customizada da marca — nunca a barra nativa do navegador */
*{scrollbar-width:thin; scrollbar-color:var(--rose) var(--bg);}
*::-webkit-scrollbar{width:10px; height:10px;}
*::-webkit-scrollbar-track{background:var(--bg);}
*::-webkit-scrollbar-thumb{background:var(--rose); border-radius:999px; border:2px solid var(--bg);}
*::-webkit-scrollbar-thumb:hover{background:var(--wine);}
body{margin:0; font-family:'Plus Jakarta Sans',sans-serif; background:var(--bg); color:var(--ink); text-transform:lowercase; line-height:1.6;}
h1,h2,h3,.display{font-family:'Young Serif',serif; text-transform:lowercase; color:var(--wine); line-height:1.1; font-weight:400; margin:0;}
a{color:inherit; text-decoration:none;}
.keep-case{text-transform:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px; width:100%; position:relative;}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:15px 30px; border-radius:999px; font-weight:600; font-size:15px; border:none; cursor:pointer;}
.btn-outline{border:1.5px solid var(--wine); color:var(--wine); background:transparent; padding:9px 20px; font-size:14px; border-radius:999px; cursor:pointer;}
.card{background:rgba(253,248,245,0.9); border-radius:20px; padding:32px; height:100%;}
.sticker-wrap{position:relative;}
.sticker-plate{position:absolute; inset:0; border-radius:20px; z-index:0; transform:rotate(var(--r,0deg)) translate(var(--tx,0),var(--ty,0)); transition:transform .28s ease;}
.sticker-wrap:hover .sticker-plate{transform:rotate(0deg) translate(0,0);}
.badge{display:inline-flex; padding:6px 14px; border-radius:999px; font-size:12px; font-weight:700; letter-spacing:0.5px;}
.badge-soft{display:inline-flex; padding:4px 10px; border-radius:999px; font-size:11px; font-weight:700; letter-spacing:0.3px; background:rgba(58,20,32,0.08); color:var(--ink); opacity:0.65; width:fit-content;}

.grid-2{display:grid; grid-template-columns:repeat(2, minmax(0,1fr));}
.grid-3{display:grid; grid-template-columns:repeat(3, minmax(0,1fr));}
.grid-4{display:grid; grid-template-columns:repeat(4, minmax(0,1fr));}
.grid-bio{display:grid; grid-template-columns:280px 1fr;}
.grid-bio-sm{display:grid; grid-template-columns:220px 1fr;}
.table-scroll{overflow-x:auto;}
.table-scroll table{min-width:480px;}
.timeline-scroll{overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none;}
.timeline-scroll::-webkit-scrollbar{display:none;}

/* tablet: 4 colunas viram 2, o resto continua */
@media (max-width:900px){
  .grid-4{grid-template-columns:repeat(2, minmax(0,1fr));}
}

/* celular: tudo empilha numa coluna só */
@media (max-width:640px){
  .wrap{padding-left:20px; padding-right:20px;}
  .grid-2, .grid-3, .grid-4{grid-template-columns:1fr;}
  .grid-bio, .grid-bio-sm{grid-template-columns:1fr; justify-items:center; text-align:center;}
  .bio-photo{width:200px !important; height:200px !important;}
  .nav-row{flex-wrap:wrap; row-gap:10px; padding-top:10px !important; padding-bottom:10px !important;}
  .logo-img{height:48px !important;}
  h1{font-size:clamp(28px, 8vw, 40px) !important;}
  h2{font-size:clamp(22px, 6vw, 30px) !important;}
}