/* Shared Alfred/TODOPODEROSO/Fundador masthead title-logo crop.
   All three approved title PNGs use the same 2732x2048 canvas, so every widget
   consumes this exact sizing component instead of maintaining separate rules. */
#alfred-card .ax-title,
.tp-card .tp-title,
#fd-card .fd-title {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: clamp(88px, 9vw, 116px);
  margin: 8px auto 6px;
  overflow: hidden;
}

#alfred-card .ax-title-logo,
.tp-card .tp-title-logo,
#fd-card .fd-title-logo {
  display: block;
  width: clamp(300px, 72%, 470px);
  height: auto;
  max-width: none;
  margin: 0;
  flex: 0 0 auto;
}

@media (max-width: 760px) {
  /* Mobile keeps the same title artwork and scale language, but crops the
     generous transparent canvas much more tightly to recover screen space. */
  #alfred-card .ax-title,
  .tp-card .tp-title,
  #fd-card .fd-title {
    height: clamp(56px, 15vw, 66px);
    margin: -2px auto -2px;
  }

  #alfred-card .ax-title-logo,
  .tp-card .tp-title-logo,
  #fd-card .fd-title-logo {
    width: min(86%, 390px);
  }
}

@media (max-width: 380px) {
  #alfred-card .ax-title,
  .tp-card .tp-title,
  #fd-card .fd-title {
    height: 56px;
  }

  #alfred-card .ax-title-logo,
  .tp-card .tp-title-logo,
  #fd-card .fd-title-logo {
    width: min(92%, 340px);
  }
}