/* V58 — collision-safe mobile project title placement.
   The title keeps the V56 viewport overlay, but on portrait mobile it is
   positioned from the actual Open Website button so every project receives
   the same clear, consistent spacing. */

@media (max-width: 767px) and (orientation: portrait) {
  .project-gothic-title-v56 {
    top: var(--project-mobile-title-top-v58, 28%);
    width: calc(100vw - 22px);
    max-width: calc(100vw - 22px);
    padding-inline: 8px;
    font-size: clamp(1rem, 5.15vw, 1.72rem);
    line-height: .94;
    letter-spacing: .018em;
    text-wrap: balance;
  }

  html.v58-title-anchor-ready .project-gothic-title-v56 {
    transition:
      top .28s cubic-bezier(.22, 1, .36, 1),
      opacity .22s ease,
      filter .22s ease;
  }
}

/* Compact phones receive a slightly tighter title without changing the
   button, images, descriptions, technology chips, or install controls. */
@media (max-width: 420px) and (max-height: 700px) and (orientation: portrait) {
  .project-gothic-title-v56 {
    font-size: clamp(.96rem, 4.9vw, 1.52rem);
    line-height: .92;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.v58-title-anchor-ready .project-gothic-title-v56 {
    transition: none !important;
  }
}