﻿/* ── Plan B Home — Companies / News / Extension / Career ── */

/* Shared section heading */
.plan-b-section-heading__eyebrow {
  margin: 0;
  font-family: var(--font-noto), sans-serif;
  font-size: var(--text-min);
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--accent);
}

.plan-b-section-heading__title {
  margin: 0;
  max-width: 48rem;
  font-family: var(--font-noto), sans-serif;
  font-size: 1.625rem;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.04em;
  color: var(--ink);
  word-break: keep-all;
}

.plan-b-section-heading__title--after-eyebrow {
  margin-top: 1.5rem;
}

@media (min-width: 640px) {
  .plan-b-section-heading__title {
    font-size: 1.75rem;
  }
}

@media (min-width: 768px) {
  .plan-b-section-heading__title {
    font-size: 1.875rem;
  }
}

@media (min-width: 1024px) {
  .plan-b-section-heading__title {
    font-size: 2rem;
  }
}

/* Line reveal initial states */
.line-reveal [data-rule] {
  transform: scaleX(0);
  transform-origin: left center;
}

.line-reveal [data-gline],
.line-reveal [data-cell-content] {
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  .line-reveal [data-rule] {
    transform: none;
  }

  .line-reveal [data-gline],
  .line-reveal [data-cell-content] {
    opacity: 1;
  }
}

/* Editorial outline CTA — Next editorialCtaStyles.ts / EditorialOutlineLink.tsx
 * shell: border border-slate-300（WP は真っ白を避け paper-soft で周囲と同系）
 * link:  px-6 py-4 md:px-7 md:py-[1.125rem] flex justify-between gap-6
 */
.editorial-outline {
  width: 100%;
  border: 1px solid var(--slate-300);
  background: var(--paper-soft);
}

@media (min-width: 768px) {
  .editorial-outline {
    max-width: 24rem; /* md:max-w-sm */
  }
}

.editorial-outline--mt {
  margin-top: 2rem;
}

.editorial-outline__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1rem 1.5rem; /* px-6 py-4 */
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}

@media (min-width: 768px) {
  .editorial-outline__link {
    padding: 1.125rem 1.75rem; /* md:py-[1.125rem] md:px-7 */
  }
}

/* ContactSection inline: gap-3 !justify-start */
.editorial-outline__link--start {
  justify-content: flex-start;
  gap: 0.75rem;
}

.editorial-outline__label {
  font-family: var(--font-noto), sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--ink);
}

@media (min-width: 768px) {
  .editorial-outline__label {
    font-size: 15px;
  }
}

.editorial-outline__arrow {
  flex-shrink: 0;
  font-size: 1.125rem; /* text-lg */
  line-height: 1;
  transition: transform 0.3s ease;
}

.editorial-outline__link:hover .editorial-outline__arrow,
.editorial-outline--compact:hover .editorial-outline__arrow {
  transform: translateX(0.25rem);
}

/* トップ — お知らせ / お問い合わせ / 社会貢献 / Googleマップ（sticky-group-nav-tab 同様の紺ホバー） */
.plan-b-home .editorial-feeds .editorial-outline__link,
.plan-b-home .contact-section__cta .editorial-outline__link,
.plan-b-home .extension-section .editorial-outline__link,
.plan-b-home .access-section .editorial-outline__link {
  transition:
    background-color 0.38s cubic-bezier(0.16, 1, 0.3, 1),
    color 0.35s ease;
}

.plan-b-home .editorial-feeds .editorial-outline__link:hover,
.plan-b-home .editorial-feeds .editorial-outline__link:focus-visible,
.plan-b-home .contact-section__cta .editorial-outline__link:hover,
.plan-b-home .contact-section__cta .editorial-outline__link:focus-visible,
.plan-b-home .extension-section .editorial-outline__link:hover,
.plan-b-home .extension-section .editorial-outline__link:focus-visible,
.plan-b-home .access-section .editorial-outline__link:hover,
.plan-b-home .access-section .editorial-outline__link:focus-visible {
  background: var(--blue-hover);
}

.plan-b-home .editorial-feeds .editorial-outline__link:hover .editorial-outline__label,
.plan-b-home .editorial-feeds .editorial-outline__link:focus-visible .editorial-outline__label,
.plan-b-home .contact-section__cta .editorial-outline__link:hover .editorial-outline__label,
.plan-b-home .contact-section__cta .editorial-outline__link:focus-visible .editorial-outline__label,
.plan-b-home .extension-section .editorial-outline__link:hover .editorial-outline__label,
.plan-b-home .extension-section .editorial-outline__link:focus-visible .editorial-outline__label,
.plan-b-home .access-section .editorial-outline__link:hover .editorial-outline__label,
.plan-b-home .access-section .editorial-outline__link:focus-visible .editorial-outline__label,
.plan-b-home .editorial-feeds .editorial-outline__link:hover .editorial-outline__arrow,
.plan-b-home .editorial-feeds .editorial-outline__link:focus-visible .editorial-outline__arrow,
.plan-b-home .contact-section__cta .editorial-outline__link:hover .editorial-outline__arrow,
.plan-b-home .contact-section__cta .editorial-outline__link:focus-visible .editorial-outline__arrow,
.plan-b-home .extension-section .editorial-outline__link:hover .editorial-outline__arrow,
.plan-b-home .extension-section .editorial-outline__link:focus-visible .editorial-outline__arrow,
.plan-b-home .access-section .editorial-outline__link:hover .editorial-outline__arrow,
.plan-b-home .access-section .editorial-outline__link:focus-visible .editorial-outline__arrow {
  color: #fff;
}

/* Company cards — PlanBCompanyCards.tsx */
.company-cards {
  position: relative;
  border-top: 1px solid var(--slate-300);
  /* Next section bg-white → paper-soft */
  background: var(--paper-soft);
  color: var(--ink);
  padding-top: 4rem;
}

@media (min-width: 768px) {
  .company-cards {
    padding-top: 6rem;
  }
}

.company-cards__inner {
  width: 100%;
  padding-inline: 1.25rem;
}

@media (min-width: 768px) {
  .company-cards__inner {
    padding-inline: 2.5rem;
  }
}

@media (min-width: 1280px) {
  .company-cards__inner {
    padding-inline: 3rem;
  }
}

/* mt-16 md:mt-20 */
.company-cards__grid-wrap {
  margin-top: 4rem;
}

@media (min-width: 768px) {
  .company-cards__grid-wrap {
    margin-top: 5rem;
  }
}

/* relative grid grid-cols-1 gap-8 md:gap-10 lg:grid-cols-3 lg:gap-4 */
.company-cards__grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
}

@media (min-width: 768px) {
  .company-cards__grid {
    gap: 2.5rem;
  }
}

@media (min-width: 1024px) {
  .company-cards__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
  }
}

.company-cards__item {
  display: flex;
  flex-direction: column;
}

/* group mb-4 inline-flex items-center gap-2 self-end ... md:mb-5 */
.company-cards__lead-link {
  display: inline-flex;
  align-self: flex-end;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
  font-family: var(--font-noto), sans-serif;
  font-size: var(--text-min);
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--blue);
  text-decoration: none;
  transition: color 0.3s ease;
}

@media (min-width: 768px) {
  .company-cards__lead-link {
    margin-bottom: 1.25rem;
    font-size: 14px;
  }
}

.company-cards__lead-link:hover,
.group.company-cards__lead-link:hover {
  color: var(--ink);
}

.company-cards__lead-more,
.company-cards__lead-arrow {
  font-size: var(--text-min);
  line-height: 1;
}

.company-cards__lead-arrow {
  transition: transform 0.3s ease;
}

@media (min-width: 768px) {
  .company-cards__lead-more,
  .company-cards__lead-arrow {
    font-size: var(--text-min);
  }
}

.company-cards__lead-link:hover .company-cards__lead-arrow,
.group.company-cards__lead-link:hover .company-cards__lead-arrow {
  transform: translateX(0.125rem);
}

/* group flex h-full flex-col border border-slate-200 bg-white hover:shadow-[inset...] */
.company-card {
  display: flex;
  flex: 1;
  flex-direction: column;
  height: 100%;
  border: 1px solid var(--slate-200);
  /* Next bg-white → paper-soft */
  background: var(--paper-soft);
  color: inherit;
  text-decoration: none;
  transition: box-shadow 0.3s ease;
}

.company-card:hover,
.group.company-card:hover {
  box-shadow: inset 0 0 0 1px rgba(34, 56, 107, 0.28);
}

.company-card:focus-visible {
  outline: 1px solid rgba(34, 56, 107, 0.4);
  outline-offset: -1px;
}

/* flex flex-1 flex-col p-6 md:p-7 */
.company-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 1.5rem;
}

@media (min-width: 768px) {
  .company-card__body {
    padding: 1.75rem;
  }
}

/* flex flex-wrap items-baseline gap-x-2.5 gap-y-0.5 */
.company-card__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.625rem;
  row-gap: 0.125rem;
}

.company-card__short-name {
  margin: 0;
  font-family: var(--font-noto), sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0.02em;
  color: var(--ink);
}

@media (min-width: 768px) {
  .company-card__short-name {
    font-size: 1.375rem;
    line-height: 1.4;
  }
}

.company-card__name-note {
  font-family: var(--font-noto), sans-serif;
  font-size: var(--text-min);
  font-weight: 400;
  line-height: 1.375;
  letter-spacing: 0.05em;
  color: var(--slate-500);
}

@media (min-width: 768px) {
  .company-card__name-note {
    font-size: var(--text-min);
  }
}

/* mt-3 flex-1 text-[14px] ... md:text-[15px] md:leading-[1.8] */
.company-card__description {
  margin: 0.75rem 0 0;
  flex: 1;
  font-family: var(--font-noto), sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: 0.05em;
  color: #334155;
}

@media (min-width: 768px) {
  .company-card__description {
    font-size: 15px;
    line-height: 1.8;
  }
}

.company-card__description-part {
  word-break: normal;
  overflow-wrap: break-word;
}

@media (min-width: 768px) {
  .company-card__description-part {
    word-break: keep-all;
  }
}

/* relative mt-auto aspect-[2/1] sm:aspect-[4/3] overflow-hidden bg-ink */
.company-card__media {
  position: relative;
  margin-top: auto;
  aspect-ratio: 2 / 1;
  overflow: hidden;
  background: var(--ink);
}

@media (min-width: 640px) {
  .company-card__media {
    aspect-ratio: 4 / 3;
  }
}

.company-card__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.7s ease-out;
}

.company-card:hover .company-card__media img,
.group.company-card:hover .company-card__media img {
  transform: scale(1.05);
}

/* h-20 md:h-28 — スマホでは globals.css 相当で非表示 */
.company-cards__spacer {
  height: 5rem;
}

@media (min-width: 768px) {
  .company-cards__spacer {
    height: 7rem;
  }
}

/* globals.css L494–527 — スマホ：セクション間ボーダーなし・余白統一 */
@media (max-width: 1023px) {
  main:has(.plan-b-home) #companies {
    border-top-width: 0;
    padding-top: var(--plan-b-home-section-y, 3.5rem);
    padding-bottom: var(--plan-b-home-section-y, 3.5rem);
  }

  main:has(.plan-b-home) #companies > .company-cards__spacer {
    display: none;
  }
}

/* globals.css L4248 — 大型ディスプレイ横余白 */
@media (min-width: 1800px) and (min-height: 1100px),
  (min-width: 1800px) and (min-height: 1080px) and (max-height: 1099px) and (min-resolution: 2dppx) {
  [data-plan-b] #companies .company-cards__inner,
  [data-plan-b] #companies > div.w-full {
    padding-inline: clamp(2.5rem, 4.5vw, 5.5rem) !important;
  }
}

@media (min-width: 1800px) and (min-height: 1080px) and (max-height: 1099px) and (min-resolution: 2dppx) {
  [data-plan-b] #companies .company-cards__inner,
  [data-plan-b] #companies > div.w-full {
    padding-inline: clamp(2.25rem, 3.5vw, 4.5rem) !important;
  }
}

/* Editorial feeds — EditorialFeedsSection.tsx */
.editorial-feeds {
  border-top: 1px solid var(--slate-300);
  background: var(--paper-soft);
  color: var(--ink);
  padding: 8rem 1.25rem;
}

@media (min-width: 768px) {
  .editorial-feeds {
    padding: 10rem 2.5rem;
  }
}

@media (min-width: 1280px) {
  .editorial-feeds {
    padding-inline: 3rem;
  }
}

.editorial-feeds__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 3rem;
}

@media (min-width: 768px) {
  .editorial-feeds__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 4rem;
    align-items: stretch;
  }

  .editorial-feeds__aside {
    grid-column: span 4;
    display: flex;
    flex-direction: column;
  }

  .editorial-feeds__list-col {
    grid-column: span 8;
  }
}

@media (min-width: 1024px) {
  .editorial-feeds__grid {
    gap: 5rem;
  }
}

.editorial-feeds__list {
  position: relative;
  margin: 0;
  padding: 0;
  list-style: none;
}

.editorial-feeds__item {
  position: relative;
}

/* editorialListRowCls — group flex items-center justify-between gap-6 py-8 md:py-10 */
.editorial-feeds__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  box-sizing: border-box;
  padding: 2rem 1rem;
  margin-inline: -1rem;
  border-bottom: 1px solid var(--slate-200);
  color: inherit;
  text-decoration: none;
  background-color: transparent;
  background-clip: padding-box;
  transition: color 0.3s ease, background-color 0.25s ease;
}

.editorial-feeds__item:first-child .editorial-feeds__row {
  border-top: 1px solid var(--slate-200);
}

.editorial-feeds__row:hover,
.editorial-feeds__row:focus-visible {
  background-color: rgb(241 245 249);
}

@media (min-width: 768px) {
  .editorial-feeds__row {
    padding: 2.5rem 1rem;
  }
}

.editorial-feeds__content {
  min-width: 0;
  flex: 1;
}

/* flex flex-wrap items-baseline gap-x-4 gap-y-1 */
.editorial-feeds__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 1rem;
  row-gap: 0.25rem;
}

/* font-mono text-[12px] tracking-wide text-slate-400 md:text-[13px] */
.editorial-feeds__date {
  flex-shrink: 0;
  font-family: var(--font-inter), ui-monospace, monospace;
  font-size: var(--text-min);
  letter-spacing: 0.05em;
  color: var(--slate-400);
}

@media (min-width: 768px) {
  .editorial-feeds__date {
    font-size: var(--text-min);
  }
}

/* text-[12px] tracking-wide text-slate-500 */
.editorial-feeds__cat {
  flex-shrink: 0;
  font-size: var(--text-min);
  letter-spacing: 0.05em;
  color: var(--slate-500);
}

/* mt-3 text-[15px] font-light leading-relaxed tracking-wide text-ink md:text-[17px] md:leading-snug */
.editorial-feeds__title {
  margin: 0.75rem 0 0;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.625;
  letter-spacing: 0.05em;
  color: var(--ink);
  transition: color 0.3s ease;
}

@media (min-width: 768px) {
  .editorial-feeds__title {
    font-size: 17px;
    line-height: 1.375;
  }
}

.editorial-feeds__row:hover .editorial-feeds__title,
.group.editorial-feeds__row:hover .editorial-feeds__title {
  color: var(--blue);
}

/* hidden shrink-0 pr-2 text-lg text-ink md:block md:pr-6 + group-hover */
.editorial-feeds__arrow {
  display: none;
  flex-shrink: 0;
  padding-right: 0.5rem;
  font-size: 1.125rem;
  color: var(--ink);
  transition: transform 0.3s ease, color 0.3s ease;
}

@media (min-width: 768px) {
  .editorial-feeds__arrow {
    display: block;
    padding-right: 1.5rem;
  }
}

.editorial-feeds__row:hover .editorial-feeds__arrow,
.group.editorial-feeds__row:hover .editorial-feeds__arrow {
  color: var(--blue);
  transform: translateX(0.25rem);
}

/* globals.css L494–518 — スマホ：セクション間ボーダーなし・余白統一 */
@media (max-width: 1023px) {
  main:has(.plan-b-home) #news {
    border-top-width: 0;
    padding-top: var(--plan-b-home-section-y, 3.5rem);
    padding-bottom: var(--plan-b-home-section-y, 3.5rem);
  }
}

/* globals.css L4247 — 大型ディスプレイ横余白 */
@media (min-width: 1800px) and (min-height: 1100px),
  (min-width: 1800px) and (min-height: 1080px) and (max-height: 1099px) and (min-resolution: 2dppx) {
  [data-plan-b] #news {
    padding-inline: clamp(2.5rem, 4.5vw, 5.5rem) !important;
  }
}

@media (min-width: 1800px) and (min-height: 1080px) and (max-height: 1099px) and (min-resolution: 2dppx) {
  [data-plan-b] #news {
    padding-inline: clamp(2.25rem, 3.5vw, 4.5rem) !important;
  }
}

/* Extension section */
.extension-section {
  position: relative;
  border-top: 1px solid var(--slate-300);
  background: var(--paper-soft);
  color: var(--ink);
}

.extension-section__divider {
  pointer-events: none;
  position: absolute;
  inset-block: 0;
  left: 50%;
  display: none;
  width: 1px;
  transform: translateX(-50%);
  background: var(--slate-300);
}

@media (min-width: 1024px) {
  .extension-section__divider {
    display: block;
  }
}

.extension-section__inner {
  padding: 4rem 1.25rem;
}

@media (min-width: 768px) {
  .extension-section__inner {
    padding: 5rem 2.5rem;
  }
}

@media (min-width: 1280px) {
  .extension-section__inner {
    padding-inline: 3rem;
  }
}

.extension-section__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem 0;
}

@media (min-width: 1024px) {
  .extension-section__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 3rem;
  }

  .extension-section__col--catalog {
    padding-right: 3rem;
  }

  .extension-section__col--csr {
    padding-left: 3rem;
  }
}

.extension-section__grid--csr-only .extension-section__col--csr {
  padding-left: 0;
}

.extension-section--csr-only .extension-section__divider {
  display: none;
}

.extension-section__col--csr-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 3rem 0;
}

.extension-section--csr-only .csr-section__intro .extension-section__lead {
  max-width: 28rem;
}

@media (min-width: 768px) {
  .extension-section__col--csr-split {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 4rem;
    align-items: start;
  }

  .csr-section__intro {
    grid-column: span 4;
    min-width: 0;
  }

  .csr-section__body {
    grid-column: span 8;
    min-width: 0;
  }
}

@media (min-width: 1024px) {
  .extension-section__grid--csr-only {
    grid-template-columns: minmax(0, 1fr);
  }

  .extension-section__col--csr-split {
    gap: 5rem;
  }
}

.extension-section__lead {
  margin: 1.5rem 0 0;
  max-width: 28rem;
  font-family: var(--font-noto), sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.05em;
  color: #334155;
}

@media (min-width: 768px) {
  .extension-section__lead {
    font-size: 16px;
    line-height: 1.9;
  }
}

.extension-section__catalog-block {
  margin-top: 2rem;
  border-top: 1px solid var(--slate-300);
  padding-top: 1rem;
}

@media (min-width: 640px) {
  .extension-section__catalog-block {
    padding-top: 1.25rem;
  }
}

.catalog-product--desktop {
  display: none;
}

@media (min-width: 768px) {
  .catalog-product--mobile {
    display: none;
  }

  .catalog-product--desktop {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: start;
  }
}

.catalog-product__cover-wrap {
  display: flex;
  justify-content: center;
}

.catalog-cover-btn {
  display: block;
  width: 65%;
  max-width: 13.5rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  box-shadow: 0 14px 44px rgba(15, 23, 40, 0.14);
  transition: box-shadow 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}

@media (min-width: 768px) {
  .catalog-cover-btn {
    width: 10.5rem;
    max-width: none;
  }
}

@media (min-width: 1024px) {
  .catalog-cover-btn {
    width: 12rem;
  }
}

.catalog-cover-btn:hover {
  box-shadow: 0 20px 52px rgba(15, 23, 40, 0.2);
}

.catalog-cover-btn img {
  display: block;
  width: 100%;
  aspect-ratio: 626 / 886;
  object-fit: cover;
}

.catalog-product__title {
  margin: 0;
  font-family: var(--font-noto), sans-serif;
  font-size: 1.125rem;
  font-weight: 500;
  color: #0f172a;
}

.catalog-product--mobile .catalog-product__title {
  margin-top: 1rem;
}

.catalog-product__meta {
  margin: 0.5rem 0 0;
  font-family: var(--font-noto), sans-serif;
  font-size: var(--text-sm);
  color: var(--slate-500);
}

.catalog-product__actions {
  display: flex;
  width: 100%;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

.catalog-product__btn {
  display: flex;
  min-width: 0;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  padding: 0.75rem;
  font-family: var(--font-noto), sans-serif;
  font-size: var(--text-sm);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border-radius: 0;
}

@media (min-width: 640px) {
  .catalog-product__btn {
    padding-inline: 1.5rem;
  }
}

.catalog-product__btn--primary {
  border: 1px solid #2563eb;
  background: transparent;
  color: #2563eb;
  transition: background-color 0.3s ease;
}

.catalog-product__btn--primary:hover {
  background: #eff6ff;
}

.catalog-product__btn--secondary {
  border: 1px solid var(--slate-300);
  background: transparent;
  color: var(--slate-600);
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.catalog-product__btn--secondary:hover {
  border-color: var(--slate-400);
  background: #f8fafc;
  color: var(--ink);
}

/* CSR feed */
.csr-feed {
  position: relative;
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
}

/* Next PlanBExtensionSection: <li className="relative"> — 無いと線が ul の上下に重なる */
.csr-feed__item {
  position: relative;
}

.csr-feed__row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  box-sizing: border-box;
  padding: 1.25rem 1rem;
  margin-inline: -1rem;
  border-bottom: 1px solid var(--slate-200);
  color: inherit;
  text-decoration: none;
  background-color: transparent;
  background-clip: padding-box;
  transition: color 0.3s ease, background-color 0.25s ease;
}

.csr-feed__item:first-child .csr-feed__row {
  border-top: 1px solid var(--slate-200);
}

.csr-feed__row:hover,
.csr-feed__row:focus-visible {
  background-color: rgb(241 245 249);
}

@media (min-width: 768px) {
  .csr-feed__row {
    gap: 1.25rem;
    padding: 1.5rem 1rem;
  }
}

.csr-feed__content {
  min-width: 0;
  flex: 1;
}

.csr-feed__year {
  font-family: var(--font-noto), sans-serif;
  font-size: var(--text-min);
  letter-spacing: 0.05em;
  color: var(--slate-400);
}

@media (min-width: 768px) {
  .csr-feed__year {
    font-size: var(--text-min);
  }
}

.csr-feed__title {
  margin: 0.5rem 0 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.05em;
  transition: color 0.3s ease;
}

@media (min-width: 768px) {
  .csr-feed__title {
    font-size: 1.125rem;
  }
}

.csr-feed__row:hover .csr-feed__title {
  color: var(--blue);
}

.csr-feed__thumb {
  flex-shrink: 0;
  width: 8.5rem;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

@media (min-width: 640px) {
  .csr-feed__thumb {
    width: 11rem;
  }
}

@media (min-width: 768px) {
  .csr-feed__thumb {
    width: 13rem;
  }
}

@media (min-width: 1024px) {
  .csr-feed__thumb {
    width: 20rem;
  }
}

.csr-feed__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: grayscale(0.35) brightness(0.9) saturate(0.88);
  transition: filter 900ms cubic-bezier(0.22, 1, 0.36, 1), transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
}

.csr-feed__row:hover .csr-feed__thumb img {
  transform: scale(1.06);
  filter: grayscale(0) brightness(1.1) saturate(1);
}

@media (prefers-reduced-motion: reduce) {
  .csr-feed__thumb img {
    transition: none;
  }

  .csr-feed__row:hover .csr-feed__thumb img {
    transform: none;
  }
}

/* Career section */
.career-section {
  position: relative;
  z-index: 10;
  overflow: hidden;
  border-top: 1px solid var(--slate-300);
  /* Next bg-white → paper-soft */
  background: var(--paper-soft);
  color: var(--ink);
}

.career-section__inner {
  width: 100%;
  padding: 10rem 1.25rem;
}

@media (min-width: 768px) {
  .career-section__inner {
    padding: 14rem 2.5rem;
  }
}

@media (min-width: 1280px) {
  .career-section__inner {
    padding-inline: 3rem;
  }
}

.career-section__heading {
  margin-bottom: 2rem;
  text-align: left;
}

@media (min-width: 768px) {
  .career-section__heading {
    margin-bottom: 2.5rem;
  }
}

.career-section__grid {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .career-section__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 4rem;
  }

  .career-section__copy {
    padding-right: 1.5rem;
  }
}

@media (min-width: 1280px) {
  .career-section__grid {
    gap: 5rem;
  }

  .career-section__copy {
    padding-right: 2.5rem;
  }
}

.career-section__visual {
  display: flex;
  width: 100%;
  justify-content: center;
  margin-top: 0;
}

.career-section__visual img {
  width: 90%;
  max-width: 45.45rem;
  height: auto;
}

.career-section__cta {
  display: flex;
  width: 100%;
  max-width: 36rem;
  justify-content: center;
  margin-top: 1.25rem;
}

@media (min-width: 768px) {
  .career-section__cta {
    margin-top: 1.5rem;
  }
}

.recruit-banner-link {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  max-width: 24rem;
  padding: 1rem 1.5rem;
  background: var(--blue);
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  transition: background-color 0.3s ease;
}

@media (min-width: 768px) {
  .recruit-banner-link {
    padding: 1.125rem 1.75rem;
  }
}

.recruit-banner-link::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--recruit-banner-hover);
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.recruit-banner-link::after {
  content: "";
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--blue) 88%, transparent);
  transition: background-color 0.5s ease;
}

.recruit-banner-link:hover {
  background: var(--blue-hover);
}

.recruit-banner-link:hover::before {
  opacity: 1;
}

.recruit-banner-link:hover::after {
  background: color-mix(in srgb, var(--blue) 72%, transparent);
}

.recruit-banner-link__label,
.recruit-banner-link__arrow {
  position: relative;
  z-index: 1;
  font-family: var(--font-noto), sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

@media (min-width: 768px) {
  .recruit-banner-link__label,
  .recruit-banner-link__arrow {
    font-size: 15px;
  }
}

.recruit-banner-link__arrow {
  flex-shrink: 0;
  font-size: 1.125rem;
  line-height: 1;
  transition: transform 0.3s ease;
}

.recruit-banner-link:hover .recruit-banner-link__arrow {
  transform: translateX(0.25rem);
}

@media (prefers-reduced-motion: reduce) {
  .recruit-banner-link::before {
    display: none;
  }
}

/* Career video (旧マーキー枠) */
.career-section__gallery {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  margin-top: 2rem;
}

@media (min-width: 1024px) {
  .career-section__gallery {
    margin-top: 0;
    min-height: 0;
  }
}

.career-section__video {
  width: 100%;
  max-width: 36rem;
}

.career-section__gallery .recruit-banner-link {
  max-width: none;
}

.career-section__video .recruit-hud-work-video {
  width: 100%;
  max-width: none;
  aspect-ratio: 16 / 9;
}

/* ── Section split（Contact / Access 共通） ── */
.section-split {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 2.5rem;
}

@media (min-width: 1024px) {
  .section-split {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: stretch;
    gap: 2.5rem;
  }
}

@media (min-width: 1280px) {
  .section-split {
    gap: 3.5rem;
  }
}

.section-split__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

@media (min-width: 1024px) {
  .section-split__copy {
    grid-column: span 5;
  }

  .section-split__copy--contact {
    padding-right: 1rem;
  }
}

@media (min-width: 1280px) {
  .section-split__copy {
    grid-column: span 4;
  }

  .section-split__copy--contact {
    padding-right: 2rem;
  }
}

.section-split__media {
  position: relative;
  min-width: 0;
  overflow: hidden;
}

@media (min-width: 1024px) {
  .section-split__media {
    grid-column: span 7;
  }
}

@media (min-width: 1280px) {
  .section-split__media {
    grid-column: span 8;
  }
}

.editorial-prose__line {
  text-wrap: wrap;
  overflow-wrap: break-word;
  word-break: normal;
}

/* スマホ: 編集用改行 span をつなげ、端末幅で自然に折り返す */
@media (max-width: 767px) {
  .editorial-prose__line {
    display: inline;
  }
}

@media (min-width: 768px) {
  .editorial-prose__line {
    display: block;
    text-wrap: pretty;
    word-break: keep-all;
  }
}

.media-bright {
  filter: brightness(1.07) contrast(1.03) saturate(1.1);
}

/* ── Contact section ── */
.contact-section {
  position: relative;
  z-index: 10;
}

@media (min-width: 1024px) {
  .contact-section {
    border-top: 1px solid var(--slate-300);
  }
}

.lg-only-hide {
  display: block;
}

.contact-section__desktop {
  display: none;
  /* Next ContactSection desktop bg-white → paper-soft */
  background: var(--paper-soft);
  color: var(--ink);
}

@media (min-width: 1024px) {
  .lg-only-hide {
    display: none;
  }

  .contact-section__desktop {
    display: block;
  }
}

.contact-immersive {
  background: var(--paper-soft);
}

.contact-immersive__copy-block {
  padding: clamp(3rem, 12vw, 5rem) clamp(1.5rem, 6vw, 2rem)
    clamp(2.5rem, 8vw, 3.5rem);
  background: var(--paper-soft);
  color: var(--ink);
}

.contact-immersive__copy {
  max-width: 28rem;
}

.contact-immersive__lead {
  margin-top: 2.5rem;
}

.contact-immersive__photo {
  position: relative;
  overflow: hidden;
  min-height: clamp(14rem, 38vw, 18rem);
  background: var(--paper-soft);
}

.contact-immersive__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.contact-immersive__media--alpha {
  object-position: top center;
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.06) 2.5%,
    rgba(0, 0, 0, 0.2) 6%,
    rgba(0, 0, 0, 0.42) 11%,
    rgba(0, 0, 0, 0.66) 16%,
    rgba(0, 0, 0, 0.84) 21%,
    rgba(0, 0, 0, 0.95) 26%,
    #000 32%,
    #000 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.06) 2.5%,
    rgba(0, 0, 0, 0.2) 6%,
    rgba(0, 0, 0, 0.42) 11%,
    rgba(0, 0, 0, 0.66) 16%,
    rgba(0, 0, 0, 0.84) 21%,
    rgba(0, 0, 0, 0.95) 26%,
    #000 32%,
    #000 100%
  );
}

.contact-section__inner {
  width: 100%;
  padding: 10rem 1.25rem;
}

@media (min-width: 768px) {
  .contact-section__inner {
    padding: 14rem 2.5rem;
  }
}

@media (min-width: 1280px) {
  .contact-section__inner {
    padding-inline: 3rem;
  }
}

.contact-section__lead {
  margin: 0;
  font-family: var(--font-noto), sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.05em;
  color: #334155;
}

@media (min-width: 768px) {
  .contact-section__lead {
    font-size: 16px;
    line-height: 1.9;
  }
}

.contact-section__lead-wrap {
  margin-top: 2.25rem;
  max-width: 28rem;
}

.contact-section__cta {
  margin-top: 2.5rem;
  width: 100%;
  max-width: 28rem;
  border: 1px solid var(--slate-300);
  background: var(--paper-soft);
}

@media (min-width: 768px) {
  .contact-section__cta {
    margin-top: 3rem;
  }
}

.contact-section__phone {
  padding: 1.25rem 1.5rem 1.25rem; /* py-5 px-6 */
}

@media (min-width: 768px) {
  .contact-section__phone {
    padding: 1.5rem 1.75rem; /* md:py-6 md:px-7 */
  }
}

.contact-section__phone--bordered {
  border-top: 1px solid var(--slate-200);
  margin-top: 0;
}

/* スマホ full layout: ctaBlock(false, true) — 枠あり・内側区切りなし */
.contact-section__cta--mobile .contact-section__phone {
  border-top: 0;
  padding-top: 0;
}

.contact-section__phone-label {
  margin: 0;
  font-family: var(--font-noto), sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: rgba(35, 48, 68, 0.9);
}

@media (min-width: 768px) {
  .contact-section__phone-label {
    font-size: 15px;
  }
}

.contact-section__phone-hours {
  margin: 0.375rem 0 0;
  font-family: var(--font-noto), sans-serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: rgba(35, 48, 68, 0.65);
}

@media (min-width: 768px) {
  .contact-section__phone-hours {
    font-size: 15px;
  }
}

.contact-section__phone-tel {
  display: inline-block;
  margin-top: 1rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--ink);
  text-decoration: none;
  transition: color 0.2s ease;
}

@media (min-width: 768px) {
  .contact-section__phone-tel {
    font-size: 1.25rem;
  }
}

.contact-section__phone-tel:hover {
  color: var(--blue);
}

.section-split__media--contact {
  min-height: 28rem;
}

.contact-hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 58%;
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.22) 7%,
    rgba(0, 0, 0, 0.55) 14%,
    rgba(0, 0, 0, 0.82) 22%,
    #000 34%,
    #000 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.22) 7%,
    rgba(0, 0, 0, 0.55) 14%,
    rgba(0, 0, 0, 0.82) 22%,
    #000 34%,
    #000 100%
  );
}

.contact-hero-atmosphere {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    var(--paper-soft) 0%,
    color-mix(in srgb, var(--paper-soft) 72%, transparent) 10%,
    color-mix(in srgb, var(--paper-soft) 28%, transparent) 22%,
    transparent 42%
  );
}

/* ── Access section（グループ代表拠点） ── */
.access-section {
  position: relative;
  z-index: 10;
  border-top: 1px solid var(--slate-300);
  background: var(--paper-soft);
  color: var(--ink);
}

.access-section__inner {
  width: 100%;
  padding: 8rem 1.25rem;
}

@media (min-width: 768px) {
  .access-section__inner {
    padding: 10rem 2.5rem;
  }
}

@media (min-width: 1280px) {
  .access-section__inner {
    padding-inline: 3rem;
  }
}

.access-section__details {
  display: flex;
  max-width: 28rem;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 1.5rem;
}

@media (min-width: 768px) {
  .access-section__details {
    margin-top: 1.75rem;
  }
}

.access-section__address {
  font-style: normal;
}

.access-section__address-text {
  margin: 0;
  max-width: 28rem;
  font-family: var(--font-noto), sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.05em;
  color: #334155;
}

@media (min-width: 768px) {
  .access-section__address-text {
    font-size: 16px;
    line-height: 1.9;
  }
}

.section-split__media--map {
  min-height: 16rem;
  border: 1px solid var(--slate-200);
  background: var(--paper);
}

@media (min-width: 640px) {
  .section-split__media--map {
    min-height: 18rem;
  }
}

@media (min-width: 1024px) {
  .section-split__media--map {
    min-height: 22rem;
  }
}

@media (min-width: 1280px) {
  .section-split__media--map {
    min-height: 24rem;
  }
}

.access-section__map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* globals.css L494–527 — スマホ：セクション間ボーダーなし・余白統一 */
@media (max-width: 1023px) {
  main:has(.plan-b-home) {
    --plan-b-home-section-y: 3.5rem;
  }

  main:has(.plan-b-home) #extension,
  main:has(.plan-b-home) #recruit,
  main:has(.plan-b-home) #access,
  main:has(.plan-b-home) .contact-immersive + #access {
    border-top-width: 0;
  }

  main:has(.plan-b-home) #extension > div,
  main:has(.plan-b-home) #recruit > div,
  main:has(.plan-b-home) #access > div,
  main:has(.plan-b-home) .contact-immersive__copy-block {
    padding-top: var(--plan-b-home-section-y);
    padding-bottom: var(--plan-b-home-section-y);
  }
}

/* トップ — セクション背景を paper-soft に統一（Next .bg-white マップ込み） */
.plan-b-home .company-cards,
.plan-b-home .editorial-feeds,
.plan-b-home .extension-section,
.plan-b-home .career-section,
.plan-b-home .contact-section__desktop,
.plan-b-home .access-section {
  background: var(--paper-soft);
}
