/* ============================================================
   PÁGINA DE CURSO (curso-gratuito) — visual novo, 10/10/2026
   Só esta página carrega este arquivo; o blog continua com o estilo dele.
   Mesma linguagem da home: céu no topo, branco da casa, preto #1B1B1B e os mascotes.
   Pensada como sala de aula: a busca e os filtros em destaque, cada aula como um cartão de "assistir".
   ============================================================ */
.tb-blog-hero.tbc-hero { position: relative; margin: 12px 12px 0; padding-top: 150px; padding-bottom: 64px; border-radius: 28px; overflow: hidden; background: #F5F5F5; isolation: isolate; }
.tbc-hero .tb-blog-hero-bg-left, .tbc-hero .tb-blog-hero-bg-right, .tbc-hero .tb-blog-hero-bg-wave, .tbc-hero .tb-blog-hero-badge { display: none !important; }
.tbc-ceu { position: absolute; inset: 0; z-index: -1; pointer-events: none; -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,.45) 82%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,.45) 82%, transparent 100%); }
.tbc-ceu img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.tbc-hero .tb-blog-kicker { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; background: rgba(255,255,255,.18) !important; border: 1px solid rgba(255,255,255,.45) !important; color: #fff !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-weight: 600; }
.tbc-hero .tb-blog-kicker svg path { stroke: #fff !important; }
.tbc-hero .tb-blog-title { color: #fff !important; -webkit-text-fill-color: #fff !important; background: none !important; text-shadow: 0 2px 28px rgba(6,60,120,.3); font-weight: 800; letter-spacing: -0.04em; max-width: 880px !important; margin-left: auto; margin-right: auto; text-wrap: balance; }
.tbc-hero .tb-blog-title em { font-family: Georgia, 'Times New Roman', serif; font-style: italic; font-weight: 400; }
.tbc-hero .tb-blog-subtitle { color: #fff !important; text-shadow: 0 1px 16px rgba(6,60,120,.35); }
.tbc-hero .tb-blog-search { background: #fff !important; border: 0 !important; box-shadow: 0 24px 46px -22px rgba(6,40,90,.5) !important; }
.tbc-hero .tb-course-pill { background: rgba(255,255,255,.92) !important; color: #1B1B1B !important; border: 0 !important; font-weight: 600; box-shadow: 0 10px 22px -14px rgba(6,40,90,.5); transition: transform .25s cubic-bezier(.34,1.56,.64,1), background .2s ease, color .2s ease; }
.tbc-hero .tb-course-pill:hover { transform: translateY(-2px); }
.tbc-hero .tb-course-pill.is-active { background: #1B1B1B !important; color: #fff !important; }

/* os mascotes estudando ao redor do título */
.tbc-masc { opacity: 1 !important; position: absolute; width: 150px; height: 150px; object-fit: contain; pointer-events: none; filter: drop-shadow(0 16px 22px rgba(20,40,90,.28)); animation: tbcFlutua 4.4s ease-in-out infinite; }
.tbc-masc--1 { left: 8%; top: 37%; }
.tbc-masc--2 { right: 8%; top: 31%; animation-delay: -1.4s; }
.tbc-masc--3 { right: 19%; bottom: 7%; width: 112px; height: 112px; animation-delay: -2.6s; }
.tbc-masc--4 { left: 19%; bottom: 9%; width: 112px; height: 112px; animation-delay: -3.4s; }
@keyframes tbcFlutua { 0%, 100% { translate: 0 0; rotate: -2deg; } 50% { translate: 0 -10px; rotate: 2deg; } }

/* as aulas */
.tbc-aulas .tb-blog-card { border-radius: 22px !important; border: 1px solid #ebe9e4 !important; background: #fff !important; overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 24px 50px -30px rgba(20,24,40,.28) !important; transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s cubic-bezier(.16,1,.3,1) !important; }
.tbc-aulas .tb-blog-card:hover { transform: translateY(-6px); box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 36px 60px -30px rgba(20,60,140,.42) !important; }
.tbc-aulas .tb-blog-card-cover { position: relative; overflow: hidden; }
.tbc-aulas .tb-blog-card-cover img { transition: transform .7s cubic-bezier(.16,1,.3,1); }
.tbc-aulas .tb-blog-card:hover .tb-blog-card-cover img { transform: scale(1.05); }
/* o botão de "assistir" em cima da capa */
.tbc-aulas .tb-blog-card-cover::after { content: var(--tb-assistir-aula, "▶ Assistir aula"); position: absolute; left: 14px; bottom: 14px; padding: 8px 14px; border-radius: 999px; background: #1B1B1B; color: #fff; font-size: 12.5px; font-weight: 700; letter-spacing: .01em; box-shadow: 0 12px 22px -10px rgba(0,0,0,.6); opacity: 0; translate: 0 8px; transition: opacity .3s ease, translate .35s cubic-bezier(.34,1.56,.64,1); }
.tbc-aulas .tb-blog-card:hover .tb-blog-card-cover::after { opacity: 1; translate: 0 0; }
.tbc-aulas .tb-blog-card-meta { display: flex; align-items: center; gap: 8px; }
.tbc-aulas .tb-blog-card-meta span:first-child { padding: 4px 10px; border-radius: 999px; background: #1B1B1B; color: #fff !important; font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.tbc-aulas .tb-blog-card-meta span:last-child { color: #6f6a62 !important; font-weight: 600; }
.tbc-aulas .tb-blog-card-title { color: #1B1B1B !important; letter-spacing: -0.025em; }
.tbc-aulas .tb-blog-card-cta { width: max-content; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px; border-radius: 999px; border: 1.5px solid #1B1B1B; color: #1B1B1B !important; font-weight: 700; transition: background .2s ease, color .2s ease; }
.tbc-aulas .tb-blog-card:hover .tb-blog-card-cta { background: #1B1B1B; color: #fff !important; }

@media (max-width: 1100px) { .tbc-masc--3, .tbc-masc--4 { display: none; } .tbc-masc { width: 110px; height: 110px; } .tbc-masc--1 { left: 2%; top: 22%; } .tbc-masc--2 { right: 2%; top: 18%; } }
@media (max-width: 720px) { .tb-blog-hero.tbc-hero { margin: 8px 8px 0; border-radius: 22px; padding-top: 118px; } .tbc-masc { width: 76px; height: 76px; } .tbc-masc--1 { left: 3%; top: 92px; } .tbc-masc--2 { right: 3%; top: 92px; } }
@media (prefers-reduced-motion: reduce) { .tbc-masc { animation: none; } }
