/* HUBMAT FAMILY — camada institucional comum sem alterar a identidade visual dos projetos */
:root{
  --hubmat-family-ink:#0a2540;
  --hubmat-family-muted:#64748b;
  --hubmat-family-line:#dbe3ee;
  --hubmat-family-bg:#ffffff;
  --hubmat-project-accent:#2563eb;
}
html.hubmat-family-ready,
html.hubmat-family-ready body{max-width:100%;overflow-x:hidden}
html.hubmat-family-ready img,
html.hubmat-family-ready svg,
html.hubmat-family-ready canvas,
html.hubmat-family-ready video,
html.hubmat-family-ready iframe{max-width:100%}
.hubmat-family-bar,
.hubmat-family-bar *{box-sizing:border-box}
.hubmat-family-bar{
  position:relative;
  z-index:2000;
  width:100%;
  background:rgba(255,255,255,.98);
  color:var(--hubmat-family-ink);
  border-bottom:1px solid var(--hubmat-family-line);
  box-shadow:0 5px 18px rgba(15,23,42,.055);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
.hubmat-family-inner{
  width:min(1220px,calc(100% - 28px));
  min-height:54px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.hubmat-family-brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:max-content;
  color:var(--hubmat-family-ink)!important;
  text-decoration:none!important;
}
.hubmat-family-mark{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--hubmat-family-ink);
  color:#fff;
  font-size:15px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.06em;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.15),0 0 0 3px color-mix(in srgb,var(--hubmat-project-accent) 18%,transparent);
}
.hubmat-family-brand-copy{display:grid;line-height:1.05}
.hubmat-family-brand-copy strong{font-size:13px;font-weight:950;letter-spacing:-.025em;color:var(--hubmat-family-ink)}
.hubmat-family-brand-copy small{margin-top:3px;font-size:9px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:var(--hubmat-family-muted)}
.hubmat-family-current{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
  margin-right:auto;
  padding-left:14px;
  border-left:1px solid var(--hubmat-family-line);
  color:var(--hubmat-family-ink);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.hubmat-family-current::before{
  content:"";
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:var(--hubmat-project-accent);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--hubmat-project-accent) 14%,transparent);
}
.hubmat-family-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
  min-width:0;
}
.hubmat-family-nav a{
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 11px;
  border:1px solid transparent;
  border-radius:999px;
  color:#334155!important;
  background:transparent;
  text-decoration:none!important;
  font-size:11px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
.hubmat-family-nav a:hover{background:#f8fafc;border-color:var(--hubmat-family-line);transform:translateY(-1px)}
.hubmat-family-nav a[aria-current="page"]{
  color:#fff!important;
  background:var(--hubmat-project-accent);
  border-color:var(--hubmat-project-accent);
  box-shadow:0 6px 15px color-mix(in srgb,var(--hubmat-project-accent) 20%,transparent);
}
.hubmat-family-brand:focus-visible,
.hubmat-family-nav a:focus-visible{
  outline:3px solid color-mix(in srgb,var(--hubmat-project-accent) 45%,#fff);
  outline-offset:2px;
}
@media(max-width:820px){
  .hubmat-family-inner{
    width:100%;
    min-height:0;
    padding:9px 12px 8px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px 10px;
  }
  .hubmat-family-brand{min-width:0}
  .hubmat-family-brand-copy strong{font-size:12px}
  .hubmat-family-brand-copy small{font-size:8px}
  .hubmat-family-current{
    margin:0;
    padding-left:10px;
    max-width:42vw;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:11px;
  }
  .hubmat-family-nav{
    grid-column:1/-1;
    width:100%;
    justify-content:flex-start;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    padding:1px 0 2px;
  }
  .hubmat-family-nav::-webkit-scrollbar{display:none}
  .hubmat-family-nav a{min-height:38px;padding:9px 13px;font-size:11px}

  /* No celular, os menus próprios continuam visíveis, mas nunca fixos. */
  html.hubmat-family-ready[data-hubmat-project="trilhas"] .topnav,
  html.hubmat-family-ready[data-hubmat-project="trilhas"] .topbar-wrap,
  html.hubmat-family-ready[data-hubmat-project="simulados"] .topbar,
  html.hubmat-family-ready[data-hubmat-project="enem"] .top,
  html.hubmat-family-ready[data-hubmat-project="plus"] .header{
    position:static!important;
    top:auto!important;
  }

  /* Alvos de toque equivalentes nas quatro frentes. */
  html.hubmat-family-ready a,
  html.hubmat-family-ready button,
  html.hubmat-family-ready input,
  html.hubmat-family-ready select,
  html.hubmat-family-ready summary{touch-action:manipulation}
  html.hubmat-family-ready button,
  html.hubmat-family-ready select,
  html.hubmat-family-ready input:not([type="checkbox"]):not([type="radio"]){min-height:44px}
}
@media(max-width:420px){
  .hubmat-family-mark{width:32px;height:32px;flex-basis:32px}
  .hubmat-family-current{max-width:38vw;font-size:10px}
}
@media print{.hubmat-family-bar{display:none!important}}
