/* ==========================================================================
   Logotipo de Cyntia
   El logotipo es un archivo —`assets/img/cyntia_logo.svg`— con el símbolo y la
   palabra ya en trazados, así que aquí no se compone nada: solo se le da tamaño
   y se le alinea. Antes esta hoja aplicaba el manual de marca letra a letra
   (Outfit, CYNT en peso 500, IA en 300, interletraje +0.140em); eso vive ahora
   dentro del SVG.

   Se dimensiona por **alto** y no por `font-size`, que es lo natural cuando el
   logotipo es una imagen: el ancho sale de la proporción del archivo. Los altos
   son los que tenía el logotipo anterior en cada sitio, para que la cabecera no
   cambie de peso.
   ========================================================================== */

.cyntia-logo{
  --logo-h:20px;                 /* lo pisa cada sitio, más abajo */
  display:inline-flex;
  align-items:center;
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
  color:inherit;
}
.cyntia-logo:hover,
.cyntia-logo:focus{color:inherit;text-decoration:none;}

/* El logotipo se apoya en la línea de texto de su contenedor.

   Los tres sitios donde vive —cabecera, panel lateral y pie— son bloques de
   Adina con altura de línea normal, y una imagen en línea se alinea por la base
   de esa línea: el hueco del descendente queda **debajo** del logotipo y lo
   empuja hacia arriba. Medido en la cabecera: caja de 27,6 px para un logotipo
   de 20, con los 7,6 sobrantes todos abajo, o sea 3,8 px descentrado.

   Anular la altura de línea del contenedor colapsa ese hueco y el logotipo queda
   centrado de verdad. No afecta al apellido de producto: `.cyntia-logo` fija su
   propia altura de línea. */
.td-header-logo,
.tdoffcanvas__logo,
.td-footer-logo{line-height:0;}

.cyntia-logo img{
  display:block;
  height:var(--logo-h);
  width:calc(var(--logo-h) * var(--logo-ar, 7.485));
  /* `max-width` no: el logotipo es ancho y encogerlo por el contenedor lo
     dejaría más bajo que el hueco que se le reservó. El alto manda. */
}

/* Apellido de producto: caja alta y baja, peso 400. Sin color, sin píldora.
   Es lo único que sigue siendo texto, así que conserva la tipografía del
   manual. Todavía no lo usa ninguna plantilla; llegará con las fichas. */
.cyntia-logo em{
  font-family:'Outfit',system-ui,-apple-system,sans-serif;
  font-style:normal;
  font-weight:400;
  font-size:var(--logo-h);
  letter-spacing:.005em;
  margin-left:.44em;
}

/* --------------------------------------------------------------------------
   Ajustes de sitio
   -------------------------------------------------------------------------- */

/* En la cabecera, el mismo alto óptico que tenía el logotipo anterior. */
.td-header-logo .cyntia-logo{--logo-h:20px;}

/* En el pie y en el panel lateral va algo menor, como el original. */
.td-footer-logo .cyntia-logo,
.tdoffcanvas__logo .cyntia-logo{--logo-h:18px;}

@media (max-width:575px){
  .td-header-logo .cyntia-logo{--logo-h:16px;}
}