/* ═══════════════════════════════════════════════════════════════════
   MARCA v7 (Hugo, 08-oct-2026) — celular y tableta
   "Ginecóloga y obstetra · Puebla" pasa del héroe (bajo "Dra. Garza") a la
   barra superior, debajo de la marca, como en el Demo 3 y en V.2 Demo 1.
   En el héroe la línea sigue dentro del <h1> para Google y lectores de
   pantalla, pero ya no se ve; la foto regresa a su altura original.
   El sitio web (escritorio) no cambia.
   ═══════════════════════════════════════════════════════════════════ */
.garza-brand__sub{display:none}

@media (max-width:1024px),(max-aspect-ratio:10/11){
  .garza-topbar .garza-brand{flex-wrap:wrap;max-width:100%}
  .garza-topbar .garza-brand__sub{
    display:block;flex:0 0 100%;margin-top:.42em;
    font-size:clamp(12px,3.3vw,14px);font-weight:500;letter-spacing:0;word-spacing:0;line-height:1.2;
    color:var(--ink-soft);white-space:nowrap}

  .garza-hero{--sub-top:calc(var(--title-fs)*.8 + 12px)}
  .garza-title .garza-role{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
    clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;animation:none}
}

/* ── MARCA v8 (Hugo, 08-oct-2026) — celular y tableta ──────────────────
   Logo genérico a la izquierda del nombre, como en el Demo 3 y V.2 Demo 1:
   cuadro ciruela con el corazón de la marca. El corazón chico junto al
   nombre se oculta en la barra (ya vive dentro del logo).
   El sitio web (escritorio) no cambia: ahí el logo no se muestra. */
.garza-brand__mark{display:none}
.garza-brand__txt{display:contents}

@media (max-width:1024px),(max-aspect-ratio:10/11){
  .garza-topbar .garza-brand{flex-wrap:nowrap;align-items:center;gap:11px}
  .garza-topbar .garza-brand__mark{
    display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border-radius:13px;
    background:radial-gradient(120% 110% at 32% 12%,#7c2459 0%,#3d1230 55%,#2c1024 100%);
    box-shadow:0 8px 16px -8px rgba(64,28,44,.65),inset 0 1px 0 rgba(255,255,255,.14)}
  .garza-topbar .garza-brand .garza-brand__mark svg{width:23px;height:auto;margin:1px 0 0;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}
  .garza-topbar .garza-brand__txt{display:flex;flex-wrap:wrap;align-items:flex-start;min-width:0}
  .garza-topbar .garza-brand__txt>svg{display:none}
  .garza-topbar .garza-brand__sub{margin-top:.34em}
}