.home-hero {
  position: relative;
  min-height: 48vh;
  display: flex;
  align-items: flex-start;
  /* un poco por debajo del centro */
  justify-content: center;
  /* centrado horizontal */
}

.home-hero .brand-masthead {
  margin-top: 10vh;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-align: center;
  user-select: none;
  font-size: clamp(4rem, 10vw, 10rem);
  color: var(--ink, #0f172a);
  opacity: 0.24;
  -webkit-text-stroke: 1px rgba(0, 0, 0, 0.08);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

body.dark-mode .home-hero .brand-masthead {
  opacity: 0.3;
  -webkit-text-stroke: 1px rgba(0, 0, 0, 0.35);
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

/* Icono “O” escalable como letra */
.home-hero .brand-masthead .o-logo {
  display: inline-flex;
  width: 1.2em;
  height: 1.2em;
  vertical-align: -0.18em;
  margin-inline: 0.08em;
  color: var(--brand-2);
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.12));
}

.home-hero .brand-masthead .o-logo svg {
  width: 100%;
  height: 100%;
  display: block;
}