/* ============================================================
   tweaks.css (v=1)
   Self-contained, targeted tweaks. Loaded AFTER final-polish.css
   so these rules win on equal specificity.
   Linked only in: index.html (Task 1) and career.html (Task 3).
   ============================================================ */

/* --- Task 1 -------------------------------------------------
   Center the "Бүх үйлчилгээ (9) →" link under the home-page
   services preview grid (index.html). Centering is driven from
   the wrapper so it stays centered at every viewport width. */
body.page-premium .pd-services-more {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 28px;
  text-align: center;
}

body.page-premium .pd-services-more-link {
  display: inline-block;
  margin-inline: auto;
}

/* --- Task 3 -------------------------------------------------
   Tidy the office-photo caption overlay (career.html). Pin the
   caption as a clean full-width strip at the BOTTOM of the image
   with a dark gradient scrim, the gold "МАНАЙ ОФФИС" badge on its
   own line, and the address on the line(s) below — fully
   contained within the image width (no overflow / no overlap). */
body.page-premium .pd-contact-office {
  position: relative;
  overflow: hidden;
}

body.page-premium .pd-contact-office figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  width: 100%;
  margin: 0;
  padding: 34px 20px 16px;
  box-sizing: border-box;
  text-align: left;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.8125rem;
  line-height: 1.55;
  overflow-wrap: break-word;
  word-break: normal;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.92) 0%,
    rgba(0, 0, 0, 0.72) 38%,
    rgba(0, 0, 0, 0.28) 74%,
    transparent 100%
  );
}

/* Badge sits on its OWN line; the address flows on the line below.
   width:fit-content keeps the gold pill sized to its text while
   still forcing the following address text onto a new line. */
body.page-premium .pd-contact-office figcaption .pd-contact-office-tag {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 8px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(240, 200, 0, 0.16);
  border: 1px solid rgba(240, 200, 0, 0.4);
  color: var(--pd-gold, #f0c800);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.2;
  text-transform: uppercase;
}

/* Tablet */
@media (max-width: 900px) {
  body.page-premium .pd-contact-office figcaption {
    padding: 28px 16px 14px;
    font-size: 0.78125rem;
  }
}

/* Mobile */
@media (max-width: 560px) {
  body.page-premium .pd-contact-office figcaption {
    padding: 22px 13px 12px;
    font-size: 0.75rem;
    line-height: 1.5;
  }

  body.page-premium .pd-contact-office figcaption .pd-contact-office-tag {
    margin-bottom: 6px;
    padding: 3px 8px;
    font-size: 0.5625rem;
    letter-spacing: 0.1em;
  }
}