/* PROONE STEP-10 — stable main category description layout
   The card size is fixed per page so switching category or language never
   changes the vertical position of the content below it. Values cover the
   longest EN/TR phase description at supported mobile widths without
   changing desktop rendering. */
@media (max-width: 700px) {
  body[data-proone-phase-page="construction"] #middle-glass-panel {
    height: 142px;
    min-height: 142px;
  }
  body[data-proone-phase-page="engineering"] #middle-glass-panel {
    height: 162px;
    min-height: 162px;
  }
  body[data-proone-phase-page="leisure"] #middle-glass-panel {
    height: 184px;
    min-height: 184px;
  }
  body[data-proone-phase-page="project-management"] #middle-glass-panel {
    height: 140px;
    min-height: 140px;
  }
  body[data-proone-phase-page="projects"] #middle-glass-panel {
    height: 230px;
    min-height: 230px;
  }
  body[data-proone-phase-page="renewable-energy"] #middle-glass-panel {
    height: 140px;
    min-height: 140px;
  }

  /* Extra-narrow phones need more rows because the text column is narrower. */
  @media (max-width: 388px) {
    body[data-proone-phase-page="construction"] #middle-glass-panel {
      height: 162px;
      min-height: 162px;
    }
  }
  @media (max-width: 359px) {
    body[data-proone-phase-page="engineering"] #middle-glass-panel {
      height: 186px;
      min-height: 186px;
    }
    body[data-proone-phase-page="leisure"] #middle-glass-panel {
      height: 230px;
      min-height: 230px;
    }
    body[data-proone-phase-page="project-management"] #middle-glass-panel {
      height: 164px;
      min-height: 164px;
    }
    body[data-proone-phase-page="projects"] #middle-glass-panel {
      height: 276px;
      min-height: 276px;
    }
    body[data-proone-phase-page="renewable-energy"] #middle-glass-panel {
      height: 164px;
      min-height: 164px;
    }
  }
  @media (min-width: 360px) and (max-width: 379px) {
    body[data-proone-phase-page="projects"] #middle-glass-panel {
      height: 252px;
      min-height: 252px;
    }
  }
}

/* The five desktop detail pills already share the same visual definition.
   Keep the standard explicit for every phase-template page without changing
   colors, spacing, hover animation, or typography. */
body[data-proone-phase-page] .detail-pill {
  height: 48px;
  min-height: 48px;
}