/* ===================================================================
 * greeting.css — 代表メッセージ(block/page/greeting.php)
 *
 * 経営理念: ページヒーローのクリームから地を続け、白い札の小見出し + ピンクの大きな2行を中央に。雲(左上)と鳥(右下)は装飾。
 * 代表メッセージ: 写真 4 : 本文 7 の2列。本文は1行を全角34字前後に抑え、段落の間を広めに取る。署名は本文の幅の右端にそろえる。
 * lg 未満は写真 → 見出し → 本文の縦積み(写真は中央に小さく)。
 * =================================================================== */

/* --- 経営理念 ----------------------------------------------------- */

.greeting-philosophy {
  padding-block: 2.5rem var(--space-4xl);
}

.greeting-philosophy__label {
  padding-block: 2px;
  letter-spacing: 0.1em;
}

.greeting-philosophy__text {
  font-size: 2.125rem;
  line-height: 1.6;
}

.greeting-philosophy__cloud {
  top: 12%;
  left: 6%;
  width: 9vw;
  max-width: 150px;
}

.greeting-philosophy__bird {
  right: 8%;
  bottom: 16%;
  width: 7vw;
  max-width: 120px;
}

/* --- 代表メッセージ ----------------------------------------------- */

.greeting-message {
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: var(--space-4xl);
}

/* 原本は横長(3:2)。人物が横幅の約51%の位置にいるため、そこを中心に 4:5 で切り抜く */
.greeting-message__heading {
  font-size: 1.875rem;
}

.greeting-message__img {
  aspect-ratio: 4 / 5;
  object-position: 51% center;
  border-radius: var(--project-radius-lg);
}

.greeting-message__text {
  max-width: 34em;
}

.greeting-message__text p {
  margin: 0;
}

.greeting-message__text p + p {
  margin-top: 1.4em;
}

.greeting-message__sign {
  max-width: 34em;
  margin-top: 2.5rem;
}

.greeting-message__sign-company {
  font-size: 0.9375rem;
}

.greeting-message__sign-name {
  letter-spacing: 0.08em;
}

@media (max-width: 991.98px) {
  .greeting-message {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
  }

  .greeting-message__photo {
    width: min(100%, 320px);
  }

  .greeting-message__text,
  .greeting-message__sign {
    max-width: none;
  }
}

@media (max-width: 767.98px) {
  .greeting-message__heading { font-size: 1.375rem; }

  .greeting-philosophy {
    padding-block: var(--space-lg) 2.5rem;
  }

  .greeting-philosophy__text {
    font-size: 1.5rem;
  }

  .greeting-philosophy__cloud {
    top: 4%;
    left: 2%;
    width: 64px;
  }

  .greeting-philosophy__bird {
    right: 3%;
    bottom: 4%;
    width: 52px;
  }

  .greeting-message__photo {
    width: min(100%, 240px);
  }
}