/* ==========================================================================
   company.css — 会社概要（/company/）
   ========================================================================== */

.company-head .sec-head__label {
  margin-bottom: var(--space-6);
  color: var(--color-text-strong);
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
}

.company-head .sec-head__label::before {
  width: var(--space-10);
}

.company-head .sec-head__title {
  max-width: var(--measure);
  color: var(--color-text);
  font-size: var(--text-lg);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  text-wrap: balance;
}

.company-philosophy {
  padding-bottom: 0;
}

.company-philosophy__intro {
  max-width: var(--measure);
  margin-bottom: clamp(var(--space-12), 7vw, var(--space-24));
}

.company-philosophy__statement {
  margin-bottom: var(--space-8);
  color: var(--color-text-strong);
  font-size: var(--text-4xl);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  word-break: auto-phrase;
  text-wrap: balance;
}

.company-philosophy__lead {
  font-size: var(--text-lg);
  line-height: var(--lh-body);
}

.company-principles {
  border-top: var(--border-width) solid var(--color-border-strong);
}

.company-principle {
  display: grid;
  grid-template-columns: minmax(7rem, 0.25fr) minmax(0, 1fr);
  gap: var(--space-5);
  padding-block: clamp(var(--space-8), 4vw, var(--space-12));
  border-bottom: var(--border-width) solid var(--color-border-strong);
}

.company-principle:last-child {
  border-bottom: 0;
}

.company-principle__key {
  color: var(--color-text-muted);
  font-size: var(--text-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-wide);
}

.company-principle__title {
  max-width: 26em;
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  text-wrap: balance;
}

/* MISSION の説明（2026-10-15 に原稿が入った） */
.company-principle__body {
  max-width: var(--measure);
  margin-top: var(--space-5);
  font-size: var(--text-base);
  line-height: var(--lh-body);
}

/* VISION の 3 行。1 行ずつ改行する（2026-10-15） */
.company-principle__line {
  display: block;
}

.company-principle__line + .company-principle__line {
  margin-top: var(--space-3);
}

.company-message {
  overflow: clip;
  background-color: var(--color-bg);
}

.company-message__visual {
  --company-photo-progress: 0;
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  background-color: var(--color-bg-inverse);
  opacity: calc(0.3 + var(--company-photo-progress) * 0.7);
  transform: scale(calc(0.7 + var(--company-photo-progress) * 0.3));
  transform-origin: center;
  transition: opacity 80ms linear, transform 80ms linear;
}

.company-message__photo {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  animation-name: company-photo-cycle;
  animation-duration: 10.8s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-play-state: paused;
}

.company-message__photo--primary {
  animation-delay: 0s;
}

/* 3 枚を 3.6s ずつ順に出す（1 → 2 → 3）。負の遅延で周期の位相をずらしている */
.company-message__photo--secondary {
  opacity: 0;
  animation-delay: -7.2s;
}

.company-message__photo--tertiary {
  opacity: 0;
  animation-delay: -3.6s;
}

.company-message__visual.is-photo-cycle-active .company-message__photo {
  animation-play-state: running;
  will-change: opacity;
}

@keyframes company-photo-cycle {
  0%,
  27.778% {
    opacity: 1;
  }

  33.333%,
  94.444% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.company-message__panel {
  position: relative;
  z-index: 1;
  margin-top: -22svh;
  min-height: 100svh;
  padding-block: var(--section-py);
  padding-bottom: clamp(var(--space-32), 14vw, 11rem);
  background-color: transparent;
  background-image: linear-gradient(
    90deg,
    rgb(9 4 89 / 100%) 0%,
    rgb(8 18 112 / 85%) 52%,
    rgb(12 30 132 / 55%) 100%
  );
}

.company-message__panel::before {
  position: absolute;
  inset: 0;
  background: url("../../img/noise.svg") repeat;
  content: "";
  mix-blend-mode: soft-light;
  opacity: 0.42;
  pointer-events: none;
}

.company-message__panel > .container {
  position: relative;
  z-index: 1;
}

.company-message__wordmark {
  position: absolute;
  z-index: 1;
  right: var(--container-gutter);
  bottom: -0.22em;
  margin: 0;
  color: rgb(255 255 255 / 12%);
  font-size: clamp(4rem, 13vw, 12rem);
  font-weight: var(--fw-bold);
  line-height: var(--lh-none);
  letter-spacing: -0.06em;
  white-space: nowrap;
  user-select: none;
  transform: skewX(-9deg);
  transform-origin: 100% 100%;
  pointer-events: none;
}

.company-message .company-head,
.company-message__body {
  max-width: 46rem;
}

.company-message .company-head .sec-head__label,
.company-message .company-head .sec-head__title,
.company-message__body,
.company-message__signature {
  color: var(--color-text-on-inverse);
}

.company-message .company-head .sec-head__title {
  font-weight: var(--fw-bold);
}

.company-message__desktop-break {
  display: none;
}

@media (min-width: 768px) {
  .company-message .company-head,
  .company-message__body {
    transform: translateX(calc(-1 * var(--space-4)));
  }

  .company-message .company-head .sec-head__title {
    font-size: var(--text-2xl);
  }

  .company-message__desktop-break {
    display: inline;
  }
}

.company-message .company-head .sec-head__label::before {
  background-color: var(--color-border-accent);
}

.company-message__body p + p {
  margin-top: var(--space-6);
}

.company-message__signature {
  padding-top: var(--space-6);
  border-top: var(--border-width) solid var(--color-border);
  font-weight: var(--fw-medium);
  text-align: right;
}

.company-profile__list {
  border-top: var(--border-width-thick) solid var(--color-border-accent);
}

@media (min-width: 1000px) {
  .company-profile__layout {
    display: grid;
    grid-template-columns: minmax(0, 20rem) minmax(0, 1fr);
    gap: var(--space-20);
    align-items: start;
  }

  .company-profile__intro .sec-head {
    margin-bottom: 0;
  }

  .company-profile__intro {
    position: sticky;
    top: calc(var(--header-height) + var(--space-8));
  }
}

.company-profile__row {
  display: grid;
  grid-template-columns: minmax(9rem, 0.25fr) minmax(0, 1fr);
  gap: var(--space-8);
  padding-block: var(--space-6);
  border-bottom: var(--border-width) solid var(--color-border);
}

.company-profile__row dt {
  color: var(--color-text-strong);
  font-weight: var(--fw-bold);
}

.company-profile__row dd {
  line-height: var(--lh-body);
}

.company-profile__office + .company-profile__office {
  margin-top: var(--space-6);
}

@media (max-width: 767px) {
  .company-principle,
  .company-profile__row {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .company-principle__title {
    font-size: var(--text-2xl);
  }

  .company-message__photo {
    object-position: 66% center;
  }

  .company-message__panel {
    margin-top: -16svh;
    background-image: linear-gradient(
      90deg,
      rgb(9 4 89 / 92%) 0%,
      rgb(28 22 118 / 84%) 100%
    );
  }
}

@media (prefers-reduced-motion: reduce) {
  .company-message__photo {
    animation: none;
  }

  .company-message__photo--secondary,
  .company-message__photo--tertiary {
    display: none;
  }

  .company-message__visual {
    --company-photo-progress: 1;
    opacity: 1;
    transform: none;
    transition: none;
  }
}
