:root {
  --bg:        #0d0e14;
  --surface:   #13151f;
  --surface2:  #1a1d2e;
  --border:    rgba(255,255,255,0.08);
  --border-hi: rgba(77,106,255,0.4);
  --blue:      #3955f0;
  --blue-glow: rgba(77,106,255,0.28);
  --blue-dim:  rgba(77,106,255,0.13);
  --text:      #e8eaf0;
  --text-muted:#8892b0;
  --text-faint:#7079a4;
  --red:       #ff3333;
}

*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Ubuntu', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
}

/* Grid — only for hero section and yt-banner */
.hero-grid {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px);
  background-size: 32px 32px;
}


/* ── Tipografia ── */
.t-hero    { font-weight: 700; letter-spacing: -0.03em; }
.t-section { font-weight: 700; letter-spacing: -0.02em; }
.t-card    { font-weight: 500; }
.t-label   { font-weight: 300; letter-spacing: 0.04em; }
.t-meta    { font-weight: 300; font-size: .82rem; }
.t-caption { font-weight: 300; font-style: italic; }
.t-tag     { font-weight: 300; font-size: .7rem; letter-spacing: .07em; text-transform: uppercase; }

.logo-text { font-weight: 700; letter-spacing: -0.03em; color: #fff; font-size: 1.3rem; }
.logo-dot  { color: var(--blue); }

/* ── Botões ── */
.btn-primary {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--blue); color: #fff; text-decoration: none;
  font-family: 'Ubuntu', sans-serif; font-weight: 500; font-size: .88rem;
  padding: .6rem 1.4rem; border-radius: 7px; border: none; cursor: pointer;
  box-shadow: 0 0 20px var(--blue-glow);
  transition: background .15s, box-shadow .15s, transform .15s;
}
.btn-primary:hover {
  background: #1111ff;
  box-shadow: 0 0 32px rgba(0,0,255,0.45);
  transform: translateY(-1px);
}

.btn-outline {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; color: var(--blue); text-decoration: none;
  font-family: 'Ubuntu', sans-serif; font-weight: 300; font-size: .88rem;
  padding: .6rem 1.4rem; border-radius: 7px; border: 1.5px solid var(--blue);
  cursor: pointer; transition: background .15s, box-shadow .15s;
}
.btn-outline:hover { background: var(--blue-dim); box-shadow: 0 0 16px var(--blue-glow); }

/* Google Sign-In — segue diretrizes oficiais do Google */
.btn-google {
  display: inline-flex; align-items: center; gap: 10px;
  background: #fff; color: #1f1f1f; text-decoration: none;
  font-family: 'Roboto', 'Ubuntu', system-ui, sans-serif;
  font-weight: 500; font-size: .88rem; letter-spacing: .15px;
  padding: .55rem 1.1rem; border-radius: 7px;
  border: 1px solid #747775; cursor: pointer;
  transition: background .15s, box-shadow .15s, border-color .15s;
}
.btn-google:hover {
  background: #f8faff;
  border-color: #303030;
  box-shadow: 0 1px 3px rgba(0,0,0,.3), 0 4px 8px 3px rgba(0,0,0,.15);
}
.btn-google .g-logo { width: 18px; height: 18px; flex-shrink: 0; }

/* ── Cards ── */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  transition: border-color .2s, box-shadow .2s;
  position: relative; overflow: hidden;
}
.card:hover {
  border-color: var(--border-hi);
  box-shadow: 0 0 24px var(--blue-dim), 0 4px 24px rgba(0,0,0,0.4);
}
.card::after {
  content: '';
  position: absolute; inset: 0; border-radius: 10px;
  background: linear-gradient(135deg, rgba(77,106,255,0.05), transparent 60%);
  opacity: 0; transition: opacity .2s; pointer-events: none;
}
.card:hover::after { opacity: 1; }

/* ── Tags ── */
.tag {
  background: var(--blue-dim); color: #7b96ff;
  font-size: .68rem; font-weight: 300;
  letter-spacing: .07em; text-transform: uppercase;
  padding: 2px 8px; border-radius: 4px; display: inline-block;
  border: 1px solid rgba(77,106,255,0.22);
}
.tag-dim { background: rgba(255,255,255,0.05); color: var(--text-muted); border-color: var(--border); }
.tag-accent { background: rgba(255,51,51,0.10); color: #ff6b6b; border-color: rgba(255,51,51,0.25); }

/* ── Progresso ── */
.progress-bar  { height: 3px; background: rgba(255,255,255,0.08); border-radius: 2px; }
.progress-fill {
  height: 3px; background: var(--blue); border-radius: 2px;
  box-shadow: 0 0 8px var(--blue-glow);
}

/* ── Estados de aula ── */
.aula-done    { background: var(--blue-dim); color: #7b96ff; border: 1px solid rgba(77,106,255,0.28); }
.aula-current { background: var(--blue); color: #fff; box-shadow: 0 0 10px var(--blue-glow); }
.aula-pending { background: rgba(255,255,255,0.05); color: var(--text-faint); border: 1px solid var(--border); }

/* ── Breadcrumb ── */
.breadcrumb span,
.breadcrumb a { color: var(--text-faint); font-size: .8rem; font-weight: 300; text-decoration: none; }
.breadcrumb a:hover { color: var(--blue); }
.breadcrumb .current { color: var(--text-muted); font-weight: 400; }

/* ── Orbs ── */
.orb {
  position: absolute; border-radius: 50%;
  filter: blur(50px); pointer-events: none;
  animation: orbPulse 7s ease-in-out infinite;
}

/* ── Accent bars ── */
.accent-bar {
  display: inline-block; width: 3px; height: 18px;
  background: linear-gradient(180deg, var(--blue), transparent);
  border-radius: 2px; margin-right: 10px; vertical-align: middle;
  box-shadow: 0 0 8px var(--blue-glow); flex-shrink: 0;
}

/* ── Site header ── */
.site-header {
  position: relative; z-index: 10;
  border-bottom: 1px solid var(--border);
  background: rgba(13,14,20,0.88);
  backdrop-filter: blur(12px);
}

/* ── Nav links ── */
.nav-link { color: var(--text-muted); text-decoration: none; transition: color .15s; }
.nav-link:hover { color: #fff; }

/* ── Site footer ── */
.site-footer {
  border-top: 1px solid var(--border);
  background: var(--surface);
  position: relative; z-index: 1;
  margin-top: 80px;
}

/* ── Sidebar aula ── */
.sidebar-aula {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 12px;
}

/* ── Utilitários ── */
.line-clamp-1 { overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical; }
.line-clamp-2 { overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; }
.prose p { margin-bottom: 1em; }
.prose strong { color: var(--text); font-weight: 700; }

/* scrollbar */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 2px; }

/* ── Animações ── */
@keyframes ambientPulse {
  0%,100% { opacity:.6; transform:scale(1);   }
  50%      { opacity:1;  transform:scale(1.1); }
}
@keyframes orbPulse {
  0%,100% { opacity:.35; transform:scale(1);    }
  50%      { opacity:.55; transform:scale(1.15); }
}
@keyframes fadeUp   { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeLeft { from{opacity:0;transform:translateX(-12px)} to{opacity:1;transform:translateX(0)} }
@keyframes fadeRight{ from{opacity:0;transform:translateX(12px)}  to{opacity:1;transform:translateX(0)} }
@keyframes floatUp  {
  0%   { transform:translateY(0)      scale(1);   opacity:.65; }
  100% { transform:translateY(-120px) scale(0.1); opacity:0;   }
}

/* ── YouTube Banner ── */
.yt-banner {
  width:100%; height:100px; background:#0d0d14;
  border-radius:12px; position:relative; overflow:hidden;
  display:flex; align-items:center;
  border:1px solid rgba(255,255,255,0.07);
  box-shadow:0 4px 40px rgba(255,50,50,0.15), 0 0 0 1px rgba(77,106,255,0.08);
}
.yt-orb-1 { width:180px;height:180px; background:radial-gradient(circle,#ff2e2e,transparent); top:-80px;left:-20px; animation-delay:0s; }
.yt-orb-2 { width:130px;height:130px; background:radial-gradient(circle,#ff6b00,transparent); top:-60px;left:160px; animation-delay:1.5s; }
.yt-orb-3 { width:140px;height:140px; background:radial-gradient(circle,#4d6aff,transparent); bottom:-80px;right:180px;opacity:.15; animation-delay:3s; }
.yt-p1 { position:absolute;width:2px;height:2px;border-radius:50%;pointer-events:none;animation:floatUp linear infinite; left:10%;bottom:0;animation-duration:3.5s;animation-delay:0s;   background:rgba(255,80,80,.55);  }
.yt-p2 { position:absolute;width:2px;height:2px;border-radius:50%;pointer-events:none;animation:floatUp linear infinite; left:26%;bottom:0;animation-duration:4.5s;animation-delay:.8s;  background:rgba(255,80,80,.55);  }
.yt-p3 { position:absolute;width:2px;height:2px;border-radius:50%;pointer-events:none;animation:floatUp linear infinite; left:47%;bottom:0;animation-duration:3s;  animation-delay:1.8s; background:rgba(255,100,0,.5);   }
.yt-p4 { position:absolute;width:2px;height:2px;border-radius:50%;pointer-events:none;animation:floatUp linear infinite; left:67%;bottom:0;animation-duration:5s;  animation-delay:.4s;  background:rgba(100,100,255,.45);}
.yt-p5 { position:absolute;width:2px;height:2px;border-radius:50%;pointer-events:none;animation:floatUp linear infinite; left:84%;bottom:0;animation-duration:4s;  animation-delay:1.2s; background:rgba(255,80,80,.55);  }
.yt-accentbar {
  width:3px;height:50px;flex-shrink:0;margin-left:22px;
  background:linear-gradient(180deg,#ff3030,#ff6a00); border-radius:3px;
  position:relative;z-index:2; box-shadow:0 0 12px rgba(255,60,0,.7);
}
.yt-icon { display:flex;align-items:center;margin-left:16px;flex-shrink:0;position:relative;z-index:2;animation:fadeLeft .7s ease both .15s; }
.yt-text { margin-left:14px;flex:1;min-width:0;position:relative;z-index:2;animation:fadeLeft .7s ease both .25s;display:flex;flex-direction:column;gap:5px; }
.yt-title-row { display:flex;align-items:baseline;gap:10px; }
.yt-name  { font-weight:700;font-size:22px;color:#fff;line-height:1;letter-spacing:-.5px;white-space:nowrap; }
.yt-dot   { color:#ff3a3a; }
.yt-handle{ font-weight:300;font-size:11px;color:#ff5544;letter-spacing:1.5px;text-transform:uppercase;opacity:.85; }
.yt-tagline{ font-weight:300;font-size:11px;color:rgba(255,255,255,.6);letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.yt-cta   { display:flex;flex-direction:column;align-items:center;gap:6px;margin-right:22px;flex-shrink:0;position:relative;z-index:2;animation:fadeRight .7s ease both .35s; }
.yt-btn   {
  display:inline-flex;align-items:center;gap:7px;
  background:linear-gradient(135deg,#ff2222,#ff6600);
  color:#fff;font-weight:700;font-size:13px;letter-spacing:.3px;
  text-decoration:none;padding:9px 18px;border-radius:7px;
  white-space:nowrap;border:none;cursor:pointer;line-height:1;
  box-shadow:0 3px 16px rgba(255,40,0,.45);
  transition:transform .2s,box-shadow .2s;
}
.yt-btn:hover { transform:translateY(-2px); box-shadow:0 6px 24px rgba(255,40,0,.65); }
.yt-url   { font-weight:300;font-size:9px;color:rgba(255,255,255,.5);letter-spacing:.8px;white-space:nowrap; }
.yt-divider { width:1px;height:40px;flex-shrink:0;margin:0 20px;background:linear-gradient(180deg,transparent,rgba(255,255,255,0.1),transparent); }

@media(max-width:560px){
  .yt-banner{height:78px;border-radius:10px;}
  .yt-accentbar{display:none;}
  .yt-tagline{display:none;}
  .yt-name{font-size:17px;}
  .yt-handle{display:none;}
  .yt-url{display:none;}
  .yt-cta{margin-right:14px;}
}

/* CTA YouTube compacto (páginas internas) */
.yt-cta-compact {
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;margin:0 0 28px;
  background:linear-gradient(90deg,rgba(255,51,51,0.08),rgba(255,51,51,0.02));
  border:1px solid rgba(255,51,51,0.25);border-radius:10px;
  text-decoration:none;color:inherit;
  transition:border-color .2s,background .2s,transform .2s;
}
.yt-cta-compact:hover {
  border-color:rgba(255,51,51,0.55);
  background:linear-gradient(90deg,rgba(255,51,51,0.14),rgba(255,51,51,0.04));
  transform:translateY(-1px);
}
.yt-cta-compact-icon { flex-shrink:0;display:flex;align-items:center;justify-content:center; }
.yt-cta-compact-text { flex:1;min-width:0;display:flex;flex-direction:column;gap:2px; }
.yt-cta-compact-title { font-size:.92rem;font-weight:600;color:#fff;line-height:1.3; }
.yt-cta-compact-sub   { font-size:.78rem;color:var(--text-faint);line-height:1.3; }
.yt-cta-compact-btn {
  flex-shrink:0;background:linear-gradient(180deg,#ff3333,#cc0000);
  color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.2px;
  padding:8px 14px;border-radius:7px;white-space:nowrap;
  box-shadow:0 3px 12px rgba(255,40,0,.35);
}
@media(max-width:560px){
  .yt-cta-compact{padding:12px 14px;gap:10px;}
  .yt-cta-compact-sub{display:none;}
  .yt-cta-compact-btn{padding:7px 11px;font-size:.75rem;}
}

@media(max-width:768px){
  .nav-link-item { display:none; }
  .nav-links     { gap:12px; }
}

/* ══════════════════════════════════════════════════════
   UTILITÁRIOS DE LAYOUT — migração inline→CSS
   ══════════════════════════════════════════════════════ */

/* ── Containers ── */
.container-main      { max-width:1152px; margin:0 auto; padding:0 20px; }
.container-page      { max-width:1152px; margin:0 auto; padding:48px 20px; }
.container-page-sm   { max-width:760px;  margin:0 auto; padding:64px 20px 80px; }
.container-page-aula { max-width:1152px; margin:0 auto; padding:32px 20px; }

/* ── Nav ── */
.nav-inner        { max-width:1152px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2;gap:16px; }
.nav-logo-link    { display:inline-flex;align-items:center;flex-shrink:0;min-width:0; }
.nav-logo-img     { height:28px;width:auto;filter:invert(1);display:block; }
.nav-links        { display:flex;align-items:center;gap:28px;flex-shrink:0; }
.nav-link-item    { font-size:.88rem; }
.nav-user-menu    { position:relative;outline:none; }
.nav-user-cluster { display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:border-color .15s,background-color .15s; }
.nav-user-menu:hover .nav-user-cluster,
.nav-user-menu:focus-within .nav-user-cluster { border-color:var(--border);background:rgba(255,255,255,0.04); }
.nav-avatar       { width:30px;height:30px;border-radius:50%;border:1px solid var(--border); }
.nav-username     { color:var(--text);font-size:.88rem; }
.nav-user-caret   { color:var(--text-muted);transition:transform .18s ease; }
.nav-user-menu:hover .nav-user-caret,
.nav-user-menu:focus-within .nav-user-caret { transform:rotate(180deg); }
.nav-user-dropdown {
  position:absolute;top:100%;right:0;min-width:180px;margin-top:8px;
  background:#0c0c0c;border:1px solid var(--border);border-radius:10px;
  padding:6px;display:flex;flex-direction:column;
  box-shadow:0 8px 24px rgba(0,0,0,0.4);z-index:10;
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .15s ease,transform .15s ease,visibility .15s;
}
.nav-user-dropdown::before {
  content:"";position:absolute;top:-8px;left:0;right:0;height:8px;
}
.nav-user-menu:hover .nav-user-dropdown,
.nav-user-menu:focus-within .nav-user-dropdown {
  opacity:1;visibility:visible;transform:translateY(0);
}
.nav-user-item {
  padding:9px 14px;border-radius:6px;color:var(--text-muted);
  font-size:.88rem;text-decoration:none;font-weight:300;white-space:nowrap;
  transition:background-color .12s,color .12s;
}
.nav-user-item:hover { background:rgba(255,255,255,0.06);color:#fff; }
.btn-nav          { font-size:.82rem;padding:.5rem 1.1rem; }
.site-main        { position:relative;z-index:1; }

/* ── Footer ── */
.footer-inner     { max-width:1152px;margin:0 auto;padding:32px 20px; }
.footer-logo      { height:24px;filter:invert(1);opacity:.7;margin-bottom:24px; }
.footer-cols      { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px; }
.footer-col       { display:flex;flex-direction:column;gap:8px; }
.footer-col-title { color:var(--text);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 4px;opacity:.7; }
.footer-link      { font-size:.85rem; }
.footer-sublink   { padding-left:12px;color:var(--text-muted);font-size:.8rem; }
.footer-copy      { color:var(--text-faint);margin-top:24px; }

/* ── Section headers ── */
.section-header     { display:flex;align-items:center;gap:8px;margin-bottom:24px; }
.section-header--sm { margin-bottom:12px; }
.section-header--md { margin-bottom:20px; }

/* ── Variantes de título ── */
.t-hero-page   { font-size:2rem;color:#fff; }
.t-hero-home   { font-size:clamp(2.4rem,6vw,4rem);color:#fff;line-height:1.05; }
.t-section-lg  { font-size:1.5rem;color:#fff; }
.t-section-md  { font-size:1.1rem;color:#fff; }
.t-section-sm  { font-size:.88rem;color:#fff; }
.t-body-lg     { font-size:1.15rem;color:var(--text);line-height:1.8; }
.t-meta-faint  { color:var(--text-faint);font-size:.85rem; }
.link-blue     { color:var(--blue);text-decoration:none; }

/* ── Hero ── */
.hero-section    { position:relative;overflow:hidden;padding:90px 20px 80px;text-align:center; }
.hero-badge      { display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(77,106,255,.3);border-radius:20px;padding:5px 16px;margin-bottom:24px; }
.hero-badge-dot  { width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 8px var(--blue-glow);flex-shrink:0; }
.hero-cta-row    { display:flex;gap:12px;justify-content:center;flex-wrap:wrap; }

/* ── Btn variants ── */
.btn-sm  { font-size:.82rem;padding:.45rem 1rem; }
.btn-lg  { font-size:.95rem;padding:.7rem 1.8rem; }

/* ── Cover cards ── */
.cover-card           { position:relative;border-radius:14px;overflow:hidden;min-height:280px;display:flex;align-items:flex-end; }
.cover-card--center   { align-items:center;justify-content:center; }
.cover-card--sm       { min-height:240px; }
.cover-card--round    { border-radius:12px; }
.cover-img            { position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.cover-overlay        { position:absolute;inset:0;background:rgba(0,0,0,0.6); }
.cover-overlay--light { background:rgba(0,0,0,0.55); }
.cover-body           { position:relative;z-index:1;padding:28px; }
.cover-text           { color:rgba(255,255,255,.7);line-height:1.7;font-size:.88rem;margin-bottom:20px; }
.cover-blockquote     { position:relative;z-index:1;text-align:center;padding:32px 24px;max-width:560px; }
.tag-block            { margin-bottom:12px;display:inline-block; }

/* ── Logo cards ── */
.logo-card       { display:flex;align-items:center;justify-content:center;padding:20px;border:1px solid var(--border);border-radius:12px;background:var(--surface);transition:border-color .2s; }
.logo-card:hover { border-color:var(--border-hi); }

/* ── Grids ── */
.grid-categories { display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px; }
.grid-courses-sm { display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px; }
.grid-courses-md { display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px; }
.grid-2col       { display:grid;grid-template-columns:1fr 1fr;gap:24px; }
.grid-4col       { display:grid;grid-template-columns:repeat(4,1fr);gap:16px; }

@media(max-width:515px){
  .grid-categories { grid-template-columns:repeat(2,1fr); }
  .grid-2col       { grid-template-columns:1fr; }
}

/* ── Universidades strip ── */
.uni-strip       { border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:rgba(255,255,255,0.015);padding:28px 20px; }
.uni-strip-inner { max-width:1152px;margin:0 auto;text-align:center; }
.uni-logos       { display:flex;flex-wrap:wrap;justify-content:center;gap:40px;opacity:.7;filter:grayscale(1); }
@media(max-width:560px){
  .uni-logos     { display:grid;grid-template-columns:repeat(2,1fr);gap:20px 16px;justify-items:center; }
  .grid-4col     { grid-template-columns:repeat(2,1fr); }
}

/* ── Card variants ── */
.card-link       { display:block;text-decoration:none; }
.card-p-sm       { padding:16px; }
.card-p-md       { padding:20px; }
.card-p-lg       { padding:24px; }
.card-p-list     { padding:12px; }
.card-nav        { flex:1;padding:14px;text-decoration:none; }
.card-nav--right { text-align:right; }
.card-thumb      { aspect-ratio:16/9;overflow:hidden;border-radius:9px 9px 0 0;background:#111; }
.card-thumb img  { width:100%;height:100%;object-fit:cover;transition:transform .35s; }
.card-body       { padding:16px; }
.card-body-tags  { display:flex;gap:6px;margin-bottom:10px; }

/* ── Curso detail ── */
.curso-layout     { display:flex;gap:36px;flex-wrap:wrap;margin-bottom:48px; }
.curso-thumb      { flex-shrink:0;width:min(280px,100%); }
.curso-thumb img  { width:100%;border-radius:10px;border:1px solid var(--border); }
.curso-info       { flex:1;min-width:220px; }
.curso-tags       { display:flex;gap:6px;margin-bottom:12px; }
.progress-bar-curso { max-width:240px;margin-bottom:20px; }
.aula-list        { display:flex;flex-direction:column;gap:8px;list-style:none;padding-left:0;margin:0; }
.aula-item        { display:flex;align-items:center;gap:12px; }
.aula-num         { width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;flex-shrink:0; }
.aula-num-sm      { width:24px;height:24px;font-size:.7rem; }
.aula-thumb       { width:80px;height:48px;object-fit:cover;border-radius:6px;border:1px solid var(--border);flex-shrink:0; }
.aula-info        { flex:1;min-width:0; }
.chevron-icon     { color:var(--text-faint);flex-shrink:0; }

/* ── Aula layout ── */
.aula-layout          { display:flex;gap:28px;flex-wrap:wrap; }
.aula-main            { flex:1;min-width:300px; }
.aula-sidebar-col     { width:min(300px,100%);flex-shrink:0; }
.video-embed          { aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;margin-bottom:20px;border:1px solid var(--border); }
.video-embed iframe   { width:100%;height:100%;border:0; }
.aula-header          { display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px; }
.aula-nav             { display:flex;gap:12px;border-top:1px solid var(--border);padding-top:20px;margin-top:8px; }
.sidebar-list         { display:flex;flex-direction:column;gap:2px;max-height:70vh;overflow-y:auto;padding-right:4px; }
.sidebar-link         { display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:7px;text-decoration:none;transition:background .15s; }
.sidebar-link--active { background:var(--surface2); }
.sidebar-text         { color:var(--text-muted); }
.sidebar-text--active { color:var(--text); }

/* ── Sobre ── */
.sobre-header  { text-align:center;margin-bottom:40px; }
.logo-centered { display:flex;justify-content:center;margin-bottom:48px; }
.share-section { border-top:1px solid var(--border);padding-top:32px; }
.cta-row       { margin-top:48px;display:flex;gap:12px;flex-wrap:wrap; }

/* ── Misc ── */
.section-padded    { padding-bottom:80px; }
.section-desc      { color:var(--text-muted);max-width:640px;line-height:1.7;font-size:.95rem;margin-bottom:40px; }
.hero-label-blue   { color:#7b96ff;font-size:.78rem; }
.hero-label-red    { color:#ff6b6b;font-size:.78rem; }
.hero-badge--yt    { border-color:rgba(255,51,51,.35); }
.hero-badge--yt .hero-badge-dot { background:#ff3333;box-shadow:0 0 8px rgba(255,51,51,.7); }
.cover-h3          { margin-bottom:10px; }
.grid-2col--mb     { margin-bottom:40px; }

/* ── Notícias / Post content ── */
.post-content              { color:var(--text);font-size:1.02rem;line-height:1.75;max-width:760px; }
.post-content p            { margin:0 0 1.1em; }
.post-content h2           { font-size:1.5rem;font-weight:700;color:#fff;margin:2em 0 .6em;letter-spacing:-.02em; }
.post-content h3           { font-size:1.2rem;font-weight:600;color:#fff;margin:1.6em 0 .5em; }
.post-content h4           { font-size:1.05rem;font-weight:600;color:#fff;margin:1.4em 0 .4em; }
.post-content a            { color:var(--blue,#7b96ff);text-decoration:underline;text-underline-offset:2px; }
.post-content a:hover      { color:#a8b9ff; }
.post-content ul,
.post-content ol           { margin:0 0 1.2em 1.4em;padding:0; }
.post-content li           { margin-bottom:.4em; }
.post-content strong       { color:#fff;font-weight:600; }
.post-content blockquote   { border-left:3px solid var(--blue,#7b96ff);padding:8px 0 8px 18px;margin:1.4em 0;color:var(--text-muted);font-style:italic; }
.post-content figure       { margin:1.6em 0; }
.post-content figure img,
.post-content img          { max-width:100%;height:auto;border-radius:8px;display:block; }
.post-content figcaption   { color:var(--text-faint);font-size:.82rem;margin-top:8px;text-align:center; }
.post-content hr           { border:0;border-top:1px solid var(--border);margin:2em 0; }
.post-content iframe       { max-width:100%;border-radius:8px; }
.post-content code         { background:var(--surface2,#1c1c20);padding:2px 6px;border-radius:4px;font-size:.92em; }

/* ============================================================
   SEO INTRO + FAQ (cursos)
   ============================================================ */
.seo-intro            { max-width:760px;margin:0 0 40px;color:var(--text-muted);font-size:.95rem;line-height:1.75; }
.seo-intro p          { margin-bottom:1em; }
.seo-intro p:last-child { margin-bottom:0; }
.seo-intro strong     { color:#fff;font-weight:600; }
.seo-intro a          { color:var(--blue,#7b96ff);text-decoration:underline;text-underline-offset:2px; }

.seo-section          { max-width:760px;margin:64px 0 0; }
.seo-section h2       { font-size:1.3rem;color:#fff;font-weight:600;margin-bottom:18px; }
.seo-section h3       { font-size:1.02rem;color:#fff;font-weight:600;margin:1.6em 0 .5em; }
.seo-section p        { color:var(--text-muted);font-size:.95rem;line-height:1.75;margin-bottom:1em; }
.seo-section ul       { margin:0 0 1.2em 1.4em;color:var(--text-muted);font-size:.95rem;line-height:1.75; }
.seo-section li       { margin-bottom:.4em; }

/* Cards de categoria (grid /cursos/) */
.grid-categories-rich {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:16px;
}
.cat-card {
  position:relative;
  display:flex;flex-direction:column;
  padding:22px 20px 18px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  text-decoration:none;
  overflow:hidden;
  transition:border-color .25s, transform .25s, background .25s;
}
.cat-card::before {
  content:"";
  position:absolute;inset:0;
  background:radial-gradient(circle at top right, color-mix(in srgb, var(--cat-color) 18%, transparent), transparent 60%);
  opacity:0;
  transition:opacity .3s;
  pointer-events:none;
}
.cat-card:hover {
  border-color:color-mix(in srgb, var(--cat-color) 50%, var(--border));
  transform:translateY(-2px);
}
.cat-card:hover::before { opacity:1; }
.cat-card-icon {
  width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;
  border-radius:10px;
  background:color-mix(in srgb, var(--cat-color) 12%, transparent);
  color:var(--cat-color);
  margin-bottom:14px;
}
.cat-card-icon svg { width:22px;height:22px; }
.cat-card-title {
  font-size:1rem;font-weight:600;color:#fff;
  margin:0 0 6px;
}
.cat-card-desc {
  font-size:.83rem;color:var(--text-muted);
  line-height:1.55;margin:0 0 16px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.cat-card-foot {
  margin-top:auto;
  display:flex;align-items:center;justify-content:space-between;
}
.cat-card-arrow {
  color:var(--cat-color);
  font-size:1.05rem;
  opacity:0;transform:translateX(-4px);
  transition:opacity .25s, transform .25s;
}
.cat-card:hover .cat-card-arrow { opacity:1;transform:translateX(0); }

.faq-list             { display:flex;flex-direction:column;gap:10px; }
.faq-item             { background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color .2s; }
.faq-item[open]       { border-color:rgba(123,150,255,0.3); }
.faq-item summary     { list-style:none;cursor:pointer;padding:16px 20px;font-size:.95rem;font-weight:500;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:12px; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:'+';font-size:1.4rem;color:var(--text-muted);transition:transform .2s;line-height:1;flex-shrink:0; }
.faq-item[open] summary::after { transform:rotate(45deg); }
.faq-item summary:hover { background:rgba(255,255,255,0.02); }
.faq-answer           { padding:0 20px 18px;color:var(--text-muted);font-size:.92rem;line-height:1.7; }
.faq-answer p         { margin-bottom:.8em; }
.faq-answer p:last-child { margin-bottom:0; }

/* ── Modal de legendas ── */
.legendas-trigger {
  display:inline-flex;align-items:center;gap:6px;
  background:none;border:none;padding:8px 0;margin-top:4px;
  color:var(--text-muted);font-family:inherit;font-size:.82rem;font-weight:300;
  cursor:pointer;transition:color .2s;
}
.legendas-trigger:hover { color:var(--text); }
.legendas-modal {
  border:none;background:transparent;padding:0;max-width:none;max-height:none;
  width:100%;height:100%;
}
.legendas-modal::backdrop { background:rgba(0,0,0,.8); }
.legendas-modal-inner {
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(360px,90vw);background:var(--surface);
  border:1px solid var(--border);border-radius:12px;overflow:hidden;
}
.legendas-modal-header {
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 16px;border-bottom:1px solid var(--border);
}
.legendas-modal-header h3 { margin:0;font-size:.95rem;font-weight:500;color:#fff; }
.legendas-modal-close {
  background:none;border:none;color:var(--text-muted);
  font-size:1.4rem;line-height:1;cursor:pointer;padding:0 4px;
}
.legendas-modal-close:hover { color:#fff; }
.legendas-modal-video { aspect-ratio:9/16;width:100%;background:#000; }
.legendas-modal-video iframe { width:100%;height:100%;border:0;display:block; }
