/* =========================================================
   TACKYCHAN — CABECERA GLOBAL DE SUPERFICIE
   Una sola geometría para todas las páginas públicas normales.
   Navegación y búsqueda viven en sus módulos propios.
   La paleta viene del entorno compartido.
   ========================================================= */

.tc-surface-header{
  position:sticky;
  top:0;
  z-index:60;
  width:100%;
  background:var(--tc-surface-header-bg,rgba(244,250,255,.87));
  backdrop-filter:blur(15px) saturate(1.08);
  -webkit-backdrop-filter:blur(15px) saturate(1.08);
  border-bottom:1px solid var(--tc-surface-header-line,rgba(105,164,201,.17));
  box-shadow:0 4px 18px rgba(55,102,139,.05);
}

.tc-surface-header-inner{
  width:min(1180px,calc(100% - 34px));
  min-height:52px;
  margin-inline:auto;
  display:flex;
  align-items:center;
  gap:24px;
}

.tc-surface-brand{
  display:flex;
  align-items:center;
  gap:9px;
  flex:0 0 auto;
  font-weight:900;
  letter-spacing:.35px;
  text-decoration:none;
}

.tc-surface-search{
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:#244a64;
  font:inherit;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  padding:9px 4px;
}

.tc-surface-search:focus-visible,
.tc-surface-brand:focus-visible{
  outline:2px solid rgba(53,199,244,.65);
  outline-offset:4px;
  border-radius:8px;
}

@media(max-width:950px){
  .tc-surface-header-inner{gap:10px}
  .tc-surface-search{margin-left:auto}
}

@media(max-width:650px){
  .tc-surface-header-inner{
    width:min(1180px,calc(100% - 22px));
    min-height:58px;
    gap:8px;
  }
  .tc-surface-brand{gap:8px;font-size:17px}
  .tc-surface-search{font-size:21px}
}