/* =========================================================
       HERO / ENTÊTE COCKPIT
       ========================================================= */
    .hero{
      position:relative;
      overflow:hidden;
      background:
        radial-gradient(circle at top right, rgba(20,184,166,.20), transparent 30%),
        radial-gradient(circle at bottom left, rgba(59,130,246,.18), transparent 30%),
        linear-gradient(135deg, #FFFFFF 0%, #F1F5F9 100%);
      box-shadow:var(--shadow-strong);
    }

    .hero::after{
      content:"";
      position:absolute;
      inset:auto -80px -80px auto;
      width:220px;
      height:220px;
      background:radial-gradient(circle, rgba(20,184,166,.16), transparent 65%);
      pointer-events:none;
    }

    .hero-top{
      display:flex;
      justify-content:space-between;
      gap:20px;
      align-items:flex-start;
      flex-wrap:wrap;
      margin-bottom:18px;
    }

    .hero-left{
      display:flex;
      gap:16px;
      align-items:flex-start;
      flex:1;
      min-width:320px;
    }

    .logo-box{
      width:72px;
      height:72px;
      border-radius:22px;
      background:
        linear-gradient(135deg, rgba(20,184,166,.14), rgba(59,130,246,.14));
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:30px;
      box-shadow:0 10px 24px rgba(15,23,42,.08);
      border:1px solid rgba(15,23,42,.06);
      flex-shrink:0;
    }

    .hero-title{
      margin:0 0 10px;
      font-size:clamp(2rem, 4vw, 3rem);
      line-height:1.02;
      letter-spacing:-.03em;
      color:#020617;
    }

    .hero-subtitle{
      margin:0;
      color:#475569;
      font-size:15px;
      line-height:1.65;
      max-width:780px;
    }

    .slug-panel{
      min-width:340px;
      max-width:100%;
      background:#FFFFFF;
      border:1px solid var(--border);
      border-radius:20px;
      padding:16px;
      box-shadow:0 12px 30px rgba(15,23,42,.08);
    }

    .tc-hero-premium{
  position:relative;
  overflow:hidden;
  min-height:320px;
  background:
    radial-gradient(circle at 82% 20%, rgba(20,184,166,.34), transparent 28%),
    radial-gradient(circle at 20% 80%, rgba(59,130,246,.24), transparent 34%),
    linear-gradient(135deg,#020617 0%,#0f172a 48%,#111827 100%);
  color:white;
}

.tc-hero-premium::after{
  content:"";
  position:absolute;
  right:-120px;
  bottom:-120px;
  width:360px;
  height:360px;
  border-radius:999px;
  background:rgba(20,184,166,.16);
  filter:blur(2px);
}

.tc-hero-content{
  position:relative;
  z-index:1;
  max-width:820px;
}

.tc-hero-premium .tc-kicker{
  color:#5eead4;
}

.tc-hero-premium h1{
  color:white;
  max-width:820px;
}

.tc-hero-premium p{
  color:rgba(255,255,255,.72);
}

.tc-hero-command{
  position:relative;
  z-index:1;
  min-width:320px;
  display:grid;
  gap:14px;
}

.tc-health-card{
  padding:22px;
  border-radius:28px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 24px 70px rgba(0,0,0,.22);
  backdrop-filter:blur(18px);
}

.tc-health-card span{
  display:block;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(255,255,255,.65);
  margin-bottom:10px;
}

.tc-health-card strong{
  display:block;
  font-size:58px;
  line-height:.9;
  letter-spacing:-.08em;
  color:#5eead4;
}

.tc-health-card small{
  display:block;
  margin-top:10px;
  color:rgba(255,255,255,.70);
  font-weight:700;
}

.tc-hero-status-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:24px;
}

.tc-hero-status-row div{
  min-width:140px;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
}

.tc-hero-status-row span{
  display:block;
  font-size:28px;
  font-weight:900;
  line-height:1;
  color:white;
}

.tc-hero-status-row small{
  display:block;
  margin-top:6px;
  color:rgba(255,255,255,.65);
  font-weight:700;
}