/* ==============================================
   news.css – NEWSページ専用スタイル
============================================== */

/* ---- News Page Section ---- */
.npage {
  padding: 160px 0 112px;
  background: #fff;
}

.npage__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 88px;
}

/* ---- Heading ---- */
.npage__heading {
  display: flex;
  align-items: center;
  gap: 24px;
  color: var(--clr-text2, #4b2f74);
  white-space: nowrap;
}

.npage__heading-en {
  font-family: var(--ff-en);
  font-size: 56px;
  font-weight: 500;
  line-height: 1;
}

.npage__heading-ja {
  font-family: var(--ff-ja);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.4;
}

/* ---- News List ---- */
.npage__list {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 1140px;
}

.npage__divider {
  border: none;
  border-top: 1px solid var(--clr-main);
  opacity: 0.2;
  margin: 0;
}

/* ---- News Item ---- */
.npage__item {
  padding: 0;
}

.npage__link {
  display: flex;
  align-items: center;
  gap: 56px;
  padding: 28px 0;
  text-decoration: none;
  transition: opacity 0.25s ease;
}

.npage__link:hover {
  opacity: 0.7;
}

.npage__link:hover .npage__arrow {
  transform: translateX(6px);
}

/* Date */
.npage__date {
  font-family: var(--ff-ja);
  font-size: 18px;
  font-weight: 700;
  color: var(--clr-main);
  letter-spacing: 0.07em;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 100px;
}

/* Body */
.npage__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}

.npage__title {
  font-family: var(--ff-ja);
  font-size: 20px;
  font-weight: 700;
  color: var(--clr-main);
  line-height: 1.4;
}

.npage__excerpt {
  font-family: var(--ff-ja);
  font-size: 16px;
  font-weight: 400;
  color: var(--clr-text);
  line-height: 1.6;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

/* Arrow */
.npage__arrow {
  font-size: 20px;
  color: var(--clr-main);
  flex-shrink: 0;
  transition: transform 0.25s ease;
  line-height: 1;
}

/* ---- Pagination ---- */
.npage__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 120px;
}

.npage__page-btn {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.npage__pages {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 24px;
}

.npage__page-btn {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--clr-main);
  cursor: pointer;
  padding: 4px 8px;
  transition: opacity 0.2s ease, transform 0.2s ease;
  font-family: var(--ff-ja);
}

.npage__page-btn:hover {
  opacity: 0.6;
  transform: translateX(0);
}

.npage__page-prev:hover { transform: translateX(-4px); }
.npage__page-next:hover { transform: translateX(4px); }

.npage__page-num {
  background: none;
  border: none;
  font-family: var(--ff-ja);
  font-size: 32px;
  font-weight: 500;
  color: rgba(64, 55, 70, 0.5);
  cursor: pointer;
  padding: 4px 2px;
  transition: color 0.2s ease;
  line-height: 1;
}

.npage__page-num.is-active {
  color: var(--clr-main);
}

.npage__page-num:hover:not(.is-active) {
  color: var(--clr-text);
}

/* ---- WordPress archive-news.php 用 news-item スタイル ---- */
.news-item {
  display: flex;
  align-items: center;
  gap: 56px;
  padding: 28px 0;
  border-top: none;
  border-bottom: 1px solid rgba(136, 104, 154, 0.2);
  text-decoration: none;
}

.news-item:first-child {
  border-top: none !important;
}


.news-item__date {
  font-family: var(--ff-ja);
  font-size: 18px;
  font-weight: 700;
  color: var(--clr-main);
  letter-spacing: 0.07em;
  white-space: nowrap;
  flex-shrink: 0;
  width: 130px;
}

.news-item__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.news-item__title a {
  font-family: var(--ff-ja);
  font-size: 20px;
  font-weight: 700;
  color: var(--clr-main);
  line-height: 1.4;
  text-decoration: none;
}

.news-item__text {
  font-family: var(--ff-ja);
  font-size: 16px;
  font-weight: 400;
  color: var(--clr-text);
  line-height: 1.6;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.news-item__arrow {
  color: var(--clr-main);
  flex-shrink: 0;
  transition: transform 0.25s ease;
  display: flex;
  align-items: center;
}

.news-item:hover .news-item__arrow {
  transform: translateX(6px);
}

@media (max-width: 430px) {
  .news-item {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 10px;
    padding: 20px 0;
  }
  .news-item__date { grid-column: 1; grid-row: 1; font-size: 14px; min-width: auto; }
  .news-item__body { grid-column: 1; grid-row: 2; }
  .news-item__arrow { grid-column: 2; grid-row: 1 / 3; }
  .news-item__title a { font-size: 16px; }
  .news-item__text { font-size: 13px; }
}

/* ---- WordPress paginate_links() スタイル ---- */
.npage__pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.npage__pagination .page-numbers li {
  display: flex;
  align-items: center;
}

.npage__pagination .page-numbers a,
.npage__pagination .page-numbers span {
  font-family: var(--ff-ja);
  font-size: 20px;
  font-weight: 500;
  color: rgba(64, 55, 70, 0.5);
  text-decoration: none;
  padding: 4px 8px;
  transition: color 0.2s ease;
  line-height: 1;
}

.npage__pagination .page-numbers .current {
  color: var(--clr-main);
}

.npage__pagination .page-numbers a:hover {
  color: var(--clr-text);
}

.npage__pagination .page-numbers .prev,
.npage__pagination .page-numbers .next {
  color: var(--clr-main);
  display: flex;
  align-items: center;
}

/* ---- Current nav link ---- */
.header__nav .is-current {
  color: var(--clr-main);
  font-weight: 600;
}

/* extra delay values for stagger */
[data-delay="150"] { transition-delay: 150ms; }
[data-delay="200"] { transition-delay: 200ms; }
[data-delay="250"] { transition-delay: 250ms; }
[data-delay="350"] { transition-delay: 350ms; }
[data-delay="450"] { transition-delay: 450ms; }


/* ==============================================
   Responsive
============================================== */

/* Tablet (≤960px) */
@media (max-width: 960px) {
  .npage {
    padding: 120px 0 80px;
  }

  .npage__heading-en { font-size: 40px; }
  .npage__heading-ja { font-size: 18px; }

  .npage__link {
    gap: 32px;
  }

  .npage__title { font-size: 18px; }

  .npage__pagination {
    gap: 60px;
  }
}

/* Mobile (≤600px) */
@media (max-width: 430px) {
  .npage {
    padding: 100px 0 64px;
  }

  .npage__inner { gap: 48px; }

  .npage__heading {
    flex-direction: row;
    align-items: baseline;
    gap: 14px;
    white-space: nowrap;
  }
  .npage__heading-en { font-size: 36px; }
  .npage__heading-ja { font-size: 16px; }

  .npage__link {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 2px 10px;
    padding: 20px 0;
  }

  .npage__date {
    grid-column: 1;
    grid-row: 1;
    font-size: 14px;
    min-width: auto;
  }

  .npage__body {
    grid-column: 1;
    grid-row: 2;
    gap: 4px;
  }

  .npage__arrow {
    grid-column: 2;
    grid-row: 1 / 3;
    display: flex;
    align-items: center;
  }

  .npage__title { font-size: 16px; }
  .npage__excerpt { font-size: 13px; -webkit-line-clamp: 3; }

  .npage__pagination {
    gap: 32px;
  }

  .npage__pages { gap: 16px; }
  .npage__page-num { font-size: 16px; }
  .npage__page-btn { font-size: 16px; }
}