/* 幸せレポートの縦型カード(Figma: report-card/large)
 * SPをベースに、768px以上でPC variantへ切り替える。 */
.guest-report-card-large {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-0);
  justify-content: flex-start;
  box-sizing: border-box;
  width: 100%;
  max-width: 360px;
  overflow: hidden;
  border-radius: var(--radius-4);
  background: var(--guest-color-background-white);
  box-shadow: 0 0 16px rgba(248, 150, 65, 0.2);
  transition: box-shadow 0.3s ease;
  color: var(--guest-color-text-default);
  font-family: var(--guest-font-family);
  text-decoration: none;
}

.guest-report-card-large:hover {
  box-shadow: 0 0 24px rgba(248, 150, 65, 0.6);
}

.guest-report-card-large__visual {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 1.5;
  width: 100%;
  overflow: hidden;
}

.guest-report-card-large__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.guest-report-card-large__title {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  padding: var(--spacing-1) var(--spacing-2);
  backdrop-filter: blur(4px);
  background: #fffdfacc;
  color: var(--guest-color-text-default);
  font-size: var(--guest-font-size-sm);
  font-weight: var(--guest-font-weight-bold);
  line-height: var(--guest-line-height-heading);
  word-break: break-word;
}

.guest-report-card-large__meta {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
  box-sizing: border-box;
  width: 100%;
  padding: var(--spacing-3);
  font-size: var(--guest-font-size-xs);
  line-height: var(--guest-line-height-body);
  white-space: nowrap;
}

.guest-report-card-large__person {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
}

.guest-report-card-large__gender {
  font-weight: var(--guest-font-weight-bold);
}

.guest-report-card-large__gender--male {
  color: #838dde;
}

.guest-report-card-large__gender--female {
  color: #f383b2;
}

.guest-report-card-large__age {
  font-weight: var(--guest-font-weight-regular);
}

.guest-report-card-large__label--pc {
  display: none;
}

.guest-report-card-large__cross {
  position: relative;
  flex: none;
  width: 10px;
  height: 10px;
}

.guest-report-card-large__cross::before {
  position: absolute;
  inset: 0;
  content: "";
  background-color: var(--color-brown-400);
  -webkit-mask: url(/img/guest/icon_cross.svg) no-repeat center / contain;
  mask: url(/img/guest/icon_cross.svg) no-repeat center / contain;
}

@media (min-width: 768px) {
  .guest-report-card-large {
    max-width: 527px;
  }

  .guest-report-card-large__title {
    padding: var(--spacing-3) var(--spacing-4);
    font-size: var(--guest-font-size-base);
  }

  .guest-report-card-large__meta {
    gap: var(--spacing-2);
    padding: var(--spacing-4);
    font-size: var(--guest-font-size-sm);
  }

  .guest-report-card-large__label--pc {
    display: inline;
  }

  .guest-report-card-large__label--sp {
    display: none;
  }
}
